/* Agent Disco — site styles
   Layout concept: one 1120px column, hairline-ruled sections, generous vertical space.
   Typography: Geist Mono for headings, navigation and data; Geist for reading.

   STRUCTURE FOLLOWS CONTENT
   - A sequence (stages, steps) is numbered and connected with arrows.
   - A set of N parallel items sits in N equal columns, unnumbered.
   - A comparison is a table.
   - One idea per section: heading, one line, the visual.

   COLOUR LOGIC (the only colour on the site)
   The disco ball reflects three hues. Each hue is one stage of the agent journey,
   and is used for nothing else:
     --discover  Stage 1 · the agent finds you and puts you on the shortlist
     --use       Stage 2 · the agent signs up, connects and finishes a first task
     --repeat    Stage 3 · the agent comes back, and recommends you again
   Amber also marks a key path: a path you win again and again (repeat).
   Rules: colour marks a stage (a dot, a thin line, an underline). Never fills,
   never backgrounds, never buttons, never body text. Everything else is monochrome. */

:root{
  color-scheme:dark;
  --bg:#090909;
  --surface:#11120f;
  --ink:#efefe8;
  --muted:#a3a39b;
  --faint:#73746c;
  --line:#292b25;
  --line-strong:#3c3e35;

  --discover:#dcf989;
  --use:#c4b4f5;
  --repeat:#f0a08c;

  --mono:'Geist Mono','SF Mono',Menlo,Consolas,monospace;
  --sans:'Geist',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;

  --wrap:1120px;
  --gutter-l:max(20px,env(safe-area-inset-left,0px));
  --gutter-r:max(20px,env(safe-area-inset-right,0px));
  --section:clamp(80px,10vw,136px);
  --nav-h:76px;
  --logo:32px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 24px);-webkit-text-size-adjust:100%}
html,body{margin:0;background:var(--bg);color:var(--ink)}
body{font-family:var(--sans);font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,p,ol,ul,figure,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
::selection{background:var(--ink);color:var(--bg)}
img{max-width:100%;display:block}
[hidden]{display:none!important}

.wrap{max-width:calc(var(--wrap) + 40px);margin:0 auto;padding-left:var(--gutter-l);padding-right:var(--gutter-r)}
.skip{position:absolute;left:16px;top:-48px;z-index:50;background:var(--ink);color:var(--bg);font-family:var(--mono);font-size:.8125rem;padding:8px 12px}
.skip:focus{top:12px}

/* Type */
h1,h2,h3,.mono{font-family:var(--mono);font-weight:400}
h1,h2{text-transform:uppercase;text-wrap:balance}
h1{font-size:clamp(2.35rem,5.6vw,4.75rem);line-height:1.03;letter-spacing:-.06em}
h2{font-size:clamp(1.75rem,3.4vw,2.75rem);line-height:1.08;letter-spacing:-.05em;max-width:30ch}
h3{font-size:1rem;line-height:1.35;letter-spacing:-.02em;text-transform:uppercase}
p{color:var(--muted);max-width:60ch}
strong{font-weight:500;color:var(--ink)}
.lead{font-size:clamp(1.125rem,1.6vw,1.3rem);line-height:1.55;color:var(--muted);max-width:46ch}
.note{font-family:var(--mono);font-size:.75rem;line-height:1.6;color:var(--faint)}

/* Stage colour tokens applied */
[data-stage="discover"]{--stage:var(--discover)}
[data-stage="use"]{--stage:var(--use)}
[data-stage="repeat"]{--stage:var(--repeat)}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--stage,var(--faint));flex-shrink:0;transform:translateY(-1px)}
.mark{text-decoration:underline;text-decoration-color:var(--stage);text-decoration-thickness:2px;text-underline-offset:.16em}
.tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink)}

/* Buttons — always monochrome */
.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 22px;font-family:var(--mono);font-size:.9375rem;letter-spacing:-.01em;border:1px solid var(--ink);transition:background .15s,color .15s,border-color .15s;white-space:nowrap}
.btn-primary{background:var(--ink);color:var(--bg)}
.btn-primary:hover{background:transparent;color:var(--ink)}
.btn-ghost{border-color:var(--line-strong)}
.btn-ghost:hover{border-color:var(--ink)}
.btn .arrow{transition:transform .15s}
.btn:hover .arrow{transform:translateX(3px)}
.text-link{font-family:var(--mono);font-size:.875rem;border-bottom:1px solid var(--line-strong);padding-bottom:2px;transition:border-color .15s}
.text-link:hover{border-color:var(--ink)}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}

/* Navigation */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:31;background:var(--bg)}
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:rgba(9,9,9,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .2s}
.nav.is-scrolled{border-bottom-color:var(--line)}
.nav-inner{height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:inline-flex;align-items:center;gap:14px;font-family:var(--mono);font-size:1.0625rem;letter-spacing:-.02em;text-transform:uppercase;white-space:nowrap}
.ball{position:relative;width:var(--logo);height:var(--logo);flex-shrink:0}
.ball canvas{position:absolute;display:block}
.ball .ball-face{inset:0;width:100%;height:100%}
.ball .ball-glare{width:240px;height:240px;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:-1}
.nav-links{display:flex;align-items:center;gap:32px;font-family:var(--mono);font-size:.875rem}
.nav-links a:not(.btn){color:var(--muted);transition:color .15s}
.nav-links a:not(.btn):hover,.nav-links a[aria-current="page"]{color:var(--ink)}
.nav-links .btn{min-height:42px;padding:0 16px;font-size:.875rem}

/* Sections */
.section{padding-block:var(--section);border-top:1px solid var(--line)}
.head{display:flex;flex-direction:column;gap:18px;margin-bottom:clamp(40px,5vw,64px)}

/* Hero */
.hero{padding-block:clamp(56px,9vw,112px) clamp(64px,8vw,104px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(40px,6vw,80px);align-items:center}
.hero-copy{display:flex;flex-direction:column;gap:28px;min-width:0}
.hero h1{max-width:none;font-size:clamp(2.25rem,4vw,3.6rem)}
.cta-block{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:4px}
.hero .actions{margin-top:4px}

/* Agent trace (hero figure) */
.trace{min-width:0;border:1px solid var(--line-strong);background:var(--surface);font-family:var(--mono);font-size:.8125rem;line-height:1.7}
.trace-bar{display:flex;justify-content:space-between;gap:12px;padding:11px 16px;border-bottom:1px solid var(--line);color:var(--faint);font-size:.75rem}
.trace-body{padding:18px 16px 20px;display:flex;flex-direction:column;gap:14px}
.trace-task{color:var(--ink)}
.trace-task::before{content:"› ";color:var(--faint)}
.trace-step{display:grid;grid-template-columns:84px minmax(0,1fr);gap:2px 12px}
.trace-step .tag{font-size:.6875rem;align-self:start;padding-top:2px;gap:7px}
.trace-step p{font-size:.8125rem;color:var(--muted);max-width:none;line-height:1.7}
.trace-step p b{font-weight:400;color:var(--ink)}
.trace-step .x{color:var(--faint);text-decoration:line-through}

/* Hero chat: the outcome, in the order it happens */
.chat{margin:0;min-width:0;display:flex;flex-direction:column;gap:12px}
.chat-msg{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;align-items:start}
.chat-msg>.icon{width:32px;height:32px;padding:7px;border:1px solid var(--line-strong);border-radius:50%;color:var(--muted)}
.chat-msg.user p{justify-self:start;background:var(--surface);border:1px solid var(--line-strong);padding:10px 14px;color:var(--ink);font-size:1rem;max-width:none}
.chat-body{border:1px solid var(--line-strong);background:var(--surface);padding:16px;display:flex;flex-direction:column;gap:14px}
.chat-steps{display:flex;flex-direction:column;gap:10px;font-family:var(--mono);font-size:.8438rem;color:var(--muted)}
.chat-steps li{display:flex;align-items:flex-start;gap:10px}
.chat-steps .dot{margin-top:.55em}
.chat-steps b{font-weight:400;color:var(--ink)}
.chat-body>p{font-size:.9688rem;color:var(--ink);border-top:1px solid var(--line);padding-top:12px;max-width:none}
.chat figcaption{padding-left:44px}

/* Hero demo: an agent's answer, with what we measure pinned to the pick */
.brand-logo{width:18px;height:18px;flex-shrink:0;fill:currentColor}
.demo{margin:0;min-width:0;border:1px solid var(--line-strong);background:var(--surface);display:flex;flex-direction:column}
.demo-tabs{display:flex;border-bottom:1px solid var(--line);padding:0 8px}
.demo-tabs button{font-family:var(--mono);font-size:.8125rem;padding:13px 12px;color:var(--faint);border-bottom:1px solid transparent;margin-bottom:-1px;transition:color .15s}
.demo-tabs button:hover{color:var(--muted)}
.demo-tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--ink)}
.demo-panel{padding:20px 20px 22px;display:flex;flex-direction:column;gap:16px}
.demo .q{align-self:flex-end;background:var(--bg);border:1px solid var(--line-strong);border-radius:16px 16px 4px 16px;padding:9px 16px;color:var(--ink);font-size:.9375rem;max-width:none}
.demo .a{position:relative;display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px}
.avatar{width:32px;height:32px;border-radius:50%;border:1px solid var(--line-strong);display:grid;place-items:center;color:var(--ink)}
.avatar .brand-logo{width:16px;height:16px}
.answer{display:flex;flex-direction:column;gap:10px;min-width:0}
.agent-name{font-family:var(--mono);font-size:.75rem;color:var(--faint);padding-top:6px}
.answer>p{font-size:.9375rem}
.options{border-top:1px solid var(--line)}
.options li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.options .brand-logo{margin-top:2px;color:var(--faint)}
.options li p{font-size:.875rem;line-height:1.5}
.opt-name{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.875rem!important;color:var(--muted)}
.options .picked .brand-logo{color:var(--ink)}
.options .picked .opt-name{color:var(--ink)}
.badge{font-family:var(--mono);font-size:.6875rem;line-height:1;border:1px solid var(--ink);padding:3px 6px;color:var(--ink)}
.done{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.8125rem;color:var(--ink)}
.metric-card{position:absolute;right:-40px;top:128px;width:300px;background:var(--ink);color:var(--bg);padding:12px 14px 14px;box-shadow:0 18px 40px rgba(0,0,0,.45)}
.mc-head{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.8125rem;color:var(--bg);margin-bottom:10px;max-width:none}
.mc-head .brand-logo{width:14px;height:14px}
.metric-card dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.metric-card dl>div{display:flex;flex-direction:column;gap:3px;padding-right:8px}
.metric-card dl>div+div{border-left:1px solid rgba(0,0,0,.14);padding-left:10px}
.metric-card dt{font-size:.6875rem;color:#5c5c58}
.metric-card dd{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.8125rem;white-space:nowrap}
.demo figcaption{padding:12px 20px;border-top:1px solid var(--line)}

/* Platform row */
.platforms{border-top:1px solid var(--line);padding-block:28px}
.platforms .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:14px 40px}
.platforms .note{margin-right:8px}
.logos{display:flex;flex-wrap:wrap;align-items:center;gap:14px 40px;font-family:var(--mono);font-size:1rem;letter-spacing:-.03em;color:var(--muted)}
.logos li{display:flex;align-items:center;gap:10px;height:28px}
.logos .brand-logo{width:20px;height:20px;color:var(--ink)}

/* Three stages: a sequence, so numbered and connected */
.flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.flow li{position:relative;padding:28px 40px 0 0;border-top:2px solid var(--stage);display:flex;flex-direction:column;gap:12px;min-width:0}
.flow li+li{padding-left:0}
.flow li:not(:last-child)::after{content:"→";position:absolute;right:16px;top:22px;font-family:var(--mono);color:var(--faint)}
.flow .step{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.75rem;color:var(--faint)}
.flow h3{font-size:1.5rem;letter-spacing:-.05em}
.flow p{font-size:1rem}
.flow .metric{font-family:var(--mono);font-size:.8125rem;color:var(--ink);margin-top:6px}
.flow .metric span{color:var(--faint)}
.flow li{margin-right:24px}
.flow li:last-child{margin-right:0}

