/* Page sections for Home, Product, Pricing, Pilot, Privacy and 404. Colours and fonts from tokens.css only. */
@layer tokens, base, components, sections, utilities;

@layer sections{
  /* ---------- quiet entrances: visible by default, eased in once when site.js is running and motion is on ---------- */
  [data-reveal]{transition:opacity .8s var(--ease-out), transform .8s var(--ease-out);transition-delay:calc(var(--i, 0) * 90ms)}
  .reveal-ready.motion-ok [data-reveal]:not(.in){opacity:0;transform:translateY(22px)}

  /* ---------- a static blade, used outside the boards ---------- */
  .code-blade,.blades li,.stop-n{position:relative;display:inline-flex;align-items:center;gap:10px;border-radius:var(--r-blade);background:linear-gradient(180deg, var(--blade-top) 0 50%, var(--blade-bot) 50% 100%) var(--blade-bot);box-shadow:0 1px 0 var(--blade-edge) inset, 0 3px 6px -3px var(--blade-hinge);color:var(--blade-ink);font-family:var(--mono);font-weight:500;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
  .code-blade::after,.blades li::after,.stop-n::after{content:"";position:absolute;inset-inline:0;top:50%;height:1px;margin-top:-.5px;background:color-mix(in srgb, var(--blade-hinge) 32%, transparent)}

  /* ---------- home: hero ---------- */
  .hero{position:relative;padding-block:clamp(28px, 5vw, 64px) clamp(64px, 8vw, 112px)}
  .hero::before{content:"";position:absolute;inset:-72px 0 auto;height:820px;background:radial-gradient(60% 55% at 78% 0%, color-mix(in srgb, var(--accent) 13%, transparent), transparent 70%);pointer-events:none;z-index:-1}
  .hero-top{display:grid;grid-template-columns:minmax(0, 1.45fr) minmax(0, 1fr);gap:clamp(28px, 4vw, 64px);align-items:end;margin-bottom:clamp(30px, 4vw, 52px)}
  .hero-side{display:grid;gap:22px;padding-bottom:10px}
  .hero-sub{font-size:18px;line-height:1.55;color:var(--muted)}
  .hero-audience{padding-top:16px;border-top:1px solid var(--line);font-size:14px;line-height:1.5;color:var(--muted)}
  .hero-board .board-table td:first-child{color:var(--blade-ink)}
  .hero .pilot-legend{margin-top:18px}
  .w-video{width:31%}.w-camp{width:24%}.w-num{width:8.5%}.w-st{width:19.5%}.w-ans{width:40%}
  @media (max-width:1100px){.hero-board .w-video{width:38%}.hero-board .w-camp{width:30%}.hero-board .w-st{width:20%}}
  @media (max-width:980px){.hero-top{grid-template-columns:1fr;align-items:start}.hero-side{max-width:620px}}
  @media (max-width:760px){
    .hero-board .w-video{width:auto}.hero-board .w-num{width:62px}.hero-board .w-st{width:36%}
  }
  @media (max-width:560px){.hero .ctas .btn{width:100%}}

  /* ---------- home: what breaks ---------- */
  .problem{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1.25fr);gap:clamp(32px, 6vw, 104px);align-items:start}
  .problem-head{position:sticky;top:112px;display:grid;gap:22px}
  .breaks{list-style:none;display:grid;border-bottom:1px solid var(--line)}
  .breaks li{display:grid;grid-template-columns:minmax(150px, 210px) minmax(0, 1fr);gap:clamp(18px, 3vw, 36px);align-items:start;padding-block:clamp(26px, 3vw, 36px);border-top:1px solid var(--line)}
  .breaks p{margin-top:8px;color:var(--muted)}
  .code-blade{height:46px;padding:0 16px;font-size:14px;justify-self:start}
  @media (max-width:900px){.problem{grid-template-columns:1fr}.problem-head{position:static}}
  @media (max-width:560px){.breaks li{grid-template-columns:1fr;gap:14px}}

  /* ---------- home: connect, link, refresh ---------- */
  .route{--gap:clamp(22px, 3.4vw, 56px);list-style:none;position:relative;display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:var(--gap);padding-top:4px}
  .route::before,.route::after{content:"";position:absolute;z-index:0;top:30px;inset-inline:27px calc((100% - 2 * var(--gap)) / 3 - 27px);height:2px;border-radius:2px;background:var(--line-strong)}
  .route::after{background:var(--accent);transform-origin:left center;transition:transform 1.4s var(--ease-in-out) .15s}
  .reveal-ready.motion-ok .route:not(.in)::after{transform:scaleX(0)}
  .stop{position:relative;z-index:1;display:grid;gap:12px;align-content:start}
  .stop-n{justify-content:center;width:54px;height:54px;font-size:22px;letter-spacing:0}
  .stop h3{margin-top:12px}
  .stop p{color:var(--muted)}
  .metric-strip{display:grid;gap:14px;margin-top:clamp(48px, 6vw, 80px)}
  .blades{list-style:none;display:flex;flex-wrap:wrap;gap:6px}
  .blades li{height:38px;padding:0 14px;font-size:13px}
  .section .text-link{margin-top:28px}
  @media (max-width:860px){
    .route{grid-template-columns:1fr;gap:34px;padding-inline-start:0}
    .route::before,.route::after{top:24px;bottom:24px;inset-inline:26px auto;width:2px;height:auto}
    .route::after{transform-origin:center top}
    .reveal-ready.motion-ok .route:not(.in)::after{transform:scaleY(0)}
    .stop{grid-template-columns:54px minmax(0, 1fr);column-gap:20px}
    .stop h3{margin-top:12px}
    .stop h3,.stop p{grid-column:2}
    .stop-n{grid-row:1 / span 2}
  }

  /* ---------- home + product: the AI board ---------- */
  .ai{display:grid;grid-template-columns:minmax(0, .95fr) minmax(0, 1.25fr);gap:clamp(32px, 5vw, 80px);align-items:center}
  .ai-copy{display:grid;gap:24px}
  @media (max-width:980px){.ai{grid-template-columns:1fr}}

  /* ---------- calculator ---------- */
  .calc{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1.08fr);gap:clamp(32px, 5vw, 80px);align-items:center}
  .calc-copy{display:grid;gap:22px}
  .sliders{display:grid;gap:28px;margin-top:10px}
  .field{display:grid;gap:12px}
  .field label{display:flex;align-items:baseline;justify-content:space-between;gap:16px;font-size:15px;font-weight:600}
  .field output{font-family:var(--mono);font-size:17px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--accent-text)}
  input[type="range"]{--fill:50%;-webkit-appearance:none;appearance:none;width:100%;height:44px;margin:0;background:transparent;cursor:pointer;touch-action:pan-y}
  input[type="range"]::-webkit-slider-runnable-track{height:6px;border-radius:6px;background:linear-gradient(90deg, var(--accent) 0 var(--fill), var(--line-strong) var(--fill) 100%)}
  input[type="range"]::-moz-range-track{height:6px;border-radius:6px;background:var(--line-strong)}
  input[type="range"]::-moz-range-progress{height:6px;border-radius:6px;background:var(--accent)}
  input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:26px;height:26px;margin-top:-10px;border-radius:50%;background:var(--white);border:2px solid var(--accent);box-shadow:0 2px 8px -2px var(--shadow-ink);transition:transform .15s var(--ease-out)}
  input[type="range"]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--white);border:2px solid var(--accent);box-shadow:0 2px 8px -2px var(--shadow-ink)}
  input[type="range"]:active::-webkit-slider-thumb{transform:scale(1.12)}
  input[type="range"]:focus-visible{outline:none}
  input[type="range"]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 35%, transparent)}
  input[type="range"]:focus-visible::-moz-range-thumb{box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 35%, transparent)}
  .readouts{display:grid;gap:30px;padding:22px clamp(4px, .6vw, 8px) 6px}
  .readout{display:grid;gap:14px;align-content:start}
  .readout .label{color:var(--blade-dim)}
  .ro-num{font-size:clamp(28px, 3vw, 42px);line-height:1}
  .readout.big .ro-num{font-size:clamp(34px, 4.4vw, 60px)}
  .ro-note{font-size:14px;line-height:1.45;color:var(--blade-dim)}
  .readout.big .ro-note{color:var(--blade-ink)}
  .calc-bar{position:relative;height:10px;margin:18px clamp(4px, .6vw, 8px) 6px;border-radius:10px;background:color-mix(in srgb, var(--lamp-stop) 42%, var(--board))}
  .cb-plan{position:absolute;inset-block:0;inset-inline-start:0;width:calc(var(--p, 6) * 1%);min-width:6px;border-radius:10px;background:var(--accent);box-shadow:0 0 12px var(--lamp-glow);transition:width .45s var(--ease-out)}
  @media (max-width:980px){.calc{grid-template-columns:1fr}}
  

  /* ---------- home: plan strips ---------- */
  .plan-strips{list-style:none;display:grid;gap:8px}
  .plan-strip{display:grid;grid-template-columns:minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1.2fr) auto;gap:clamp(16px, 3vw, 40px);align-items:center;padding:clamp(20px, 2.4vw, 28px) clamp(18px, 2.4vw, 28px);border-radius:var(--r-lg);background:var(--surface);box-shadow:0 0 0 1px var(--line);cursor:pointer;transition:box-shadow .25s var(--ease-out), transform .25s var(--ease-out)}
  .plan-strip.featured{box-shadow:0 0 0 2px var(--accent), var(--shadow-1)}
  .ps-name p{margin-top:6px;font-size:15px;color:var(--muted)}
  .ps-price{display:grid;grid-template-columns:auto 1fr;align-items:baseline;column-gap:6px}
  .ps-price b{font-family:var(--head);font-size:clamp(34px, 3.4vw, 44px);font-weight:700;letter-spacing:-.035em;line-height:1}
  .ps-price small{font-size:15px;color:var(--muted)}
  .ps-price span{grid-column:1 / -1;margin-top:8px;font-size:14px;color:var(--muted)}
  .ps-limits{font-size:15px;line-height:1.7}
  .badge{display:inline-flex;align-items:center;margin-inline-start:8px;padding:2px 10px;border-radius:var(--r-pill);background:var(--accent);color:var(--on-accent);font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;vertical-align:.3em}
  .pricing-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-top:24px}
  .pricing-foot .text-link{margin-top:0}
  @media (hover:hover) and (pointer:fine){.plan-strip:hover{box-shadow:0 0 0 1px var(--line-strong), var(--shadow-1);transform:translateY(-2px)}.plan-strip.featured:hover{box-shadow:0 0 0 2px var(--accent), var(--shadow-1)}}
  @media (max-width:980px){.plan-strip{grid-template-columns:1fr 1fr}.plan-strip .btn{grid-column:1 / -1;justify-self:start}}
  @media (max-width:560px){.plan-strip{grid-template-columns:1fr}.plan-strip .btn{width:100%}}

  /* ---------- the blue pilot block ---------- */
  .pilot-sec{padding-block:clamp(32px, 4vw, 56px)}
  .pilot-block{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0, 1.05fr) minmax(0, 1fr);gap:clamp(32px, 5vw, 80px);align-items:center;padding:clamp(32px, 5.5vw, 80px);border-radius:var(--r-xl);background:var(--accent);color:var(--on-accent)}
  .pilot-block::before{content:"";position:absolute;inset:auto -10% -60% 30%;height:120%;background:radial-gradient(closest-side, color-mix(in srgb, var(--accent-deep) 70%, transparent), transparent);pointer-events:none}
  .pilot-block>*{position:relative}
  .pilot-block h2{color:var(--on-accent)}
  .pilot-copy{display:grid;gap:22px}
  .pilot-line{font-size:clamp(18px, 1.6vw, 21px);line-height:1.5}
  .pilot-block .text-link{color:var(--on-accent);text-decoration:underline;text-decoration-thickness:1px}
  .pilot-block :focus-visible{outline-color:var(--white)}
  .pilot-block .in-pilot,.cta-band .in-pilot{background:var(--accent-deep);border-color:color-mix(in srgb, var(--white) 45%, transparent);color:var(--white)}
  .pilot-block .in-pilot::before,.cta-band .in-pilot::before{background:var(--white)}
  .days{list-style:none;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr));gap:6px}
  .days li{position:relative;display:grid;place-items:center;height:46px;border-radius:var(--r-blade);background:linear-gradient(180deg, var(--blade-top) 0 50%, var(--blade-bot) 50% 100%) var(--blade-bot);box-shadow:0 1px 0 var(--blade-edge) inset;color:var(--blade-ink);font-family:var(--mono);font-size:14px;font-weight:500;transition:color .4s var(--ease-out);transition-delay:calc(var(--d, 0) * 70ms)}
  .days li::after{content:"";position:absolute;inset-inline:0;top:50%;height:1px;background:color-mix(in srgb, var(--blade-hinge) 45%, transparent)}
  .days li::before{content:"";position:absolute;top:7px;inset-inline-end:7px;width:5px;height:5px;border-radius:50%;background:var(--lamp-go);box-shadow:0 0 8px var(--lamp-go);transition:opacity .4s var(--ease-out), background-color .4s;transition-delay:calc(var(--d, 0) * 70ms)}
  .reveal-ready.motion-ok .pilot-block:not(.in) .days li{color:var(--blade-faint)}
  .reveal-ready.motion-ok .pilot-block:not(.in) .days li::before{opacity:0}
  .days li:nth-child(2){--d:1}.days li:nth-child(3){--d:2}.days li:nth-child(4){--d:3}.days li:nth-child(5){--d:4}.days li:nth-child(6){--d:5}.days li:nth-child(7){--d:6}.days li:nth-child(8){--d:7}.days li:nth-child(9){--d:8}.days li:nth-child(10){--d:9}.days li:nth-child(11){--d:10}.days li:nth-child(12){--d:11}.days li:nth-child(13){--d:12}.days li:nth-child(14){--d:13}
  .pilot-list{list-style:none;display:grid;gap:14px;margin-top:26px;font-size:17px;line-height:1.45}
  .pilot-list li{display:grid;grid-template-columns:28px minmax(0, 1fr);gap:12px;align-items:start}
  .pilot-list .ico{width:28px;height:28px;padding:6px;border-radius:50%;background:var(--white);color:var(--accent)}
  .pilot-ask{margin-top:22px;padding-top:18px;border-top:1px solid color-mix(in srgb, var(--white) 30%, transparent);font-size:15px;line-height:1.5}
  @media (max-width:900px){.pilot-block{grid-template-columns:1fr}}

  /* ---------- close ---------- */
  .close-in{display:grid;grid-template-columns:minmax(0, 1.2fr) minmax(0, 1fr);gap:clamp(32px, 5vw, 80px);align-items:center}
  .close-copy{display:grid;justify-items:start;gap:26px}
  .close .display{max-width:12ch}
  .close-board .w-video{width:64%}
  @media (max-width:900px){.close-in{grid-template-columns:1fr}}

  /* ---------- inner pages ---------- */
  .page-hero{position:relative;padding-block:clamp(40px, 7vw, 96px) clamp(36px, 5vw, 64px)}
  .page-hero::before{content:"";position:absolute;inset:-72px 0 auto;height:640px;background:radial-gradient(55% 55% at 85% 0%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 70%);pointer-events:none;z-index:-1}
  .page-hero .display{font-size:clamp(40px, 5.8vw, 84px);max-width:16ch}
  .page-hero .lead{margin-top:24px}
  .page-hero .ctas{margin-top:32px}
  .crumb{display:inline-flex;align-items:center;gap:10px;margin-bottom:26px}

  /* FAQ */
  .faq-grid{display:grid;grid-template-columns:minmax(0, .8fr) minmax(0, 1.2fr);gap:clamp(32px, 5vw, 80px);align-items:start}
  .faq{border-top:1px solid var(--line)}
  .faq details{border-bottom:1px solid var(--line)}
  .faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:72px;padding-block:18px;padding-inline-end:6px;font-family:var(--head);font-size:clamp(19px, 1.7vw, 22px);font-weight:600;letter-spacing:-.015em;line-height:1.3;cursor:pointer;list-style:none}
  .faq summary::-webkit-details-marker{display:none}
  .faq summary::after{content:"";flex:none;width:12px;height:12px;border-inline-end:2px solid var(--muted);border-block-end:2px solid var(--muted);transform:rotate(45deg) translate(-3px, -3px);transition:transform .3s var(--ease-out)}
  .faq details[open] summary::after{transform:rotate(225deg) translate(-2px, -2px)}
  .faq details p{padding-block-end:24px;max-width:62ch;color:var(--muted)}
  @media (max-width:900px){.faq-grid{grid-template-columns:1fr}}

  /* comparison table */
  .compare-wrap{border-radius:var(--r-lg);background:var(--surface);box-shadow:0 0 0 1px var(--line);overflow:hidden}
  .compare{width:100%;font-size:16px}
  .compare th{padding:18px 22px;text-align:start;font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);background:var(--surface-2);border-bottom:1px solid var(--line)}
  .compare th.us{color:var(--accent-text)}
  .compare td{padding:18px 22px;border-bottom:1px solid var(--line);vertical-align:top}
  .compare tr:last-child td{border-bottom:0}
  .compare td:first-child{font-weight:600}
  .compare td.before{color:var(--muted)}
  .compare td.after{background:var(--accent-wash)}
  @media (max-width:720px){
    .compare thead{display:none}
    .compare tr{display:grid;padding:16px 18px;border-bottom:1px solid var(--line)}
    .compare tr:last-child{border-bottom:0}
    .compare td{padding:4px 0;border:0}
    .compare td.after{background:none}
    .compare td.before::before,.compare td.after::before{content:attr(data-label) ": ";font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
  }

  /* closing band on inner pages */
  .cta-band{display:grid;grid-template-columns:minmax(0, 1.4fr) auto;gap:28px;align-items:center;padding:clamp(28px, 4vw, 56px);border-radius:var(--r-xl);background:var(--accent);color:var(--on-accent)}
  .cta-band h2{color:var(--on-accent)}
  .cta-band p{margin-top:12px;font-size:18px}
  .cta-band .ctas{justify-content:flex-end}
  .cta-band :focus-visible{outline-color:var(--white)}
  @media (max-width:820px){.cta-band{grid-template-columns:1fr}.cta-band .ctas{justify-content:flex-start}}

  /* inner page heroes with a board beside the words */
  .page-hero-grid{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1.12fr);gap:clamp(32px, 5vw, 80px);align-items:center}
  .page-hero-grid .display{font-size:clamp(40px, 4.9vw, 74px)}
  .page-hero-copy .ctas{margin-top:32px}
  @media (max-width:980px){.page-hero-grid{grid-template-columns:1fr}}
  .w-ver{width:62px}.w-cpa{width:14%}.w-st2{width:46%}
  .versions-board .w-video{width:auto}.versions-board .w-num{width:12%}.versions-board .w-cpa{width:15%}.versions-board .w-st{width:23%}
  @media (max-width:760px){.versions-board .w-st{width:34%}}

  /* product: one feature per row, words beside a small board */
  .feature{display:grid;grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);gap:clamp(28px, 5vw, 80px);align-items:center;padding-block:clamp(32px, 4.4vw, 56px);border-top:1px solid var(--line)}
  .feature-copy{display:grid;gap:14px;justify-items:start}
  .feature-copy h3{margin-top:10px}
  .feature-copy p{max-width:52ch;color:var(--muted)}
  .board-table tr.coming-next{display:table-row;border:0;padding:0;font-size:inherit;color:inherit}
  .mini-board .board-table td{font-size:15px}
  .link-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 0;padding:18px clamp(4px, .6vw, 8px) 12px}
  .link-row .code-blade{height:46px;font-size:13px}
  .link-row .code-blade .ico{width:16px;height:16px;color:var(--accent-soft)}
  .link-line{position:relative;flex:1 1 40px;min-width:40px;height:2px;margin-inline:10px;border-radius:2px;background:var(--accent-soft);transform-origin:left center;transition:transform .9s var(--ease-in-out) .25s}
  .link-line::before,.link-line::after{content:"";position:absolute;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:var(--accent-soft)}
  .link-line::before{inset-inline-start:-4px}.link-line::after{inset-inline-end:-4px;background:var(--lamp-go);box-shadow:0 0 10px var(--lamp-go)}
  .reveal-ready.motion-ok .feature:not(.in) .link-line{transform:scaleX(0)}
  .link-metrics{padding:4px clamp(4px, .6vw, 8px) 8px}
  .brief-rows{display:grid;gap:6px;margin:0;padding:14px clamp(4px, .6vw, 8px) 8px}
  .brief-rows div{display:grid;grid-template-columns:96px minmax(0, 1fr);gap:14px;align-items:baseline;padding:13px 16px;border-radius:var(--r-sm);background:var(--blade-bot);box-shadow:0 1px 0 var(--blade-edge) inset}
  .brief-rows dt{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--blade-dim)}
  .brief-rows dd{margin:0;font-size:15px;line-height:1.45;color:var(--blade-ink);overflow-wrap:anywhere}
  .brief .rail-id .ico{width:16px;height:16px;color:var(--accent-soft)}
  .feature .stop-n{width:48px;height:48px;font-size:19px}
  @media (max-width:900px){.feature{grid-template-columns:1fr}}
  @media (max-width:420px){.mini-board .w-st2{width:56%}.brief-rows div{grid-template-columns:1fr;gap:4px}}

  /* product: the gap between editors and buyers */
  .gap{display:grid;grid-template-columns:minmax(0, 1fr) minmax(200px, .72fr) minmax(0, 1fr);gap:clamp(16px, 3vw, 40px);align-items:center}
  .asks{list-style:none;display:grid;gap:10px;margin-top:14px}
  .asks li{padding:16px 18px;border-radius:var(--r-md);background:var(--surface);box-shadow:0 0 0 1px var(--line);font-size:17px;font-weight:500;line-height:1.4}
  .gap-mid{padding:22px;border-radius:var(--r-lg);background:var(--board);box-shadow:var(--shadow-board)}
  .gap-mid .label{color:var(--blade-dim)}
  .lost-list{list-style:none;display:grid;gap:6px;margin-top:14px}
  .lost-list li{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:var(--r-blade);background:linear-gradient(180deg, var(--blade-top) 0 50%, var(--blade-bot) 50% 100%) var(--blade-bot);color:var(--blade-dim);font-family:var(--mono);font-size:13px;letter-spacing:.04em;text-transform:uppercase;text-decoration:line-through;text-decoration-color:color-mix(in srgb, var(--lamp-stop) 70%, transparent)}
  .lost-list .ico{width:16px;height:16px;flex:none}
  .loop{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:clamp(28px, 4vw, 44px);padding:18px 22px;border-radius:var(--r-lg);background:var(--accent-wash);box-shadow:0 0 0 1px color-mix(in srgb, var(--accent) 28%, transparent);font-weight:600}
  .loop strong{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-text)}
  .loop .ico{width:18px;height:18px;color:var(--accent-text)}
  @media (max-width:900px){.gap{grid-template-columns:1fr}.gap-mid{order:-1}}

  /* pricing */
  .pricing-hero .display{font-size:clamp(40px, 5.4vw, 80px);max-width:13ch}
  .bill-wrap{display:flex;justify-content:flex-end;align-items:flex-end}
  .plans{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:clamp(14px, 1.8vw, 22px);align-items:stretch}
  .plan{display:flex;flex-direction:column;border-radius:var(--r-xl);background:var(--surface);box-shadow:0 0 0 1px var(--line);overflow:hidden;cursor:pointer;transition:box-shadow .25s var(--ease-out), transform .25s var(--ease-out)}
  .plan-top{display:grid;gap:10px;padding:26px 26px 24px;background:linear-gradient(180deg, var(--board-rail), var(--board)) var(--board);color:var(--blade-ink)}
  .plan-name{display:flex;align-items:center;justify-content:space-between;gap:12px}
  .plan-name :is(h2,h3){color:var(--blade-ink);font-size:24px}
  .plan-name .badge{margin:0}
  .plan-for{font-size:15px;color:var(--blade-dim)}
  .price{display:flex;align-items:flex-end;gap:10px;margin-top:10px;font-size:46px;line-height:1}
  .price small{font-size:15px;color:var(--blade-dim);padding-bottom:4px}
  .plan-yearly{font-size:14px;color:var(--blade-dim)}
  .bill-year .plan-yearly{color:var(--blade-ink)}
  .plan-body{display:flex;flex:1;flex-direction:column;gap:18px;padding:24px 26px 26px}
  .plan-body .btn{margin-top:auto;align-self:stretch}
  .feats{list-style:none;display:grid;gap:12px}
  .feats li{display:grid;grid-template-columns:20px minmax(0, 1fr);gap:10px;font-size:15px;line-height:1.45}
  .feats .ico{width:18px;height:18px;margin-top:2px;color:var(--accent-text)}
  .pilot-group{display:grid;gap:12px;padding:16px;border-radius:var(--r-md);background:var(--accent-wash)}
  .pilot-group .in-pilot{margin:0;justify-self:start}
  .plan.featured{box-shadow:0 0 0 2px var(--accent), var(--shadow-1)}
  .plan.featured .plan-top{background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 30%, var(--board)), var(--board)) var(--board)}
  @media (hover:hover) and (pointer:fine){.plan:hover{transform:translateY(-3px);box-shadow:0 0 0 1px var(--line-strong), var(--shadow-1)}.plan.featured:hover{box-shadow:0 0 0 2px var(--accent), var(--shadow-1)}}
  /* /pricing/ and the deck: three cards in a row share their row heights, so a price line or tagline that wraps in one card does not push its list below the others */
  @media (min-width:981px){@supports (grid-template-rows:subgrid){.plans{grid-template-rows:auto auto}.plan{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0}.plan-top{align-content:start}}}
  .price-note{margin-top:14px;font-size:14px;color:var(--muted)}
  .cost-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px 40px}
  .cost-cta .lead{margin-top:14px}
  .faq .coming-next{display:inline;border:0;padding:0;font-size:inherit;color:inherit}
  @media (max-width:980px){.plans{grid-template-columns:1fr;max-width:560px}.bill-wrap{justify-content:flex-start}}

  /* pilot */
  .days-table td{height:54px;padding:0;text-align:center;font-size:18px}
  .days-table .f-half>span{justify-content:center;padding:0}
  .days-table .f-half b{text-align:center}
  .days-strip{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;padding:16px clamp(4px, .6vw, 8px) 2px}
  .days-strip .board-foot{padding:0}
  .days-cost{display:flex;align-items:center;gap:16px}
  .days-cost .label{color:var(--blade-dim)}
  .days-zero{font-size:44px}
  @media (max-width:520px){.days-table td{font-size:14px;height:44px}}
  .included{display:grid;grid-template-columns:minmax(0, .8fr) minmax(0, 1.2fr);gap:clamp(32px, 6vw, 96px);align-items:start}
  .incl-list{list-style:none;display:grid;border-bottom:1px solid var(--line)}
  .incl-list li{display:grid;grid-template-columns:56px minmax(0, 1fr);gap:22px;align-items:start;padding-block:26px;border-top:1px solid var(--line)}
  .incl-list p{margin-top:8px;color:var(--muted)}
  .incl-ico{position:relative;display:grid;place-items:center;width:56px;height:56px;border-radius:var(--r-blade);background:linear-gradient(180deg, var(--blade-top) 0 50%, var(--blade-bot) 50% 100%) var(--blade-bot);color:var(--blade-ink)}
  .incl-ico .ico{width:24px;height:24px}
  .pilot-ask-line{margin-top:clamp(36px, 5vw, 56px);max-width:70ch;padding:18px 22px;border-radius:var(--r-md);box-shadow:0 0 0 1px var(--line);color:var(--muted)}
  @media (max-width:900px){.included{grid-template-columns:1fr}}

  /* 404 */
  .notfound{padding-block:clamp(48px, 8vw, 112px)}
  .nf-board{max-width:560px}
  .nf-board .w-video{width:56%}
  .notfound .display{margin-top:clamp(32px, 5vw, 56px);max-width:14ch}
  .notfound .lead{margin-top:22px}
  .notfound .ctas{margin-top:32px}

  /* privacy */
  .legal{max-width:760px}
  .legal h2{font-size:24px;letter-spacing:-.015em;margin-top:44px}
  .legal p,.legal li{margin-top:14px;color:var(--muted)}
  .legal ul{padding-inline-start:20px}
  .legal .draft{display:inline-flex;margin-top:20px;padding:4px 12px;border-radius:var(--r-pill);border:1px dashed var(--warn);color:var(--warn);font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase}
}