@font-face{font-family:'Poppins';font-style:normal;font-weight:300;font-display:swap;src:url(/assets/poppins-300.woff2) format('woff2');}
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/poppins-400.woff2) format('woff2');}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/poppins-500.woff2) format('woff2');}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/poppins-600.woff2) format('woff2');}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/poppins-700.woff2) format('woff2');}
  :root{
    color-scheme:light;
    --paper:#ffffff; --wash:#f4f6f4; --ink:#152019; --soft:#5c6a61; --muted:#647069; --line:#e9edea;
    --green:#12503a; --green-hi:#186a4c; --green-deep:#0a2b20; --star:#e2a53a; --acc-soft:#e7efe9;
    --sans:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,Roboto,Helvetica,Arial,sans-serif;
    --helv:"Helvetica Neue",Helvetica,Arial,sans-serif; --pad:clamp(22px,6vw,84px); --cw:1240px;
    --lineup:url("/assets/lineup.jpg"); --night:url("/assets/night.jpg"); --who:url("/assets/who.webp");
    --gm1:url("/assets/fleet-green.jpg"); --gm2:url("/assets/fleet-miami.jpg"); --gm3:url("/assets/fleet-tesla.jpg"); --gm4:url("/assets/fleet-lineup.jpg");
    --svc1:url("/assets/service-open.jpg"); --svc2:url("/assets/service-auction.jpg"); --svc3:url("/assets/service-private.jpg"); --svc4:url("/assets/service-salvage.jpg");
  }
  *{ box-sizing:border-box; margin:0; }
  html{ scroll-padding-top:72px; }   /* clear the fixed header when jumping to a section */
  .page{ background:var(--paper); color:var(--ink); font-family:var(--sans); -webkit-font-smoothing:antialiased; }
  .wrap{ width:100%; max-width:none; margin:0; padding:0 var(--pad); }
  /* nav */
  .nav{ display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; padding:9px 0; width:100%; max-width:var(--cw); margin:0 auto; }
  .brand{ grid-column:1; justify-self:start; display:flex; align-items:center; gap:10px; }
  .brand-logo{ display:block; height:48px; width:auto; }
  .navc{ grid-column:2; justify-self:center; display:flex; gap:30px; font-size:.92rem; }
  .navc a{ color:var(--ink); text-decoration:none; opacity:.82; }
  .navc a:hover{ opacity:1; }
  .navr{ grid-column:3; justify-self:end; display:flex; align-items:center; gap:18px; font-size:.92rem; }
  .navr a{ color:var(--ink); text-decoration:none; opacity:.82; }
  .navr a.cta{ color:#fff; opacity:1; }
  /* hamburger + full-screen mobile menu (declutters the phone header) */
  .nav-toggle{ display:none; }
  .mobile-menu{ display:none; }
  /* frozen header */
  .site-header{ position:fixed; top:0; left:0; right:0; z-index:100; background-color:transparent; transition:background-color .25s ease, box-shadow .25s ease; }
  .site-header.scrolled{ background-color:var(--paper); box-shadow:0 6px 22px rgba(10,43,32,.06); }
  /* The header is see-through at the top of a page because, on a scroll, the
     top of the page was always the pale hero. The quote page starts on the dark
     band instead, where a black wordmark and ink-coloured links are invisible —
     so there it wears its scrolled face from the start. L-43. */
  .site-header.solid{ background-color:var(--paper); box-shadow:0 6px 22px rgba(10,43,32,.06); }
  .brand{ text-decoration:none; }
  .navc a, .navr a{ white-space:nowrap; }
  @media (max-width:1024px){
    .navc, .navr{ display:none; }
    .nav{ display:flex; justify-content:space-between; align-items:center; }
    .nav-toggle{ display:inline-flex; flex-direction:column; justify-content:center; gap:5px; width:46px; height:46px; margin-right:-9px; padding:11px; border:0; background:transparent; cursor:pointer; }
    .nav-toggle span{ display:block; width:100%; height:2.5px; background:var(--ink); border-radius:3px; }
    .mobile-menu{ display:flex; position:fixed; inset:0; z-index:150; flex-direction:column; background:var(--paper); padding:clamp(76px,13vh,108px) clamp(28px,8vw,60px) 38px; opacity:0; visibility:hidden; transform:translateY(-10px); transition:opacity .25s ease, transform .28s ease, visibility .25s; }
    .mobile-menu.open{ opacity:1; visibility:visible; transform:none; }
    .mm-close{ position:absolute; top:18px; right:clamp(16px,5vw,32px); width:46px; height:46px; border:0; background:transparent; color:var(--ink); font-size:34px; line-height:1; cursor:pointer; }
    .mm-links{ display:flex; flex-direction:column; }
    .mm-links a{ font-family:var(--sans); font-weight:500; font-size:clamp(1.5rem,7vw,2rem); letter-spacing:-.02em; color:var(--ink); text-decoration:none; padding:15px 0; border-bottom:1px solid var(--line); }
    .mm-links a.mm-login{ color:var(--green); }
    .mm-links a.cta{ align-self:flex-start; margin-top:28px; border-bottom:0; color:#fff; font-size:.95rem; font-weight:600; padding:14px 30px; }
    .mm-call{ margin-top:auto; font-family:var(--helv); color:var(--muted); text-decoration:none; font-size:1.05rem; padding-top:24px; }
  }
  /* button */
  .cta{ display:inline-flex; align-items:center; gap:11px; background:var(--green); color:#fff; text-decoration:none; white-space:nowrap;
        font-weight:600; font-size:.95rem; padding:14px 28px; border-radius:40px; transition:background .15s ease, transform .12s ease; }
  .cta .arr{ display:none; }   /* arrow + circle removed */
  .cta:hover{ background:var(--green-hi); transform:translateY(-1px); }
  .cta .lbl{ display:inline-block; transform:translateY(-0.5px); }
  .cta .arr{ display:none; }   /* thicker arrow to match the semibold label */
  /* hero */
  .topband{ position:relative; overflow:hidden; min-height:100vh; min-height:100dvh; display:flex; flex-direction:column; }
  .topband::before{ content:""; position:absolute; inset:0; background-image:var(--lineup); background-size:cover; background-position:center 34%; opacity:.15; }
  .topband::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, var(--paper) 0%, transparent 26%, transparent 52%, var(--paper) 96%); }
  .topband > .wrap{ position:relative; z-index:2; flex:1; display:flex; flex-direction:column; }
  .hero{ text-align:center; flex:1; padding:clamp(40px,5vh,72px) 0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
  .hero h1{ font-weight:600; letter-spacing:-.02em; line-height:1.05; font-size:clamp(2.6rem,7.2vw,6.4rem); margin:0 auto; white-space:nowrap; }
  @media (max-width:640px){ .hero h1{ white-space:normal; text-wrap:balance; } }   /* wrap only on small phones */
  .hero h1 .sf{ color:var(--soft); font-weight:500; }
  .hero .sub{ font-family:var(--helv); margin:30px auto 0; max-width:58ch; font-size:clamp(1.04rem,1.5vw,1.22rem); line-height:1.3; color:var(--muted); }
  .cta-wrap{ margin-top:42px; display:flex; justify-content:center; }
  /* section scaffolding */
  .sec{ min-height:100vh; min-height:100dvh; padding:clamp(84px,9vh,124px) 0; display:flex; flex-direction:column; justify-content:center; }
  /* A section at the TOP of its own page has the fixed header above it, which
     on the old scroll was only ever above the hero. Two things go wrong without
     this: the ordinary top padding is not enough to clear a 69px header, and a
     section taller than the screen centres itself by overflowing equally at
     both ends — so the heading goes UNDER the header rather than below it,
     which is what Reviews did. The padding fixes the first; "safe" fixes the
     second by behaving as flex-start the moment the content would overflow,
     and falling back to plain centring where it is not understood. L-43. */
  .sec.first{ padding-top:calc(clamp(84px,9vh,124px) + 72px); justify-content:safe center; }
  /* Phones/tablets: left-align the hero (kept big), and drop full-screen sections so there's less empty space between screens */
  @media (max-width:760px){
    .hero{ text-align:left; align-items:flex-start; }
    .hero h1{ margin:0; white-space:normal; font-size:clamp(3rem,13vw,4.9rem); }
    .hero .sub{ margin:22px 0 0; }
    .hero .cta-wrap{ justify-content:flex-start; }
    .sec{ min-height:0; padding:clamp(78px,12vh,128px) 0; }
    /* fleet gallery: fixed row height so images don't collapse without a full-height section
       (.page prefix raises specificity so these beat the desktop fill-rules that appear later in the file) */
    .page #fleet .gallery{ flex:none; grid-auto-rows:150px; }
    /* how-it-works: full-width button block + real spacing (the desktop fill-rules zeroed these) */
    .page #how .sec-head{ margin-bottom:34px; }
    .page #how .steps{ margin-block:0; }
    .page #how .how-cta{ grid-template-columns:1fr; margin-top:40px; }
    .page #how .how-actions{ grid-column:1; }
  }
  .sec.wash{ background:var(--wash); }
  /* responsive: sections size to their content; vertical rhythm comes from .sec padding
     (the earlier fixed heights + negative-margin position tweaks are gone) */
  /* content inset 100px from the top & bottom of every 1024px screen; it fills the space between */
  .sec > .wrap{ display:flex; flex-direction:column; justify-content:flex-start; padding:0 var(--pad); }
  .sec > .wrap > .sec-head{ flex:none; }
  /* sparse sections: fill the screen so their top/bottom gaps also reach the 84px floor */
  #fleet > .wrap, #how > .wrap, #why > .wrap, #services > .wrap{ flex:1; min-height:0; }
  #fleet .gallery{ flex:1; grid-auto-rows:1fr; }
  #why .wstats{ flex:1; grid-auto-rows:minmax(280px,1fr); }
  #services .svcs{ flex:1; grid-auto-rows:minmax(340px,1fr); }
  #whyus .why-split{ align-items:stretch; }   /* right rows set the height; quote fills the left column to match */
  #whyus .why-list{ height:100%; align-content:start; }   /* rows top-aligned so the first row lines up with the kicker on the left */
  #whyus .why-split{ transform:translateY(-50px); }
  #how .sec-head{ margin-bottom:0; }
  #how .steps{ margin-block:auto; }   /* centered vertically between subtitle and buttons; keeps the base horizontal centering */
  #how .how-cta{ margin-top:0; }
  /* subtitle-to-content gap is unified for every section via the base .sec-head margin-bottom below */
  /* keep these card rows aligned to the same 974px column as the stat cards */
  .sec > .wrap > .svcs,
  .sec > .wrap > .why,
  .sec > .wrap > .revs{ width:100%; max-width:var(--cw); margin-inline:auto; }
  #coverage > .wrap > .mapwrap{ width:100%; max-width:min(var(--cw), 92vh); margin:0 auto; }
  #coverage .usmap{ display:block; width:100%; height:auto; }
  .svc, .why-card, .rev{ display:flex; flex-direction:column; justify-content:center; }
  .sec-head{ text-align:center; max-width:64ch; margin:0 auto clamp(40px,5vh,56px); }   /* same subtitle-to-content gap in every section */
  .kicker{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--green); font-weight:600; }
  h2{ font-weight:600; letter-spacing:-.03em; line-height:1.08; font-size:clamp(1.9rem,4vw,3rem); margin-top:14px; text-wrap:balance; }
  h2 .sf{ color:var(--soft); font-weight:500; }
  /* A section that is its own page carries that page's h1 (FINDINGS.md L-43).
     Same type as the h2 it replaces — only the tag changes, so nothing moves,
     and a reader landing on /services gets a heading outline that starts at 1
     instead of one that starts at 2. */
  h1.as-h2{ font-weight:600; letter-spacing:-.03em; line-height:1.08; font-size:clamp(1.9rem,4vw,3rem); margin-top:14px; text-wrap:balance; }
  h1.as-h2 .sf{ color:var(--soft); font-weight:500; }
  .sec-head .sub{ font-family:var(--helv); margin-top:16px; color:var(--muted); font-size:1.1rem; line-height:1.3; }
  /* steps */
  .steps{ display:grid; grid-template-columns:repeat(3,1fr); --g:clamp(24px,3vw,44px); gap:var(--g); width:100%; max-width:var(--cw); margin-inline:auto; flex:none; }
  .how-cta{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(24px,3vw,44px); width:100%; max-width:var(--cw); margin-inline:auto; margin-top:100px; }
  .how-actions{ grid-column:2; display:flex; flex-direction:column; gap:12px; }
  .how-actions .cta{ width:100%; justify-content:center; }
  .cta.ghost{ background:transparent; color:var(--green); border:1.5px solid var(--line); }
  .cta.ghost:hover{ background:var(--wash); border-color:var(--green); }
  /* the primary button "fills" with the active green as the steps finish revealing */
  .how-actions .cta:not(.ghost){ position:relative; overflow:hidden; }
  @media (prefers-reduced-motion:no-preference){
    .how-actions .cta:not(.ghost){ background:var(--green-deep); }
    .how-actions .cta:not(.ghost)::before{ content:""; position:absolute; inset:0; background:var(--green); transform:scaleX(0); transform-origin:left; transition:transform 1.9s cubic-bezier(.4,0,.2,1) .15s; z-index:0; }
    .how-actions .cta:not(.ghost).fill::before{ transform:scaleX(1); }
    .how-actions .cta:not(.ghost):hover::before{ background:var(--green-hi); }
    .how-actions .cta:not(.ghost) .lbl,
    .how-actions .cta:not(.ghost) .arr{ position:relative; z-index:1; }
  }
  @media (max-width:820px){ .steps{ grid-template-columns:1fr; } }
  .step{ position:relative; display:flex; flex-direction:column; justify-content:flex-start; padding:0 2px 0 24px; }
  .step::before{ content:""; position:absolute; top:0; bottom:0; left:0; width:2px; background:color-mix(in srgb, var(--green) 16%, transparent); }
  /* the steps reveal one by one, each accent line drawing down with its step */
  @media (prefers-reduced-motion:no-preference){
    #how .step{ transition:opacity 1s ease, transform 1s cubic-bezier(.22,.61,.36,1); }
    #how .step::before{ transform:scaleY(0); transform-origin:top center; transition:transform 1.1s cubic-bezier(.2,.7,.2,1); }
    #how .step.seen::before{ transform:scaleY(1); }
    #how .step:nth-child(1){ transition-delay:0s !important; }
    #how .step:nth-child(2){ transition-delay:.55s !important; }
    #how .step:nth-child(3){ transition-delay:1.1s !important; }
    #how .step:nth-child(2).seen::before{ transition-delay:.55s; }
    #how .step:nth-child(3).seen::before{ transition-delay:1.1s; }
  }
  .step .n{ font-weight:700; font-size:clamp(3.2rem,6vw,5rem); line-height:.9; letter-spacing:-.04em; color:var(--green); opacity:.16; }
  .step h3{ font-weight:600; font-size:1.22rem; letter-spacing:-.01em; margin:10px 0 10px; }
  .step p{ font-family:var(--helv); color:var(--muted); font-size:1.05rem; line-height:1.3; }
  /* Who we are — stat tiles */
  .wstats{ display:grid; grid-template-columns:repeat(4, minmax(185px, 1fr)); justify-content:center; gap:18px; grid-auto-rows:clamp(360px,34vw,470px); width:100%; max-width:var(--cw); margin-inline:auto; }
  @media (max-width:1080px){ .wstats{ grid-template-columns:repeat(2, minmax(185px,300px)); } }
  @media (max-width:480px){ .wstats{ grid-template-columns:1fr; } }
  .wstats{ position:relative; }
  .wtile{ position:relative; overflow:hidden; background:var(--paper); border:1px solid var(--line); border-radius:16px; padding:clamp(26px,3vw,36px) clamp(14px,1.4vw,16px) 20px; display:flex; flex-direction:column; justify-content:flex-end; }
  /* mountain sized 500% so its left/right ends sit off-card (no visible edge), softened + blurred */
  .wtile-img{ position:absolute; inset:0; z-index:0; background-image:var(--who); background-repeat:no-repeat; background-size:400% auto; background-position:0% 44%;
    filter:grayscale(1) sepia(1) hue-rotate(96deg) saturate(.85) brightness(1.06) contrast(1.08); opacity:.32;
    -webkit-mask-image:linear-gradient(to top, #000 50%, transparent 92%); mask-image:linear-gradient(to top, #000 50%, transparent 92%); }
  .wtile:nth-child(1) .wtile-img{ background-position:0% 44%; }
  .wtile:nth-child(2) .wtile-img{ background-position:33.33% 44%; }
  .wtile:nth-child(3) .wtile-img{ background-position:66.66% 44%; }
  .wtile:nth-child(4) .wtile-img{ background-position:100% 44%; }
  .wtile::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:42%; z-index:0; background:linear-gradient(to top, var(--paper) 26%, transparent); pointer-events:none; }
  .wtile .wg{ position:relative; z-index:1; }
  .wtile .wnum{ font-weight:700; font-size:clamp(2rem,3.3vw,2.9rem); color:var(--green); letter-spacing:-.03em; line-height:1; white-space:nowrap; }
  .wtile small{ display:block; font-family:var(--helv); color:var(--muted); font-size:.98rem; margin-top:5px; white-space:nowrap; }
  /* fleet gallery */
  .gallery{ display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:170px; gap:14px; }
  .gallery > div{ border-radius:14px; background-size:cover; background-position:center; border:1px solid var(--line); filter:saturate(.85) contrast(1.06) brightness(1.0); }
  .g1{ grid-column:span 4; } .g2{ grid-column:span 2; grid-row:span 2; background-position:center 42%; } .g3{ grid-column:span 2; } .g4{ grid-column:span 2; }
  @media (max-width:820px){ .gallery{ grid-template-columns:1fr 1fr; grid-auto-rows:150px; } .g1,.g3,.g4{ grid-column:span 1; } .g2{ grid-column:span 1; grid-row:span 2; } }
  /* fleet gallery: tiles reveal one by one with a soft zoom-in, and lift on hover */
  @media (prefers-reduced-motion:no-preference){
    #fleet .gallery > div{ transition:opacity .6s ease, transform .7s cubic-bezier(.22,.61,.36,1), box-shadow .4s ease; }
    #fleet .gallery > div.reveal:not(.seen){ transform:scale(.93); }
    #fleet .gallery > div:nth-child(1){ transition-delay:0s !important; }
    #fleet .gallery > div:nth-child(2){ transition-delay:.14s !important; }
    #fleet .gallery > div:nth-child(3){ transition-delay:.28s !important; }
    #fleet .gallery > div:nth-child(4){ transition-delay:.42s !important; }
    #fleet .gallery > div:hover{ transform:scale(1.03); box-shadow:0 16px 40px rgba(10,43,32,.22); z-index:1; }
  }
  /* coverage map */
  .mapwrap{ max-width:var(--cw); margin:0 auto clamp(30px,4vw,46px); }
  .usmap{ width:100%; height:auto; display:block; overflow:visible; }
  .usmap .st{ fill:#e6ece8; stroke:#ffffff; stroke-width:1.1; }
  .usmap .dot{ r:1.5; fill:url(#mapNode); transform-box:fill-box; transform-origin:center; }
  .usmap .mesh{ fill:none; stroke:url(#mapLine); stroke-width:0.9; stroke-linecap:round; opacity:.6; }
  .usmap .traveler{ r:2.1; fill:#eafff6; stroke:var(--green); stroke-width:.7; filter:url(#mapNodeLift); pointer-events:none; }
  .usmap .route{ fill:none; stroke:var(--green); stroke-width:3.4; stroke-dasharray:1 9; stroke-linecap:round; }
  .usmap .snowbird{ fill:none; stroke:var(--green); stroke-width:0.9; stroke-linecap:round; opacity:.9; }
  .usmap .pin .halo{ fill:var(--green); opacity:.16; }
  .usmap .pin .dotp{ fill:var(--green); }
  .usmap .pin text{ font-family:var(--sans); font-size:18px; font-weight:600; fill:var(--ink); letter-spacing:.03em; }
  /* why — statement on the left, the reasons as an icon list on the right */
  .why-split{ display:grid; grid-template-columns:0.92fr 1.08fr; gap:clamp(40px,5vw,72px); align-items:start; width:100%; max-width:var(--cw); margin-inline:auto; }
  .why-intro{ display:flex; flex-direction:column; }
  .why-intro h2{ text-align:left; margin:14px 0 16px; }
  /* customer quote fills the left column under the intro (keeps the rows from being spread out) */
  .why-quote{ margin-top:clamp(28px,3.5vh,44px); flex:1; min-height:170px; background:var(--green); color:#eafff4;
    border-radius:20px; padding:clamp(26px,3vw,34px); display:flex; flex-direction:column; justify-content:center; }
  .why-quote p{ font-family:var(--sans); font-weight:500; font-size:clamp(1.1rem,1.55vw,1.32rem); line-height:1.42; letter-spacing:-.01em; }
  .why-quote span{ font-family:var(--helv); color:#bfe6d5; font-size:.9rem; margin-top:14px; }
  .why-lead{ font-family:var(--helv); color:var(--muted); font-size:1.08rem; line-height:1.3; max-width:38ch; }
  .why-list{ display:grid; gap:clamp(18px,2.2vw,26px); }
  .why-row{ display:flex; gap:16px; align-items:flex-start; }
  .why-row .ico{ flex:none; color:var(--green); margin-top:3px; }
  .why-row .ico svg{ width:30px; height:30px; display:block; }
  .why-row h3{ font-weight:600; font-size:1.2rem; letter-spacing:-.01em; margin-bottom:6px; }
  .why-row p{ font-family:var(--helv); color:var(--muted); font-size:1.05rem; line-height:1.3; }
  @media (max-width:820px){ .why-split{ grid-template-columns:1fr; gap:36px; } }
  /* Why-us: the reasons reveal one by one, each icon popping in with its row */
  @media (prefers-reduced-motion:no-preference){
    #whyus .why-row:nth-child(1){ transition-delay:.05s !important; }
    #whyus .why-row:nth-child(2){ transition-delay:.18s !important; }
    #whyus .why-row:nth-child(3){ transition-delay:.31s !important; }
    #whyus .why-row:nth-child(4){ transition-delay:.44s !important; }
    #whyus .why-row:nth-child(5){ transition-delay:.57s !important; }
    #whyus .why-row .ico{ opacity:0; transform:scale(.4); transition:opacity .3s ease, transform .55s cubic-bezier(.18,1.6,.4,1); transition-delay:inherit; }
    #whyus .why-row.seen .ico{ opacity:1; transform:scale(1); }
  }
  /* services */
  .svcs{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
  /* shorter cards (centered in the section) so the full-bleed photos crop less — less "zoomed" */
  #services .svcs{ flex:1; grid-auto-rows:minmax(340px,1fr); }   /* fills the screen; min 340px keeps card text over the dark gradient */
  @media (max-width:900px){ .svcs{ grid-template-columns:1fr 1fr; } }
  @media (max-width:520px){ .svcs{ grid-template-columns:1fr; } }
  /* full-bleed photo; text block pinned to the bottom, equal height so the titles line up across cards */
  .svc{ position:relative; overflow:hidden; border:1px solid var(--line); border-radius:16px; padding:0; display:flex; flex-direction:column; justify-content:flex-end; }
  .svc-img{ position:absolute; inset:0; z-index:0; background-size:cover; background-repeat:no-repeat; background-position:center; transition:transform .6s cubic-bezier(.22,.61,.36,1); }
  .svc:hover .svc-img{ transform:scale(1.05); }
  .svc::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(to top, rgba(7,26,20,.95) 0%, rgba(7,26,20,.85) 22%, rgba(7,26,20,.5) 42%, rgba(7,26,20,.12) 66%, rgba(7,26,20,0) 100%); }
  /* open auto transport is a wide 4:3 shot — pull it back (show more of the rig), fading into the green plate below */
  .svc:nth-child(1){ background:var(--green-deep); }
  .svc:nth-child(1) .svc-img{ background-image:linear-gradient(to bottom, rgba(10,43,32,0) 30%, rgba(10,43,32,.65) 45%, rgba(10,43,32,1) 53%), var(--svc1); background-size:100% 100%, 140% auto; background-position:center, 34% top; background-repeat:no-repeat; filter:saturate(.8) brightness(.95) contrast(1.03); }
  .svc:nth-child(2) .svc-img{ background-image:var(--svc2); }
  .svc:nth-child(3) .svc-img{ background-image:var(--svc3); background-position:center 32%; }
  .svc:nth-child(4) .svc-img{ background-image:var(--svc4); }
  .svc-body{ position:relative; z-index:2; display:flex; flex-direction:column; align-items:flex-start; padding:26px 24px; }
  .svc h3{ font-weight:600; font-size:1.24rem; line-height:1.2; letter-spacing:-.01em; margin-bottom:8px; color:#fff; text-shadow:0 1px 14px rgba(0,0,0,.3); }
  .svc p{ font-family:var(--helv); color:rgba(255,255,255,.92); font-size:1.02rem; line-height:1.3; min-height:4.5em; margin-bottom:18px; text-shadow:0 1px 14px rgba(0,0,0,.3); }
  .svc a{ font-family:var(--sans); font-weight:600; font-size:.86rem; color:var(--green); text-decoration:none; background:#fff; padding:10px 18px; border-radius:999px; display:inline-flex; align-items:center; gap:7px; box-shadow:0 6px 18px rgba(0,0,0,.18); transition:transform .2s ease, background .2s ease, color .2s ease; }
  .svc a .arr{ font-size:1.05em; line-height:1; transition:transform .2s ease; -webkit-text-stroke:.6px currentColor; text-stroke:.6px currentColor; }
  .svc a:hover{ background:var(--green); color:#fff; transform:translateY(-1px); }
  .svc a:hover .arr{ transform:translateX(2px); }
  /* reviews */
  /* reviews — a featured pull-quote over a scrolling wall; hover a card to feature it up top */
  #reviews > .wrap{ flex:1; min-height:0; justify-content:space-between; transform:translateY(-100px); }   /* rest the reviews content 100px higher */
  #reviews .rev-wall{ margin-bottom:100px; }   /* nudge the scrolling roll up 100px */
  /* featured quote lives in a soft-green card with a fixed height, so only the text swaps */
  .rev-head{ text-align:center; width:100%; max-width:680px; margin-inline:auto; flex:none; min-height:360px;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    background:linear-gradient(180deg, #eef5f0, #e6f1ea);
    border:1px solid color-mix(in srgb, var(--green) 16%, transparent); border-radius:24px;
    padding:clamp(38px,4.5vw,58px) clamp(30px,4vw,56px); box-shadow:0 14px 36px rgba(10,43,32,.06); }
  .rev-stars{ color:var(--star); letter-spacing:5px; font-size:1.1rem; }
  .rev-quote{ font-weight:500; font-size:clamp(1.2rem,1.9vw,1.55rem); line-height:1.32; letter-spacing:-.01em; margin:18px auto 16px; }
  .rev-author{ font-weight:600; font-size:1rem; }
  .rev-author .mt{ color:var(--muted); font-weight:400; font-family:var(--helv); font-size:.9em; }
  @keyframes revfade{ from{ opacity:.25; transform:translateY(4px); } to{ opacity:1; transform:none; } }
  .rev-quote.rev-in, .rev-author.rev-in{ animation:revfade .35s ease; }
  .rev-wall{ width:100%; flex:none; overflow:hidden; margin-top:clamp(50px,6vh,76px);
    -webkit-mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
    mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
  .rev-track{ display:flex; gap:16px; width:max-content; }
  @media (prefers-reduced-motion:no-preference){
    .rev-track{ animation:revscroll 44s linear infinite; }
    .rev-wall:hover .rev-track{ animation-play-state:paused; }
  }
  @keyframes revscroll{ from{ transform:translateX(0); } to{ transform:translateX(calc(-50% - 8px)); } }
  .rev-card{ width:318px; flex:none; text-align:left; border:1px solid var(--line); border-radius:14px; padding:20px 20px; background:var(--paper); cursor:pointer; transition:border-color .2s ease, box-shadow .25s ease, transform .2s ease; }
  .rev-card:hover{ border-color:var(--green); box-shadow:0 12px 28px rgba(10,43,32,.12); }
  .rev-card .stars{ color:var(--star); letter-spacing:2px; font-size:.85rem; }
  .rev-card .q{ font-family:var(--helv); font-size:.98rem; line-height:1.32; color:var(--ink); margin:9px 0 12px;
    display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
  .rev-card .by{ font-size:.8rem; color:var(--muted); font-weight:600; }
  /* cta band */
  .band{ position:relative; overflow:hidden; background:var(--green-deep); color:#eafff4; text-align:center; padding:calc(clamp(38px,4vh,64px) + 50px) 0 clamp(38px,4vh,64px); margin-top:-150px; display:flex; flex-direction:column; }   /* content-height so the footer shows with it; pulled up 150px; +50px top space */
  /* On the quote page the band is the page: there is no section above it to
     overlap and a fixed header above it to clear, so it neither pulls itself up
     nor pads for the pull. L-43. */
  .band.solo{ margin-top:0; padding-top:calc(clamp(38px,4vh,64px) + 78px); }
  /* The invitation at the foot of every page except the quote page. A sign-off
     rather than a section, so it does not take a screen of its own. L-43. */
  .sec.closer{ min-height:0; padding:clamp(56px,7vh,88px) 0; }
  .sec.closer .cta-wrap{ margin-top:26px; }
  .band .in{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; }
  .band .in > h2{ margin-top:0; }
  .band::before{ content:""; position:absolute; inset:0; background-image:var(--night); background-size:cover; background-position:center; opacity:.18; }
  .band .in{ position:relative; z-index:2; max-width:var(--cw); margin:0 auto; padding:0 var(--pad); }
  .band h2{ color:#fff; max-width:20ch; margin:0 auto; }
  .band .sub{ font-family:var(--helv); color:#c7e0d5; margin:16px auto 26px; max-width:44ch; font-size:1.06rem; line-height:1.4; }
  /* get-a-quote form (Option 3 — light ivory card on the dark band, highest contrast) */
  .quote-form{ width:100%; max-width:940px; margin:8px auto 0; text-align:left;
    background:#fbfdfb; border:1px solid #e3e9e5; border-radius:20px; padding:26px 26px 30px;
    box-shadow:0 30px 70px rgba(0,0,0,.35); }
  .qf-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:15px; }
  .qf-field{ display:flex; flex-direction:column; gap:6px; min-width:0; }
  .qf-field span{ font-family:var(--helv); font-size:12.5px; letter-spacing:.02em; color:var(--green); font-weight:600; }
  .qf-field input, .qf-field select{ font-family:var(--helv); font-size:.95rem; color:var(--ink); width:100%; height:44px;
    background-color:#fff; border:1px solid #d5ddd8; border-radius:10px; padding:0 13px;
    outline:none; transition:border-color .15s ease, background-color .15s ease; }
  .qf-field input::placeholder{ color:#9aa8a0; }
  /* ZIP sits under its address, narrow, with its own small caption — the two
     belong to one leg, so they stay inside the same label (L-36). */
  /* One row per leg, full width. Side by side the two legs had half the card
     each, and splitting that again left the address box about seventy pixels
     wide with "Delivery location" wrapping onto two lines. Stacked, the
     address has room and the ZIP sits beside it with its caption in line. */
  .qf-legs{ grid-template-columns:1fr; gap:12px; }
  .qf-legwrap{ flex-direction:row; align-items:flex-start; gap:12px; }
  .qf-leg{ display:flex; flex-direction:column; gap:6px; flex:1 1 auto; min-width:0; }
  .qf-zip{ display:flex; flex-direction:column; gap:6px; flex:0 0 92px; }
  .qf-field .qf-zip input{ width:100%; padding:0 10px; }
  /* On a phone the ZIP drops under its address. Beside it, the address box is
     196px and its own placeholder is cut off before anybody types a word.
     This block has to sit AFTER the two rules it overrides: at equal
     specificity the later one wins whatever the viewport says, and put above
     them it would be dead text at every width. */
  @media (max-width:640px){
    /* align-items came from the row rule above, where flex-start is what keeps
       the ZIP level with the address. Stacked it is the CROSS axis, so it was
       sizing both boxes to their content — the address came out 225px against
       the 298px of Year and Make below it. Stretch puts every box on this form
       at one width. */
    .qf-legwrap{ flex-direction:column; gap:8px; align-items:stretch; }
    .qf-zip{ flex:0 0 auto; }
    .qf-field .qf-zip input{ width:100%; }
  }
  .qf-field input:focus, .qf-field select:focus{ border-color:var(--green); background-color:#f2f7f4; }
  .qf-field select:required:invalid{ color:#9aa8a0; }   /* shows the "Select…" prompt muted (closed control only) */
  .qf-field select option{ color:var(--ink); }          /* but keep the open dropdown list black */
  .qf-field select{ -webkit-appearance:none; appearance:none; cursor:pointer; padding-right:34px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2312503a' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 11px center; }
  /* move-type toggle + snowbird run picker */
  .qf-move{ display:flex; gap:6px; margin-bottom:15px; background:var(--wash); border:1px solid var(--line); border-radius:12px; padding:5px; }
  .qf-move-opt{ flex:1; font-family:var(--helv); font-size:.9rem; font-weight:500; color:var(--soft); background:transparent; border:0; border-radius:9px; padding:11px 8px; cursor:pointer; transition:background .15s ease, color .15s ease; }
  .qf-move-opt.is-on{ background:var(--green); color:#fff; }
  .qf-row.qf-row-full{ grid-template-columns:1fr; }
  /* The box that opens on "Other" (L-35). Full width, because a make written
     out in full does not fit a third of the row, and set apart by a rule and a
     little space so the one field that just appeared is the one you see. */
  .qf-row.qf-other{ margin-top:-4px; padding-top:13px; border-top:1px solid #dfe8e2; }
  /* .qf-row sets display:grid, and an author display beats the browser’s own
     [hidden]{display:none} — so without this the box is on the page from the
     start, which is not what “it should appear only when Other is chosen” means. */
  .qf-row[hidden]{ display:none; }
  /* The year box's own wrapper, so both boxes are hidden and announced the same
     way. A bare span inherits nothing, so it has to stretch like a field would. */
  .qf-other-in{ display:block; }
  .qf-other-in[hidden]{ display:none; }
  .qf-row.qf-row-3{ grid-template-columns:1fr 1fr 1fr; }
  .qf-veh + .qf-veh{ margin-top:16px; padding-top:16px; border-top:1px solid var(--line); }
  .qf-veh-head{ font-weight:600; font-size:.82rem; color:var(--soft); margin-bottom:9px; }
  .qf-veh-head:empty{ display:none; }
  .qf-veh-remove{ margin-top:9px; background:none; border:0; padding:0; color:var(--muted); font:inherit; font-size:.82rem; cursor:pointer; text-decoration:underline; text-underline-offset:2px; }
  .qf-veh-remove:hover{ color:var(--green); }
  .qf-veh-remove[hidden]{ display:none; }
  /* Left, where every other control on this form starts, and with room above
     and below: it is the seam between the vehicles and the person, not a field
     belonging to either. */
  .qf-veh-add{ display:block; margin:18px 0 24px; background:none; border:1px solid var(--line); border-radius:10px; color:var(--green); font:inherit; font-weight:600; font-size:.9rem; padding:10px 15px; cursor:pointer; transition:border-color .15s, background .15s; }
  .qf-veh-add:hover{ border-color:var(--green); background:var(--wash); }
  .qf-veh-add[hidden]{ display:none; }
  /* two-column: form fields on the left, calendar on the right */
  .qf-main{ display:grid; grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr); gap:24px; align-items:start; }
  .qf-left{ min-width:0; } .qf-right{ min-width:0; }
  @media (max-width:840px){ .qf-main{ grid-template-columns:1fr; gap:16px; } }
  /* the calendar */
  .cal{ background:#fff; border:1px solid #d5ddd8; border-radius:12px; padding:14px 15px 16px; }
  .cal-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:11px; }
  .cal-title{ font-family:var(--sans); font-weight:600; font-size:1rem; color:var(--ink); }
  .cal-nav{ display:flex; gap:6px; }
  .cal-nav button{ width:32px; height:32px; border:1px solid var(--line); background:#fff; border-radius:9px; color:var(--green); cursor:pointer; display:grid; place-items:center; padding:0; }
  .cal-nav button:hover:not(:disabled){ background:#f2f7f4; border-color:var(--green); }
  .cal-nav button:disabled{ opacity:.35; cursor:default; }
  .cal-dow{ display:grid; grid-template-columns:repeat(7,1fr); gap:4px; margin-bottom:5px; }
  .cal-dow span{ font-family:var(--helv); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.02em; color:var(--muted); text-align:center; }
  .cal-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
  .cd{ aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; font-family:var(--helv); font-size:.9rem; color:var(--ink); border-radius:10px; }
  .cd.out{ color:transparent; }
  .cd.past{ color:#c4cec8; }
  .cd.pick{ cursor:pointer; }
  .cd.pick:hover{ background:#eef5f0; }
  .cd.pick.sel{ background:var(--green); color:#fff; font-family:var(--sans); font-weight:700; }
  .cd.dim{ color:#c6d0ca; }
  .cd.run{ flex-direction:column; gap:0; cursor:pointer; border:1px solid var(--green); background:var(--green); line-height:1; }
  .cd.run .cn{ font-family:var(--sans); font-weight:700; font-size:.9rem; color:#fff; }
  .cd.run .cs{ font-family:var(--helv); font-size:.5rem; margin-top:1px; color:rgba(255,255,255,.82); }
  .cd.run.full{ opacity:.5; }
  .cd.run.sel{ box-shadow:inset 0 0 0 2px #fff, 0 0 0 2px var(--green-hi); }
  /* direction filter toggle (snowbird only) */
  .cal-dir{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:-2px 0 15px; }
  .cal-dir[hidden]{ display:none; }
  .cal-dir-cap{ font-family:var(--helv); font-size:.72rem; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; }
  .cal-dir-opts{ display:flex; gap:6px; flex:1; }
  .cal-dir-opt{ flex:1; text-align:center; font-family:var(--helv); font-weight:500; font-size:.82rem; white-space:nowrap; color:var(--soft); background:#fff; border:1px solid #d5ddd8; border-radius:8px; padding:8px 10px; cursor:pointer; transition:background .15s ease, color .15s ease, border-color .15s ease; }
  .cal-dir-opt:hover{ border-color:#bcccc2; }
  .cal-dir-opt.is-on{ background:#eef5f0; color:var(--green); border-color:var(--green); }
  .cal-error{ font-family:var(--helv); font-size:.85rem; color:#b3261e; margin:8px 0 0; }   /* the size of every other sentence on this form (L-38) */
  /* The snowbird runs' own line (L-41): loading, or did not load and Try again.
     Always in the page so a screen reader hears it change; empty, it takes no room. */
  .cal-note{ font-family:var(--helv); font-size:.85rem; color:var(--soft); margin:-6px 0 0; }   /* -6px takes back the field's gap: an empty note adds nothing */
  .qf-field .cal-note > span{ font-size:inherit; font-weight:inherit; color:inherit; letter-spacing:normal; }   /* not a caption: .qf-field span styles those */
  .cal-note:not(.is-on) > span{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }   /* "Departures loaded." is said, not shown */
  .cal-note.is-on{ margin-top:2px; display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; }   /* 8px under the calendar */
  .cal-note.is-on > span{ flex-basis:100%; }   /* the button always under the sentence: a shorter one ("Loading…") must not let it jump up beside it */
  .cal-note.is-bad{ color:#b3261e; }
  .cal-retry{ font-family:var(--helv); font-weight:600; font-size:.9rem; color:var(--green); background:#fff; border:1px solid var(--green); border-radius:8px; padding:9px 16px; min-height:40px; cursor:pointer; }
  .cal-retry:hover{ background:#eef5f0; }
  .cal-retry[aria-disabled="true"]{ opacity:.45; cursor:default; background:#fff; }   /* loading: stays put, greyed */
  /* A field's own sentence (L-38): the calendar's red, a size an older eye
     reads, and NOT the green label styling `.qf-field span` would give it. */
  .quote-form .qf-msg{ display:block; font-family:var(--helv); font-size:.85rem; font-weight:500; letter-spacing:0; line-height:1.35; color:#b3261e; margin:0; }
  .quote-form .qf-msg[hidden]{ display:none; }
  .qf-legs > .qf-msg{ margin-top:-6px; }
  .quote-form .qf-consent + .qf-msg{ margin:-2px 2px 4px 28px; }
  .qf-field input[aria-invalid="true"], .qf-field select[aria-invalid="true"]{ border-color:#b3261e; }
  /* The red border stays while a field is being fixed, so the focus cue has
     to be something else than the green border it replaces. */
  .qf-field input[aria-invalid="true"]:focus, .qf-field select[aria-invalid="true"]:focus{ box-shadow:0 0 0 3px rgba(179,38,30,.18); }
  .qf-consent input[aria-invalid="true"]{ outline:2px solid #b3261e; outline-offset:2px; }
  /* address autocomplete dropdown */
  .addr-wrap{ position:relative; min-width:0; }
  .addr-suggest{ position:absolute; top:calc(100% + 5px); left:0; right:0; z-index:40; margin:0; padding:6px; list-style:none;
    background:#fff; border:1px solid #d5ddd8; border-radius:12px; box-shadow:0 20px 44px rgba(10,43,32,.20); max-height:236px; overflow:auto; }
  .addr-suggest[hidden]{ display:none; }
  .addr-suggest li{ font-family:var(--helv); font-size:.9rem; color:var(--ink); line-height:1.3; padding:9px 11px; border-radius:8px; cursor:pointer; }
  .addr-suggest li .a2{ display:block; font-size:.8rem; color:var(--muted); margin-top:1px; }
  .addr-suggest li:hover, .addr-suggest li.on{ background:#eef5f0; }
  /* shown only when the address service fails or times out (L-17) */
  .addr-note{ font-family:var(--helv); font-size:.82rem; line-height:1.35; color:var(--muted); margin-top:6px; }
  .addr-note[hidden]{ display:none; }
  .quote-form .cta{ display:flex; width:fit-content; margin:18px auto 0; border:none; cursor:pointer; -webkit-appearance:none; appearance:none; font-family:inherit; font-weight:600; font-size:.95rem; }
  .quote-form .cta[disabled]{ opacity:.7; cursor:default; }
  .qf-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
  /* The portal's own refusal lands here. It was #ffd7cd - light pink, from
     when this sat on the green band - which on this near-white card is about
     1.3:1 and reads as nothing at all (L-38). */
  .qf-error{ font-family:var(--helv); color:#b3261e; font-size:.92rem; text-align:center; margin-top:14px; }
  .qf-error.is-wait{ color:var(--soft); }   /* "taking longer than it should": not a failure, so not red (L-42) */
  /* Heard, not seen: how many things a press of the button found (L-38). */
  .qf-sr{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
  .qf-consent{ display:flex; align-items:flex-start; gap:10px; margin:16px 2px 4px; font-family:var(--helv); font-size:.82rem; color:var(--muted); line-height:1.42; }
  /* The tick sits on the middle of the FIRST line of the sentence beside it.
     It looked a few pixels high because the links below carry vertical padding
     for a thumb, and inline-block padding grows the line box and pushes the
     text down with it. The negative margin gives the padding back to the tap
     target without letting it move the line. */
  .qf-consent input{ margin-top:1px; width:16px; height:16px; flex:none; accent-color:var(--green); cursor:pointer; }
  .qf-consent a{ color:var(--green); font-weight:600; text-decoration:underline; cursor:pointer; display:inline-block; padding:5px 0; margin:-5px 0; }
  .quote-done{ text-align:center; max-width:540px; margin:6px auto 0; }
  .quote-done:focus{ outline:none; }   /* given the cursor so a screen reader reads it (L-42); not a control */
  .quote-done .qd-check{ width:56px; height:56px; margin:0 auto 16px; border-radius:50%; background:rgba(255,255,255,.14); color:#eafff4; display:flex; align-items:center; justify-content:center; }
  .quote-done .qd-check svg{ width:28px; height:28px; }
  .quote-done h3{ font-family:var(--sans); font-weight:600; letter-spacing:-.02em; font-size:clamp(1.4rem,3vw,1.9rem); color:#fff; }
  .quote-done p{ font-family:var(--helv); color:#bfe6d5; font-size:1.05rem; line-height:1.5; margin-top:12px; }
  .quote-done p a{ color:#fff; }
  @media (max-width:640px){ .qf-row, .qf-row.qf-row-3{ grid-template-columns:1fr; } }
  @media (min-width:641px) and (max-width:820px){ .qf-row.qf-row-3{ grid-template-columns:1fr 1fr; } }
  /* footer */
  .ft{ background:var(--green-deep); color:#bcd8ce; border-top:1px solid rgba(255,255,255,.08); }
  .ft .in{ max-width:var(--cw); margin:0 auto; padding:clamp(34px,4vh,52px) var(--pad) 22px; }
  .ft-top{ display:grid; grid-template-columns:1fr auto auto; gap:clamp(36px,5vw,72px); }
  @media (max-width:760px){ .ft-top{ grid-template-columns:1fr; gap:26px; } }
  .ft .brand-logo{ height:60px; }
  .ft-blurb{ font-family:var(--helv); font-size:1rem; line-height:1.35; margin-top:10px; max-width:34ch; }
  .ft h4{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:#7fa596; margin:0 0 10px; font-weight:600; }
  /* padding, not font-size: the row grows to a tappable 26px, the type does not change (L-27) */
  .ft a, .ft .li{ display:block; font-family:var(--helv); text-decoration:none; color:#bcd8ce; font-size:.94rem; margin-bottom:0; padding:4px 0; min-height:26px; }
  .ft-top > div:nth-child(3) a, .ft-top > div:nth-child(3) .li{ margin-bottom:7px; line-height:1.4; }
  .ft-where{ margin-top:20px; }
  .ft-where .li{ margin-bottom:8px; line-height:1.45; }
  .ft-where .addr span{ display:block; line-height:1.2; }
  .ft-where .addr span:first-child{ margin-bottom:1px; }
  .ft a:hover{ color:#fff; }
  .ft-bot{ border-top:1px solid rgba(255,255,255,.1); margin-top:20px; padding-top:16px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-family:var(--helv); font-size:12px; color:#7fa596; }
  .ft-bot span{ margin:0; }
  .ft a.ft-terms{ display:inline-block; margin:0; color:#7fa596; text-decoration:none; cursor:pointer; font-size:12px; font-weight:400; padding:6px 0; min-height:26px; }
  .ft a.ft-terms:hover{ color:#bcd8ce; }
  .ft-legal{ display:flex; gap:18px; align-items:center; flex-wrap:wrap; }
  /* terms & conditions modal */
  .modal{ position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(6,20,15,.62); }
  .modal.open{ display:flex; }
  .modal-card{ position:relative; background:var(--paper); color:var(--ink); width:min(720px,100%); max-height:86vh; overflow-y:auto; border-radius:20px; padding:clamp(26px,4vw,44px); box-shadow:0 30px 90px rgba(0,0,0,.45); }
  .modal-card h2{ font-weight:600; letter-spacing:-.02em; font-size:clamp(1.5rem,3vw,1.9rem); margin:0 6px 4px 0; }
  .modal-card .upd{ font-family:var(--helv); color:var(--muted); font-size:.84rem; margin-bottom:22px; }
  .modal-card h3{ font-weight:600; font-size:1.02rem; margin:20px 0 5px; }
  .modal-card p{ font-family:var(--helv); color:var(--soft); font-size:.95rem; line-height:1.55; margin:0; }
  .modal-card .fine{ margin-top:24px; padding-top:16px; border-top:1px solid var(--line); font-size:.85rem; color:var(--muted); }
  .modal-close{ position:absolute; top:14px; right:14px; width:38px; height:38px; border:none; border-radius:50%; background:var(--wash); color:var(--ink); font-size:22px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; }
  .modal-close:hover{ background:var(--line); }
  /* scroll-reveal (motion-safe only) */
  @media (prefers-reduced-motion:no-preference){
    .anim .reveal{ opacity:0; transform:translateY(18px); transition:opacity .55s ease, transform .6s cubic-bezier(.22,.61,.36,1); }
    .anim .reveal.seen{ opacity:1; transform:none; }
  }
  /* ===== FAQ accordion ===== */
  /* Menu clicks are centered by JS (see the "center the target section" script); FAQ lands 100px higher via the UP bias there. */
  #faq{ min-height:0; padding-bottom:250px; }   /* short two-column FAQ: no full-screen section; padding + lift, less the band's -150 overlap = ~250px gap to the CTA */
  #faq .wrap{ transform:translateY(-150px); }   /* rest the FAQ content higher in the flow (visible when scrolling) */
  /* Reviews and the FAQ each rest their content higher than the section they
     sit in, and the FAQ carries a 250px tail. All three numbers were measured
     against the CTA band that followed them on the scroll, whose -150px overlap
     they were there to even out. On a page of its own there is no band below to
     meet: the lift only drags the heading up behind the fixed header, which is
     what put "Common questions" through the navigation. The id in each selector
     is doing real work — it is the only way to outrank the rule being undone.
     L-43. */
  #faq.first > .wrap, #reviews.first > .wrap{ transform:none; }
  #faq.first{ padding-bottom:clamp(84px,9vh,124px); }
  #reviews.first .rev-wall{ margin-bottom:0; }
  #faq .faq{ max-width:1040px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:0 52px; align-items:start; }
  @media (max-width:820px){ #faq .faq{ grid-template-columns:1fr; max-width:640px; } }
  #faq .faq-list{ list-style:none; margin:11px 0 0; padding:0; display:grid; gap:9px; }
  #faq .faq-list li{ position:relative; padding-left:19px; font-family:var(--helv); color:var(--soft); font-size:1rem; line-height:1.45; }
  #faq .faq-list li::before{ content:""; position:absolute; left:3px; top:9px; width:6px; height:6px; border-radius:50%; background:var(--green-hi); }
  #faq .faq-list strong{ color:var(--ink); font-weight:600; }
  #faq .faq-item{ border-bottom:1px solid var(--line); }
  #faq .faq-item:first-child{ border-top:1px solid var(--line); }
  #faq .faq-q-btn{ width:100%; display:flex; align-items:center; justify-content:space-between; gap:18px; text-align:left; background:none; border:0; cursor:pointer; padding:22px 4px; color:var(--ink); font-family:var(--sans); }
  #faq .faq-q-btn:focus-visible{ outline:2px solid var(--green); outline-offset:3px; border-radius:6px; }
  #faq .faq-q{ font-weight:600; font-size:1.06rem; letter-spacing:-.01em; transition:color .18s ease; }
  #faq .faq-q-btn:hover .faq-q{ color:var(--green); }
  #faq .faq-ico{ flex:none; width:27px; height:27px; border-radius:50%; border:1.5px solid var(--green); color:var(--green); display:grid; place-items:center; transition:transform .25s ease, background .2s ease, color .2s ease; }
  #faq .faq-ico svg{ width:13px; height:13px; display:block; }
  #faq .faq-item.open .faq-ico{ background:var(--green); color:#fff; transform:rotate(45deg); }
  #faq .faq-wrap{ overflow:hidden; max-height:0; transition:max-height .32s ease; }
  #faq .faq-item.open .faq-wrap{ max-height:1000px; }
  #faq .faq-in{ padding:0 4px 24px; }
  #faq .faq-a{ font-family:var(--helv); color:var(--soft); font-size:1rem; }
  #faq .faq-a.intro{ margin-bottom:14px; }
  #faq .faq-check{ list-style:none; margin:0; padding:0; display:grid; gap:11px; }
  #faq .faq-check li{ display:flex; gap:11px; align-items:flex-start; font-family:var(--helv); color:var(--soft); font-size:1rem; }
  #faq .faq-check li svg{ flex:none; width:18px; height:18px; margin-top:2px; color:var(--green); }
  @media (prefers-reduced-motion:reduce){ #faq .faq-wrap{ transition:none; } }
  #faq .faq-check li span{ display:block; }

/* The bot check widget above the consent line (L-30). Empty when the check is off. */
.qf-turnstile{margin:6px 0 2px;min-height:0}
.qf-turnstile:empty{display:none}