/* CurbChecker — shared stylesheet.
   Self-hosted fonts only. This site makes no third-party requests of any kind:
   the privacy policy promises it, so keep it that way (no CDNs, no analytics). */

@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;
  src:url(/assets/fonts/archivo.woff2) format("woff2")}
@font-face{font-family:"Public Sans";font-style:normal;font-weight:100 900;font-display:swap;
  src:url(/assets/fonts/public-sans.woff2) format("woff2")}
@font-face{font-family:"Public Sans";font-style:italic;font-weight:100 900;font-display:swap;
  src:url(/assets/fonts/public-sans-italic.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;
  src:url(/assets/fonts/jetbrains-mono.woff2) format("woff2")}

:root{
  --paper:#f6f4ef;
  --card:#fffdf9;
  --sunk:#eeebe4;
  --ink:#14171c;
  --ink-soft:#454a53;
  --ink-faint:#646973;
  --rule:#d9d4ca;
  --rule-soft:#e7e3da;

  /* The extension's own verdict vocabulary is the only accent palette.
     Someone who has never installed it learns the colour code by reading the page. */
  --go:#1f6f43;
  --go-strong:#185a36;
  --go-bg:#e6f0e9;
  --check:#a35a06;
  --check-bg:#f8ecda;
  --away:#b02a2a;
  --away-bg:#f6e3e1;
  --grey:#6b7079;
  --grey-bg:#e9e7e2;

  --band:#14171c;
  --band-ink:#eef0f2;
  --band-soft:#b4bac3;

  --focus:#1f6f43;
  --radius:8px;
  --radius-lg:14px;
  --shadow:0 1px 2px rgba(20,23,28,.06),0 8px 24px -8px rgba(20,23,28,.14);
  --shadow-lg:0 2px 4px rgba(20,23,28,.06),0 24px 48px -16px rgba(20,23,28,.28);

  --display:"Archivo","Arial Narrow",ui-sans-serif,system-ui,sans-serif;
  --body:"Public Sans",ui-sans-serif,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --wide:76rem;
  --measure:42rem;
}

@media (prefers-color-scheme: dark){
  :root{
    --paper:#121418;
    --card:#1a1d22;
    --sunk:#16191d;
    --ink:#f1f2f4;
    --ink-soft:#bcc2cb;
    --ink-faint:#949ba6;
    --rule:#30343b;
    --rule-soft:#262a30;
    --go:#5cc48c;
    --go-strong:#7fd6a6;
    --go-bg:#15271d;
    --check:#e3ab5b;
    --check-bg:#2a2115;
    --away:#f08b8b;
    --away-bg:#2d1a1a;
    --grey:#a3a9b2;
    --grey-bg:#24272c;
    --band:#0b0c0f;
    --band-ink:#eef0f2;
    --band-soft:#a9b0ba;
    --focus:#5cc48c;
    --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px -8px rgba(0,0,0,.5);
    --shadow-lg:0 2px 4px rgba(0,0,0,.3),0 24px 48px -16px rgba(0,0,0,.7);
  }
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5.5rem}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{transition:none !important}}
[hidden]{display:none !important}

body{
  margin:0;background:var(--paper);color:var(--ink);
  /* rem-based so browser zoom and OS text-size settings both work. */
  font-family:var(--body);font-size:1.0625rem;line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--go);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{color:var(--go-strong);text-decoration-thickness:2px}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{
  outline:3px solid var(--focus);outline-offset:3px;border-radius:4px;
}
::selection{background:var(--go-bg);color:var(--ink)}
code{font-family:var(--mono);font-size:.85em;background:var(--sunk);border:1px solid var(--rule-soft);
  border-radius:4px;padding:.08em .35em;white-space:nowrap}

h1,h2,h3{font-family:var(--display);font-stretch:88%;color:var(--ink);text-wrap:balance}
h1{font-weight:800;font-size:clamp(2.25rem,1.4rem + 3.6vw,4rem);line-height:1.02;letter-spacing:-.025em;margin:0 0 1.25rem}
h2{font-weight:750;font-size:clamp(1.6rem,1.2rem + 1.6vw,2.4rem);line-height:1.1;letter-spacing:-.02em;margin:0 0 1rem}
h3{font-weight:700;font-size:1.25rem;line-height:1.25;letter-spacing:-.01em;margin:0 0 .5rem}
p{margin:0 0 1rem}

