/* CDA Design System */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&family=DM+Mono:wght@400;500&family=Newsreader:ital,wght@0,400;0,600;1,400&display=swap');

:root {
    --bg: #0a0c10;
    --bg2: #12151c;
    --bg3: #1a1e28;
    --bg4: #222836;
    --text: #c8cdd5;
    --text-dim: #6b7280;
    --text-bright: #e8ecf2;
    --accent: #3b82f6;
    --accent-dim: #1e3a5f;
    --accent-glow: rgba(59,130,246,0.08);
    --red: #ef4444;
    --red-dim: rgba(239,68,68,0.1);
    --green: #22c55e;
    --green-dim: rgba(34,197,94,0.1);
    --amber: #f59e0b;
    --amber-dim: rgba(245,158,11,0.1);
    --border: rgba(255,255,255,0.06);
    --border-hover: rgba(59,130,246,0.3);
    --font: 'DM Sans', -apple-system, sans-serif;
    --mono: 'DM Mono', monospace;
    --serif: 'Newsreader', Georgia, serif;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }
body { background:var(--bg); color:var(--text); font-family:var(--font); font-size:16px; line-height:1.7; -webkit-font-smoothing:antialiased; }

/* Nav */
nav { position:fixed; top:0; left:0; right:0; z-index:100; background:rgba(10,12,16,0.85); backdrop-filter:blur(20px); border-bottom:1px solid var(--border); }
.nav-inner { max-width:1100px; margin:0 auto; padding:14px 24px; display:flex; justify-content:space-between; align-items:center; }
.nav-brand { font-family:var(--mono); font-size:13px; font-weight:500; color:var(--accent); letter-spacing:1.5px; text-transform:uppercase; text-decoration:none; }
.nav-links { display:flex; gap:28px; }
.nav-links a { font-size:13px; color:var(--text-dim); text-decoration:none; letter-spacing:0.5px; transition:color 0.2s; }
.nav-links a:hover { color:var(--text-bright); }
.nav-links a.active { color:var(--accent); }

/* Layout */
.container { max-width:760px; margin:0 auto; padding:80px 24px; }
.container.wide { max-width:1100px; }
.divider { max-width:1100px; margin:0 auto; height:1px; background:var(--border); }

/* Typography */
.section-tag { font-family:var(--mono); font-size:11px; color:var(--accent); letter-spacing:3px; text-transform:uppercase; margin-bottom:12px; display:block; }
h1 { font-family:var(--serif); font-size:clamp(28px,4vw,44px); font-weight:600; color:var(--text-bright); line-height:1.2; margin-bottom:20px; }
h2 { font-family:var(--serif); font-size:28px; font-weight:600; color:var(--text-bright); margin-bottom:20px; line-height:1.3; }
h3 { font-size:18px; font-weight:500; color:var(--text-bright); margin:32px 0 12px; }
p { margin-bottom:16px; }

/* Data highlights */
.data-highlight { background:var(--bg3); border-left:3px solid var(--accent); border-radius:0 8px 8px 0; padding:20px 24px; margin:24px 0; }
.data-highlight p { margin:0; font-size:15px; }
.data-highlight strong { color:var(--text-bright); }

/* Cards */
.card { background:var(--bg2); border:1px solid var(--border); border-radius:12px; padding:28px; transition:border-color 0.3s, transform 0.2s; }
.card:hover { border-color:var(--border-hover); transform:translateY(-2px); }

/* Tags */
.tag { font-family:var(--mono); font-size:10px; letter-spacing:2px; text-transform:uppercase; padding:3px 10px; border-radius:4px; display:inline-block; }
.tag-research { color:var(--accent); background:var(--accent-dim); }
.tag-methodology { color:var(--green); background:var(--green-dim); }
.tag-guide { color:var(--amber); background:var(--amber-dim); }
.tag-premium { color:#a78bfa; background:rgba(167,139,250,0.1); }
.tag-high-risk { color:var(--red); background:var(--red-dim); }
.tag-confirmed { color:var(--amber); background:var(--amber-dim); }

/* Buttons */
.btn { display:inline-block; font-family:var(--font); font-size:13px; font-weight:500; padding:10px 24px; border-radius:8px; text-decoration:none; transition:all 0.2s; cursor:pointer; border:none; }
.btn-primary { background:var(--accent); color:white; }
.btn-primary:hover { background:#2563eb; }
.btn-outline { background:transparent; color:var(--accent); border:1px solid var(--accent); }
.btn-outline:hover { background:var(--accent-dim); }
.btn-sm { padding:6px 16px; font-size:12px; }

/* Stats */
.stats-bar { display:flex; justify-content:center; gap:48px; flex-wrap:wrap; padding:20px 0; }
.stat { text-align:center; }
.stat-num { font-family:var(--mono); font-size:28px; font-weight:500; color:var(--accent); display:block; }
.stat-label { font-size:11px; color:var(--text-dim); letter-spacing:1px; text-transform:uppercase; margin-top:4px; }

/* Method grid */
.method-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin-top:24px; }
.method-step { background:var(--bg2); border:1px solid var(--border); border-radius:10px; padding:20px; }
.method-num { font-family:var(--mono); font-size:11px; color:var(--accent); letter-spacing:2px; margin-bottom:8px; }
.method-step h4 { font-size:14px; font-weight:500; color:var(--text-bright); margin-bottom:6px; }
.method-step p { font-size:13px; color:var(--text-dim); line-height:1.5; margin:0; }

/* Footer */
footer { border-top:1px solid var(--border); padding:40px 24px; text-align:center; }
footer p { font-size:12px; color:var(--text-dim); line-height:1.8; max-width:700px; margin:0 auto; }
footer a { color:var(--accent); text-decoration:none; }

/* CTA */
.cta-box { max-width:600px; margin:0 auto; background:var(--bg2); border:1px solid var(--border); border-radius:16px; padding:48px 40px; text-align:center; }
.cta-email { font-family:var(--mono); font-size:15px; color:var(--accent); text-decoration:none; padding:12px 28px; border:1px solid var(--accent); border-radius:8px; display:inline-block; transition:background 0.2s; }
.cta-email:hover { background:var(--accent-dim); }

/* Animations */
@keyframes fadeUp { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
.fade-up { opacity:0; animation:fadeUp 0.6s forwards; }
.fade-up-1 { animation-delay:0.2s; }
.fade-up-2 { animation-delay:0.4s; }
.fade-up-3 { animation-delay:0.6s; }
.fade-up-4 { animation-delay:0.8s; }

/* Responsive */
@media(max-width:640px) {
    .stats-bar { gap:24px; }
    .nav-links { gap:16px; }
    .method-grid { grid-template-columns:1fr 1fr; }
    .container { padding:60px 20px; }
    .nav-links a { font-size:12px; }
}