
/* Layout: one 1120px column, 8px rhythm. Signature: "the Trace", a hairline that ends in a ringed node: an answer traced to its source. */
:root{
  --bg:#050505; --band:#080808; --card:#0E0E0F; --card2:#141415; --line:rgba(255,255,255,.08); --line2:rgba(255,255,255,.16);
  --fg:#FFFFFF; --body:#D6D6D6; --mute:#8E8E8E; --pill:rgba(255,255,255,.08); --miss:#F06B6B; --on:#000000;
  --star:255,255,255; --lift:0 40px 80px -48px rgba(0,0,0,.9); --edge:inset 0 1px 0 rgba(255,255,255,.07);
  --glow:rgba(255,255,255,.14); --grain:.05;
  --acc:#5AA5FF; --acc-rgb:90,165,255; --accbg:rgba(90,165,255,.10); --num:#FFFFFF; --missbg:rgba(240,107,107,.08); --miss-rgb:240,107,107; --beam:255,255,255; --beamA:1; --af:#FFFFFF; --aft:#000000; --tint:#0B0B0C; --hglow:rgba(90,165,255,.10);
  --f:'Host Grotesk',Inter,system-ui,sans-serif;
  color-scheme:dark;
}
@media (prefers-color-scheme: light){ :root:not([data-theme="dark"]){
  --bg:#FFFFFF; --band:#FAFAFA; --card:#FFFFFF; --card2:#F7F7F7; --line:#EBEBEB; --line2:#D9D9D9;
  --fg:#0A0A0A; --body:#3A3A3A; --mute:#6E6E6E; --pill:#F1F1F1; --miss:#C8322F; --on:#FFFFFF;
  --star:10,10,10; --lift:0 1px 2px rgba(0,0,0,.04),0 24px 48px -24px rgba(0,0,0,.14); --edge:none; --glow:rgba(0,0,0,.05); --grain:0;
  --acc:#1F6FEB; --acc-rgb:31,111,235; --accbg:rgba(31,111,235,.07); --num:#0A0A0A; --missbg:rgba(200,50,47,.06); --miss-rgb:200,50,47; --beam:31,111,235; --beamA:.45; --af:var(--fg); --aft:#FFFFFF; --tint:#F5F8FE; --hglow:rgba(31,111,235,.12); color-scheme:light }}
:root[data-theme="light"]{
  --bg:#FFFFFF; --band:#FAFAFA; --card:#FFFFFF; --card2:#F7F7F7; --line:#EBEBEB; --line2:#D9D9D9;
  --fg:#0A0A0A; --body:#3A3A3A; --mute:#6E6E6E; --pill:#F1F1F1; --miss:#C8322F; --on:#FFFFFF;
  --star:10,10,10; --lift:0 1px 2px rgba(0,0,0,.04),0 24px 48px -24px rgba(0,0,0,.14); --edge:none; --glow:rgba(0,0,0,.05); --grain:0;
  --acc:#1F6FEB; --acc-rgb:31,111,235; --accbg:rgba(31,111,235,.07); --num:#0A0A0A; --missbg:rgba(200,50,47,.06); --miss-rgb:200,50,47; --beam:31,111,235; --beamA:.45; --af:var(--fg); --aft:#FFFFFF; --tint:#F5F8FE; --hglow:rgba(31,111,235,.12); color-scheme:light }
:root[data-theme="dark"]{color-scheme:dark}

*{box-sizing:border-box}
body{background:var(--bg);color:var(--fg);font-family:var(--f);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:60;opacity:var(--grain);mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
a{color:inherit}
.wrap{max-width:1120px;margin-inline:auto;padding-inline:24px}
@media (min-width:1216px){.wrap{padding-inline:0}}
h1,h2,h3{font-weight:600;margin:0;text-wrap:balance}
h1{font-size:clamp(44px,7vw,100px);line-height:.98;letter-spacing:-.05em;word-spacing:-.03em}
h2{font-size:clamp(34px,4.6vw,58px);line-height:1.04;letter-spacing:-.045em}
h3{font-size:20px;letter-spacing:-.02em;line-height:1.25}
p{margin:0}
.q{color:var(--mute)}
.lead{font-size:19px;line-height:1.55;color:var(--body);max-width:640px}
.lab{font-size:13px;font-weight:500;color:var(--mute)}
.small{font-size:14px;color:var(--body)}
.num{font-variant-numeric:tabular-nums}
.miss{color:var(--miss)}
section{position:relative;padding-block:136px}
section+section::before,.strip::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(1120px,90%);height:1px;background:linear-gradient(90deg,transparent,var(--line2),transparent)}
.head{display:flex;flex-direction:column;gap:18px;margin-bottom:56px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:500;color:var(--mute)}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--line2)}
.eyebrow i{display:none}

/* THE TRACE: signature underline, draws once, ends in a ringed node */
.tr{position:relative;white-space:nowrap}
.tr::after{content:"";position:absolute;left:0;right:-.18em;bottom:-.06em;height:2px;background:currentColor;transform-origin:left;transition:transform 1s cubic-bezier(.16,1,.3,1) .5s;opacity:.9}
.tr::before{content:"";position:absolute;right:-.34em;bottom:calc(-.06em - 5px);width:8px;height:8px;border:2px solid currentColor;border-radius:50%;background:var(--bg);transition:opacity .3s 1.4s,transform .3s 1.4s}
.pre .tr::after,.hero.pre .tr::after{transform:scaleX(0)}
.pre .tr::before,.hero.pre .tr::before{opacity:0;transform:scale(.4)}
.q .tr::before{background:var(--bg)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 24px;border-radius:999px;font:600 16px var(--f);text-decoration:none;border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:transform .3s,box-shadow .3s,background .3s,border-color .3s}
.btn-p{background:var(--fg);color:var(--on)}
.btn-p:hover{transform:translateY(-1px);box-shadow:0 0 0 6px var(--pill),0 14px 40px -12px var(--glow)}
.btn-s{background:var(--pill);color:var(--fg);border-color:var(--line2)}
.btn-s:hover{border-color:var(--mute)}
:focus-visible{outline:2px solid var(--fg);outline-offset:3px}

/* surfaces */
.card{background:linear-gradient(180deg,var(--card2),var(--card));border:1px solid var(--line);border-radius:16px;box-shadow:var(--edge),var(--lift)}
.edge{border:1px solid transparent;background:linear-gradient(180deg,var(--card2),var(--card)) padding-box,linear-gradient(180deg,var(--line2),var(--line) 45%,transparent) border-box}
.spot{position:relative;overflow:hidden}
.spot::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),var(--pill),transparent 45%)}
.spot:hover::after{opacity:1}
.pill{background:var(--pill);border-radius:6px;padding:1px 7px;font-weight:600;color:var(--fg)}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line2);border-radius:999px;padding:3px 10px;font-size:12px;color:var(--body)}
.tag{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:500;background:var(--pill);color:var(--fg)}
.tag.bad{color:var(--miss);background:transparent;border:1px solid var(--miss)}

/* NAV */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:color-mix(in srgb,var(--bg) 70%,transparent);backdrop-filter:blur(18px) saturate(140%);border-bottom:1px solid transparent;transition:border-color .3s}
.nav.scrolled{border-bottom-color:var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
.logo{display:block;width:124px;height:auto}.logo-l{display:none}.logo-d{filter:invert(1) hue-rotate(180deg)}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]) .logo-d{display:none}:root:not([data-theme="dark"]) .logo-l{display:block}}
:root[data-theme="light"] .logo-d{display:none}:root[data-theme="light"] .logo-l{display:block}
.links{display:flex;gap:32px;font-size:15px;color:var(--body)}.links a{text-decoration:none}.links a:hover{color:var(--fg)}
.navr{display:flex;align-items:center;gap:16px;font-size:15px}.navr .btn{height:40px;padding:0 16px;font-size:14px}
.tt{background:none;border:1px solid var(--line2);color:var(--fg);border-radius:999px;height:34px;padding:0 12px;font:500 13px var(--f);cursor:pointer}
@media (max-width:900px){.links,.navr .login{display:none}}
@media (max-width:480px){.navr .btn{display:none}}