.shell{max-width:var(--wide);margin:0 auto;padding:0 2rem}
@media (max-width:40rem){.shell{padding:0 1.25rem}}

.skip{position:absolute;left:-9999px;top:0;background:var(--card);color:var(--ink);
  padding:.75rem 1rem;border:2px solid var(--focus);z-index:50}
.skip:focus{left:1rem;top:1rem}

.kicker{flex-wrap:wrap;
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--mono);font-size:.75rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-faint);margin:0 0 .9rem;
}
.kicker::before{content:"";width:1.25rem;height:2px;background:currentColor;opacity:.6}

/* ---------- header ---------- */
.topbar{
  position:sticky;top:0;z-index:40;
  background:color-mix(in srgb,var(--paper) 92%,transparent);
  -webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid var(--rule);
}
.topbar-in{display:flex;align-items:center;gap:1.5rem 2rem;flex-wrap:wrap;min-height:4.25rem;padding-block:.6rem}
.brand{
  font-family:var(--display);font-stretch:85%;font-weight:800;font-size:1.4rem;letter-spacing:-.02em;
  color:var(--ink);text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;gap:.55rem;
}
.brand:hover{color:var(--ink)}
.brand-word span{color:var(--go)}
.brand-mark{display:inline-flex;gap:3px}
.brand-mark i{display:block;width:6px;height:18px;border-radius:2px}
.brand-mark i:nth-child(1){background:var(--go)}
.brand-mark i:nth-child(2){background:var(--check)}
.brand-mark i:nth-child(3){background:var(--away)}
.mainnav{display:flex;gap:.25rem 1.6rem;flex-wrap:wrap;margin-left:auto}
.mainnav a{
  color:var(--ink-soft);text-decoration:none;font-size:.975rem;font-weight:500;
  padding:.35rem 0;border-bottom:2px solid transparent;
}
.mainnav a:hover{color:var(--ink);border-bottom-color:var(--rule)}
.mainnav a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--go)}
.hdr-cta{
  display:inline-flex;align-items:center;gap:.4rem;text-decoration:none;white-space:nowrap;
  font-weight:600;font-size:.9375rem;color:#fff;background:var(--go);
  padding:.55rem 1rem;border-radius:999px;
}
.hdr-cta:hover{color:#fff;background:var(--go-strong)}
@media (prefers-color-scheme: dark){.hdr-cta,.hdr-cta:hover{color:#0d1a12}}
html.cant-install .hdr-cta{display:none}
@media (max-width:64rem){.hdr-cta{display:none}}
@media (max-width:48rem){
  .topbar{position:static}
  .topbar-in{gap:.35rem 1rem;padding-block:.85rem}
  .mainnav{margin-left:0;flex-basis:100%;gap:.15rem 1.15rem}
  .mainnav a{font-size:.9375rem}
}

/* ---------- buttons & CTA stack ---------- */
.install{
  display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;
  background:var(--go);color:#fff;
  font-size:1.0625rem;font-weight:650;line-height:1.2;
  padding:.95rem 1.4rem;border-radius:var(--radius);
  box-shadow:0 1px 0 rgba(255,255,255,.15) inset,0 6px 16px -6px rgba(31,111,67,.6);
  transition:background .15s ease,transform .15s ease;
}
.install:hover{background:var(--go-strong);color:#fff;transform:translateY(-1px)}
@media (prefers-color-scheme: dark){.install,.install:hover{color:#0d1a12}}
.install svg{flex:none}
.cta-stack{max-width:34rem}
.buyrow{display:flex;align-items:center;gap:.75rem 1.1rem;flex-wrap:wrap}
.price{color:var(--ink-soft);font-size:.975rem;line-height:1.45}
.price b{color:var(--ink);font-weight:700}
.assure{margin:.9rem 0 0;font-size:.9375rem;color:var(--ink-soft)}
.device{margin:1rem 0 0;padding-top:.9rem;border-top:1px solid var(--rule-soft);font-size:.9375rem;color:var(--ink-faint)}
.device-phone{display:none}

/* Desktop: no email button at all. You're already on the machine you'd
   install on. It survives only as a small inline link with a stated reason. */
.on-phone{display:none}
.handoff{display:none;margin:0}
.handoff a{
  display:block;text-align:center;text-decoration:none;font-weight:650;
  background:var(--go);color:#fff;border:1px solid var(--go);
  border-radius:var(--radius);font-size:1.0625rem;padding:.95rem 1.2rem;
}
.handoff a:hover{background:var(--go-strong);color:#fff}
@media (prefers-color-scheme: dark){.handoff a,.handoff a:hover{color:#0d1a12}}

/* Mobile CTA inversion. Phones cannot run extensions, so "Add to Chrome"
   is the wrong primary action there. When it applies, the order flips: the
   constraint is stated first, sending yourself the link becomes the filled
   button, and Add to Chrome demotes to a plain link. DOM order is unchanged,
   so screen readers are unaffected.
   - No JS: viewport width alone (this media query) — the safe floor.
   - JS present: the head script's html.can-install / html.cant-install
     answer overrides width in BOTH directions. A wrong guess only changes
     emphasis — both actions stay on the page either way. */
@media (max-width:48rem){
  html:not(.can-install) .cta-stack{display:flex;flex-direction:column}
  html:not(.can-install) .cta-stack .device{order:1;margin:0 0 1rem;padding-top:0;border-top:0;color:var(--ink-soft);font-size:1rem;display:block}
  html:not(.can-install) .cta-stack .handoff{order:2;display:block;margin:0 0 1.25rem}
  html:not(.can-install) .cta-stack .buyrow{order:3;padding-top:1rem;border-top:1px solid var(--rule-soft)}
  html:not(.can-install) .cta-stack .assure{order:4}
  html:not(.can-install) .on-desktop{display:none}
  html:not(.can-install) .on-phone{display:inline}
  html:not(.can-install) .install{background:transparent;color:var(--go);border:1px solid var(--rule);box-shadow:none;
    font-size:.9375rem;padding:.6rem .95rem;transform:none}
  html:not(.can-install) .install:hover{border-color:var(--go)}
  html:not(.can-install) .price{font-size:.9375rem}
}
html.cant-install .cta-stack{display:flex;flex-direction:column}
html.cant-install .cta-stack .device{order:1;margin:0 0 1rem;padding-top:0;border-top:0;color:var(--ink-soft);font-size:1rem;display:block}
html.cant-install .cta-stack .handoff{order:2;display:block;margin:0 0 1.25rem}
html.cant-install .cta-stack .buyrow{order:3;padding-top:1rem;border-top:1px solid var(--rule-soft)}
html.cant-install .cta-stack .assure{order:4}
html.cant-install .on-desktop{display:none}
html.cant-install .on-phone{display:inline}
html.cant-install .install{background:transparent;color:var(--go);border:1px solid var(--rule);box-shadow:none;
  font-size:.9375rem;padding:.6rem .95rem;transform:none}
html.cant-install .install:hover{border-color:var(--go)}
html.cant-install .price{font-size:.9375rem}

.btn-quiet{
  display:inline-flex;align-items:center;gap:.4rem;text-decoration:none;font-weight:650;
  color:var(--ink);border:1px solid var(--rule);background:var(--card);
  padding:.7rem 1.1rem;border-radius:var(--radius);
}
.btn-quiet:hover{color:var(--ink);border-color:var(--ink-soft)}
.more{font-weight:650;text-decoration:none;display:inline-flex;gap:.35rem;align-items:center}
.more:hover{text-decoration:underline}

/* ---------- home: hero ---------- */
.hero{padding:4.5rem 0 4rem;position:relative}
.hero-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.25fr);gap:3.5rem;align-items:center}
.hero h1{max-width:13ch}
.hero .lede{font-size:1.2rem;line-height:1.55;color:var(--ink-soft);max-width:33rem;margin:0 0 2rem}
.hero-shot{margin:0;position:relative}
.browser{
  background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-lg);
  overflow:hidden;box-shadow:var(--shadow-lg);
}
.browser-bar{display:flex;align-items:center;gap:.75rem;padding:.6rem .85rem;border-bottom:1px solid var(--rule-soft);background:var(--sunk)}
.browser-dots{display:flex;gap:5px}
.browser-dots i{width:9px;height:9px;border-radius:50%;background:var(--rule)}
.browser-url{flex:1;min-width:0;font-family:var(--mono);font-size:.72rem;color:var(--ink-faint);background:var(--card);
  border:1px solid var(--rule-soft);border-radius:999px;padding:.2rem .8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.panel-float{
  position:absolute;left:-1.75rem;bottom:-2rem;width:10rem;
  border-radius:10px;border:1px solid var(--rule);box-shadow:var(--shadow-lg);background:#fff;
}
.hero-shot figcaption{margin-top:.85rem;font-size:.875rem;color:var(--ink-faint);padding-left:9.5rem}
@media (max-width:60rem){
  .hero{padding:3rem 0 3rem}
  .hero-grid{grid-template-columns:minmax(0,1fr);gap:2.5rem}
  .hero h1{max-width:16ch}
  .panel-float{left:-.5rem;bottom:-1.5rem;width:7rem}
  .hero-shot figcaption{padding-left:7.5rem}
}
@media (max-width:30rem){.panel-float{display:none}.hero-shot figcaption{padding-left:0}}

/* ---------- home: trust strip ---------- */
.facts{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:var(--card)}
.facts ul{list-style:none;margin:0 auto;padding-block:0;display:grid;grid-template-columns:repeat(4,1fr)}
.facts li{padding:1.4rem 1.5rem;border-left:1px solid var(--rule-soft)}
.facts li:first-child{border-left:0;padding-left:0}
.facts b{display:block;font-family:var(--display);font-stretch:88%;font-weight:750;font-size:1.3rem;letter-spacing:-.01em;line-height:1.2}
.facts span{display:block;font-size:.9375rem;color:var(--ink-soft);margin-top:.2rem}
@media (max-width:60rem){
  .facts ul{grid-template-columns:1fr 1fr}
  .facts li{border-left:0;padding:1.1rem 0;border-top:1px solid var(--rule-soft)}
  .facts li:nth-child(-n+2){border-top:0}
  .facts li:nth-child(even){padding-left:1.25rem;border-left:1px solid var(--rule-soft)}
}

/* ---------- sections ---------- */
.section{padding:6rem 0}
.section + .section{padding-top:0}
.section-head{max-width:44rem;margin:0 0 2.75rem}
.section-head p{font-size:1.125rem;color:var(--ink-soft);margin:0}
@media (max-width:48rem){.section{padding:4rem 0}}

/* ---------- verdicts (the signature) ---------- */
.verdicts{display:grid;gap:1rem;grid-template-columns:repeat(4,minmax(0,1fr));margin:1.5rem 0 2rem}
.verdict{
  position:relative;background:var(--card);border:1px solid var(--rule);border-radius:var(--radius);
  padding:1.6rem 1.35rem 1.35rem;overflow:hidden;
}
.verdict::before{content:"";position:absolute;inset:0 0 auto 0;height:6px;background:var(--grey)}
.verdict h3{
  font-family:var(--mono);font-stretch:100%;font-size:.8rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;
  display:inline-block;padding:.3rem .6rem;border-radius:4px;margin:0 0 .85rem;line-height:1.3;
  background:var(--grey-bg);color:var(--grey);
}
.verdict p{margin:0;font-size:1rem;line-height:1.55;color:var(--ink)}
.v-go::before{background:var(--go)} .v-go h3{background:var(--go-bg);color:var(--go)}
.v-check::before{background:var(--check)} .v-check h3{background:var(--check-bg);color:var(--check)}
.v-away::before{background:var(--away)} .v-away h3{background:var(--away-bg);color:var(--away)}
.v-grey::before{background:var(--grey)}
@media (max-width:64rem){.verdicts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:34rem){.verdicts{grid-template-columns:minmax(0,1fr)}}
.doc .verdicts{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:34rem){.doc .verdicts{grid-template-columns:minmax(0,1fr)}}

/* ---------- steps ---------- */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0;counter-reset:step;
  border-top:2px solid var(--ink)}
.steps li{padding:1.5rem 2rem 0 0;counter-increment:step}
.steps li + li{padding-left:2rem;border-left:1px solid var(--rule)}
.steps li::before{content:"0" counter(step);display:block;font-family:var(--mono);font-size:.8rem;color:var(--ink-faint);margin-bottom:1.25rem;letter-spacing:.06em}
.steps h3{font-size:1.35rem}
.steps p{color:var(--ink-soft);margin:0}
@media (max-width:52rem){
  .steps{grid-template-columns:minmax(0,1fr)}
  .steps li,.steps li + li{padding:1.25rem 0 1.5rem;border-left:0;border-bottom:1px solid var(--rule)}
  .steps li::before{margin-bottom:.6rem}
}

/* ---------- feature rows ---------- */
.feature{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:4rem;align-items:center;padding:3.5rem 0;border-top:1px solid var(--rule)}
.feature:first-child{border-top:0;padding-top:0}
.feature.flip .feature-text{order:2}
.feature-text p{color:var(--ink-soft)}
.feature-text h3{font-size:clamp(1.4rem,1.1rem + 1vw,1.9rem);line-height:1.15;margin-bottom:1rem}
.quote{
  color:var(--ink);background:var(--card);border:1px solid var(--rule);border-left:4px solid var(--go);
  border-radius:0 var(--radius) var(--radius) 0;padding:1rem 1.15rem;font-size:1rem;
}
@media (max-width:56rem){
  .feature{grid-template-columns:minmax(0,1fr);gap:1.75rem;padding:2.5rem 0}
  .feature.flip .feature-text{order:0}
}

/* ---------- figures ---------- */
.shot{margin:0}
.shot img{border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:var(--shadow);background:var(--card)}
.shot figcaption,.proof figcaption{margin-top:.7rem;font-size:.875rem;color:var(--ink-faint)}
.proof{margin:2rem 0 2.25rem}
.proof img{border:1px solid var(--rule);border-radius:var(--radius);box-shadow:var(--shadow);background:var(--card)}

/* ---------- dark band ---------- */
.band{background:var(--band);color:var(--band-ink);padding:6rem 0}
.band h2{color:var(--band-ink);font-size:clamp(2rem,1.3rem + 3vw,3.5rem);max-width:14ch}
.band .kicker{color:var(--band-soft)}
.band-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:4rem;align-items:start}
.band p{color:var(--band-soft);font-size:1.125rem}
.band p strong{color:var(--band-ink)}
.band .band-why{border-top:1px solid rgba(255,255,255,.14);padding-top:1.1rem;margin-top:1.5rem;font-size:1rem}
.band ul.nevers{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.6rem 1.5rem}
.band ul.nevers li{display:flex;gap:.6rem;align-items:baseline;color:var(--band-ink);font-size:1rem}
.band ul.nevers li::before{content:"";flex:none;width:.65rem;height:2px;background:#f08b8b;transform:translateY(-.25rem)}
@media (max-width:56rem){.band{padding:4rem 0}.band-grid{grid-template-columns:minmax(0,1fr);gap:1.5rem}}
@media (max-width:30rem){.band ul.nevers{grid-template-columns:minmax(0,1fr)}}

/* ---------- story ---------- */
.story{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:4rem;align-items:center}
.story figure{margin:0}
.story img{border-radius:var(--radius-lg);aspect-ratio:3/2;object-fit:cover;width:100%}
.story figcaption{margin-top:.7rem;font-size:.875rem;color:var(--ink-faint)}
.story blockquote{
  margin:1.5rem 0;padding:0 0 0 1.25rem;border-left:3px solid var(--go);
  font-family:var(--display);font-stretch:92%;font-weight:600;font-size:1.35rem;line-height:1.35;color:var(--ink);letter-spacing:-.01em;
}
.story-stats{display:flex;gap:2rem;flex-wrap:wrap;margin:1.5rem 0;padding:1rem 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.story-stats div{font-family:var(--mono);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint)}
.story-stats b{display:block;font-family:var(--display);font-stretch:88%;font-size:1.5rem;letter-spacing:-.01em;text-transform:none;color:var(--ink);font-weight:750}
.story p{color:var(--ink-soft)}
@media (max-width:56rem){.story{grid-template-columns:minmax(0,1fr);gap:2rem}}

/* ---------- model spec sheet ---------- */
.sheet{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-lg);padding:.5rem 2rem;box-shadow:var(--shadow)}
.sheet dl,.models dl{margin:0;display:grid;grid-template-columns:1fr 1fr;column-gap:3rem}
.sheet dl > div,.models dl > div{display:grid;grid-template-columns:8.5rem 1fr;gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--rule-soft)}
.sheet dt,.models dt{font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint);padding-top:.15rem}
.sheet dd,.models dd{margin:0;font-size:1rem;color:var(--ink)}
.q{font-family:var(--mono);font-size:.78em;color:var(--check);background:var(--check-bg);border-radius:3px;padding:.05em .35em;white-space:nowrap}
.scope{margin:1.1rem 0 0;font-size:.9375rem;color:var(--ink-faint);max-width:44rem}
@media (max-width:52rem){.sheet{padding:.25rem 1.25rem}.sheet dl,.models dl{grid-template-columns:minmax(0,1fr)}}
@media (max-width:30rem){.sheet dl > div,.models dl > div{grid-template-columns:minmax(0,1fr);gap:.15rem}}

/* ---------- doors ---------- */
.doors{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.door{
  display:flex;flex-direction:column;text-decoration:none;color:inherit;background:var(--card);
  border:1px solid var(--rule);border-radius:var(--radius-lg);overflow:hidden;
}
a.door:hover{border-color:var(--go);color:inherit}
a.door:hover .more{text-decoration:underline}
.door img{aspect-ratio:16/7;object-fit:cover;width:100%}
.door-body{padding:1.75rem;display:flex;flex-direction:column;gap:.25rem;flex:1}
.door h2{font-size:1.6rem;margin:0 0 .4rem}
.door p{color:var(--ink-soft);margin:0 0 1rem}
.door .more{margin-top:auto;color:var(--go)}
.door--soon{background:transparent;border-style:dashed}
.door--soon .door-body{justify-content:center}
.door--soon h2{color:var(--ink-soft)}
.soon{
  align-self:flex-start;font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-faint);background:var(--sunk);border:1px solid var(--rule-soft);border-radius:999px;padding:.25rem .7rem;margin:0 0 .9rem;
}
.notify{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.5rem}
.notify label{flex-basis:100%;font-size:.9375rem;font-weight:600;color:var(--ink)}
.notify input{
  flex:1 1 12rem;min-width:0;font:inherit;font-size:1rem;padding:.75rem .9rem;
  border:1px solid var(--rule);border-radius:var(--radius);background:var(--card);color:var(--ink);
}
.notify input:focus{border-color:var(--go)}
.notify button{
  font:inherit;font-size:1rem;font-weight:650;cursor:pointer;padding:.75rem 1.2rem;
  border:1px solid var(--go);border-radius:var(--radius);background:transparent;color:var(--go);
}
.notify button:hover{background:var(--go-bg)}
@media (max-width:52rem){.doors{grid-template-columns:minmax(0,1fr)}}

/* ---------- closing CTA ---------- */
.closer{
  background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:var(--shadow);
  padding:3rem;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem;align-items:center;position:relative;overflow:hidden;
}
.closer::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:linear-gradient(var(--go) 0 33.3%,var(--check) 33.3% 66.6%,var(--away) 66.6%)}
.closer h2{margin:0 0 .75rem}
.closer > div > p{color:var(--ink-soft);margin:0}
@media (max-width:56rem){.closer{grid-template-columns:minmax(0,1fr);padding:2rem 1.5rem 2rem 2rem;gap:1.75rem}}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--rule);background:var(--card);padding:3.5rem 0 3rem;margin-top:5rem}
main > .section:last-child{padding-bottom:0}
.fgrid{display:grid;gap:2.5rem;grid-template-columns:1.4fr 1fr 1fr}
.fbrand p{color:var(--ink-soft);font-size:.9375rem;max-width:22rem;margin:.75rem 0 0}
.fgrid h2{font-family:var(--mono);font-stretch:100%;font-size:.75rem;font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 .9rem}
.fgrid ul{list-style:none;margin:0;padding:0}
.fgrid li{margin-bottom:.55rem}
.fgrid a{color:var(--ink-soft);text-decoration:none;font-size:1rem}
.fgrid a:hover{color:var(--go);text-decoration:underline}
.fine{margin:2.5rem 0 0;padding-top:1.5rem;border-top:1px solid var(--rule-soft);font-size:.9375rem;color:var(--ink-faint);
  display:flex;justify-content:space-between;gap:1rem 3rem;flex-wrap:wrap}
