/* Jackson County Watch: server-rendered story, archive, and editorial page presentation. */
:root { color-scheme: dark; --ink:#eff8f5; --muted:#a7bbb9; --line:rgb(255 255 255 / .12); --green:#79ddb0; --orange:#f19c62; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; background:#071117; color:var(--ink); }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:radial-gradient(circle at 15% 0%,rgb(24 103 89 / .22),transparent 34rem),linear-gradient(140deg,#071117,#0c1820 55%,#081319); line-height:1.65; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.12; background:url('/jackson-county-map-bg.svg') center top / cover no-repeat; }
a { color:inherit; }
.skip { position:fixed; left:12px; top:-80px; z-index:10; padding:10px 14px; background:white; color:#071117; border-radius:6px; }.skip:focus{top:12px}
.site-header { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:76px; padding:12px max(22px,calc((100vw - 1180px)/2)); border-bottom:1px solid var(--line); background:rgb(5 14 20 / .75); backdrop-filter:blur(18px); }
.brand { display:flex; align-items:center; gap:11px; text-decoration:none; }.brand img{width:46px;height:46px}.brand span{display:flex;flex-direction:column}.brand strong{font-size:1rem}.brand small{font-size:.58rem;letter-spacing:.18em;color:var(--green)}
.site-header nav,footer nav { display:flex; flex-wrap:wrap; gap:20px; }.site-header nav a,footer a{font-size:.8rem;font-weight:700;text-decoration:none}.site-header nav a:hover,footer a:hover{text-decoration:underline}
main { position:relative; z-index:1; width:min(920px,calc(100% - 32px)); margin:0 auto; padding:54px 0 80px; }
.story,.archive { padding:clamp(24px,5vw,58px); border:1px solid var(--line); border-radius:20px; background:rgb(10 24 31 / .9); box-shadow:0 28px 80px rgb(0 0 0 / .25); }
.kicker { margin:0 0 12px; color:var(--green); font-size:.72rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
h1 { max-width:19ch; margin:0 0 18px; font-size:clamp(2.15rem,6vw,4.5rem); line-height:1.02; letter-spacing:-.045em; }h2{line-height:1.2}
.dates { display:flex; flex-wrap:wrap; gap:8px 22px; padding-bottom:22px; border-bottom:1px solid var(--line); color:var(--muted); font-size:.78rem; }.dates time{color:var(--ink)}
.location { margin:22px 0 0; color:var(--orange); font-weight:750; }.summary{margin-top:28px;font-size:clamp(1rem,2.2vw,1.15rem)}.summary p{white-space:normal}
.actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:30px; }.action{padding:11px 15px;border-radius:9px;background:var(--green);color:#06120f;font-weight:800;text-decoration:none}.action.secondary{border:1px solid var(--line);background:transparent;color:var(--ink)}
.video{margin-top:36px}.video iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:14px;background:#000}.method{margin-top:40px;padding:18px;border:1px solid var(--line);border-radius:12px;background:rgb(255 255 255 / .035);color:var(--muted);font-size:.9rem}.method p{margin:5px 0 0}
.intro { max-width:66ch; color:var(--muted); font-size:1.08rem; }.archive-list{margin-top:34px}.archive-item{padding:25px 0;border-top:1px solid var(--line)}.archive-item h2{margin:5px 0 7px;font-size:clamp(1.25rem,3vw,1.8rem)}.archive-item h2 a{text-decoration:none}.archive-item h2 a:hover{text-decoration:underline}.archive-item>p:last-child{margin:0;color:var(--muted)}
.policy h2{margin-top:34px}.policy p{color:#c2d0ce}.policy a{color:var(--green)}
footer { position:relative; z-index:1; display:flex; justify-content:space-between; gap:24px; padding:30px max(22px,calc((100vw - 1180px)/2)); border-top:1px solid var(--line); color:var(--muted); }
@media(max-width:720px){.site-header{align-items:flex-start;flex-direction:column;padding:12px 16px 15px}.site-header nav{width:100%;gap:0;overflow-x:auto}.site-header nav a{padding:8px 18px 4px 0;white-space:nowrap}main{padding-top:24px}.story,.archive{padding:24px 19px;border-radius:14px}h1{font-size:2.35rem}.dates{flex-direction:column;gap:4px}footer{flex-direction:column;padding:24px 16px}footer nav{gap:13px 18px}}