/* ============================================================
   INFINITE OS Overview — RIVET flagship page (Corporate Command, dark)
   Section arc from the RIVET INFINITE OS content spec v1.0.
   Canon loop semantics (LAW): Acquisition=teal/cyan · Winning=amber ·
   Expansion=green · Risk=red. Magenta stays the one precious accent.
   ============================================================ */

:root{
  --acq:var(--cyan); --win:var(--amber); --exp:var(--green); --risk:var(--red,#FF4D2E);
}

/* ---- Two-column feature row ---- */
.frow{ display:grid; grid-template-columns:1.05fr 0.95fr; gap:clamp(28px,4vw,64px); align-items:center; }
.frow--flip .frow__copy{ order:2; }
.frow__copy{ display:flex; flex-direction:column; align-items:flex-start; gap:16px; }
.frow__list{ list-style:none; margin:6px 0 0; padding:0; display:flex; flex-direction:column; gap:10px; }
.frow__list li{ position:relative; padding-left:22px; color:var(--fg-soft); line-height:1.5; }
.frow__list li::before{ content:""; position:absolute; left:0; top:.55em; width:9px; height:9px; border-radius:50%; border:2px solid var(--cyan); }
@media (max-width:900px){ .frow{ grid-template-columns:1fr; } .frow--flip .frow__copy{ order:0; } }

/* ---- Figure slot (Feel-Clever placeholder — each names its insight) ---- */
.figslot{ position:relative; border:1px solid var(--line); border-radius:16px; background:radial-gradient(120% 90% at 50% 0%, rgba(76,243,254,.06), transparent 60%), linear-gradient(180deg,#0B0B10,#050507); overflow:hidden; min-height:var(--fs-h,340px); display:grid; place-items:center; padding:26px; width:100%; }
.figslot::before{ content:""; position:absolute; inset:0; background:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:34px 34px; -webkit-mask-image:radial-gradient(90% 80% at 50% 40%,#000,transparent 80%); mask-image:radial-gradient(90% 80% at 50% 40%,#000,transparent 80%); }
.figslot__tag{ position:absolute; top:12px; left:12px; font-family:var(--font-mono); font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--fg-mute); border:1px solid var(--line); border-radius:6px; padding:3px 8px; background:rgba(0,0,0,.4); }
.figslot__vision{ position:absolute; top:12px; right:12px; font-family:var(--font-mono); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--magenta); border:1px solid color-mix(in oklab,var(--magenta) 40%,var(--line)); border-radius:6px; padding:3px 8px; background:rgba(0,0,0,.4); }
.figslot__body{ position:relative; text-align:center; display:flex; flex-direction:column; align-items:center; gap:10px; max-width:34ch; }
.figslot__ico{ width:54px; height:54px; border-radius:50%; display:grid; place-items:center; border:1px dashed var(--line-strong); color:var(--cyan); }
.figslot__t{ font-family:var(--font-mono); font-size:.82rem; letter-spacing:.02em; color:var(--fg); }
.figslot__i{ font-size:.84rem; color:var(--fg-mute); line-height:1.5; }
.figcap{ position:relative; margin-top:14px; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.02em; color:var(--fg-mute); display:flex; gap:8px; align-items:baseline; flex-wrap:wrap; justify-content:center; }
.figcap b{ color:var(--cyan); font-weight:500; }

/* ---- Grade chips (LAW / PATTERN / BET — the honesty rule, visible) ---- */
.grade{ font-family:var(--font-mono); font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; border-radius:5px; padding:2px 7px; border:1px solid; display:inline-block; }
.grade--law{ color:var(--cyan); border-color:color-mix(in oklab,var(--cyan) 42%,var(--line)); }
.grade--pattern{ color:var(--amber); border-color:color-mix(in oklab,var(--amber) 42%,var(--line)); }
.grade--bet{ color:var(--magenta); border-color:color-mix(in oklab,var(--magenta) 42%,var(--line)); }

/* ---- Placeholder chip (asset RIVET must supply) ---- */
.phchip{ font-family:var(--font-mono); font-size:.72rem; color:var(--fg-mute); border:1px dashed var(--line-strong); border-radius:8px; padding:7px 13px; display:inline-flex; gap:7px; align-items:center; background:rgba(255,255,255,.02); }
.phchip::before{ content:"⌗"; color:var(--cyan); }

/* ---- Hero ---- */
.ovhero{ padding-block:clamp(48px,7vw,104px) clamp(24px,3vw,40px); }
.ovhero__grid{ display:grid; grid-template-columns:1fr; gap:clamp(28px,4vw,48px); align-items:center; justify-items:center; text-align:center; max-width:980px; margin-inline:auto; }
.ovhero__copy{ display:flex; flex-direction:column; align-items:center; gap:18px; }
.ovhero h1{ font-size:var(--step-5); letter-spacing:-.03em; line-height:1.02; }
.ovhero h1 em{ font-style:italic; color:var(--cyan); }
.ovhero .lead{ max-width:62ch; }
.ovhero .ovbullets{ text-align:left; }
.ovhero__cta{ justify-content:center; }
.ovhero .ovtrust{ justify-content:center; }
.ovhero .figslot{ width:100%; max-width:840px; }
.ovmicro{ font-family:var(--font-mono); font-size:.78rem; color:var(--fg-mute); letter-spacing:.01em; }
.ovhero__cta{ display:flex; flex-wrap:wrap; gap:12px; margin-top:2px; }
/* pill badge — rotating signature-gradient border */
.ovpill{ position:relative; display:inline-flex; border-radius:999px; padding:1px; overflow:hidden; isolation:isolate; }
.ovpill::before{ content:""; position:absolute; left:50%; top:50%; width:260%; aspect-ratio:1; transform:translate(-50%,-50%); background:conic-gradient(var(--violet),var(--magenta),var(--cyan),var(--violet)); animation:pillspin 3s linear infinite; z-index:-1; }
.ovpill__in{ display:inline-flex; align-items:center; gap:8px; border-radius:999px; padding:7px 16px; background:#050508; font-family:var(--font-mono); font-size:.7rem; letter-spacing:.15em; color:var(--fg-soft); }
@keyframes pillspin{ to{ transform:translate(-50%,-50%) rotate(1turn); } }
/* checks with dot pulse */
.ovchecks{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; justify-content:center; gap:10px 22px; font-family:var(--font-mono); font-size:.8rem; color:var(--fg-soft); }
.ovchecks li{ display:inline-flex; align-items:center; gap:9px; }
.ovchecks i{ width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 8px var(--green); animation:dotpulse 2s ease-in-out infinite; }
.ovchecks li:nth-child(2) i{ animation-delay:-.66s; } .ovchecks li:nth-child(3) i{ animation-delay:-1.33s; }
@keyframes dotpulse{ 0%,100%{ opacity:1; } 50%{ opacity:.4; } }
.ovtrust{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:4px; color:var(--fg-mute); font-family:var(--font-mono); font-size:.74rem; letter-spacing:.04em; }
@media (max-width:900px){ .ovhero__grid{ grid-template-columns:1fr; } }

/* 8-models teaser ribbon under hero */
.modelsribbon{ border-block:1px solid var(--line); overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); }
.modelsribbon__track{ display:flex; gap:34px; width:max-content; padding:14px 0; animation:mribbon 32s linear infinite; }
.modelsribbon__track span{ flex:none; font-family:var(--font-mono); font-size:.82rem; letter-spacing:.02em; color:var(--fg-soft); display:inline-flex; gap:9px; align-items:center; }
.modelsribbon__track b{ color:var(--cyan); font-weight:500; }
@keyframes mribbon{ from{ transform:translateX(0) } to{ transform:translateX(-50%) } }

/* ---- Sticky in-page rail ---- */
.ovrail{ position:sticky; top:64px; z-index:40; background:rgba(5,5,7,.82); backdrop-filter:blur(12px); border-block:1px solid var(--line); }
.ovrail__in{ display:flex; gap:6px; overflow-x:auto; padding:10px var(--gutter); scrollbar-width:none; }
.ovrail__in::-webkit-scrollbar{ display:none; }
.ovrail a{ flex:none; font-family:var(--font-mono); font-size:.74rem; letter-spacing:.04em; text-decoration:none; color:var(--fg-soft); border:1px solid var(--line); border-radius:var(--r-pill); padding:6px 13px; transition:border-color .2s,color .2s,background .2s; }
.ovrail a:hover{ color:var(--cyan); border-color:var(--cyan); }

/* ---- Reframe bar ---- */
.reframe{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(24px,4vw,56px); align-items:center; }
@media (max-width:900px){ .reframe{ grid-template-columns:1fr; } }
.principle{ font-family:var(--font-mono); font-size:.84rem; color:var(--fg-soft); line-height:1.5; padding-top:12px; border-top:1px solid var(--line); }
.principle b{ color:var(--cyan); font-weight:500; }
.reframe__tiles{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
@media (max-width:560px){ .reframe__tiles{ grid-template-columns:1fr; } }
.rtile{ border:1px solid var(--line); border-radius:14px; padding:20px; background:var(--card-bg); display:flex; flex-direction:column; gap:8px; }
.rtile__k{ font-family:var(--font-mono); font-size:var(--step-4); line-height:1; color:var(--ink); font-weight:600; letter-spacing:-.02em; }
.rtile__l{ color:var(--fg-soft); font-size:.9rem; line-height:1.4; }

/* ---- Sticky-scroll showcase (Watch it work) ---- */
.showcase{ display:grid; grid-template-columns:0.95fr 1.05fr; gap:clamp(28px,5vw,72px); align-items:start; }
.showcase__media{ position:sticky; top:100px; }
.showcase__steps{ display:flex; flex-direction:column; }
.sstep{ min-height:72vh; display:flex; flex-direction:column; justify-content:center; gap:12px; opacity:.32; transition:opacity .35s ease; }
.sstep.is-active{ opacity:1; }
.sstep__n{ font-family:var(--font-mono); font-size:.74rem; letter-spacing:.12em; color:var(--cyan); }
.sstep h3{ font-size:var(--step-3); }
.sstep p{ color:var(--fg-soft); max-width:46ch; }
@media (max-width:820px){ .showcase{ grid-template-columns:1fr; } .showcase__media{ position:static; margin-bottom:20px; } .sstep{ min-height:0; opacity:1; padding-block:22px; } }

/* ---- 8 models: kernel + extension bands ---- */
.kernel-band{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.ext-band{ display:grid; grid-template-columns:repeat(5,1fr); gap:12px; margin-top:12px; }
@media (max-width:900px){ .kernel-band{ grid-template-columns:1fr; } .ext-band{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .ext-band{ grid-template-columns:1fr; } }
.bandlabel{ display:flex; align-items:center; gap:10px; margin:clamp(20px,2.5vw,30px) 0 12px; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--fg-mute); }
.bandlabel::after{ content:""; flex:1; height:1px; background:var(--line); }
.modelcard{ position:relative; display:flex; flex-direction:column; gap:8px; border:1px solid var(--line); border-radius:12px; padding:18px; background:var(--card-bg); transition:border-color .2s,transform .18s; }
.modelcard:hover{ border-color:color-mix(in oklab,var(--gc,var(--cyan)) 42%,var(--line)); transform:translateY(-2px); }
.modelcard__top{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.modelcard__n{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em; color:var(--gc,var(--cyan)); }
.modelcard__k{ font-family:var(--font-mono); font-size:.56rem; letter-spacing:.12em; text-transform:uppercase; color:var(--fg-mute); border:1px solid var(--line); border-radius:5px; padding:2px 6px; }
.modelcard h4{ font-size:var(--step-0); }
.modelcard p{ margin:0; color:var(--fg-soft); font-size:.86rem; line-height:1.5; }
.kernel-band .modelcard{ --gc:var(--cyan); background:linear-gradient(180deg, rgba(76,243,254,.05), var(--card-bg) 60%); }
.kernelcallout{ margin-top:clamp(20px,2.5vw,30px); border:1px solid var(--line); border-radius:12px; padding:18px 22px; background:rgba(76,243,254,.04); color:var(--fg-soft); font-size:.95rem; line-height:1.55; }
.kernelcallout b{ color:var(--ink); }

/* ---- INFINITE loop — CR1–CR8 ---- */
.arealegend{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:16px; }
.arealegend span{ font-family:var(--font-mono); font-size:.74rem; letter-spacing:.03em; color:var(--fg-soft); display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); border-radius:var(--r-pill); padding:6px 13px; }
.arealegend i{ width:10px; height:10px; border-radius:50%; display:inline-block; }
.crgrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
@media (max-width:900px){ .crgrid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .crgrid{ grid-template-columns:1fr; } }
.crcard{ position:relative; border:1px solid var(--line); border-top:2px solid var(--ac,var(--cyan)); border-radius:12px; padding:16px; background:var(--card-bg); display:flex; flex-direction:column; gap:6px; }
.crcard__n{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.08em; color:var(--ac,var(--cyan)); }
.crcard h4{ font-size:var(--step-0); }
.crcard p{ margin:0; color:var(--fg-soft); font-size:.84rem; line-height:1.45; }
.bridgenote{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:16px; }
@media (max-width:680px){ .bridgenote{ grid-template-columns:1fr; } }
.bridge{ border:1px solid var(--line); border-radius:12px; padding:16px 18px; background:rgba(245,194,75,.05); }
.bridge__k{ font-family:var(--font-mono); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:var(--win); }
.bridge p{ margin:6px 0 0; color:var(--fg-soft); font-size:.9rem; line-height:1.5; }

/* ---- AI-SCORE tiles ---- */
.scorerow{ display:grid; grid-template-columns:repeat(5,1fr); gap:12px; }
@media (max-width:720px){ .scorerow{ grid-template-columns:1fr 1fr; } }
.scoretile{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:9px; background:var(--card-bg); border:1px solid var(--line); border-radius:12px; padding:22px 14px; transition:border-color .2s,transform .18s; }
.scoretile:hover{ border-color:color-mix(in oklab,var(--cyan) 40%,var(--line)); transform:translateY(-2px); }
.scoretile__l{ width:40px; height:40px; border-radius:10px; display:grid; place-items:center; font-family:var(--font-mono); font-weight:600; font-size:1.1rem; color:#000; background:var(--cyan); }
.scoretile b{ font-size:var(--step-0); }
.scoretile span{ color:var(--fg-soft); font-size:.82rem; line-height:1.4; }

/* ---- Competitive contrast table ---- */
.cmpwrap{ overflow-x:auto; border:1px solid var(--line); border-radius:16px; }
.cmptable{ width:100%; border-collapse:collapse; font-size:.92rem; min-width:640px; }
.cmptable th,.cmptable td{ text-align:left; padding:14px 16px; border-bottom:1px solid var(--line); vertical-align:top; }
.cmptable thead th{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--fg-mute); font-weight:500; }
.cmptable thead th:last-child{ color:var(--cyan); }
.cmptable tbody th{ font-weight:500; color:var(--fg); }
.cmptable td:last-child,.cmptable th:last-child{ background:rgba(76,243,254,.05); color:var(--ink); font-weight:600; }
.cmptable tbody tr:last-child td,.cmptable tbody tr:last-child th{ border-bottom:0; }
.cmptable .yes{ color:var(--green); } .cmptable .no{ color:var(--fg-mute); }

/* ---- Proof: quote + benchmark band ---- */
.quoteblock{ border:1px solid var(--line); border-radius:20px; padding:clamp(28px,4vw,52px); background:radial-gradient(120% 130% at 0% 0%, color-mix(in oklab,var(--violet) 20%,#000), #000 60%); }
.quoteblock blockquote{ margin:0; font-size:var(--step-3); line-height:1.35; letter-spacing:-.01em; color:var(--ink); font-weight:500; text-wrap:pretty; }
.quoteblock blockquote::before{ content:"\201C"; color:var(--cyan); }
.quoteblock figcaption{ margin-top:18px; font-family:var(--font-mono); font-size:.82rem; color:var(--fg-soft); display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.benchgrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,2vw,22px); margin-top:clamp(20px,2.5vw,30px); }
@media (max-width:720px){ .benchgrid{ grid-template-columns:1fr 1fr; } }
.benchcard{ border:1px solid var(--line); border-radius:14px; padding:22px 20px; background:var(--card-bg); display:flex; flex-direction:column; gap:8px; position:relative; overflow:hidden; }
.benchcard::after{ content:""; position:absolute; left:0; right:0; top:0; height:2px; background:linear-gradient(90deg,transparent,var(--gc,var(--cyan)),transparent); background-size:40% 100%; background-repeat:no-repeat; animation:vzbeam 3s ease-in-out infinite; }
.benchcard__k{ font-family:var(--font-mono); font-size:var(--step-4); line-height:1; color:var(--ink); font-weight:600; letter-spacing:-.02em; }
.benchcard__l{ color:var(--fg-soft); font-size:.86rem; line-height:1.4; }

/* ---- Compounding principle: compound vs cycle ---- */
.compound{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,56px); align-items:center; }
@media (max-width:820px){ .compound{ grid-template-columns:1fr; } }
.ccurve{ border:1px solid var(--line); border-radius:16px; background:linear-gradient(180deg,#0b0b12,#050507); padding:24px; }
.ccurve svg{ width:100%; height:auto; display:block; }
.ccurve .gl{ stroke:rgba(255,255,255,.06); stroke-width:1; }
.ccurve .cmp{ stroke:var(--exp); stroke-width:2.5; fill:none; stroke-linecap:round; stroke-dasharray:520; stroke-dashoffset:520; }
.ccurve .cyc{ stroke:var(--risk); stroke-width:2.5; fill:none; stroke-linecap:round; stroke-linejoin:round; opacity:.9; stroke-dasharray:620; stroke-dashoffset:620; }
.ccurve.is-drawn .cmp{ animation:cdraw 2.2s cubic-bezier(.16,1,.3,1) forwards; }
.ccurve.is-drawn .cyc{ animation:cdraw 2.2s cubic-bezier(.16,1,.3,1) .3s forwards; }
@keyframes cdraw{ to{ stroke-dashoffset:0 } }
.clegend{ display:flex; gap:18px; margin-top:14px; font-family:var(--font-mono); font-size:.76rem; flex-wrap:wrap; }
.clegend span{ display:inline-flex; align-items:center; gap:8px; color:var(--fg-soft); }
.clegend i{ width:16px; height:3px; border-radius:2px; }

/* ---- One OS, every role & model ---- */
.ptabs{ display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 20px; }
.ptab{ font-family:var(--font-mono); font-size:.78rem; letter-spacing:.02em; color:var(--fg-soft); background:transparent; border:1px solid var(--line-strong); border-radius:var(--r-pill); padding:8px 15px; cursor:pointer; transition:.2s; }
.ptab:hover{ color:var(--ink); }
.ptab.is-on{ color:#000; background:var(--cyan); border-color:var(--cyan); }
.ppanel{ display:none; }
.ppanel.is-on{ display:block; animation:ovfade .4s ease-out both; }
@keyframes ovfade{ from{ opacity:0; transform:translateY(8px) } to{ opacity:1; transform:none } }
.rolepanel{ display:grid; grid-template-columns:1.3fr .7fr; gap:clamp(20px,3vw,40px); align-items:center; border:1px solid var(--line); border-radius:16px; padding:clamp(22px,3vw,34px); background:var(--card-bg); }
@media (max-width:760px){ .rolepanel{ grid-template-columns:1fr; } }
.rolepanel h3{ font-size:var(--step-2); }
.rolepanel p{ color:var(--fg-soft); margin:10px 0 0; }
.rolebest{ margin-top:14px; font-family:var(--font-mono); font-size:.76rem; letter-spacing:.02em; color:var(--fg-mute); }
.rolebest b{ color:var(--cyan); font-weight:500; }
.rolemetric{ border:1px solid var(--line); border-radius:14px; padding:22px; background:linear-gradient(180deg,#0b0b12,#060608); display:flex; flex-direction:column; gap:6px; }
.rolemetric__k{ font-family:var(--font-mono); font-size:var(--step-3); line-height:1; color:var(--ink); font-weight:600; letter-spacing:-.02em; }
.rolemetric__l{ color:var(--fg-soft); font-size:.84rem; line-height:1.4; }
.modeltabs{ margin-top:clamp(26px,3vw,40px); }

/* ---- Governance / moat ---- */
.trustgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,2vw,22px); }
@media (max-width:820px){ .trustgrid{ grid-template-columns:1fr; } }
.trustcard{ border:1px solid var(--line); border-radius:14px; padding:24px; background:var(--card-bg); display:flex; flex-direction:column; gap:10px; }
.trustcard__ico{ width:42px; height:42px; border-radius:10px; display:grid; place-items:center; color:var(--cyan); border:1px solid var(--line-strong); }
.trustcard h3{ font-size:var(--step-1); }
.trustcard p{ margin:0; color:var(--fg-soft); font-size:.92rem; line-height:1.55; }
.betstrip{ margin-top:clamp(18px,2.5vw,26px); border:1px solid color-mix(in oklab,var(--magenta) 24%,var(--line)); border-radius:14px; padding:18px 22px; background:rgba(255,0,212,.04); display:flex; gap:14px; align-items:baseline; flex-wrap:wrap; color:var(--fg-soft); line-height:1.55; }
.betstrip b{ color:var(--ink); }

/* ---- Get licensed ---- */
.lic{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2.5vw,26px); }
@media (max-width:820px){ .lic{ grid-template-columns:1fr; } }
.liccard{ position:relative; display:flex; flex-direction:column; gap:12px; border:1px solid var(--line); border-radius:18px; padding:clamp(24px,3vw,34px); background:var(--card-bg); }
.liccard__badge{ align-self:flex-start; font-family:var(--font-mono); font-size:.64rem; letter-spacing:.12em; text-transform:uppercase; padding:4px 11px; border-radius:var(--r-pill); }
.badge--now{ color:#000; background:var(--cyan); }
.badge--app{ color:var(--fg); border:1px solid var(--line-strong); }
.liccard h3{ font-size:var(--step-2); }
.liccard p{ color:var(--fg-soft); margin:0; line-height:1.6; }
.liccard .btn{ margin-top:auto; align-self:flex-start; }
.products{ margin-top:clamp(16px,2vw,22px); border:1px dashed var(--line-strong); border-radius:16px; padding:20px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.products__k{ font-family:var(--font-mono); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--cyan); }
.products p{ margin:6px 0 0; color:var(--fg-soft); font-size:.92rem; }

/* ---- FAQ ---- */
.faq2{ display:grid; grid-template-columns:1fr 1fr; gap:14px 26px; }
@media (max-width:760px){ .faq2{ grid-template-columns:1fr; } }
.faq2 details{ border-bottom:1px solid var(--line); padding:6px 0; }
.faq2 summary{ cursor:pointer; list-style:none; padding:14px 28px 14px 0; position:relative; font-weight:600; color:var(--ink); }
.faq2 summary::-webkit-details-marker{ display:none; }
.faq2 summary::after{ content:"+"; position:absolute; right:2px; top:12px; color:var(--cyan); font-family:var(--font-mono); font-size:1.2rem; transition:transform .2s; }
.faq2 details[open] summary::after{ transform:rotate(45deg); }
.faq2 p{ margin:0 0 14px; color:var(--fg-soft); line-height:1.6; }

/* ---- Final CTA ---- */
.ovcta{ position:relative; display:grid; grid-template-columns:1.2fr .8fr; gap:clamp(20px,3vw,44px); align-items:center; border:1px solid var(--line); border-radius:20px; padding:clamp(28px,4vw,52px); overflow:hidden; background:radial-gradient(120% 150% at 100% 0%, color-mix(in oklab,var(--violet) 28%,#000), #000 60%); }
.ovcta__actions{ display:flex; flex-direction:column; gap:10px; }
@media (max-width:820px){ .ovcta{ grid-template-columns:1fr; } }

/* ---- Shared viz primitives (Watch panels, license) ---- */
.viz{ height:96px; border-radius:10px; border:1px solid var(--line); background:linear-gradient(180deg,#060609,#0b0b12); position:relative; overflow:hidden; display:grid; place-items:center; }
.vz-dot{ width:16px; height:16px; border-radius:50%; background:var(--gc,var(--cyan)); box-shadow:0 0 20px 2px var(--gc,var(--cyan)); animation:vzpulse 2.2s ease-in-out infinite; }
.vz-ring{ width:44px; height:44px; border-radius:50%; border:2px solid var(--line-strong); border-top-color:var(--gc,var(--cyan)); animation:vzspin 3s linear infinite; }
.vz-flow{ position:absolute; inset:0; }
.vz-flow i{ position:absolute; top:50%; width:8px; height:8px; margin-top:-4px; border-radius:50%; background:var(--gc,var(--cyan)); opacity:.9; animation:vzflow 2.4s linear infinite; }
.vz-flow i:nth-child(2){ animation-delay:.8s } .vz-flow i:nth-child(3){ animation-delay:1.6s }
.vz-beam{ position:absolute; inset:0; background:linear-gradient(90deg,transparent, color-mix(in oklab,var(--gc,var(--cyan)) 40%,transparent), transparent); background-size:50% 100%; background-repeat:no-repeat; animation:vzbeam 2.6s ease-in-out infinite; }
@keyframes vzpulse{ 0%,100%{ transform:scale(1); opacity:.65 } 50%{ transform:scale(1.35); opacity:1 } }
@keyframes vzspin{ to{ transform:rotate(360deg) } }
@keyframes vzflow{ 0%{ left:-6% } 100%{ left:106% } }
@keyframes vzbeam{ 0%{ background-position:-60% 0 } 100%{ background-position:160% 0 } }

@media (prefers-reduced-motion:reduce){
  .vz-dot,.vz-ring,.vz-flow i,.vz-beam,.benchcard::after,.modelsribbon__track{ animation:none !important; }
  .ppanel.is-on{ animation:none; }
  .sstep{ opacity:1; }
  .ccurve .cmp,.ccurve .cyc{ stroke-dashoffset:0 !important; animation:none !important; }
}

/* ============================================================
   Section component rules used by infinite-os-overview.html
   (harmonized to this stylesheet's tokens)
   ============================================================ */

/* Template ribbon */
.ov-tpl-ribbon{ display:block; text-align:center; font-family:var(--font-mono); font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--fg-mute); padding:8px 0; border-bottom:1px solid var(--line); background:rgba(255,255,255,.02); }

/* Hero bullets + trust */
.ovbullets{ list-style:none; margin:4px 0 0; padding:0; display:flex; flex-direction:column; gap:12px; }
.ovbullets li{ display:flex; gap:10px; align-items:flex-start; color:var(--fg-soft); line-height:1.5; }
.ovbullets li svg{ flex:none; margin-top:3px; color:var(--cyan); }
.ovtrust__logos{ display:inline-flex; gap:8px; }
.ovtrust__logos span{ border:1px solid var(--line); border-radius:6px; padding:2px 8px; }

/* System node field */
.nodefield{ position:relative; min-height:360px; border:1px solid var(--line); border-radius:16px; overflow:hidden; margin-top:clamp(20px,3vw,32px); background:radial-gradient(120% 90% at 50% 50%, rgba(59,6,212,.08), transparent 60%), linear-gradient(180deg,#0b0b12,#050507); }
.nodefield::before{ content:""; position:absolute; inset:0; background:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px); background-size:34px 34px; -webkit-mask-image:radial-gradient(80% 80% at 50% 50%,#000,transparent 78%); mask-image:radial-gradient(80% 80% at 50% 50%,#000,transparent 78%); }
.nodefield__core{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:88px; height:88px; border-radius:50%; display:grid; place-items:center; color:var(--cyan); border:1px solid color-mix(in oklab,var(--cyan) 40%,var(--line)); background:radial-gradient(circle,rgba(76,243,254,.14),rgba(0,0,0,.4)); box-shadow:0 0 40px -6px color-mix(in oklab,var(--cyan) 60%,transparent); z-index:2; }
.ntok{ position:absolute; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.02em; color:var(--fg-soft); border:1px solid var(--line); border-radius:var(--r-pill); padding:5px 11px; background:rgba(0,0,0,.55); white-space:nowrap; animation:ntokfloat var(--d,7s) ease-in-out infinite; }
.ntok b{ color:var(--cyan); font-weight:500; }
.ntok--v b{ color:var(--violet); }
.ntok--m b{ color:var(--magenta); }
@keyframes ntokfloat{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-8px) } }

/* System stage strip */
.sysstages{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:16px; }
@media (max-width:760px){ .sysstages{ grid-template-columns:1fr 1fr; } }
.sysstage{ font-family:var(--font-mono); font-size:.76rem; letter-spacing:.02em; color:var(--fg-soft); border:1px solid var(--line); border-radius:12px; padding:12px 14px; background:var(--card-bg); text-align:center; }
.sysstage b{ color:var(--cyan); font-weight:500; display:block; margin-top:3px; }

/* Pillar groups */
.pillars{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
@media (max-width:820px){ .pillars{ grid-template-columns:1fr; } }
.pillar{ border:1px solid var(--line); border-top:2px solid var(--gc,var(--cyan)); border-radius:14px; padding:22px; background:var(--card-bg); }
.pillar__h{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.pillar__n{ font-family:var(--font-mono); font-size:.9rem; color:var(--gc,var(--cyan)); border:1px solid color-mix(in oklab,var(--gc,var(--cyan)) 40%,var(--line)); border-radius:8px; padding:4px 9px; }
.pillar__t{ font-size:var(--step-1); font-weight:600; color:var(--ink); }
.pillar__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.pillar__item{ position:relative; padding-left:14px; }
.pillar__item::before{ content:""; position:absolute; left:0; top:.5em; width:6px; height:6px; border-radius:50%; background:var(--gc,var(--cyan)); }
.pillar__item b{ color:var(--fg); }
.pillar__item p{ margin:2px 0 0; color:var(--fg-soft); font-size:.86rem; line-height:1.45; }
.pillar__tag{ display:inline-block; margin-top:5px; font-family:var(--font-mono); font-size:.58rem; letter-spacing:.1em; text-transform:uppercase; color:var(--fg-mute); border:1px solid var(--line); border-radius:5px; padding:2px 7px; }

/* 8-model grid */
.mgrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
@media (max-width:900px){ .mgrid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .mgrid{ grid-template-columns:1fr; } }
.mcard{ border:1px solid var(--line); border-radius:12px; padding:18px; background:var(--card-bg); display:flex; flex-direction:column; gap:6px; transition:border-color .2s,transform .18s; }
.mcard:hover{ border-color:color-mix(in oklab,var(--cyan) 40%,var(--line)); transform:translateY(-2px); }
.mcard__n{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em; color:var(--cyan); }
.mcard h4{ font-size:var(--step-0); }
.mcard p{ margin:0; color:var(--fg-soft); font-size:.84rem; line-height:1.45; }

/* Bento collage */
.bento{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
@media (max-width:820px){ .bento{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .bento{ grid-template-columns:1fr; } }
.bcell{ border:1px solid var(--line); border-top:2px solid var(--gc,var(--cyan)); border-radius:14px; padding:22px; background:var(--card-bg); display:flex; flex-direction:column; gap:8px; overflow:hidden; }
.bcell--wide{ grid-column:span 2; }
@media (max-width:560px){ .bcell--wide{ grid-column:span 1; } }
.bcell__k{ font-family:var(--font-mono); font-size:.64rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gc,var(--cyan)); }
.bcell h3{ font-size:var(--step-1); }
.bcell p{ margin:0; color:var(--fg-soft); font-size:.88rem; line-height:1.5; }
.bcell__viz{ margin-top:auto; padding-top:12px; }

/* Skill marquee */
.skillrows{ overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.skillrow{ display:flex; gap:8px; width:max-content; animation:skillmarq 26s linear infinite; }
.skillrow--rev{ animation-direction:reverse; }
.skillrow span{ flex:none; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.02em; color:var(--fg-soft); border:1px solid var(--line); border-radius:var(--r-pill); padding:5px 11px; background:rgba(0,0,0,.4); white-space:nowrap; }
@keyframes skillmarq{ from{ transform:translateX(0) } to{ transform:translateX(-50%) } }

/* Licensing capability cards */
.capgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
@media (max-width:760px){ .capgrid{ grid-template-columns:1fr; } }
.capcard{ border:1px solid var(--line); border-top:2px solid var(--gc,var(--cyan)); border-radius:14px; padding:24px; background:var(--card-bg); display:flex; flex-direction:column; gap:10px; }
.capcard__viz{ height:80px; border-radius:10px; border:1px solid var(--line); background:linear-gradient(180deg,#060609,#0b0b12); position:relative; overflow:hidden; display:grid; place-items:center; }
.capcard h3{ font-size:var(--step-1); }
.capcard p{ margin:0; color:var(--fg-soft); font-size:.88rem; line-height:1.5; }

/* Every-surface device mock */
.devwrap{ position:relative; min-height:300px; border:1px solid var(--line); border-radius:16px; overflow:hidden; background:linear-gradient(180deg,#0b0b12,#050507); }
.devchip{ position:absolute; z-index:3; font-family:var(--font-mono); font-size:.6rem; letter-spacing:.12em; text-transform:uppercase; color:var(--fg-mute); border:1px solid var(--line); border-radius:6px; padding:3px 8px; background:rgba(0,0,0,.5); }
.devscreen{ position:absolute; border:1px solid var(--line-strong); border-radius:10px; }
.devscreen--desk{ top:48px; left:34px; right:80px; bottom:34px; background:linear-gradient(160deg,#12121a,#0a0a12); }
.devscreen--phone{ top:96px; bottom:24px; right:22px; width:80px; border-radius:14px; background:linear-gradient(160deg,#16161f,#0a0a12); }

/* FAQ (single-column) */
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{ cursor:pointer; list-style:none; padding:16px 28px 16px 0; position:relative; font-weight:600; color:var(--ink); }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; position:absolute; right:2px; top:14px; color:var(--cyan); font-family:var(--font-mono); font-size:1.2rem; transition:transform .2s; }
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq p{ margin:0 0 16px; color:var(--fg-soft); line-height:1.6; }

/* Benchmark rate line */
.benchcard__rate{ font-family:var(--font-mono); font-size:.68rem; letter-spacing:.04em; color:var(--fg-mute); }

@media (prefers-reduced-motion:reduce){
  .ntok,.skillrow{ animation:none !important; }
}

/* ============================================================
   FLUID ENRICHMENT — Infinitus Plaza (Zaha Hadid) language
   Continuous flowing surfaces, parametric asymmetric radii, one
   seamless ∞ ribbon. Loop, never a box. Cyan on black = Command
   duo; magenta stays the single accent. Print/reduced-motion safe.
   ============================================================ */
:root{
  --flow-a:120px 40px 120px 40px;   /* sweeps down-left → up-right */
  --flow-b:40px 120px 40px 120px;   /* mirror */
  --flow-soft:64px 28px 64px 28px;
}

/* Signature surfaces flow instead of boxing. Small data cards stay crisp. */
.ovhero .figslot{ border-radius:var(--flow-a); }
.nodefield{ border-radius:var(--flow-b); }
.showcase__media .figslot{ border-radius:var(--flow-soft); }
.quoteblock{ border-radius:var(--flow-a); }
.ovcta{ border-radius:var(--flow-b); }
.rolepanel{ border-radius:var(--flow-soft); }
.rolepanel .rolemetric{ border-radius:28px 12px 28px 12px; }
.liccard:first-child{ border-radius:var(--flow-a); }
.liccard:last-child{ border-radius:var(--flow-b); }
.devwrap{ border-radius:var(--flow-soft); }
.devscreen--desk{ border-radius:40px 14px 40px 14px; }
.figslot .figslot__ico{ border-style:solid; }
@media (max-width:640px){ :root{ --flow-a:56px 22px 56px 22px; --flow-b:22px 56px 22px 56px; --flow-soft:40px 18px 40px 18px; } }

/* The one seamless ribbon — a continuous ∞ sweep behind the hero.
   It is a leading line resolving toward the pipeline figure (Feel-Clever:
   the OS itself is one unbroken loop). */
.ovhero{ position:relative; overflow:clip; }
.ovhero__ribbon{ position:absolute; inset:-8% -6% auto -6%; height:132%; width:112%; z-index:0; pointer-events:none; opacity:.5; }
.ovhero__ribbon path{ fill:none; stroke-width:1.4; vector-effect:non-scaling-stroke; }
.ovhero__ribbon .r1{ stroke:color-mix(in oklab,var(--cyan) 55%,transparent); }
.ovhero__ribbon .r2{ stroke:color-mix(in oklab,var(--violet) 50%,transparent); }
.ovhero__ribbon .r3{ stroke:color-mix(in oklab,var(--cyan) 22%,transparent); }
.ovhero .wrap{ position:relative; z-index:1; }
.ovhero__ribbon .flow{ stroke-dasharray:2200; stroke-dashoffset:2200; animation:ribbonflow 3.4s cubic-bezier(.16,1,.3,1) forwards; }
.ovhero__ribbon .r2.flow{ animation-delay:.25s; } .ovhero__ribbon .r3.flow{ animation-delay:.5s; }
@keyframes ribbonflow{ to{ stroke-dashoffset:0 } }

/* Parametric surface sweep — a soft flowing light across signature panels,
   like the Plaza's curved façade catching a single key light. */
.quoteblock,.ovcta{ position:relative; overflow:hidden; }
.quoteblock::after,.ovcta::after{ content:""; position:absolute; z-index:0; width:140%; height:78%; right:-30%; top:-24%; background:radial-gradient(60% 60% at 60% 40%, color-mix(in oklab,var(--cyan) 16%,transparent), transparent 70%); transform:rotate(-14deg); pointer-events:none; }
.quoteblock>*,.ovcta>*{ position:relative; z-index:1; }

/* Feature-row media flows toward its copy (leading line) */
.frow .figslot{ border-radius:var(--flow-a); }
.frow--flip .figslot{ border-radius:var(--flow-b); }

@media (prefers-reduced-motion:reduce){
  .ovhero__ribbon .flow{ animation:none !important; stroke-dashoffset:0 !important; }
}
@media print{ .ovhero__ribbon{ display:none; } }

/* ============================================================
   THE COMMAND duo — black → cyan (dark-anchored, ink white).
   Hero carries a mild local cyan concentration for the fold; the
   continuous page field lives on body (os-dark.css).
   ============================================================ */
.ovhero{
  background: radial-gradient(92% 92% at 95% 2%, color-mix(in oklab,var(--cyan) 12%, transparent) 0%, transparent 56%);
}
@media print{ .ovhero{ background:none !important; } }

/* ============================================================
   HERO ORCHESTRATION — one shared context (Feel-Clever)
   ============================================================ */
.orch{ position:relative; width:100%; max-width:1080px; margin:clamp(20px,3.5vw,40px) auto 0; height:clamp(680px,60vw,760px); }
.orch__channels{ position:absolute; top:0; left:50%; transform:translateX(-50%); display:flex; gap:clamp(18px,3vw,30px); font-family:var(--font-mono); font-size:.68rem; letter-spacing:.16em; color:var(--fg-mute); z-index:2; }
.orch__channels span{ display:inline-flex; align-items:center; gap:7px; }
.orch__channels span::before{ content:""; width:5px; height:5px; border-radius:50%; background:var(--cyan); opacity:.6; box-shadow:0 0 6px var(--cyan); }
.orch__wires{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; z-index:1; }
.ow{ fill:none; stroke:var(--cyan); }
.ow--h,.ow--v,.ow--t{ stroke-width:1.1; opacity:.22; stroke-dasharray:4 7; animation:owflow 1.7s linear infinite; }
@keyframes owflow{ to{ stroke-dashoffset:-22; } }
.ow--q{ stroke-width:1.2; opacity:.14; transition:opacity .3s,stroke-width .3s,filter .3s; }
.ow--q.is-lit{ opacity:.95; stroke-width:2.1; filter:drop-shadow(0 0 6px var(--cyan)); }
.ow--tool{ stroke-width:1.1; opacity:.2; stroke-dasharray:4 7; animation:owflow 1.9s linear infinite; }
/* core */
.orch__core{ position:absolute; left:50%; top:47%; width:0; height:0; transform:translate(-50%,-50%) translate(var(--px,0),var(--py,0)); z-index:3; }
.orch__ring{ position:absolute; left:50%; top:50%; border-radius:50%; transform:translate(-50%,-50%); border:1px solid; }
.orch__ring--1{ width:126px; height:126px; border-color:color-mix(in oklab,var(--cyan) 42%,transparent); }
.orch__ring--2{ width:206px; height:206px; border-style:dashed; border-color:color-mix(in oklab,var(--cyan) 22%,transparent); animation:orbspin 44s linear infinite; }
.orch__ring--3{ width:296px; height:296px; border-color:color-mix(in oklab,var(--cyan) 11%,transparent); }
@keyframes orbspin{ to{ transform:translate(-50%,-50%) rotate(360deg); } }
/* 8 CONTOUR BANDS core (C-BLD-BANDS — one band per model/stage) */
.orch__bands{ position:absolute; left:50%; top:50%; width:240px; height:120px; transform:translate(-50%,-50%); overflow:visible; }
.orch__bands rect{ opacity:.5; }
.orch__bands rect:nth-child(1){ opacity:.78; } .orch__bands rect:nth-child(2){ opacity:.72; } .orch__bands rect:nth-child(3){ opacity:.66; } .orch__bands rect:nth-child(8){ opacity:1; filter:drop-shadow(0 0 4px var(--magenta)); }
.orch__perf{ position:absolute; right:6%; top:9%; width:clamp(120px,13vw,168px); height:auto; opacity:.34; z-index:1; pointer-events:none; }

/* ---- Growth Model plaza (M1) ---- */
.plaza{ position:relative; max-width:820px; margin:clamp(28px,4vw,48px) auto 0; display:flex; flex-direction:column; gap:10px; }
.plaza__loop{ position:absolute; right:-30px; top:2%; width:70px; height:96%; overflow:visible; z-index:1; pointer-events:none; }
.ploop{ fill:none; stroke:var(--magenta); stroke-width:1.6; stroke-dasharray:5 6; opacity:.7; }
.plaza__loopcap{ position:absolute; right:-42px; top:50%; transform:translateY(-50%) rotate(90deg); transform-origin:center; font-family:var(--font-mono); font-size:.62rem; letter-spacing:.14em; color:var(--magenta); white-space:nowrap; }
.pband{ width:var(--w); margin:0 auto; display:grid; grid-template-columns:minmax(150px,190px) 1fr auto; align-items:center; gap:18px; padding:15px 20px; background:#0A0A0C; border:1px solid color-mix(in oklab,var(--gc) 30%,transparent); border-radius:16px; outline:none; transition:transform .25s cubic-bezier(.16,1,.3,1),border-color .25s,box-shadow .25s; }
.pband:hover,.pband:focus-visible{ transform:translateY(-3px); border-color:color-mix(in oklab,var(--gc) 62%,transparent); box-shadow:0 14px 34px -20px color-mix(in oklab,var(--gc) 70%,transparent); }
.pband--4{ box-shadow:0 0 0 1px color-mix(in oklab,var(--magenta) 22%,transparent); }
.pband__id{ display:flex; align-items:baseline; gap:9px; flex-wrap:wrap; }
.pband__no{ font-family:var(--font-mono); font-size:.72rem; color:var(--gc); }
.pband__stage{ font-size:1.12rem; font-weight:650; letter-spacing:-.02em; color:var(--fg); }
.pband__mode{ font-family:var(--font-mono); font-size:.6rem; letter-spacing:.1em; text-transform:uppercase; color:var(--fg-mute); width:100%; }
.pband__fit{ margin:0; font-size:.86rem; line-height:1.45; color:var(--fg-soft); }
.pband__fit b{ color:var(--gc); font-weight:600; }
.pband__meta{ display:flex; align-items:center; gap:16px; }
.pband__mult{ font-family:var(--font-mono); font-size:1.5rem; font-weight:600; color:var(--fg); letter-spacing:-.02em; min-width:70px; text-align:right; }
.pband--4 .pband__mult{ color:var(--magenta); }
.pband__close{ display:inline-flex; align-items:center; gap:6px; font-family:var(--font-mono); font-size:.62rem; letter-spacing:.06em; color:var(--fg-soft); white-space:nowrap; }
.pband__close i{ width:6px; height:6px; border-radius:50%; flex:none; }
.pband__close--done i{ background:var(--green); box-shadow:0 0 6px var(--green); }
.pband__close--part i{ background:var(--gold,#F5C24B); box-shadow:0 0 6px var(--gold,#F5C24B); }
.pband__next{ font-family:var(--font-mono); font-size:.62rem; letter-spacing:.06em; color:var(--fg-mute); white-space:nowrap; }
.pband--4 .pband__next{ color:var(--magenta); }
@media (max-width:720px){ .plaza__loop,.plaza__loopcap{ display:none; } .pband{ width:100% !important; grid-template-columns:1fr; gap:9px; } .pband__meta{ justify-content:flex-start; } .pband__mult{ text-align:left; min-width:0; } }
.orch__sweep{ position:absolute; left:0; top:0; width:272px; height:272px; border-radius:50%; transform:translate(-50%,-50%); background:conic-gradient(from 0deg, color-mix(in oklab,var(--cyan) 20%,transparent), transparent 16%); animation:radarsweep 4s linear infinite; }
@keyframes radarsweep{ 0%{ transform:translate(-50%,-50%) rotate(0deg); } 100%{ transform:translate(-50%,-50%) rotate(1turn); } }
.orch__ping{ position:absolute; left:0; top:0; width:150px; height:150px; border-radius:50%; border:1px solid color-mix(in oklab,var(--cyan) 45%,transparent); transform:translate(-50%,-50%) scale(.55); opacity:0; animation:radarping 3s ease-out infinite; }
@keyframes radarping{ 0%{ opacity:0; transform:translate(-50%,-50%) scale(.55); } 12%{ opacity:.45; } 100%{ opacity:0; transform:translate(-50%,-50%) scale(2.5); } }
.orch__glow{ position:absolute; left:50%; top:50%; width:172px; height:172px; transform:translate(-50%,-50%); border-radius:50%; background:radial-gradient(circle, color-mix(in oklab,var(--magenta) 52%,transparent), transparent 68%); filter:blur(7px); animation:orbpulse 3.4s ease-in-out infinite; }
@keyframes orbpulse{ 0%,100%{ opacity:.5; transform:translate(-50%,-50%) scale(1); } 50%{ opacity:.82; transform:translate(-50%,-50%) scale(1.09); } }
.orch__coreLabel{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:5px; text-align:center; }
.orch__kick{ font-family:var(--font-mono); font-size:.58rem; letter-spacing:.18em; text-transform:uppercase; color:var(--fg-mute); }
.orch__coreLabel svg{ color:#fff; filter:drop-shadow(0 0 9px var(--magenta)); }
.orch__name{ font-family:var(--font-mono); font-size:.64rem; letter-spacing:.13em; line-height:1.25; color:var(--fg-soft); }
/* axis labels */
.oax{ position:absolute; left:50%; top:47%; font-family:var(--font-mono); font-size:.68rem; letter-spacing:.15em; text-transform:uppercase; color:var(--fg-mute); z-index:2; white-space:nowrap; }
.oax--top{ transform:translate(-50%,-216px); }
.oax--bottom{ transform:translate(-50%,152px); }
.oax--left{ transform:translate(-238px,-50%); }
.oax--right{ transform:translate(184px,-50%); }
/* quadrant cards */
.qcard{ position:absolute; width:clamp(186px,19vw,234px); padding:15px 16px 14px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.014)); backdrop-filter:blur(6px); transform:translate(var(--px,0),var(--py,0)); transition:transform .28s cubic-bezier(.16,1,.3,1),border-color .28s,box-shadow .28s; z-index:2; }
.qcard--tl{ top:5%; left:0; } .qcard--tr{ top:5%; right:0; } .qcard--bl{ bottom:11%; left:0; } .qcard--br{ bottom:11%; right:0; }
/* grouped side cards — bullet capabilities */
/* one card per model — bullets reveal a floating detail panel */
.qcard--l1{ top:1%; left:0; } .qcard--l2{ top:35%; left:0; } .qcard--l3{ top:70%; left:0; }
.qcard--r1{ top:8%; right:0; } .qcard--r2{ top:38%; right:0; } .qcard--r3{ top:68%; right:0; } .qcard--r4{ top:60%; right:0; } .qcard--r5{ top:74%; right:0; }
.qcard--ai{ left:50%; bottom:15%; transform:translateX(-50%) translate(var(--px,0),var(--py,0)); }
.qcard--config{ left:50%; top:16%; transform:translateX(-50%) translate(var(--px,0),var(--py,0)); }
.qcard--l1,.qcard--l2,.qcard--l3{ width:clamp(206px,19vw,242px); padding:11px 13px 10px; }
.qcard--ai,.qcard--config,.qcard--r1,.qcard--r2,.qcard--r3,.qcard--r4,.qcard--r5{ width:clamp(188px,18.5vw,218px); padding:11px 13px 10px; }
.qcard__hd{ display:flex; align-items:center; gap:8px; margin-bottom:7px; }
.qcard:hover,.qcard:focus-within{ z-index:9; }
.qbl{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
.qb{ position:relative; display:flex; flex-direction:column; padding:0; border-radius:9px; cursor:default; outline:none; font-family:var(--font-mono); transition:background .2s; }
.qb__l{ display:flex; align-items:center; gap:8px; padding:4px 9px; border-radius:8px; font-size:.71rem; white-space:nowrap; color:var(--fg-soft); transition:background .2s,color .2s; }
.qb__l::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--gc); box-shadow:0 0 6px var(--gc); flex:none; opacity:.55; transition:opacity .2s,transform .2s; }
.qb:hover .qb__l,.qb:focus-visible .qb__l{ background:color-mix(in oklab,var(--gc) 15%,transparent); color:var(--fg); }
.qb:hover .qb__l::before,.qb:focus-visible .qb__l::before{ opacity:1; transform:scale(1.25); }
/* inline detail — expands inside the same card, below its bullet */
.qb__d{ position:absolute; left:0; right:0; top:calc(100% - 2px); z-index:8; overflow:hidden; opacity:0; pointer-events:none; padding:0 11px; border:1px solid transparent; border-radius:9px; font-size:.66rem; line-height:1.55; color:var(--fg-soft); transform:translateY(-4px); transition:opacity .18s,transform .22s cubic-bezier(.16,1,.3,1),padding .18s; }
.qb:hover .qb__d,.qb:focus-visible .qb__d{ opacity:1; pointer-events:auto; transform:translateY(0); padding:9px 11px; border-color:color-mix(in oklab,var(--gc) 40%,transparent); background:color-mix(in oklab,var(--gc) 10%,#050507); box-shadow:0 16px 36px -18px #000; }
.ow--k{ stroke-width:1.2; opacity:.25; stroke-dasharray:4 7; animation:owflow 1.7s linear infinite; transition:opacity .3s,stroke-width .3s,filter .3s; }
.ow--k.is-lit{ opacity:.95; stroke-width:2; filter:drop-shadow(0 0 6px var(--cyan)); }
.ow--r{ stroke:var(--fg-mute); stroke-width:1.1; opacity:.12; stroke-dasharray:3 6; transition:opacity .3s,stroke .3s,stroke-width .3s,filter .3s; }
.ow--r.is-lit{ stroke:var(--cyan); opacity:.9; stroke-width:1.8; filter:drop-shadow(0 0 6px var(--cyan)); }
.ow--mag{ stroke:var(--magenta); }
.ow--mag.is-lit{ filter:drop-shadow(0 0 6px var(--magenta)); }
.ow--rmag.is-lit{ stroke:var(--magenta); filter:drop-shadow(0 0 6px var(--magenta)); }
.qcard.is-lit{ border-color:color-mix(in oklab,var(--gc) 60%,transparent); box-shadow:0 0 0 1px color-mix(in oklab,var(--gc) 38%,transparent),0 16px 46px -20px var(--gc); }
.qcard__n{ font-family:var(--font-mono); font-size:.62rem; color:var(--gc); border:1px solid color-mix(in oklab,var(--gc) 38%,transparent); border-radius:5px; padding:1px 6px; }
.qcard__t{ font-size:.92rem; margin:0; letter-spacing:-.01em; color:var(--fg); transition:color .2s; }
.qcard.is-lit .qcard__t{ color:var(--gc); }
.qb:hover::before,.qb:focus-visible::before{ }
/* floating signal chips */
.orch__chips{ position:absolute; left:22.5%; top:69%; transform:translateY(-50%) translate(var(--px,0),var(--py,0)); display:flex; flex-direction:column; gap:10px; z-index:2; }
.ochip{ display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:.73rem; color:var(--fg-soft); background:rgba(10,10,14,.72); border:1px solid var(--line); border-radius:var(--r-pill); padding:6px 12px; white-space:nowrap; animation:chipdrift 6.5s ease-in-out infinite; }
.ochip:nth-child(2){ animation-delay:-1.6s; } .ochip:nth-child(3){ animation-delay:-3.2s; } .ochip:nth-child(4){ animation-delay:-4.8s; }
.ochip i{ width:7px; height:7px; border-radius:50%; background:var(--c); box-shadow:0 0 7px var(--c); flex:none; }
.ochip b{ color:var(--fg); font-weight:500; }
@keyframes chipdrift{ 0%,100%{ transform:translateX(0); } 50%{ transform:translateX(7px); } }
/* memory ticker */
.orch__mem{ position:absolute; right:23%; top:26%; transform:translateY(-50%) translate(var(--px,0),var(--py,0)); display:flex; flex-direction:column; gap:10px; align-items:flex-end; text-align:right; z-index:2; }
.omem{ font-family:var(--font-mono); font-size:.73rem; color:var(--fg-mute); }
.omem em{ font-style:normal; color:var(--cyan); opacity:.7; }
.omem b{ color:var(--cyan); }
/* orchestration tools */
.orch__tools{ position:absolute; left:50%; bottom:2%; transform:translateX(-50%) translate(var(--px,0),var(--py,0)); display:flex; gap:11px; z-index:2; }
.orch__tools--top{ bottom:auto; top:2%; }
.aillm{ display:flex; align-items:center; gap:8px; margin-top:9px; padding-top:9px; border-top:1px solid var(--line); }
.aillm__k{ font-family:var(--font-mono); font-size:.56rem; letter-spacing:.14em; text-transform:uppercase; color:var(--fg-mute); margin-right:2px; }
.aillm__i{ width:22px; height:22px; border-radius:6px; object-fit:cover; display:block; }
.aillm__i--dk{ display:grid; place-items:center; background:#0A0A0C; border:1px solid var(--line); }
.otool{ width:38px; height:38px; display:grid; place-items:center; border:1px solid var(--line); border-radius:10px; background:rgba(10,10,14,.72); transition:transform .2s,border-color .2s; }
.otool:hover{ transform:translateY(-3px); border-color:var(--cyan); }
.otool img{ display:block; opacity:.92; }
.orch__cap{ text-align:center; font-family:var(--font-mono); font-size:.77rem; color:var(--fg-mute); margin:20px auto 0; max-width:62ch; line-height:1.6; }
.orch__cap b{ color:var(--fg-soft); font-weight:500; }
.orch__cap span{ color:var(--magenta); }
/* clients */
.ovclients{ margin-top:clamp(30px,4vw,46px); display:flex; flex-direction:column; align-items:center; gap:15px; }
.ovclients__k{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--fg-mute); }
.ovclients__row{ display:flex; gap:clamp(24px,5vw,58px); align-items:center; flex-wrap:wrap; justify-content:center; }
.ovclients__row span{ font-size:clamp(1rem,2vw,1.32rem); font-weight:700; letter-spacing:.01em; color:var(--fg-soft); opacity:.68; transition:opacity .2s; }
.ovclients__row span:hover{ opacity:1; }
.ovclients__row img{ height:clamp(22px,2.6vw,30px); width:auto; max-width:130px; object-fit:contain; filter:brightness(0) invert(1); opacity:.6; transition:opacity .2s; }

/* ---- Figure: 8-Model GTM Architecture (inline SVG) ---- */
.archsvg{ display:block; width:100%; height:auto; }
.archsvg .arch-box{ fill:#0A0A0C; stroke:#1A1A22; stroke-width:1; transition:stroke .25s; }
.archsvg .an:hover .arch-box,.archsvg .an:focus-within .arch-box{ stroke:rgba(76,243,254,.55); }
.archsvg .arch-core{ fill:#0A0A0C; stroke:#FF00D4; stroke-width:1.5; }
.archsvg .arch-mono{ font:600 10.5px "IBM Plex Mono",monospace; letter-spacing:.09em; fill:#4CF3FE; }
.archsvg .arch-name{ font:600 15px "IBM Plex Sans",sans-serif; fill:#FFFFFF; }
.archsvg .arch-sec{ font:600 11px "IBM Plex Mono",monospace; letter-spacing:.18em; fill:#4A4A68; }
.archsvg .arch-core-m{ font:600 10.5px "IBM Plex Mono",monospace; letter-spacing:.14em; fill:#FF00D4; }
.archsvg .arch-core-t{ font:700 17px "IBM Plex Sans",sans-serif; fill:#FFFFFF; }
.archsvg .arch-job{ font:400 12.5px "IBM Plex Mono",monospace; fill:#D1D1D9; }
.archsvg .arch-hint{ fill:#4A4A68; }
.archsvg .an__rail{ fill:none; stroke:#4CF3FE; stroke-width:1.6; opacity:.4; transition:opacity .25s; }
.archsvg .an__ret{ fill:none; stroke:#4A4A68; stroke-width:1.4; stroke-dasharray:4 5; opacity:.35; transition:opacity .25s, stroke .25s; }
.archsvg .an:hover .an__rail,.archsvg .an:focus-within .an__rail{ opacity:1; }
.archsvg .an:hover .an__ret,.archsvg .an:focus-within .an__ret{ stroke:#4CF3FE; opacity:1; }
.archsvg .an__job{ opacity:0; transition:opacity .2s; pointer-events:none; }
.archsvg .an:hover .an__job,.archsvg .an:focus-within .an__job{ opacity:1; }
.ovclients__row img:hover{ opacity:1; }
@media (max-width:960px){ .orch__chips,.orch__mem,.oax--left,.oax--right,.ocol{ display:none; } .qcard{ width:clamp(158px,24vw,200px); } }
@media (max-width:720px){
  .orch{ height:auto; display:flex; flex-direction:column; align-items:center; gap:16px; padding-top:6px; }
  .orch__wires,.oax{ display:none; }
  .orch__channels{ position:static; transform:none; flex-wrap:wrap; justify-content:center; }
  .orch__core{ position:static; transform:none; width:200px; height:200px; margin:6px auto; }
  .orch__ring--3{ display:none; }
  .qcard{ position:static !important; inset:auto !important; transform:none !important; width:100%; max-width:400px; }
  .qb__d{ position:static; left:auto; right:auto; width:auto; opacity:1; pointer-events:auto; transform:none; margin-left:auto; padding:0 0 0 6px; background:transparent; border:none; box-shadow:none; color:var(--fg-mute); text-align:right; }
  .qb__d::after{ display:none; }
  .qb{ flex-wrap:wrap; }
  .orch__tools{ position:static; transform:none; flex-wrap:wrap; justify-content:center; }
}
@media (prefers-reduced-motion:reduce){ .ow--h,.ow--v,.ow--t,.ow--k,.orch__ring--2,.orch__glow,.ochip,.orch__sweep,.orch__ping,.ovpill::before,.ovchecks i{ animation:none !important; } .orch__ping{ opacity:0; } }

/* ============================================================
   Richer reveal / stagger (overview only)
   ============================================================ */
html.js .ovhero [data-reveal], html.js .ovpart [data-reveal], html.js .orch[data-reveal]{ transform:translateY(30px) scale(.985); transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1); }
html.js .ovhero [data-reveal].in, html.js .ovpart [data-reveal].in, html.js .orch[data-reveal].in{ transform:none; }
@keyframes ovRise{ from{ opacity:0; transform:translateY(24px) scale(.98); } to{ opacity:1; transform:none; } }
html.js .mgrid.in .mcard, html.js .bento.in .bcell, html.js .benchgrid.in .benchcard, html.js .trustgrid.in .trustcard, html.js .capgrid.in .capcard{ animation:ovRise .55s cubic-bezier(.16,1,.3,1) both; }
html.js .mgrid.in .mcard:nth-child(2), html.js .bento.in .bcell:nth-child(2), html.js .benchgrid.in .benchcard:nth-child(2), html.js .trustgrid.in .trustcard:nth-child(2), html.js .capgrid.in .capcard:nth-child(2){ animation-delay:70ms; }
html.js .mgrid.in .mcard:nth-child(3), html.js .bento.in .bcell:nth-child(3), html.js .benchgrid.in .benchcard:nth-child(3), html.js .trustgrid.in .trustcard:nth-child(3), html.js .capgrid.in .capcard:nth-child(3){ animation-delay:140ms; }
html.js .mgrid.in .mcard:nth-child(4), html.js .bento.in .bcell:nth-child(4), html.js .benchgrid.in .benchcard:nth-child(4){ animation-delay:210ms; }
html.js .mgrid.in .mcard:nth-child(5){ animation-delay:280ms; } html.js .mgrid.in .mcard:nth-child(6){ animation-delay:350ms; }
html.js .mgrid.in .mcard:nth-child(7){ animation-delay:420ms; } html.js .mgrid.in .mcard:nth-child(8){ animation-delay:490ms; }
@media (prefers-reduced-motion:reduce){ html.js .mgrid.in .mcard, html.js .bento.in .bcell, html.js .benchgrid.in .benchcard, html.js .trustgrid.in .trustcard, html.js .capgrid.in .capcard{ animation:none !important; } }