.fine p{margin:0;max-width:46rem}
@media (max-width:48rem){.fgrid{grid-template-columns:1fr 1fr}.fbrand{grid-column:1/-1}}

/* ---------- inner pages ---------- */
.page-head{padding-block:3.5rem 3rem;border-bottom:1px solid var(--rule)}
.page-head h1{font-size:clamp(2.1rem,1.4rem + 3vw,3.5rem);max-width:20ch}
.page-head .standfirst{font-size:1.2rem;line-height:1.55;color:var(--ink-soft);max-width:44rem;margin:0}
.page-head .date{font-family:var(--mono);font-size:.8rem;color:var(--ink-faint);margin:1.25rem 0 0;letter-spacing:.03em}
.page-head .cta-stack{margin-top:2rem}
.crumbs{font-family:var(--mono);font-size:.78rem;letter-spacing:.03em;color:var(--ink-faint);margin:0 0 1.5rem}
.crumbs a{color:var(--ink-faint)}
.crumbs a:hover{color:var(--go)}
.page-hero-img{margin:2.5rem 0 0}
.page-hero-img img{border-radius:var(--radius-lg);aspect-ratio:21/8;object-fit:cover;width:100%}
.page-hero-img figcaption{margin-top:.6rem;font-size:.875rem;color:var(--ink-faint)}
.page-head--split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:3.5rem;align-items:center}
.page-head--split h1{max-width:12ch}
@media (max-width:60rem){.page-head--split{grid-template-columns:minmax(0,1fr);gap:2.25rem}}

