*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg:        #0D1117;
  --bg-card:   #161B22;
  --bg-card2:  #1C2128;
  --border:    #21262D;
  --border-lt: #30363D;
  --red:       #B22234;
  --red-lt:    #C8303F;
  --blue:      #3C3B6E;
  --blue-lt:   #4E4D8A;
  --blue-glow: #5B5AA3;
  --white:     #F0F6FC;
  --gray-1:    #C9D1D9;
  --gray-2:    #8B949E;
  --gray-3:    #484F58;
  --gold:      #D4A843;
  --font-serif: 'Playfair Display', 'Georgia', serif;
  --font-body:  'Source Serif 4', 'Georgia', serif;
  --font-ui:    'Inter', system-ui, sans-serif;
}

html { scroll-behavior: smooth; }

body {
  background-color: var(--bg);
  color: var(--white);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

.container { max-width: 1100px; margin: 0 auto; padding: 0 24px; }
.sr-only { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap; }

/* TOP BAR */
.top-bar { background:var(--bg-card); border-bottom:1px solid var(--border); padding:8px 0; }
.top-bar-inner { display:flex; align-items:center; justify-content:space-between; font-family:var(--font-ui); font-size:11px; font-weight:500; letter-spacing:.08em; text-transform:uppercase; color:var(--gray-2); }
.ai-badge { display:inline-flex; align-items:center; gap:6px; background:linear-gradient(135deg,rgba(60,59,110,.4),rgba(178,34,52,.25)); border:1px solid rgba(91,90,163,.45); border-radius:20px; padding:4px 12px; font-size:10px; font-weight:600; letter-spacing:.07em; color:#a8b4f8; text-transform:uppercase; }
.ai-badge::before { content:''; display:inline-block; width:6px;height:6px; border-radius:50%; background:#5B5AA3; box-shadow:0 0 6px #5B5AA3; animation:pulse 2.5s ease-in-out infinite; }
@keyframes pulse { 0%,100%{opacity:1;box-shadow:0 0 6px #5B5AA3;} 50%{opacity:.5;box-shadow:0 0 12px #5B5AA3;} }

/* MASTHEAD */
.masthead { padding:52px 0 44px; border-bottom:1px solid var(--border); text-align:center; position:relative; overflow:hidden; }
.masthead::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(60,59,110,.18) 0%,transparent 70%); pointer-events:none; }
.masthead-rule { display:flex; align-items:center; gap:16px; margin:0 auto 28px; max-width:640px; }
.masthead-rule::before,.masthead-rule::after { content:''; flex:1; height:1px; background:linear-gradient(90deg,transparent,var(--border-lt)); }
.masthead-rule::after { background:linear-gradient(90deg,var(--border-lt),transparent); }
.masthead-rule span { font-family:var(--font-ui); font-size:9px; letter-spacing:.2em; text-transform:uppercase; color:var(--gray-3); }
.masthead-logo { font-family:var(--font-serif); font-size:clamp(32px,7vw,72px); font-weight:900; letter-spacing:-.01em; line-height:1; color:var(--white); text-transform:uppercase; }
.masthead-logo .disc-accent { color:var(--red); }
.masthead-tagline { font-family:var(--font-ui); font-size:clamp(13px,2vw,16px); font-weight:300; letter-spacing:.18em; text-transform:uppercase; color:var(--gray-2); margin-top:14px; }
.masthead-divider { display:flex; align-items:center; justify-content:center; gap:10px; margin:24px auto 0; }
.star { color:var(--red); font-size:12px; }
.divider-line { width:60px; height:1px; background:var(--border-lt); }

/* STICKY NAV */
.site-nav { background:var(--bg-card); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:100; }
.nav-inner { display:flex; align-items:center; justify-content:center; gap:0; overflow-x:auto; scrollbar-width:none; }
.nav-inner::-webkit-scrollbar { display:none; }
.nav-item { font-family:var(--font-ui); font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--gray-2); padding:14px 18px; border-bottom:3px solid transparent; white-space:nowrap; cursor:pointer; transition:color .2s,border-color .2s; text-decoration:none; display:inline-block; }
.nav-item.active,.nav-item:hover { color:var(--white); border-bottom-color:var(--red); }
.nav-divider { color:var(--gray-3); padding:0 4px; font-size:14px; line-height:1; }

/* EMAIL FORM */
.email-capture { max-width:480px; margin:0 auto; }
.email-form { display:flex; gap:0; border-radius:6px; overflow:hidden; border:1px solid var(--border-lt); box-shadow:0 4px 24px rgba(0,0,0,.4); }
.email-input { flex:1; background:var(--bg-card2); border:none; outline:none; padding:14px 18px; font-family:var(--font-ui); font-size:14px; color:var(--white); min-width:0; }
.email-input::placeholder { color:var(--gray-3); }
.email-btn { background:var(--red); color:var(--white); border:none; padding:14px 22px; font-family:var(--font-ui); font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; white-space:nowrap; transition:background .2s; }
.email-btn:hover { background:var(--red-lt); }
.email-note { font-family:var(--font-ui); font-size:11px; color:var(--gray-3); margin-top:10px; letter-spacing:.03em; }
.success-state { display:none; align-items:center; justify-content:center; gap:10px; background:rgba(60,59,110,.25); border:1px solid rgba(91,90,163,.4); border-radius:6px; padding:16px 24px; font-family:var(--font-ui); font-size:14px; color:#a8b4f8; }
.success-state .check { font-size:18px; }

/* SECTION */
.section-header { text-align:center; margin-bottom:48px; }
.section-eyebrow { font-family:var(--font-ui); font-size:10px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--red); margin-bottom:12px; }
.section-title { font-family:var(--font-serif); font-size:clamp(22px,3.5vw,34px); font-weight:700; color:var(--white); line-height:1.25; margin-bottom:12px; }
.section-sub { font-family:var(--font-body); font-size:15px; color:var(--gray-2); font-style:italic; max-width:520px; margin:0 auto; }

/* STORY CARDS */
.cards-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.story-card { background:var(--bg-card); border:1px solid var(--border); border-radius:8px; overflow:hidden; display:flex; flex-direction:column; transition:border-color .25s,transform .25s; }
.story-card:hover { border-color:var(--border-lt); transform:translateY(-2px); }
.card-tag-bar { height:3px; background:linear-gradient(90deg,var(--red) 0%,var(--blue) 100%); }
.card-body { padding:20px 20px 0; }
.card-category { font-family:var(--font-ui); font-size:10px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--gray-2); margin-bottom:10px; }
.card-headline { font-family:var(--font-serif); font-size:17px; font-weight:700; line-height:1.35; color:var(--white); margin-bottom:10px; }
.card-summary { font-family:var(--font-body); font-size:13px; line-height:1.6; color:var(--gray-1); font-style:italic; margin-bottom:18px; }
.card-perspectives { border-top:1px solid var(--border); padding:14px 20px 20px; display:flex; flex-direction:column; gap:10px; flex:1; }
.perspective { display:grid; grid-template-columns:72px 1fr; gap:10px; align-items:flex-start; }
.persp-label { font-family:var(--font-ui); font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:3px 0; border-radius:3px; text-align:center; }
.persp-label.left  { background:rgba(60,59,110,.35); color:#9090e0; border:1px solid rgba(60,59,110,.6); }
.persp-label.right { background:rgba(178,34,52,.25); color:#e08090; border:1px solid rgba(178,34,52,.45); }
.persp-label.facts { background:rgba(212,168,67,.12); color:var(--gold); border:1px solid rgba(212,168,67,.3); }
.persp-text { font-family:var(--font-body); font-size:12.5px; line-height:1.55; color:var(--gray-1); }
.card-footer { padding:10px 20px 14px; border-top:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
.card-meta { font-family:var(--font-ui); font-size:10px; color:var(--gray-3); letter-spacing:.05em; }
.card-sources { font-family:var(--font-ui); font-size:10px; font-weight:500; color:var(--blue-glow); letter-spacing:.05em; }

/* FOOTER */
footer { background:var(--bg-card); border-top:1px solid var(--border); padding:40px 0 32px; }
.footer-inner { display:flex; flex-direction:column; align-items:center; gap:16px; text-align:center; }
.footer-logo { font-family:var(--font-serif); font-size:22px; font-weight:900; letter-spacing:.03em; text-transform:uppercase; color:var(--white); }
.footer-logo span { color:var(--red); }
.footer-flag { display:flex; gap:3px; align-items:center; }
.flag-stripe { height:14px; border-radius:2px; }
.flag-stripe.r { background:var(--red); width:22px; }
.flag-stripe.w { background:var(--white); width:22px; }
.flag-stripe.b { background:var(--blue); width:14px; }
.footer-links { display:flex; gap:24px; flex-wrap:wrap; justify-content:center; }
.footer-link { font-family:var(--font-ui); font-size:11px; font-weight:500; letter-spacing:.08em; text-transform:uppercase; color:var(--gray-3); text-decoration:none; transition:color .2s; }
.footer-link:hover { color:var(--gray-2); }
.footer-copy { font-family:var(--font-ui); font-size:12px; color:var(--gray-3); line-height:1.6; }

/* CONTENT PAGE */
.page-content { padding:72px 0 80px; }
.page-content .prose { max-width:760px; margin:0 auto; }
.prose h2 { font-family:var(--font-serif); font-size:clamp(20px,3vw,28px); font-weight:700; color:var(--white); margin:48px 0 16px; padding-bottom:10px; border-bottom:1px solid var(--border); }
.prose h2:first-child { margin-top:0; }
.prose h3 { font-family:var(--font-serif); font-size:18px; font-weight:700; color:var(--gray-1); margin:28px 0 10px; }
.prose p { font-family:var(--font-body); font-size:16px; line-height:1.75; color:var(--gray-1); margin-bottom:18px; }
.prose ul,.prose ol { font-family:var(--font-body); font-size:16px; line-height:1.75; color:var(--gray-1); margin:0 0 18px 24px; }
.prose li { margin-bottom:8px; }
.prose strong { color:var(--white); font-weight:600; }
.prose a { color:var(--blue-glow); text-decoration:underline; text-underline-offset:3px; }

/* PAGE HERO (inner pages) */
.page-hero { padding:56px 0 48px; border-bottom:1px solid var(--border); text-align:center; }
.page-hero-eyebrow { font-family:var(--font-ui); font-size:10px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--red); margin-bottom:14px; }
.page-hero-title { font-family:var(--font-serif); font-size:clamp(26px,5vw,48px); font-weight:900; color:var(--white); line-height:1.15; margin-bottom:14px; }
.page-hero-sub { font-family:var(--font-body); font-size:clamp(15px,2vw,17px); color:var(--gray-2); font-style:italic; max-width:580px; margin:0 auto; }

/* FADE IN */
.fade-in { opacity:0; transform:translateY(20px); transition:opacity .6s ease,transform .6s ease; }
.fade-in.visible { opacity:1; transform:translateY(0); }

/* RESPONSIVE */
@media(max-width:900px) {
  .cards-grid { grid-template-columns:1fr; max-width:520px; margin:0 auto; }
}
@media(max-width:600px) {
  .top-bar-date { display:none; }
  .masthead { padding:36px 0 28px; }
  .email-form { flex-direction:column; }
  .email-btn { text-align:center; padding:13px 16px; }
  .nav-item { padding:12px 14px; font-size:10px; }
  .footer-links { gap:16px; }
}