/* Proof */
.proof{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(40px,6vw,80px);align-items:end}
.chart{margin:0;min-width:0}
.chart figcaption{display:flex;justify-content:space-between;gap:16px;font-family:var(--mono);font-size:.75rem;color:var(--faint);margin-bottom:14px}
.chart figcaption span:first-child{display:inline-flex;align-items:center;gap:8px;color:var(--muted)}
.chart svg{width:100%;height:auto;display:block;overflow:visible}
.chart text{font-family:var(--mono);font-size:11px;fill:var(--faint)}
.chart .grid{stroke:var(--line);stroke-width:1;fill:none}
.chart .line{fill:none;stroke:var(--use);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.chart .area{fill:var(--use);fill-opacity:.07}
.chart .pt{fill:var(--use)}
.chart .label{fill:var(--ink);font-size:12px}
.stats{display:grid;grid-template-columns:minmax(0,1fr);border-top:1px solid var(--line-strong)}
.stats li{padding:18px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:4px}
.stats .num{font-family:var(--mono);font-size:clamp(2rem,3.6vw,2.75rem);letter-spacing:-.06em;line-height:1.05;color:var(--ink);font-variant-numeric:tabular-nums}
.stats p{font-size:.9375rem}

/* Comparison table */
.table-scroll{overflow-x:auto}
.compare{width:100%;min-width:640px;border-collapse:collapse;text-align:left}
.compare th,.compare td{padding:18px 20px 18px 0;border-bottom:1px solid var(--line);vertical-align:top;width:27%}
.compare thead th{font-family:var(--mono);font-weight:400;font-size:.875rem;text-transform:uppercase;letter-spacing:-.01em;color:var(--muted);border-bottom-color:var(--line-strong)}
.compare thead th.us{color:var(--ink)}
.compare tbody th{font-family:var(--mono);font-weight:400;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);width:19%;padding-top:21px}
.compare td{font-size:.9688rem;color:var(--faint)}
.compare td.us{color:var(--ink)}
.compare .us{border-left:1px solid var(--line-strong);padding-left:20px}

/* What we improve: three columns, one per stage */
.work{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.work-col{border-top:2px solid var(--stage);padding-top:20px;display:flex;flex-direction:column;gap:6px;min-width:0}
.work-col .step{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.75rem;color:var(--faint);text-transform:uppercase;letter-spacing:.06em}
.work-col ul{display:flex;flex-direction:column}
.work-col li{padding:16px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.work-col p{font-size:.9688rem}

/* Offer: two sequential steps */
.offer{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border:1px solid var(--line-strong)}
.plan{padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;gap:18px;min-width:0}
.plan+.plan{border-left:1px solid var(--line-strong)}
.plan-top{display:flex;justify-content:space-between;align-items:center;gap:16px;font-family:var(--mono);font-size:.75rem;color:var(--faint)}
.plan h3{font-size:clamp(1.35rem,2.2vw,1.75rem);letter-spacing:-.05em}
.plan .price{font-family:var(--mono);font-size:1rem;color:var(--ink)}
.plan .price span{color:var(--faint)}
.checks{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.checks li{display:flex;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-size:.9688rem;color:var(--muted)}
.checks .icon{color:var(--ink);margin-top:3px}
.plan-top .tag{color:var(--muted)}
.plan-top .icon{width:15px;height:15px}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.checks b{font-weight:400;color:var(--ink)}
.plan .actions{margin-top:auto;padding-top:8px}

/* Service rows: one aspect per row, optional short detail right-aligned */
.checks.rows li,.checks.addon li{align-items:center;padding:10px 0}
.checks .row-name{flex:1;color:var(--ink)}
.checks .row-detail{font-family:var(--mono);font-size:.75rem;color:var(--faint);white-space:nowrap}
.checks .icon{margin-top:0}
.addon-label{font-family:var(--mono);font-size:.6875rem;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);margin-top:8px;margin-bottom:-10px}
.checks.addon{border-top:1px dashed var(--line-strong)}
.checks.addon li{border-bottom:1px dashed var(--line-strong)}
.checks.addon .icon,.checks.addon .row-name{color:var(--muted)}
.plan .checks.rows{margin-bottom:-4px}

/* Start: three sequential steps */
.start{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line-strong);margin-bottom:clamp(40px,5vw,56px)}
.start li{padding:22px 24px 0 0;display:flex;flex-direction:column;gap:8px;position:relative}
.start li+li{padding-left:24px;border-left:1px solid var(--line)}
.start .step{font-family:var(--mono);font-size:.75rem;color:var(--faint)}
.start p{font-size:.9688rem}
.contact-line{display:flex;flex-wrap:wrap;align-items:center;gap:12px}

/* Icons: one 20px line set, stroke follows text colour */
.icon{width:18px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.btn .icon{width:17px;height:17px}
.icon-btn{display:inline-grid;place-items:center;width:46px;height:46px;color:var(--muted);transition:color .15s,background .15s}
.icon-btn:hover{color:var(--ink);background:var(--surface)}
.icon-btn .i-check{display:none}
.icon-btn.is-done .i-copy{display:none}
.icon-btn.is-done .i-check{display:block;color:var(--ink)}

/* Email chip: same height, font and border as the buttons beside it */
.email-chip{display:inline-flex;align-items:center;min-height:48px;border:1px solid var(--line-strong);font-family:var(--mono);font-size:.9375rem;letter-spacing:-.01em;color:var(--ink)}
.email-chip .icon{margin-left:18px;color:var(--muted)}
.email{padding:0 14px 0 12px;user-select:all;white-space:nowrap}
.email-chip .icon-btn{border-left:1px solid var(--line-strong)}
.email-chip .icon-btn .icon{margin:0}

/* About */
.about-hero{padding-block:clamp(56px,9vw,112px) clamp(56px,7vw,96px)}
.about-hero h1{max-width:15ch}
.about-hero .lead{margin-top:24px}
.story{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:clamp(28px,6vw,96px)}
.story h2{font-size:1rem;letter-spacing:-.02em;max-width:none}
.story .body{display:flex;flex-direction:column;gap:20px}
.story .body p{font-size:1.0625rem}
.pull{font-family:var(--mono);font-size:clamp(1.2rem,2.2vw,1.6rem);line-height:1.35;letter-spacing:-.04em;color:var(--ink);text-transform:uppercase;max-width:28ch;padding:6px 0}
.shifts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line-strong)}
.shifts li{padding:16px 16px 0 0;display:flex;flex-direction:column;gap:4px;font-family:var(--mono);font-size:.875rem;color:var(--muted);position:relative}
.shifts li+li{padding-left:16px;border-left:1px solid var(--line)}
.shifts li:last-child{color:var(--ink)}
.shifts li:not(:last-child)::after{content:"→";position:absolute;right:14px;top:16px;color:var(--faint)}
.shifts span{font-size:.75rem;color:var(--faint)}
.record{border-top:1px solid var(--line-strong)}
.record li{display:grid;grid-template-columns:140px minmax(0,1fr);gap:24px;padding:16px 0;border-bottom:1px solid var(--line)}
.record .mono{font-size:.8125rem;color:var(--faint)}
.record span:last-child{color:var(--ink)}
.loop-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line-strong)}
.loop-steps li{padding:20px 20px 4px 0;display:flex;flex-direction:column;gap:8px}
.loop-steps li+li{padding-left:20px;border-left:1px solid var(--line)}
.loop-steps .step{font-family:var(--mono);font-size:.75rem;color:var(--faint)}
.loop-steps p{font-size:.9375rem}
.loop-back{font-family:var(--mono);font-size:.8125rem;color:var(--faint)}
.loop-back::before{content:"↻ ";color:var(--muted)}

/* Footer */
.footer{border-top:1px solid var(--line);padding-block:36px 44px;font-family:var(--mono);font-size:.8125rem;color:var(--faint)}
.footer-inner{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 32px}
.footer nav{display:flex;flex-wrap:wrap;gap:12px 24px}
.footer a:hover{color:var(--ink)}

/* Responsive */
@media (max-width:960px){
  .hero-grid,.proof{grid-template-columns:minmax(0,1fr)}
  .metric-card{right:-12px}
  .hero h1{max-width:16ch}
  .story{grid-template-columns:minmax(0,1fr);gap:18px}
}
@media (max-width:760px){
  :root{--nav-h:64px;--logo:30px}
  .nav-links a:not(.btn){display:none}
  .brand{font-size:1rem}
  .flow,.start,.offer,.loop-steps,.work{grid-template-columns:minmax(0,1fr)}
  .work{gap:36px}
  .metric-card{position:static;width:auto;grid-column:1/-1;margin-top:4px}
  .flow li{margin:0 0 32px;padding-right:0}
  .flow li:last-child{margin-bottom:0}
  .flow li:not(:last-child)::after{content:"↓";right:0}
  .plan+.plan{border-left:0;border-top:1px solid var(--line-strong)}
  .start li,.start li+li,.loop-steps li,.loop-steps li+li{padding:18px 0;border-left:0}
  .start li+li,.loop-steps li+li{border-top:1px solid var(--line)}
  .record li{grid-template-columns:minmax(0,1fr);gap:4px}
  .platforms ul{gap:10px 24px;font-size:.9375rem}
  .chart text{font-size:20px}
  .chart .label{font-size:20px}
  .chart .annot{display:none}
  .compare{min-width:0}
  .compare thead{display:none}
  .compare,.compare tbody,.compare tr,.compare th,.compare td{display:block;width:auto}
  .compare tr{padding:18px 0;border-bottom:1px solid var(--line)}
  .compare tr:first-child{border-top:1px solid var(--line-strong)}
  .compare th,.compare td,.compare .us{border:0;padding:3px 0}
  .compare tbody th{padding:0 0 8px;width:auto}
  .compare td{display:grid;grid-template-columns:130px minmax(0,1fr);gap:12px}
  .compare td::before{content:attr(data-label);font-family:var(--mono);font-size:.75rem;color:var(--faint);padding-top:3px}
  .compare td.us::before{color:var(--ink)}
}
@media (max-width:520px){
  .trace-step{grid-template-columns:minmax(0,1fr);gap:2px}
  .shifts{grid-template-columns:minmax(0,1fr)}
  .shifts li,.shifts li+li{padding:12px 0;border-left:0}
  .shifts li+li{border-top:1px solid var(--line)}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}

/* ---- Version B ---- */
/* Two gates: a two-step sequence */
.gates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.gates li{position:relative;border-top:2px solid var(--stage);padding-top:24px;display:flex;flex-direction:column;gap:12px}
.gates li:first-child::after{content:"→";position:absolute;right:0;top:18px;font-family:var(--mono);color:var(--faint)}
.gates .step{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.75rem;color:var(--faint)}
.gates h3{font-size:1.5rem;letter-spacing:-.05em}
.gates p{font-size:1rem;max-width:44ch}
/* D */
.net-wrap{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:clamp(28px,4vw,56px);align-items:start}
.net-fig{margin:0;min-width:0}
.net{width:100%;height:auto;display:block}
.net .edges line{stroke:var(--line);stroke-width:1}
.net .bgdots circle{fill:#3a3a37}
.net .target{fill:rgba(240,240,238,.025);stroke:var(--muted);stroke-width:1;stroke-dasharray:4 5}
.net .target-label,.net .outside-label{font-family:var(--mono);font-size:12px;fill:var(--faint)}
.net .target-label{fill:var(--muted)}
.net .node circle{fill:var(--bg);stroke:#55554f;stroke-width:1.5;transition:fill .4s,stroke .4s}
.net .node text{font-family:var(--sans);font-size:12.5px;fill:var(--faint);transition:fill .4s;paint-order:stroke;stroke:var(--bg);stroke-width:5px;stroke-linejoin:round}
.net .target-label,.net .outside-label,.net .product text{paint-order:stroke;stroke:var(--bg);stroke-width:5px}
.net .link{stroke:var(--line-strong);stroke-width:1;stroke-dasharray:2 4;opacity:0;transition:opacity .4s}
.net .product circle{fill:var(--ink)}
.net .product text{font-family:var(--mono);font-size:12px;fill:var(--ink)}
.net-wrap[data-state="t"] .node.t circle,.net-wrap[data-state="a"] .node.a circle{fill:var(--stage);stroke:var(--stage)}
.net-wrap[data-state="t"] .node.t text,.net-wrap[data-state="a"] .node.a text{fill:var(--ink)}
.net-wrap[data-state="t"] .link.t,.net-wrap[data-state="a"] .link.a{opacity:1}
.net-legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:10px}
.net-legend span{display:inline-flex;align-items:center;gap:8px}
.net-legend .lg{width:9px;height:9px;border-radius:50%;background:var(--stage)}
.net-legend .lg.gap{background:transparent;border:1.5px solid #55554f}
.net-panel{display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--line-strong);padding-top:18px}
.seg{display:inline-flex;border:1px solid var(--line-strong);align-self:flex-start}
.seg button{font-family:var(--mono);font-size:.8125rem;padding:9px 14px;color:var(--faint)}
.seg button+button{border-left:1px solid var(--line-strong)}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.cov-num{font-family:var(--mono);font-size:clamp(3rem,6vw,4.5rem);letter-spacing:-.07em;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums;margin-top:8px}
.cov-sub{font-size:.9375rem}
.net-wrap[data-state="t"] .v-a,.net-wrap[data-state="a"] .v-t{display:none}
.net-steps{border-top:1px solid var(--line);margin-top:6px}
.net-steps li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}
.net-steps .step{font-family:var(--mono);font-size:.75rem;color:var(--faint);padding-top:3px}
.net-steps p{font-size:.9375rem}
.net-steps b{font-weight:400;color:var(--ink)}
@media (max-width:900px){.net-wrap{grid-template-columns:minmax(0,1fr)}.net .node text{font-size:15px}}