.doc-wrap{display:grid;grid-template-columns:15rem minmax(0,1fr);gap:4rem;padding-top:3rem;align-items:start}
.doc-wrap--plain{grid-template-columns:minmax(0,1fr)}
.doc{max-width:var(--measure);min-width:0}
.doc-wrap--plain .doc{margin:0}
.doc > h2,.doc section > h2,.doc .fix > h2,.doc .last > h2{font-size:clamp(1.45rem,1.2rem + .9vw,1.85rem);margin:3rem 0 .9rem}
.doc > h2:first-child,.doc section:first-child > h2{margin-top:0}
.doc section{scroll-margin-top:6rem}
.doc h3{margin-top:1.75rem}
.doc p,.doc li,.doc dd{color:var(--ink-soft)}
.doc strong{color:var(--ink)}
.doc ol,.doc ul{padding-left:1.25rem;margin:0 0 1rem}
.doc li{margin-bottom:.45rem}
.doc dl{margin:1.5rem 0}
.doc dl dt{font-weight:700;color:var(--ink);margin-top:1rem}
.doc dl dd{margin:.2rem 0 0;padding-left:1rem;border-left:2px solid var(--rule)}
.small-print{font-size:.9375rem;color:var(--ink-faint) !important}

.toc{position:sticky;top:6rem;font-size:.9375rem}
.toc h2{font-family:var(--mono);font-stretch:100%;font-size:.75rem;font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 .9rem}
.toc ol{list-style:none;margin:0;padding:0;border-left:1px solid var(--rule);counter-reset:toc}
.toc li{counter-increment:toc}
.toc a{display:flex;gap:.6rem;padding:.4rem 0 .4rem 1rem;margin-left:-1px;border-left:2px solid transparent;color:var(--ink-soft);text-decoration:none;line-height:1.35}
.toc a::before{content:counter(toc,decimal-leading-zero);font-family:var(--mono);font-size:.72rem;color:var(--ink-faint);padding-top:.15rem}
.toc a:hover{color:var(--ink);border-left-color:var(--go)}
@media (max-width:60rem){
  .doc-wrap{grid-template-columns:minmax(0,1fr);gap:2rem}
  .toc{position:static;background:var(--card);border:1px solid var(--rule);border-radius:var(--radius);padding:1.25rem 1.25rem .75rem}
}

