:root {
  --bg: #070707;
  --panel: rgba(18, 18, 18, .76);
  --panel-2: rgba(255, 255, 255, .045);
  --gold: #d6b56d;
  --gold-2: #f4d891;
  --text: #f5efe3;
  --muted: #a69d8e;
  --line: rgba(214,181,109,.18);
  --danger: #ff7777;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: radial-gradient(circle at 20% 10%, #24180a 0, transparent 30%), var(--bg);
  color: var(--text);
  font-family: Inter, system-ui, sans-serif;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
.noise { position: fixed; inset: 0; opacity: .08; pointer-events:none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.orb { position: fixed; width: 460px; height: 460px; border-radius: 50%; filter: blur(70px); opacity: .18; pointer-events:none; }
.orb-a { background: #d6b56d; top: -160px; right: -120px; }
.orb-b { background: #6d4218; bottom: -180px; left: -150px; }
.screen { min-height: 100vh; display: none; }
.screen.active { display: block; }
.gate { display: flex; align-items: center; justify-content: center; padding: 32px; }
.confidential { position: fixed; top: 24px; letter-spacing: .18em; font-size: 12px; color: var(--gold); opacity: .8; }
.gate-card { width: min(620px, 100%); padding: 52px; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(20,20,20,.92), rgba(8,8,8,.82)); border-radius: 34px; box-shadow: 0 40px 120px rgba(0,0,0,.55); text-align: center; }
.brand-mark, .mini-mark { display: grid; place-items: center; border: 1px solid var(--gold); color: var(--gold-2); font-family: 'Cormorant Garamond', serif; }
.brand-mark { width: 78px; height: 78px; margin: 0 auto 24px; border-radius: 24px; font-size: 48px; }
.mini-mark { width: 42px; height: 42px; border-radius: 14px; font-size: 28px; }
.eyebrow { color: var(--gold); letter-spacing: .18em; text-transform: uppercase; font-size: 12px; font-weight: 700; }
h1,h2,h3 { margin: 0; }
.gate h1, .hero h1 { font-family: 'Cormorant Garamond', serif; font-size: clamp(52px, 8vw, 96px); line-height: .9; }
.gate h2 { color: var(--gold-2); margin-top: 12px; font-weight: 500; }
.lead { color: var(--muted); line-height: 1.7; max-width: 520px; margin: 24px auto; }
.login-box { display: grid; gap: 10px; text-align: left; margin-top: 28px; }
.login-box label { color: var(--muted); font-size: 13px; }
input { width: 100%; padding: 15px 16px; border-radius: 16px; border: 1px solid var(--line); background: rgba(255,255,255,.05); color: var(--text); outline: none; }
button, .primary, .secondary { border: 0; cursor: pointer; padding: 15px 20px; border-radius: 999px; font-weight: 800; transition: transform .2s ease, opacity .2s ease; }
button:hover, .primary:hover, .secondary:hover { transform: translateY(-2px); }
.login-box button, .primary { margin-top: 12px; background: linear-gradient(135deg, var(--gold), #8c6227); color: #090807; }
.secondary, .ghost { background: rgba(255,255,255,.06); color: var(--text); border: 1px solid var(--line); }
.error { color: var(--danger); min-height: 20px; }
.micro { color: var(--muted); font-size: 12px; }
.topbar { position: sticky; top: 0; z-index: 10; backdrop-filter: blur(18px); background: rgba(7,7,7,.72); border-bottom: 1px solid rgba(255,255,255,.08); display: flex; align-items: center; justify-content: space-between; padding: 16px 28px; }
.logo-wrap { display: flex; gap: 12px; align-items: center; }
.logo-wrap span { display: block; color: var(--muted); font-size: 12px; margin-top: 3px; }
nav { display: flex; gap: 20px; color: var(--muted); font-size: 13px; }
.panel-section { width: min(1180px, calc(100% - 40px)); margin: 0 auto; padding: 90px 0; }
.hero { min-height: 86vh; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 52px; }
.hero h1 span { color: var(--gold-2); }
.hero-copy p:not(.eyebrow) { color: var(--muted); line-height: 1.75; max-width: 650px; }
.hero-actions { display: flex; gap: 14px; margin-top: 30px; flex-wrap: wrap; }
.hero-visual { position: relative; height: 520px; display: grid; place-items: center; }
.core-ring { position:absolute; width: 350px; height: 350px; border: 1px solid var(--line); border-radius: 50%; animation: spin 20s linear infinite; }
.core-ring:after { content:""; position:absolute; width:12px; height:12px; background:var(--gold); border-radius:50%; top: 30px; left: 70px; box-shadow: 0 0 30px var(--gold); }
.core-ring.two { width: 250px; height: 250px; animation-direction: reverse; }
.core { width: 180px; height: 180px; border-radius: 50%; display:grid; place-items:center; text-align:center; background: radial-gradient(circle, rgba(214,181,109,.28), rgba(255,255,255,.04)); border: 1px solid var(--gold); font-size: 48px; font-weight: 900; box-shadow: 0 0 80px rgba(214,181,109,.16); }
.core span { display:block; font-size: 10px; letter-spacing:.16em; color: var(--muted); }
.metric-chip { position:absolute; padding: 12px 16px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.06); color: var(--gold-2); font-size: 13px; }
.c1 { top: 90px; left: 30px; } .c2 { right: 20px; top: 210px; } .c3 { bottom: 95px; left: 95px; }
.section-title { grid-column: 1 / -1; margin-bottom: 26px; }
.section-title h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(38px,5vw,66px); }
.section-title p:not(.eyebrow) { color: var(--muted); line-height: 1.7; }
.grid-3, .investor-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.card { border: 1px solid rgba(255,255,255,.09); background: var(--panel); border-radius: 28px; padding: 26px; box-shadow: 0 24px 90px rgba(0,0,0,.22); }
.metric span { color: var(--muted); display:block; margin-bottom: 14px; }
.metric strong { font-size: 44px; letter-spacing: -.04em; }
.metric em { color: var(--gold); margin-left: 8px; font-style: normal; }
.wide { grid-column: span 2; }
.card-head { display:flex; align-items:center; justify-content:space-between; gap: 12px; margin-bottom: 14px; }
.live-dot { color: var(--gold); font-size: 12px; letter-spacing:.12em; }
.live-dot:before { content:""; display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--gold); margin-right:8px; box-shadow: 0 0 18px var(--gold); }
.insight p { color: var(--muted); line-height:1.7; }
.split { display:grid; grid-template-columns: .85fr 1fr .8fr; gap: 28px; align-items:center; }
.blackbox { position:relative; height: 420px; border-radius: 38px; background: linear-gradient(135deg, #171717, #030303); border: 1px solid var(--line); box-shadow: inset 0 0 80px rgba(214,181,109,.08), 0 50px 120px rgba(0,0,0,.45); overflow:hidden; }
.box-top { position:absolute; top:28px; left:32px; color:var(--gold); letter-spacing:.28em; font-weight:800; }
.box-core { position:absolute; width:120px; height:120px; border-radius:50%; border:1px solid var(--gold); top:145px; left:calc(50% - 60px); box-shadow: 0 0 60px rgba(214,181,109,.28); }
.box-lines { position:absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent, transparent 22px, rgba(214,181,109,.045) 23px); }
.feature-list { display:grid; gap: 14px; }
.feature-list div, .allocation div { display:flex; justify-content:space-between; gap:16px; padding:18px; border-radius:20px; background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.08); }
.feature-list strong { color:var(--gold); }
.feature-list span, .allocation span { color:var(--muted); }
.timeline { display:grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.step { min-height: 230px; padding: 24px; border-radius: 28px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.035); }
.step.active { border-color: var(--line); background:rgba(214,181,109,.07); }
.step span { color:var(--gold); font-weight:900; }
.step h3 { margin: 32px 0 10px; }
.step p { color:var(--muted); line-height:1.6; }
.pill { padding: 10px 14px; background: rgba(214,181,109,.12); color:var(--gold-2); border:1px solid var(--line); }
.allocation { display:grid; gap: 12px; }
.footer { width:min(1180px, calc(100% - 40px)); margin: 0 auto; padding: 45px 0 70px; border-top: 1px solid rgba(255,255,255,.08); color:var(--muted); display:flex; justify-content:space-between; gap:20px; }
.reveal { opacity:0; transform: translateY(24px); animation: reveal .9s ease forwards; }
.delay-1 { animation-delay:.15s; } .delay-2 { animation-delay:.3s; }
@keyframes reveal { to { opacity:1; transform:none; } }
@keyframes spin { to { transform: rotate(360deg); } }
@media (max-width: 900px) {
  nav { display:none; }
  .hero, .split, .grid-3, .investor-grid, .timeline { grid-template-columns: 1fr; }
  .wide { grid-column: auto; }
  .hero-visual { height: 380px; }
  .footer { flex-direction:column; }
  .gate-card { padding: 34px 24px; }
}