/* HERO */
.hero{padding-block:0;overflow:hidden}
.hero canvas{position:absolute;inset:0;display:block}
.hero::before{content:"";position:absolute;inset:-20% -10% auto -10%;height:110%;pointer-events:none;z-index:1;background:radial-gradient(48% 40% at 50% 0%,var(--glow),transparent 72%)}
.rails{position:absolute;inset:0;pointer-events:none;z-index:1}
.rails::before,.rails::after{content:"";position:absolute;top:0;bottom:0;width:0;border-left:1px dashed var(--line2);left:max(24px,calc(50% - 560px))}
.rails::after{left:auto;right:max(24px,calc(50% - 560px))}
.hero-in{position:relative;z-index:2;padding-block:128px 112px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px}
.hero-in .lead{margin-inline:auto}
.ctas{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.w{display:inline-block;transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1),filter .9s;transition-delay:calc(var(--i)*55ms)}
.hero.pre .w{opacity:0;transform:translateY(22px);filter:blur(10px)}
.fx{transition:opacity .9s .5s,transform .9s .5s cubic-bezier(.16,1,.3,1)}
.hero.pre .fx{opacity:0;transform:translateY(14px)}
.ask{margin-top:48px;width:min(640px,100%);text-align:left;padding:24px 26px;transition-delay:.8s!important;position:relative}
.ask::before{content:"";position:absolute;left:10%;right:10%;top:-40px;height:120px;z-index:-1;background:radial-gradient(50% 50% at 50% 50%,var(--glow),transparent 70%);filter:blur(30px)}
.ask .row1{display:flex;justify-content:space-between;gap:12px}
.ask .qn{margin-top:12px;font-size:20px;letter-spacing:-.01em;line-height:1.4}
.ans{margin-top:16px;display:flex;flex-direction:column}
.ar{display:grid;grid-template-columns:32px minmax(0,1fr);gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--line);transition:opacity .5s,transform .5s}
.pos{width:30px;height:30px;border-radius:50%;border:1.5px solid var(--fg);display:grid;place-items:center;font-size:14px;font-weight:600}
.ar:first-child .pos{background:var(--fg);color:var(--bg)}
.ar.me .pos{border:1.5px dashed var(--miss);color:var(--miss)}.ar.me .pos .ico{width:14px;height:14px;stroke-width:2.2}
.rn{display:flex;flex-direction:column;min-width:0}.rn b{font-size:17px;font-weight:600;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rn em{font-style:normal;font-size:14px;color:var(--mute)}.ar.me .rn em{color:var(--miss);font-weight:500}
.rn small{font-size:12px;font-weight:500;color:var(--body);border:1px solid var(--line2);border-radius:999px;padding:0 8px}
.hero.pre .ar{opacity:0;transform:translateY(6px)}
.ar:nth-child(1){transition-delay:1.5s}.ar:nth-child(2){transition-delay:1.75s}.ar:nth-child(3){transition-delay:2.1s}
.ar.me{position:relative}
.ar.me::after{content:"";position:absolute;inset:4px -12px;border:1.5px solid var(--miss);border-radius:10px;pointer-events:none;transition:opacity .5s 2.4s}
.hero.pre .ar.me::after{opacity:0}
.srcs{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.srcs .lab{flex-basis:100%}
.sc{display:inline-flex;gap:7px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:3px 11px 3px 4px;font-size:13px;color:var(--body)}
.sc i{font-style:normal;width:20px;height:20px;border-radius:50%;background:var(--pill);display:grid;place-items:center;font-size:11px;font-weight:600;color:var(--fg)}
.sc b{display:inline-grid;place-items:center;width:16px;height:16px;border-radius:50%;background:var(--pill);color:var(--fg);font-size:10px}
.fine{font-size:12px;color:var(--mute);margin-top:14px}
.exsw{display:inline-flex;gap:4px;padding:3px;border:1px solid var(--line2);border-radius:999px;margin-top:12px}
.exsw button{background:none;border:0;color:var(--body);border-radius:999px;padding:5px 12px;font:500 13px var(--f);cursor:pointer;transition:background .25s,color .25s}
.exsw button[aria-selected="true"]{background:var(--fg);color:var(--bg)}
.swapping{transition:opacity .25s}.swapping.out{opacity:0}

/* strip */
.strip{position:relative;padding-block:40px}
.strip .wrap{display:flex;align-items:center;gap:32px;flex-wrap:wrap}
.names{display:flex;justify-content:space-between;flex:1;min-width:0;gap:24px;flex-wrap:wrap;font-size:22px;font-weight:600;letter-spacing:-.02em;color:var(--body)}

/* PRODUCT DEMO */
.ptabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.pt{background:none;border:1px solid var(--line2);color:var(--body);border-radius:999px;padding:8px 16px;font:500 14px var(--f);cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.pt[aria-selected="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.persp{perspective:1600px}
.win{display:grid;grid-template-columns:220px minmax(0,1fr);overflow:hidden;transform-origin:50% 0;transition:transform 1.3s cubic-bezier(.16,1,.3,1),opacity 1.1s}
.pre .win{transform:rotateX(16deg) translateY(40px) scale(.96);opacity:.35}
.side{border-right:1px solid var(--line);padding:16px 12px;font-size:13.5px;color:var(--body)}
.brand{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;color:var(--fg);font-weight:600}
.brand i{width:20px;height:20px;border-radius:6px;background:var(--fg);color:var(--bg);font-style:normal;font-size:11px;display:grid;place-items:center}
.side .lab{display:block;margin:18px 10px 6px;font-size:12px}
.si{padding:5px 10px;border-radius:8px;transition:background .25s,color .25s}
.si.on{background:var(--pill);color:var(--fg)}
.main{padding:22px 26px;min-width:0}
.mtop{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.mtop h3{font-size:24px}
.pane{display:none;animation:fadein .35s ease}
.pane.on{display:block}
@keyframes fadein{from{opacity:0;transform:translateY(6px)}}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.kpi{border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.kpi .v{font-size:30px;font-weight:600;letter-spacing:-.03em;margin-top:6px}
.kpi p{font-size:12px;color:var(--mute);margin-top:2px}
.g2{display:grid;grid-template-columns:7fr 5fr;gap:12px;margin-top:12px}
.box{border:1px solid var(--line);border-radius:12px;padding:14px 16px;min-width:0}
.chart{width:100%;height:120px;display:block;margin-top:8px}
.chart .ln{fill:none;stroke:var(--fg);stroke-width:2;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 1.4s cubic-bezier(.3,.6,.2,1) .9s}
.chart .ln2{fill:none;stroke:var(--mute);stroke-width:1.5;stroke-dasharray:4 4}
.chart .grid{stroke:var(--line);stroke-width:1}
.pre .chart .ln{stroke-dashoffset:1}
.bar{display:grid;grid-template-columns:88px minmax(0,1fr) 46px;gap:10px;align-items:center;font-size:13px;color:var(--body);margin-top:10px}
.bar span.t{height:6px;border-radius:3px;background:var(--pill);position:relative;overflow:hidden}
.bar span.t i{position:absolute;inset:0 auto 0 0;border-radius:3px;background:var(--mute);transition:width 1.1s cubic-bezier(.16,1,.3,1) 1.2s}
.bar.me{color:var(--fg)}.bar.me span.t i{background:var(--fg)}
.pre .bar span.t i{width:0!important}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{text-align:left;font-weight:500;color:var(--mute);padding:9px 10px;border-bottom:1px solid var(--line)}
td{padding:10px;border-bottom:1px solid var(--line);color:var(--body)}
td:first-child{color:var(--fg)}
tr:last-child td{border-bottom:0}
.tbl{overflow-x:auto;margin-top:12px}
.note{font-size:12px;color:var(--mute);margin-top:10px}
.pcs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}
.pc{border:1px solid var(--line);border-radius:12px;padding:14px 16px;min-width:0;display:flex;flex-direction:column;gap:10px}
.pch{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.pch b{font-size:16px;font-weight:600}
.pc .mtr{margin-top:-4px}
.pcr{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--mute)}.pcr b{color:var(--fg);font-weight:600;font-size:14px}
.pcx{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pcx div{background:var(--pill);border-radius:10px;padding:8px 10px}
.pcx span{display:block;font-size:12px;color:var(--mute)}.pcx b{display:block;font-size:18px;font-weight:600;letter-spacing:-.01em}.pcx em{font-style:normal;font-size:12px;color:var(--mute)}.pcx em.miss{color:var(--miss);font-weight:500}
@media (max-width:1000px){.pcs{grid-template-columns:1fr}}
@media (max-width:640px){
 .tbl table,.tbl tbody,.tbl tr,.tbl td{display:block;width:100%}
 .tbl.box{border:0;padding:0}.tbl tr:first-child{display:none}
 .tbl tr{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-top:10px}
 .tbl td{border:0;padding:4px 0;display:flex;justify-content:space-between;gap:14px;text-align:right;font-size:14px}
 .tbl td::before{content:attr(data-l);color:var(--mute);text-align:left;flex:none;max-width:48%}
 .tbl td:first-child{display:block;text-align:left;font-weight:600;font-size:15px;padding-bottom:8px}.tbl td:first-child::before{display:none}}
@media (max-width:900px){.win{grid-template-columns:1fr}.side{display:none}.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.g2{grid-template-columns:1fr}.main{padding:16px}}

/* EVIDENCE */
.ev{display:grid;grid-template-columns:4fr 8fr;gap:24px;align-items:start;position:relative}
.metric{padding:24px}
.metric .v{font-size:64px;font-weight:600;letter-spacing:-.05em;line-height:1;margin-top:12px}
.metric .hl{position:absolute;inset:-1px;border:1.5px solid var(--fg);border-radius:16px;pointer-events:none;transition:opacity .4s .3s}
.pre .metric .hl{opacity:0}
.obs{padding:24px;transition:opacity .6s .5s,transform .7s .5s cubic-bezier(.16,1,.3,1)}
.pre .obs{opacity:0;transform:translateX(48px)}
.quote{margin-top:14px;padding:14px 16px;border-left:2px solid var(--line2);background:var(--pill);border-radius:0 10px 10px 0;font-size:17px;line-height:1.5}
.absent{margin-top:14px;display:inline-flex;gap:8px;align-items:center;border:1.5px solid var(--miss);color:var(--miss);border-radius:8px;padding:6px 10px;font-size:14px;transition:opacity .4s 1.1s}
.pre .absent{opacity:0}
.absent{margin-top:14px}
.obt{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.chat{margin-top:16px;display:flex;flex-direction:column;gap:10px}
.uq{align-self:flex-end;max-width:88%;background:var(--pill);border-radius:16px 16px 4px 16px;padding:10px 14px}
.uq p{margin:2px 0 0;font-size:16px;font-weight:500}
.ab{max-width:96%;border:1px solid var(--line2);border-radius:16px 16px 16px 4px;padding:14px 16px}
.ab .who{border:0;padding:0;font-size:13px;font-weight:500;gap:8px}
.gl{width:26px;height:26px;border-radius:50%;border:1px solid var(--line2);display:grid;place-items:center}.gl .ico{width:15px;height:15px}
.ab p{margin:10px 0 0;font-size:17px;line-height:1.55;color:var(--body)}.ab p b{color:var(--fg);font-weight:600}
.absent .ico{width:15px;height:15px;stroke-width:2.2}
.srcl{position:relative;margin-top:18px;padding-left:22px;transition:opacity .5s 1.6s,transform .5s 1.6s}
.srcl::before{content:"";position:absolute;left:5px;top:-10px;bottom:22px;width:2px;background:var(--fg)}
.srcl::after{content:"";position:absolute;left:0;bottom:12px;width:8px;height:8px;border:2px solid var(--fg);border-radius:50%;background:var(--card)}
.pre .srcl{opacity:0;transform:translateY(8px)}
.lk{display:flex;gap:12px;align-items:center;margin-top:8px;border:1px solid var(--fg);border-radius:12px;padding:12px 14px;min-width:0}
.lk i{font-style:normal;flex:none;width:32px;height:32px;border-radius:8px;background:var(--fg);color:var(--bg);display:grid;place-items:center;font-weight:600}
.lk div{min-width:0}.lk b{display:block;font-weight:600;font-size:15px}.lk span{display:block;font-size:13px;color:var(--mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.srcl>p{margin:8px 0 0;font-size:15px;color:var(--body)}
.meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px;font-size:13px}
.meta div{border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.meta b{display:block;font-weight:500;color:var(--mute);font-size:12px;margin-bottom:2px}
.srcrow{margin-top:14px;border:1px solid var(--fg);border-radius:12px;padding:12px 14px;font-size:14px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;transition:opacity .5s 1.6s,transform .5s 1.6s}
.pre .srcrow{opacity:0;transform:translateY(8px)}
.fact{margin-top:24px;padding:20px 24px;display:flex;gap:24px;justify-content:space-between;flex-wrap:wrap;align-items:center}
.evtrace{position:absolute;inset:0;pointer-events:none;overflow:visible}
.evtrace path{fill:none;stroke:var(--fg);stroke-width:1.4;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset .9s .35s}
.pre .evtrace path{stroke-dashoffset:1}
@media (max-width:900px){.ev{grid-template-columns:1fr}.evtrace{display:none}.meta{grid-template-columns:1fr}}

/* ACTION */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:relative;margin-bottom:24px;--p:0}
.steps::before,.steps::after{content:"";position:absolute;left:16px;top:15px;height:2px;background:var(--line2);width:75%}
.steps::after{background:var(--fg);width:calc(75% * var(--p));transition:width .6s cubic-bezier(.16,1,.3,1)}
.st{position:relative;z-index:1;background:none;border:0;color:var(--mute);text-align:left;padding:0 10px 0 0;font:inherit;cursor:pointer;transition:color .3s}
.st i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:2px solid var(--line2);background:var(--bg);font-style:normal;font-size:14px;font-weight:600;margin-bottom:12px;transition:background .3s,color .3s,border-color .3s}
.st b{display:block;font-size:17px;font-weight:600}
.st span{display:block;font-size:14px;margin-top:2px}
.st[aria-selected="true"],.st.done{color:var(--fg)}
.st.done i{border-color:var(--fg);color:var(--fg)}
.st[aria-selected="true"] i{background:var(--fg);border-color:var(--fg);color:var(--bg);box-shadow:0 0 0 6px var(--pill)}
@media (max-width:600px){.st span{display:none}.st b{font-size:15px}}
.apanel{display:none;padding:28px;animation:fadein .35s ease}
.apanel.on{display:grid;grid-template-columns:5fr 7fr;gap:28px;align-items:start}
.pg{border:1px solid var(--line);border-radius:12px;padding:16px;position:relative;background:var(--band)}
.pg .l{height:10px;border-radius:4px;background:var(--pill);margin-top:10px}
.pgbar{display:flex;align-items:center;gap:6px;padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:4px}
.pgbar i{width:8px;height:8px;border-radius:50%;background:var(--line2)}.pgbar span{margin-left:8px;font-size:13px;color:var(--mute)}
.ins{display:flex;gap:12px;align-items:flex-start;margin:14px 0 4px;border:1.5px dashed var(--fg);border-radius:10px;padding:12px 14px;background:var(--card);animation:annin .7s ease .25s both}
.ins .plus{flex:none;width:22px;height:22px;border-radius:50%;background:var(--fg);color:var(--bg);display:grid;place-items:center;font-weight:600;line-height:1}
.ins p{margin:0;font-size:15px;line-height:1.45;font-weight:500}
.f3s{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.f3{border:1px solid var(--line);border-radius:12px;padding:14px 16px;min-width:0}
.f3 b{display:block;font-size:30px;font-weight:600;letter-spacing:-.03em;margin-top:4px}.f3 b small{font-size:15px;color:var(--mute);font-weight:500;letter-spacing:0}
.f3 p{margin-top:6px;font-size:16px;font-weight:500;line-height:1.35}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.mtr{height:6px;border-radius:3px;background:var(--pill);overflow:hidden;margin-top:10px}.mtr i{display:block;height:100%;border-radius:3px;background:var(--fg);transition:width 1s cubic-bezier(.16,1,.3,1) .3s}
.pre .mtr i{width:0!important}
.evl{display:flex;flex-direction:column;gap:10px}
.evi{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:14px}
.evk{flex:none;width:34px;height:34px;border-radius:50%;background:var(--pill);display:grid;place-items:center}
.evi b{display:block;font-weight:500;font-size:15px;line-height:1.4}.evi div span{font-size:13px;color:var(--mute)}
.evi.gap{border:1.5px dashed var(--miss)}.evi.gap .evk{background:transparent;border:1.5px solid var(--miss);color:var(--miss)}.evi.gap div span{color:var(--miss)}
.asg{border:1px solid var(--line);border-radius:14px;padding:18px}
.who{display:flex;align-items:center;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.who b{display:block;font-weight:600}.who div span{font-size:13px;color:var(--mute)}.who .tag{margin-left:auto}
.avt{width:40px;height:40px;border-radius:50%;background:var(--fg);color:var(--bg);display:grid;place-items:center;font-weight:600;font-size:14px;flex:none}
.flow{list-style:none;margin:16px 0 0;padding:0}
.flow li{position:relative;padding:0 0 16px 34px}.flow li:last-child{padding-bottom:0}
.flow li::before{content:"";position:absolute;left:0;top:2px;width:18px;height:18px;border-radius:50%;border:2px solid var(--line2);background:var(--card);box-sizing:border-box;z-index:1}
.flow li::after{content:"";position:absolute;left:8px;top:20px;bottom:0;width:2px;background:var(--line2)}.flow li:last-child::after{display:none}
.flow li.done::before{background:var(--fg);border-color:var(--fg)}.flow li.done::after{background:var(--fg)}
.flow li.cur::before{border-color:var(--fg);box-shadow:0 0 0 5px var(--pill)}
.flow b{display:block;font-weight:600;font-size:15px}.flow li:not(.done):not(.cur) b{color:var(--mute);font-weight:500}.flow span{font-size:13px;color:var(--mute)}
.ico{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
@media (max-width:600px){.apanel{padding:20px}.apanel h3{font-size:22px!important}}
@keyframes annin{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.kv{display:grid;grid-template-columns:120px minmax(0,1fr);gap:10px 16px;font-size:15px}
.kv b{font-weight:500;color:var(--mute)}
@media (max-width:900px){.apanel.on{grid-template-columns:1fr}}

/* MEASURE */
.rep{padding:28px}
.rep-top{display:grid;grid-template-columns:7fr 5fr;gap:24px;align-items:start;padding-bottom:24px;border-bottom:1px solid var(--line)}
.rep-top h3{font-size:30px;letter-spacing:-.03em}
.rh{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ba{margin-top:18px;display:flex;flex-direction:column;gap:12px}
.bar2{display:grid;grid-template-columns:104px minmax(0,1fr) 52px;gap:14px;align-items:center}
.bl{font-size:15px;font-weight:600;line-height:1.2}.bl small{display:block;font-size:12px;font-weight:400;color:var(--mute)}
.bar2 .t{height:14px;border-radius:7px;background:var(--pill);overflow:hidden}.bar2 .t i{display:block;height:100%;border-radius:7px;background:var(--mute);transition:width 1.1s cubic-bezier(.16,1,.3,1) .4s}
.bar2.af .t i{background:var(--fg);transition-delay:.9s}.bar2 b{font-size:22px;font-weight:600;text-align:right}.bar2:not(.af) b{color:var(--mute)}
.pre .bar2 .t i{width:0!important}
.rec{border-left:2px solid var(--fg);padding:4px 0 4px 18px}.rec p{font-size:20px;font-weight:600;line-height:1.35;margin:8px 0 6px;letter-spacing:-.01em}
@media (max-width:600px){.mk .kpi .v{font-size:24px;white-space:nowrap}.rep{padding:20px}.rep-top h3{font-size:26px}.bar2{grid-template-columns:88px minmax(0,1fr) 44px;gap:10px}.bar2 b{font-size:18px}}
.mk{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:24px}
.mk .kpi .v{font-size:32px}
.mc{display:grid;grid-template-columns:7fr 5fr;gap:12px;margin-top:12px}
.mchart{width:100%;height:170px}
.mchart .a{fill:none;stroke:var(--fg);stroke-width:2;stroke-dasharray:1;stroke-dashoffset:0}
.mchart .a1{transition:stroke-dashoffset .6s .3s}.mchart .a2{transition:stroke-dashoffset .8s 1.1s}
.mchart .mark{stroke:var(--mute);stroke-dasharray:3 4;transition:opacity .3s .9s}
.pre .mchart .a{stroke-dashoffset:1}.pre .mchart .mark,.pre .mchart .mt{opacity:0}
.mchart .mt{fill:var(--mute);font:500 12px var(--f);transition:opacity .3s .9s}
.cant{border:1.5px dashed var(--miss);border-radius:12px;padding:16px;transition:opacity .8s 2.2s,transform .8s 2.2s}
.cant .lab{color:var(--miss)}
.pre .cant{opacity:0;transform:translateY(8px)}
@media (max-width:900px){.rep-top,.mc{grid-template-columns:1fr}.mk{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ROLES */
.rtabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.rpanel{display:none;padding:28px;animation:fadein .3s ease}
.rpanel.on{display:grid;grid-template-columns:5fr 7fr;gap:32px}
.tasks{display:flex;flex-direction:column;gap:10px}
.task{display:flex;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:15px}
.jobs{display:flex;flex-direction:column;gap:10px}
.job{display:flex;gap:14px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.jic{flex:none;width:40px;height:40px;border-radius:10px;background:var(--pill);display:grid;place-items:center}.jic .ico{width:20px;height:20px}
.job div{flex:1;min-width:0}.job b{display:block;font-weight:600;font-size:16px}.job div span{font-size:13px;color:var(--mute)}
.job .arr{color:var(--mute)}
@media (max-width:600px){.rpanel{padding:20px}.rtabs{flex-wrap:nowrap;overflow-x:auto;margin-inline:-24px;padding-inline:24px;scrollbar-width:none}.rtabs .pt{flex:none}}
@media (max-width:900px){.rpanel.on{grid-template-columns:1fr}}

/* INTEGRATIONS */
.net{width:100%;min-width:760px;height:auto;display:block}
.net text{font-family:var(--f);fill:var(--fg)}
.net .src rect{fill:var(--card);stroke:var(--line2)}
.net .src.on rect{stroke:var(--fg)}
.net .src{cursor:default}
.net .wire{fill:none;stroke:var(--line2);stroke-width:1.2;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 1s cubic-bezier(.3,.6,.2,1),stroke .25s}
.net .wire.on{stroke:var(--fg);stroke-width:1.8}
.pre .net .wire{stroke-dashoffset:1}
.net .hub{fill:var(--card);stroke:var(--fg);stroke-width:1.6}
.net .ansq{font-size:15px;fill:var(--body)}
.scroll{overflow-x:auto;margin-inline:-8px;padding-inline:8px}

/* TRUST */
.trust{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.trust .card{padding:22px;display:flex;flex-direction:column}
.mv{height:112px;border-radius:12px;background:var(--band);border:1px solid var(--line);padding:14px;margin-bottom:18px;display:flex;flex-direction:column;justify-content:center;gap:4px}
.frac b{font-size:30px;font-weight:600;letter-spacing:-.03em;line-height:1}.frac span{font-size:13px;color:var(--mute);margin-left:6px}
.mv.two{flex-direction:row;gap:10px;align-items:stretch;padding:10px}.mv.two>div{flex:1;border-radius:10px;background:var(--card);border:1px solid var(--line);padding:10px;display:flex;flex-direction:column;justify-content:center}
.mv.two b{font-size:26px;font-weight:600;line-height:1}.mv.two span{font-size:12px;color:var(--mute);margin-top:6px;line-height:1.3}.mv.two .nm{border-style:dashed;border-color:var(--line2)}
.pipe{display:flex;align-items:center;gap:6px}.pipe span{font-size:13px;font-weight:500;border:1px solid var(--line2);border-radius:999px;padding:4px 10px}.pipe i{flex:1;height:1.5px;background:var(--line2);min-width:8px}
.pipe .ap{background:var(--fg);color:var(--bg);border-color:var(--fg)}.pipe .off{color:var(--mute);border-style:dashed}.mv .small{margin-top:8px;font-size:13px;color:var(--mute)}
.cm{border:1.5px dashed var(--miss);border-radius:10px;padding:10px 12px}.cm span{font-size:12px;font-weight:500}.cm b{display:block;font-size:15px;font-weight:600;margin-top:2px}
.trust h3{font-size:18px;margin-bottom:6px}
.trust p{font-size:15px;color:var(--body);line-height:1.5}
@media (max-width:900px){.trust{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.trust{grid-template-columns:1fr}}

/* START */
.price{display:grid;grid-template-columns:5fr 7fr;gap:24px;align-items:stretch}
.price .card{padding:28px}
.big{font-size:56px;font-weight:600;letter-spacing:-.04em;line-height:1}
.steps3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.s3{border-top:1px solid var(--line2);padding-top:14px}
.s3 b{display:block;font-size:13px;color:var(--mute);font-weight:500;margin-bottom:6px}
@media (max-width:900px){.price,.steps3{grid-template-columns:1fr}}
.faq{display:grid;grid-template-columns:4fr 8fr;gap:40px}
details{border-bottom:1px solid var(--line);padding:16px 0}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;font-weight:600;font-size:17px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--mute);font-weight:400}
details[open] summary::after{content:"−"}
details p{margin-top:10px;color:var(--body);font-size:15px;max-width:640px}
@media (max-width:900px){.faq{grid-template-columns:1fr}}
.close{text-align:center;overflow:hidden}
.close::after{content:"";position:absolute;left:50%;top:40px;width:90%;height:620px;transform:translateX(-50%);pointer-events:none;background:radial-gradient(40% 45% at 50% 45%,var(--glow),transparent 72%)}
.close .wrap{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:24px}
.close h2{font-size:clamp(44px,6.4vw,88px);letter-spacing:-.05em;line-height:1}
footer{border-top:1px solid var(--line);padding-block:48px 72px}
footer .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
footer nav{display:flex;gap:28px;flex-wrap:wrap;font-size:14px;color:var(--body)}
footer nav a{text-decoration:none}

@media (max-width:700px){.names{flex:1 1 100%;justify-content:flex-start;gap:8px 20px;font-size:18px}}
/* generic reveal */
.rv{transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1),filter .9s}
.pre .rv{opacity:0;transform:translateY(18px);filter:blur(6px)}

/* ===== v4 accent layer: logo blue, used sparingly in dark, more fully in light ===== */
.tr::after{background:var(--acc)}.tr::before{border-color:var(--acc)}
.eyebrow{color:var(--acc)}.eyebrow::before{background:var(--acc)}
.hero::before{background:radial-gradient(40% 36% at 50% 0%,var(--hglow),transparent 72%),radial-gradient(48% 40% at 50% 0%,var(--glow),transparent 72%)}
.ask::before{background:radial-gradient(50% 50% at 50% 50%,var(--hglow),transparent 70%)}
.bar.me span.t i,.mtr i,.bar2.af .t i{background:var(--acc)}.bar.me>span:first-child{color:var(--acc);font-weight:600}
.mchart .a2{stroke:var(--acc)}
.metric .v,.kpi .v,.f3 b,.frac b{color:var(--num)}
.metric .hl{border-color:var(--acc)}
.st[aria-selected="true"] i{background:var(--acc);border-color:var(--acc);color:#fff;box-shadow:0 0 0 6px var(--accbg)}.st.done i{border-color:var(--acc);color:var(--acc)}.steps::after{background:var(--acc)}
.flow li.done::before{background:var(--acc);border-color:var(--acc)}.flow li.done::after{background:var(--acc)}.flow li.cur::before{border-color:var(--acc);box-shadow:0 0 0 5px var(--accbg)}
.pipe .ap{background:var(--acc);border-color:var(--acc);color:#fff}
.ins{border-color:var(--acc);background:var(--accbg)}.ins .plus{background:var(--acc);color:#fff}
.lk{border-color:var(--acc)}.lk i{background:var(--acc);color:#fff}.srcl::before{background:var(--acc)}.srcl::after{border-color:var(--acc)}
.avt{background:var(--acc);color:#fff}
.net .wire.on{stroke:var(--acc)}.net .hub{stroke:var(--acc)}.net .src.on rect{stroke:var(--acc)}
.jic{background:var(--accbg);color:var(--acc)}
.evk{background:var(--accbg);color:var(--acc)}
.rec{border-left-color:var(--acc)}
.pt[aria-selected="true"]{background:var(--fg);border-color:var(--fg)}
#product,#improve,#trust{background:var(--tint)}
:root[data-theme="light"] .btn-p{background:var(--acc);color:#fff}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]) .btn-p{background:var(--acc);color:#fff}}

/* ===== hero answer card ===== */
.ask{padding:20px 22px 22px}
.ask .row1{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.asst{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:15px}
.asst .gl{width:30px;height:30px;border-radius:50%;border:1px solid var(--line2);display:grid;place-items:center}.asst .gl .ico{width:16px;height:16px}
.exsw{margin-top:0}
.uq.hq{margin:18px 0 0 auto;width:fit-content;max-width:92%;padding:12px 16px}
.uq.hq p{margin:0;font-size:18px;line-height:1.4;letter-spacing:-.01em}
.ans{position:relative}
.thinking{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-around;pointer-events:none;transition:opacity .35s}
.thinking i{display:flex;align-items:center;gap:14px}
.thinking b{width:30px;height:30px;border-radius:50%;flex:none}
.thinking s{height:12px;border-radius:6px;width:46%;text-decoration:none}
.thinking i:nth-child(2) s{width:36%}.thinking i:nth-child(3) s{width:52%}
.thinking b,.thinking s{background:linear-gradient(90deg,var(--pill) 0%,rgba(var(--acc-rgb),.26) 50%,var(--pill) 100%);background-size:200% 100%;animation:shim 1.2s linear infinite}
@keyframes shim{from{background-position:100% 0}to{background-position:-100% 0}}
#ask.a1 .thinking{opacity:0}
.ans{margin-top:14px}
#ask .ar{opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s cubic-bezier(.16,1,.3,1),background .5s,margin .5s,padding .5s;border-top:1px solid var(--line)}
#ask .ar:first-child{border-top:0}
#ask.a1 .ar{opacity:1;transform:none}
#ask.a1 .ar:nth-child(2){transition-delay:.15s}#ask.a1 .ar:nth-child(3){transition-delay:.3s}
.ar.me::after{display:none}
.ar.me .pos{border:1.5px dashed var(--line2);color:var(--mute);transition:border-color .4s,color .4s}
.ar.me em{color:var(--mute)!important;transition:color .4s}
#ask.a2 .ar.me{background:var(--missbg);border-top-color:transparent;border-radius:12px;padding-inline:12px;margin-inline:-12px}
#ask.a2 .ar.me .pos{border-color:var(--miss);color:var(--miss)}
#ask.a2 .ar.me em{color:var(--miss)!important;font-weight:500}
.rn small{border-color:rgba(var(--acc-rgb),.5);color:var(--acc)}
.why{position:relative;margin-top:14px;padding:14px 16px 14px 18px;border-radius:12px;background:var(--accbg);opacity:0;transform:translateY(10px);transition:opacity .6s .15s,transform .6s .15s cubic-bezier(.16,1,.3,1)}
.whyw{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s cubic-bezier(.16,1,.3,1)}.whyw>div{overflow:hidden}#ask.a3 .whyw{grid-template-rows:1fr}
.why::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:2px;border-radius:2px;background:var(--acc);transform:scaleY(0);transform-origin:top;transition:transform .8s .2s cubic-bezier(.16,1,.3,1)}
#ask.a3 .why{opacity:1;transform:none}#ask.a3 .why::before{transform:none}
.wl{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--acc)}
.wr{width:9px;height:9px;border:2px solid var(--acc);border-radius:50%}
.why p{margin:6px 0 0;font-size:15px;line-height:1.5;color:var(--body)}.why p b{color:var(--fg);font-weight:600}
.favs{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:12px;color:var(--mute)}
.fs{display:flex}.fs i{font-style:normal;width:22px;height:22px;border-radius:50%;background:var(--card2);border:1.5px solid var(--card);outline:1px solid var(--line2);display:grid;place-items:center;font-size:10px;font-weight:600;color:var(--fg);margin-left:-6px}.fs i:first-child{margin-left:0}
.fine:empty{display:none}
@media (max-width:600px){.ask{padding:16px}.uq.hq p{font-size:16px}}


/* ===== v5 ===== */
/* calmer red: tint, never outline boxes */
.tag.bad{border:0;background:rgba(var(--miss-rgb),.12);color:var(--miss)}
.absent,.stt{display:inline-flex;align-items:center;gap:8px;margin-top:14px;border:0;border-radius:999px;padding:6px 12px;font-size:14px;font-weight:500}
.absent,.stt.no{background:rgba(var(--miss-rgb),.10);color:var(--miss)}
.stt.ok{background:var(--accbg);color:var(--acc)}.stt .ico{width:15px;height:15px;stroke-width:2.2}
.pcx b.miss{color:var(--fg)}
.cant{border:1px dashed var(--line2)}
.evi.gap{border:1px solid var(--line)}.evi.gap .evk{border:0;background:rgba(var(--miss-rgb),.12)}
.cm{border:1px dashed var(--line2)}
/* strip marquee */
.strip{padding-block:48px}.strip .wrap{justify-content:center}.strip .lab{display:block;text-align:center;width:100%}
.mq{overflow:hidden;margin-top:20px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.mqt{display:flex;gap:64px;width:max-content;animation:mq 36s linear infinite}
.mi{display:inline-flex;align-items:center;gap:12px;font-size:24px;font-weight:600;letter-spacing:-.02em;color:var(--body);white-space:nowrap}
.mi i{width:36px;height:36px;border-radius:10px;border:1px solid var(--line2);display:grid;place-items:center;color:var(--mute)}.mi .ico{width:18px;height:18px}
@keyframes mq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.mqt{animation:none;flex-wrap:wrap;justify-content:center;width:auto;gap:16px 32px}.mq{-webkit-mask-image:none;mask-image:none}.mi:nth-child(n+6){display:none}}
@media (max-width:600px){.mi{font-size:19px}.mqt{gap:40px}.hero-in{padding-block:96px 64px}}
/* interactive evidence */
.evtrace,.metric .hl{display:none}
.metric{padding:22px}
.evtop{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-top:8px}.evtop .v{margin-top:0;font-size:56px}
.hint{margin-top:18px;font-size:13px;color:var(--acc);font-weight:500}
.asl{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.asb{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center;text-align:left;width:100%;background:transparent;border:1px solid var(--line);border-radius:12px;padding:10px 12px;color:var(--fg);font:inherit;cursor:pointer;transition:border-color .25s,background .25s,transform .25s}
.asb{position:relative;z-index:2}.asb:hover{border-color:var(--line2)}.asb.on{border-color:var(--acc);background:var(--accbg)}
.asb .an{display:flex;flex-direction:column;min-width:0}.asb .an b{font-weight:600;font-size:15px}.asb em{font-style:normal;font-size:12px}
.asb em.ok{color:var(--acc)}.asb em.no{color:var(--mute)}
.asb .ap{font-weight:600;font-size:18px}
.asb .mtr{grid-column:1/-1;margin-top:0;height:4px}
.asb:not(.on) .mtr i{background:var(--mute)}
.oa{display:none;animation:fadein .35s ease}.oa.on{display:block}
.ab p b.you{color:var(--acc)}
@media (max-width:900px){.asl{display:grid;grid-template-columns:1fr 1fr}.asb:last-child{grid-column:1/-1}}
.asb{grid-template-areas:"n p" "s s" "m m"}.asb .an{display:contents}.asb .an b{grid-area:n}.asb em{grid-area:s;margin-top:-4px}.asb .ap{grid-area:p}.asb .mtr{grid-area:m;margin-top:4px}
@media (max-width:600px){.rep .mk .kpi .v{font-size:23px;white-space:nowrap}.rep .mk .kpi{padding:12px}.asb .ap{font-size:16px}}


/* ===== v6: product UI showcase ===== */
#product .persp{max-width:1240px;margin-inline:auto}
@media (min-width:1216px){#product .persp{margin-inline:-60px}}
.ptabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin:0 0 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
#product .pt{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:0;background:none;color:var(--mute);padding:18px 12px;font:500 15px var(--f);border-left:1px solid var(--line)}
#product .pt:first-child{border-left:0}
#product .pt .ico{width:17px;height:17px}
#product .pt[aria-selected="true"]{background:none;color:var(--fg);border-color:var(--line)}
.pg2{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--acc);transform:scaleX(0);transform-origin:left}
.pt[aria-selected="true"] .pg2,.mi2.on .pg2{transform:scaleX(1)}
.run .pg2{animation:prog var(--dur,7s) linear both}.mi2.run .pg2{--dur:5s}
@keyframes prog{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (max-width:760px){.ptabs{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-24px;padding-inline:12px}#product .pt{flex:none;padding:14px 16px;font-size:14px}}
.tbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:16px;margin-bottom:18px;border-bottom:1px solid var(--line)}
.fnd{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:13px;color:var(--mute);min-width:220px}
.fnd kbd{margin-left:auto;font:500 11px var(--f);border:1px solid var(--line);border-radius:4px;padding:0 4px}.fnd .ico{width:14px;height:14px}
.tb-r{display:flex;gap:8px}.tbp{border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:13px;color:var(--body);white-space:nowrap}.tbp.dk{background:var(--fg);color:var(--bg);border-color:var(--fg)}
@media (max-width:760px){.fnd{min-width:0;flex:1}.tb-r .tbp:not(.dk){display:none}}
.kpi .v{color:var(--fg)}
.lc{position:relative}.lch{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.lgd{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--body)}
.lgd span,.ctip span{display:inline-flex;align-items:center;gap:6px}.lgd i,.ctip i{width:10px;height:2px;border-radius:2px;background:var(--mute)}
.lk0 i{background:var(--acc)!important;height:3px!important}.lk1 i{background:var(--fg)!important;opacity:.7}.lk2 i{opacity:.8}.lk3 i{opacity:.45}
.lcw{position:relative;margin-top:10px}
#lchart{width:100%;height:190px;display:block;overflow:hidden;cursor:crosshair}
#lchart .lg{stroke:var(--line);stroke-width:1;fill:none}
#lchart .ls{fill:none;stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 1.6s cubic-bezier(.3,.6,.2,1) .5s}
#lchart .s0{stroke:var(--acc);stroke-width:2.6}#lchart .s1{stroke:var(--fg);opacity:.55}#lchart .s2{stroke:var(--mute);opacity:.8}#lchart .s3{stroke:var(--mute);opacity:.45}
.pre #lchart .ls{stroke-dashoffset:1}
#lchart .lx{stroke:var(--line2);stroke-width:1;vector-effect:non-scaling-stroke}
.xl{display:flex;justify-content:space-between;font-size:11px;color:var(--mute);margin-top:6px}
.ctip{position:absolute;top:0;width:170px;background:var(--card2);border:1px solid var(--line2);border-radius:10px;padding:10px 12px;font-size:12px;box-shadow:0 12px 30px -12px rgba(0,0,0,.5);pointer-events:none;display:flex;flex-direction:column;gap:4px}
.ctip[hidden]{display:none}.ctip b{font-weight:600;margin-bottom:2px}.ctip em{font-style:normal;margin-left:auto;font-weight:600}.ctip span{width:100%}
.rkh .lab{white-space:nowrap}.rkh,.rk{display:grid;grid-template-columns:minmax(0,1fr) 110px 84px;gap:8px;align-items:center}
.rkh{padding-bottom:8px;border-bottom:1px solid var(--line)}.rkh .lab{font-size:12px}
.rk{padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}.rk:last-child{border-bottom:0}
.rkb{display:flex;align-items:center;gap:8px;min-width:0}.rkb b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkb i{font-style:normal;flex:none;width:22px;height:22px;border-radius:6px;background:var(--pill);display:grid;place-items:center;font-size:11px;font-weight:600}
.rk.me .rkb i{background:var(--acc);color:#fff}.rk.me .rkb b{font-weight:600}
.rkb small{font-size:11px;color:var(--acc);border:1px solid rgba(var(--acc-rgb),.5);border-radius:999px;padding:0 6px}
.rkn{display:none}.rkv em{font-style:normal;font-size:12px;margin-left:4px}.rkv em.up{color:var(--acc)}.rkv em.down{color:var(--mute)}
.rk-pos{text-align:right;color:var(--body)}
@media (max-width:500px){.rkh,.rk{grid-template-columns:minmax(0,1fr) 104px}.rk-pos{display:none}}
/* ===== statement ===== */
.say{padding-block:120px 40px}.say::before{display:none}
.sayt{margin:0 auto;max-width:980px;text-align:center;font-size:clamp(30px,4.6vw,56px);line-height:1.15;letter-spacing:-.035em;font-weight:600}
.sw{display:inline-block;opacity:.14;filter:blur(6px);transition:opacity .5s,filter .6s}.sw.in{opacity:1;filter:none}
@media (max-width:600px){.say{padding-block:88px 24px}}
/* ===== method ===== */
.mth{display:grid;grid-template-columns:5fr 7fr;gap:48px;align-items:stretch}
.mleft .head{margin-bottom:28px}
.mlist{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.mi2{position:relative;display:flex;gap:18px;align-items:flex-start;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);padding:18px 4px;color:var(--mute);font:inherit;cursor:pointer}
.mno{font-size:13px;font-weight:600;padding-top:3px}
.mtx b{display:block;font-size:19px;font-weight:600;letter-spacing:-.01em;color:inherit;transition:color .3s}
.mtx span{display:block;max-height:0;overflow:hidden;opacity:0;font-size:15px;color:var(--body);transition:max-height .45s,opacity .45s,margin .45s}
.mi2.on{color:var(--fg)}.mi2.on .mno{color:var(--acc)}.mi2.on .mtx span{max-height:120px;opacity:1;margin-top:6px}
.mstage{position:relative;min-height:380px;display:grid;place-items:center;padding:40px;overflow:hidden}
.mstage::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 40%,var(--hglow),transparent 70%);pointer-events:none}
.mpan{display:none;width:100%;max-width:440px;position:relative;animation:fadein .45s ease}.mpan.on{display:block}
.mv1{display:flex;flex-direction:column;gap:14px}
.mx,.my,.mv2>div,.apr,.cn,.cx{border:1px solid var(--line);border-radius:14px;background:var(--card);padding:18px 20px}
.mx s{display:block;font-size:22px;color:var(--mute);margin-top:4px}
.my b{display:block;font-size:44px;font-weight:600;letter-spacing:-.04em;margin-top:4px;color:var(--num)}.my b small{font-size:16px;letter-spacing:0;color:var(--mute);font-weight:500}
.mtr.big{height:10px;border-radius:5px;margin-top:14px}.mtr.big i{border-radius:5px}
.mv2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.mv2 b{display:block;font-size:48px;font-weight:600;letter-spacing:-.04em;line-height:1}.mv2 span{display:block;margin-top:12px;font-size:14px;color:var(--mute)}
.mv2 .nm{border-style:dashed;border-color:var(--line2)}
.mv3{display:flex;flex-direction:column;gap:14px}.apr{display:flex;gap:14px;align-items:center}.apr b{display:block;font-weight:600}.apr div span{font-size:14px;color:var(--mute)}
.apb{display:flex;gap:10px}.btn2{flex:1;text-align:center;border:1px solid var(--line2);border-radius:999px;padding:10px;font-weight:600;font-size:14px}.btn2.acc{background:var(--acc);border-color:var(--acc);color:#fff}
.mv3 .pipe{margin-top:6px}
.mv4{display:flex;flex-direction:column;gap:14px}.cn b,.cx b{display:block;font-size:18px;font-weight:600;margin-top:4px}.cx{border-style:dashed;border-color:var(--line2)}
@media (max-width:900px){.mth{grid-template-columns:1fr;gap:24px}.mstage{min-height:0;padding:24px}}


/* ===== v7: Profound learnings ===== */
body{position:relative}
.frame{position:absolute;inset:0;pointer-events:none;z-index:1}
.frame::before,.frame::after{content:"";position:absolute;top:0;bottom:0;border-left:1px dashed var(--line2);left:max(16px,calc(50% - 584px));opacity:.7}
.frame::after{left:auto;right:max(16px,calc(50% - 584px))}
.rails{display:none}
section+section::before,.strip::before{width:100%;background:var(--line)}
#product .persp,.card,.ask{position:relative;z-index:2}
.nav{position:sticky;z-index:70}
h1{font-weight:500;letter-spacing:-.045em}
h2{font-weight:500;letter-spacing:-.035em}
.hero::before{background:none}
.beam{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.beam::before{content:"";position:absolute;left:-10%;top:-30%;width:150%;height:180%;transform-origin:0 0;
 background:conic-gradient(from 118deg at 0% 0%,transparent 0deg,rgba(var(--beam),.07) 6deg,rgba(var(--beam),.18) 16deg,rgba(var(--beam),.23) 24deg,rgba(var(--beam),.13) 33deg,rgba(var(--beam),.04) 42deg,transparent 50deg);
 opacity:var(--beamA);filter:blur(34px);-webkit-mask-image:radial-gradient(130% 100% at 0% 0%,#000 30%,transparent 90%);mask-image:radial-gradient(130% 100% at 0% 0%,#000 30%,transparent 90%);
 animation:beam 16s ease-in-out infinite alternate}
.beam::after{content:"";position:absolute;left:-6%;top:-12%;width:38%;height:30%;background:radial-gradient(closest-side,rgba(var(--beam),.12),transparent);filter:blur(30px);opacity:var(--beamA)}
@keyframes beam{from{transform:rotate(-2.5deg)}to{transform:rotate(2.5deg)}}
.hero canvas{z-index:0}
/* colour as signal, not as fill: big fills are white in dark, blue in light */
.btn2.acc,.pipe .ap,.avt,.ins .plus,.lk i,.rk.me .rkb i{background:var(--af)!important;border-color:var(--af)!important;color:var(--aft)!important}
.st[aria-selected="true"] i{background:var(--af);border-color:var(--af);color:var(--aft);box-shadow:0 0 0 6px var(--pill)}
.asb.on{background:transparent}
@media (max-width:600px){.frame::before,.frame::after{opacity:.45}}


/* ===== v8 ===== */
.say{position:relative;padding-block:170px 150px;overflow:hidden}
.snet{position:absolute;inset:0;display:block;pointer-events:none;z-index:0}.say .wrap{position:relative;z-index:1}
@media (max-width:600px){.say{padding-block:120px 110px}}

/* ===== v9: the Seeqly iris (hero) — original: a lens ring slowly turning, the Trace node travelling on it ===== */
.beam{display:none}
.iris{position:absolute;left:50%;top:0;width:min(1180px,150vw);aspect-ratio:1;transform:translate(-50%,-44%);pointer-events:none;z-index:0}
.iris i{position:absolute;inset:0;border-radius:50%}
.iris .r1{background:conic-gradient(from 0deg,transparent 0deg,rgba(var(--star),.55) 60deg,transparent 140deg,transparent 200deg,rgba(var(--star),.25) 260deg,transparent 330deg);
 -webkit-mask:radial-gradient(closest-side,transparent calc(100% - 1.5px),#000 calc(100% - 1px),#000 100%,transparent 100%);mask:radial-gradient(closest-side,transparent calc(100% - 1.5px),#000 calc(100% - 1px),#000 100%,transparent 100%);animation:irs 40s linear infinite}
.iris .r1::after{content:"";position:absolute;inset:-40px;border-radius:50%;background:radial-gradient(closest-side,transparent 88%,rgba(var(--star),.06) 95%,transparent 100%)}
.iris .r2{inset:9%;border:1px solid rgba(var(--star),.07)}
.iris .r3{inset:0;animation:irs 28s linear infinite reverse}
.iris .r3 b{position:absolute;left:50%;bottom:-6px;width:12px;height:12px;margin-left:-6px;border-radius:50%;border:2px solid var(--acc);background:var(--bg);box-shadow:0 0 18px rgba(var(--acc-rgb),.6)}
@keyframes irs{to{transform:rotate(360deg)}}
.hero::before{background:radial-gradient(40% 34% at 50% 18%,rgba(var(--star),.06),transparent 70%)}
@media (max-width:700px){.iris{width:170vw;transform:translate(-50%,-47%)}}

.mi i{font-style:normal;font-weight:700;font-size:17px;border:0;color:var(--c);background:color-mix(in srgb,var(--c) 16%,transparent)}
/* blue: only your brand's data, the Trace ring and focus */
.eyebrow{color:var(--mute)}.eyebrow::before{background:var(--line2)}
.tr::after{background:currentColor}
.hint{color:var(--mute)}
.why{background:var(--pill)}.wl{color:var(--fg)}
.stt.ok{background:var(--pill);color:var(--fg)}.stt.ok .ico{color:var(--acc)}
.rn small,.rkb small{color:var(--body);border-color:var(--line2)}
.pg2{background:var(--fg)}.mi2.on .mno{color:var(--fg)}
.asb.on{border-color:var(--fg)}.asb em.ok{color:var(--body)}
.lk{border-color:var(--line2)}.srcl::before{background:var(--line2)}
.ins{border-color:var(--line2);background:var(--pill)}
.jic,.evk{background:var(--pill);color:var(--fg)}
.rec{border-left-color:var(--line2)}
.st.done i{border-color:var(--fg);color:var(--fg)}.steps::after{background:var(--fg)}
.flow li.done::before{background:var(--fg);border-color:var(--fg)}.flow li.done::after{background:var(--fg)}.flow li.cur::before{border-color:var(--fg);box-shadow:0 0 0 5px var(--pill)}
.net .wire.on{stroke:var(--fg)}.net .hub{stroke:var(--fg)}.net .src.on rect{stroke:var(--fg)}
:root[data-theme="light"] .btn-p{background:var(--fg);color:var(--bg)}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]) .btn-p{background:var(--fg);color:var(--bg)}}
/* red: a small supporting signal, never a filled block */
#ask.a2 .ar.me{background:var(--pill)}
.tag.bad{background:transparent;border:1px solid var(--line2);color:var(--body)}
.tag.bad::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--miss);flex:none}
.absent,.stt.no{background:var(--pill);color:var(--body)}.absent .ico,.stt.no .ico{color:var(--miss)}
.evi.gap .evk{background:var(--pill);color:var(--miss)}.evi.gap div span{color:var(--mute)}
.pcx b.miss{color:var(--fg)}


/* ===== v10: supporting palette — categories get their own colour; blue stays "you", red stays "missing" ===== */
:root{--c-review:#34C77B;--c-forum:#FF8A3D;--c-video:#F0609E;--c-news:#2DC6B8;--c-you:var(--acc);--c-shop:#F2B53A;--c-qa:#A48BFA;--c-amber:#F2B53A;--c-teal:#2DC6B8;--c-violet:#A48BFA;--c-pink:#F0609E}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]){--c-review:#16A05A;--c-forum:#E0691E;--c-video:#D6307D;--c-news:#0E9C90;--c-shop:#C98A0E;--c-qa:#7C5CE6;--c-amber:#C98A0E;--c-teal:#0E9C90;--c-violet:#7C5CE6;--c-pink:#D6307D}}
:root[data-theme="light"]{--c-review:#16A05A;--c-forum:#E0691E;--c-video:#D6307D;--c-news:#0E9C90;--c-shop:#C98A0E;--c-qa:#7C5CE6;--c-amber:#C98A0E;--c-teal:#0E9C90;--c-violet:#7C5CE6;--c-pink:#D6307D}
.why2{padding-block:128px}.why2::before{display:none}
.w2{display:grid;grid-template-columns:5fr 6fr;gap:56px;align-items:center}
.w2l h2{font-size:clamp(34px,4vw,52px)}
.w2f{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-direction:column;gap:18px}
.w2f li{display:flex;gap:14px;align-items:flex-start}.w2f li>span{font-size:15px;color:var(--body)}.w2f b{display:block;color:var(--fg);font-weight:600;font-size:16px}
.w2f i{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent)}
.w2r{padding:20px}
.w2h{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.w2v{position:relative;height:260px;margin-top:14px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--band)}
.w2v .snet{position:absolute;inset:0;width:100%;height:100%}
.w2leg{display:flex;flex-direction:column;gap:2px;margin-top:14px}
.lg{display:grid;grid-template-columns:26px 110px minmax(0,1fr) 44px;gap:12px;align-items:center;padding:6px 8px;border-radius:8px;font-size:14px;color:var(--body);transition:background .3s,color .3s}
.lg i{width:26px;height:26px;border-radius:7px;display:grid;place-items:center;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent)}.lg i .ico{width:15px;height:15px}
.lgb{height:6px;border-radius:3px;background:var(--pill);overflow:hidden}.lgb b{display:block;height:100%;border-radius:3px;background:var(--c);opacity:.85;transition:width 1s cubic-bezier(.16,1,.3,1) .3s}
.pre .lgb b{width:0!important}
.lg em{font-style:normal;text-align:right;color:var(--fg);font-weight:600}
.lg.on{background:var(--pill);color:var(--fg)}
@media (max-width:900px){.w2{grid-template-columns:1fr;gap:32px}.why2{padding-block:88px}}
@media (max-width:420px){.lg{grid-template-columns:26px 90px minmax(0,1fr) 40px;gap:8px}.w2v{height:220px}}
/* chart and rankings: competitors get distinct colours */
#lchart .s1{stroke:var(--c-amber);opacity:.9}#lchart .s2{stroke:var(--c-teal);opacity:.9}#lchart .s3{stroke:var(--c-violet);opacity:.9}
.lk1 i{background:var(--c-amber)!important;opacity:1!important}.lk2 i{background:var(--c-teal)!important;opacity:1!important}.lk3 i{background:var(--c-violet)!important;opacity:1!important}
.rk:nth-of-type(3) .rkb i{background:color-mix(in srgb,var(--c-amber) 20%,transparent);color:var(--c-amber)}
.rk:nth-of-type(4) .rkb i{background:color-mix(in srgb,var(--c-teal) 20%,transparent);color:var(--c-teal)}
.rk:nth-of-type(5) .rkb i{background:color-mix(in srgb,var(--c-violet) 20%,transparent);color:var(--c-violet)}
/* teams: each team has its colour */
.rpanel[data-r="0"] .jic{--c:var(--c-violet)}.rpanel[data-r="1"] .jic{--c:var(--c-teal)}.rpanel[data-r="2"] .jic{--c:var(--c-amber)}.rpanel[data-r="3"] .jic{--c:var(--c-pink)}
.jic{color:var(--c)!important;background:color-mix(in srgb,var(--c) 14%,transparent)!important}
/* evidence: source type chip */
.tyc{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-size:12px;font-weight:500;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent);border-radius:999px;padding:2px 9px}
/* integrations */
.net .src rect{stroke:var(--line2)}


/* ===== v11: navigation ===== */
.links{align-items:center;gap:4px}
.dd{position:relative}
.ddb,.lnk{display:inline-flex;align-items:center;gap:6px;background:none;border:0;color:var(--body);font:500 15px var(--f);padding:8px 12px;border-radius:8px;cursor:pointer;text-decoration:none}
.ddb:hover,.dd.open .ddb,.lnk:hover{color:var(--fg);background:var(--pill)}
.chev{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;transition:transform .25s}.dd.open .chev{transform:rotate(180deg)}
.mm{position:absolute;top:calc(100% + 10px);left:-12px;min-width:max-content;background:var(--card2);border:1px solid var(--line2);border-radius:16px;box-shadow:0 30px 80px -20px rgba(0,0,0,.55);padding:14px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s,transform .2s,visibility .2s;z-index:50}
.mm::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.dd.open .mm{opacity:1;visibility:visible;transform:none}
#mm-plat{left:-120px}
.mmg{display:grid;grid-template-columns:repeat(3,236px) 230px;gap:6px}.mmg.m2{grid-template-columns:repeat(2,260px)}.mmg.m1{grid-template-columns:300px}
.mmc{display:flex;flex-direction:column;gap:2px}
.mml{font-size:12px;color:var(--mute);padding:6px 10px 6px}
.mi3{display:flex;gap:12px;align-items:flex-start;padding:10px;border-radius:10px;text-decoration:none;color:var(--fg);transition:background .2s}
.mi3:hover,.mi3:focus-visible{background:var(--pill)}
.mi3 i{flex:none;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent)}.mi3 i .ico{width:16px;height:16px}
.mi3 b{display:block;font-size:14px;font-weight:600}.mi3 em{display:block;font-style:normal;font-size:12.5px;color:var(--mute);line-height:1.4;margin-top:2px;white-space:normal;max-width:180px}
.mmf{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:12px;background:var(--band);border:1px solid var(--line);text-decoration:none;color:var(--fg)}
.mmf:hover{border-color:var(--line2)}
.mmfv{position:relative;height:96px;border-radius:8px;border:1px solid var(--line);background:var(--card);margin-bottom:8px;overflow:hidden}
.mmfv i{position:absolute;left:10px;height:5px;border-radius:3px;background:var(--pill)}.mmfv i:nth-child(1){top:12px;width:40%}.mmfv i:nth-child(2){top:24px;width:26%}.mmfv i:nth-child(3){top:36px;width:34%}
.mmfv b{position:absolute;left:10px;right:10px;bottom:10px;height:38px;border-radius:6px;background:linear-gradient(180deg,transparent 40%,rgba(var(--acc-rgb),.18));border-bottom:2px solid var(--acc)}
.mmf>b{font-size:14px;font-weight:600}.mmf em{font-style:normal;font-size:12.5px;color:var(--mute);line-height:1.4}.mmfa{font-size:13px;color:var(--fg);margin-top:6px}
.mmb{display:flex;gap:18px;border-top:1px solid var(--line);margin-top:10px;padding:12px 10px 2px;font-size:13px}.mmb a{color:var(--body);text-decoration:none}.mmb a:hover{color:var(--fg)}
.mbtn{display:none;width:40px;height:40px;border-radius:10px;border:1px solid var(--line2);background:none;position:relative;cursor:pointer}
.mbtn i{position:absolute;left:11px;right:11px;height:1.5px;background:var(--fg);transition:transform .25s,top .25s}.mbtn i:first-child{top:15px}.mbtn i:last-child{top:23px}
.nav.open .mbtn i:first-child{top:19px;transform:rotate(45deg)}.nav.open .mbtn i:last-child{top:19px;transform:rotate(-45deg)}
.mlog{display:none}
@media (max-width:900px){
 .mbtn{display:inline-block}
 .nav.open{background:var(--bg);backdrop-filter:none}
 .nav.open .links{display:flex;position:absolute;left:0;right:0;top:100%;height:calc(100dvh - 72px);flex-direction:column;align-items:stretch;gap:0;padding:12px 16px 40px;background:var(--bg);overflow-y:auto;z-index:45}
 .nav.open .mlog{display:flex}
 .ddb,.lnk{width:100%;justify-content:space-between;font-size:18px;padding:16px 8px;border-bottom:1px solid var(--line);border-radius:0}
 .ddb:hover,.dd.open .ddb,.lnk:hover{background:none}
 .mm{position:static;opacity:1;visibility:visible;transform:none;display:none;box-shadow:none;border:0;background:none;backdrop-filter:none;padding:4px 0 12px;min-width:0}
 .mm::before{display:none}
 .dd.open .mm{display:block}
 .mmg,.mmg.m2,.mmg.m1{grid-template-columns:1fr}.mi3 em{max-width:none}.mmb{flex-wrap:wrap}}
@media (max-width:480px){.navr .btn{display:none}}

/* ===== Oct 2026 nav override: full-viewport bar =====
   Zip's own .nav .wrap caps at the 1120px content width (see line 78) on
   inner pages, but index.html carries this exact override inline (id
   "override-nav-width") to span the full viewport on the home page instead.
   Promoted here, unscoped, so every page — React route and static HTML
   alike — gets the identical, wider bar from this one file. */
.nav .wrap{max-width:none;padding-inline:32px}
@media (min-width:1600px){.nav .wrap{padding-inline:48px}}
.navr{gap:12px}
.navr .login{order:1;display:inline-flex;align-items:center;font:500 15px var(--f);color:var(--body);padding:8px 10px;border-radius:8px;text-decoration:none}
.navr .login:hover{color:var(--fg);background:var(--pill)}
.navr .btn.btn-p{order:2}
.navr .tt{order:3}
.navr .mbtn{order:4}
.nav .links{gap:4px}
.nav .ddb,.nav .lnk{font:500 17px var(--f);padding:10px 14px;gap:6px}
@media (max-width:900px){.nav .ddb,.nav .lnk{font-size:18px}}

/* ===== clickable dashboard ===== */
section{overflow-x:clip}
@media (max-width:900px){#product .side{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:10px 12px;border-right:0;border-bottom:1px solid var(--line)}
 #product .side .lab,#product .side .brand{display:none}
 #product .side .si{flex:none;width:auto;white-space:nowrap;border:1px solid var(--line);border-radius:999px;padding:7px 12px;font-size:13px}
 #product .side .si.on{background:var(--fg);color:var(--bg);border-color:var(--fg)}
 #product .ptabs{display:none}
 #product .win{grid-template-columns:minmax(0,1fr)}.ev{grid-template-columns:minmax(0,1fr)!important}.obs,.metric{min-width:0}}
.demo-hint{display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;color:var(--mute);margin:0 0 14px}.demo-hint .ico{width:14px;height:14px}
.side .si{display:block;width:100%;text-align:left;background:none;border:0;font:inherit;color:inherit;cursor:pointer}
.side .si:hover{color:var(--fg);background:var(--pill)}
.nx{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;margin-top:14px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--band);color:var(--fg);font:500 14px var(--f);text-align:left;cursor:pointer;transition:border-color .2s,transform .2s}
.nx b{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--af);color:var(--aft);font-weight:600;transition:transform .2s}
.nx:hover{border-color:var(--line2)}.nx:hover b{transform:translateX(3px)}
.ichips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}.ichips span{font-size:12px;padding:4px 10px;border-radius:999px;border:1px solid var(--line);color:var(--body)}.ichips span.on{background:var(--pill);color:var(--fg)}
.it{font-size:12px;font-weight:500;color:var(--c,var(--body))}.it-discovery{--c:var(--c-teal)}.it-comparison{--c:var(--c-amber)}.it-decision{--c:var(--c-violet)}
td b{font-weight:500}td .q{display:block;font-size:12px}
.opl{display:flex;flex-direction:column;gap:8px}
.op{display:grid;grid-template-columns:28px minmax(0,1fr) auto auto 20px;gap:12px;align-items:center;text-align:left;width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:none;color:var(--fg);font:inherit;cursor:pointer}
.op:hover{border-color:var(--line2)}.opn{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--pill);font-size:13px;font-weight:600}
.opt b{display:block;font-weight:600;font-size:14px}.opt span{font-size:12.5px;color:var(--mute)}.ops{font-size:12.5px;color:var(--body);white-space:nowrap}.opa{color:var(--mute)}
@media (max-width:640px){.op{grid-template-columns:28px minmax(0,1fr) 20px}.op .tag,.op .ops{display:none}}
.kpis.k3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:640px){.kpis.k3{grid-template-columns:1fr 1fr}}
.chk{max-width:620px;margin:22px auto 0;display:flex;flex-direction:column;gap:8px;align-items:stretch}
.chk .lab{text-align:center}
.chkr{display:flex;gap:8px;padding:6px;border:1px solid var(--line2);border-radius:999px;background:var(--card)}
.chkr input{flex:1;min-width:0;border:0;background:none;color:var(--fg);font:500 16px var(--f);padding:0 14px;outline:none}
.chkr input::placeholder{color:var(--mute)}.chkr:focus-within{border-color:var(--fg)}
.chkr .btn{height:44px}
@media (max-width:520px){.chkr{flex-direction:column;border-radius:16px}.chkr input{height:44px}.chkr .btn{width:100%}}
.close .chk{margin-top:24px}.close .chk .lab{display:none}
/* ===== sources: one answer, built citation by citation ===== */
.w2r{position:relative;padding:20px}
.w2lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:3}
.w2lines path{fill:none;stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:1;animation:w2d .7s cubic-bezier(.3,.6,.2,1) forwards}
.w2lines path.old{opacity:.28;transition:opacity .4s}
@keyframes w2d{to{stroke-dashoffset:0}}
.w2q{margin-top:14px;margin-left:auto;width:fit-content;max-width:90%;background:var(--pill);border-radius:14px 14px 4px 14px;padding:10px 14px}.w2q p{margin:2px 0 0;font-weight:500}
.w2ab{margin-top:10px;border:1px solid var(--line2);border-radius:14px 14px 14px 4px;padding:14px 16px}
.w2ab p{margin:0;font-size:17px;line-height:1.7;color:var(--body)}
.w2ab mark{background:none;color:inherit;padding:1px 2px;border-radius:4px;transition:background .4s,color .4s,box-shadow .4s}
.w2ab mark sup{font-size:10px;font-weight:600;margin-left:2px;color:var(--mute)}
.w2ab mark.on,.w2ab mark.done{color:var(--fg);box-shadow:inset 0 -2px 0 var(--c)}.w2ab mark.on{background:color-mix(in srgb,var(--c) 16%,transparent)}
.w2ab mark.on sup,.w2ab mark.done sup{color:var(--c)}
.w2src{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:44px}
.w2s{position:relative;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--card);min-width:0;transition:border-color .4s,transform .4s,box-shadow .4s}
.w2s .tyc{margin:0 0 6px}.w2s b{display:block;font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.w2s .q{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.w2n{position:absolute;top:10px;right:10px;font-size:11px;color:var(--mute)}
.w2s.on{border-color:var(--c);transform:translateY(-3px);box-shadow:0 12px 30px -16px var(--c)}.w2s.done{border-color:color-mix(in srgb,var(--c) 45%,var(--line))}
.w2mix{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.w2bar{display:flex;gap:3px;height:10px;margin-top:10px;border-radius:5px;overflow:hidden}.w2bar i{background:var(--c);opacity:.9}
.w2key{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px;font-size:12.5px;color:var(--body)}.w2key span{display:inline-flex;align-items:center;gap:6px}.w2key i{width:8px;height:8px;border-radius:2px;background:var(--c)}.w2key b{color:var(--fg);font-weight:600}
.w2go{margin-top:26px;max-width:380px}
@media (max-width:560px){.w2src{grid-template-columns:1fr;gap:8px;margin-top:28px}.w2ab p{font-size:15.5px}.w2s{display:grid;grid-template-columns:auto 1fr;gap:0 10px;align-items:center}.w2s .tyc{grid-row:1/3;margin:0}.w2n{display:none}}


/* ===== v12: site footer ===== */
.sf{border-top:1px solid var(--line);padding:72px 0 0;position:relative;z-index:2;background:var(--bg)}
.sf>.wrap:first-child{display:grid;grid-template-columns:1.3fr repeat(5,1fr);gap:28px}
.sfb p{font-size:14px;color:var(--mute);margin:14px 0 18px;max-width:260px;line-height:1.55}.sfb .btn{height:40px;font-size:14px;padding:0 16px}
.sfc{display:flex;flex-direction:column;gap:10px;font-size:14px}.sfc b{font-weight:600;color:var(--fg);margin-bottom:4px}.sfc a{color:var(--body);text-decoration:none}.sfc a:hover{color:var(--fg)}
.sfl{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:56px;padding-top:22px;padding-bottom:40px;font-size:13px;color:var(--mute)}
.sfr{display:flex;gap:20px;flex-wrap:wrap}.sfr a{color:var(--mute);text-decoration:none}.sfr a:hover{color:var(--fg)}
@media (max-width:1000px){.sf>.wrap:first-child{grid-template-columns:1fr 1fr 1fr}.sfb{grid-column:1/-1}}
@media (max-width:560px){.sf>.wrap:first-child{grid-template-columns:1fr 1fr;gap:28px 20px}}
.faq a{color:var(--fg)}


.tourb{display:inline-flex;align-items:center;gap:6px;background:none;border:0;color:var(--fg);font:500 13px var(--f);cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line2)}
.tourb .ico{width:14px;height:14px}
.tourd{border:0;padding:0;background:transparent;max-width:min(1100px,94vw);width:100%}
.tourd::backdrop{background:rgba(0,0,0,.78);backdrop-filter:blur(6px)}
.tourw{position:relative;background:var(--card2);border:1px solid var(--line2);border-radius:16px;padding:12px;box-shadow:0 40px 120px -30px rgba(0,0,0,.8)}
.tourw video{display:block;width:100%;height:auto;border-radius:10px;background:#000}
.tourw p{margin:10px 4px 2px;color:var(--mute)}
.tourx{position:absolute;top:-14px;right:-14px;width:36px;height:36px;border-radius:50%;border:1px solid var(--line2);background:var(--card2);color:var(--fg);display:grid;place-items:center;cursor:pointer;z-index:2}.tourx .ico{width:16px;height:16px}


/* v12 gap colour: amber for 'missing', red only for things that are wrong */
.tag.gap{border:0;background:color-mix(in srgb,var(--c-amber) 15%,transparent);color:var(--c-amber)}
.tag.gap::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--c-amber);flex:none}
.gapt{color:var(--c-amber);font-weight:500}
.absent,.stt.no{background:color-mix(in srgb,var(--c-amber) 14%,transparent)!important;color:var(--c-amber)!important}
.asb em.no{color:var(--c-amber)}
.evi.gap .evk{background:color-mix(in srgb,var(--c-amber) 16%,transparent)!important;color:var(--c-amber)}.evi.gap div span{color:var(--c-amber)!important}
.ar.me .pos{border:1.5px dashed var(--line2)!important;color:var(--mute)!important;font-size:18px;font-weight:500}
#ask.a2 .ar.me{background:color-mix(in srgb,var(--c-amber) 9%,transparent)!important}
#ask.a2 .ar.me .pos{border-color:var(--c-amber)!important;color:var(--c-amber)!important}
#ask.a2 .ar.me em{color:var(--c-amber)!important}
/* v12 engine logo tiles */
.mi .elg{position:relative;width:36px;height:36px;border-radius:10px;border:0;background:var(--b);display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.mi .elg b{font-size:16px;font-weight:700;color:#fff;letter-spacing:0}
.mi .elg img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:6px;background:#fff;border-radius:10px}
.mi{color:var(--fg)}
/* v12 live demo framing */
.demo-hint{display:none}
.livebar{display:flex;align-items:center;justify-content:center;gap:12px;margin:0 0 16px;flex-wrap:wrap}
.lv{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--acc);background:var(--accbg);border:1px solid rgba(var(--acc-rgb),.35);border-radius:999px;padding:5px 12px}
.lv i{width:8px;height:8px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 0 rgba(var(--acc-rgb),.6);animation:lvp 2s infinite}
@keyframes lvp{70%{box-shadow:0 0 0 8px rgba(var(--acc-rgb),0)}100%{box-shadow:0 0 0 0 rgba(var(--acc-rgb),0)}}
.lvt{font-size:13.5px;color:var(--body)}
#product .win{box-shadow:0 0 0 1px rgba(var(--acc-rgb),.28),0 40px 140px -50px rgba(var(--acc-rgb),.45),var(--lift)}
@media (prefers-reduced-motion: reduce){.lv i{animation:none}}
/* v12 products pane as rows */
.plist{padding:6px 16px}
.prow{display:grid;grid-template-columns:40px minmax(0,1.5fr) minmax(0,1fr) minmax(0,1.1fr);gap:16px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}
.prow.ph2{border-top:0;padding:8px 0 4px}.prow.ph2 .lab{font-size:12px}
.pth{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;font-weight:600;background:linear-gradient(160deg,color-mix(in srgb,var(--c-amber) 30%,var(--card2)),var(--card2));color:var(--fg);border:1px solid var(--line)}
.pnm{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}.pnm b{font-size:15px;font-weight:600}
.pap span{font-size:13px;color:var(--mute)}.pap span b{color:var(--fg);font-size:15px}.pap .mtr{margin-top:6px}
.ppr{display:flex;flex-direction:column;gap:2px}.prx{display:flex;align-items:baseline;gap:8px}.prx s{color:var(--mute);font-size:14px}.prx b{font-size:18px;font-weight:600}
.ppr em{font-style:normal;font-size:12.5px;color:var(--mute)}.ppr em.pwr{color:var(--miss)}
@media (max-width:760px){.prow{grid-template-columns:40px minmax(0,1fr);gap:8px 12px}.prow.ph2{display:none}.pap,.ppr{grid-column:2}}
/* v12 integrations console */
.icon{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:0;align-items:stretch;margin-top:8px}
.ilist{display:flex;flex-direction:column;gap:8px;position:relative;z-index:1}
.isrc{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr);gap:14px;align-items:center;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 14px;color:var(--fg);font:inherit;cursor:pointer;overflow:hidden;transition:border-color .3s,background .3s,transform .3s}
.isrc:hover{border-color:var(--line2)}
.isrc.on{border-color:var(--c);background:color-mix(in srgb,var(--c) 7%,var(--card));transform:translateX(6px)}
.iic{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;color:var(--c);background:color-mix(in srgb,var(--c) 15%,transparent)}.iic .ico{width:20px;height:20px}
.itx{display:flex;flex-direction:column;min-width:0}.itx b{font-weight:600;font-size:15.5px}.itx em{font-style:normal;font-size:13px;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.isrc.on .itx em{color:var(--body)}
.ipg{position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--c);transform:scaleX(0);transform-origin:left}
.isrc.run .ipg{animation:prog 4.2s linear both}
.ihub{position:relative;display:flex;align-items:center;padding-left:56px}
.iwire{position:absolute;left:0;top:0;bottom:0;width:56px}
.iwire i{position:absolute;left:0;right:0;top:50%;height:2px;background:linear-gradient(90deg,transparent,var(--line2))}
.iwire i::after{content:"";position:absolute;right:-5px;top:-4px;width:10px;height:10px;border-radius:50%;border:2px solid var(--acc);background:var(--bg)}
.icard{width:100%;padding:28px;min-height:380px;position:relative;display:flex}
.ipane{display:none;animation:fadein .4s ease;width:100%}.ipane.on{display:flex;flex-direction:column;gap:14px}
.iph{display:flex;align-items:center;gap:12px}.iph .iic{width:34px;height:34px}.iph .iic .ico{width:17px;height:17px}
.iq{font-size:clamp(22px,2.4vw,30px);font-weight:600;letter-spacing:-.025em;line-height:1.2;margin:4px 0 6px}
.ivw{display:flex;flex-direction:column;gap:10px}
.iv2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.iv2 div{border:1px solid var(--line);border-radius:12px;padding:12px 14px}.iv2 span{display:block;font-size:12.5px;color:var(--mute)}.iv2 b{display:block;font-size:26px;font-weight:600;letter-spacing:-.02em;margin:4px 0 2px}.iv2 em{font-style:normal;font-size:12.5px;color:var(--body)}
.ivb{display:grid;grid-template-columns:90px minmax(0,1fr) 40px;gap:10px;align-items:center;font-size:13px;color:var(--body)}.ivb i{height:6px;border-radius:3px;background:linear-gradient(90deg,var(--c) var(--w),var(--pill) var(--w))}.ivb b{text-align:right;font-weight:600;color:var(--fg)}
.ivl{border:1px solid var(--line);border-radius:12px}.ivl div{display:flex;justify-content:space-between;gap:12px;padding:11px 14px;border-top:1px solid var(--line);font-size:14px}.ivl div:first-child{border-top:0}.ivl span{color:var(--fg);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ivl em{font-style:normal;color:var(--mute);white-space:nowrap}.ivl em.ok{color:var(--acc)}
.ivn{font-size:13px;color:var(--mute);margin:0}
.ilk{margin-top:auto;align-self:flex-start;font-size:14px;font-weight:600;color:var(--fg);text-decoration:none;border-bottom:1px solid var(--line2);padding-bottom:2px}.ilk:hover{border-color:var(--fg)}
@media (max-width:900px){.icon{grid-template-columns:1fr;gap:16px}.ilist{flex-direction:row;overflow-x:auto;scrollbar-width:none;margin-inline:-24px;padding-inline:24px}.isrc{flex:none;grid-template-columns:32px auto;padding:10px 12px}.isrc .iic{width:32px;height:32px}.itx em{display:none}.isrc.on{transform:none}.ihub{padding-left:0}.iwire{display:none}.icard{padding:20px;min-height:0}}
@media (max-width:600px){.ivl div{flex-direction:column;gap:2px}.ivl span{white-space:normal}}



/* v14 app view */
#product .ptabs{display:grid!important}
#product .persp{display:block}
#product .win{grid-template-columns:232px minmax(0,1fr)}
#product .win .side{display:flex!important;flex-direction:column;gap:2px;padding:14px 12px;background:color-mix(in srgb,var(--band) 60%,transparent)}
.ws{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}.ws .lab{margin:0 4px!important;font-size:11.5px}
.wsb{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:10px;padding:4px 8px 4px 4px;background:var(--card)}
.wsb .brand{display:flex!important;border:0;padding:4px 6px;flex:1}.wsb .brand i{background:linear-gradient(135deg,var(--c-amber),var(--c-pink));color:#fff;border-radius:6px}
.wsb .chev{width:16px;height:16px;color:var(--mute)}
#product .side>.lab{display:block;margin:14px 8px 4px!important;font-size:11.5px}
#product .si{display:flex!important;align-items:center;gap:10px;padding:7px 10px!important;border-radius:8px;border:0!important;font-size:13.5px;color:var(--body);width:100%}
#product .si .ico{width:15px;height:15px;color:var(--mute);flex:none}
#product .si:hover{background:var(--pill);color:var(--fg)}
#product .si.on{background:var(--card)!important;color:var(--fg)!important;box-shadow:inset 0 0 0 1px var(--line2)}
#product .si.on .ico{color:var(--acc)}
.sfoot{margin-top:auto;padding-top:14px;display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);font-size:12.5px}
.sav{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--pill);font-size:11px;font-weight:600;color:var(--fg)}
.sfoot b{display:block;font-weight:600;color:var(--fg);font-size:12.5px}.sfoot em{font-style:normal;color:var(--mute)}
#product .pt .ico{width:17px;height:17px}
@media (max-width:900px){#product .win{grid-template-columns:196px minmax(0,1fr)}#product .win .side{padding:12px 8px}#product .si{font-size:13px;padding:7px 8px!important}.sfoot{display:none}}
@media (max-width:640px){#product .win{grid-template-columns:52px minmax(0,1fr)}
 #product .win .side{display:flex!important;flex-direction:column;align-items:center;padding:10px 6px;gap:4px;border-right:1px solid var(--line);border-bottom:0;overflow:visible}
 .ws,.sfoot,#product .side>.lab{display:none!important}
 #product .si{width:40px!important;height:40px;justify-content:center;padding:0!important;font-size:0!important;gap:0;flex:none}
 #product .si .ico{width:17px;height:17px}
 #product .main{padding:14px 12px}}


/* v15 */
@media (min-width:901px){.dd:not(.open) .mm{display:none}.dd.open .mm{animation:mmin .2s ease}}
@keyframes mmin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.mmall{display:inline-flex;margin:8px 10px 2px;font-size:13.5px;font-weight:600;color:var(--acc);text-decoration:none}.mmall:hover{text-decoration:underline}
.soc{display:flex;flex-wrap:wrap;gap:8px}.soc a{font-size:13px;color:var(--body);text-decoration:none;border:1px solid var(--line2);border-radius:999px;padding:4px 12px}.soc a:hover{color:var(--fg);border-color:var(--fg)}
.sfl{flex-wrap:wrap;gap:14px 24px;align-items:center}



/* v17 phone demo: named segments on top, labelled rail on the side */
.sshort{display:none}
@media (max-width:640px){
 #product .ptabs{display:flex!important;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:6px;margin:0 -24px 14px;padding:0 24px 2px;border:0}
 #product .ptabs::-webkit-scrollbar{display:none}
 #product .pt{flex:none;white-space:nowrap;border:1px solid var(--line2)!important;border-radius:999px!important;padding:9px 14px!important;font-size:13.5px!important;gap:7px}
 #product .pt[aria-selected="true"]{background:var(--fg)!important;color:var(--bg)!important;border-color:var(--fg)!important}
 #product .pt .pg2{display:none}
 #product .win{grid-template-columns:68px minmax(0,1fr)}
 #product .win .side{padding:8px 4px;gap:2px}
 #product .si{width:60px!important;height:auto;flex-direction:column;justify-content:center;gap:3px!important;padding:7px 2px!important;font-size:10.5px!important;line-height:1.15;text-align:center}
 #product .si .sfull{display:none}#product .si .sshort{display:block;font-size:10.5px;font-weight:500;letter-spacing:-.01em}
 #product .si .ico{width:17px;height:17px}
 #product .si.on{box-shadow:inset 0 0 0 1px var(--line2)}
}


/* v18 imagery (x.ai bento + cursor art panels) */
.people{padding-block:110px 30px}
.bgrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}
.bt{position:relative;display:flex;flex-direction:column;border-radius:16px;overflow:hidden;background:var(--card);border:1px solid var(--line);text-decoration:none;color:var(--fg);min-height:330px}
.bui{grid-column:span 4}.bshop{grid-column:span 7;min-height:420px}.bteam{grid-column:span 5;min-height:420px}
.bm{flex:1;padding:26px 24px 70px;display:flex;align-items:flex-start}
.bw{width:100%;display:flex;flex-direction:column;gap:10px;font-size:13px;color:var(--body)}
.bwh{font-weight:600;color:var(--fg);font-size:13.5px;margin-bottom:2px}.bwh em{font-style:normal;font-weight:400;color:var(--mute);margin-left:6px}
.erow{display:grid;grid-template-columns:92px 1fr 36px;align-items:center;gap:10px}.erow b{font-weight:600;color:var(--fg);text-align:right}
.ebar{display:block;height:6px;border-radius:99px;background:var(--pill);overflow:hidden}.ebar i{display:block;height:100%;border-radius:99px;background:var(--acc)}
.fxrow{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.fxrow b{display:block;font-weight:500;color:var(--fg);line-height:1.35}.fxrow em{font-style:normal;color:var(--mute);font-size:12px}
.fxp{flex:none;font-size:10.5px;font-weight:600;border-radius:99px;padding:2px 8px;margin-top:1px}
.fxp.hi{background:color-mix(in srgb,var(--c-amber) 18%,transparent);color:color-mix(in srgb,var(--c-amber) 75%,var(--fg))}.fxp.md{background:var(--pill);color:var(--body)}
.srow{display:grid;grid-template-columns:26px 1fr auto;gap:10px;align-items:center}.srow b{display:block;font-weight:500;color:var(--fg);margin-bottom:5px}.srow em{font-style:normal;color:var(--mute);font-size:12px}
.sfav{display:grid;place-items:center;width:26px;height:26px;border-radius:7px;background:var(--pill);font-size:12px;font-weight:600;color:var(--fg)}
.bui::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(180deg,transparent,var(--card) 62%);pointer-events:none}
.bf{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:18px 22px;font-size:16px;font-weight:500}
.bx{font-size:15px;color:var(--mute);transition:color .2s,transform .2s}.bt:hover .bx{color:var(--fg);transform:translateX(2px)}
.bf.dk{color:#fff;background:linear-gradient(180deg,transparent,rgba(0,0,0,.5));padding-top:48px}.bf.dk .bx{color:rgba(255,255,255,.8)}.bt:hover .bf.dk .bx{color:#fff}
.bph{position:absolute;inset:0;background:#2a2622}
.bph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.bt:hover .bph img{transform:scale(1.03)}
.bshop .bph img.big{width:66%;object-position:28% 18%}
.bshop .bph img.inset{left:auto;right:6px;top:auto;bottom:6px;width:calc(34% - 12px);height:74%;border-radius:10px;object-position:50% 45%}
.bshop .bph::before{content:"";position:absolute;right:0;top:0;bottom:0;width:34%;background:var(--card)}
.bshop:hover .bph img.inset{transform:none}
/* cursor-style painting panel behind the live demo */
#product .persp{background:#b9ab9c url(images/art-watercolor.webp) 50% 60%/cover;border-radius:18px;padding:36px 56px 56px}
#product .livebar{width:max-content;max-width:100%;margin:0 auto 22px;padding:7px 16px;border-radius:999px;background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
#product .livebar .lvt{color:#2b2b2b}#product .livebar .lv{color:#111}
#product .persp .win{box-shadow:0 30px 70px rgba(20,16,10,.35)}
/* cursor-style team card */
.teamcard{padding-block:40px 20px}
.tcard{display:grid;grid-template-columns:4fr 8fr;gap:12px;padding:12px;border:1px solid var(--line);border-radius:18px;background:var(--card)}
.tctext{padding:28px 24px;display:flex;flex-direction:column;justify-content:center;gap:4px}
.tctext p{margin:0;font-size:clamp(19px,1.8vw,24px);line-height:1.4;color:var(--fg);letter-spacing:-.015em;max-width:22ch}
.plink{margin-top:12px;font-size:15px;font-weight:500;color:var(--acc);text-decoration:none;align-self:flex-start}.plink:hover{text-decoration:underline;text-underline-offset:4px}
.tcimg{position:relative;min-height:460px;border-radius:10px;overflow:hidden;background:#3a3a30}
.tcimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:1000px){.bui{grid-column:span 6}.bui:nth-child(3){grid-column:span 12}.bshop,.bteam{grid-column:span 6}}
@media (max-width:900px){#product .persp{padding:24px 20px 28px}}
@media (max-width:760px){.tcard{grid-template-columns:1fr}.tcimg{min-height:280px}.tctext{padding:16px 12px 8px}}
@media (max-width:640px){.bui,.bui:nth-child(3),.bshop,.bteam{grid-column:span 12}.bt{min-height:300px}.bshop,.bteam{min-height:340px}
 #product .persp{padding:12px 6px 8px;border-radius:14px}#product .livebar{margin-bottom:10px;padding:8px 12px;border-radius:12px;font-size:12.5px;text-align:center}
 #product .kpi{padding:12px}#product .kpi .v{font-size:24px}
 .bshop .bph img.big{width:100%}.bshop .bph::before{display:none}.bshop .bph img.inset{width:38%;height:62%;right:10px;bottom:10px;border:3px solid rgba(255,255,255,.85)}}


/* v19 sources: painting panel + calm animated source list */
.w2art{border-radius:18px;padding:40px 36px;background:#8d9577 url(images/art-river.webp) 50% 40%/cover}
.w2art>.w2r{box-shadow:0 26px 60px rgba(20,16,10,.3)}
.w2mix{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.w2mh{display:flex;justify-content:space-between;gap:12px;margin-bottom:12px}
.w2rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px}
.w2row{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:4px 10px;font-size:13.5px;color:var(--body)}
.w2row b{font-weight:600;color:var(--fg);font-size:13.5px}
.w2row i{grid-column:1/-1;display:block;height:4px;border-radius:99px;background:var(--pill);overflow:hidden}
.w2row u{display:block;height:100%;width:calc(var(--v) * 100% / 34);border-radius:99px;background:color-mix(in srgb,var(--fg) 55%,transparent);transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.2,.7,.2,1) calc(var(--i) * 110ms + .35s)}
.w2row.me{color:var(--fg)}.w2row.me u{background:var(--acc)}.w2row.me b{color:var(--acc)}
.w2row .you{font-style:normal;font-size:10.5px;font-weight:600;color:var(--acc);border:1px solid color-mix(in srgb,var(--acc) 40%,transparent);border-radius:99px;padding:0 6px;margin-left:6px;vertical-align:1px}
.w2art.in .w2row u{transform:scaleX(1)}
@media (prefers-reduced-motion: reduce){.w2row u{transform:none;transition:none}}
@media (max-width:900px){.w2art{padding:20px 12px}}
@media (max-width:480px){.w2rows{grid-template-columns:1fr}}


/* v20 */
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--fg);color:var(--bg);padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:600}.skip:focus{top:12px}
.tt{width:34px;padding:0!important;display:inline-grid;place-items:center}.tt .ico{width:16px;height:16px}
@media (max-width:1100px){.sf>.wrap:first-child{grid-template-columns:repeat(3,1fr)}.sfb{grid-column:1/-1}}
@media (max-width:560px){.sf>.wrap:first-child{grid-template-columns:1fr 1fr}}

@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}

/* ===== sub-pages ===== */
.ph{position:relative;overflow:hidden;padding:120px 0 72px}
.ph .iris{top:0;transform:translate(-50%,-76%);opacity:.7}
.ph .wrap{position:relative;z-index:2}
.ph h1{font-size:clamp(44px,6.4vw,84px);line-height:1;margin-top:18px;max-width:14ch}
.ph .lead{margin-top:22px;max-width:620px}
.ph.c{text-align:center}.ph.c h1,.ph.c .lead{margin-inline:auto}.ph.c .ctas{justify-content:center}
.ph .ctas{margin-top:30px;justify-content:flex-start}
.sec{padding-block:96px;position:relative}
.sec.band{background:var(--tint)}
.sh{max-width:720px;margin-bottom:40px}.sh h2{font-size:clamp(32px,4vw,52px)}.sh .lead{margin-top:14px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:900px){.grid3,.grid2{grid-template-columns:1fr}.sec{padding-block:72px}.ph{padding:88px 0 48px}}
.fc{padding:24px;display:flex;flex-direction:column;gap:10px}
.fc .fi{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent)}.fc .fi .ico{width:20px;height:20px}
.fc h3{font-size:19px;margin-top:6px}.fc p{font-size:15px;color:var(--body);margin:0}
.ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:15px;color:var(--body)}
.ul li{display:flex;gap:10px;align-items:flex-start}.ul li .ico{width:17px;height:17px;flex:none;margin-top:3px;color:var(--fg)}
.cta-band{text-align:center;padding-block:120px}.cta-band h2{font-size:clamp(36px,5vw,64px)}.cta-band .lead{margin:16px auto 0;max-width:560px}.cta-band .ctas{justify-content:center;margin-top:28px}
.faq2{display:grid;grid-template-columns:4fr 7fr;gap:48px}
.faq2 details{border-bottom:1px solid var(--line);padding:18px 0}.faq2 summary{cursor:pointer;font-size:17px;font-weight:500;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq2 summary::after{content:"+";color:var(--mute);font-size:22px;line-height:1}.faq2 details[open] summary::after{content:"−"}
.faq2 details p{margin:10px 0 0;color:var(--body);font-size:15.5px;line-height:1.6;max-width:640px}
@media (max-width:900px){.faq2{grid-template-columns:1fr;gap:16px}}
a.card{text-decoration:none;color:inherit;transition:border-color .25s,transform .25s}a.card:hover{border-color:var(--line2);transform:translateY(-2px)}
.more{display:inline-flex;align-items:center;gap:8px;font-weight:500;font-size:14px;color:var(--fg);margin-top:auto;padding-top:8px}.more .ico{width:16px;height:16px;transition:transform .2s}a:hover .more .ico{transform:translateX(3px)}

/* ===== articles ===== */
.rbar{position:fixed;left:0;top:0;height:2px;width:100%;background:var(--acc);transform-origin:0 0;transform:scaleX(0);z-index:90}
.ah{padding:72px 0 40px}.ah h1{font-size:clamp(36px,4.8vw,60px);line-height:1.05;margin-top:16px;max-width:22ch}.ah .lead{margin-top:18px;max-width:720px}
.am{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:24px;font-size:14px;color:var(--mute)}.am .avt{width:32px;height:32px;font-size:12px}.am b{color:var(--fg);font-weight:600}
.artb{display:grid;grid-template-columns:220px minmax(0,720px);gap:64px;justify-content:center;padding-bottom:80px;border-top:1px solid var(--line);padding-top:48px}
.toc{position:sticky;top:96px;align-self:start;display:flex;flex-direction:column;gap:18px}
.toc nav{display:flex;flex-direction:column;gap:2px;border-left:1px solid var(--line)}
.toc nav a{font-size:13.5px;color:var(--mute);text-decoration:none;padding:6px 0 6px 14px;margin-left:-1px;border-left:1px solid transparent;line-height:1.35}
.toc nav a:hover{color:var(--fg)}.toc nav a.on{color:var(--fg);border-left-color:var(--fg)}
.tocc{padding:16px}.tocc b{display:block;font-size:14px}.tocc p{font-size:13px;color:var(--mute);margin:6px 0 12px}.tocc .btn{height:38px;font-size:13.5px;padding:0 14px}
@media (max-width:980px){.artb{grid-template-columns:minmax(0,1fr);gap:0}.toc{display:none}}
.prose{font-size:17.5px;line-height:1.75;color:var(--body);min-width:0}
.prose>*:first-child{margin-top:0}
.prose h2{font-size:clamp(24px,2.4vw,30px);color:var(--fg);margin:56px 0 14px;letter-spacing:-.02em;line-height:1.2;scroll-margin-top:96px}
.prose h3{font-size:20px;color:var(--fg);margin:36px 0 8px;letter-spacing:-.01em;scroll-margin-top:96px}
.prose p{margin:0 0 18px}.prose strong{color:var(--fg);font-weight:600}
.prose a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:3px}.prose a:hover{text-decoration-color:var(--fg)}
.prose ul,.prose ol{margin:0 0 20px;padding-left:22px}.prose li{margin:6px 0}.prose li::marker{color:var(--mute)}
.prose blockquote{margin:24px 0;padding:6px 0 6px 20px;border-left:2px solid var(--fg);color:var(--fg);font-size:19px}
.prose em{color:var(--mute)}
.prose img{max-width:100%;height:auto;border-radius:12px;border:1px solid var(--line);margin:8px 0}
.prose code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.88em;background:var(--pill);border-radius:6px;padding:2px 6px;color:var(--fg)}
.prose pre{background:var(--band);border:1px solid var(--line);border-radius:12px;padding:16px;overflow:auto;font-size:14px}.prose pre code{background:none;padding:0}
.tw{overflow-x:auto;margin:24px 0;border:1px solid var(--line);border-radius:14px;background:var(--card)}
.prose table{width:100%;border-collapse:collapse;font-size:15px;min-width:560px}
.prose th{text-align:left;font-weight:600;color:var(--fg);background:var(--card2);padding:12px 14px;border-bottom:1px solid var(--line)}
.prose td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}.prose tr:last-child td{border-bottom:0}
.prose hr{border:0;border-top:1px solid var(--line);margin:40px 0}
.rel{padding:72px 0;border-top:1px solid var(--line)}.rel h2{font-size:clamp(26px,3vw,36px);margin-bottom:24px}
.pn2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.pn2 a{padding:18px}.pn2 .lab{display:block;margin-bottom:6px}.pn2 b{font-size:16px}.pn2 a:last-child{text-align:right}
@media (max-width:640px){.pn2{grid-template-columns:1fr}.pn2 a:last-child{text-align:left}}
.li{padding:18px;display:flex;flex-direction:column;gap:10px;min-height:150px}.li .tyc{align-self:flex-start;margin:0}.li b{font-size:16px;font-weight:600;line-height:1.35}.lim{font-size:12.5px;color:var(--mute)}
.lgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:980px){.lgrid{grid-template-columns:1fr 1fr}}@media (max-width:600px){.lgrid{grid-template-columns:1fr}.li{min-height:0}}
.lnk[aria-current="page"],.lnk.cur{color:var(--fg)}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--fg);color:var(--bg);padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:600}.skip:focus{top:12px}
.tt{width:34px;padding:0!important;display:inline-grid;place-items:center}.tt .ico{width:16px;height:16px}
.ferr{margin:10px 0 0;font-size:14px;color:var(--c-amber)}.ferr a{color:var(--fg)}
[aria-invalid="true"]{border-color:var(--c-amber)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--c-amber) 20%,transparent)!important}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}


/* ===== v11: one hero system across the site (matches the homepage) + icons only where they do a job ===== */
:root{--paintA:.15;--paintBlend:luminosity}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]){--paintA:.26;--paintBlend:multiply}}
:root[data-theme="light"]{--paintA:.26;--paintBlend:multiply}

/* Heroes: no spinning rings. Left-aligned type, one quiet painting behind, at most one image beside the copy. */
.ph .iris{display:none!important}
.ph{isolation:isolate;padding:104px 0 72px}
.ph::before{content:"";position:absolute;top:0;right:0;width:min(980px,92vw);height:100%;z-index:0;pointer-events:none;
 background:url(images/art-mist.webp) 60% 35%/cover no-repeat;opacity:var(--paintA);mix-blend-mode:var(--paintBlend);filter:saturate(.55);
 -webkit-mask-image:radial-gradient(62% 72% at 72% 30%,#000 15%,transparent 76%);mask-image:radial-gradient(62% 72% at 72% 30%,#000 15%,transparent 76%)}
.ph.tph::before{opacity:calc(var(--paintA)*.7)}
.ph.e404::before,.ph.ty::before{display:none}
.ph h1{font-size:clamp(42px,5.4vw,76px);line-height:1;letter-spacing:-.045em}
.ph.tph h1{font-size:clamp(38px,4.6vw,60px)}
.ph .lead{max-width:560px}
.phx{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.phx>div{min-width:0}
.phx-m{margin:0;position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--line2);background:var(--card2);box-shadow:var(--lift);aspect-ratio:4/3;max-width:100%}
.phx-m img{display:block;width:100%;height:100%;object-fit:cover}
.phx-m.ui img{object-fit:cover;object-position:0 0}
.phx-m .tl{display:none}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]) .phx-m .tl{display:block}:root:not([data-theme="dark"]) .phx-m .td{display:none}}
:root[data-theme="light"] .phx-m .tl{display:block}:root[data-theme="light"] .phx-m .td{display:none}
.phx-m figcaption{position:absolute;left:12px;bottom:12px;font-size:12px;font-weight:500;color:var(--fg);background:color-mix(in srgb,var(--card) 82%,transparent);border:1px solid var(--line2);border-radius:999px;padding:3px 10px;backdrop-filter:blur(6px)}
@media (max-width:960px){.phx{grid-template-columns:minmax(0,1fr);gap:40px}.phx-m{aspect-ratio:16/10}}
@media (max-width:900px){.ph{padding:80px 0 48px}}

