/* Rob Rasner | brand theme from his logo: red, bronze, warm black, silver */
:root{
  /* pulled from Rob's logo: the red R, its bronze shading, warm black, silver */
  --red:#E93E2E;          /* logo red, accents only */
  --cobalt:#C42F21;       /* deep logo red for large fills (white text passes contrast) */
  --cobalt-deep:#9E2418;
  --bronze:#766230;       /* logo shading */
  --tint:#F0F0F0;         /* logo silver */
  --sun:#C9A45C;          /* brass, lifted from the bronze */
  --sun-hot:#D8B66E;
  --paper:#FFFFFF;
  --white:#FFFFFF;
  --ink:#231F20;          /* logo black */
  --muted:#5E595A;
  --line:#E2E0DF;
  --display:"Bricolage Grotesque","Arial Black",Arial,sans-serif;
  --sans:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
  --r-lg:28px; --r-md:18px; --r-sm:12px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);font-size:1.0625rem;line-height:1.6;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--cobalt)}
:focus-visible{outline:3px solid var(--sun-hot);outline-offset:3px}
h1,h2,h3{margin:0 0 .45em;line-height:1.02}
h1,h2{font-family:var(--display);font-weight:800;letter-spacing:-.025em}
h1{font-size:clamp(2.9rem,6.6vw,5.6rem)}
h2{font-size:clamp(2rem,4vw,3.1rem)}
h3{font-family:var(--display);font-weight:700;font-size:1.3rem;letter-spacing:-.01em;line-height:1.2}
p{margin:0 0 1em}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.narrow{max-width:800px}
.prose p{max-width:66ch}
.skip{position:absolute;left:-999px;top:0;background:var(--sun);color:var(--ink);padding:8px 14px;z-index:200}
.skip:focus{left:10px;top:10px}
.preview-ribbon{background:var(--sun);color:var(--ink);text-align:center;font-size:.85rem;font-weight:700;padding:6px 12px}

