/* =========================================================
   Local Boost FL
   Theme: Orange and Blue (see THEME.md)
   Radius system: interactive = pill, surfaces = 14px, inner = 8px
   ========================================================= */

/* ---------- tokens ---------- */
:root{
  --paper:#F5F6FA;
  --band:#E7EBF4;
  --navy:#0B1330;
  --deep:#0B2A80;
  --slate:#4B5573;
  --orange:#B8390A;
  --gold:#C8891F;

  --bg:var(--paper);
  --bg-alt:var(--band);
  --fg:var(--navy);
  --fg-2:var(--slate);
  --acc:var(--orange);
  --acc-ink:#fff;
  --acc-on-dark:#FF7A33;
  --deep-ink:#fff;
  --line:color-mix(in srgb, var(--navy) 15%, transparent);
  --line-2:color-mix(in srgb, var(--navy) 9%, transparent);
  --surface:#FFFFFF;
  --surface-2:#F2F4FA;
  --acc-wash:color-mix(in srgb, var(--orange) 9%, var(--paper));

  --r-surface:14px;
  --r-inner:8px;

  /* Layered shadows: a tight contact edge plus a wide soft ambient.
     Both are tinted navy, never pure black, so they sit in the palette. */
  --sh-1:0 1px 2px -1px color-mix(in srgb,var(--navy) 10%,transparent),
         0 4px 12px -6px color-mix(in srgb,var(--navy) 12%,transparent);
  --sh-2:0 1px 2px -1px color-mix(in srgb,var(--navy) 9%,transparent),
         0 12px 28px -14px color-mix(in srgb,var(--navy) 16%,transparent);
  --sh-3:0 1px 3px -1px color-mix(in srgb,var(--navy) 8%,transparent),
         0 26px 56px -30px color-mix(in srgb,var(--navy) 26%,transparent);

  --wrap:1240px;
  --gut:clamp(20px,5vw,60px);
  --sec:clamp(72px,10vw,144px);

  --ff-d:"Bricolage Grotesque","Avenir Next Condensed","Trebuchet MS",sans-serif;
  --ff-b:"Inter Tight","Helvetica Neue",Arial,sans-serif;

  --fs-h1:clamp(2.05rem,1.15rem + 3.4vw,3.85rem);
  --fs-h2:clamp(2rem,1.25rem + 3.1vw,3.5rem);
  --fs-h3:clamp(1.25rem,1.08rem + .72vw,1.6rem);
  --fs-lead:clamp(1.06rem,1rem + .4vw,1.32rem);
  --fs-body:clamp(.97rem,.94rem + .16vw,1.06rem);
  --fs-sm:.875rem;
  --fs-xs:.795rem;

  --ease:cubic-bezier(.16,1,.3,1);
}