.note,.first,.headline{
  background:var(--card);border:1px solid var(--rule);border-left:4px solid var(--go);
  border-radius:0 var(--radius) var(--radius) 0;padding:1.15rem 1.35rem;margin:1.75rem 0;
}
.note p,.first p,.headline p{margin:0;color:var(--ink-soft)}
.note p + p{margin-top:.75rem}
.first{border-left-color:var(--check)}
.pull{margin:2rem 0;padding:.25rem 0 .25rem 1.4rem;border-left:3px solid var(--go)}
.pull p{font-family:var(--display);font-stretch:92%;font-weight:600;font-size:1.4rem;line-height:1.35;color:var(--ink) !important;letter-spacing:-.01em;margin:0}

.fix,.last{border-top:1px solid var(--rule);padding-top:.5rem;margin-top:2.5rem}
.fix > h2,.last > h2{margin-top:1.25rem !important}

.addr{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-lg);padding:2rem;margin:0 0 2.5rem;box-shadow:var(--shadow)}
.addr a{font-family:var(--display);font-stretch:88%;font-weight:750;font-size:clamp(1.4rem,1rem + 2vw,2.1rem);letter-spacing:-.015em;text-decoration:none;word-break:break-word}
.addr a:hover{text-decoration:underline}
.addr p{margin:.6rem 0 0 !important}