.net .keypath polyline{fill:none;stroke:var(--repeat);stroke-width:2.5;stroke-linejoin:round}
.net .keypath .kp-start{fill:var(--repeat)}
.net .keypath text{font-family:var(--mono);font-size:12px;fill:var(--repeat);paint-order:stroke;stroke:var(--bg);stroke-width:5px}
.net-legend .lg.line{width:16px;height:2px;border-radius:0}
/* Breakout cases: four parallel items */
.cases{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:24px;row-gap:40px}
.case{border-top:1px solid var(--line-strong);padding-top:20px;display:grid;grid-row:span 5;grid-template-rows:subgrid;row-gap:12px;min-width:0}
.case-name{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:1.05rem;color:var(--ink)}
.case-name .brand-logo{width:20px;height:20px}
.case-path{font-family:var(--mono);font-size:.8125rem;color:var(--ink);display:flex;flex-direction:column;gap:4px}
.case-path span{font-size:.6875rem;text-transform:uppercase;letter-spacing:.06em;color:var(--repeat)}
.case-why{font-size:.9375rem}
.case-stat{align-self:start;font-family:var(--mono);font-size:.875rem;color:var(--ink);border-top:1px solid var(--line);padding-top:12px}
.case-src a{border-bottom:1px solid var(--line-strong)}
.case-src a:hover{color:var(--ink)}
@media (max-width:960px){.cases{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.cases,.gates{grid-template-columns:minmax(0,1fr)}.gates li:first-child::after{content:"↓"}}

/* Version B mobile */
.start.after{margin-top:clamp(40px,5vw,56px);margin-bottom:0}
@media (max-width:760px){
  .demo-tabs{padding:0 4px}
  .demo-panel{padding:16px 16px 18px;gap:14px}
  .demo .q{font-size:.875rem;max-width:90%}
  .demo .a{grid-template-columns:minmax(0,1fr);gap:10px}
  .demo .a>.avatar{display:none}
  .agent-name{padding-top:0}
  .answer>p{font-size:.875rem}
  .options li{padding:9px 0}
  .options li:not(.picked) p:not(.opt-name){display:none}
  .done{font-size:.75rem}
  .metric-card{padding:10px 12px 12px}
  .metric-card dd{font-size:.75rem}
  .demo figcaption{padding:10px 16px}
}

/* Version B: Linear-style sections */
/* Type: sentence-case sans headings for clarity; mono stays for labels, data and UI */
.b h1,.b h2{font-family:var(--sans);text-transform:none;font-weight:500;letter-spacing:-.035em}
.b h1{font-size:clamp(2.6rem,5.2vw,4.5rem);line-height:1.02}
.b .hero h1{font-size:clamp(2.6rem,5.2vw,4.5rem);max-width:12ch}
.b h2{font-size:clamp(2rem,3.6vw,3.1rem);line-height:1.06;max-width:16ch}
.b h3{font-family:var(--sans);text-transform:none;font-weight:500;letter-spacing:-.015em;font-size:1.0625rem}
.b .gates h3{font-size:1.375rem}
.b .plan h3{font-size:clamp(1.4rem,2.2vw,1.75rem);letter-spacing:-.03em}
/* Section head: title left, copy right */
.b .section .head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px clamp(32px,6vw,96px);align-items:end;margin-bottom:clamp(48px,6vw,80px)}
.b .section .head .lead{color:var(--muted);font-size:clamp(1.0625rem,1.4vw,1.25rem);max-width:42ch;justify-self:start}
/* Product-like UI mocks get soft corners */
.b .demo{border-radius:14px;overflow:visible}
.b .demo .demo-tabs{border-radius:14px 14px 0 0}
.b .metric-card{border-radius:10px}
/* Coverage: unboxed, the network fades into the page */
.b .net-wrap{display:block}
.b .net-fig{position:relative;margin:0 calc(-1 * clamp(0px,3vw,40px))}
.b .net{-webkit-mask-image:radial-gradient(ellipse 72% 68% at 50% 52%,#000 58%,transparent 100%);mask-image:radial-gradient(ellipse 72% 68% at 50% 52%,#000 58%,transparent 100%)}
.b .net .target{fill:none;stroke:var(--line-strong);stroke-dasharray:3 6}
.b .net .target-label{fill:var(--faint)}
.b .score-card{position:absolute;top:4%;right:clamp(0px,3vw,40px);width:240px;background:rgba(16,16,16,.92);border:1px solid var(--line-strong);padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;box-shadow:0 24px 60px rgba(0,0,0,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.b .score-card .seg{align-self:flex-start}
.b .score-card .seg button{padding:7px 10px;font-size:.75rem}
.b .score-card .cov-num{font-size:3rem;margin-top:8px}
.b .score-card .cov-sub{font-size:.875rem}
.b .net-legend{padding:0 clamp(0px,3vw,40px)}
.b .net-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:0;margin-top:clamp(36px,5vw,56px)}
.b .net-steps li{display:flex;flex-direction:column;gap:8px;padding:0 24px 0 0;border-bottom:0}
.b .net-steps li+li{padding-left:24px;border-left:1px solid var(--line)}
.b .net-steps .step{padding:0}
@media (max-width:760px){
  .b .section .head{grid-template-columns:minmax(0,1fr);gap:16px}
  .b .score-card{position:static;width:auto;margin:8px 0 0}
  .b .net-steps{grid-template-columns:minmax(0,1fr)}
  .b .net-steps li,.b .net-steps li+li{padding:16px 0;border-left:0;border-top:1px solid var(--line)}
  .b .net-fig{margin:0}
}
.b h2{max-width:20ch}
.b .score-card{background:var(--surface)}
.b .net .node text{font-size:10.5px;stroke-width:4px}
.b .net .product text,.b .net .keypath text,.b .net .target-label{font-size:10px}
@media (max-width:760px){.b .net .node text{font-size:15px}}
.b .score-card{z-index:2}
.b .hero h1{font-size:clamp(2.6rem,4.6vw,4.1rem);max-width:none}
@media (max-width:760px){
  /* Phone: dots tell the story; only the key path is labelled */
  .b .net .node text,.b .net .target-label,.b .net .kp-label{display:none}
  .b .net .node.kp text{display:block;font-size:26px;stroke-width:7px}
  .b .net .product text,.b .net .keypath text:not(.kp-label){font-size:24px}
  .b .net .node circle{r:9}
  .b .net .bgdots circle{r:3}
  .b .net .edges line{stroke-width:1.5}
}

/* Result card floats over the chat edge; offset shrinks so it never leaves the viewport */
.b .metric-card{z-index:3;right:-40px}
@media (max-width:1240px){.b .metric-card{right:-14px}}
@media (max-width:760px){.b .metric-card{right:auto}}
@media (max-width:1240px){.b .net-fig{margin:0}.b .score-card{right:0}.b .net-legend{padding:0}}
.b .metric-card{right:-56px}
@media (max-width:1240px){.b .metric-card{right:-32px}}
@media (max-width:760px){.b .metric-card{right:auto}}

/* Result card hangs from the picked row, so it lines up at every width */
.options li.picked{position:relative}
.b .metric-card{top:calc(100% - 10px)}
@media (max-width:760px){.b .options li.picked .metric-card{position:static;grid-column:1/-1;margin-top:8px}}
.options .metric-card .brand-logo{color:var(--bg);margin-top:0}
.options .metric-card p{font-size:.8125rem;line-height:1.4;color:var(--bg)}
/* Hero lead: two lines on laptop and larger screens */
.b .hero .lead{max-width:none;font-size:clamp(1.0625rem,1.3vw,1.15rem);text-wrap:balance}
/* Offer: two separate steps with an arrow between them */
.b .offer{border:0;gap:56px}
.b .plan{position:relative;border:1px solid var(--line-strong)}
.b .plan+.plan{border-left:1px solid var(--line-strong)}
.b .plan:first-child::after{content:"→";position:absolute;right:-38px;top:50%;transform:translateY(-50%);font-family:var(--mono);font-size:1.25rem;color:var(--faint)}
@media (max-width:760px){
  .b .offer{gap:48px}
  .b .plan+.plan{border-top:1px solid var(--line-strong)}
  .b .plan:first-child::after{content:"↓";right:auto;left:50%;top:auto;bottom:-38px;transform:translateX(-50%)}
}
/* Mapping box: input → research → output */
.phases{display:flex;flex-direction:column;gap:18px}
.phase{display:flex;flex-direction:column;gap:8px}
.phase-label{font-family:var(--mono);font-size:.6875rem;text-transform:uppercase;letter-spacing:.06em;color:var(--faint)}
.phase .checks{border-top:1px solid var(--line)}
.subtags{display:flex;flex-wrap:wrap;gap:6px;padding-left:30px}
.subtags li{font-family:var(--mono);font-size:.75rem;color:var(--muted);border:1px solid var(--line-strong);padding:4px 9px}
/* Founder: bottom CTA and about page */
.founder-cta{display:flex;flex-wrap:wrap;align-items:center;gap:24px 40px;padding:28px 0;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line)}
.founder{display:flex;align-items:center;gap:16px}
.founder img{width:64px;height:64px;object-fit:cover;display:block;filter:grayscale(1) contrast(1.05)}
.founder-name{color:var(--ink);font-size:1rem;font-weight:500;max-width:none}
.founder-role{font-family:var(--mono);font-size:.75rem;color:var(--faint);margin-top:2px;max-width:none}
.founder-cta .contact-line{margin-left:auto}
.about-intro{display:flex;align-items:center;gap:clamp(24px,4vw,48px)}
.about-intro .portrait{width:140px;height:140px;object-fit:cover;flex-shrink:0;filter:grayscale(1) contrast(1.05)}
.about-intro .lead{margin-top:16px}
@media (max-width:760px){
  .founder-cta .contact-line{margin-left:0}
  .about-intro{flex-direction:column;align-items:flex-start}
  .about-intro .portrait{width:96px;height:96px}
}
/* Network labels: no dark halo */
.net text{stroke:none!important;paint-order:normal}

/* Evidence: agent runs */
.b .evidence{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.b .evidence>li{display:flex;flex-direction:column;gap:10px}
.b .evidence .step{font-family:var(--mono);font-size:.75rem;color:var(--faint);margin-top:14px}
.b .evidence h3{font-size:1.25rem;letter-spacing:-.03em}
.b .evidence>li>p{font-size:.9375rem;color:var(--muted);max-width:40ch}
.ev-card{border:1px solid var(--line);background:var(--surface);padding:18px;display:flex;flex-direction:column;gap:14px;min-height:196px}
.ev-head{display:flex;justify-content:space-between;gap:12px;font-family:var(--mono);font-size:.75rem;color:var(--muted)}
.ev-head span:last-child{color:var(--faint)}
.ev-foot{font-family:var(--mono);font-size:.6875rem;color:var(--faint);margin-top:auto}
.bars{display:flex;flex-direction:column;gap:12px}
.bars li{display:grid;grid-template-columns:minmax(0,7.5rem) minmax(0,1fr) 2.75rem;align-items:center;gap:10px;font-size:.875rem;color:var(--muted)}
.bar-name{display:flex;align-items:center;gap:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar-name .brand-logo{width:14px;height:14px;flex:none}
.bar{height:6px;background:var(--line)}
.bar i{display:block;height:100%;background:var(--line-strong)}
.bars li.you{color:var(--ink)}
.bars li.you .bar i{background:var(--stage)}
.bars li.was .bar i{background:color-mix(in srgb,var(--stage) 38%,var(--line))}
.bar-v{font-family:var(--mono);font-size:.8125rem;text-align:right}
.stack{display:flex;height:10px;gap:2px}
.stack i,.sw{display:block;height:100%}
.s1{background:var(--stage)}.s2{background:#6b6b66}.s3{background:#4a4a46}.s4{background:#333331}
.legend{display:flex;flex-direction:column;gap:7px}
.legend li{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:10px;font-size:.875rem;color:var(--muted)}
.legend li:first-child{color:var(--ink)}
.legend .sw{width:10px;height:10px}
.legend li span:last-child{font-family:var(--mono);font-size:.8125rem}
.ev-note{margin-top:28px}
@media (max-width:900px){.b .evidence{grid-template-columns:minmax(0,1fr);gap:48px}.ev-card{min-height:0}}

/* Sample theme from a mapping */
.sample{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,5vw,64px);margin-top:56px;padding-top:40px;border-top:1px solid var(--line)}
.sample-theme{display:flex;flex-direction:column;gap:12px}
.sample-theme .tag{color:var(--muted)}
.sample-theme h3{font-size:1.5rem;letter-spacing:-.04em}
.sample-theme p{color:var(--muted);max-width:40ch}
.sample-actions{border-top:1px solid var(--line)}
.sample-actions li{display:grid;grid-template-columns:8px minmax(0,1fr) auto;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid var(--line);font-size:.9375rem}
.sample-actions .dot{width:7px;height:7px;border-radius:50%;background:var(--stage)}
.sa-tag{font-family:var(--mono);font-size:.6875rem;color:var(--stage)}
@media (max-width:760px){.sample{grid-template-columns:minmax(0,1fr)}}

/* FAQ */
.faq{border-top:1px solid var(--line);max-width:860px;margin-left:auto}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;font-size:1.0625rem;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--mono);color:var(--faint);font-size:1.125rem;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:focus-visible{outline:1px solid var(--discover);outline-offset:4px}
.faq details p{color:var(--muted);padding:0 0 22px;max-width:62ch}
@media (max-width:760px){.faq{margin-left:0}}
@supports (grid-template-rows:subgrid){
  .b .evidence>li{display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:10px}
  @media (max-width:900px){.b .evidence>li{grid-row:auto;grid-template-rows:none}}
}
.faq{max-width:none;margin-left:calc(50% + clamp(16px,3vw,48px))}
@media (max-width:760px){.faq{margin-left:0}}
.ev-card{min-height:172px}

/* Example report page */
.report{margin-top:56px;background:#f3f2ee;color:#171716;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.rp-top,.rp-foot{display:flex;justify-content:space-between;gap:16px;padding:14px 28px;font-family:var(--mono);font-size:.75rem;color:#6d6c67}
.rp-top{border-bottom:1px solid #d9d8d2}
.rp-top span:first-child{color:#171716}
.rp-foot{border-top:1px solid #d9d8d2}
.rp-body{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(24px,4vw,56px);padding:32px 28px 36px}
.rp-theme{display:flex;flex-direction:column;gap:12px}
.rp-meta{font-family:var(--mono);font-size:.75rem;color:#6d6c67}
.rp-theme h3{font-size:1.625rem;letter-spacing:-.04em;color:#111}
.rp-theme>p{color:#4a4945;font-size:.9375rem;max-width:38ch}
.rp-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:8px;border-top:1px solid #d9d8d2}
.rp-stats div{padding:12px 10px 0 0}
.rp-stats div+div{padding-left:12px;border-left:1px solid #d9d8d2}
.rp-stats dt{font-family:var(--mono);font-size:.6875rem;color:#6d6c67}
.rp-stats dd{font-size:1.125rem;margin-top:4px;color:#111}
.rp-actions{width:100%;border-collapse:collapse;font-size:.875rem;align-self:start}
.rp-actions th{text-align:left;font-family:var(--mono);font-size:.6875rem;font-weight:400;color:#6d6c67;padding:0 10px 10px 0;border-bottom:1px solid #bdbcb5}
.rp-actions td{padding:12px 10px 12px 0;border-bottom:1px solid #d9d8d2;color:#1d1d1b;vertical-align:top}
.rp-actions .n{width:1.75rem;font-family:var(--mono);color:#8a8984}
.rp-actions td[data-stage]{white-space:nowrap;font-family:var(--mono);font-size:.75rem;color:#4a4945}
.rp-actions td[data-stage] .dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:7px;vertical-align:1px;background:color-mix(in srgb,var(--stage) 70%,#000)}
.rp-actions .o{color:#4a4945}
.rp-actions .e{font-family:var(--mono);font-size:.75rem;color:#4a4945;text-align:center;width:3.25rem}
@media (max-width:900px){.rp-body{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.rp-top,.rp-foot{padding:12px 16px}.rp-body{padding:22px 16px 26px}.rp-actions .o,.rp-actions .e{display:none}}

/* Founder quote + Carryo proof */
.quote-proof{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,7vw,104px);align-items:center}
.fquote{margin:0;display:flex;flex-direction:column;gap:32px}
.fquote blockquote{margin:0;display:flex;flex-direction:column;gap:20px}
.fq-big{font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.25;letter-spacing:-.035em;color:var(--ink);max-width:24ch;text-indent:-.42em}
.fq-big::before{content:"“"}
.fq-big::after{content:"”"}
.fquote blockquote p:not(.fq-big){color:var(--muted);font-size:1.0625rem;max-width:44ch}
.fquote .founder img{width:48px;height:48px}
.proof-side{display:flex;flex-direction:column;gap:28px;min-width:0}
.proof-side .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
.proof-side .stats li+li{padding-left:20px;border-left:1px solid var(--line)}
@media (max-width:900px){.quote-proof{grid-template-columns:minmax(0,1fr)}.fq-big{max-width:28ch}}

/* Example report toggle */
.report-toggle{margin-top:40px}
.report-toggle summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.8125rem;color:var(--ink);border:1px solid var(--line-strong);padding:12px 16px}
.report-toggle summary::-webkit-details-marker{display:none}
.report-toggle summary:hover{border-color:var(--muted)}
.report-toggle summary:focus-visible{outline:1px solid var(--discover);outline-offset:3px}
.report-toggle summary .icon{width:16px;height:16px}
.rt-sign::before{content:"+";color:var(--faint);margin-left:6px}
.report-toggle[open] .rt-sign::before{content:"−"}
.report-toggle .report{margin-top:20px}
@media (max-width:760px){.fq-big{text-indent:0}.proof-side .chart figcaption span:last-child{display:none}}

/* Hero demo: both examples share one height, no jump between tabs */
.b .demo{display:grid;grid-template-rows:auto 1fr}
.b .demo>.demo-panel{grid-row:2;grid-column:1}
.b .demo>.demo-panel[hidden]{display:flex!important;visibility:hidden}
.b .demo>.demo-panel{visibility:hidden}
.b .demo>.demo-panel.is-active{visibility:visible}
.fq-points{display:flex;flex-direction:column;gap:10px;border-left:1px solid var(--line-strong);padding-left:18px}
.fq-points li{color:var(--muted);font-size:1.0625rem;max-width:46ch}
.fquote blockquote p.fq-answer{color:var(--ink)}
.fq-big{text-indent:0}

/* Version C: agents we test across, under the hero CTAs */
.hero-agents{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:8px;font-family:var(--mono);font-size:.75rem;color:var(--faint)}
.hero-agents ul{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.hero-agents .brand-logo{width:18px;height:18px;color:var(--muted)}
.hero-copy .actions{margin-top:4px}
.b .evidence .step{display:flex;align-items:center;gap:8px}
.founder-quote{color:var(--ink);font-size:1.0625rem;line-height:1.45;max-width:40ch;margin-bottom:10px}
.founder-cta .founder{align-items:flex-start}

/* Version C: two CTA rows (email, snapshot booking) */
.cta-rows{border-top:1px solid var(--line-strong)}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;padding:24px 0;border-bottom:1px solid var(--line)}
.cta-text{display:flex;align-items:center;gap:16px;min-width:0}
.cta-face{width:48px;height:48px;object-fit:cover;filter:grayscale(1) contrast(1.05);flex-shrink:0}
.cta-icon{width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--line-strong);flex-shrink:0;color:var(--muted)}
.cta-q{color:var(--ink);font-size:1.0625rem;max-width:none}
.cta-sub{font-size:.9375rem;max-width:none}
.snapshot{display:block}
.snapshot summary{list-style:none;cursor:pointer;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px}
.snapshot summary::-webkit-details-marker{display:none}
.snapshot summary:focus-visible{outline:1px solid var(--discover);outline-offset:6px}
.snapshot[open] summary .btn{background:transparent;color:var(--ink)}
.snap-form{margin-top:24px;padding:24px;border:1px solid var(--line-strong);background:var(--surface);display:flex;flex-direction:column;gap:20px}
.field{display:flex;flex-direction:column;gap:8px}
.field span,.slots legend{font-family:var(--mono);font-size:.75rem;color:var(--faint);padding:0}
.field input{font:inherit;font-size:1rem;color:var(--ink);background:var(--bg);border:1px solid var(--line-strong);padding:12px 14px;min-height:48px;width:100%;max-width:520px}
.field input:focus{outline:none;border-color:var(--ink)}
.field input[aria-invalid="true"]{border-color:#ff8a7a}
.slots{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.chip span{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border:1px solid var(--line-strong);font-family:var(--mono);font-size:.8125rem;color:var(--muted)}
.chip input:checked+span{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.chip input:focus-visible+span{outline:1px solid var(--discover);outline-offset:2px}
.snap-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.snap-note{font-size:.875rem;max-width:48ch}
@media (max-width:760px){.cta-row,.snapshot summary{align-items:flex-start}.snap-form{padding:18px}}
.steps-label{font-family:var(--mono);font-size:.75rem;color:var(--faint);margin-top:clamp(64px,8vw,96px);margin-bottom:14px;max-width:none}
.steps-label+.start.after{margin-top:0}
.cta-rows.after-path{margin-top:clamp(48px,6vw,72px)}
.start-actions{display:flex;flex-wrap:wrap;gap:12px;padding-top:28px;border-top:1px solid var(--line-strong)}
.start-actions+.snap-form{margin-top:20px}
.start-actions [aria-expanded="true"]{background:transparent;color:var(--ink)}
.start-actions{align-items:center;justify-content:space-between;gap:20px 40px}
.start-actions .founder img{width:56px;height:56px}
.start-buttons{display:flex;flex-wrap:wrap;gap:12px}

/* Client quote band (after hero) */
.client-quote{border-top:1px solid var(--line);padding-block:clamp(48px,6vw,72px)}
.cq-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px clamp(32px,6vw,96px);align-items:center}
.cq-logo{display:flex;align-items:center;min-height:40px}
.cq-logo img{height:34px;width:auto;display:block}
.cq-name{font-family:var(--mono);font-size:1.25rem;letter-spacing:-.02em;color:var(--ink)}
.cq{margin:0;display:flex;flex-direction:column;gap:14px}
.cq blockquote{margin:0}
.cq blockquote p{color:var(--ink);font-size:clamp(1.125rem,1.6vw,1.375rem);line-height:1.45;letter-spacing:-.015em;max-width:44ch}
.cq figcaption{font-family:var(--mono);font-size:.75rem;color:var(--faint)}
@media (max-width:760px){.cq-grid{grid-template-columns:minmax(0,1fr)}}

/* Proof: two cases, same anatomy and size */
.cases2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px clamp(32px,5vw,72px)}
.case2{display:grid;grid-template-rows:subgrid;grid-row:span 5;row-gap:16px;border-top:1px solid var(--line-strong);padding-top:28px;min-width:0}
.c2-brand{display:flex;align-items:center;height:28px}
.c2-brand img{height:26px;width:auto;display:block}
.c2-word{font-family:var(--mono);font-size:1.25rem;letter-spacing:-.03em;color:var(--ink);text-transform:uppercase}
.c2-quote{margin:0;display:contents}
.c2-head{color:var(--ink);font-size:clamp(1.375rem,2vw,1.75rem);line-height:1.25;letter-spacing:-.03em;max-width:none}
.c2-body{font-size:1.0625rem;max-width:44ch}
.c2-visual{align-self:end}
.case2 .chart{margin:0}
.case2 .chart svg{max-height:200px}
.c2-gaps{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;font-family:var(--mono);font-size:.8125rem;color:var(--ink);border:1px solid var(--line);background:var(--surface);padding:18px}
.c2-gaps span{display:inline-flex;align-items:center;gap:8px}
.c2-gaps .c2-arrow{color:var(--faint)}
.c2-cap{font-family:var(--mono);font-size:.75rem;color:var(--faint);border-top:1px solid var(--line);padding-top:12px;max-width:none}
@media (max-width:900px){.cases2{grid-template-columns:minmax(0,1fr);gap:56px}.case2{grid-row:auto;grid-template-rows:none;display:flex;flex-direction:column}}
.c2-quote{display:block;grid-row:span 3;margin:0}
.c2-quote p{color:var(--ink);font-size:clamp(1.375rem,2.1vw,1.875rem);line-height:1.3;letter-spacing:-.03em;max-width:24ch}

/* Results: one row per case, same anatomy (logo + tag | title + content) */
.case-list{border-top:1px solid var(--line-strong)}
.case-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:20px clamp(32px,6vw,96px);padding:36px 0;border-bottom:1px solid var(--line)}
.cr-side{display:flex;flex-direction:column;gap:12px}
.cr-logo{height:26px;width:auto;display:block}
.cr-lockup{display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:500;font-size:1.5rem;letter-spacing:-.03em;color:var(--ink);line-height:1}
.cr-lockup img{width:26px;height:26px;display:block}
.cr-tag{font-family:var(--mono);font-size:.75rem;color:var(--faint);max-width:none}
.cr-main{display:flex;flex-direction:column;gap:14px;min-width:0}
.cr-title{font-size:clamp(1.375rem,2vw,1.75rem)!important;line-height:1.2;letter-spacing:-.03em!important;color:var(--ink)}
.cr-quote{margin:0}
.cr-quote p,.cr-text{font-size:1.0625rem;color:var(--muted);max-width:56ch}
.cr-chart{margin:8px 0 0}
.cr-chart svg{max-height:220px}
@media (max-width:760px){.case-row{grid-template-columns:minmax(0,1fr)}}
.cr-side{align-items:flex-start}
.cr-chart{max-width:600px}
.cr-chart svg{max-height:none}

/* ---- Hero path visual: task → Found → Chosen → Working → Returning ---- */
.hero-path{padding-block:clamp(48px,7vw,96px) clamp(48px,6vw,80px)}
.hero-top{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px clamp(32px,6vw,96px);align-items:end;margin-bottom:clamp(40px,5vw,64px)}
.b .hero-top h1{font-size:clamp(2.5rem,4.6vw,4.1rem);max-width:13ch}
.hero-side{display:flex;flex-direction:column;gap:24px}
.hero-side .lead{max-width:40ch}
.hero-path .hero-agents{margin-top:clamp(28px,3vw,40px)}
.path-viz{position:relative;margin:0;padding-top:72px}
.path-field{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:0}
.pv-task{position:absolute;top:0;left:0;display:flex;align-items:center;gap:10px;z-index:1}
.pv-task .avatar{background:var(--bg)}
.pv-bubble{background:var(--bg);border:1px solid var(--line-strong);border-radius:16px 16px 16px 4px;padding:9px 16px;color:var(--ink);font-size:.9375rem;min-height:40px;min-width:12ch;max-width:none}
.pv-typed::after{content:"";display:inline-block;width:1px;height:1em;background:var(--muted);margin-left:2px;vertical-align:-2px;animation:pvcaret 1s steps(1) infinite}
.path-viz.is-done .pv-typed::after{display:none}
@keyframes pvcaret{50%{opacity:0}}
.pv-stages{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,44px)}
.pv-card{background:var(--surface);border:1px solid var(--line);padding:16px 16px 14px;display:flex;flex-direction:column;gap:14px;min-height:218px;min-width:0;transition:border-color .6s,box-shadow .6s}
.pv-card.is-on{border-color:color-mix(in srgb,var(--stage) 50%,var(--line));box-shadow:0 24px 60px -28px color-mix(in srgb,var(--stage) 55%,transparent)}
.pv-head{display:flex;align-items:center;gap:8px;font-size:1rem;font-weight:500;color:var(--ink);max-width:none}
.pv-n{font-family:var(--mono);font-size:.6875rem;font-weight:400;color:var(--faint);margin-right:2px}
.pv-card .dot{transition:background .5s}
.pv-card:not(.is-on) .dot{background:var(--line-strong)}
.pv-ui{flex:1;font-size:.8125rem;opacity:.3;transition:opacity .6s}
.pv-card.is-on .pv-ui{opacity:1}
.pv-cap{font-family:var(--mono);font-size:.6875rem;color:var(--faint);border-top:1px solid var(--line);padding-top:10px;max-width:none}
.pv-card.is-on .pv-cap{color:var(--muted)}
/* Found */
.pv-q{font-family:var(--mono);font-size:.6875rem;color:var(--faint);margin-bottom:8px;max-width:none}
.pv-list ul{display:flex;flex-direction:column;gap:4px}
.pv-list li{display:flex;align-items:center;gap:9px;padding:6px 8px;border:1px solid transparent;color:var(--muted);font-family:var(--mono);font-size:.8125rem;transition:border-color .5s,background .5s,color .5s,transform .5s}
.pv-list .brand-logo{width:14px;height:14px}
.pv-card.is-on .pv-list li{transform:none}
.pv-card.is-on .pv-list li.hit{border-color:color-mix(in srgb,var(--stage) 60%,transparent);background:color-mix(in srgb,var(--stage) 8%,transparent);color:var(--ink);transition-delay:.45s}
/* Chosen */
.pv-pick{display:flex;flex-direction:column;gap:10px}
.pv-pickrow{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:.875rem;color:var(--ink);max-width:none}
.pv-pickrow .brand-logo{width:16px;height:16px}
.pv-pick .badge{opacity:0;transform:scale(.8);transition:opacity .4s .5s,transform .4s .5s}
.pv-card.is-on .pv-pick .badge{opacity:1;transform:none}
.pv-say{font-size:.875rem;color:var(--muted);line-height:1.45}
/* Working */
.pv-term{font-family:var(--mono);font-size:.75rem;line-height:1.9;color:var(--muted)}
.pv-term p{max-width:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pv-term .ok{color:var(--ink)}
.pv-term p:nth-child(n+2){opacity:0;transition:opacity .3s}
.pv-card.is-on .pv-term p:nth-child(2){opacity:1;transition-delay:.7s}
.pv-card.is-on .pv-term p:nth-child(3){opacity:1;transition-delay:1.3s}
.pv-card.is-on .pv-term .ok{color:var(--ink)}
/* Returning */
.pv-chart svg{width:100%;height:96px;display:block;overflow:visible}
.pv-line{fill:none;stroke:var(--stage);stroke-width:2;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:320;stroke-dashoffset:320;transition:stroke-dashoffset 1.6s cubic-bezier(.3,.7,.2,1)}
.pv-area{fill:var(--stage);opacity:0;transition:opacity 1s .6s}
.pv-card.is-on .pv-line{stroke-dashoffset:0}
.pv-card.is-on .pv-area{opacity:.08}
@media (max-width:900px){.pv-stages{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){
  .hero-top{grid-template-columns:minmax(0,1fr);gap:20px}
  .pv-stages{grid-template-columns:minmax(0,1fr);gap:28px}
  .pv-card{min-height:0}
  .pv-chart svg{height:72px}
}
@media (prefers-reduced-motion:reduce){.pv-typed::after{display:none}}
.pv-stages{gap:clamp(24px,4.2vw,64px)}
@media (max-width:760px){.pv-stages{gap:36px}.pv-card{padding:14px;gap:10px}.pv-list li{padding:4px 8px}.pv-chart svg{height:56px}}

/* Hero odds: Claude mid-sentence, with the next-word odds that decide the pick */
.odds-viz{--glow:var(--discover);position:relative;margin:0;border:1px solid var(--line-strong);background:var(--surface);box-shadow:0 48px 140px -70px color-mix(in srgb,var(--glow) 45%,transparent);transition:box-shadow 1.2s}
.odds-viz.is-after{--glow:var(--use)}
.ov-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 12px 10px 18px;border-bottom:1px solid var(--line)}
.ov-agent{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.8125rem;color:var(--muted)}
.ov-agent .brand-logo{width:15px;height:15px;color:var(--ink)}
.ov-toggle{display:flex;border:1px solid var(--line-strong)}
.ov-toggle button{font:inherit;font-family:var(--mono);font-size:.75rem;color:var(--muted);background:none;border:0;padding:6px 12px;cursor:pointer;transition:background .3s,color .3s}
.ov-toggle button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.ov-toggle button:focus-visible{outline:2px solid var(--discover);outline-offset:2px}
.ov-body{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.ov-chat{display:flex;flex-direction:column;gap:22px;padding:clamp(20px,2.6vw,32px)}
.ov-user{align-self:flex-end;background:var(--bg);border:1px solid var(--line-strong);border-radius:16px 16px 4px 16px;padding:9px 16px;color:var(--ink);font-size:.9375rem;min-height:40px;max-width:none}
.ov-typed::after{content:"";display:inline-block;width:1px;height:1em;background:var(--muted);margin-left:2px;vertical-align:-2px;animation:pvcaret 1s steps(1) infinite}
.odds-viz.is-typed .ov-typed::after{display:none}
.ov-reply{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;align-items:start}
.ov-msg{display:flex;flex-direction:column;gap:10px;padding-top:5px}
.ov-think{font-family:var(--mono);font-size:.75rem;color:var(--faint);max-width:none;opacity:0;transition:opacity .4s}
.odds-viz.is-thinking .ov-think{opacity:1;background:linear-gradient(90deg,var(--faint) 30%,var(--ink) 50%,var(--faint) 70%) 0 0/300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:ovshine 1.4s linear infinite}
.odds-viz.is-said .ov-think{opacity:1}
@keyframes ovshine{from{background-position:100% 0}to{background-position:0 0}}
.ov-say{font-size:clamp(1.0625rem,1.5vw,1.25rem);line-height:1.45;color:var(--ink);min-height:2.9em;max-width:30ch;transition:opacity .35s}
.ov-run,.ov-think,.ov-captext{transition:opacity .35s}
.odds-viz.is-reset .ov-say,.odds-viz.is-reset .ov-run,.odds-viz.is-reset .ov-think,.odds-viz.is-reset .ov-captext{opacity:0}
.ov-token{opacity:0;transition:opacity .4s,color .4s}
.ov-token.is-on{opacity:1}
.odds-viz.is-after .ov-token{color:var(--discover)}
.ov-run{display:flex;flex-wrap:wrap;gap:6px 18px;font-family:var(--mono);font-size:.75rem;color:var(--stage);min-height:1.2em;max-width:none}
.ov-run span{opacity:0;transition:opacity .4s}
.ov-run span.is-on{opacity:1}
.ov-odds{display:flex;flex-direction:column;padding:clamp(20px,2.6vw,32px);border-left:1px solid var(--line)}
.ov-label{font-family:var(--mono);font-size:.75rem;color:var(--faint);margin-bottom:18px;max-width:none}
.ov-odds ol{display:flex;flex-direction:column;gap:14px}
.ov-odds li{display:grid;grid-template-columns:max-content minmax(0,1fr) 4ch;white-space:nowrap;align-items:center;gap:14px;font-family:var(--mono);font-size:.8125rem;color:var(--muted);transition:color .4s}
.ov-odds .track{height:6px;background:var(--line);overflow:hidden}
.ov-odds .track i{display:block;height:100%;width:0;background:var(--line-strong);transition:width var(--ovdur,1.1s) cubic-bezier(.3,.7,.2,1),background .4s}
.ov-odds .pct{text-align:right;font-variant-numeric:tabular-nums}
.ov-odds li.you{color:var(--ink)}
.ov-odds li.you .track i{background:color-mix(in srgb,var(--discover) 55%,var(--line-strong))}
.ov-odds li.is-top{color:var(--ink)}
.ov-odds li.is-top .track i{background:var(--muted)}
.ov-odds li.you.is-top .track i{background:var(--discover)}
.ov-cap{margin-top:auto;padding-top:22px;font-family:var(--mono);font-size:.75rem;color:var(--muted);max-width:none}
.ov-cap .ov-captext{display:inline-block;border-top:1px solid var(--line);padding-top:12px;width:100%;transition:opacity .4s}
.hero-odds .hero-agents{margin-top:clamp(28px,3vw,40px)}
@media (max-width:760px){
  .ov-body{grid-template-columns:minmax(0,1fr)}
  .ov-odds{border-left:0;border-top:1px solid var(--line)}
  .ov-bar{padding-left:14px}
  .ov-toggle button{padding:6px 9px}
  .ov-odds li{gap:12px}
  .ov-say{font-size:1rem}
}
@media (prefers-reduced-motion:reduce){.ov-typed::after{display:none}.odds-viz *{transition:none!important;animation:none!important}}

.ov-captext{opacity:0}.ov-captext.is-on{opacity:1}
.odds-viz.is-after .ov-captext{color:var(--ink)}

/* Hero decision: one calm run through Found → Chosen → Used (plays once, then rests) */
.decide{position:relative;margin:0;border:1px solid var(--line-strong);background:var(--surface);box-shadow:0 48px 140px -80px color-mix(in srgb,var(--discover) 40%,transparent)}
.dc-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 14px 10px 18px;border-bottom:1px solid var(--line)}
.dc-ex{margin-left:6px;padding-left:10px;border-left:1px solid var(--line-strong);color:var(--faint)}
.dc-replay{font-family:var(--mono);font-size:.75rem;color:var(--faint);padding:4px 6px;opacity:0;pointer-events:none;transition:opacity .4s,color .15s}
.dc-replay:hover{color:var(--ink)}
.decide.is-done .dc-replay{opacity:1;pointer-events:auto}
.dc-rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid var(--line)}
.dc-rail li{position:relative;display:flex;flex-direction:column;gap:4px;padding:16px 18px 18px;min-width:0}
.dc-rail li+li{border-left:1px solid var(--line)}
.dc-rail li::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--stage);transform:scaleX(0);transform-origin:left;transition:transform .9s cubic-bezier(.3,.7,.2,1)}
.dc-m{display:flex;align-items:center;gap:9px;font-size:1.0625rem;font-weight:500;color:var(--faint);transition:color .5s}
.dc-m .dot{background:var(--line-strong);transition:background .5s}
.dc-sub{font-family:var(--mono);font-size:.75rem;color:var(--faint);opacity:.6;transition:opacity .5s}
.dc-rail li.is-on::before{transform:none}
.dc-rail li.is-on .dc-m{color:var(--ink)}
.dc-rail li.is-on .dot{background:var(--stage)}
.dc-rail li.is-on .dc-sub{opacity:1;color:var(--muted)}
.dc-body{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.dc-chat{display:flex;flex-direction:column;gap:22px;padding:clamp(20px,2.6vw,32px)}
.dc-typed::after{content:"";display:inline-block;width:1px;height:1em;background:var(--muted);margin-left:2px;vertical-align:-2px;animation:pvcaret 1s steps(1) infinite}
.decide.is-typed .dc-typed::after{display:none}
.dc-lines{display:flex;flex-direction:column;gap:12px;padding-top:6px}
.dc-lines li{display:grid;grid-template-columns:7px minmax(0,1fr);gap:12px;align-items:baseline;opacity:0;transform:translateY(4px);transition:opacity .6s,transform .6s}
.dc-lines li.is-on{opacity:1;transform:none}
.dc-lines li .dot{transform:translateY(-2px)}
.dc-lines p{font-size:1rem;line-height:1.45;color:var(--ink);max-width:36ch}
.dc-lines li:first-child p{color:var(--muted)}
.dc-term{font-family:var(--mono);font-size:.8125rem;line-height:1.8;color:var(--muted)}
.dc-term p{font-family:inherit;font-size:inherit;color:inherit;opacity:0;transition:opacity .4s}
.dc-term p.is-on{opacity:1}
.dc-term p+p{color:var(--use)}
.dc-odds{display:flex;flex-direction:column;padding:clamp(20px,2.6vw,32px);border-left:1px solid var(--line)}
.dc-odds .ov-label{margin-bottom:18px}
.dc-odds ol{display:flex;flex-direction:column;gap:14px}
.dc-odds li{display:grid;grid-template-columns:max-content minmax(0,1fr) 4ch;align-items:center;gap:14px;font-family:var(--mono);font-size:.8125rem;color:var(--muted);white-space:nowrap;opacity:0;transition:opacity .6s,color .6s}
.decide.m1 .dc-odds li{opacity:1}
.dc-odds li:nth-child(2){transition-delay:.15s}.dc-odds li:nth-child(3){transition-delay:.3s}
.dc-odds .name{display:flex;align-items:center;gap:9px;width:9ch}
.dc-odds .brand-logo{width:14px;height:14px}
.dc-odds .track{height:6px;background:var(--line);overflow:hidden}
.dc-odds .track i{display:block;height:100%;width:0;background:var(--line-strong);transition:width 1.4s cubic-bezier(.3,.7,.2,1),background .6s}
.dc-odds .pct{text-align:right;font-variant-numeric:tabular-nums}
.decide.m2 .dc-odds li.win{color:var(--ink)}
.decide.m2 .dc-odds li.win .track i{background:var(--discover)}
.dc-done{display:flex;align-items:center;gap:9px;margin-top:auto;padding-top:20px;font-family:var(--mono);font-size:.75rem;color:var(--ink);max-width:none;opacity:0;transition:opacity .6s}
.dc-done.is-on{opacity:1}
.dc-done::before{content:"";position:absolute}
.hero-decide .hero-agents{margin-top:clamp(28px,3vw,40px)}
@media (max-width:760px){
  .dc-rail li{padding:12px 10px 14px}
  .dc-m{font-size:.9375rem;gap:7px}
  .dc-sub{display:none}
  .dc-body{grid-template-columns:minmax(0,1fr)}
  .dc-odds{border-left:0;border-top:1px solid var(--line)}
  .dc-ex{display:none}
}
@media (prefers-reduced-motion:reduce){.decide *{transition:none!important;animation:none!important}}

/* How we help you win: alternating text and a product moment */
.how-list{display:flex;flex-direction:column}
.how-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:32px clamp(40px,7vw,104px);align-items:center;padding-block:clamp(40px,5vw,64px);border-top:1px solid var(--line)}
.how-row:nth-child(even) .how-text{order:2}
.how-text{display:flex;flex-direction:column;gap:14px}
.how-step{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-family:var(--mono);font-size:.75rem;color:var(--faint);max-width:none}
.how-step>span{display:inline-flex;align-items:center;gap:8px;color:var(--ink)}
.b .how-text h3{font-size:clamp(1.375rem,2vw,1.75rem);line-height:1.2;letter-spacing:-.03em}
.how-text>p:last-child{font-size:1.0625rem;max-width:44ch}
.mock{margin:0;border:1px solid var(--line-strong);background:var(--surface);display:flex;flex-direction:column;min-width:0}
.mock-head{display:flex;justify-content:space-between;gap:16px;padding:12px 18px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:.75rem;color:var(--ink);max-width:none}
.mock-head span:last-child{color:var(--faint)}
.mock-foot{padding:12px 18px;border-top:1px solid var(--line);font-family:var(--mono);font-size:.75rem;color:var(--muted);max-width:none}
/* input template */
.mi{display:flex;flex-direction:column;padding:6px 18px 10px}
.mi>div{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:16px;padding:12px 0;border-bottom:1px dashed var(--line)}
.mi>div:last-child{border-bottom:0}
.mi dt{font-family:var(--mono);font-size:.75rem;color:var(--faint);padding-top:3px}
.mi dd{font-size:.9375rem;color:var(--ink)}
.pills{display:flex;flex-wrap:wrap;gap:6px}
.pills span{font-family:var(--mono);font-size:.75rem;color:var(--ink);border:1px solid var(--line-strong);padding:4px 9px}
.mi-logos{display:flex;gap:14px;align-items:center;padding-top:2px}
.mi-logos .brand-logo{width:17px;height:17px;color:var(--ink)}
/* discovery runs */
.md{padding:8px 18px 12px;font-family:var(--mono);font-size:.8125rem}
.md-h,.md li{display:grid;grid-template-columns:minmax(0,9.5rem) minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:center}
.md-h{font-size:.6875rem;color:var(--faint);padding:6px 0 8px;max-width:none}
.md li{padding:9px 0;border-top:1px solid var(--line);color:var(--muted)}
.md-a{display:flex;align-items:center;gap:9px;color:var(--ink);white-space:nowrap}
.md-a .brand-logo{width:14px;height:14px}
.md-b{display:grid;grid-template-columns:minmax(0,1fr) 3.2ch;gap:10px;align-items:center}
.md-b i{display:block;height:6px;background:var(--line)}
.md-b i{background:linear-gradient(var(--c),var(--c)) 0/var(--w,0) 100% no-repeat,var(--line)}
.md-b b{font-weight:400;text-align:right;font-variant-numeric:tabular-nums}
/* usage trace */
.mu{display:flex;flex-direction:column;padding:8px 18px 10px}
.mu li{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:.9375rem;color:var(--muted)}
.mu li:last-child{border-bottom:0}
.mu li>span{width:1.1em;font-family:var(--mono);font-size:.8125rem;color:var(--faint)}
.mu .ok>span{color:var(--use)}
.mu .stall{color:var(--ink)}
.mu .stall>span{color:var(--ink)}
.mu em{font-style:normal;font-family:var(--mono);font-size:.75rem;color:var(--use);border:1px solid color-mix(in srgb,var(--use) 45%,transparent);padding:2px 8px;margin-left:auto}
.mu .todo{color:var(--faint)}
/* execution */
.mx{display:flex;flex-direction:column;padding:6px 18px 8px}
.mx li{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,8.5rem);gap:16px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);font-size:.9375rem;color:var(--ink)}
.mx li:last-child{border-bottom:0}
.mx-s{font-family:var(--mono);font-size:.6875rem;border:1px solid var(--line-strong);padding:3px 8px;color:var(--muted)}
.mx-s.pending{border-style:dashed;color:var(--faint)}
.mx-r{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.8125rem;color:var(--ink);white-space:nowrap}
@media (max-width:900px){
  .how-row{grid-template-columns:minmax(0,1fr);gap:24px}
  .how-row:nth-child(even) .how-text{order:0}
}
@media (max-width:560px){
  .mi>div{grid-template-columns:minmax(0,1fr);gap:6px}
  .md-h,.md li{grid-template-columns:minmax(0,7.5rem) minmax(0,1fr) minmax(0,1fr);gap:10px}
  .md-a{font-size:.75rem}
  .mx li{grid-template-columns:minmax(0,1fr) auto;gap:8px 12px}
  .mx-r{grid-column:1/-1}
}

/* Results: two compact cards */
.section-tight{padding-block:clamp(56px,7vw,96px)}
.b h2.results-h{font-size:clamp(1.25rem,1.8vw,1.5rem);margin-bottom:24px}
.case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.case-card{border-top:1px solid var(--line-strong);padding-top:24px;display:flex;flex-direction:column;gap:12px;min-width:0}
.cc-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.cc-top .cr-logo{height:22px}
.cc-top .cr-lockup{font-size:1.3rem}
.cc-top .cr-lockup img{width:22px;height:22px}
.b .cc-title{font-size:1.25rem;line-height:1.25;letter-spacing:-.025em;color:var(--ink)}
.case-card .cr-quote p,.case-card .cr-text{font-size:1rem;max-width:52ch}
.cc-chart{margin:4px 0 0}
.cc-chart svg{max-height:150px;width:100%}
@media (max-width:760px){.case-grid{grid-template-columns:minmax(0,1fr);gap:40px}}
.md-b.f i{--c:color-mix(in srgb,var(--discover) 45%,var(--line-strong))}
.md-b.c i{--c:var(--discover)}
.how-row:nth-child(even){grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
@media (max-width:900px){.how-row:nth-child(even){grid-template-columns:minmax(0,1fr)}}
.cc-spark{margin:6px 0 0;display:flex;flex-direction:column;gap:8px}
.cc-spark svg{width:100%;height:96px;display:block;overflow:visible}
.cc-grid{stroke:var(--line);stroke-width:1;fill:none;vector-effect:non-scaling-stroke}
.cc-area{fill:var(--use);opacity:.08}
.cc-line{fill:none;stroke:var(--use);stroke-width:2;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.cc-spark figcaption{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.75rem;color:var(--faint)}
.cc-spark figcaption span:last-child{color:var(--ink)}
.case-card .cr-quote p{color:var(--ink);font-size:1.0625rem;line-height:1.5}
.how-row:last-child{padding-bottom:0}

/* Hero talk: the chat is the product (inside the window); Found / Chosen / Used are our insight (outside it) */
.talk{--gap:clamp(56px,6vw,96px);position:relative;margin:0;display:grid;grid-template-columns:minmax(0,1fr) 14.5rem;column-gap:var(--gap);grid-template-rows:auto auto auto auto auto 28px}
.tk-win{grid-area:1/1/7/2;border:1px solid var(--line-strong);background:var(--surface);box-shadow:0 48px 140px -80px color-mix(in srgb,var(--discover) 35%,transparent)}
.talk .dc-bar{grid-area:1/1;position:relative}
.talk.is-done .dc-replay{opacity:1;pointer-events:auto}
.tk-user-row{grid-area:2/1;display:flex;justify-content:flex-end;padding:28px clamp(20px,3vw,36px) 10px}
.tk-msg{position:relative;display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;align-items:center;padding:10px clamp(20px,3vw,36px);opacity:0;transform:translateY(4px);transition:opacity .6s,transform .6s}
.tk-m1{grid-area:3/1}.tk-m2{grid-area:4/1}.tk-m3{grid-area:5/1}
.tk-av{width:32px}
.tk-msg p{font-size:1.0625rem;line-height:1.45;color:var(--ink);max-width:40ch}
.tk-msg .dc-term p{font-size:.875rem;line-height:1.8}
.tk-hl{text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:2px;text-underline-offset:.2em;transition:text-decoration-color .6s .5s}
.tk-msg.is-on{opacity:1;transform:none}
.tk-msg.is-on .tk-hl{text-decoration-color:var(--stage)}
.tk-notes-h{grid-area:2/2;align-self:end;display:flex;align-items:center;gap:10px;padding-bottom:10px;font-family:var(--mono);font-size:.75rem;color:var(--muted);max-width:none}
.tk-ball{width:14px;height:14px;border-radius:50%;background:conic-gradient(from 200deg,var(--discover),var(--use),var(--repeat),var(--discover));opacity:.9}
.tk-tag{position:relative;align-self:center;display:flex;flex-direction:column;gap:3px;padding:10px 14px;border:1px solid color-mix(in srgb,var(--stage) 55%,transparent);border-radius:999px 999px 999px 999px;border-radius:0;background:var(--bg);max-width:none;opacity:0;transform:translateX(-8px);transition:opacity .5s .7s,transform .5s .7s}
.tk-tag[data-m="1"]{grid-area:3/2}.tk-tag[data-m="2"]{grid-area:4/2}.tk-tag[data-m="3"]{grid-area:5/2}
.tk-tag::before{content:"";position:absolute;top:50%;right:100%;width:calc(var(--gap) + 28px);border-top:1px dashed var(--stage);transform:scaleX(0);transform-origin:right;transition:transform .7s .35s cubic-bezier(.3,.7,.2,1)}
.tk-tag::after{content:"";position:absolute;top:50%;right:calc(100% + var(--gap) + 28px);width:7px;height:7px;margin:-3px -3px 0 0;border-radius:50%;background:var(--stage);opacity:0;transition:opacity .3s .3s}
.tk-tag.is-on{opacity:1;transform:none}
.tk-tag.is-on::before{transform:none}
.tk-tag.is-on::after{opacity:1}
.tk-t{display:flex;align-items:center;gap:9px;font-size:1rem;font-weight:500;color:var(--ink)}
.tk-s{font-family:var(--mono);font-size:.75rem;color:var(--muted)}
@media (max-width:900px){.talk{grid-template-columns:minmax(0,1fr) 12rem;--gap:44px}}
@media (max-width:760px){
  .talk{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:8px;grid-template-rows:auto auto auto auto auto 16px auto auto}
  .tk-win{grid-area:1/1/7/4}
  .talk .dc-bar{grid-area:1/1/2/4}
  .tk-user-row{grid-area:2/1/3/4;padding:20px 16px 6px}
  .tk-m1{grid-area:3/1/4/4}.tk-m2{grid-area:4/1/5/4}.tk-m3{grid-area:5/1/6/4}
  .tk-msg{grid-template-columns:minmax(0,1fr);padding:8px 16px}
  .tk-msg .avatar,.tk-av{display:none}
  .tk-msg p{font-size:1rem}
  .tk-notes-h{grid-area:7/1/8/4;padding:22px 0 10px}
  .tk-tag[data-m="1"]{grid-area:8/1}.tk-tag[data-m="2"]{grid-area:8/2}.tk-tag[data-m="3"]{grid-area:8/3}
  .tk-tag{padding:8px 10px;transform:none;transition-delay:.2s}
  .tk-tag::before,.tk-tag::after{display:none}
  .tk-t{font-size:.9375rem;gap:7px}
  .tk-s{display:none}
}
@media (prefers-reduced-motion:reduce){.talk *,.talk *::before,.talk *::after{transition:none!important;animation:none!important}}

/* Ship changes: rank moves up */
.rank{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 18px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--discover) 5%,transparent)}
.rank-l{font-size:.9375rem;color:var(--ink);line-height:1.35;max-width:none}
.rank-l span{font-family:var(--mono);font-size:.75rem;color:var(--faint)}
.rank-v{display:flex;align-items:center;gap:12px;font-family:var(--mono);max-width:none}
.rank-was{font-size:1.125rem;color:var(--faint);text-decoration:line-through;text-decoration-color:var(--line-strong)}
.rank-up{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--discover);color:var(--bg);font-size:1.125rem;font-weight:500}
.rank-now{font-size:2rem;letter-spacing:-.04em;color:var(--ink);line-height:1}
.mx-r .up{font-weight:500;color:var(--stage);font-size:1rem;margin-right:2px}
.mx-r.pending{color:var(--faint)}
@media (prefers-reduced-motion:no-preference){
  .rank.is-in .rank-up{animation:rankup 1.2s cubic-bezier(.3,.7,.2,1) both}
  .rank.is-in .rank-now{animation:rankin .8s .6s both}
}
@keyframes rankup{from{transform:translateY(14px);opacity:0}to{transform:none;opacity:1}}
@keyframes rankin{from{opacity:0}to{opacity:1}}
.tk-msg .dc-term p{font-size:.875rem;line-height:1.8}
@media (min-width:761px){.tk-tag{margin-block:6px}}

/* Hero grid: the headline shares the chat column, the lead and CTA share the insight column */
.hero-decide{--gap:clamp(56px,6vw,96px);--side:17rem;--pad:clamp(20px,3vw,36px)}
.hero-decide .hero-top{grid-template-columns:minmax(0,1fr) var(--side);column-gap:var(--gap);align-items:end;margin-bottom:clamp(48px,5.5vw,72px)}
.hero-decide .hero-side{gap:24px;padding-bottom:6px}
.hero-decide .hero-side .lead{max-width:none;font-size:1.125rem;line-height:1.5}
@media (min-width:761px){.hero-decide .talk{--gap:inherit;grid-template-columns:minmax(0,1fr) var(--side)}}
.hero-decide .tk-user-row{padding:28px var(--pad) 10px}
.hero-decide .tk-user-row .ov-user{margin-right:0}
.hero-decide .tk-msg{padding:10px var(--pad)}
.hero-decide .tk-tag::before{width:calc(var(--gap) + var(--pad))}
.hero-decide .tk-tag::after{right:calc(100% + var(--gap) + var(--pad))}
.hero-decide .hero-agents{margin-top:32px}
@media (max-width:900px){.hero-decide{--gap:40px;--side:13rem}}
@media (max-width:760px){.hero-decide .hero-top{grid-template-columns:minmax(0,1fr)}.hero-decide .tk-user-row{padding:20px 16px 6px}.hero-decide .tk-msg{padding:8px 16px}}

/* Results: two stories, clearly apart */
.case-grid{column-gap:56px}

/* Test: subtitle and CTA stacked under the headline */
.hero-decide .hero-top{grid-template-columns:minmax(0,1fr);row-gap:28px;align-items:start}
.hero-decide .hero-side{flex-direction:column;align-items:flex-start;gap:28px;padding-bottom:0}
.hero-decide .hero-side .lead{max-width:none;font-size:clamp(1.125rem,1.5vw,1.3rem);text-wrap:wrap}
.b .hero-decide .hero-top h1{max-width:none}

/* About: a flowing story */
.b .section:has(> .story){padding-block:clamp(48px,6vw,80px)}
.b .story .pull{font-family:var(--sans);text-transform:none;font-size:clamp(1.375rem,2.4vw,1.875rem);font-weight:500;letter-spacing:-.03em;line-height:1.25;max-width:24ch;padding:8px 0 8px 20px;border-left:2px solid var(--discover)}
.b .story h2{font-size:clamp(1.5rem,2.4vw,2rem)}

/* About: one readable article column */
.about-article{padding-block:clamp(48px,6vw,80px)}
.prose{max-width:680px}
.b .prose h2{font-size:clamp(1.375rem,2vw,1.625rem);line-height:1.2;max-width:none;margin:48px 0 14px}
.b .prose h2:first-child{margin-top:0}
.prose>p{font-size:1.0625rem;line-height:1.7;color:var(--muted);max-width:none;margin-bottom:16px}
.b .prose .pull{margin:24px 0 8px;max-width:26ch}
.prose .loop-steps{margin-top:8px}
.prose .loop-back{margin-top:16px}
@media (max-width:760px){.b .prose h2{margin-top:40px}}
.b .prose .pull{font-family:var(--sans);text-transform:none;font-size:clamp(1.375rem,2.4vw,1.75rem);font-weight:500;letter-spacing:-.03em;line-height:1.25;color:var(--ink);padding:6px 0 6px 20px;border-left:2px solid var(--discover)}
.b .about-article + .section .head{grid-template-columns:minmax(0,1fr);max-width:680px;gap:14px;margin-bottom:28px}
.b .prose h3{font-size:1.125rem;font-weight:500;letter-spacing:-.015em;color:var(--ink);margin:32px 0 10px;display:flex;align-items:center;gap:10px}
.b .prose h3::before{content:"";width:16px;height:1px;background:var(--line-strong)}


/* Discovery runs: every run is a dot (our own mark, not a bar chart) */
.mr{padding:10px 18px 14px}
.mr-legend{display:flex;flex-wrap:wrap;gap:6px 16px;padding:4px 0 10px;font-family:var(--mono);font-size:.6875rem;color:var(--faint);max-width:none}
.mr-legend span{display:inline-flex;align-items:center;gap:7px}
.mr ul{display:flex;flex-direction:column}
.mr li{display:grid;grid-template-columns:minmax(0,8.5rem) minmax(0,1fr) auto;align-items:center;gap:16px;padding:9px 0;border-top:1px solid var(--line);font-family:var(--mono);font-size:.8125rem}
.mr .md-a{display:flex;align-items:center;gap:9px;color:var(--ink);white-space:nowrap}
.mr .md-a .brand-logo{width:14px;height:14px}
.runs{display:flex;gap:5px;flex-wrap:wrap}
.run{width:9px;height:9px;border-radius:50%;background:var(--line-strong)}
.run.f{background:transparent;box-shadow:inset 0 0 0 1.5px var(--discover)}
.run.c{background:var(--discover)}
.mr-n{color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.mr-n small{color:var(--faint);font-size:.6875rem}
@media (max-width:560px){.mr li{grid-template-columns:minmax(0,1fr) auto;gap:8px 12px}.mr .runs{grid-column:1/-1;grid-row:2}.run{width:8px;height:8px}}
.rank-up{color:#11120f}

/* Coverage: one accent, the surface fills in over three months, then the key path lights */
.cov{display:grid;grid-template-columns:minmax(0,1fr) 15rem;gap:40px clamp(40px,5vw,72px);align-items:center}
.cov-fig{margin:0;min-width:0}
.cov-map{width:100%;height:auto;display:block;overflow:visible;-webkit-mask-image:radial-gradient(ellipse 70% 72% at 46% 52%,#000 55%,transparent 100%);mask-image:radial-gradient(ellipse 70% 72% at 46% 52%,#000 55%,transparent 100%)}
.cv-edges line{stroke:#1d1e19;stroke-width:1}
.cv-bg circle{fill:#2a2c25}
.cv-target{fill:none;stroke:#34362e;stroke-width:1;stroke-dasharray:2 6}
.cv-target-label{font-family:var(--mono);font-size:11px;fill:var(--faint);letter-spacing:.04em}
.cv-link{stroke:var(--discover);stroke-width:1;stroke-dasharray:1 5;stroke-linecap:round;opacity:0;transition:opacity .8s}
.cv-node .cv-dot{fill:var(--bg);stroke:#4a4c43;stroke-width:1.25;transition:fill .7s,stroke .7s}
.cv-node .cv-halo{fill:var(--discover);opacity:0;transition:opacity .9s}
.cv-node text{font-family:var(--sans);font-size:12.5px;fill:var(--faint);transition:fill .7s}
.cv-node.gap text{fill:#5d5f56}
.cv-node.on .cv-dot{fill:var(--discover);stroke:var(--discover)}
.cv-node.on .cv-halo{opacity:.12}
.cv-node.on text{fill:var(--ink)}
.cv-link.on{opacity:.35}
.cv-key{fill:none;stroke:var(--discover);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.8s cubic-bezier(.3,.7,.2,1)}
.cov[data-step="3"] .cv-key{stroke-dashoffset:0}
.cv-start circle{fill:var(--ink)}
.cv-start text{font-family:var(--mono);font-size:11px;fill:var(--muted)}
.cv-product circle:not(.cv-halo){fill:var(--ink)}
.cv-product .cv-halo{fill:var(--ink);opacity:.06}
.cv-product text{font-family:var(--mono);font-size:11.5px;fill:var(--ink)}
.cov-side{display:flex;flex-direction:column;gap:6px;border-left:1px solid var(--line);padding-left:clamp(24px,3vw,40px)}
.cov-label{font-family:var(--mono);font-size:.75rem;color:var(--faint);max-width:none}
.cov-big{font-family:var(--sans);font-weight:500;font-size:clamp(3.25rem,5vw,4.5rem);line-height:1;letter-spacing:-.05em;color:var(--ink);font-variant-numeric:tabular-nums;max-width:none;margin-bottom:22px}
.cov-unit{font-size:.5em;letter-spacing:-.02em;color:var(--muted);margin-left:2px}
.cov-tl{position:relative;display:flex;flex-direction:column}
.cov-tl::before{content:"";position:absolute;left:3px;top:10px;bottom:10px;width:1px;background:var(--line-strong)}
.cov-tl li{position:relative;display:grid;grid-template-columns:7px minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:14px;padding:9px 0;opacity:.45;transition:opacity .6s}
.cov-tl li.on{opacity:1}
.cv-tick{grid-row:1/3;width:7px;height:7px;border-radius:50%;background:var(--bg);box-shadow:inset 0 0 0 1.25px var(--line-strong);margin-top:6px;transition:background .6s,box-shadow .6s}
.cov-tl li.on .cv-tick{background:var(--discover);box-shadow:none}
.cv-when{font-size:.9375rem;color:var(--ink)}
.cv-n{grid-row:1;grid-column:3;font-family:var(--mono);font-size:.75rem;color:var(--muted);align-self:center}
.cv-what{grid-column:2/4;font-family:var(--mono);font-size:.6875rem;color:var(--faint)}
.cov-replay{align-self:flex-start;margin-top:14px;font-family:var(--mono);font-size:.75rem;color:var(--faint);opacity:0;pointer-events:none;transition:opacity .4s,color .15s}
.cov-replay:hover{color:var(--ink)}
.cov.is-done .cov-replay{opacity:1;pointer-events:auto}
.cov-steps{grid-column:1/-1}
.b .cov .net-steps{margin-top:clamp(16px,3vw,32px)}
@media (max-width:900px){
  .cov{grid-template-columns:minmax(0,1fr);gap:28px}
  .cov-side{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:24px}
  .cov-tl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
  .cov-tl::before{display:none}
  .cov-tl li{grid-template-columns:minmax(0,1fr);row-gap:4px;padding:0}
  .cv-tick{grid-row:auto;margin:0 0 4px}
  .cv-n{grid-row:auto;grid-column:1}
  .cv-what{grid-column:1}
}
@media (max-width:760px){
  .cov-map{-webkit-mask-image:none;mask-image:none}
  .cv-node text,.cv-target-label{display:none}
  .cv-node .cv-dot{r:8}
  .cv-start text,.cv-product text{font-size:22px}
  .cv-node.gap .cv-dot{stroke-width:2}
  .cv-key{stroke-width:3.5}
  .cov-tl{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:16px}
}
@media (prefers-reduced-motion:reduce){.cov *{transition:none!important}}
/* Results: cleaner, matching cards */
.case-card{gap:14px}
.cc-top{height:28px}
.cc-top .cr-tag{align-self:center}
.case-card .cr-quote p,.case-card .cr-text{font-family:var(--sans);font-size:1.0625rem;line-height:1.5;color:var(--ink);max-width:48ch}
.cc-spark{margin-top:10px;gap:10px}
.cc-spark svg{height:140px}
.cc-area{opacity:.1}

/* Space use, benchmarked against linear.app at 1440px:
   nav 73px with 13px links → ours 64px; content ~1330px wide → ours 1240px (was 1120);
   hero headline sits lower with the visual close under the CTA; sections keep ~128–136px padding. */
:root{--wrap:1240px;--nav-h:64px}
.nav-links{font-size:.8125rem;gap:28px}
.nav-links .btn{min-height:36px;padding:0 14px;font-size:.8125rem}
.hero-path{padding-block:clamp(64px,8.5vw,120px) clamp(48px,6vw,80px)}
.hero-decide .hero-top{margin-bottom:clamp(40px,4.5vw,56px)}
.hero-decide .hero-side .lead{font-size:clamp(1.0625rem,1.3vw,1.1875rem)}

/* Hero insight v2: each moment gets a measured score and how the agent got there.
   The chat line it refers to lights as a band that runs into the connector. */
.cr-tag{display:none}
.tk-notes-h{gap:10px}
.tk-runs{margin-left:auto;color:var(--faint)}
.tk-tag{gap:6px;padding:12px 14px}
.tk-t{width:100%;margin:0;max-width:none}
.tk-v{margin-left:auto;font-family:var(--mono);font-size:.875rem;font-weight:400;color:var(--ink);font-variant-numeric:tabular-nums}
.tk-v small{font-size:.6875rem;color:var(--faint);margin-left:1px}
.tk-bar{display:block;height:3px;background:var(--line);overflow:hidden}
.tk-bar i{display:block;height:100%;width:0;background:var(--stage);transition:width 1.1s .9s cubic-bezier(.3,.7,.2,1)}
.tk-tag.is-on .tk-bar i{width:var(--p)}
.tk-s{max-width:none}
/* the chat line in focus */
.tk-msg{border-radius:0;transition:opacity .6s,transform .6s,background .8s}
.tk-msg.is-on{background:linear-gradient(90deg,transparent 0%,color-mix(in srgb,var(--stage) 4%,transparent) 55%,color-mix(in srgb,var(--stage) 11%,transparent) 100%)}
.tk-msg.is-on::after{content:"";position:absolute;right:0;top:50%;width:7px;height:7px;margin:-3.5px -4px 0 0;border-radius:50%;background:var(--stage);box-shadow:0 0 0 4px color-mix(in srgb,var(--stage) 18%,transparent)}
.hero-decide .tk-tag::after{display:none}
@media (min-width:761px){.hero-decide .tk-tag::before{width:var(--gap)}}

@media (max-width:760px){
  /* phone: each insight hangs directly under the line it measures */
  .talk{grid-template-columns:minmax(0,1fr);grid-template-rows:none;column-gap:0}
  .tk-win{grid-area:1/1/9/2}
  .talk .dc-bar{grid-area:1/1}
  .hero-decide .tk-user-row{grid-area:2/1}
  .tk-m1{grid-area:3/1}.tk-m2{grid-area:5/1}.tk-m3{grid-area:7/1}
  .tk-tag[data-m="1"]{grid-area:4/1}.tk-tag[data-m="2"]{grid-area:6/1}.tk-tag[data-m="3"]{grid-area:8/1}
  .tk-notes-h{display:none}
  .tk-msg{padding:10px 16px}
  .tk-msg.is-on::after{display:none}
  .tk-tag{margin:2px 12px 12px 28px;padding:10px 12px;transform:none;background:var(--bg)}
  .tk-tag::before{display:block!important;content:"";position:absolute;left:-14px;top:-8px;width:10px;height:calc(50% + 8px);border-left:1px dashed var(--stage);border-bottom:1px dashed var(--stage);transform:none!important;right:auto}
  .tk-s{display:block}
  .tk-tag[data-m="3"]{margin-bottom:18px}
}
.tk-msg{align-self:center}
.tk-msg.is-on{background:linear-gradient(90deg,transparent 35%,color-mix(in srgb,var(--stage) 9%,transparent) 100%)}
@media (max-width:760px){
  .tk-tag{margin:0 12px 12px 16px}
  .tk-tag::before{left:14px;top:-10px;width:0;height:10px;border-bottom:0}
  .tk-msg.is-on{background:none}
}
@media (max-width:760px){.hero-decide .tk-tag::before{width:0;border-top:0;right:auto}}

/* Insight mark: a mini disco ball tells our insight apart from the agent's chat */
.tk-mark{width:16px;height:16px;flex:none;display:block}
.tk-notes-h .tk-mark-h{width:15px;height:15px}
.tk-tag>.tk-mark{position:absolute;top:-9px;right:12px;width:18px;height:18px;padding:2px;box-sizing:content-box;background:var(--bg);border-radius:50%}
@media (max-width:760px){
  /* phone: insight cards sit on top of the chat box and break out past its right edge */
  .hero-decide .tk-tag::before{display:none!important}
  .tk-tag{margin:4px -10px 14px 24px;background:var(--surface);box-shadow:0 14px 30px -14px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.6);z-index:1}
  .tk-tag>.tk-mark{right:10px}
  .tk-tag[data-m="3"]{margin-bottom:20px}
}
.hero-decide .hero-side .lead{max-width:58ch}

/* Mobile nav: keep the leaderboard and About reachable */
.nl-m{display:none}
@media (max-width:760px){
  .nav-links{gap:18px}
  .nav-links a:not(.btn){display:inline-flex}
  .nl-d{display:none}.nl-m{display:inline}
}
@media (max-width:520px){
  .nav-links .btn{display:none}
  .nav-links{font-size:.8125rem}
}
/* Ship changes: the rank sits in the same grid as the initiatives */
.mx .mx-rank{margin:0 -18px;padding:14px 18px;background:color-mix(in srgb,var(--discover) 6%,transparent);border-bottom:1px solid var(--line)}
.mx-rank .mx-n{display:flex;flex-direction:column;gap:2px}
.mx-rank .mx-n small{font-family:var(--mono);font-size:.6875rem;color:var(--faint)}
.mx-s-key{border-color:color-mix(in srgb,var(--discover) 45%,transparent);color:var(--ink)}
.mx-rank .mx-r strong{font-weight:500;font-size:1.125rem;letter-spacing:-.02em;margin-left:2px}
.mx{padding-top:0}
/* Stronger movement marks in the initiatives card */
.up-i{width:15px;height:15px;flex:none;fill:none;stroke:var(--stage);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;margin-right:2px}
.mx-r{gap:7px}
.mx-rank .mx-r{font-size:.875rem}
.rk-was{color:var(--faint);text-decoration:line-through;text-decoration-color:var(--line-strong)}
.mx-rank .mx-r .rk-now{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:28px;padding:0 10px;margin-left:2px;border-radius:999px;background:var(--discover);color:#11120f;font-size:1rem;font-weight:600;letter-spacing:-.02em}
.mx-rank .up-i{width:18px;height:18px;stroke-width:2.6}
.b #pricing-title,.b #coverage-title{max-width:22ch}
@media (min-width:1100px){.hero-decide .hero-side .lead{max-width:none;width:min(100%,58rem);font-size:1.125rem}}
.br-d{display:none}
@media (min-width:1100px){.br-d{display:inline}}
.b #how .head .lead{max-width:46ch}