@media (prefers-color-scheme:dark){
  :root{
    --bg:#08112E;
    --bg-alt:#0D183B;
    --fg:#EDF1FA;
    --fg-2:#A9B3CC;
    --acc:#FF7A33;
    --acc-ink:#2A0A00;
    --deep:#143A9E;
    --gold:#E0A73C;
    --line:color-mix(in srgb, #EDF1FA 16%, transparent);
    --line-2:color-mix(in srgb, #EDF1FA 9%, transparent);
    --surface:#101C43;
    --surface-2:#142149;
    --acc-wash:color-mix(in srgb, #FF7A33 15%, #08112E);
    /* On a dark ground, shadow reads as depth only if it is near-black. */
    --sh-1:0 1px 2px -1px rgba(0,0,0,.5), 0 4px 12px -6px rgba(0,0,0,.55);
    --sh-2:0 1px 2px -1px rgba(0,0,0,.5), 0 12px 28px -14px rgba(0,0,0,.6);
    --sh-3:0 1px 3px -1px rgba(0,0,0,.5), 0 26px 56px -30px rgba(0,0,0,.7);
  }
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--fg);
  font-family:var(--ff-b);font-size:var(--fs-body);line-height:1.62;
  font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
h1,h2,h3{font-family:var(--ff-d);font-weight:800;margin:0;
  letter-spacing:-.032em;line-height:1.02;
  font-variation-settings:"wdth" 100,"opsz" 60;}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
img,svg{max-width:100%}
a{color:inherit}
:where(a,button,[tabindex]):focus-visible{
  outline:2.5px solid var(--acc);outline-offset:3px;border-radius:4px;
}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.sprite symbol{fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.sprite #i-star{fill:currentColor;stroke:none}

.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--acc);
  color:var(--acc-ink);padding:12px 20px;border-radius:0 0 var(--r-inner) 0;font-weight:600}
.skip:focus{left:0}
#top-sentinel{position:absolute;top:0;height:1px;width:1px}

.h2{font-size:var(--fs-h2);max-width:17ch}
.lead{font-size:var(--fs-lead);color:var(--fg-2);margin-top:20px;max-width:46ch;line-height:1.55}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:48px;padding:0 24px;border-radius:999px;
  font-family:var(--ff-b);font-size:var(--fs-sm);font-weight:600;
  letter-spacing:.005em;text-decoration:none;white-space:nowrap;
  border:1.5px solid transparent;cursor:pointer;
  transition:background .22s var(--ease),border-color .22s var(--ease),
             color .22s var(--ease),transform .12s var(--ease);
}
.btn--sm{min-height:40px;padding:0 18px;font-size:var(--fs-xs)}
.btn__i{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.btn:active{transform:translateY(1px)}
.btn--solid{background:var(--acc);color:var(--acc-ink)}
.btn--solid:hover{background:color-mix(in srgb,var(--acc) 84%,var(--fg))}
.btn--ghost{border-color:var(--line);color:var(--fg);background:transparent}
.btn--ghost:hover{border-color:var(--acc);color:var(--acc)}
.btn--light{background:var(--bg);color:var(--acc)}
.btn--light:hover{background:#fff;color:var(--deep)}
.btn--outline{border-color:color-mix(in srgb,#fff 45%,transparent);color:#fff}
.btn--outline:hover{border-color:#fff;background:color-mix(in srgb,#fff 12%,transparent)}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid transparent;transition:border-color .3s var(--ease)}
.hdr.is-stuck{border-bottom-color:var(--line-2)}
.hdr__in{max-width:var(--wrap);margin-inline:auto;padding:0 var(--gut);
  height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.brand__mark{width:26px;height:26px;color:var(--acc);display:block}
.brand__mark svg{display:block;stroke:currentColor;fill:none}
.brand__wm{font-family:var(--ff-d);font-weight:800;font-size:1.02rem;letter-spacing:-.03em}
.brand__fl{color:var(--acc);margin-left:.32em}

.nav{display:flex;align-items:center;gap:34px}
.nav__list{display:flex;align-items:center;gap:28px}
/* padding-block gives a 44px hit area inside the 68px bar without moving the
   text, which sat in a 17px-tall target before. */
.nav__list a{text-decoration:none;font-size:var(--fs-sm);font-weight:500;color:var(--fg-2);
  display:inline-flex;align-items:center;min-height:44px;
  transition:color .2s var(--ease)}
.nav__list a:hover{color:var(--fg)}

.burger{display:none;width:46px;height:46px;align-items:center;justify-content:center;
  background:transparent;border:1.5px solid var(--line);border-radius:999px;cursor:pointer;color:var(--fg)}
.burger__box{display:block;width:17px;height:11px;position:relative}
.burger__box i{position:absolute;left:0;width:100%;height:1.6px;background:currentColor;border-radius:2px;
  transition:transform .3s var(--ease),opacity .2s var(--ease)}
.burger__box i:nth-child(1){top:0}
.burger__box i:nth-child(2){bottom:0}
.burger[aria-expanded="true"] .burger__box i:nth-child(1){transform:translateY(4.7px) rotate(45deg)}
.burger[aria-expanded="true"] .burger__box i:nth-child(2){transform:translateY(-4.7px) rotate(-45deg)}

/* ---------- hero ---------- */
.hero{padding-top:clamp(38px,6vw,84px);padding-bottom:clamp(48px,7vw,96px);position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 78% at 78% 8%,var(--acc-wash),transparent 62%)}
.hero__grid{position:relative;display:grid;gap:clamp(38px,5vw,60px);align-items:center}
.hero__h{font-size:var(--fs-h1);max-width:20ch;font-variation-settings:"wdth" 96,"opsz" 96}
.hero__sub{font-size:var(--fs-lead);color:var(--fg-2);margin-top:22px;max-width:40ch;line-height:1.52}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}

/* ---------- serp mockup ---------- */
.serp{margin:0;background:var(--surface);border:1px solid var(--line-2);
  border-radius:var(--r-surface);overflow:hidden;box-shadow:var(--sh-3)}
.serp__bar{display:flex;align-items:center;gap:10px;padding:13px 16px;
  border-bottom:1px solid var(--line-2);background:var(--surface-2)}
.serp__mag{width:16px;height:16px;flex:none;color:var(--fg-2);stroke:currentColor;fill:none;stroke-width:1.6}
.serp__q{font-size:var(--fs-sm);font-weight:500;color:var(--fg)}
.serp__loc{margin-left:auto;display:inline-flex;align-items:center;gap:5px;
  font-size:var(--fs-xs);color:var(--fg-2)}
.serp__loc svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.6}

.serp__map{height:clamp(120px,17vw,168px);border-bottom:1px solid var(--line-2)}
.serp__map svg{display:block;width:100%;height:100%}
.mp-land{fill:#E6E9F1}
.mp-water{fill:#C3D2EE}
.mp-park{fill:#DCE2EA}
.mp-road-lg path{stroke:#fff;stroke-width:7;fill:none}
.mp-road-sm path{stroke:#fff;stroke-width:3.4;fill:none;opacity:.85}
.mp-pin circle{fill:#8A93AC}
.mp-pin text{fill:#fff;font-family:var(--ff-b);font-size:13px;font-weight:600;text-anchor:middle}
.mp-pin--me circle{fill:var(--acc)}
.mp-pin--me text{font-size:15px}
@media (prefers-color-scheme:dark){
  .mp-land{fill:#131E44}.mp-water{fill:#17285F}.mp-park{fill:#152142}
  .mp-road-lg path{stroke:#22305F}.mp-road-sm path{stroke:#22305F}
  .mp-pin circle{fill:#48557E}.mp-pin--me circle{fill:var(--acc)}
  .mp-pin--me text{fill:#2A0A00}
}

.serp__row{display:flex;gap:13px;padding:15px 16px;align-items:flex-start;
  border-bottom:1px solid var(--line-2)}
.serp__list>.serp__row:last-child{border-bottom:0}
.serp__rank{flex:none;width:21px;height:21px;border-radius:var(--r-inner);
  display:grid;place-items:center;background:var(--bg-alt);color:var(--fg-2);
  font-size:.72rem;font-weight:600;margin-top:2px}
.serp__body{min-width:0;flex:1}
.serp__name{font-family:var(--ff-d);font-weight:700;font-size:.97rem;letter-spacing:-.015em;line-height:1.25}
.serp__meta{display:flex;align-items:center;gap:6px;margin-top:4px}
.serp__score{font-size:var(--fs-xs);font-weight:600;color:var(--fg)}
.serp__ct{font-size:var(--fs-xs);color:var(--fg-2)}
.serp__sub{font-size:var(--fs-xs);color:var(--fg-2);margin-top:3px;
  display:flex;align-items:center;gap:7px}
.dot{width:2.5px;height:2.5px;border-radius:50%;background:currentColor;opacity:.55;display:inline-block}
.serp__chips{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.chip{font-size:.7rem;font-weight:500;padding:3px 9px;border-radius:999px;
  background:var(--bg-alt);color:var(--fg-2)}
.chip--open{background:color-mix(in srgb,var(--acc) 15%,transparent);color:var(--acc)}
.serp__act{display:none;flex-direction:column;gap:6px;flex:none}
.pill{font-size:.7rem;font-weight:600;padding:5px 13px;border-radius:999px;
  border:1px solid var(--line);color:var(--fg-2);text-align:center}

.stars{position:relative;display:inline-block;line-height:0;flex:none}
.stars svg{width:12px;height:12px;display:inline-block;fill:currentColor;stroke:none}
.stars__off{color:color-mix(in srgb,var(--fg) 20%,transparent)}
.stars__on{position:absolute;inset:0;overflow:hidden;color:var(--gold);
  width:calc(var(--v) / 5 * 100%)}

.serp--win .serp__row.is-me{background:var(--acc-wash);box-shadow:inset 3px 0 0 var(--acc)}
.serp--win .serp__row.is-me .serp__rank{background:var(--acc);color:var(--acc-ink)}

.serp__more{font-size:var(--fs-xs);font-weight:600;color:var(--fg-2);
  padding:11px 16px;border-bottom:1px solid var(--line-2);background:var(--surface-2)}
.serp__row.is-thin{padding:9px 16px;opacity:.62}
.serp__row.is-thin .serp__name{font-size:.87rem;font-weight:600}
.serp__row.is-you{opacity:1;background:var(--bg-alt);box-shadow:inset 3px 0 0 var(--fg-2)}
.serp__you{font-size:.7rem;font-weight:600;color:var(--fg-2);margin-top:2px;
  letter-spacing:.04em;text-transform:uppercase}

/* ---------- marquee ---------- */
.mq{border-block:1px solid var(--line-2);overflow:hidden;padding:15px 0;
  background:var(--bg-alt);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.mq__track{display:flex;width:max-content;animation:mq 46s linear infinite}
.mq:hover .mq__track{animation-play-state:paused}
.mq__set{display:flex;align-items:center}
.mq__set li{font-family:var(--ff-d);font-weight:600;font-size:clamp(.92rem,.86rem + .28vw,1.08rem);
  letter-spacing:-.015em;color:var(--fg-2);padding-inline:22px;white-space:nowrap;
  display:flex;align-items:center;gap:44px}
.mq__set li::after{content:"";width:4px;height:4px;border-radius:50%;
  background:var(--acc);opacity:.5;margin-right:-22px}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- blocks ---------- */
.blk{padding-block:var(--sec)}
.blk--alt{background:var(--bg-alt)}
.blk__grid{display:grid;gap:clamp(36px,5vw,68px);align-items:center}
.blk__kick{font-family:var(--ff-d);font-weight:700;font-size:1rem;margin-top:34px;
  letter-spacing:-.02em}
.ticks{margin-top:14px;display:grid;gap:11px;max-width:44ch}
.ticks li{position:relative;padding-left:27px;color:var(--fg-2);font-size:var(--fs-body)}
.ticks li::before{content:"";position:absolute;left:0;top:.62em;width:13px;height:2px;
  background:var(--acc);border-radius:2px}
.blk--alt .ticks li::before{width:9px;height:9px;top:.52em;background:transparent;
  border:2px solid var(--acc);border-radius:50%}

/* ---------- geo grid ---------- */
.geo{margin:0;background:var(--surface);border:1px solid var(--line-2);
  border-radius:var(--r-surface);padding:clamp(18px,2.6vw,28px);
  box-shadow:var(--sh-3)}
.geo__pair{display:flex;align-items:center;gap:clamp(12px,2vw,22px)}
.geo__one{flex:1;min-width:0}
.geo__cap{font-family:var(--ff-d);font-weight:700;font-size:.82rem;color:var(--fg-2);
  margin-bottom:10px;letter-spacing:-.01em}
.geo__arrow{flex:none;color:var(--acc)}
.geo__arrow svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.6}
.grid5{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(4px,.7vw,7px)}
.gc{aspect-ratio:1;border-radius:var(--r-inner);display:grid;place-items:center;
  font-size:clamp(.62rem,.5rem + .34vw,.8rem);font-weight:600;font-variant-numeric:tabular-nums}
.g1{background:var(--acc);color:var(--acc-ink)}
.g2{background:color-mix(in srgb,var(--acc) 62%,var(--surface));color:var(--fg)}
.g3{background:color-mix(in srgb,var(--acc) 32%,var(--surface));color:var(--fg)}
.g4{background:color-mix(in srgb,var(--fg) 12%,var(--surface));color:var(--fg-2)}
.g5{background:color-mix(in srgb,var(--fg) 6%,var(--surface));color:var(--fg-2)}
.geo__key{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:18px;
  padding-top:16px;border-top:1px solid var(--line-2);
  font-size:var(--fs-xs);color:var(--fg-2)}
.gc--k{width:13px;height:13px;aspect-ratio:auto;border-radius:4px;margin-left:6px}
.geo__key .gc--k:first-child{margin-left:0}

/* ---------- stats ---------- */
.stats{padding-block:var(--sec)}
.stats__grid{display:grid;gap:clamp(30px,4vw,44px)}
.stat{border-top:2px solid var(--fg);padding-top:20px}
.stat__n{font-family:var(--ff-d);font-weight:800;font-size:clamp(3.6rem,2rem + 6.4vw,6.6rem);
  line-height:.86;letter-spacing:-.05em;font-variation-settings:"wdth" 78,"opsz" 96;color:var(--acc)}
.stat__plus{font-size:.5em;vertical-align:super;letter-spacing:0}
.stat__t{margin-top:16px;color:var(--fg-2);font-size:var(--fs-sm);line-height:1.55;max-width:32ch}

/* ---------- services ---------- */
.svcs{padding-block:var(--sec);background:var(--bg-alt)}
.svcs__h{margin-bottom:clamp(30px,4vw,48px)}
.svcs__list{border-top:1px solid var(--line)}
.svc{border-bottom:1px solid var(--line)}
.svc__hd{margin:0;font:inherit}
.svc__btn{display:flex;align-items:center;gap:clamp(14px,2vw,22px);width:100%;
  padding:clamp(20px,2.6vw,28px) 0;background:transparent;border:0;cursor:pointer;
  text-align:left;color:inherit;font:inherit;position:relative;
  transition:color .25s var(--ease)}
/* Tint via a pseudo-element bleeding into the gutter, so the row highlights
   without animating any layout property. */
.svc__btn::before{content:"";position:absolute;inset:0 calc(var(--gut) * -.5);
  background:var(--acc);opacity:0;border-radius:var(--r-inner);
  transition:opacity .25s var(--ease);pointer-events:none}
.svc__btn:hover::before{opacity:.045}
.svc__ico{flex:none;width:44px;height:44px;border-radius:999px;display:grid;place-items:center;
  border:1.5px solid var(--line);color:var(--acc);
  transition:background .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease)}
.svc__ico svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.svc__txt{flex:1;min-width:0;display:grid;gap:4px}
.svc__name{font-family:var(--ff-d);font-weight:700;font-size:var(--fs-h3);letter-spacing:-.028em;
  line-height:1.15}
.svc__sum{color:var(--fg-2);font-size:var(--fs-sm)}
.svc__chev{flex:none;width:30px;height:30px;display:grid;place-items:center;color:var(--fg-2);
  transition:transform .35s var(--ease),color .25s var(--ease)}
.svc__chev svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.svc__btn:hover .svc__ico{background:var(--acc);border-color:var(--acc);color:var(--acc-ink)}
.svc__btn:hover .svc__chev{color:var(--acc)}
.svc__btn[aria-expanded="true"] .svc__chev{transform:rotate(180deg);color:var(--acc)}
.svc__btn[aria-expanded="true"] .svc__ico{background:var(--acc);border-color:var(--acc);color:var(--acc-ink)}
.svc__btn:focus-visible{outline-offset:-3px}

.svc__panel{height:0;overflow:hidden;transition:height .4s var(--ease)}
.svc__inner{padding:0 0 clamp(24px,3vw,34px) calc(44px + clamp(14px,2vw,22px));max-width:66ch}
.svc__inner>p{color:var(--fg-2)}
.deliv{margin-top:18px;display:grid;gap:9px}
.deliv li{position:relative;padding-left:24px;font-size:var(--fs-sm);color:var(--fg)}
.deliv li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;
  border-radius:50%;border:2px solid var(--acc)}
.why{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);
  font-size:var(--fs-sm);color:var(--fg-2)}
.why__k{display:block;font-family:var(--ff-d);font-weight:700;color:var(--acc);
  font-size:var(--fs-xs);letter-spacing:.01em;margin-bottom:3px}

/* ---------- process ---------- */
.proc{padding-block:var(--sec)}
.proc__grid{display:grid;gap:clamp(34px,4.5vw,60px)}
.proc__mark{display:none;color:var(--acc);margin-top:26px}
.proc__mark svg{width:40px;height:40px;stroke:currentColor;fill:none;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.proc__steps{display:grid}
.step{display:flex;gap:clamp(16px,2.4vw,30px);padding:clamp(22px,2.8vw,30px) 0;
  border-top:1px solid var(--line)}
.proc__steps .step:last-child{border-bottom:1px solid var(--line)}
.step__n{font-family:var(--ff-d);font-weight:800;font-size:clamp(1.1rem,.95rem + .5vw,1.35rem);
  color:var(--acc);letter-spacing:-.02em;flex:none;padding-top:2px;
  font-variant-numeric:tabular-nums}
.step__h{font-size:var(--fs-h3);margin-bottom:9px}
.step__b p{color:var(--fg-2);max-width:52ch}

/* ---------- pricing ---------- */
.price{padding-block:var(--sec);background:var(--bg-alt)}
.price__h{margin-bottom:clamp(30px,4vw,48px)}
.price__grid{display:grid;gap:clamp(18px,2.4vw,26px)}
.tier{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-surface);
  padding:clamp(26px,3.4vw,40px);display:flex;flex-direction:column;box-shadow:var(--sh-2)}
.tier--pro{background:var(--fg);color:var(--bg);border-color:transparent;
  --acc:var(--acc-on-dark);--acc-ink:#2A0A00}
.tier__name{font-size:var(--fs-h3)}
.tier__cost{display:flex;align-items:baseline;gap:5px;margin-top:14px}
.tier__amt{font-family:var(--ff-d);font-weight:800;font-size:clamp(2.6rem,1.9rem + 2.6vw,3.7rem);
  letter-spacing:-.045em;line-height:1;font-variation-settings:"wdth" 88,"opsz" 96;color:var(--acc)}
.tier__per{font-size:var(--fs-sm);color:var(--fg-2)}
.tier--pro .tier__per{color:color-mix(in srgb,var(--bg) 70%,transparent)}
.tier__for{margin-top:16px;color:var(--fg-2);font-size:var(--fs-sm);max-width:34ch}
.tier--pro .tier__for{color:color-mix(in srgb,var(--bg) 76%,transparent)}
.tier__list{margin-top:26px;padding-top:24px;border-top:1px solid var(--line);
  display:grid;gap:11px;align-content:start;flex:1}
.tier--pro .tier__list{border-top-color:color-mix(in srgb,var(--bg) 22%,transparent)}
.tier__list li{position:relative;padding-left:25px;font-size:var(--fs-sm)}
.tier__list li::before{content:"";position:absolute;left:0;top:.44em;width:11px;height:6px;
  border-left:2px solid var(--acc);border-bottom:2px solid var(--acc);
  transform:rotate(-45deg)}
/* Full width and self-stretched so both tiers end on the same line, whatever
   the feature counts are. align-self:flex-start left them ragged. */
.tier__btn{margin-top:30px;align-self:stretch;width:100%}
.tier--pro .btn--solid{background:var(--acc);color:var(--acc-ink)}
.tier--pro .btn--solid:hover{background:color-mix(in srgb,var(--acc) 88%,#fff)}
.price__note{margin-top:26px;font-size:var(--fs-sm);color:var(--fg-2)}

/* ---------- cta ---------- */
.cta{background:var(--deep);color:var(--deep-ink);padding-block:clamp(76px,10vw,140px)}
/* The base ring is only 2.2:1 on the deep band; lift it to clear 3:1. */
.cta :focus-visible{outline-color:var(--acc-on-dark)}
.cta__in{display:grid;justify-items:start}
.cta__h{font-family:var(--ff-d);font-weight:800;font-size:var(--fs-h2);letter-spacing:-.035em;
  line-height:1.02;max-width:15ch;font-variation-settings:"wdth" 98,"opsz" 96}
.cta__p{margin-top:20px;max-width:44ch;font-size:var(--fs-lead);line-height:1.5;
  color:color-mix(in srgb,#fff 84%,transparent)}
.cta__row{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}

/* ---------- footer ---------- */
.ft{padding-block:clamp(42px,5vw,64px);border-top:1px solid var(--line-2)}
.ft__in{display:grid;gap:12px}
.ft__b{font-family:var(--ff-d);font-weight:800;font-size:1.02rem;letter-spacing:-.03em}
.ft__d{color:var(--fg-2);font-size:var(--fs-sm);max-width:40ch}
.ft__nav{display:flex;flex-wrap:wrap;gap:20px;margin-top:6px}
.ft__nav a{font-size:var(--fs-sm);color:var(--fg-2);text-decoration:none;
  transition:color .2s var(--ease)}
.ft__nav a:hover{color:var(--acc)}
.ft__c{color:var(--fg-2);font-size:var(--fs-xs);margin-top:6px}

/* ---------- reveals ---------- */
.rv{opacity:0;transform:translateY(20px);
  transition:opacity .72s var(--ease),transform .72s var(--ease);
  transition-delay:var(--d,0s)}
.rv.is-in{opacity:1;transform:none}

/* =========================================================
   RESPONSIVE
   ========================================================= */

/* --- mobile nav (below 900) --- */
@media (max-width:899px){
  .burger{display:inline-flex}
  .nav{position:fixed;inset:68px 0 auto 0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--bg);border-bottom:1px solid var(--line);
    padding:8px var(--gut) 26px;
    transform:translateY(-8px);opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .26s var(--ease),transform .26s var(--ease),visibility .26s}
  .nav.is-open{transform:none;opacity:1;visibility:visible;pointer-events:auto}
  .nav__list{flex-direction:column;align-items:stretch;gap:0}
  .nav__list a{display:block;padding:15px 0;font-size:1.06rem;color:var(--fg);
    border-bottom:1px solid var(--line-2)}
  .nav__cta{margin-top:20px;width:100%;min-height:50px;font-size:var(--fs-sm)}
}

/* --- 620+ : serp gets action buttons, stats pair up --- */
@media (min-width:620px){
  .serp__act{display:flex}
  .price__grid{grid-template-columns:repeat(2,1fr)}
  .cta__row .btn{min-width:0}
}

/* --- 900+ : desktop --- */
@media (min-width:900px){
  .hero{padding-top:clamp(56px,5.5vw,88px)}
  .hero__grid{grid-template-columns:minmax(0,1.02fr) minmax(0,1.18fr);
    gap:clamp(44px,4.5vw,72px)}
  .hero__h{font-variation-settings:"wdth" 94,"opsz" 96}

  .blk__grid{grid-template-columns:minmax(0,1.06fr) minmax(0,1fr);
    gap:clamp(48px,5vw,86px)}
  .blk__grid--flip .blk__copy{order:1}
  .blk__grid--flip .blk__vis{order:2}

  /* Three equal columns on one shared baseline. The rule above each stat is a
     single continuous line broken only by the gutters, so the row reads as one
     ruled band rather than three offset cards. */
  .stats__grid{grid-template-columns:repeat(3,1fr);column-gap:clamp(28px,3.4vw,52px)}
  .stat{grid-column:auto}
  .stat__t{max-width:30ch}
  /* Three across needs a smaller ceiling than one across, or the numeral
     crowds the gutter at 1240. */
  .stat__n{font-size:clamp(3.4rem,1.6rem + 4.4vw,5.4rem)}

  .proc__grid{grid-template-columns:minmax(0,.82fr) minmax(0,1.4fr);
    gap:clamp(50px,6vw,100px);align-items:start}
  .proc__side{position:sticky;top:118px}
  .proc__mark{display:block}
  .step{gap:34px}

  .svc__sum{font-size:var(--fs-body)}
}

@media (min-width:1100px){
  .hero__h{font-size:clamp(2.7rem,1.2rem + 3.3vw,3.85rem)}
  .cta__in{grid-template-columns:1fr auto;align-items:end;column-gap:60px}
  .cta__h{grid-column:1;grid-row:1}
  .cta__p{grid-column:1;grid-row:2}
  .cta__row{grid-column:2;grid-row:1 / span 2;align-self:end;margin-top:0;
    flex-direction:column;align-items:stretch}
}

/* --- narrow phones --- */
@media (max-width:400px){
  .serp__bar{flex-wrap:wrap;row-gap:4px}
  .serp__loc{margin-left:0;width:100%}
  .geo__pair{gap:8px}
  .geo__arrow svg{width:16px;height:16px}
  .svc__btn{gap:12px}
  .svc__ico{width:38px;height:38px}
  .svc__ico svg{width:18px;height:18px}
  .svc__inner{padding-left:0}
}

/* =========================================================
   REDUCED MOTION
   ========================================================= */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
  .mq__track{animation:none;transform:none}
  .mq{-webkit-mask-image:none;mask-image:none}
  .mq__track{overflow-x:auto}
}

html{scroll-behavior:smooth}
[id]{scroll-margin-top:88px}