.split{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.5rem 0}
.split > div{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius);padding:1.25rem 1.35rem}
.split h3{margin-top:0 !important}
.split p{margin:0}
@media (max-width:40rem){.split{grid-template-columns:minmax(0,1fr)}}

/* learn page */
.order{counter-reset:ord;list-style:none;padding:0 !important}
.order li{counter-increment:ord;position:relative;padding:.9rem 0 .9rem 3rem;border-bottom:1px solid var(--rule-soft);margin:0}
.order li::before{content:counter(ord);position:absolute;left:0;top:.85rem;width:2rem;height:2rem;border-radius:50%;
  display:grid;place-items:center;font-family:var(--mono);font-size:.85rem;background:var(--ink);color:var(--paper)}
.doc .tool{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius);padding:1.25rem 1.35rem;margin:1rem 0;position:relative}
.doc .tool h3{margin:0 5rem .5rem 0;font-size:1.15rem}
.doc .tool p{margin:0 0 .6rem}
.doc .tool p:last-child{margin:0}
.cost{position:absolute;top:1.2rem;right:1.2rem;font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;border-radius:4px;padding:.2rem .5rem}
.cost-free{background:var(--go-bg);color:var(--go)}
.cost-paid{background:var(--check-bg);color:var(--check)}
.limit{font-size:.9375rem;padding-top:.6rem;border-top:1px dashed var(--rule)}

