/* =====================================================================
   Telvi Broadcast - site styles
   Shared by index.html and requirements/index.html
   ===================================================================== */

@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url("../fonts/inter-var-latin.woff2") format("woff2");}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/ibm-plex-mono-400.woff2") format("woff2");}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/ibm-plex-mono-500.woff2") format("woff2");}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/ibm-plex-mono-600.woff2") format("woff2");}

:root{
    --ink:#0b1220;
    --ink-2:#111c30;
    --ink-3:#18253d;
    --bg:#ffffff;
    --soft:#f5f8fb;
    --soft-2:#eef3f8;
    --muted:#55667d;
    --muted-dark:#a9b8cc;
    --line:#e3e9f1;
    --line-dark:rgba(255,255,255,0.10);
    --brand:#e80000;
    --brand-dark:#c40000;
    --brand-soft:#fdeaea;
    --live:#ff4d5e;
    --ok:#2fbf71;
    --radius:16px;
    --radius-lg:22px;
    --maxw:1180px;
    --shadow:0 20px 50px rgba(11,18,32,0.10);
    --shadow-sm:0 2px 10px rgba(11,18,32,0.06);
    --shadow-win:0 40px 90px rgba(3,8,18,0.55),0 0 0 1px rgba(255,255,255,0.06);
    --sans:"Inter","Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,Helvetica,Arial,sans-serif;
    --mono:"IBM Plex Mono",ui-monospace,Consolas,"Liberation Mono",monospace;
    --nav-h:68px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased;font-size:16px;}
img,picture,svg{max-width:100%;display:block;}
img{height:auto;}
a{color:inherit;text-decoration:none;}
p{margin:0 0 1em;}
h1,h2,h3,h4{margin:0;line-height:1.15;}
button,input,select,textarea{font:inherit;color:inherit;}
[id]{scroll-margin-top:calc(var(--nav-h) + 12px);}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:24px;}
@media(max-width:600px){.wrap{padding-inline:18px;}}
.mono{font-family:var(--mono);}
.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;}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:10px 14px;border-radius:10px;font-weight:650;}
.skip:focus{top:12px;}

