:root{
  --ink:#EAF2FF;
  --muted:#9BB3D3;
  --paper:#08101C;
  --panel:#0E1A2E;
  --line:rgba(154,190,255,0.18);
  --blue:#4AA3FF;
  --blue-deep:#2B7DE9;
  --navy:#050A14;
  --yes:#3DDC97;
  --warn:#FFD27A;
  --sans:"Outfit", "Segoe UI", system-ui, sans-serif;
  --display:"Syne", "Arial Black", sans-serif;
  --header-h:58px;
}

*{box-sizing:border-box;}
html{
  scroll-behavior:smooth;
  scroll-padding-top:var(--header-h);
  overflow-x:hidden;
  max-width:100%;
}
body{
  margin:0;
  max-width:100%;
  overflow-x:hidden;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{
  font-weight:700; margin:0 0 .45em; line-height:1.2; letter-spacing:-0.01em;
}
h1{
  font-family:var(--display); font-weight:800; line-height:0.96; letter-spacing:-0.03em;
}
h2,h3{font-family:var(--sans);}
p{margin:0 0 1em;}
a{color:var(--blue);}
img{max-width:100%; height:auto; display:block;}
.wrap{width:min(1120px, 100%); margin:0 auto; padding:0 18px;}
.wrap-narrow{max-width:820px;}
.kicker{
  font-size:0.72rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  color:var(--blue); margin:0 0 8px;
}
.skip-link{position:absolute; left:-999px; top:0; background:#000; color:#fff; padding:10px 16px; z-index:100;}
.skip-link:focus{left:0;}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;}
}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--sans); font-weight:700; font-size:0.95rem;
  padding:13px 20px; border-radius:4px; border:1px solid transparent;
  cursor:pointer; text-decoration:none;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.btn-primary{background:var(--blue); color:#041018;}
.btn-primary:hover{background:#7CBCFF;}
.btn-ghost{background:transparent; color:#fff; border-color:rgba(255,255,255,0.28);}
.btn-ghost:hover{border-color:#fff;}
.quiz-nav .btn-ghost{color:#fff;}
.btn-dark{background:#fff; color:#06101C;}
.btn-block{width:100%;}

/* ===== top bar: slim, not a petition header ===== */
.site-header{
  position:sticky; top:0; z-index:1000;
  background:rgba(5,10,20,0.82);
  backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line);
}
.header-inner{
  height:var(--header-h);
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.mark{
  font-family:var(--display); font-weight:800; font-size:1.05rem;
  color:#fff; text-decoration:none; letter-spacing:0.18em; text-transform:uppercase;
}
.mark span{color:var(--blue);}
.site-nav{display:flex; align-items:center; gap:4px; margin-left:auto;}
.site-nav a{
  color:var(--muted); text-decoration:none; font-size:0.82rem; font-weight:600;
  letter-spacing:.04em; text-transform:uppercase; padding:8px 10px;
}
.site-nav a:hover{color:#fff;}
.site-nav a.nav-cta{background:var(--blue); color:#041018; margin-left:6px;}
.nav-close{display:none;}
.menu-toggle{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:42px; height:42px; border:1px solid var(--line); background:transparent;
  cursor:pointer; padding:0;
}
.menu-toggle span{display:block; width:18px; height:2px; margin:0 auto; background:#fff;}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav-scrim{display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:999;}

@media (max-width:900px){
  .menu-toggle{display:flex;}
  .nav-scrim{display:block;}
  .nav-scrim[hidden]{display:none;}
  .site-nav{
    position:fixed;
    top:0; right:0; bottom:0; left:auto;
    width:0;
    height:100dvh;
    margin:0;
    padding:0;
    overflow:hidden;
    background:#0B1628;
    display:flex; flex-direction:column; align-items:stretch;
    gap:2px;
    z-index:1001;
    visibility:hidden;
    pointer-events:none;
    border:0;
    transform:none;
  }
  .site-nav.open{
    width:min(18rem, 82vw);
    padding:72px 18px 28px;
    visibility:visible;
    pointer-events:auto;
  }
  .nav-close{
    display:flex; align-items:center; justify-content:center;
    position:absolute; top:14px; right:14px;
    width:44px; height:44px;
    border:1px solid var(--line); background:transparent;
    color:#fff; cursor:pointer; padding:0; line-height:1;
  }
  .nav-close span{font-size:2rem; font-weight:400; transform:translateY(-1px);}
  .site-nav a{padding:14px 8px; font-size:1rem; color:#fff;}
  .site-nav .nav-mark{display:block; letter-spacing:.14em; padding-bottom:16px; margin-bottom:8px; border-bottom:1px solid var(--line);}
  .site-nav a.nav-cta{margin:12px 0 0; text-align:center;}
  body.menu-open{overflow:hidden;}
}

/* ===== splash: full-bleed photo + giant type ===== */
.splash{
  display:grid;
  grid-template-columns:minmax(0, 0.92fr) minmax(0, 1.08fr);
  min-height:calc(100svh - var(--header-h));
  background:#02060E;
}
.splash-photo{
  position:relative;
  min-height:100%;
  overflow:hidden;
  background:#000;
}
.splash-photo img{
  width:100%; height:100%;
  object-fit:cover;
  min-height:min(72vh, 720px);
}
.splash-caption{
  position:absolute; left:16px; right:16px; bottom:16px;
  margin:0; font-size:0.78rem; letter-spacing:.08em; text-transform:uppercase;
  color:#D7E6FF; background:rgba(0,0,0,0.45); padding:8px 10px;
}
.splash-copy{
  padding:clamp(28px, 6vw, 72px) clamp(20px, 5vw, 64px);
  display:flex; flex-direction:column; justify-content:center;
  min-width:0;
}
.eyebrow{
  font-size:0.75rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase;
  color:var(--blue); margin:0 0 16px;
}
.splash h1{
  font-size:clamp(3rem, 9vw, 6.4rem);
  color:#fff; margin:0 0 18px;
}
.splash .lede{
  font-size:1.08rem; color:var(--muted); max-width:38ch;
}
.splash-actions{display:flex; flex-wrap:wrap; gap:10px; margin:8px 0 10px;}
.hero-note{font-size:0.88rem; color:var(--muted); margin:0;}

.beliefs{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.belief{
  padding:22px 18px;
  border-right:1px solid var(--line);
  min-width:0;
}
.belief:last-child{border-right:0;}
.belief strong{
  display:block; font-family:var(--sans); font-size:1.12rem; font-weight:700;
  margin-bottom:6px; color:#fff; letter-spacing:-0.01em; line-height:1.25;
}
.belief p{margin:0; color:var(--muted); font-size:0.95rem;}

/* ===== quiz theater ===== */
.questions{
  background:#050B16;
  padding:48px 0 56px;
}
.survey-banner{margin-bottom:22px; max-width:40rem;}
.survey-banner h2{font-size:clamp(2.1rem, 6vw, 3.6rem); color:#fff;}
.survey-banner p{color:var(--muted); margin:0;}

.quiz{
  background:var(--panel);
  border:1px solid var(--line);
  padding:0;
  overflow:hidden;
  max-width:100%;
}
.quiz-progress{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 16px; border-bottom:1px solid var(--line);
}
.quiz-bar{
  flex:1; min-width:0; height:3px; background:#1D3354;
}
#quiz-bar-fill{display:block; height:100%; width:4%; background:var(--blue); transition:width .25s ease;}
.reveal-line{color:var(--muted); font-size:1.05rem; margin:0;}
.score-card{padding:8px 2px 10px;}
.score-card h3{
  font-family:var(--display); font-weight:800; line-height:1.05; letter-spacing:-0.03em;
  font-size:clamp(1.8rem, 7vw, 3rem); color:#fff; margin:0 0 10px;
}
.score-card p{color:var(--muted);}
.quiz-progress-label{
  margin:0; font-size:0.7rem; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--muted); white-space:nowrap;
}
.quiz-steps{padding:18px 16px 8px;}
.qstep{display:none;}
.qstep.active{display:block; animation:rise .28s ease;}
@keyframes rise{from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;}}
.quiz .q{margin-bottom:20px;}
.quiz .q-label{
  display:grid;
  grid-template-columns:28px minmax(0, 1fr);
  gap:10px;
  font-size:1.12rem; font-family:var(--sans); font-weight:650;
  line-height:1.4; margin-bottom:14px; color:#fff;
  letter-spacing:0;
  overflow-wrap:anywhere;
}
.q-number{
  width:28px; height:28px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--blue); color:var(--blue); font-family:var(--sans);
  font-size:0.75rem; font-weight:700;
}
.q-hint{font-size:0.95rem; color:var(--muted); margin:-4px 0 14px; overflow-wrap:anywhere;}

.fetus-card{
  margin:0 0 16px; background:#000; overflow:hidden;
}
.fetus-card img{
  width:100%;
  max-height:min(52vh, 420px);
  object-fit:contain;
  background:#000;
}
.fetus-card figcaption{
  padding:10px 12px 12px; color:#B7C9E4; font-size:0.82rem;
  overflow-wrap:anywhere;
}

.choice-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}
.choice-grid--3{grid-template-columns:repeat(3, minmax(0, 1fr));}
.choice{position:relative; display:block; cursor:pointer; min-width:0;}
.choice input{position:absolute; inset:0; opacity:0; margin:0; width:100%; height:100%; cursor:pointer;}
.choice span{
  display:flex; align-items:center; justify-content:center; text-align:center;
  min-height:50px; padding:10px 8px;
  border:1px solid var(--line); background:#091422;
  font-weight:650; font-size:0.9rem; color:#D5E4F8;
  overflow-wrap:anywhere;
}
.choice:hover span{border-color:var(--blue);}
.choice.chosen span{background:var(--blue); color:#041018; border-color:var(--blue);}
.quiz input[type="text"], .quiz textarea{
  width:100%; max-width:100%; padding:12px; font:inherit; color:#fff;
  background:#091422; border:1px solid var(--line);
}
.quiz input:focus, .quiz textarea:focus{outline:2px solid var(--blue);}
.quiz-hint{margin:8px 16px 0; color:var(--warn); font-size:0.88rem; font-weight:600;}
#quiz-next:disabled, #quiz-submit:disabled{opacity:0.4; cursor:default; pointer-events:none;}
.quiz-nav{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px;
  margin-top:8px; padding:14px 16px; border-top:1px solid var(--line);
}
#quiz-back:disabled{opacity:0.35; cursor:default; pointer-events:none;}
.image-note{color:var(--muted); font-size:0.78rem; margin:12px 0 0;}

/* ===== ballot: giant numerals, newspaper column ===== */
.ballot{background:#F4F7FB; color:#102033; padding:48px 0;}
.ballot .section-head{max-width:36rem; margin-bottom:28px;}
.ballot .kicker, .dates .kicker{
  font-size:0.72rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  color:var(--blue-deep); margin-bottom:8px;
}
.ballot h2, .dates h2, .pledge h2{color:inherit;}
.ballot .section-head h2{font-size:clamp(2rem, 5vw, 3.1rem); color:#07111F;}
.ballot .section-head p{color:#3C536D;}

.amend{
  display:grid;
  grid-template-columns:minmax(0, 92px) minmax(0, 1fr);
  gap:12px 18px;
  padding:28px 0;
  border-top:1px solid #C9D6EA;
}
.amend-num{
  font-family:var(--display); font-size:clamp(2.4rem, 8vw, 4.2rem);
  line-height:0.8; color:#2B7DE9; margin:0;
}
.amend-yes .amend-num{color:#128A5C;}
.amend-kicker{
  margin:0 0 6px; font-size:0.72rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#5A7390;
}
.amend h3{font-size:clamp(1.35rem, 3vw, 1.85rem); color:#07111F; margin-bottom:10px; line-height:1.25;}
.amend blockquote{
  margin:0 0 14px; padding:0; border:0;
  font-size:0.98rem; color:#2C425A;
}
.amend-body p{color:#3C536D;}
.cite{font-size:0.9rem;}
.vote-flag{
  display:inline-block; font-size:0.72rem; font-weight:800; letter-spacing:.14em;
  text-transform:uppercase; margin-bottom:8px;
  color:#2B7DE9;
}
.amend-yes .vote-flag{color:#128A5C;}

.cheat{
  background:#071A33;
  color:#EAF3FF;
  padding:36px 0;
}
.cheat-grid{
  display:grid;
  grid-template-columns:minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap:22px; align-items:center;
}
.cheat .kicker{color:var(--blue);}
.cheat h2{
  font-family:var(--display); font-weight:800; line-height:0.96; letter-spacing:-0.03em;
  font-size:clamp(2.6rem, 8vw, 4.8rem); color:#fff; margin:0 0 10px;
}
.cheat p{color:#B7C9E4; margin:0;}
.vote-stack{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.vote-stack li{
  display:grid;
  grid-template-columns:36px minmax(0, 1fr) auto;
  gap:10px; align-items:center;
  border-bottom:1px solid rgba(255,255,255,0.12);
  padding:10px 0;
}
.vote-stack strong{font-family:var(--display); font-size:1.4rem;}
.vote-stack em{font-style:normal; font-weight:800; letter-spacing:.1em;}

.dates{background:#F4F7FB; color:#102033; padding:48px 0;}
.stat-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:1px; background:#C9D6EA; border:1px solid #C9D6EA;
}
.stat-card{background:#fff; padding:20px 16px; min-width:0;}
.stat-num{font-family:var(--display); font-size:2rem; color:#2B7DE9; margin-bottom:6px;}
.stat-card p{margin:0; color:#3C536D; font-size:0.92rem;}
.record-links{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; margin-top:16px;}
.record-link{
  display:flex; flex-direction:column; gap:4px;
  background:#fff; color:inherit; text-decoration:none;
  border:1px solid #C9D6EA; padding:16px; min-width:0;
}
.record-link-kicker{font-size:0.7rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#2B7DE9;}
.record-link strong{color:#07111F;}
.record-link span{color:#3C536D; font-size:0.92rem;}

/* ===== pledge: stacked, not a rotated sheet ===== */
.pledge{background:#050B16; padding:48px 0 56px;}
.pledge-layout{
  display:grid;
  grid-template-columns:minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap:28px; align-items:start;
}
.pledge h2{font-size:clamp(2rem, 5vw, 3.2rem); color:#fff;}
.pledge p{color:var(--muted);}
.counter{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap;}
.counter-num{font-family:var(--display); font-size:2.4rem; color:var(--blue);}
.counter-label{color:var(--muted); font-size:0.92rem;}
.sheet{
  background:#0E1A2E; border:1px solid var(--line); padding:22px 18px; position:relative;
}
.sheet-stamp{
  position:static; margin:0 0 10px;
  font-size:0.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--blue);
}
.sheet-head h2{font-size:1.5rem; color:#fff;}
.support-picks{
  margin:0 0 14px; padding:10px 12px 4px; border:1px solid var(--line); background:#091422;
}
.support-picks legend{font-size:0.82rem; font-weight:600; padding:0 6px; color:var(--muted);}
.field{margin-bottom:12px; min-width:0;}
.field-row{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px;}
label{display:block; font-size:0.82rem; font-weight:600; margin-bottom:6px;}
.opt{font-weight:400; color:var(--muted);}
input[type="text"], input[type="email"], input[type="tel"], textarea{
  width:100%; max-width:100%; padding:12px; font:inherit; font-size:1rem;
  border:1px solid var(--line); background:#091422; color:#fff;
}
.pledge input, .pledge textarea{color:#fff;}
.pledge input:focus, .pledge textarea:focus{outline:2px solid var(--blue);}
.checkline{display:flex; align-items:flex-start; gap:8px; font-weight:400; font-size:0.9rem; margin:0 0 10px;}
.checkline input{width:auto; margin-top:3px; flex:0 0 auto;}
.fineprint{font-size:0.76rem; color:var(--muted); margin-top:12px; margin-bottom:0;}
.hp-field{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0);}

.toast{
  position:fixed; bottom:18px; left:50%; transform:translateX(-50%) translateY(16px);
  background:#fff; color:#06101C; padding:12px 18px; font-size:0.92rem;
  opacity:0; pointer-events:none; z-index:1100; max-width:min(90vw, 420px); text-align:center;
}
.toast.show{opacity:1; transform:translateX(-50%) translateY(0);}

.site-footer{
  padding:28px 18px 32px; text-align:left; background:#02060E; color:#8AA3C4;
  border-top:1px solid var(--line);
}
.footer-tagline{font-family:var(--display); font-weight:800; color:#fff; letter-spacing:.16em; text-transform:uppercase;}
.footer-sub{color:var(--blue);}
.site-footer p{max-width:62ch;}

@media (max-width:900px){
  .splash, .cheat-grid, .pledge-layout, .stat-grid, .record-links, .beliefs{
    grid-template-columns:1fr;
  }
  .splash{min-height:0;}
  .splash-photo img{min-height:42vh; max-height:48vh;}
  .belief{border-right:0; border-bottom:1px solid var(--line);}
  .belief:last-child{border-bottom:0;}
  .amend{grid-template-columns:minmax(0, 1fr); gap:4px 0;}
}
@media (max-width:640px){
  .choice-grid, .choice-grid--3, .field-row{grid-template-columns:1fr;}
  .choice span{font-size:0.92rem;}
  .quiz-progress{flex-direction:column; align-items:flex-start;}
  .splash-actions .btn{width:100%;}
}
