/* Hallmark · pre-emit critique: P5 H4 E5 S4 R5 V4 · macrostructure: Stat-Led hero + splits · theme: custom azure-infra (dark) · genre: modern-minimal */
@font-face{font-family:"Inter";font-style:normal;font-weight:400 800;font-display:swap;src:url("/assets/fonts/inter-latin.woff2") format("woff2")}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:500 700;font-display:swap;src:url("/assets/fonts/spacegrotesk-latin.woff2") format("woff2")}
:root{
  --color-paper:#060b17; --color-paper-2:#0a1330; --color-surface:#0d1730; --color-surface-2:#122044;
  --color-line:#22345e; --color-line-bright:rgba(0,170,240,.45);
  --color-accent:#0090d0; --color-accent-deep:#006fa3; --color-accent-bright:#6fc7ff;
  --color-accent-soft:rgba(0,144,208,.13); --color-violet:#7c5cff; --color-teal:#00c6a7; --color-gold:#f5a623;
  --color-bloom-navy:rgba(20,48,110,.55); --color-bloom-violet:rgba(124,92,255,.10); --color-bloom-teal:rgba(0,198,167,.08);
  --color-ink:#eef4ff; --color-muted:#93a5c8; --color-faint:#c8dcf7; --color-white:#fff; --color-danger:#e84040;
  --color-wa1:#2fe07a; --color-wa2:#12a94b;
  --font-display:"Space Grotesk","Inter",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --font-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"JetBrains Mono",monospace;
  --radius:14px; --max:1280px;
  --space-xs:8px; --space-sm:16px; --space-md:24px; --space-lg:40px; --space-xl:64px;
  --shadow-1:0 1px 2px rgba(2,6,16,.5); --shadow-2:0 8px 28px -12px rgba(2,6,16,.7);
}
*{box-sizing:border-box}
html,body{overflow-x:clip}
html{scroll-behavior:smooth}
body{margin:0;color:var(--color-ink);font:400 16px/1.65 var(--font-body);background:
  radial-gradient(1000px 440px at 75% -10%,rgba(20,48,110,.5) 0%,transparent 60%),
  var(--color-paper)}