/* Icons: keep them on controls, arrows, status marks and inside product screens. Drop them where they only decorate a heading or list. */
.fc .fi,.fmt .fi,.crw .fi,.card>.fi,.fi2,.fic,.aqi,.jic,.iic,.mi3>i,.dft .fi,.rct .fic{display:none!important}
.isrc{grid-template-columns:minmax(0,1fr)!important}
.ftxt h3{margin-top:0}
.ul li .ico,.fl li .ico,.plk li .ico{display:none}
.ul li,.fl li,.plk li{position:relative;padding-left:20px}
.ul li::before,.fl li::before,.plk li::before{content:"";position:absolute;left:0;top:.78em;width:10px;height:1.5px;background:var(--mute)}

/* ===== v12: live signal field replaces the hero paintings ===== */
.sfield{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;display:block;
 -webkit-mask-image:radial-gradient(85% 95% at 68% 40%,#000 25%,transparent 88%);mask-image:radial-gradient(85% 95% at 68% 40%,#000 25%,transparent 88%)}
.ph::before,.hx-bg{display:none!important}
.hero>canvas.sfield,.ph>canvas.sfield{display:block!important;position:absolute;inset:0;z-index:0}

.sfield{-webkit-mask-image:radial-gradient(62% 95% at 80% 42%,#000 22%,transparent 80%);mask-image:radial-gradient(62% 95% at 80% 42%,#000 22%,transparent 80%)}

.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.h3s{font-size:20px;letter-spacing:-.02em;line-height:1.25}

/* phone: never let a card push past the screen */
.grid2>*,.grid3>*,.grid4>*{min-width:0}
.card pre,.tool pre{max-width:100%;overflow-x:auto}

:where(img[width]){height:auto}

/* ===== v15: Seeqly's own UI language. One signature, the trace (a hairline ending in a ringed node: an answer traced to its source),
   replaces the generic pill-button / glow / grey-half-headline kit. ===== */
/* Buttons: squared, flat, no glow. The primary carries the trace; it extends on hover. */
.btn{border-radius:10px!important;height:46px;padding:0 20px;gap:12px;box-shadow:none!important;transform:none!important;letter-spacing:-.01em;transition:background .25s,border-color .25s,color .25s}
.btn-p{background:var(--fg)!important;color:var(--bg)!important;border-color:var(--fg)!important}
.btn-p::after{content:"";flex:none;width:18px;height:9px;transition:width .35s cubic-bezier(.16,1,.3,1);
 background:radial-gradient(circle at calc(100% - 4.5px) 50%,transparent 1.9px,currentColor 2px 3.5px,transparent 3.6px),linear-gradient(currentColor,currentColor) left center/calc(100% - 8px) 1.5px no-repeat}
.btn-p:hover::after,.btn-p:focus-visible::after{width:28px}
.btn-p:hover{background:color-mix(in srgb,var(--fg) 88%,var(--acc))!important}
.btn-s{background:transparent!important;color:var(--fg)!important;border:1px solid var(--line2)!important}
.btn-s:hover{border-color:var(--fg)!important}
.navr .btn{height:38px;padding:0 14px}.navr .btn::after{display:none}
/* Section labels: a small ringed node and a hairline instead of the stock dash */
.eyebrow{color:var(--body)!important;gap:10px;font-weight:500;letter-spacing:0}
.eyebrow::before{content:"";flex:none;width:26px!important;height:9px!important;border:0!important;
 background:radial-gradient(circle at calc(100% - 4.5px) 50%,transparent 1.9px,var(--acc) 2px 3.5px,transparent 3.6px),linear-gradient(var(--line2),var(--line2)) left center/calc(100% - 8px) 1px no-repeat!important;
 transition:width .9s cubic-bezier(.16,1,.3,1)}
html.tr8 .eyebrow:not(.seen)::before{width:9px!important}
/* Headings: one colour. The grey second half was on every heading, so it carried no meaning. */
h1 .q,h2 .q,h3 .q{color:inherit!important}
/* Cards: flat surfaces with a hairline. Depth is kept only for product screens. */
.card,.edge{background:var(--card)!important;border:1px solid var(--line)!important;box-shadow:none!important}
.win,.ask,.aio-serp,.phx-m,.lbv,.persp>.card,.w2r{box-shadow:var(--lift)!important}
.spot::after,html.gs a.card::after,html.gs .card.fc::after,html.gs .card.pw::after,html.gs .card.fmt::after{display:none!important}
a.card{transition:border-color .25s}a.card:hover{border-color:var(--line2)!important}
/* Links in running text: a quiet underline that warms on hover */
main p a:not(.btn),main li a:not(.btn),main dd a:not(.btn){text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:var(--line2);transition:text-decoration-color .2s,color .2s}
main p a:not(.btn):hover,main li a:not(.btn):hover,main dd a:not(.btn):hover{text-decoration-color:var(--acc)}
/* Scroll progress: one solid line, no gradient */
.m-prog{background:var(--acc)!important;height:2px}
@media (prefers-reduced-motion: reduce){.btn-p::after,.eyebrow::before{transition:none}}
