:root {
  --bg: #080b12;
  --panel: #0d121b;
  --line: rgba(255,255,255,.12);
  --text: #f1f5f7;
  --muted: #9aa5b1;
  --acid: #b7ff39;
  --cyan: #63e9ff;
  --danger: #ff6d6d;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--bg); color:var(--text); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.noise { position:fixed; inset:0; pointer-events:none; z-index:50; opacity:.04; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E"); }
.topbar { height:76px; padding:0 clamp(22px,5vw,72px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); position:absolute; inset:0 0 auto 0; z-index:10; }
.brand { display:flex; align-items:center; gap:12px; font-weight:800; letter-spacing:.12em; font-size:14px; }
.brand-mark { display:grid; place-items:center; width:30px; height:30px; border:1px solid var(--acid); color:var(--acid); font-family:monospace; }
.nav { display:flex; gap:28px; color:#d8dee4; font-size:13px; }
.nav a { opacity:.72; transition:.2s; }
.nav a:hover { opacity:1; color:var(--acid); }
.live { display:flex; align-items:center; gap:8px; font:11px ui-monospace, SFMono-Regular, Menlo, monospace; text-transform:uppercase; letter-spacing:.08em; }
.live span { width:7px; height:7px; border-radius:50%; background:var(--acid); box-shadow:0 0 14px var(--acid); animation:pulse 1.8s infinite; }
.hero { min-height:760px; height:92vh; position:relative; display:flex; align-items:flex-end; overflow:hidden; }
.hero-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.72) contrast(1.15) brightness(.7); transform:scale(1.02); }
.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg, rgba(8,11,18,.96) 0%, rgba(8,11,18,.75) 43%, rgba(8,11,18,.18) 74%), linear-gradient(0deg, var(--bg) 0%, transparent 32%); }
.hero-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(183,255,57,.055) 1px, transparent 1px),linear-gradient(90deg,rgba(183,255,57,.055) 1px, transparent 1px); background-size:48px 48px; mask-image:linear-gradient(to right,black,transparent 80%); }
.hero-content { position:relative; z-index:2; width:min(900px,90vw); margin:0 0 clamp(68px,9vh,110px) clamp(22px,7vw,105px); }
.eyebrow { color:var(--acid); font:700 11px ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing:.16em; text-transform:uppercase; }
h1 { margin:17px 0 24px; max-width:920px; font-size:clamp(48px,7vw,104px); line-height:.88; letter-spacing:-.055em; font-weight:780; }
h1 span { color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.75); }
.lead { max-width:690px; color:#c2c9d0; font-size:clamp(16px,1.4vw,20px); line-height:1.6; }
.hero-actions { display:flex; gap:12px; margin-top:30px; flex-wrap:wrap; }
.btn { min-height:48px; padding:0 21px; border:1px solid var(--line); display:inline-flex; justify-content:center; align-items:center; cursor:pointer; text-transform:uppercase; letter-spacing:.1em; font:700 11px ui-monospace, monospace; transition:.2s; }
.btn.primary { background:var(--acid); color:#0a0d10; border-color:var(--acid); }
.btn.primary:hover { box-shadow:0 0 32px rgba(183,255,57,.23); transform:translateY(-2px); }
.btn.ghost { background:rgba(8,11,18,.5); color:#fff; }
.btn.ghost:hover { border-color:var(--acid); color:var(--acid); }
.metrics { display:flex; gap:0; margin-top:45px; border-top:1px solid var(--line); width:min(650px,100%); }
.metrics div { flex:1; padding:18px 18px 0 0; border-right:1px solid var(--line); }
.metrics div + div { padding-left:18px; }
.metrics strong,.metrics span { display:block; }
.metrics strong { font:700 19px ui-monospace, monospace; }
.metrics span { margin-top:5px; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.hero-status { position:absolute; right:clamp(22px,5vw,72px); bottom:56px; z-index:3; min-width:190px; padding:15px 18px; display:flex; align-items:center; gap:13px; background:rgba(8,11,18,.76); border:1px solid var(--line); backdrop-filter:blur(14px); }
.status-dot { width:11px; height:11px; border:2px solid var(--acid); border-radius:50%; box-shadow:0 0 18px var(--acid); }
.hero-status small,.hero-status b { display:block; font-family:ui-monospace,monospace; }
.hero-status small { color:var(--muted); font-size:9px; letter-spacing:.13em; }
.hero-status b { color:var(--acid); margin-top:3px; font-size:13px; }
.section { padding:110px clamp(22px,7vw,105px); }
.intro { display:grid; grid-template-columns:1.3fr .7fr; gap:9vw; align-items:end; }
.section-heading h2,.signals h2,.cta h2 { margin:15px 0 0; font-size:clamp(34px,5vw,67px); letter-spacing:-.045em; line-height:1.02; }
.section-copy,.signals-copy>p:not(.eyebrow) { color:var(--muted); line-height:1.75; font-size:15px; }
.cards { display:grid; grid-template-columns:1.45fr .8fr .55fr; gap:14px; padding:0 clamp(22px,5vw,72px) 110px; }
.feature-card { min-height:430px; border:1px solid var(--line); position:relative; overflow:hidden; background:var(--panel); }
.feature-wide img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:grayscale(.55) brightness(.58) contrast(1.1); }
.card-overlay { position:absolute; inset:0; background:linear-gradient(0deg,rgba(7,10,15,.95),rgba(7,10,15,.06) 75%); }
.card-content { position:absolute; left:30px; right:30px; bottom:28px; z-index:2; }
.tag { color:var(--cyan); font:700 10px ui-monospace,monospace; letter-spacing:.14em; }
.card-content h3 { max-width:540px; font-size:32px; letter-spacing:-.035em; margin:10px 0; }
.card-content p,.stat-card p { color:#adb6be; max-width:580px; line-height:1.55; font-size:13px; }
.code-card { background:#05080d; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.terminal-head { height:48px; display:flex; align-items:center; gap:6px; padding:0 18px; border-bottom:1px solid var(--line); }
.terminal-head span { width:7px; height:7px; border-radius:50%; border:1px solid #69737c; }
.terminal-head em { margin-left:auto; color:#65707b; font-style:normal; font-size:9px; }
.code-card pre { margin:0; padding:35px 25px; white-space:pre-wrap; color:#97a2ac; font-size:12px; line-height:2; }
.code-card i { color:var(--acid); font-style:normal; }.code-card .ok { color:var(--acid); }.code-card .warn { color:#ffd66b; }.code-card b { color:var(--acid); }
.stat-card { padding:28px; display:flex; flex-direction:column; justify-content:flex-end; }
.big-stat { margin:auto 0 8px; color:var(--acid); font-size:clamp(82px,9vw,150px); line-height:.8; letter-spacing:-.08em; font-weight:800; }
.mini-bars { display:flex; gap:4px; height:56px; align-items:end; margin-top:22px; }
.mini-bars span { flex:1; background:rgba(183,255,57,.34); height:35%; animation:bars 2.5s ease-in-out infinite alternate; }
.mini-bars span:nth-child(2){height:72%;animation-delay:.2s}.mini-bars span:nth-child(3){height:48%;animation-delay:.4s}.mini-bars span:nth-child(4){height:94%;animation-delay:.6s}.mini-bars span:nth-child(5){height:62%;animation-delay:.8s}.mini-bars span:nth-child(6){height:82%;animation-delay:1s}
.signals { display:grid; grid-template-columns:1.15fr .85fr; min-height:650px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.network-image { position:relative; overflow:hidden; min-height:520px; border-right:1px solid var(--line); }
.network-image img { width:100%; height:100%; object-fit:cover; filter:grayscale(.25) saturate(.75) brightness(.63); }
.scanner { position:absolute; left:0; right:0; height:2px; top:0; background:var(--acid); box-shadow:0 0 24px var(--acid); opacity:.75; animation:scan 5s linear infinite; }
.signals-copy { padding:clamp(55px,8vw,115px); display:flex; flex-direction:column; justify-content:center; }
.checks { list-style:none; padding:0; margin:32px 0 0; border-top:1px solid var(--line); }
.checks li { padding:17px 0; border-bottom:1px solid var(--line); text-transform:uppercase; letter-spacing:.08em; font:11px ui-monospace,monospace; }
.checks span { display:inline-block; width:44px; color:var(--acid); }
.cta { padding:130px clamp(22px,7vw,105px); background:radial-gradient(circle at 80% 50%,rgba(99,233,255,.07),transparent 30%); }
.cta h2 { max-width:900px; font-size:clamp(42px,7vw,92px); }
.cta-row { margin-top:45px; display:flex; justify-content:space-between; gap:25px; align-items:center; border-top:1px solid var(--line); padding-top:25px; }
.cta-row p { color:var(--muted); }
footer { min-height:76px; padding:0 clamp(22px,5vw,72px); border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; color:#69737d; font:9px ui-monospace,monospace; letter-spacing:.12em; }
.flash .hero-status { border-color:var(--cyan); box-shadow:0 0 30px rgba(99,233,255,.12); }
.flash #networkState { color:var(--cyan); }
@keyframes pulse { 50% { opacity:.35; } }
@keyframes scan { from { transform:translateY(0); } to { transform:translateY(650px); } }
@keyframes bars { to { transform:scaleY(.55); opacity:.5; } }
@media (max-width: 980px) {
  .nav { display:none; }
  .cards { grid-template-columns:1fr 1fr; }
  .feature-wide { grid-column:1/-1; }
  .intro,.signals { grid-template-columns:1fr; }
  .network-image { border-right:0; border-bottom:1px solid var(--line); }
  .hero-status { display:none; }
}
@media (max-width: 620px) {
  .live { display:none; }
  .hero { min-height:720px; height:auto; padding-top:140px; }
  .hero-content { margin-left:22px; margin-right:22px; }
  .metrics { flex-direction:column; border-top:0; }
  .metrics div,.metrics div + div { border-right:0; border-top:1px solid var(--line); padding:13px 0; }
  .cards { grid-template-columns:1fr; padding-left:14px; padding-right:14px; }
  .feature-wide { grid-column:auto; }
  .feature-card { min-height:390px; }
  .cta-row { align-items:flex-start; flex-direction:column; }
  footer { gap:15px; flex-wrap:wrap; padding-top:22px; padding-bottom:22px; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior:auto !important; animation:none !important; transition:none !important; } }