:focus-visible{outline:3px solid #ff7a7a;outline-offset:3px;border-radius:6px;}
.dark :focus-visible,.hero :focus-visible{outline-color:#ffb3b3;}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:13px 22px;border-radius:999px;font-weight:650;font-size:15px;line-height:1.2;border:1px solid transparent;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,background .12s ease,border-color .12s ease;white-space:nowrap;}
.btn .arr{font-family:var(--mono);font-weight:500;transition:transform .12s ease;}
.btn:hover .arr{transform:translateX(3px);}
.btn-primary{background:var(--brand);color:#fff;box-shadow:0 8px 22px rgba(232,0,0,0.28);}
.btn-primary:hover{background:var(--brand-dark);transform:translateY(-1px);}
.btn-ghost{background:rgba(255,255,255,0.04);border-color:rgba(255,255,255,0.24);color:#fff;}
.btn-ghost:hover{background:rgba(255,255,255,0.10);}
.btn-line{background:#fff;border-color:var(--line);color:var(--ink);box-shadow:var(--shadow-sm);}
.btn-line:hover{border-color:#c9d5e4;transform:translateY(-1px);}
.btn-dark{background:var(--ink);color:#fff;}
.btn-dark:hover{background:var(--ink-3);transform:translateY(-1px);}
.btn-sm{padding:10px 16px;font-size:14px;}
.link-arrow{display:inline-flex;align-items:center;gap:8px;font-weight:650;color:var(--brand-dark);}
.link-arrow .arr{font-family:var(--mono);transition:transform .12s ease;}
.link-arrow:hover .arr{transform:translateX(3px);}
.dark .link-arrow{color:#ff9a9a;}

/* ---------- Tally / chips / tags ---------- */
.tally{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:4px 9px;border-radius:5px;border:1px solid var(--line);color:var(--muted);white-space:nowrap;line-height:1.3;}
.tally.on{background:var(--brand);border-color:var(--brand);color:#fff;}
.tally.on::before{content:"";width:7px;height:7px;border-radius:999px;background:#fff;animation:blink 1.6s ease-in-out infinite;}
.tally.next{border-color:#b9e6c9;background:#effaf3;color:#1d7a43;}
.tally.soon{border-color:#f1d9a6;background:#fff7e6;color:#8a5a00;letter-spacing:.06em;}
.dark .tally{border-color:rgba(255,255,255,.18);color:#c9d6e8;}
@keyframes blink{50%{opacity:.35;}}
.sec-tag{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-dark);}
.sec-tag::before{content:"";width:18px;height:2px;background:currentColor;border-radius:2px;}
.dark .sec-tag{color:#ff9a9a;}

/* ---------- Nav ---------- */
header.nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,0.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;height:var(--nav-h);}
.brand{display:flex;align-items:center;gap:12px;flex:none;}
.brand img{height:30px;width:auto;}
.brand .by{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--muted);text-transform:uppercase;border-left:1px solid var(--line);padding-left:12px;line-height:1.3;}
@media(max-width:1180px){.brand .by{display:none;}}
.nav-links{display:flex;align-items:center;gap:28px;}
.nav-links a{color:var(--muted);font-weight:560;font-size:15px;transition:color .12s;}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--ink);}
.nav-cta{display:flex;align-items:center;gap:16px;}
.nav-login{color:var(--muted);font-weight:560;font-size:14.5px;}
.nav-login:hover{color:var(--ink);}
.nav-toggle{display:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:#fff;cursor:pointer;align-items:center;justify-content:center;}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{display:block;width:18px;height:2px;border-radius:2px;background:var(--ink);position:relative;transition:transform .15s ease,background .15s ease;}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0;}
.nav-toggle span::before{top:-6px;}
.nav-toggle span::after{top:6px;}
.nav-toggle[aria-expanded="true"] span{background:transparent;}
.nav-toggle[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg);}
.nav-panel{display:none;}
@media(max-width:980px){
    .nav-links,.nav-login{display:none;}
    .nav-toggle{display:inline-flex;}
    .nav-panel{position:absolute;left:0;right:0;top:var(--nav-h);background:#fff;border-bottom:1px solid var(--line);box-shadow:0 24px 40px rgba(11,18,32,.12);padding:10px 18px 22px;}
    .nav-panel.open{display:block;}
    .nav-panel a{display:block;padding:13px 6px;font-weight:620;font-size:17px;border-bottom:1px solid var(--line);}
    .nav-panel a:last-child{border-bottom:0;}
    .nav-panel .btn{margin-top:14px;width:100%;}
}
@media(max-width:420px){.nav-cta .btn-primary{padding:11px 15px;font-size:14px;} .brand img{height:26px;}}

/* ---------- Sections ---------- */
section{padding:104px 0;position:relative;}
@media(max-width:900px){section{padding:76px 0;}}
.soft{background:var(--soft);}
.dark{background:var(--ink);color:#e6eef9;}
h2.h2{font-size:clamp(30px,3.8vw,46px);font-weight:830;letter-spacing:-0.9px;margin:14px 0 16px;}
.lede{font-size:18.5px;color:var(--muted);max-width:620px;}
.dark .lede{color:var(--muted-dark);}
.sec-head{max-width:760px;margin:0 0 56px;}
.sec-head.center{margin-inline:auto;text-align:center;}
.sec-head.center .lede{margin-inline:auto;}
.head-split{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:end;margin-bottom:56px;}
.head-split .lede{justify-self:end;margin:0;}
@media(max-width:900px){.head-split{grid-template-columns:1fr;gap:4px;margin-bottom:40px;} .head-split .lede{justify-self:start;}}
.grid-kids>*{min-width:0;}

/* ---------- Reveal ---------- */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);}
.js .reveal.in{opacity:1;transform:none;}
.js .reveal.d1{transition-delay:.08s;} .js .reveal.d2{transition-delay:.16s;} .js .reveal.d3{transition-delay:.24s;}

/* ---------- Window frame (product screenshots) ---------- */
.win{position:relative;background:#0d1322;border-radius:14px;overflow:hidden;box-shadow:var(--shadow-win);isolation:isolate;}
.win-bar{display:flex;align-items:center;gap:12px;height:34px;padding:0 14px;background:linear-gradient(#1a2335,#141c2c);border-bottom:1px solid rgba(255,255,255,.06);}
.win-dots{display:flex;gap:7px;flex:none;}
.win-dots i{width:10px;height:10px;border-radius:999px;background:#3a465c;}
.win-dots i:first-child{background:#ff5f57;} .win-dots i:nth-child(2){background:#febc2e;} .win-dots i:nth-child(3){background:#28c840;}
.win-url{flex:1;display:flex;justify-content:center;min-width:0;}
.win-url span{font-family:var(--mono);font-size:11.5px;color:#8fa3bd;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);border-radius:7px;padding:3px 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;}
.win-title{font-family:var(--mono);font-size:11.5px;color:#8fa3bd;letter-spacing:.06em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.win img{width:100%;}
.win.light{box-shadow:0 30px 70px rgba(11,18,32,.22),0 0 0 1px rgba(11,18,32,.06);}
@media(max-width:600px){.win-bar{height:28px;padding:0 10px;} .win-dots i{width:8px;height:8px;} .win-url span{font-size:10px;padding:2px 8px;}}

/* Monitor (Player output) */
.monitor{position:relative;border-radius:14px;background:#05080f;padding:12px;box-shadow:var(--shadow-win);}
.monitor-screen{position:relative;border-radius:6px;overflow:hidden;aspect-ratio:16/9;background:#000;}
.monitor-screen img{width:100%;height:100%;object-fit:cover;}
.monitor-hud{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px 16px;padding:14px 6px 0;font-family:var(--mono);font-size:12px;color:var(--muted);}
.monitor-hud b{color:var(--ink);font-weight:600;}
.monitor .tally{position:absolute;top:22px;left:22px;z-index:2;}

/* ---------- Hero ---------- */
.hero{position:relative;color:#e6eef9;background:
    radial-gradient(1100px 600px at 12% -12%, rgba(232,0,0,0.20), transparent 60%),
    radial-gradient(900px 600px at 100% 0%, rgba(80,110,255,0.14), transparent 55%),
    linear-gradient(180deg,#0a101d 0%, #0d1628 70%, #0f1a2e 100%);
    padding:84px 0 0;overflow:hidden;overflow:clip;}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
    background-image:linear-gradient(rgba(255,255,255,0.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.035) 1px,transparent 1px);
    background-size:48px 48px;-webkit-mask-image:radial-gradient(900px 520px at 50% 18%,#000,transparent 75%);mask-image:radial-gradient(900px 520px at 50% 18%,#000,transparent 75%);}
.hero-copy{position:relative;z-index:2;max-width:880px;margin:0 auto;text-align:center;}
.hero-eyebrow{display:inline-flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;font-family:var(--mono);font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:#ffb8b8;}
.hero-eyebrow .tc{color:#8fa3bd;letter-spacing:.08em;}
.hero h1{font-size:clamp(38px,6vw,70px);line-height:1.02;font-weight:860;letter-spacing:-1.8px;margin:22px 0 22px;color:#fff;}
.hero h1 .accent{display:block;color:transparent;background:linear-gradient(90deg,#ff3b3b,#ff7a59);-webkit-background-clip:text;background-clip:text;}
.hero .sub{font-size:clamp(17px,1.6vw,20px);color:#bccadd;max-width:680px;margin:0 auto 32px;}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;}
.hero-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:30px;}
.chip{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);font-size:13.5px;color:#c7d4e6;}
.chip b{color:#fff;font-weight:680;}
.chip .dot{width:6px;height:6px;border-radius:999px;background:var(--brand);}
@media(max-width:600px){.hero-eyebrow .tc{display:none;} .hero{padding-top:56px;} .hero h1{letter-spacing:-1px;} .hero-cta .btn{flex:1 1 auto;}}

/* Hero product composition */
.stage{position:relative;z-index:1;margin:64px auto 0;max-width:1180px;padding:0 24px;}
.stage-main{position:relative;z-index:2;margin:0 auto;max-width:1040px;transform-origin:50% 0;}
.stage-side{position:absolute;z-index:1;width:40%;top:-26px;left:-1%;opacity:.55;filter:saturate(.8);}
.stage-float{position:absolute;z-index:3;width:38%;right:-2%;bottom:-6%;}
.stage-callout{position:absolute;z-index:4;display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;background:rgba(13,19,34,.92);border:1px solid rgba(255,255,255,.12);box-shadow:0 18px 40px rgba(0,0,0,.45);font-size:13px;color:#dbe5f3;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}
.stage-callout .k{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:#8fa3bd;text-transform:uppercase;display:block;}
.stage-callout b{font-weight:680;color:#fff;}
.stage-callout.c1{left:1%;bottom:16%;}
.stage-callout.c2{right:6%;top:-22px;}
.stage-fade{position:relative;height:120px;margin-top:-120px;z-index:5;background:linear-gradient(rgba(15,26,46,0),#0f1a2e);pointer-events:none;display:none;}
@media(max-width:1100px){.stage-side{display:none;} .stage-float{width:42%;right:0;}}
@media(max-width:760px){.stage{margin-top:44px;padding:0 14px;} .stage-float{position:relative;width:88%;right:auto;bottom:auto;margin:-40px 0 0 auto;} .stage-callout{display:none;}}
.js .stage-main{animation:rise 1s cubic-bezier(.2,.7,.2,1) both .1s;}
.js .stage-float{animation:rise 1s cubic-bezier(.2,.7,.2,1) both .35s;}
.js .stage-callout{animation:pop .6s cubic-bezier(.2,.7,.2,1) both .8s;}
@keyframes rise{from{opacity:0;transform:translateY(40px);}to{opacity:1;transform:none;}}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.96);}to{opacity:1;transform:none;}}
.hero-base{position:relative;z-index:0;height:110px;background:var(--bg);margin-top:-110px;}

/* ---------- Logos (social proof) ---------- */
.proof{padding:36px 0 40px;border-bottom:1px solid var(--line);}
.proof-inner{display:flex;align-items:center;gap:22px 48px;flex-wrap:wrap;justify-content:center;}
.proof-label{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);}
.proof-logos{display:flex;align-items:center;gap:26px 54px;flex-wrap:wrap;justify-content:center;}
.proof-logos img{height:44px;width:auto;filter:grayscale(1);opacity:.75;transition:filter .2s ease,opacity .2s ease;}
.proof-logos img.tall{height:58px;}
.proof-logos a:hover img,.proof-logos a:focus-visible img{filter:none;opacity:1;}
.proof-note{font-size:14px;color:var(--muted);}
.proof-note a{color:var(--brand-dark);font-weight:650;}

/* ---------- Outcome cards ---------- */
.outcomes{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
@media(max-width:960px){.outcomes{grid-template-columns:1fr 1fr;}}
@media(max-width:620px){.outcomes{grid-template-columns:1fr;}}
.oc{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px 26px 26px;box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;}
.oc:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#d6e0ec;}
.oc .n{font-family:var(--mono);font-size:12px;color:var(--brand-dark);letter-spacing:.1em;font-weight:600;}
.oc h3{font-size:19.5px;font-weight:760;margin:12px 0 9px;letter-spacing:-.2px;}
.oc p{margin:0;color:var(--muted);font-size:15.5px;}
.oc .how{display:block;margin-top:14px;padding-top:12px;border-top:1px dashed var(--line);font-family:var(--mono);font-size:12px;color:#7a8aa0;}

/* ---------- Product blocks ---------- */
.pblock{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center;}
.pblock+.pblock{margin-top:120px;}
.pblock.flip{grid-template-columns:1.1fr .9fr;}
.pblock.flip .pcopy{order:2;}
@media(max-width:960px){.pblock,.pblock.flip{grid-template-columns:1fr;gap:34px;} .pblock.flip .pcopy{order:0;} .pblock+.pblock{margin-top:84px;}}
.pname{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);}
.pname .ic{width:34px;height:34px;border-radius:10px;background:var(--ink);display:grid;place-items:center;color:#fff;flex:none;}
.pname .ic svg{width:18px;height:18px;}
.pcopy h3{font-size:clamp(28px,3.2vw,40px);font-weight:830;letter-spacing:-.8px;margin:14px 0 14px;}
.pcopy>p{color:var(--muted);font-size:17.5px;}
.ticks{list-style:none;padding:0;margin:22px 0 26px;display:grid;gap:14px;}
.ticks li{display:grid;grid-template-columns:24px 1fr;gap:12px;font-size:15.5px;color:#324258;}
.ticks li b{color:var(--ink);font-weight:680;}
.ticks li::before{content:"";width:22px;height:22px;border-radius:7px;margin-top:1px;background:var(--brand-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%23c40000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat;}
.dark .ticks li{color:#c3d0e2;}
.dark .ticks li b{color:#fff;}
.dark .ticks li::before{background-color:rgba(232,0,0,.18);}
.pvisual{position:relative;}
.pvisual .win+.win{margin-top:0;}
.pv-stack{position:relative;padding-bottom:16%;}
.pv-stack .win:first-child{width:92%;}
.pv-stack .win.front{position:absolute;right:0;bottom:0;width:56%;}
@media(max-width:600px){.pv-stack{padding-bottom:0;} .pv-stack .win:first-child{width:100%;} .pv-stack .win.front{position:relative;width:86%;margin:-22% 0 0 auto;}}

/* ---------- How it works (steps + tabs) ---------- */
.steps{display:grid;grid-template-columns:360px 1fr;gap:48px;align-items:start;}
@media(max-width:1020px){.steps{grid-template-columns:1fr;gap:28px;}}
.step-list{display:grid;gap:10px;counter-reset:st;}
.step-btn{display:grid;grid-template-columns:40px 1fr;gap:4px 14px;align-items:start;text-align:left;width:100%;padding:18px 18px;border-radius:14px;border:1px solid var(--line);background:#fff;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease;}
.step-btn .num{grid-row:span 2;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-family:var(--mono);font-weight:600;font-size:14px;background:var(--soft-2);color:var(--muted);transition:background .15s ease,color .15s ease;}
.step-btn .t{font-weight:740;font-size:17px;}
.step-btn .d{font-size:14.5px;color:var(--muted);}
.step-btn[aria-selected="true"]{border-color:#f3b3b3;box-shadow:0 12px 30px rgba(232,0,0,.10);}
.step-btn[aria-selected="true"] .num{background:var(--brand);color:#fff;}
.step-btn:hover{border-color:#cfdae8;}
.step-panels{position:relative;min-width:0;}
.step-panel .cap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:18px;font-size:14.5px;color:var(--muted);}
.js .steps.tabs-on .step-panel[hidden]{display:none!important;}
.js .steps.tabs-on .step-panel{animation:fadein .35s ease both;}
@keyframes fadein{from{opacity:.2;transform:translateY(8px);}to{opacity:1;transform:none;}}
.no-tabs .step-list{display:none;}
.no-tabs .step-panel+.step-panel{margin-top:48px;}
.step-panel h3.mobile-t{display:none;}
@media(max-width:1020px){
    .js .steps .step-list{display:none;}
    .js .steps .step-panel[hidden]{display:block!important;}
    .step-panel+.step-panel{margin-top:44px;}
    .step-panel h3.mobile-t{display:flex;gap:12px;align-items:baseline;font-size:20px;font-weight:760;margin-bottom:6px;}
    .step-panel h3.mobile-t span{font-family:var(--mono);font-size:13px;color:var(--brand-dark);}
    .step-panel p.mobile-d{display:block;color:var(--muted);margin-bottom:16px;}
}
.step-panel p.mobile-d{display:none;}

/* ---------- Automation ---------- */
.auto{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:center;}
@media(max-width:1020px){.auto{grid-template-columns:1fr;gap:40px;}}
.rules{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:26px 0 28px;}
@media(max-width:560px){.rules{grid-template-columns:1fr;}}
.rule{border:1px solid var(--line);border-radius:14px;padding:16px 16px 15px;background:#fff;}
.rule h4{font-size:15.5px;font-weight:720;margin-bottom:5px;display:flex;align-items:center;gap:8px;}
.rule p{margin:0;font-size:14.2px;color:var(--muted);line-height:1.5;}
.rule code{font-family:var(--mono);font-size:12px;background:var(--soft-2);border-radius:5px;padding:1px 6px;color:#34445e;}
.timing{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.timing span{font-family:var(--mono);font-size:11.5px;padding:3px 8px;border-radius:5px;border:1px solid var(--line);color:#34445e;background:#fff;}
.timing span.hard{border-color:#f1b0b0;color:#a40000;background:#fff5f5;}
.timing span.cue{border-color:#f1d9a6;color:#8a5a00;background:#fff9ec;}
.auto-visual{position:relative;padding-bottom:22%;}
.auto-visual .win.main{width:100%;}
.auto-visual .win.grid{position:absolute;left:-6%;bottom:0;width:52%;}
.auto-visual .badge{position:absolute;right:4%;bottom:6%;z-index:3;}
@media(max-width:700px){.auto-visual{padding-bottom:0;} .auto-visual .win.grid{position:relative;left:auto;width:80%;margin-top:-18%;}}

/* ---------- Reliability ---------- */
.rel{background:
    radial-gradient(900px 500px at 88% 0%, rgba(232,0,0,.14), transparent 60%),
    linear-gradient(170deg,#0a101d,#0f1a2e);color:#e6eef9;overflow:hidden;}
.rel-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;margin-top:40px;}
@media(max-width:960px){.rel-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:620px){.rel-grid{grid-template-columns:1fr;}}
.rc{border:1px solid var(--line-dark);background:rgba(255,255,255,.03);border-radius:var(--radius);padding:24px 22px;}
.rc .k{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:#8fa3bd;}
.rc h3{font-size:18.5px;font-weight:740;margin:10px 0 8px;color:#fff;}
.rc p{margin:0;color:var(--muted-dark);font-size:15px;}
.rc a{display:inline-block;margin-top:12px;font-size:14px;}

/* fallback timeline */
.tl{position:relative;border:1px solid var(--line-dark);border-radius:var(--radius-lg);padding:26px 26px 22px;background:rgba(5,9,18,.55);}
.tl-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px;}
.tl-top .t{font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:#8fa3bd;text-transform:uppercase;}
.tl-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:#a9b8cc;}
.tl-legend i{display:inline-block;width:12px;height:8px;border-radius:2px;margin-right:6px;vertical-align:0;}
.tl-track{position:relative;height:58px;border-radius:10px;background:rgba(255,255,255,.04);overflow:hidden;display:flex;}
.tl-seg{position:relative;height:100%;display:flex;align-items:center;padding:0 12px;font-family:var(--mono);font-size:11.5px;color:#fff;white-space:nowrap;overflow:hidden;border-right:2px solid #0b1220;}
.tl-seg.pl{background:linear-gradient(180deg,#2a3f63,#22354f);}
.tl-seg.em{background:repeating-linear-gradient(135deg,#7a1010 0 10px,#8d1515 10px 20px);}
.tl-seg.ov{background:linear-gradient(180deg,#c40000,#a30000);}
.tl-seg small{opacity:.75;margin-left:8px;}
.tl-head{position:absolute;top:-6px;bottom:-6px;width:2px;background:#fff;box-shadow:0 0 12px rgba(255,255,255,.7);left:8%;}
.js .tl-head{animation:playhead 12s linear infinite;}
@keyframes playhead{from{left:2%;}to{left:98%;}}
.tl-scale{display:flex;justify-content:space-between;margin-top:8px;font-family:var(--mono);font-size:11px;color:#6f819b;}
.tl-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px;font-size:13.5px;color:#a9b8cc;}
.tl-notes b{color:#fff;font-weight:650;}
@media(max-width:700px){.tl-notes{grid-template-columns:1fr;} .tl-seg{font-size:10.5px;padding:0 8px;} .tl-seg small{display:none;}}
.rel-split{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;margin-top:64px;}
@media(max-width:960px){.rel-split{grid-template-columns:1fr;}}

/* ---------- Live control (Cue Clock band) ---------- */
.cue-band .win{max-width:1100px;margin:0 auto;}
.cue-points{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:44px;}
@media(max-width:860px){.cue-points{grid-template-columns:1fr;gap:18px;}}
.cue-points h3{font-size:18px;font-weight:740;margin-bottom:6px;display:flex;gap:10px;align-items:center;}
.cue-points p{margin:0;color:var(--muted);font-size:15.5px;}

/* ---------- Bento (integrations) ---------- */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;}
.bx{position:relative;border:1px solid var(--line);border-radius:var(--radius-lg);background:#fff;padding:26px 24px;overflow:hidden;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;}
.bx h3{font-size:19px;font-weight:760;margin:10px 0 8px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.bx p{margin:0;color:var(--muted);font-size:15px;}
.bx .k{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-dark);}
.bx .shot{margin-top:20px;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#0d1322;}
.bx .shot img{width:100%;}
.bx.w3{grid-column:span 3;} .bx.w2{grid-column:span 2;} .bx.w4{grid-column:span 4;} .bx.w6{grid-column:span 6;}
.bx.inkbox{background:var(--ink);border-color:var(--ink);color:#e6eef9;}
.bx.inkbox p{color:var(--muted-dark);}
.bx.inkbox .k{color:#ff9a9a;}
.mini-list{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:8px;font-size:14.5px;color:#34445e;}
.mini-list li{display:flex;gap:10px;align-items:baseline;}
.mini-list li::before{content:"▸";color:var(--brand);font-size:12px;}
@media(max-width:1020px){.bx.w2,.bx.w3,.bx.w4{grid-column:span 3;}}
@media(max-width:680px){.bento{grid-template-columns:1fr;} .bx.w2,.bx.w3,.bx.w4,.bx.w6{grid-column:auto;}}

/* ---------- Architecture ---------- */
.arch{margin-top:26px;border:1px solid var(--line);border-radius:var(--radius-lg);background:linear-gradient(180deg,#fbfcfe,#f3f7fb);padding:34px 30px 28px;}
.arch-row{display:grid;grid-template-columns:1fr 60px 1.1fr 60px 1.2fr;align-items:center;gap:0;}
.anode{position:relative;border:1px solid #d8e1ec;background:#fff;border-radius:14px;padding:16px 16px 14px;box-shadow:var(--shadow-sm);}
.anode .k{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);}
.anode h4{font-size:16.5px;font-weight:760;margin:6px 0 4px;}
.anode p{margin:0;font-size:13.5px;color:var(--muted);line-height:1.45;}
.anode.srv{border-color:#f3b3b3;}
.anode.srv h4{color:var(--brand-dark);}
.anode.drv{background:var(--ink);border-color:var(--ink);color:#e6eef9;}
.anode.drv .k{color:#8fa3bd;} .anode.drv p{color:#a9b8cc;}
.anode+.anode{margin-top:12px;}
.alink{position:relative;height:2px;background:repeating-linear-gradient(90deg,#b7c4d6 0 6px,transparent 6px 11px);margin:0 6px;}
.alink::after{content:"";position:absolute;right:-2px;top:-4px;border:5px solid transparent;border-left-color:#b7c4d6;}
.js .alink{background-size:22px 2px;animation:flow 1.2s linear infinite;}
@keyframes flow{to{background-position:22px 0;}}
.players{display:grid;gap:8px;}
.pl-row{display:grid;grid-template-columns:1fr 26px auto;align-items:center;gap:8px;}
.pl-node{border:1px solid #d8e1ec;background:#fff;border-radius:11px;padding:9px 12px;font-size:14px;font-weight:650;display:flex;justify-content:space-between;gap:10px;align-items:center;box-shadow:var(--shadow-sm);}
.pl-node small{font-family:var(--mono);font-weight:500;font-size:11px;color:var(--muted);}
.pl-arrow{height:2px;background:#b7c4d6;position:relative;}
.pl-arrow::after{content:"";position:absolute;right:-2px;top:-4px;border:5px solid transparent;border-left-color:#b7c4d6;}
.pl-out{font-family:var(--mono);font-size:11.5px;padding:6px 9px;border-radius:7px;background:var(--brand);color:#fff;white-space:nowrap;}
.pl-out.dim{background:#e7edf5;color:#5d6e86;}
.arch-foot{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:22px;padding-top:18px;border-top:1px dashed #d5dfeb;font-size:14px;color:var(--muted);}
.arch-foot b{color:var(--ink);}
@media(max-width:960px){
    .arch{padding:24px 18px;}
    .arch-row{grid-template-columns:1fr;gap:0;}
    .alink{width:2px;height:34px;margin:6px auto;background:repeating-linear-gradient(180deg,#b7c4d6 0 6px,transparent 6px 11px);}
    .alink::after{right:-4px;top:auto;bottom:-6px;border-left-color:transparent;border-top-color:#b7c4d6;}
    .js .alink{animation:none;}
}

/* ---------- Pricing ---------- */
.pricing-toggle{display:inline-flex;align-items:center;gap:4px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px;margin-top:22px;box-shadow:var(--shadow-sm);}
.pricing-toggle button{border:none;background:transparent;padding:9px 18px;border-radius:999px;font-weight:650;font-size:14px;color:var(--muted);cursor:pointer;}
.pricing-toggle button[aria-pressed="true"]{background:var(--ink);color:#fff;}
.save-badge{margin-left:6px;font-size:11.5px;font-weight:700;color:var(--brand-dark);background:var(--brand-soft);padding:3px 8px;border-radius:999px;}
.pricing-toggle button[aria-pressed="true"] .save-badge{background:rgba(255,255,255,.16);color:#fff;}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch;}
@media(max-width:980px){.tiers{grid-template-columns:1fr;max-width:480px;margin:0 auto;}}
.tier{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:30px 28px 28px;display:flex;flex-direction:column;box-shadow:var(--shadow-sm);}
.tier.featured{border-color:var(--brand);box-shadow:0 26px 60px rgba(232,0,0,0.16);}
.tier .flag{position:absolute;top:-13px;left:28px;background:var(--brand);color:#fff;font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:5px 11px;border-radius:6px;}
.tier-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;}
.tier h3{font-size:23px;font-weight:820;letter-spacing:-.3px;}
.tier .tsub{color:var(--muted);font-size:14.5px;margin-top:3px;}
.ch-badge{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--brand-dark);background:var(--brand-soft);border-radius:7px;padding:5px 9px;white-space:nowrap;}
.price{display:flex;align-items:baseline;gap:4px;margin:24px 0 2px;}
.price .cur{font-size:22px;font-weight:700;color:var(--muted);}
.price .amt{font-size:50px;font-weight:860;letter-spacing:-1.5px;line-height:1;}
.price .per{font-size:15px;color:var(--muted);}
.price-note{font-size:13.5px;color:var(--muted);min-height:20px;}
.lic-line{margin-top:18px;padding:11px 13px;border-radius:11px;background:var(--soft);border:1px solid var(--line);font-size:14px;color:#34445e;}
.lic-line b{color:var(--ink);}
.tier ul{list-style:none;padding:0;margin:20px 0 26px;display:flex;flex-direction:column;gap:11px;}
.tier li{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:start;font-size:15px;}
.tier li .ck{color:var(--brand-dark);font-weight:800;line-height:1.5;}
.tier li.off{color:#95a3b6;}
.tier li.off .ck{color:#c2ccd9;}
.tier .btn{width:100%;margin-top:auto;}
.included{margin-top:26px;border:1px solid var(--line);background:#fff;border-radius:var(--radius-lg);padding:22px 26px;display:grid;grid-template-columns:auto 1fr;gap:10px 28px;align-items:center;}
.included .k{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);}
.included ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 10px;}
.included li{font-size:14px;padding:6px 11px;border-radius:999px;background:var(--soft);border:1px solid var(--line);color:#34445e;}
@media(max-width:760px){.included{grid-template-columns:1fr;}}
.custom-band{margin-top:18px;background:var(--ink);color:#e6eef9;border-radius:var(--radius-lg);padding:28px 30px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.custom-band h3{font-size:21px;font-weight:800;margin-bottom:4px;}
.custom-band p{margin:0;color:var(--muted-dark);font-size:15.5px;max-width:640px;}
.price-fine{text-align:center;color:var(--muted);font-size:13.5px;margin:22px auto 0;max-width:760px;}
.price-fine a{text-decoration:underline;text-underline-offset:2px;}

/* ---------- Requirements teaser ---------- */
.req-teaser{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center;}
@media(max-width:900px){.req-teaser{grid-template-columns:1fr;gap:28px;}}
.req-mini{display:grid;gap:12px;}
.rm{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;border:1px solid var(--line);background:#fff;border-radius:14px;padding:16px 18px;}
.rm .ic{width:42px;height:42px;border-radius:12px;background:var(--soft-2);display:grid;place-items:center;color:var(--ink);}
.rm .ic svg{width:22px;height:22px;}
.rm h4{font-size:15.5px;font-weight:720;}
.rm p{margin:0;font-size:14px;color:var(--muted);}
.rm .spec{font-family:var(--mono);font-size:12px;color:#5d6e86;text-align:right;}
@media(max-width:560px){.rm{grid-template-columns:auto 1fr;} .rm .spec{grid-column:2;text-align:left;}}

/* ---------- FAQ ---------- */
.faq{max-width:860px;margin:0 auto;}
.faq details{border-bottom:1px solid var(--line);}
.faq details:first-of-type{border-top:1px solid var(--line);}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:22px 4px;font-size:18px;font-weight:700;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";font-family:var(--mono);font-weight:500;font-size:22px;color:var(--brand-dark);flex:none;transition:transform .2s ease;}
.faq details[open] summary::after{transform:rotate(45deg);}
.faq .a{padding:0 4px 22px;color:var(--muted);font-size:16px;max-width:760px;}
.faq .a p:last-child{margin:0;}

/* ---------- Demo / contact ---------- */
.demo{background:
    radial-gradient(800px 500px at 10% 0%, rgba(232,0,0,.20), transparent 60%),
    linear-gradient(165deg,#0a101d,#0f1a2e);color:#e6eef9;}
.demo-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:56px;align-items:start;}
@media(max-width:960px){.demo-grid{grid-template-columns:1fr;gap:36px;}}
.demo h2{color:#fff;}
.demo .lede{color:var(--muted-dark);}
.person{display:flex;gap:18px;align-items:center;margin-top:30px;padding:18px;border-radius:var(--radius);border:1px solid var(--line-dark);background:rgba(255,255,255,.03);}
.person img{width:84px;height:84px;border-radius:18px;object-fit:cover;flex:none;}
.person .nm{font-weight:760;font-size:17px;color:#fff;}
.person .rl{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:#8fa3bd;text-transform:uppercase;margin:2px 0 6px;}
.person p{margin:0;font-size:14.5px;color:var(--muted-dark);}
.demo-list{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:10px;color:#c3d0e2;font-size:15.5px;}
.demo-list li{display:flex;gap:12px;}
.demo-list li span{font-family:var(--mono);color:#ff9a9a;font-size:13px;margin-top:2px;}
.form{background:#fff;color:var(--ink);border-radius:var(--radius-lg);padding:30px 28px;box-shadow:0 30px 70px rgba(0,0,0,.35);}
.form h3{font-size:21px;font-weight:800;margin-bottom:4px;}
.form .intro{color:var(--muted);font-size:14.5px;margin-bottom:20px;}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media(max-width:560px){.frow{grid-template-columns:1fr;}}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;}
.field label{font-size:13.5px;font-weight:650;color:#34445e;}
.field label .opt{font-weight:500;color:#8a99ad;}
.field input,.field select,.field textarea{width:100%;border:1px solid #d3dce8;border-radius:11px;padding:12px 13px;background:#fbfcfe;font-size:15.5px;transition:border-color .12s ease,box-shadow .12s ease;}
.field textarea{min-height:104px;resize:vertical;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:#e86a6a;box-shadow:0 0 0 4px rgba(232,0,0,.12);background:#fff;}
.field .err{display:none;font-size:13px;color:#b30000;}
.field.invalid input,.field.invalid select{border-color:#e05a5a;}
.field.invalid .err{display:block;}
.form .btn{width:100%;margin-top:6px;padding:15px 22px;}
.form-note{font-size:13px;color:var(--muted);margin-top:14px;}
.form-note a{color:var(--brand-dark);font-weight:650;}
.form-done{display:none;margin-top:14px;padding:12px 14px;border-radius:11px;background:#effaf3;border:1px solid #b9e6c9;color:#1d6b3b;font-size:14px;}
.form-done.show{display:block;}
.contact-line{display:flex;flex-wrap:wrap;gap:12px 30px;margin-top:28px;font-size:14.5px;color:#a9b8cc;}
.contact-line a{color:#fff;font-weight:650;}
.contact-line .k{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#6f819b;}

/* ---------- Footer ---------- */
footer.foot{background:#070c16;color:#8fa3bd;padding:64px 0 30px;font-size:14.5px;}
.foot-grid{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:32px;}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr;} .foot-brand{grid-column:1/-1;}}
.foot-brand img{height:28px;width:auto;margin-bottom:14px;}
.foot-brand p{max-width:320px;color:#7f93ad;margin:0;}
.foot h4{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:#6f819b;font-weight:600;margin-bottom:14px;}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:9px;}
.foot a{color:#b7c6da;}
.foot a:hover{color:#fff;}
.foot-bottom{display:flex;justify-content:space-between;gap:14px 28px;flex-wrap:wrap;margin-top:48px;padding-top:22px;border-top:1px solid rgba(255,255,255,.07);font-size:13px;color:#6f819b;}
.foot-bottom a{color:#8fa3bd;}

/* ---------- Requirements page ---------- */
.page-hero{background:linear-gradient(170deg,#0a101d,#0f1a2e);color:#e6eef9;padding:72px 0 64px;position:relative;overflow:hidden;}
.page-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,0.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.035) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(700px 400px at 70% 0%,#000,transparent 75%);mask-image:radial-gradient(700px 400px at 70% 0%,#000,transparent 75%);}
.page-hero .wrap{position:relative;}
.crumbs{font-family:var(--mono);font-size:12.5px;color:#8fa3bd;margin-bottom:18px;}
.crumbs a{color:#c3d0e2;}
.page-hero h1{font-size:clamp(34px,4.6vw,54px);font-weight:850;letter-spacing:-1.2px;color:#fff;margin-bottom:16px;}
.page-hero p{font-size:18.5px;color:#bccadd;max-width:720px;margin:0;}
.toc{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px;}
.toc a{font-size:14px;padding:7px 13px;border-radius:999px;border:1px solid rgba(255,255,255,.14);color:#dbe5f3;}
.toc a:hover{background:rgba(255,255,255,.08);}
.spec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
@media(max-width:960px){.spec-grid{grid-template-columns:1fr;max-width:560px;}}
.spec-card{border:1px solid var(--line);background:#fff;border-radius:var(--radius-lg);padding:26px 24px;box-shadow:var(--shadow-sm);}
.spec-card.hl{border-color:var(--brand);box-shadow:0 22px 50px rgba(232,0,0,.12);}
.spec-card .role{font-size:20px;font-weight:800;}
.spec-card .for{font-family:var(--mono);font-size:12px;color:var(--muted);margin:4px 0 18px;letter-spacing:.04em;}
.spec-card dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 16px;font-size:15px;}
.spec-card dt{font-weight:700;color:var(--ink);}
.spec-card dd{margin:0;color:var(--muted);}
.req-section+.req-section{margin-top:72px;}
.req-section h2{font-size:clamp(24px,2.6vw,32px);font-weight:820;letter-spacing:-.5px;margin-bottom:12px;}
.req-section>p{color:var(--muted);max-width:760px;font-size:16.5px;}
.note-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px;}
@media(max-width:860px){.note-grid{grid-template-columns:1fr;}}
.note{border:1px solid var(--line);border-radius:var(--radius);background:var(--soft);padding:20px 22px;font-size:15px;color:#3b4b61;}
.note h3{font-size:16.5px;font-weight:740;color:var(--ink);margin-bottom:6px;}
.note p{margin:0 0 8px;} .note p:last-child{margin:0;}
.table-wrap{overflow-x:auto;margin-top:18px;border:1px solid var(--line);border-radius:var(--radius);}
table.t{width:100%;border-collapse:collapse;font-size:15px;min-width:560px;}
table.t th,table.t td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--line);vertical-align:top;}
table.t th{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);background:var(--soft);font-weight:600;}
table.t tr:last-child td{border-bottom:0;}
table.t td code{font-family:var(--mono);font-size:13.5px;background:var(--soft-2);padding:2px 7px;border-radius:6px;}
.cta-strip{margin-top:80px;background:var(--ink);color:#e6eef9;border-radius:var(--radius-lg);padding:32px 34px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;}
.cta-strip h3{font-size:22px;font-weight:800;color:#fff;}
.cta-strip p{margin:4px 0 0;color:var(--muted-dark);}
.cta-strip .btns{display:flex;gap:12px;flex-wrap:wrap;}

/* ---------- Architecture: switcher and monitoring ---------- */
.sw-box{margin-top:6px;display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--ink);color:#fff;border-radius:11px;padding:10px 12px;}
.sw-box .k{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#8fa3bd;}
.sw-box b{font-size:14.5px;font-weight:700;}
.silde-tag{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;color:#1d6b3b;background:#effaf3;border:1px solid #b9e6c9;border-radius:9px;padding:6px 10px;}
.silde-tag .okdot{flex:none;width:7px;height:7px;border-radius:9px;background:var(--ok);}
.rel-split+.rel-split{margin-top:80px;}

/* ---------- Motion preferences ---------- */
@media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}
    .js .reveal{opacity:1;transform:none;}
    .js .tl-head{animation:none;left:62%;}
}