h1,h2,h3{line-height:1.16;margin:0 0 .6em;letter-spacing:-.015em;font-family:var(--font-display);font-style:normal;font-weight:700;overflow-wrap:anywhere;min-width:0}
h1{font-size:clamp(2.1rem,4.8vw,3.4rem);font-weight:700}
h2{font-size:clamp(1.4rem,3vw,2rem)}
a{color:var(--color-accent-bright)}a:hover{color:var(--color-teal)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--color-teal);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
section.block{padding:64px 0;position:relative}
.eyebrow{display:inline-block;font:700 .76rem/1 var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--color-faint);border:1px solid var(--color-line-bright);background:var(--color-accent-soft);padding:8px 14px;border-radius:20px;margin-bottom:14px}
.kicker{display:block;font:700 .76rem/1.4 var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--color-muted);margin-bottom:12px}
/* ---------- topbar ---------- */
.topbar{background:var(--color-paper-2);border-bottom:1px solid var(--color-line);font-size:.82rem}
.topbar-in{display:flex;align-items:center;gap:14px;min-height:34px}
.topbar .facts{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.06em;color:var(--color-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar .facts b{color:var(--color-teal);margin:0 4px}
.topbar a{color:var(--color-muted);text-decoration:none;white-space:nowrap}.topbar a:hover{color:var(--color-white)}
.topbar .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--color-teal);margin-right:6px;animation:pulse 2s infinite}
@keyframes pulse{50%{opacity:.4}}
.top-sep{width:1px;height:14px;background:var(--color-line)}
.top-right{margin-left:auto;display:flex;gap:14px;align-items:center}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--color-accent-deep);color:#fff;padding:10px 18px;z-index:200;border-radius:0 0 8px 0;font-weight:700}
.skip-link:focus{left:0}
/* ---------- header: light surface for black-logo contrast ---------- */
.site-header{position:sticky;top:0;z-index:50;background:#eef1f7;border-bottom:1px solid #d3dbea}
.header-in{display:flex;align-items:stretch;column-gap:15px;min-height:64px}
.logo{align-self:center}
.header-cta{align-self:center}
.mainnav{display:flex;align-items:stretch}
.logo img{height:44px;width:auto;display:block}
.mainnav ul{list-style:none;margin:0;padding:0;display:flex;gap:2px;height:100%}
.mainnav>ul>li{display:flex;align-items:stretch}
.mainnav>ul>li>a{display:flex;align-items:center}
.mainnav>ul>li>a{display:flex;align-items:center;padding:8px 11px;color:#1c2547;text-decoration:none;border-radius:9px;white-space:nowrap;font-size:.94rem;font-weight:600;font-family:var(--font-body)}
.mainnav>ul>li>a:hover{background:rgba(0,144,208,.12);color:#0a1226}
.mainnav>ul>li>a:active{background:rgba(0,144,208,.22)}
.mainnav .has-mega{position:static}
.mainnav .mega{position:absolute;left:0;right:0;top:100%;background:#f7f9fe;border-bottom:1px solid #d3dbea;z-index:60;opacity:0;visibility:hidden;transition:opacity .12s ease,visibility 0s linear .18s;pointer-events:none}
.mainnav .has-mega:hover .mega,.mainnav .has-mega:focus-within .mega{opacity:1;visibility:visible;transition-delay:0s;pointer-events:auto}
.mega-in{max-width:var(--max);margin:0 auto;padding:16px 20px 22px;display:flex;gap:0;align-items:stretch}
.mega-col{flex:1 1 0;min-width:190px;padding:0 22px;border-left:1px solid #dfe6f2}
.mega-col:first-child{border-left:0;padding-left:0}
.mega-col h4{margin:0 0 8px;font:700 .75rem/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--color-accent-deep);font-style:normal}
.mega-col ul{display:block}
.mega-col li{margin:0}
.mega-col a{display:block;color:#3d4763;text-decoration:none;padding:7px 10px;border-radius:7px;font-size:.92rem;line-height:1.35;white-space:normal;overflow-wrap:anywhere}
.mega-col a:hover{background:rgba(0,144,208,.14);color:#0a1226}
.mainnav .active>a{color:var(--color-accent-deep)}
.header-cta{margin-left:auto;display:flex;gap:10px;align-items:center}
.header-cta .btn-ghost{border-color:#b6c1d8;color:#1c2547}
.header-cta .btn-ghost:hover{border-color:var(--color-accent);color:#0a1226;background:rgba(0,144,208,.08)}
.burger{display:none;background:#fff;border:1px solid #b6c1d8;color:#1c2547;border-radius:8px;padding:8px 12px;font-size:1.1rem}
.drawer{display:none}
/* ---------- buttons ---------- */
.btn{display:inline-block;background:var(--color-accent);color:var(--color-white);text-decoration:none;padding:12px 24px;border-radius:10px;font-weight:700;border:1px solid var(--color-accent-deep);cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s}
.btn:hover{color:var(--color-white);background:var(--color-accent-deep);border-color:var(--color-accent-bright)}
.btn:active{transform:translateY(1px)}
.btn-ghost{background:transparent;border:1px solid var(--color-line);color:var(--color-ink)}
.btn-ghost:hover{border-color:var(--color-accent);background:var(--color-accent-soft)}
.btn-gold{background:var(--color-gold);border-color:#b97a12;color:#1d1405}
.btn-gold:hover{background:#ffb63d;color:#1d1405}
.btn-sm{padding:7px 14px;font-size:.9rem}
/* ---------- hero + matrix ---------- */
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--color-line);padding:84px 0 110px;
  background:radial-gradient(900px 380px at 72% -8%,var(--color-bloom-navy) 0%,transparent 62%),linear-gradient(180deg,#0a132c,#060b17)}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;
  background-image:linear-gradient(rgba(0,170,240,.10) 1px,transparent 1px),linear-gradient(90deg,rgba(0,170,240,.10) 1px,transparent 1px);
  background-size:44px 44px;mask-image:radial-gradient(720px 430px at 50% 0%,#000 30%,transparent 75%);
  animation:gridpan 24s linear infinite}
@keyframes gridpan{to{background-position:44px 44px,44px 44px}}
.matrix-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.32;pointer-events:none;mask-image:linear-gradient(180deg,#000 55%,transparent 98%)}
.hero .wrap{position:relative;z-index:2}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:30px;align-items:center}
.hero h1 span{color:var(--color-accent-bright)}
.hero h1 .u{text-decoration:underline;text-decoration-color:var(--color-teal);text-decoration-thickness:4px;text-underline-offset:8px}
.hero .sub{color:var(--color-muted);max-width:660px;font-size:1.08rem}
.infra-line{font-family:var(--font-display);font-weight:700;color:var(--color-white);max-width:660px;margin:.2em 0 .1em}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}
.trust{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.trust .badge{background:var(--color-accent-soft);border:1px solid var(--color-line-bright);border-radius:20px;padding:5px 14px;font-size:.83rem;color:var(--color-faint)}
/* ---------- console feed ---------- */
.console{background:#04070f;border:1px solid var(--color-line);border-radius:var(--radius);overflow:hidden;font-family:var(--font-mono);font-size:.86rem}
.console-label{display:flex;gap:8px;align-items:center;background:#0b1430;padding:9px 16px;color:var(--color-muted);font-size:.75rem;border-bottom:1px solid var(--color-line)}
.console-label .live{width:8px;height:8px;border-radius:50%;background:var(--color-teal)}
.console pre{margin:0;padding:16px 18px;color:#9fd8ff;white-space:pre-wrap}
.console .ok{color:var(--color-teal)}
.cursor{animation:blink 1s steps(1) infinite;color:var(--color-accent-bright)}
@keyframes blink{50%{opacity:0}}
/* Hallmark · pre-emit critique: P5 H5 E5 S5 R4 V5 · macrostructure: Bento Grid (home) · theme: custom azure-infra · design-system: design.md · designed-as-app */
/* ---------- bento + gallery ---------- */
.bento{display:grid;gap:16px;grid-template-columns:repeat(4,minmax(0,1fr))}
.cell-wide{grid-column:span 2}
.gal{display:grid;gap:12px;grid-template-columns:repeat(4,minmax(0,1fr))}
.gal figure{margin:0}
.gal-big{grid-column:span 2;grid-row:span 2}
.gal-big img{height:100%;object-fit:cover;min-height:320px}
.cert-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.cert-row span,.cert-row a{border:1px solid var(--color-line);background:var(--color-surface);border-radius:20px;padding:7px 16px;font-size:.86rem;color:var(--color-faint);text-decoration:none;white-space:nowrap}
.cert-row a{border-color:var(--color-line-bright);color:var(--color-accent-bright);font-weight:700}
/* ---------- photo composition ---------- */
.photo-frame{position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--color-line-bright)}
.photo-frame img{display:block;width:100%;height:auto}
.photo-frame.tall img{max-height:440px;object-fit:cover}
.photo-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(200deg,rgba(0,144,208,.20) 0%,transparent 42%,rgba(6,11,23,.55) 100%);pointer-events:none}
.float-chip{position:absolute;z-index:3;background:rgba(6,12,26,.9);border:1px solid var(--color-line-bright);border-radius:10px;padding:8px 13px;font-family:var(--font-mono);font-size:.78rem;color:var(--color-faint);white-space:nowrap}
.float-chip b{color:var(--color-teal)}
.chip-a{top:14px;left:14px}.chip-b{bottom:14px;right:14px}
.dc-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px;align-items:center}
.pay-pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.pay-pills span{border:1px solid var(--color-line);background:var(--color-surface);border-radius:8px;padding:6px 14px;font-size:.82rem;font-weight:600;color:var(--color-faint);white-space:nowrap}
/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:28px}
.stat{background:var(--color-surface);border:1px solid var(--color-line);border-radius:var(--radius);padding:18px 14px 16px;text-align:center}
.stat b{display:block;font-size:1.6rem;color:var(--color-white);font-variant-numeric:tabular-nums;font-family:var(--font-display)}
.stat b em{font-style:normal;color:var(--color-teal)}
.stat span{color:var(--color-muted);font-size:.83rem}
/* ---------- cards ---------- */
.grid{display:grid;gap:16px}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{background:var(--color-surface);border:1px solid var(--color-line);border-radius:var(--radius);padding:22px;transition:border-color .18s,transform .18s}
.card:hover{border-color:var(--color-line-bright);transform:translateY(-2px)}
.card h3{margin-top:0;font-size:1.12rem}
.card h3 .tick{display:inline-block;width:11px;height:11px;margin-right:10px;background:var(--color-accent);transform:rotate(45deg) translateY(-1px)}
.card p{color:var(--color-muted)}
.card .go{font-weight:700;text-decoration:none}
.cell-wide{grid-column:span 2}
.testi{border-top:3px solid var(--color-teal)}
.testi p:first-child{font-style:italic;color:var(--color-ink)}
/* ---------- marquee ---------- */
.marquee{overflow:hidden;border-top:1px solid var(--color-line);border-bottom:1px solid var(--color-line);background:#070d1f;padding:12px 0;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;gap:44px;white-space:nowrap;width:max-content;animation:scrollx 40s linear infinite;font-family:var(--font-mono);font-size:.88rem;color:var(--color-muted)}
.marquee:hover .marquee-track,.marquee:focus-within .marquee-track{animation-play-state:paused}
.marquee-track b{color:var(--color-teal);font-weight:600}
@keyframes scrollx{to{transform:translateX(-50%)}}
/* ---------- tables ---------- */
.tbl-wrap{overflow-x:auto;border:1px solid var(--color-line);border-radius:var(--radius);background:rgba(10,18,44,.6)}
table.tbl{width:100%;border-collapse:collapse;font-size:.94rem;min-width:680px}
.tbl th,.tbl td{padding:11px 13px;text-align:left;border-bottom:1px solid var(--color-line)}
.tbl th{background:#0d1a3a;font-weight:700;font-size:.82rem;letter-spacing:.05em;text-transform:uppercase;color:#9fc0e8;font-family:var(--font-body)}
.tbl tr:hover td{background:rgba(0,144,208,.06)}
.price{color:var(--color-teal);white-space:nowrap;font-weight:700;font-variant-numeric:tabular-nums}
.mono{font-family:var(--font-mono);font-size:.88em;font-variant-numeric:tabular-nums}
/* ---------- short answer / faq ---------- */
.short-answer{border:1px solid var(--color-line);border-radius:var(--radius);background:var(--color-surface);padding:22px 24px;margin:26px 0;position:relative}
.short-answer::before{content:"“";position:absolute;top:2px;left:16px;font-family:var(--font-display);font-size:3.2rem;color:var(--color-accent);opacity:.5}
.short-answer p{margin:.4em 0 .4em 44px;color:var(--color-ink)}
.short-answer .cite{font-family:var(--font-mono);font-size:.78rem;color:var(--color-muted)}
.faq details{background:var(--color-surface);border:1px solid var(--color-line);border-radius:10px;margin-bottom:10px;padding:14px 18px}
.faq summary{cursor:pointer;font-weight:650;font-family:var(--font-body)}
.faq p{color:var(--color-muted)}
/* ---------- footer ---------- */
.site-footer{background:#050912;border-top:1px solid var(--color-line);margin-top:44px}
.foot-statement{padding:34px 20px 0;font-family:var(--font-display);font-size:clamp(1.2rem,2.6vw,1.7rem);color:var(--color-white)}
.foot-statement span{color:var(--color-accent-bright)}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);gap:24px;padding:26px 20px 20px}
.foot-brand img{height:40px;width:auto}
.foot-brand p,.foot-reg{color:var(--color-muted);font-size:.9rem}
.foot-col h3{font-size:.85rem;color:var(--color-white);letter-spacing:.06em;text-transform:uppercase;font-family:var(--font-body)}
.foot-col ul{list-style:none;margin:0;padding:0}
.foot-col li{margin:7px 0}.foot-col a{color:var(--color-muted);text-decoration:none;white-space:nowrap}.foot-col a:hover{color:var(--color-teal)}
.foot-badges{display:flex;gap:8px;flex-wrap:wrap;padding:0 20px 12px}
.foot-badges .badge{border:1px solid var(--color-line);background:var(--color-surface);border-radius:20px;padding:4px 13px;font-size:.8rem;color:var(--color-faint);text-decoration:none;white-space:nowrap}
/* ---------- cookie consent: compact card, never covers WhatsApp/nav ---------- */
.cookie-bar{position:fixed;left:16px;bottom:16px;z-index:99;max-width:380px;background:#101c3d;border:1px solid var(--color-line);border-radius:var(--radius);padding:16px 18px;box-shadow:0 20px 60px rgba(0,0,0,.55)}
.cookie-bar h2{font-size:.95rem;margin:0 0 6px;font-family:var(--font-body)}
.cookie-bar p{margin:0 0 12px;color:var(--color-muted);font-size:.85rem}
.cookie-bar .row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.cookie-bar .link{font-size:.85rem}
.wa-float{position:fixed;right:16px;bottom:16px;z-index:98;width:54px;height:54px;border-radius:50%;background:var(--color-wa2);display:flex;align-items:center;justify-content:center;text-decoration:none;border:1px solid #0d7a38}
.wa-float svg{width:28px;height:28px;fill:#fff}
.wa-float:hover{background:#159e4e}
.note{background:var(--color-surface);border:1px solid var(--color-line);border-radius:8px;padding:12px 16px;color:var(--color-muted)}
.cta-band{background:var(--color-surface-2);border:1px solid var(--color-line-bright);border-radius:var(--radius);padding:38px;text-align:center}
code.cmd{display:block;background:#04070f;border:1px solid var(--color-line);border-radius:8px;padding:12px 16px;overflow-x:auto;font-family:var(--font-mono);font-size:.88rem}
.copybtn{float:right;background:var(--color-paper-2);border:1px solid var(--color-line);color:var(--color-ink);border-radius:6px;padding:4px 10px;font-size:.8rem;cursor:pointer;white-space:nowrap}
.copybtn:hover{border-color:var(--color-accent)}.copybtn:active{transform:translateY(1px)}
.mega-feat{margin-left:22px;width:280px;flex:none;background:#fff;border:1px solid #d3dbea;border-radius:var(--radius);padding:20px;align-self:center}
.mega-feat span{font:700 .72rem/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:#b97a12}
.mega-feat strong{display:block;font-size:1.15rem;margin:8px 0 4px;color:#0a1226}
.mega-feat p{color:#3d4763;font-size:.88rem;margin:0 0 14px}
/* ---------- technical diagrams ---------- */
.diagram{width:100%;max-width:640px;height:auto;display:block;background:#04070f;border:1px solid var(--color-line);border-radius:10px;padding:14px;margin:18px 0}
.diagram .dg-box{fill:#0d1730;stroke:#22345e;stroke-width:1.2;rx:6}
.diagram .dg-hi{stroke:var(--color-accent);stroke-width:1.6}
.diagram .dg-t{fill:#9fc0e8;font:700 11px var(--font-mono);letter-spacing:.1em}
.diagram .dg-m{fill:#eef4ff;font:600 13px var(--font-mono)}
.diagram .dg-s{fill:#93a5c8;font:400 11.5px var(--font-mono)}
.diagram .dg-a{fill:#00c6a7;font:700 18px var(--font-mono)}
/* ---------- labeled interface mockups (clearly examples, not screenshots) ---------- */
.mock{border:1px solid var(--color-line);border-radius:10px;overflow:hidden;margin:18px 0;background:#04070f}
.mock-bar{display:flex;gap:8px;align-items:center;background:#0b1430;border-bottom:1px solid var(--color-line);padding:9px 14px;font-family:var(--font-mono);font-size:.76rem;color:var(--color-muted)}
.mock-tag{margin-left:auto;font-size:.7rem;border:1px dashed var(--color-line-bright);border-radius:6px;padding:2px 8px;color:var(--color-faint)}
.mock-body{padding:16px 18px;font-family:var(--font-mono);font-size:.84rem;color:#9fc0e8}
.mock-body .row{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid #101c38}
.mock-body .row:last-child{border-bottom:0}
.mock-body .k{color:var(--color-muted)}.mock-body .v{color:var(--color-white)}
.mock-body .pill{display:inline-block;border:1px solid var(--color-line-bright);border-radius:6px;padding:1px 9px;font-size:.74rem;color:var(--color-faint)}
.mock-body .go{color:var(--color-teal)}
/* ---------- server product cards ---------- */
.server-card{background:var(--color-surface);border:1px solid var(--color-line);border-radius:var(--radius);padding:0;overflow:hidden}
.server-card.sel{border-color:var(--color-accent)}
.server-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:16px 20px 12px;border-bottom:1px solid var(--color-line)}
.server-head h3{margin:0;font-size:1.2rem}
.server-head .from{font-family:var(--font-mono);font-size:.78rem;color:var(--color-muted)}
.spec{display:flex;justify-content:space-between;gap:10px;padding:8px 20px;border-bottom:1px solid #101c38;font-size:.92rem}
.spec:last-of-type{border-bottom:0}
.spec .k{color:var(--color-muted)}.spec .v{color:var(--color-white);font-family:var(--font-mono);font-size:.86rem;text-align:right}
.server-price{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 20px;background:#0a1330}
.server-price .p{font-size:1.35rem;font-weight:700;color:var(--color-teal);font-variant-numeric:tabular-nums}
.server-price small{color:var(--color-muted)}
/* ---------- doc lists ---------- */
.checkline{list-style:none;margin:14px 0;padding:0}
.checkline li{padding:7px 0 7px 30px;position:relative;color:var(--color-ink)}
.checkline li::before{content:"✓";position:absolute;left:4px;color:var(--color-teal);font-weight:700}
.checkline li small{display:block;color:var(--color-muted)}
.docstep{border-left:2px solid var(--color-line);margin:0 0 0 6px;padding:0 0 4px 20px}
.docstep h3{margin-bottom:.3em}
/* ---------- technical spec layout (definition rows, not cards) ---------- */
.specgrid{border:1px solid var(--color-line);border-radius:10px;overflow:hidden;margin:18px 0}
.specgrid .row{display:grid;grid-template-columns:220px minmax(0,1fr);gap:14px;padding:11px 18px;border-bottom:1px solid #101c38;font-size:.95rem}
.specgrid .row:last-child{border-bottom:0}
.specgrid dt{margin:0;color:var(--color-white);font-weight:700}
.specgrid dd{margin:0;color:var(--color-muted)}
/* ---------- fleet + map ---------- */
.diagram-wide{max-width:760px}
.fleet3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:760px;margin:0 0 18px}
.fleet-col{border:1px solid var(--color-line);border-radius:10px;background:#04070f;padding:12px 16px;text-align:center}
.fleet-col strong{display:block;color:var(--color-white)}
.fleet-col span{display:block;font-family:var(--font-mono);font-size:.8rem;color:var(--color-muted)}
.diagram .dg-l{stroke:#22345e;stroke-width:1.5}
.diagram .flow{stroke:var(--color-accent);stroke-dasharray:5 6;animation:dashflow 2.6s linear infinite}
@keyframes dashflow{to{stroke-dashoffset:-22}}
.diagram .dg-node{fill:#0d1730;stroke:var(--color-accent);stroke-width:1.6}
.diagram .dg-node-hub{fill:var(--color-accent)}
.diagram .pulse{animation:nodepulse 2.8s ease-in-out infinite}
@keyframes nodepulse{50%{opacity:.45}}
/* ---------- photo strip with captions ---------- */
.strip{display:grid;gap:12px;grid-template-columns:repeat(4,minmax(0,1fr));margin:18px 0}
.strip figure{margin:0}
.strip figcaption{font-family:var(--font-mono);font-size:.76rem;color:var(--color-muted);padding:8px 2px 0}
/* ---------- use-case compact list ---------- */
.uselist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px;margin:14px 0}
.uselist div{padding:9px 0;border-bottom:1px solid #101c38;font-size:.94rem}
.uselist strong{color:var(--color-white)}
.uselist span{color:var(--color-muted)}
/* ---------- CTA rhythm: one primary, calm secondaries ---------- */
.cta-row{display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin:24px 0}
.cta-row .tlink{font-weight:600;white-space:nowrap}
/* ---------- network directory + LG tool ---------- */
.lg-filter{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:0 0 16px}
.lg-filter input[type="search"],.lg-filter select{background:#04070f;border:1px solid var(--color-line);border-radius:8px;color:var(--color-ink);padding:10px 14px;font-size:.92rem;font-family:var(--font-body)}
.lg-filter input[type="search"]{flex:1;min-width:200px}
.chk{display:flex;gap:8px;align-items:center;color:var(--color-muted);font-size:.9rem;white-space:nowrap}
.dim{color:var(--color-muted);font-size:.85rem}
.node-grid{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr))}
.node{background:var(--color-surface);border:1px solid var(--color-line);border-radius:var(--radius);padding:16px 18px}
.node h3{margin:0 0 2px;font-size:1.05rem}
.node .sub{color:var(--color-muted);font-size:.84rem;margin:0 0 10px}
.node .ip{font-family:var(--font-mono);font-size:.82rem;color:var(--color-faint);margin:0 0 10px;overflow-wrap:anywhere}
.node .tests{display:flex;gap:6px;flex-wrap:wrap}
.tbtn{background:var(--color-paper-2);border:1px solid var(--color-line);color:var(--color-ink);border-radius:7px;padding:5px 10px;font-size:.78rem;cursor:pointer;font-family:var(--font-mono);white-space:nowrap}
.tbtn:hover:not(:disabled){border-color:var(--color-accent);color:var(--color-white)}
.tbtn:disabled{opacity:.38;cursor:not-allowed}
.tbtn:active{transform:translateY(1px)}
.lg-out{background:#04070f;border:1px solid var(--color-line);border-radius:10px;padding:14px 18px;font-family:var(--font-mono);font-size:.82rem;color:#9fd8ff;white-space:pre-wrap;overflow-wrap:anywhere;max-height:420px;overflow:auto;margin-top:14px;min-height:64px}
.lg-bar{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 16px}
/* ---------- telemetry visual (illustrative) ---------- */
.telemetry{border:1px solid var(--color-line);border-radius:var(--radius);background:#04070f;padding:18px 20px;font-family:var(--font-mono);font-size:.84rem}
.telemetry .trow{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid #101c38}
.telemetry .trow:last-child{border-bottom:0}
.telemetry .k{color:var(--color-muted)}
.telemetry .v{color:var(--color-white);font-variant-numeric:tabular-nums}
.telemetry .bar{height:6px;border-radius:3px;background:#101c38;margin-top:5px;overflow:hidden}
.telemetry .bar i{display:block;height:100%;background:var(--color-accent);border-radius:3px;animation:barpulse 3.2s ease-in-out infinite}
@keyframes barpulse{50%{filter:brightness(1.5)}}
.telemetry .fine{font-size:.72rem;color:var(--color-muted);margin-top:10px}
/* ---------- icon language (single family, currentColor) ---------- */
.ic{width:17px;height:17px;flex:none}
.icon-chip{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;background:var(--color-accent-soft);border:1px solid var(--color-line-bright);color:var(--color-accent-bright);flex:none}
.feat{display:flex;gap:14px;align-items:flex-start}
.feat h3{margin:0 0 4px;font-size:1.02rem}
.card h3 .h-ic{display:inline-flex;width:28px;height:28px;margin-right:9px;vertical-align:-8px}
.card h3 .h-ic .ic{width:16px;height:16px}
.feat p{margin:0;color:var(--color-muted);font-size:.93rem}
/* ---------- rhythm: alternating bands, no card-everywhere ---------- */
.band{background:var(--color-paper-2);border-top:1px solid var(--color-line-bright);border-bottom:1px solid var(--color-line-bright)}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:center}
.split.rev>.txt{order:2}
.lede{color:var(--color-muted);max-width:680px}
.ticks-mini{list-style:none;margin:14px 0;padding:0;display:grid;gap:8px}
.ticks-mini li{display:flex;gap:10px;align-items:baseline;color:var(--color-ink);font-size:.95rem}
.ticks-mini .ic{width:16px;height:16px;color:var(--color-teal);transform:translateY(3px)}
/* ---------- refined server card ---------- */
.server-card{background:var(--color-surface);border:1px solid var(--color-line-bright);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-2)}
.server-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:18px 22px 14px;border-bottom:1px solid var(--color-line)}
.server-head h3{margin:0;font-size:1.25rem}
.server-head .from{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.1em;color:var(--color-gold);text-transform:uppercase;white-space:nowrap}
/* ---------- quote-led testimonials ---------- */
.quote-big{border-left:3px solid var(--color-accent);padding:6px 0 6px 22px;margin:0}
.quote-big p:first-child{font-size:1.12rem;color:var(--color-ink);font-style:normal}
.quote-big footer{color:var(--color-muted);font-size:.88rem}
/* ---------- footer: mature platform ---------- */
.foot-top{border-bottom:1px solid var(--color-line);padding:26px 20px;display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.foot-top strong{font-family:var(--font-display);font-size:1.05rem}
.foot-top .live{display:inline-flex;align-items:center;gap:8px;color:var(--color-muted);font-size:.88rem}
.foot-top .live i{width:8px;height:8px;border-radius:50%;background:var(--color-teal)}
.foot-bottom{border-top:1px solid var(--color-line);padding:14px 20px;display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;color:var(--color-muted);font-size:.85rem}
/* ---------- hero typed line + fact ticks ---------- */
.typed-wrap{font-family:var(--font-display);font-size:clamp(1.15rem,2.4vw,1.6rem);color:var(--color-teal);min-height:2.2em;margin:.4em 0 0}
.tick-strip{display:flex;gap:16px;flex-wrap:wrap;margin-top:16px;font-family:var(--font-mono);font-size:.8rem;color:var(--color-muted)}
.tick-strip b{color:var(--color-teal)}
.typed-wrap{font-family:var(--font-display);font-size:clamp(1.15rem,2.4vw,1.6rem);color:var(--color-teal);min-height:2.2em;margin:.4em 0 0}
/* ---------- reveal (hero only) ---------- */
.rv{opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease}
.rv.in{opacity:1;transform:none}
/* ---------- responsive ---------- */
@media(max-width:1100px){.mainnav>ul>li>a{padding:12px 7px;font-size:.88rem}.header-cta .btn{padding:10px 14px}}
@media(max-width:1024px){.grid-4,.bento,.gal,.strip,.node-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cell-wide,.gal-big{grid-column:span 2}.stats{grid-template-columns:repeat(3,minmax(0,1fr))}.foot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media(max-width:860px){
  .mainnav{display:none}.burger{display:block}.topbar .facts{display:none}.topbar-in{gap:10px;overflow-x:auto}
  .drawer{display:none;background:#f7f9fe;border-top:1px solid #d3dbea;max-height:70vh;overflow:auto}
  .drawer.open{display:block}.drawer ul{list-style:none;margin:0;padding:10px 20px}
  .drawer li{margin:6px 0}.drawer a{color:#1c2547;text-decoration:none;display:block;padding:8px 0}
  .drawer-top>a{font-weight:700}.drawer-sub a{color:#3d4763!important;font-size:.9rem;padding-left:14px!important}
  .grid-3,.grid-2,.hero-grid,.dc-split,.bento,.gal,.strip,.uselist,.node-grid,.split{grid-template-columns:minmax(0,1fr)}.split.rev>.txt{order:0}.cell-wide,.gal-big{grid-column:span 1}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  section.block{padding:38px 0}.hero{padding:52px 0 64px}.header-cta .btn-ghost{display:none}
  .matrix-canvas{display:none}
  .cookie-bar{left:12px;right:12px;bottom:76px;max-width:none}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}.matrix-canvas{display:none}
  .diagram .flow,.diagram .pulse,.telemetry .bar i{animation:none!important}
}