.cta{display:inline-flex;font-weight:650;text-decoration:none;border:1px solid var(--rule);background:var(--card);padding:.7rem 1.1rem;border-radius:var(--radius);color:var(--ink)}
.cta:hover{border-color:var(--go);color:var(--go)}

/* product page */
.models{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-lg);padding:.25rem 1.5rem;margin:1.25rem 0 0}
.models dl{grid-template-columns:minmax(0,1fr)}
.models dl > div{grid-template-columns:7.5rem 1fr}
.models dl > div:last-child{border-bottom:0}
.buy{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-lg);padding:1.75rem;margin:2rem 0;box-shadow:var(--shadow)}

/* thanks */
.thanks{max-width:40rem;margin:0 auto;padding-top:5rem;text-align:left}
.tick{width:3.5rem;height:3.5rem;border-radius:50%;display:grid;place-items:center;background:var(--go-bg);color:var(--go);font-size:1.6rem;font-weight:700;margin-bottom:1.5rem}
.thanks > p{color:var(--ink-soft);font-size:1.125rem}
.aside{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-lg);padding:1.75rem;margin:2.5rem 0}
.aside h2{font-size:1.5rem}
.aside p{color:var(--ink-soft)}
.btn{display:inline-flex;text-decoration:none;font-weight:650;background:var(--go);color:#fff;padding:.8rem 1.25rem;border-radius:var(--radius)}
.btn:hover{background:var(--go-strong);color:#fff}
@media (prefers-color-scheme: dark){.btn,.btn:hover{color:#0d1a12}}
.back a{font-weight:600}
