/* ============================================================
   FIKA at Scandino — landing page
   No header, no footer nav. One job per section, a CTA in each.
   On mobile every section CTA is hidden and one fixed call
   button carries the page.
   ============================================================ */

:root{
  --terra:#A9522E; --terra-deep:#8E4324; --terra-ink:#A3492A;
  --amber:#E0913F;
  --cream:#F6F0E6; --cream-2:#FBF7EF; --cream-3:#F1E9DB;
  --line:rgba(169,82,46,.18);
  --ink:#4A3227; --ink-soft:#6B5347;
  --on-terra:#FBF4EA; --on-terra-dim:rgba(251,244,234,.76); --on-terra-line:rgba(251,244,234,.24);

  --display:"Quicksand","Century Gothic",system-ui,sans-serif;
  --script:"Poppins","Quicksand",system-ui,sans-serif;
  --mono:"Roboto Mono",ui-monospace,Menlo,monospace;
  --helv:"Helvetica Neue",Helvetica,Arial,"Segoe UI",sans-serif;

  --wrap:1200px; --pad:clamp(20px,5vw,56px); --sec:clamp(56px,7vw,104px);
  --r:16px; --r-lg:24px;
  --cta-h:60px;                     /* height of the fixed mobile CTA */
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; scroll-padding-top:24px; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0; background:var(--cream); color:var(--ink);
  font-family:var(--display); font-weight:500; font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
h1,h2,h3{ text-wrap:balance; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }
.wrap--narrow{ max-width:860px; }
.section{ padding-block:var(--sec); }
.band-cream{ background:var(--cream-3); }
.band-terra{ background:var(--terra); color:var(--on-terra); }

.skip-link{
  position:absolute; left:-9999px; top:12px; z-index:200; background:var(--terra);
  color:var(--on-terra); padding:10px 18px; border-radius:99px;
  font-family:var(--mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase; text-decoration:none;
}
.skip-link:focus{ left:16px; }

/* ---------- section headers ---------- */
.head{ margin-bottom:clamp(30px,4vw,48px); }
.head h2{
  font-weight:400; font-size:clamp(28px,4vw,48px); line-height:1.1;
  letter-spacing:-.015em; color:var(--terra-ink); margin:0;
}
.head--light h2{ color:#fff; }
.head__sub{ margin:14px 0 0; color:var(--on-terra-dim); font-size:clamp(15px,1.6vw,17px); max-width:48ch; }
.kicker{
  font-family:var(--mono); font-size:11px; letter-spacing:.26em; text-transform:uppercase;
  color:var(--terra); margin:0 0 14px;
}
.kicker--light{ color:var(--amber); }

/* ---------- buttons ---------- */
.btn{
  --fg:var(--terra); --bg:transparent; --bd:currentColor;
  display:inline-flex; align-items:center; justify-content:center; gap:.55em;
  font-family:var(--mono); font-size:12.5px; letter-spacing:.14em; text-transform:uppercase;
  text-decoration:none; padding:17px 32px; border-radius:99px; cursor:pointer;
  color:var(--fg); background:var(--bg); border:1.5px solid var(--bd);
  transition:transform .2s, box-shadow .2s, background .2s, color .2s; white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:none; }
.btn:focus-visible{ outline:3px solid var(--amber); outline-offset:3px; }
.btn--wide{ width:100%; }

.btn--solid{ --fg:var(--terra); --bg:var(--cream-2); --bd:var(--cream-2);
  box-shadow:0 0 0 1.5px rgba(169,82,46,.5) inset, 4px 4px 0 -1px rgba(169,82,46,.5); }
.btn--solid:hover{ box-shadow:0 0 0 1.5px rgba(169,82,46,.5) inset, 6px 6px 0 -1px rgba(169,82,46,.6); }
.btn--ghost{ --fg:#fff; --bd:rgba(255,255,255,.8); }
.btn--ghost:hover{ --bg:rgba(255,255,255,.15); }
.btn--solid-terra{ --fg:var(--cream-2); --bg:var(--terra); --bd:var(--terra); box-shadow:3px 3px 0 -1px rgba(142,67,36,.35); }
.btn--solid-terra:hover{ --bg:var(--terra-deep); --bd:var(--terra-deep); }
.btn--cream{ --fg:var(--terra); --bg:var(--cream-2); --bd:var(--cream-2); box-shadow:3px 3px 0 -1px rgba(0,0,0,.18); }

.sec-cta{ margin-top:clamp(32px,4vw,52px); display:flex; justify-content:center; }

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative; display:grid; place-items:center; isolation:isolate;
  padding:clamp(64px,9vw,110px) var(--pad) clamp(56px,8vw,96px);
  overflow:hidden;
}
.hero__media{
  position:absolute; inset:0; z-index:-2; background-color:#8d6a4f;
  background-image:
    radial-gradient(120% 90% at 20% 15%, rgba(255,236,206,.5), transparent 60%),
    radial-gradient(90% 80% at 85% 30%, rgba(126,158,120,.4), transparent 65%),
    linear-gradient(180deg,#a4805f 0%,#7d5c44 55%,#5c4231 100%),
    url("images/hero.jpg");
  background-size:cover; background-position:center;
}
.hero__scrim{
  position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg,rgba(58,36,24,.56) 0%,rgba(58,36,24,.28) 40%,rgba(58,36,24,.62) 100%);
}
.hero__content{ text-align:center; max-width:900px; }

.wordmark{
  font-family:var(--mono); font-size:13px; letter-spacing:.42em; text-transform:uppercase;
  color:#fff; margin:0 0 clamp(22px,3vw,34px);
}
.wordmark span{ letter-spacing:.2em; opacity:.72; font-size:11px; }

.hero__logo{
  display:block; width:clamp(104px,11vw,150px); height:auto;
  margin:0 auto clamp(20px,2.6vw,30px);
  filter:drop-shadow(0 2px 14px rgba(0,0,0,.35));
}

.hero__title{
  font-family:var(--helv);
  font-weight:700; font-size:clamp(40px,8vw,96px); line-height:.98; letter-spacing:-.035em;
  color:#fff; margin:0 0 clamp(18px,2.2vw,26px); text-wrap:balance;
}
.hero__title em{ font-style:normal; font-weight:700; color:var(--amber); }

.hero__sub{
  font-family:var(--helv);
  font-weight:500; font-size:clamp(17px,2.3vw,26px); line-height:1.35; letter-spacing:-.01em;
  color:rgba(255,255,255,.94); margin:0 0 clamp(26px,3.2vw,36px);
}
.hero__sub em{ font-style:normal; font-weight:700; color:var(--amber); }

.hero__points{
  list-style:none; margin:0 auto clamp(28px,3.5vw,40px); padding:0;
  display:inline-grid; gap:9px; text-align:left; max-width:520px;
}
.hero__points li{
  position:relative; padding-left:26px; color:rgba(255,255,255,.94);
  font-size:clamp(15px,1.7vw,18px);
}
.hero__points li::before{
  content:""; position:absolute; left:2px; top:.62em; width:8px; height:8px;
  border-radius:50%; background:var(--amber);
}
.hero__cta{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.hero__note{
  font-family:var(--helv); font-size:clamp(13px,1.5vw,15px); font-weight:500;
  color:rgba(255,255,255,.78); margin:16px 0 0; letter-spacing:.01em;
}
.hero__note--find{ margin-top:6px; color:rgba(255,255,255,.66); }
.hero__note--find a{ color:var(--amber); text-decoration:underline; text-underline-offset:3px; }

/* ---------- star rating ---------- */
.rating{ display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; margin-top:26px; }
.rating--hero{ margin-top:30px; }
.stars{ display:inline-flex; gap:3px; }
.stars svg{ width:19px; height:19px; fill:var(--amber); flex:none; }
.stars svg.half{ fill:rgba(224,145,63,.42); }
.rating__txt{ font-family:var(--mono); font-size:12.5px; letter-spacing:.08em; color:rgba(255,255,255,.9); }
.rating__txt b{ color:#fff; }
.band-cream .rating__txt{ color:var(--ink-soft); }
.band-cream .rating__txt b{ color:var(--terra); }
.head .rating{ justify-content:flex-start; margin-top:18px; }

/* ============================================================
   LOGOS
   ============================================================ */
.logos-sec{ padding-block:clamp(38px,4.5vw,60px); }
.logos-sec .kicker{ text-align:center; margin-bottom:26px; }
.logos{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(9,1fr); gap:8px; align-items:center;
}
.logos li{
  display:grid; place-items:center; min-height:52px; padding:8px 6px; text-align:center;
  font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--terra); opacity:.5; border:1px solid var(--line); border-radius:10px;
  transition:opacity .2s;
}
.logos li:hover{ opacity:.85; }

/* ============================================================
   PORTFOLIO
   ============================================================ */
.portfolio{
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(10px,1.4vw,16px);
  grid-auto-rows:minmax(0,auto);
}
.shot{
  position:relative; margin:0; aspect-ratio:4/3; border-radius:var(--r); overflow:hidden;
  background-color:var(--terra);
  background-image:linear-gradient(150deg,rgba(224,145,63,.5),rgba(169,82,46,.92));
  background-size:cover; background-position:center;
}
.shot--tall{ grid-row:span 2; aspect-ratio:4/8.2; }
.shot--wide{ grid-column:span 2; aspect-ratio:8.2/4; }
.shot figcaption{
  position:absolute; left:14px; bottom:12px;
  font-family:var(--mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase;
  color:#fff; text-shadow:0 1px 10px rgba(50,28,16,.7);
}
.is-ph::before{
  content:attr(data-ph); position:absolute; inset:0; display:grid; place-items:center;
  padding:16px; text-align:center;
  font-family:var(--mono); font-size:9.5px; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(255,255,255,.55);
}

/* ============================================================
   WHY
   ============================================================ */
.whys{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,2vw,24px); }
.whys li{
  border-top:1px solid var(--on-terra-line); padding-top:20px;
  font-size:15.5px; color:var(--on-terra-dim);
}
.whys b{
  display:block; font-family:var(--mono); font-size:11px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--amber); margin-bottom:10px; font-weight:500;
}

/* ============================================================
   VIDEO TESTIMONIALS
   ============================================================ */
.vids{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(12px,1.6vw,20px); }
.vid{
  position:relative; aspect-ratio:1/1; border:1px solid var(--line); border-radius:var(--r);
  background:linear-gradient(155deg,rgba(169,82,46,.14),rgba(169,82,46,.34)); cursor:pointer;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px;
  padding:18px; font:inherit; color:var(--terra-ink); overflow:hidden;
  transition:background .2s, transform .2s;
}
.vid:hover{ transform:translateY(-3px); background:linear-gradient(155deg,rgba(169,82,46,.2),rgba(169,82,46,.42)); }
.vid:focus-visible{ outline:3px solid var(--terra); outline-offset:2px; }
.vid__play{
  width:52px; height:52px; border-radius:50%; background:var(--cream-2);
  display:grid; place-items:center; box-shadow:0 6px 18px -8px rgba(80,40,20,.6);
}
.vid__play::after{
  content:""; border-left:15px solid var(--terra);
  border-top:9px solid transparent; border-bottom:9px solid transparent; margin-left:4px;
}
.vid__who{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; text-align:center;
}
.vid__who small{ display:block; font-size:10px; opacity:.65; letter-spacing:.1em; margin-top:5px; }

/* ============================================================
   WRITTEN TESTIMONIALS
   ============================================================ */
.quotes{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(12px,1.6vw,20px); }
.quotes blockquote{
  margin:0; background:var(--cream-2); border:1px solid var(--line); border-radius:var(--r);
  padding:clamp(20px,2.2vw,28px); display:flex; flex-direction:column; gap:16px;
}
.quotes p{ margin:0; font-size:15.5px; line-height:1.55; color:var(--ink); }
.quotes cite{
  margin-top:auto; font-style:normal; font-family:var(--mono); font-size:11px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--terra);
}
.quotes cite small{ display:block; font-size:10px; opacity:.62; margin-top:5px; letter-spacing:.1em; }

/* ============================================================
   CASE STUDIES
   ============================================================ */
.stories{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2.2vw,28px); }
.story{ background:var(--cream-2); border:1px solid var(--line); border-radius:var(--r-lg); padding:clamp(22px,2.6vw,34px); }
.story__who{
  font-family:var(--mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--terra); margin:0 0 22px;
}
.ba{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.ba__col{ border-radius:var(--r); padding:18px 18px 20px; }
.ba__col--before{ background:rgba(107,83,71,.09); }
.ba__col--after{ background:rgba(169,82,46,.12); }
.ba__k{
  font-family:var(--mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  margin:0 0 12px; color:var(--ink-soft);
}
.ba__col--after .ba__k{ color:var(--terra); }
.ba ul{ margin:0; padding-left:17px; display:grid; gap:8px; }
.ba li{ font-size:14px; line-height:1.5; color:var(--ink); }
.ba__col--before li{ color:var(--ink-soft); }

/* ============================================================
   FAQ
   ============================================================ */
.faq{ display:grid; gap:8px; }
.faq details{ background:var(--cream-2); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.faq summary{
  cursor:pointer; list-style:none; padding:18px 52px 18px 22px; position:relative;
  font-size:16px; font-weight:600; color:var(--terra-ink);
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:""; position:absolute; right:22px; top:50%; width:9px; height:9px;
  border-right:2px solid var(--terra); border-bottom:2px solid var(--terra);
  transform:translateY(-70%) rotate(45deg); transition:transform .2s;
}
.faq details[open] summary::after{ transform:translateY(-30%) rotate(225deg); }
.faq summary:focus-visible{ outline:3px solid var(--amber); outline-offset:-3px; }
.faq p{ margin:0; padding:0 22px 20px; color:var(--ink-soft); font-size:15px; }

/* ============================================================
   QUOTE FORM
   ============================================================ */
.qform{ background:rgba(251,244,234,.1); border:1px solid var(--on-terra-line); border-radius:var(--r-lg); padding:clamp(22px,3vw,38px); }
.row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.field{ margin-bottom:16px; }
.field label{
  display:block; font-family:var(--mono); font-size:10.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--on-terra-dim); margin-bottom:8px;
}
.field input{
  width:100%; font-family:var(--display); font-size:16px; font-weight:500; color:var(--ink);
  background:var(--cream-2); border:1.5px solid transparent; border-radius:12px; padding:14px 15px;
  transition:border-color .2s, box-shadow .2s;
}
.field input::placeholder{ color:rgba(107,83,71,.45); }
.field input:focus{ outline:none; border-color:var(--amber); box-shadow:0 0 0 3px rgba(224,145,63,.28); }
.field input.is-bad{ border-color:#FFB4A0; box-shadow:0 0 0 3px rgba(255,180,160,.25); }
.qform__status{ font-family:var(--mono); font-size:12px; color:var(--on-terra); margin:14px 0 0; min-height:1.2em; }
.qform__or{ margin:14px 0 0; text-align:center; font-size:14px; color:var(--on-terra-dim); }
.qform__or a{ color:#fff; font-weight:700; text-underline-offset:4px; }

/* ============================================================
   CONTACT STRIP
   ============================================================ */
.strip{
  display:flex; flex-wrap:wrap; justify-content:center; gap:8px 26px;
  padding:22px var(--pad); background:var(--terra-deep); color:var(--on-terra-dim);
  font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; text-align:center;
}

/* ============================================================
   MOBILE CTA — hidden on desktop, the only CTA on phones
   ============================================================ */
.mobile-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:100; display:none;
  align-items:center; justify-content:center; gap:10px;
  height:var(--cta-h); padding-bottom:env(safe-area-inset-bottom);
  background:var(--terra); color:var(--cream-2); text-decoration:none;
  font-family:var(--mono); font-size:14px; letter-spacing:.14em; text-transform:uppercase;
  box-shadow:0 -10px 30px -20px rgba(60,30,15,.9);
}
.mobile-cta:active{ background:var(--terra-deep); }

/* ============================================================
   RESPONSIVE — desktop ≥1024 · tablet 700–1023 · phone <700
   ============================================================ */
@media (max-width:1023px){
  .logos{ grid-template-columns:repeat(3,1fr); gap:10px; }
  .whys{ grid-template-columns:1fr 1fr; }
  .vids, .quotes{ grid-template-columns:1fr 1fr; }
  .stories{ grid-template-columns:1fr; }
  .portfolio{ grid-template-columns:1fr 1fr; }
  .shot--tall{ grid-row:auto; aspect-ratio:4/3; }
  .shot--wide{ grid-column:span 2; aspect-ratio:8.2/4; }
}

@media (max-width:699px){
  .logos{ grid-template-columns:repeat(2,1fr); }
  .whys, .vids, .quotes, .portfolio{ grid-template-columns:1fr; }
  .shot--wide{ grid-column:auto; aspect-ratio:4/3; }
  .ba{ grid-template-columns:1fr; }
  .row{ grid-template-columns:1fr; gap:0; }
  .hero__points{ max-width:none; }
  .head .rating{ justify-content:flex-start; }

  /* the brief: one CTA on mobile, fixed at the bottom */
  .mobile-cta{ display:flex; }
  .hero__cta, .sec-cta{ display:none; }
  body{ padding-bottom:var(--cta-h); }
}

/* placeholder video state, until real embeds go in */
.vid.is-soon .vid__play{ display:none; }
.vid.is-soon::after{
  content:"Video coming soon"; position:absolute; inset:0; display:grid; place-items:center;
  background:rgba(169,82,46,.9); color:var(--cream-2);
  font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
}

/* ============================================================
   THANK-YOU PAGE
   ============================================================ */
.ty-body{ background:var(--terra); color:var(--on-terra); padding-bottom:0; }
.ty{ padding:clamp(56px,9vw,110px) 0 clamp(48px,7vw,90px); text-align:center; }

.ty__tick{
  width:64px; height:64px; margin:0 auto 26px; border-radius:50%;
  background:var(--cream-2); color:var(--terra);
  display:grid; place-items:center; font-size:30px; line-height:1;
}
.ty__title{
  font-weight:300; font-size:clamp(32px,5.4vw,60px); line-height:1.05;
  letter-spacing:-.02em; color:#fff; margin:0 0 18px;
}
.ty__sub{
  font-size:clamp(15px,1.7vw,18px); color:var(--on-terra-dim);
  max-width:48ch; margin:0 auto clamp(34px,4vw,48px);
}

.steps{
  list-style:none; counter-reset:s; margin:0 0 clamp(32px,4vw,44px); padding:0;
  display:grid; grid-template-columns:repeat(3,1fr); gap:14px; text-align:left;
}
.steps li{
  counter-increment:s; position:relative;
  border-top:1px solid var(--on-terra-line); padding:20px 0 0 0;
  font-size:15px; color:var(--on-terra-dim);
}
.steps li::before{
  content:counter(s); position:absolute; top:20px; right:0;
  font-family:var(--mono); font-size:11px; color:var(--amber);
}
.steps b{
  display:block; font-family:var(--mono); font-size:11px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--amber); margin-bottom:9px; font-weight:500;
}

.ty__cta{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.btn--outline-cream{ --fg:var(--on-terra); --bd:var(--on-terra-line); }
.btn--outline-cream:hover{ --bg:rgba(251,244,234,.12); --bd:var(--on-terra); }

/* ---------- calendar ---------- */
.cal{ margin-top:clamp(48px,6vw,84px); text-align:left; }
.cal__h{
  font-weight:400; font-size:clamp(22px,2.8vw,32px); color:#fff; margin:0 0 8px;
}
.cal__sub{ color:var(--on-terra-dim); font-size:15px; margin:0 0 24px; }
.cal__frame{
  background:var(--cream-2); border-radius:var(--r-lg); overflow:hidden;
  min-height:320px; display:grid;
}
.cal__frame.is-live{ min-height:660px; }
.cal__frame iframe{ width:100%; min-height:660px; border:0; display:block; }
.cal__empty{
  padding:clamp(28px,4vw,48px); text-align:center; color:var(--ink-soft);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px;
}
.cal__empty p{ margin:0; max-width:46ch; font-size:15px; }
.cal__empty code{
  font-family:var(--mono); font-size:13px; background:rgba(169,82,46,.12);
  color:var(--terra); padding:2px 6px; border-radius:5px;
}

.ty__back{ margin:clamp(40px,5vw,64px) 0 0; }
.ty__back a{
  font-family:var(--mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--on-terra-dim); text-decoration:none;
}
.ty__back a:hover{ color:#fff; }

@media (max-width:699px){
  .steps{ grid-template-columns:1fr; gap:0; }
  .steps li{ padding:18px 0; }
  .ty__cta .btn{ width:100%; }
  .cal__frame.is-live, .cal__frame iframe{ min-height:560px; }
}

/* form success state — shown in place when the form is accepted */
.qform__tick{
  width:54px; height:54px; margin:0 auto 20px; border-radius:50%;
  background:var(--cream-2); color:var(--terra);
  display:grid; place-items:center; font-size:26px; line-height:1;
}
.qform__done{
  font-weight:400; font-size:clamp(22px,3vw,30px); line-height:1.15;
  color:#fff; margin:0 0 12px; text-align:center;
}
.qform__donesub{
  margin:0 0 26px; text-align:center; color:var(--on-terra-dim);
  font-size:15px; max-width:42ch; margin-inline:auto;
}
.qform__success{ display:flex; flex-direction:column; align-items:center; }

/* ============================================================
   A/B VARIANT — hero quote form (v2.html)
   ============================================================ */
.qform--hero{
  max-width:520px; margin:0 auto; text-align:left;
  background:rgba(28,16,10,.42); backdrop-filter:blur(6px);
  border:1px solid rgba(251,244,234,.22); border-radius:var(--r-lg);
  padding:clamp(20px,2.6vw,30px);
}
.qform__lead{
  font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--amber); margin:0 0 18px; text-align:center;
}
.qform--hero .field{ margin-bottom:12px; }
.qform--hero .field label{ color:rgba(255,255,255,.72); }
.qform--hero .row{ gap:12px; }
.qform--hero .qform__or{ color:rgba(255,255,255,.75); }
.qform--hero .qform__or a{ color:#fff; }
.qform--hero .qform__status{ color:#fff; }
.qform--hero .qform__done{ color:#fff; }
.qform--hero .qform__donesub{ color:rgba(255,255,255,.8); }

@media (max-width:699px){
  .qform--hero{ max-width:none; }
  .qform--hero .row{ grid-template-columns:1fr; gap:0; }
}

/* honeypot — off-screen for people, visible to bots */
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }


/* ───────── vertical video sections (9:16 phone footage) ───────── */
.vsplit{
  display:grid; grid-template-columns:1fr minmax(260px,340px);
  gap:clamp(28px,5vw,64px); align-items:center;
}
.vsplit--flip{ grid-template-columns:minmax(260px,340px) 1fr; }
.vsplit__text h2{ margin-top:6px; }
.vsplit__lead{
  color:var(--ink-soft); font-size:clamp(15px,1.8vw,18px); line-height:1.55;
  max-width:46ch; margin:0 0 clamp(20px,2.6vw,28px);
}
.vsplit .sec-cta{ margin:0; justify-content:flex-start; display:flex; }

.vplayer{ margin:0; }
.vplayer__el{
  display:block; width:100%; aspect-ratio:9/16; border-radius:var(--r-lg);
  background:#241812; object-fit:cover;
  box-shadow:0 18px 50px rgba(58,36,24,.22);
}

@media (max-width:760px){
  .vsplit, .vsplit--flip{ grid-template-columns:1fr; gap:24px; }
  .vsplit--flip .vplayer{ order:2; }
  .vplayer{ max-width:320px; margin-inline:auto; }
  .vsplit__text{ text-align:center; }
  .vsplit__lead{ margin-inline:auto; }
  .vsplit .sec-cta{ justify-content:center; }
}
