@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:wght@400;500;600;700&family=Satoshi:wght@400;500;700;900&family=JetBrains+Mono:wght@400;600&display=swap');

/* ══════════════════════════════════════════════════════════
   DESIGN SYSTEM
   ══════════════════════════════════════════════════════════ */
:root {
  --c-bg-0: #060a14;
  --c-bg-1: #0a1025;
  --c-bg-2: #0e1530;
  --c-bg-3: #121a38;
  --c-bg-card: rgba(14,21,48,0.7);
  --c-border: rgba(255,255,255,0.06);
  --c-border-h: rgba(255,255,255,0.12);
  --c-glass: rgba(255,255,255,0.03);

  --c-orange: #F47B20;
  --c-orange-l: #FF9A4D;
  --c-orange-d: #D06410;
  --c-orange-bg: rgba(244,123,32,0.08);
  --c-orange-bg2: rgba(244,123,32,0.15);
  --c-orange-glow: rgba(244,123,32,0.2);

  --c-green: #22C55E;
  --c-green-bg: rgba(34,197,94,0.1);
  --c-red: #EF4444;
  --c-red-bg: rgba(239,68,68,0.1);
  --c-blue: #3B82F6;
  --c-blue-bg: rgba(59,130,246,0.1);
  --c-purple: #A855F7;
  --c-cyan: #06B6D4;
  --c-gold: #F59E0B;

  --c-text: #EEF0F6;
  --c-text-2: rgba(238,240,246,0.6);
  --c-text-3: rgba(238,240,246,0.35);
  --c-text-inv: #060a14;

  --f-display: 'Satoshi', sans-serif;
  --f-body: 'Instrument Sans', sans-serif;
  --f-mono: 'JetBrains Mono', monospace;

  --r-xl: 24px;
  --r-lg: 16px;
  --r-md: 12px;
  --r-sm: 8px;
  --r-full: 999px;

  --ease: cubic-bezier(.25,.46,.45,.94);
  --t: .3s var(--ease);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:80px; background: #060a14 !important; }
/* ── Background ── */
#cosmo { position: fixed; inset: 0; z-index: 0; pointer-events: none; }

body {
  font-family: var(--f-body);
  background: var(--c-bg-0);
  color: var(--c-text);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  line-height: 1.6;
  min-height: 100vh;
}

/* Noise overlay */
body::after {
  content:'';position:fixed;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.02'/%3E%3C/svg%3E");
  pointer-events:none;z-index:9998;
}

::selection { background:var(--c-orange-bg2); color:var(--c-text); }
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
button { font-family:var(--f-body); }

/* ── Container ── */
.w { max-width:1180px; margin:0 auto; padding:0 28px; position:relative; z-index:2; }
.w-sm { max-width:780px; margin:0 auto; padding:0 28px; position:relative; z-index:2; }

/* ── Section Primitives ── */
.sec { padding:110px 0; position:relative; z-index:2; }
.sec-alt { background:var(--c-bg-1); }
.sec-label {
  font-family:var(--f-mono);font-size:11px;font-weight:600;
  letter-spacing:3px;text-transform:uppercase;color:var(--c-orange);
  margin-bottom:12px;
}
.sec-title {
  font-family:var(--f-display);
  font-size:clamp(28px,4.5vw,50px);font-weight:900;
  line-height:1.08;letter-spacing:-1.5px;margin-bottom:16px;
}
.sec-sub { font-size:16px;color:var(--c-text-2);max-width:520px;line-height:1.7; }
.tc { text-align:center; }
.tc .sec-sub { margin:0 auto; }

/* ── Buttons ── */
.btn {
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 28px;border-radius:var(--r-full);
  font-family:var(--f-body);font-size:14px;font-weight:700;
  cursor:pointer;transition:all .25s var(--ease);border:none;white-space:nowrap;
  text-decoration:none;
}
.btn-o { background:var(--c-orange);color:#fff; }
.btn-o:hover { background:var(--c-orange-l);transform:translateY(-2px);box-shadow:0 0 40px var(--c-orange-glow); }
.btn-g { background:var(--c-glass);color:var(--c-text);border:1px solid var(--c-border); }
.btn-g:hover { background:var(--c-border);border-color:var(--c-border-h);transform:translateY(-2px); }
.btn-w { background:#fff;color:var(--c-text-inv); }
.btn-w:hover { background:#f0f0f0;transform:translateY(-2px); }
.btn-lg { padding:16px 36px;font-size:15px; }
.btn-sm { padding:7px 16px;font-size:12px; }
.btn-block { width:100%;justify-content:center; }

/* ── Animations ── */
@keyframes fadeUp { from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)} }
.rv { opacity:0;transform:translateY(28px);transition:opacity .65s var(--ease),transform .65s var(--ease); }
.rv.vis { opacity:1;transform:translateY(0); }
.rvs>*{opacity:0;transform:translateY(18px);transition:opacity .45s ease,transform .45s ease;}
.rvs.vis>*:nth-child(1){transition-delay:0s;opacity:1;transform:none}
.rvs.vis>*:nth-child(2){transition-delay:.06s;opacity:1;transform:none}
.rvs.vis>*:nth-child(3){transition-delay:.12s;opacity:1;transform:none}
.rvs.vis>*:nth-child(4){transition-delay:.18s;opacity:1;transform:none}
.rvs.vis>*:nth-child(5){transition-delay:.24s;opacity:1;transform:none}
.rvs.vis>*:nth-child(6){transition-delay:.30s;opacity:1;transform:none}
.rvs.vis>*:nth-child(7){transition-delay:.36s;opacity:1;transform:none}
.rvs.vis>*:nth-child(8){transition-delay:.42s;opacity:1;transform:none}