:root { --navy:#020347; --red:#ed0e15; --gutter:clamp(20px, 4vw, 48px); }
* { box-sizing:border-box; margin:0; }
html { -webkit-text-size-adjust:100%; }
body { font-family:"DM Sans", Arial, sans-serif; color:var(--navy); background:#fff; overflow-x:hidden; line-height:1.4; }
img { display:block; max-width:100%; height:auto; }
a { color:inherit; text-decoration:none; }
a:focus-visible { outline:3px solid #fff; outline-offset:3px; }
.skip { position:absolute; left:-9999px; }
.skip:focus { left:12px; top:12px; z-index:10; background:#fff; color:var(--navy); padding:8px 12px; }

/* Header + nav */
.hero { position:relative; background:var(--navy); color:#fff; overflow:hidden; padding:clamp(20px, 3vw, 36px) var(--gutter) clamp(56px, 9vw, 130px); }
.hero-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.2; }
.hero-inner { position:relative; max-width:1366px; margin:0 auto; }
.topbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px 32px; }
.logo { display:block; width:clamp(230px, 34vw, 430px); }
.nav { display:flex; align-items:center; gap:clamp(14px, 2.4vw, 32px); font-weight:700; font-size:clamp(16px, 1.4vw, 19px); text-transform:uppercase; letter-spacing:.04em; }
.nav a:not(.nav-donate):not(.social):hover { text-decoration:underline; text-underline-offset:6px; text-decoration-thickness:3px; }
.nav a[aria-current="page"] { text-decoration:underline; text-underline-offset:6px; text-decoration-thickness:3px; }
.nav-donate { background:var(--red); color:#fff; padding:8px 18px; border:2px solid var(--red); transition:background .15s, color .15s; }
.nav-donate:hover { background:#fff; color:var(--red); }
.social { display:block; width:36px; height:36px; flex:none; transition:opacity .15s, transform .15s; }
.social:hover { opacity:.8; transform:scale(1.06); }
.hero h1 { margin-top:clamp(32px, 6vw, 80px); max-width:820px; font-size:clamp(38px, 6vw, 72px); line-height:1.1; font-weight:700; text-transform:uppercase; }
.hero h1 .eyebrow { display:block; margin-bottom:.35em; font-size:.36em; letter-spacing:.08em; color:#fff; opacity:.9; }

/* Inner-page header */
.page-head { padding-bottom:clamp(36px, 6vw, 72px); }
.page-head .logo { width:clamp(200px, 24vw, 300px); }
.page-head h1 { margin-top:clamp(28px, 5vw, 56px); }
.page-head .lede { margin-top:16px; max-width:760px; font-size:clamp(18px, 1.7vw, 22px); line-height:1.45; }

/* Candidates banner */
.banner { position:relative; display:flex; align-items:center; justify-content:center; min-height:clamp(120px, 17.5vw, 239px); padding:24px var(--gutter); overflow:hidden; color:#fff; text-align:center; }
.banner img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 60%; }
.banner::after { content:""; position:absolute; inset:0; background:var(--red); opacity:.54; }
.banner h2 { position:relative; z-index:1; font-family:"League Spartan", sans-serif; font-weight:400; font-size:clamp(28px, 4.2vw, 51px); line-height:1.2; }

/* Candidates grid (home): framed photos */
.candidates { display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(20px, 3vw, 40px); padding:clamp(28px, 4vw, 56px) var(--gutter); background:linear-gradient(90deg, #efefef, #fff); }
.candidates .card { display:flex; flex-direction:column; height:100%; max-width:440px; width:100%; justify-self:center; background:#fff; border:6px solid var(--navy); padding:10px; box-shadow:0 10px 24px rgba(2,3,71,.18); }
.candidates a.card { transition:transform .15s, box-shadow .15s; }
.candidates a.card:hover { transform:translateY(-3px); box-shadow:0 14px 30px rgba(2,3,71,.24); }
.candidates a.card:focus-visible { outline:3px solid var(--red); outline-offset:3px; }
.candidates img { width:100%; aspect-ratio:4 / 4.4; object-fit:cover; object-position:50% 15%; }
.candidates h3 { background:var(--red); color:#fff; text-align:center; padding:12px 10px; font-size:clamp(18px, 1.9vw, 24px); line-height:1.2; font-weight:400; }
.candidates h3 strong { font-weight:700; }
.candidates .short-bio { flex:1; padding:14px 8px 6px; font-size:clamp(16px, 1.3vw, 18px); line-height:1.45; text-align:center; }
.candidates .more { display:block; margin-top:10px; font-weight:700; color:var(--red); }
.candidates a.card:hover .more { text-decoration:underline; }
.federal .short-bio { font-weight:700; text-transform:uppercase; letter-spacing:.03em; }
.banner-navy { background:var(--navy); min-height:0; padding:clamp(22px, 3vw, 36px) var(--gutter); }
.banner-navy::after { display:none; }

/* Vote callout */
.vote-box { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:16px 32px; padding:clamp(28px, 4vw, 44px) var(--gutter); background:var(--navy); color:#fff; text-align:center; }
.vote-box p { font-size:clamp(20px, 2.2vw, 28px); line-height:1.3; }
.vote-box p span { display:block; font-size:.7em; opacity:.9; }

/* Buttons */
.btn { display:inline-block; background:var(--red); color:#fff; font-weight:700; font-size:clamp(18px, 1.6vw, 22px); line-height:1.2; padding:12px 28px; border:3px solid var(--red); text-transform:uppercase; transition:background .15s, color .15s; }
.btn:hover { background:#fff; color:var(--red); }

/* Chairman */
.chair { display:grid; grid-template-columns:1.27fr 1fr; background:#fff; }
.chair-text { display:flex; flex-direction:column; }
.chair-head { background:var(--red); color:#fff; padding:clamp(24px, 3vw, 36px) var(--gutter); font-size:clamp(38px, 5vw, 68px); font-style:italic; font-weight:700; line-height:1.05; }
.chair-head span { display:block; text-align:right; }
.chair-body { padding:clamp(24px, 3vw, 40px) var(--gutter) clamp(32px, 4vw, 56px); font-style:italic; font-size:clamp(17px, 1.5vw, 20px); line-height:1.5; }
.chair-body p + p { margin-top:1.2em; }
.chair-sig { margin-top:1.4em; text-align:right; font-size:clamp(18px, 1.6vw, 22px); line-height:1.25; }
.chair-photo { background:var(--red); padding-right:clamp(0px, 4.1vw, 56px); }
.chair-photo img { width:100%; height:100%; min-height:420px; object-fit:cover; object-position:50% 20%; }

/* Donate band */
.donate { position:relative; display:flex; align-items:center; justify-content:center; min-height:clamp(200px, 18.7vw, 255px); padding:40px var(--gutter); overflow:hidden; }
.donate img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.donate::after { content:""; position:absolute; inset:0; background:var(--navy); opacity:.8; }
.donate a { position:relative; z-index:1; background:var(--red); color:#fff; font-weight:700; font-size:clamp(24px, 2.7vw, 37px); line-height:1.2; padding:14px 40px; border:3px solid var(--red); transition:background .15s, color .15s; }
.donate a:hover { background:#fff; color:var(--red); }

/* Motto band (/candidates/) */
.motto { background:var(--red); color:#fff; text-align:center; padding:clamp(22px, 3vw, 36px) var(--gutter); }
.motto p { font-family:"League Spartan", sans-serif; font-weight:700; font-size:clamp(24px, 3.4vw, 44px); line-height:1.15; font-style:italic; }

/* Candidate profiles (/candidates/) */
.profile { display:grid; grid-template-columns:minmax(260px, 420px) 1fr; gap:clamp(24px, 4vw, 56px); align-items:start; max-width:1200px; margin:0 auto; padding:clamp(40px, 6vw, 80px) var(--gutter); scroll-margin-top:16px; }
.profile + .profile { border-top:1px solid #e3e3ea; }
.profile:nth-of-type(even) { grid-template-columns:1fr minmax(260px, 420px); }
.profile:nth-of-type(even) .profile-photo { order:2; }
.profile-photo img { width:100%; aspect-ratio:666 / 1000; object-fit:cover; }
.profile h2 { font-size:clamp(32px, 4vw, 52px); line-height:1.1; text-transform:uppercase; }
.profile .role { margin-top:8px; color:var(--red); font-weight:700; font-size:clamp(17px, 1.5vw, 20px); text-transform:uppercase; letter-spacing:.04em; }
.profile .bio { margin-top:20px; font-size:clamp(17px, 1.4vw, 19px); line-height:1.6; }
.profile .bio p + p { margin-top:1em; }
.profile:target h2 { color:var(--red); }

/* Prose pages (vote, privacy) */
.prose { max-width:860px; margin:0 auto; padding:clamp(40px, 6vw, 72px) var(--gutter); font-size:clamp(17px, 1.4vw, 19px); line-height:1.6; }
.prose h2 { margin:1.8em 0 .5em; font-size:clamp(24px, 2.6vw, 32px); line-height:1.2; }
.prose h2:first-child { margin-top:0; }
.prose h3 { margin:1.4em 0 .4em; font-size:clamp(19px, 1.7vw, 22px); }
.prose p + p, .prose ul + p, .prose p + ul { margin-top:.9em; }
.prose ul { padding-left:1.3em; }
.prose a { color:var(--red); text-decoration:underline; }
.prose .updated { color:#55567a; font-size:.9em; }

/* Vote page */
.early-banner { background:var(--navy); color:#fff; text-align:center; padding:18px var(--gutter); font-weight:700; font-size:clamp(20px, 2.2vw, 28px); text-transform:uppercase; letter-spacing:.03em; border-top:1px solid rgba(255,255,255,.25); }
.election-day { background:var(--red); color:#fff; text-align:center; padding:18px var(--gutter); font-weight:700; font-size:clamp(18px, 1.9vw, 24px); }
.vote-links { display:flex; flex-wrap:wrap; justify-content:center; gap:16px; max-width:1100px; margin:0 auto; padding:clamp(32px, 5vw, 56px) var(--gutter) 0; }
.vote-links a { flex:1 1 180px; max-width:260px; display:flex; align-items:center; justify-content:center; min-height:88px; padding:16px; background:var(--navy); color:#fff; font-weight:700; font-size:clamp(18px, 1.6vw, 21px); text-align:center; text-transform:uppercase; letter-spacing:.03em; border:3px solid var(--navy); transition:background .15s, color .15s; }
.vote-links a:hover { background:#fff; color:var(--navy); }
.faq details { border-bottom:1px solid #d9d9e3; padding:18px 0; }
.faq summary { cursor:pointer; font-weight:700; font-size:clamp(19px, 1.7vw, 22px); }
.faq details > div { margin-top:12px; }
.draft { background:#fff4b8; outline:2px dashed #c9a400; padding:2px 6px; }

/* Signup */
.signup { background:var(--navy); color:#fff; padding:clamp(40px, 6vw, 72px) var(--gutter); }
.signup-inner { max-width:900px; margin:0 auto; }
.signup h2 { font-size:clamp(30px, 4vw, 48px); line-height:1.1; text-align:center; text-transform:uppercase; }
.signup form { display:grid; grid-template-columns:1fr 1fr; gap:14px 16px; margin-top:clamp(24px, 3vw, 36px); }
.signup label { display:flex; flex-direction:column; gap:6px; font-weight:700; font-size:15px; }
.signup input[type="text"], .signup input[type="email"], .signup input[type="tel"] { font:inherit; font-weight:400; font-size:17px; padding:12px 14px; border:2px solid #fff; border-radius:0; background:#fff; color:var(--navy); }
.signup input:focus-visible { outline:3px solid var(--red); outline-offset:1px; }
.signup .check { grid-column:1 / -1; flex-direction:row; align-items:center; gap:10px; font-weight:400; }
.signup .check input { width:20px; height:20px; accent-color:var(--red); }
.signup button { grid-column:1 / -1; justify-self:center; margin-top:6px; font:inherit; cursor:pointer; }
.signup .consent { grid-column:1 / -1; font-size:13px; line-height:1.5; opacity:.85; }
.signup .consent a { text-decoration:underline; }
.hp { position:absolute; left:-9999px; }

/* Footer */
footer { display:flex; flex-direction:column; align-items:center; gap:clamp(20px, 3vw, 32px); padding:clamp(32px, 4vw, 48px) var(--gutter) clamp(36px, 5vw, 56px); background:#fff; }
footer .logo { width:clamp(220px, 34vw, 400px); }
footer .social { width:44px; height:44px; color:var(--navy); }
.disclaimer { border:3px solid var(--red); color:var(--red); padding:10px 22px; font-weight:700; font-size:clamp(18px, 1.7vw, 22.7px); letter-spacing:.02em; text-align:center; text-transform:uppercase; }
.footer-links { display:flex; gap:24px; font-size:15px; }
.footer-links a { text-decoration:underline; }

@media (max-width: 800px) {
  .candidates { grid-template-columns:1fr; }
  .chair { grid-template-columns:1fr; }
  .chair-photo { padding-right:0; order:2; }
  .chair-photo img { min-height:0; aspect-ratio:1 / 1; }
  .chair-text { display:contents; }
  .chair-head { order:1; }
  .chair-body { order:3; }
  .profile, .profile:nth-of-type(even) { grid-template-columns:1fr; }
  .profile:nth-of-type(even) .profile-photo { order:0; }
  .profile-photo { max-width:420px; }
  .signup form { grid-template-columns:1fr; }
}
@media (max-width: 520px) {
  .nav { width:100%; justify-content:space-between; gap:10px; font-size:15px; }
  .nav-donate { padding:6px 12px; }
}