/* buttons */
.btns{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-block;font:700 1rem var(--sans);text-decoration:none;padding:.9em 1.6em;border-radius:999px;border:2px solid transparent;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.btn-sm{padding:.6em 1.2em;font-size:.95rem}
.btn-cyan{background:var(--sun);color:var(--ink)}
.btn-cyan:hover{background:var(--sun-hot)}
.btn-ink{background:var(--cobalt);color:#fff}
.btn-ink:hover{background:var(--cobalt-deep)}
.btn-line{border-color:var(--ink);color:var(--ink)}
.btn-line:hover{background:var(--ink);color:#fff}
.btn-line-light{border-color:#fff;color:#fff}
.btn-line-light:hover{background:#fff;color:var(--cobalt)}
.link,.more{font-weight:700;color:var(--cobalt);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.link-light{font-weight:700;color:#fff;text-decoration:underline;text-decoration-color:var(--sun);text-decoration-thickness:2px;text-underline-offset:5px}

/* header: always solid white */
.hdr,.hdr-over{position:sticky;top:0;z-index:50;background:var(--ink);border-bottom:3px solid var(--cobalt)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:74px}
.brand{position:relative;display:block;width:86px;height:74px;color:#fff;text-decoration:none}
.brand-logo{position:absolute;top:0;left:0;height:126px;width:auto;filter:drop-shadow(0 8px 14px rgba(0,0,0,.35))}
.brand span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nav{display:flex;align-items:center;gap:26px}
.nav a{color:#fff;text-decoration:none;font-weight:600;font-size:.98rem}
.nav a:not(.btn):hover,.nav a[aria-current="page"]{color:var(--sun)}
.nav .btn{color:var(--ink)}
.nav-toggle{display:none;background:none;border:2px solid var(--sun);color:var(--sun);font:700 .95rem var(--sans);padding:.45em 1em;border-radius:999px;cursor:pointer}

/* hero: copy left, framed reel right */
.hero{background:radial-gradient(ellipse at 75% 30%,#3A2A24 0%,var(--ink) 60%);color:#fff;display:grid;grid-template-columns:minmax(20px,1fr) minmax(0,560px) minmax(0,600px) minmax(20px,1fr);column-gap:0;align-items:center;padding:72px 0 88px;overflow:hidden;position:relative}
.hero::before{content:"\2665\2009\2660\2009\2666\2009\2663";position:absolute;right:-20px;bottom:-70px;font-size:220px;line-height:1;color:var(--sun);opacity:.09;pointer-events:none;white-space:nowrap}
.hero-in{grid-column:2;grid-row:1;padding:0 40px 0 0;max-width:none;margin:0;position:relative;z-index:1}
.hero-media{grid-column:3;grid-row:1;position:relative;z-index:1;aspect-ratio:16/10;border-radius:var(--r-lg);overflow:hidden;background:#000;box-shadow:0 30px 60px rgba(0,0,0,.5),0 0 0 2px var(--bronze)}
.hero-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
a.hero-media{display:block}
.hero-video{position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:160%;min-height:100%;transform:translate(-50%,-50%) scale(1.02);border:0;pointer-events:none}
.hero h1{color:#fff}
.hero-sub{font-size:1.2rem;color:#E4DEDC;max-width:48ch;margin-bottom:28px}
@media (prefers-reduced-motion:reduce){.hero-video{display:none}html{scroll-behavior:auto}}

/* clients */
.clients{background:var(--white);border-bottom:1px solid var(--line)}
.clients-in{display:flex;align-items:center;gap:16px 40px;flex-wrap:wrap;padding-top:28px;padding-bottom:28px}
.clients-label{margin:0;color:var(--muted);font-size:.95rem}
.clients ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 38px}
.clients li{font-family:var(--display);font-weight:800;font-size:1.5rem;letter-spacing:-.02em;color:var(--ink)}

/* sections */
.sec{padding:100px 0}
.sec-tight{padding-top:0}
.sec-fog{background:var(--tint)}
.sec-ink{background:var(--ink);color:#fff}
.sec-ink p{color:#E4DEDC}
.sec-head{max-width:720px;margin-bottom:44px}
.sec-head p{color:var(--muted);font-size:1.12rem}
.split{display:grid;grid-template-columns:1fr 1.15fr;gap:64px;align-items:center}
.framed img{border-radius:var(--r-lg)}
.framed-tall{max-width:440px;justify-self:center}

/* page head */
.ph{position:relative;background:radial-gradient(ellipse at 80% 20%,#3A2A24 0%,var(--ink) 60%);color:#fff;overflow:hidden}
.ph-in{position:relative;z-index:1;padding-top:100px;padding-bottom:84px}
.ph-has-img .ph-in > *{max-width:52%}
.ph h1{max-width:14ch}
.ph-desc{font-size:1.2rem;color:#E4DEDC;max-width:48ch;margin:0}
.kicker{display:inline-block;background:var(--cobalt);color:#fff;font-weight:700;font-size:.92rem;padding:4px 12px;border-radius:999px;margin-bottom:16px}
.ph-img{position:absolute;right:max(20px,calc((100vw - 1200px)/2 + 20px));top:40px;bottom:40px;width:38%;border-radius:var(--r-lg);overflow:hidden;z-index:1;background:#000;box-shadow:0 0 0 2px var(--bronze)}
.ph-img img{width:100%;height:100%;object-fit:cover}

/* paths */
.paths{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.paths-3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.path{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:var(--white);border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);transition:border-color .15s}
.path:hover{border-color:var(--red)}
.path-img{aspect-ratio:16/9;background:var(--tint);overflow:hidden}
.path-img img{width:100%;height:100%;object-fit:cover}
.path-body{padding:28px 28px 32px}
.path h3{font-size:1.9rem;font-weight:800;letter-spacing:-.025em}
.path p{color:var(--muted)}

/* scale */
.scale{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:end}
.scale-step{background:var(--white);border-radius:var(--r-md);padding:28px}
.scale-step:nth-child(1){min-height:250px}
.scale-step:nth-child(2){min-height:290px}
.scale-step:nth-child(3){min-height:330px;background:var(--cobalt);color:#fff}
.scale-step:nth-child(3) p{color:#E4DEDC}
.scale-step:nth-child(3) .scale-room{background:var(--sun);color:var(--ink)}
.scale-room{display:inline-block;background:var(--tint);color:var(--ink);font-weight:700;font-size:.88rem;padding:3px 12px;border-radius:999px;margin-bottom:14px}
.scale-step h3{font-size:1.5rem}
.scale-step p{color:var(--muted);margin:0}

/* reel */
.reel{display:grid;grid-template-columns:.8fr 1.4fr;gap:56px;align-items:center}
.video{position:relative;aspect-ratio:16/9;background:#000;border-radius:var(--r-lg);overflow:hidden;box-shadow:0 24px 50px rgba(18,18,24,.18)}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* credentials */
.creds{display:grid;grid-template-columns:.75fr 1.25fr;gap:64px;align-items:start}
.creds-photo img{border-radius:var(--r-lg)}
.cred-list{list-style:none;padding:0;margin:0 0 24px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.cred-list li{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:22px}
.cred-list h3{color:var(--cobalt)}
.cred-list p{color:var(--muted);margin:0}

/* uses */
.uses{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.uses li{background:var(--tint);border-radius:var(--r-md);padding:26px}
.sec-fog .uses li{background:var(--white)}
.uses p{color:var(--muted);margin:0}

/* quotes */
.q{margin:0 0 36px}
.q blockquote{margin:0}
.q p{margin:0 0 10px;font-size:1.08rem}
.q figcaption{font-size:.92rem;font-weight:700;color:var(--muted)}
.q-big p{font-family:var(--display);font-weight:700;font-size:clamp(1.7rem,3.2vw,2.5rem);line-height:1.15;letter-spacing:-.02em;color:var(--cobalt)}
.qgrid{columns:3 300px;column-gap:24px}
.qgrid .q{break-inside:avoid;background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:22px;margin-bottom:24px}

/* gallery */
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;align-items:start}

/* cta: sunbeam band */
.cta{background:var(--cobalt);color:#fff;padding:80px 0}
.cta-in{display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}
.cta p{max-width:54ch;margin:0;color:#F6DEDA}
.cta .btn-cyan{background:var(--white);color:var(--cobalt)}
.cta .btn-cyan:hover{background:var(--tint)}

/* contact */
.contact{align-items:start}
.form{display:grid;gap:16px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:32px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form label{display:grid;gap:6px;font-weight:600;font-size:.95rem}
.form input,.form select,.form textarea{font:inherit;padding:12px 14px;border:1.5px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink)}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--cobalt);background:#fff}
.form .btn{justify-self:start}
.form .btn-cyan{background:var(--cobalt);color:#fff}
.form-note{font-size:.9rem;color:var(--muted);margin:0}
.contact-card{background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:36px}
.contact-card a{color:#fff}
.contact-card h3{color:var(--sun);margin-top:1.5em}
.contact-card address{font-style:normal;color:#E4DEDC;margin-bottom:1em}

/* socials */
.socials{display:flex;gap:12px;margin-top:16px}
.socials a{display:inline-flex;color:#fff;padding:8px;border:1px solid rgba(255,255,255,.35);border-radius:50%}
.socials a:hover{background:var(--sun);color:var(--ink);border-color:var(--sun)}

/* footer */
.ftr{background:var(--ink);color:#B8BBC8;padding:64px 0 28px;font-size:.98rem}
.ftr-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:36px}
.ftr-name{font-family:var(--display);font-weight:800;font-size:1.9rem;letter-spacing:-.02em;color:#fff;margin-bottom:6px}
.ftr h2{font-family:var(--sans);font-size:1rem;font-weight:700;color:var(--sun);letter-spacing:0;margin-bottom:12px}
.ftr a{display:block;color:#B8BBC8;text-decoration:none;padding:3px 0}
.ftr a:hover{color:#fff}
.ftr .socials a{display:inline-flex}
.ftr address{font-style:normal;margin-top:10px;line-height:1.5}
.ftr-base{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid rgba(255,255,255,.12);margin-top:44px;padding-top:22px;font-size:.88rem}
.ftr-logo{max-height:48px;width:auto;opacity:.85}

/* responsive */
@media (max-width:980px){
  .hero{grid-template-columns:20px 1fr 20px;row-gap:40px;padding:56px 0 64px}
  .hero-in{grid-column:2;grid-row:1;padding:0}
  .hero-media{grid-column:2;grid-row:2}
  .hero::before{width:360px;height:360px;right:-140px;bottom:-200px}
  .split,.reel,.creds,.paths{grid-template-columns:1fr;gap:40px}
  .creds-photo{max-width:380px}
  .scale{grid-template-columns:1fr;align-items:stretch}
  .scale-step:nth-child(n){min-height:0}
  .ftr-grid{grid-template-columns:1fr 1fr}
  .nav-toggle{display:inline-block}
  .nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--ink);flex-direction:column;align-items:flex-start;gap:0;padding:8px 20px 24px;border-bottom:1px solid var(--line)}
  .nav.open{display:flex}
  .nav a:not(.btn){padding:12px 0}
  .nav .btn{margin-top:12px}
  .hdr-in{position:relative}
  .ph-img{display:none}
  .ph-has-img .ph-in > *{max-width:none}
}
@media (max-width:720px){
  .sec{padding:64px 0}
  .cred-list,.row2{grid-template-columns:1fr}
  .ftr-grid{grid-template-columns:1fr}
  .clients li{font-size:1.3rem}
  .form{padding:22px}
}

/* card-suit accent on big quotes */
.q-big p::before{content:"\2660\2009";color:var(--red);font-size:.7em;vertical-align:.1em}
@media (max-width:720px){.brand{width:66px;height:66px}.brand-logo{height:98px}.hdr-in{min-height:66px}.hero::before{font-size:130px;bottom:-40px}}

/* ===== Booking section + 4-step inquiry form (structure from ericmina.com) ===== */
.book{background:var(--tint);padding:84px 0;border-bottom:1px solid var(--line)}
.book-in{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:start}
.book-copy h2{margin-bottom:.3em}
.book-lede{font-size:1.15rem;color:var(--muted)}
.book-points{list-style:none;padding:0;margin:26px 0;display:grid;gap:14px}
.book-points li{padding-left:28px;position:relative;color:var(--muted)}
.book-points li::before{content:"\2666";position:absolute;left:2px;top:0;color:var(--red)}
.book-points strong{color:var(--ink)}
.book-call{font-weight:600;margin:0}
.book-call a{font-family:var(--display);font-weight:800;font-size:1.8rem;color:var(--ink);text-decoration:none;letter-spacing:-.02em}
.book-card{background:var(--white);border-radius:var(--r-lg);padding:34px;box-shadow:0 24px 50px rgba(35,31,32,.12);border-top:5px solid var(--cobalt)}
.lead fieldset{border:0;padding:0;margin:0;min-width:0}
.lead h3{font-size:1.5rem;margin-bottom:.4em}
.small{font-size:.9rem}
.muted{color:var(--muted)}
.stepper{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:26px}
.stepper span{font-size:.8rem;font-weight:700;color:var(--muted);padding-top:10px;border-top:4px solid var(--line)}
.stepper span.on{color:var(--ink);border-top-color:var(--cobalt)}
.field{display:grid;gap:6px;margin-bottom:16px}
.field label,.legend{font-weight:600;font-size:.92rem}
.lead .row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.lead input:not([type=radio]):not([type=checkbox]),.lead select,.lead textarea{font:inherit;width:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink)}
.lead textarea{min-height:130px;resize:vertical}
.lead input:focus,.lead select:focus,.lead textarea:focus{border-color:var(--cobalt);outline:none;box-shadow:0 0 0 3px rgba(196,47,33,.15)}
.lead .bad{border-color:var(--cobalt)!important;background:#FFF5F4!important}
.chips{display:flex;flex-wrap:wrap;gap:8px;border-radius:var(--r-sm)}
.chips.bad{outline:2px solid var(--cobalt);outline-offset:4px}
.chips label{cursor:pointer}
.chips input{position:absolute;opacity:0;width:1px;height:1px}
.chips span{display:inline-block;padding:9px 16px;border:1.5px solid var(--line);border-radius:999px;font-weight:600;font-size:.92rem;background:var(--white);transition:background .12s,border-color .12s,color .12s}
.chips label:hover span{border-color:var(--ink)}
.chips input:checked + span{background:var(--ink);border-color:var(--ink);color:#fff}
.chips input:focus-visible + span{outline:3px solid var(--sun-hot);outline-offset:2px}
.form-err{color:var(--cobalt);font-weight:600;min-height:1.2em;margin:4px 0 8px}
.send-err{color:var(--cobalt);font-weight:600;margin-top:12px}
.form-nav{display:flex;align-items:center;gap:12px}
.form-nav #next{margin-left:auto}
.back{background:none;border:0;font:600 1rem var(--sans);color:var(--muted);cursor:pointer;padding:.8em 0}
.back:hover{color:var(--ink)}
.done{text-align:left;padding:10px 0}
.done h3{font-size:1.8rem}
.book-page{padding-top:64px}
@media (max-width:980px){.book-in{grid-template-columns:1fr;gap:36px}}
@media (max-width:600px){.lead .row2{grid-template-columns:1fr;gap:0}.book-card{padding:22px}.stepper span{font-size:.72rem}}