/* Crisis Compass Carolinas site styles, version 2.
   Idea: an operations map. The 3D map of the Carolinas is the one bold element; everything around it stays plain.
   Orange means act now (get help, 911, alerts) and is never decoration. Lime means connected. Tide means water.
   Header, footer and map bands are always night. Reading pages follow the visitor's light or dark setting. */
:root {
  --night: #0B1714;
  --night-2: #12201B;
  --night-3: #1B2C26;
  --cream: #EEE8D6;
  --sage: #A9B8A6;
  --signal: #FF7A33;
  --signal-dk: #C4521C;
  --tide: #5CC6C3;
  --lime: #B9D48F;
  --on-night-line: rgba(238, 232, 214, 0.14);

  --bg: #F2F4F0;
  --bg-2: #E7ECE5;
  --surface: #FFFFFF;
  --ink: #12201B;
  --muted: #4A5750;
  --line: #CDD6CC;
  --link: #17615D;
  --focus: #17615D;
  --btn: #12201B;
  --btn-ink: #F2F4F0;
  --alert-ink: #A8430F;
  --alert-bg: #FCEBDF;
  --field: #FFFFFF;
  --map-fill: #DCE4D9;
  --map-hover: #A9C7B9;
  --map-stroke: #6F8176;

  --display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --body: "Source Sans 3", "Source Sans Pro", "Segoe UI", system-ui, -apple-system, sans-serif;

  --s-1: 0.875rem;
  --s0: 1.0625rem;
  --s1: 1.25rem;
  --s2: 1.5rem;
  --s3: clamp(1.7rem, 2.4vw, 2.1rem);
  --s4: clamp(2rem, 3.4vw, 2.85rem);
  --s5: clamp(2.45rem, 5.2vw, 4.3rem);

  --measure: 66ch;
  --r-control: 8px;
  --r-panel: 14px;
  --gutter-l: max(16px, env(safe-area-inset-left, 0px));
  --gutter-r: max(16px, env(safe-area-inset-right, 0px));
  --header-h: 68px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0E1A16; --bg-2: #12211C; --surface: #15251F; --ink: #EEE8D6; --muted: #AEBBAB; --line: #293D34;
    --link: #74D3CF; --focus: #74D3CF; --btn: #EEE8D6; --btn-ink: #0B1714; --alert-ink: #FF9A61; --alert-bg: #2A1B12;
    --field: #0B1714; --map-fill: #22362E; --map-hover: #2F5A55; --map-stroke: #0E1A16; color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0E1A16; --bg-2: #12211C; --surface: #15251F; --ink: #EEE8D6; --muted: #AEBBAB; --line: #293D34;
  --link: #74D3CF; --focus: #74D3CF; --btn: #EEE8D6; --btn-ink: #0B1714; --alert-ink: #FF9A61; --alert-bg: #2A1B12;
  --field: #0B1714; --map-fill: #22362E; --map-hover: #2F5A55; --map-stroke: #0E1A16; color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 24px); }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: var(--body); font-size: var(--s0); line-height: 1.6;
  font-feature-settings: "kern", "liga";
}
img, svg, canvas { max-width: 100%; }
a { color: var(--link); text-underline-offset: 0.2em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; border-radius: 4px; }
h1, h2, h3, h4 { margin: 0; color: var(--ink); text-wrap: balance; }
h1, h2 { font-family: var(--display); font-stretch: 112%; font-weight: 750; letter-spacing: -0.015em; line-height: 1.04; }
h1 { font-size: var(--s5); }
h2 { font-size: var(--s4); }
h3 { font-family: var(--display); font-stretch: 100%; font-weight: 650; font-size: var(--s1); line-height: 1.25; letter-spacing: -0.005em; }
h4 { font-size: var(--s0); font-weight: 700; }
p { margin: 0; }
.prose { max-width: var(--measure); }
.prose > * + * { margin-top: 1em; }
.prose ul, .prose ol { padding-left: 1.25em; }
.prose li + li { margin-top: 0.35em; }
.lede { font-size: var(--s1); line-height: 1.5; color: var(--muted); max-width: 58ch; }
.small { font-size: var(--s-1); color: var(--muted); }
.tabular { font-variant-numeric: tabular-nums; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding-left: var(--gutter-l); padding-right: var(--gutter-r); }
.narrow { max-width: 840px; }

.skip { position: absolute; left: -999px; top: 0; background: var(--cream); color: var(--night); padding: 12px 16px; z-index: 60; font-weight: 700; }
.skip:focus { left: var(--gutter-l); top: calc(env(safe-area-inset-top, 0px) + 8px); }

/* ---------- Emergency line and header: always night ---------- */
.emergency { background: #07100D; color: var(--sage); font-size: var(--s-1); }
.emergency .wrap { display: flex; flex-wrap: wrap; gap: 4px 20px; padding-block: 7px; align-items: center; }
.emergency strong { color: #FFFFFF; font-weight: 700; }
.emergency strong::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--signal); margin-right: 8px; vertical-align: 1px; }
.emergency a { color: var(--cream); }

body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 40; background: var(--night); }
.site-header {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 30;
  background: rgba(11, 23, 20, 0.94); color: var(--cream);
  backdrop-filter: saturate(1.3) blur(10px); -webkit-backdrop-filter: saturate(1.3) blur(10px);
  border-bottom: 1px solid var(--on-night-line);
}
.site-header .wrap { display: flex; align-items: center; gap: 12px 24px; min-height: var(--header-h); }
.brand { display: flex; align-items: center; flex: 0 0 auto; padding: 6px 0; }
.brand img { display: block; height: 42px; width: auto; }
.nav { margin-left: auto; display: flex; align-items: center; gap: 2px 20px; flex-wrap: wrap; justify-content: flex-end; }
.nav a { text-decoration: none; color: var(--cream); font-weight: 600; font-size: 0.97rem; padding: 8px 0; border-bottom: 2px solid transparent; }
.nav a:hover { border-bottom-color: rgba(238, 232, 214, 0.45); }
.nav a[aria-current="page"] { border-bottom-color: var(--cream); }
.nav .lang { font-weight: 400; color: var(--sage); }
.site-header :focus-visible, .emergency :focus-visible, .on-night :focus-visible, .site-footer :focus-visible { outline-color: var(--tide); }
.menu-toggle {
  display: none; margin-left: auto; background: transparent; color: var(--cream); border: 1px solid rgba(238, 232, 214, 0.35);
  border-radius: var(--r-control); padding: 10px 16px; font: 600 1rem var(--body); min-height: 44px; cursor: pointer;
}
.btn.header-help { display: none; }
@media (max-width: 1060px) {
  .btn.header-help { display: inline-flex; margin-left: auto; padding: 8px 14px; min-height: 42px; font-size: 0.95rem; white-space: nowrap; background: var(--signal); border-color: var(--signal); color: #0B1714; }
  .header-help + .menu-toggle { margin-left: 0; }
  .menu-toggle { display: inline-flex; }
  .nav {
    display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--night); border-bottom: 1px solid var(--on-night-line);
    flex-direction: column; align-items: stretch; padding: 6px var(--gutter-r) 18px var(--gutter-l); gap: 0;
  }
  .nav.open { display: flex; max-height: calc(100vh - var(--header-h)); max-height: calc(100dvh - var(--header-h)); overflow-y: auto; overscroll-behavior: contain; }
  .nav a { padding: 13px 0; border-bottom: 1px solid var(--on-night-line); }
  .nav a[aria-current="page"] { border-bottom-color: var(--on-night-line); box-shadow: inset 3px 0 0 var(--cream); padding-left: 12px; }
  .nav .btn { margin-top: 14px; }
}
.brand .brand-mark { display: none; }
@media (max-width: 420px) {
  .brand img { height: 32px; }
  .btn.header-help { padding: 8px 12px; }
  .menu-toggle { padding: 8px 12px; }
}
@media (max-width: 370px) {
  .brand .brand-full { display: none; }
  .brand .brand-mark { display: block; height: 38px; width: 38px; }
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font: 700 1rem/1.1 var(--body); padding: 13px 20px; min-height: 48px; border-radius: var(--r-control);
  background: var(--btn); color: var(--btn-ink); border: 2px solid var(--btn); text-decoration: none; cursor: pointer; text-align: center;
}
.btn:hover { filter: brightness(1.12); }
.btn.quiet { background: transparent; color: var(--ink); border-color: var(--line); }
.btn.quiet:hover { border-color: var(--ink); filter: none; }
.btn.signal, .nav .btn { background: var(--signal); border-color: var(--signal); color: #0B1714; }
.btn.on-dark { background: var(--cream); border-color: var(--cream); color: var(--night); }
.btn.on-dark.quiet { background: rgba(11, 23, 20, 0.35); color: var(--cream); border-color: rgba(238, 232, 214, 0.5); }
.btn.on-dark.quiet:hover { border-color: var(--cream); }
.nav .btn { padding: 9px 16px; min-height: 42px; font-size: 0.95rem; border-bottom-width: 2px; }
.nav a.btn:hover, .nav a.btn[aria-current="page"] { border-color: var(--signal); color: #0B1714; }

/* ---------- Sections ---------- */
.section { padding-block: clamp(56px, 8vw, 104px); }
.section + .section { border-top: 1px solid var(--line); }
.section-head { display: grid; gap: 14px; max-width: 780px; margin-bottom: clamp(28px, 4vw, 44px); }
.contour-bg { background-color: var(--bg-2); }
.contour-bg + .section, .section + .contour-bg { border-top: 0; }
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
@media (max-width: 880px) { .split { grid-template-columns: 1fr; } }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-panel); padding: clamp(20px, 3vw, 32px); min-width: 0; }

/* ---------- The map story (home) ---------- */
.on-night { background: var(--night); color: var(--cream); }
.on-night h1, .on-night h2, .on-night h3 { color: #FFFFFF; }
.on-night a:not(.btn) { color: #9FE3E0; }
.on-night .lede { color: #D9D6C8; }
.on-night .small { color: var(--sage); }

.mapstory { position: relative; isolation: isolate; }
.map-stage {
  position: sticky; top: 0; height: 100vh; height: 100svh; margin-bottom: -100vh; margin-bottom: -100svh; z-index: 0; overflow: hidden;
  background: var(--night) url("assets/posters/hero.jpg") 72% 50% / cover no-repeat;
}
.map-stage canvas { position: absolute; inset: 0; display: block; opacity: 0; transition: opacity 700ms ease; }
.map-stage.map-ready canvas { opacity: 1; }
.map-stage::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, rgba(11, 23, 20, 0.92) 0%, rgba(11, 23, 20, 0.7) 30%, rgba(11, 23, 20, 0) 58%),
              linear-gradient(0deg, rgba(11, 23, 20, 0.55) 0%, rgba(11, 23, 20, 0) 22%);
}
.map-labels { position: absolute; inset: 0; pointer-events: none; z-index: 1; opacity: 0; transition: opacity 700ms ease; }
.map-ready .map-labels { opacity: 1; }
.map-label {
  position: absolute; left: 0; top: 0; translate: -50% -140%; white-space: nowrap;
  font: 600 0.78rem/1 var(--body); color: #F4EEDD; letter-spacing: 0.01em; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 12px rgba(0, 0, 0, 0.6);
}
.map-note {
  position: absolute; z-index: 2; right: calc(var(--gutter-r) + 4px); bottom: calc(14px + env(safe-area-inset-bottom, 0px));
  margin: 0; font-size: 0.78rem; color: rgba(238, 232, 214, 0.88); background: rgba(11, 23, 20, 0.74); padding: 2px 8px; border-radius: 6px;
}
.chapter { position: relative; z-index: 1; min-height: 100vh; min-height: 100svh; display: flex; align-items: center; padding-block: 96px; }
.chapter > .wrap { pointer-events: none; }
.chapter > .wrap > * { pointer-events: auto; }
.hero { min-height: calc(100svh - var(--header-h) - 34px); padding-block: clamp(40px, 7vh, 88px) clamp(56px, 10vh, 120px); }
.hero h1 { max-width: 13ch; font-size: clamp(2.5rem, 4.9vw, 4.1rem); line-height: 1.02; text-shadow: 0 2px 30px rgba(0, 0, 0, 0.35); }
.hero .lede { margin-top: 22px; max-width: 46ch; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.glass {
  background: rgba(16, 30, 25, 0.74); border: 1px solid rgba(238, 232, 214, 0.14); border-radius: var(--r-panel);
  backdrop-filter: blur(16px) saturate(1.25); -webkit-backdrop-filter: blur(16px) saturate(1.25);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
}
.county-jump { margin-top: 36px; max-width: 34rem; padding: 18px 20px 20px; display: grid; gap: 10px; }
.county-jump .jump-title { font-family: var(--display); font-stretch: 105%; font-weight: 650; font-size: 1.12rem; color: #FFFFFF; }
.county-jump label { font-weight: 600; font-size: 0.95rem; color: #E4E0D2; }
.county-jump .lookup { display: grid; gap: 8px; padding-bottom: 12px; margin-bottom: 2px; border-bottom: 1px solid rgba(238, 232, 214, 0.14); }
.jump-row, .lookup-row { display: flex; gap: 10px; flex-wrap: wrap; }
.jump-row select, .jump-row input, .lookup-row input { flex: 1 1 200px; min-width: 0; }
.county-jump .jump-row select, .county-jump .jump-row input { background: #0B1714; color: var(--cream); border-color: rgba(238, 232, 214, 0.35); }
.jump-row .btn, .lookup-row .btn { flex: 0 0 auto; }
.county-jump .small { color: var(--sage); }
.lookup-status { min-height: 0; font-weight: 600; }
.lookup-status:empty { display: none; }
.county-jump .lookup-status { color: #FFFFFF; }
.lookup-choices { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.choice {
  font: 600 0.95rem var(--body); color: inherit; background: transparent; border: 1px solid currentColor; border-radius: 999px;
  padding: 8px 14px; min-height: 44px; cursor: pointer;
}
.choice:hover { background: rgba(127, 127, 127, 0.14); }
#county-finder .lookup { padding-bottom: 16px; border-bottom: 1px solid var(--line); }

.chapter-card { max-width: 31rem; padding: clamp(22px, 3vw, 32px); display: grid; gap: 14px; }
.chapter-card h2 { font-size: var(--s3); line-height: 1.1; }
.chapter-card p { color: #DEDBCD; }
.chapter-card .when { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: var(--s-1); color: var(--cream); }
.map-key { list-style: none; margin: 4px 0 0; padding: 14px 0 0; border-top: 1px solid rgba(238, 232, 214, 0.14); display: grid; gap: 8px; font-size: var(--s-1); color: var(--sage); }
.map-key li { display: flex; align-items: center; gap: 10px; }
.key { flex: 0 0 auto; display: inline-block; }
.key.dot { width: 10px; height: 10px; border-radius: 50%; }
.key.line { width: 18px; height: 3px; border-radius: 2px; }
.key.lime { background: var(--lime); box-shadow: 0 0 10px rgba(185, 212, 143, 0.7); }
.key.signal { background: var(--signal); box-shadow: 0 0 10px rgba(255, 122, 51, 0.7); }
.key.tide { background: var(--tide); box-shadow: 0 0 10px rgba(92, 198, 195, 0.7); }
.key.storm { background: #D9DCD8; }

@media (max-width: 900px) {
  .map-stage::after { background: linear-gradient(180deg, rgba(11, 23, 20, 0.86) 0%, rgba(11, 23, 20, 0.45) 45%, rgba(11, 23, 20, 0.15) 70%, rgba(11, 23, 20, 0.6) 100%); }
  .chapter { align-items: flex-end; padding-block: 72px 56px; min-height: 135vh; min-height: 135svh; }
  .chapter.hero { min-height: calc(100svh - var(--header-h)); }
  .map-stage.in-hero .map-labels { opacity: 0; }
  .hero { align-items: flex-start; }
  .chapter-card { max-width: none; }
  .map-label { font-size: 0.72rem; }
}
@media (prefers-reduced-motion: reduce) {
  .map-stage canvas, .map-labels { transition: none; }
}

/* Before, during, after */
.stages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
.stages a { display: grid; gap: 10px; align-content: start; padding: 26px 28px 30px 0; color: var(--ink); text-decoration: none; border-top: 3px solid var(--ink); }
.stages a + a { padding-left: 28px; }
.stages .when { font-size: var(--s-1); font-weight: 700; color: var(--muted); }
.stages h3 { font-size: var(--s2); font-stretch: 110%; font-weight: 750; }
.stages p { color: var(--muted); }
.stages a:hover h3 { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.18em; }
.stages a.urgent-stage { border-top-color: var(--signal); }
@media (max-width: 780px) {
  .stages { grid-template-columns: 1fr; }
  .stages a, .stages a + a { padding: 22px 0 26px; }
}

/* Tools as a ruled list */
.toolrow { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.tool-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.tool-list li { border-bottom: 1px solid var(--line); }
.tool-list a { display: grid; gap: 6px; padding: 22px 0; color: var(--ink); text-decoration: none; }
.tool-list h3 { font-size: var(--s1); }
.tool-list p { color: var(--muted); }
.tool-list .kind { font-size: var(--s-1); font-weight: 600; color: var(--muted); }
.tool-list a:hover h3 { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.18em; }
@media (max-width: 880px) { .toolrow { grid-template-columns: 1fr; } }

/* Older tools grid on inner pages */
.tools { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.tool-link { display: grid; gap: 10px; padding: 24px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-panel); text-decoration: none; color: var(--ink); align-content: start; }
.tool-link:hover { border-color: var(--ink); }
.tool-link .kind { font-size: var(--s-1); color: var(--muted); font-weight: 600; }
@media (max-width: 880px) { .tools { grid-template-columns: 1fr; } }

/* Commitments */
.commitments { background: var(--night-2); color: var(--cream); }
.commitments h2, .commitments h3 { color: #FFFFFF; }
.commitments .lede { color: #D9D6C8; }
.commitments a { color: #9FE3E0; }
.commitments :focus-visible { outline-color: var(--tide); }
.commitments .section-head { margin-bottom: 0; }
.commit-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; margin: 40px 0 0; list-style: none; padding: 0; }
.commit-list li { border-top: 1px solid rgba(238, 232, 214, 0.3); padding-top: 18px; display: grid; gap: 10px; align-content: start; }
.commit-list p { color: #D9D6C8; }
.commit-more { margin-top: 32px; }
@media (max-width: 880px) { .commit-list { grid-template-columns: 1fr; gap: 24px; } }

/* ---------- Inner page heads ---------- */
.page-head {
  position: relative; background: var(--night); color: var(--cream); overflow: hidden; border-bottom: 1px solid var(--on-night-line);
  padding-block: clamp(48px, 7vw, 96px) clamp(40px, 5vw, 64px);
}
.page-head::before { content: ""; position: absolute; inset: 0; background: no-repeat 70% 50% / cover; opacity: 0.95; }
.page-head::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11, 23, 20, 1) 0%, rgba(11, 23, 20, 0.88) 38%, rgba(11, 23, 20, 0.25) 75%, rgba(11, 23, 20, 0.1) 100%); }
.page-head .wrap { position: relative; z-index: 1; }
.page-head h1 { color: #FFFFFF; font-size: clamp(2.2rem, 4.6vw, 3.6rem); max-width: 18ch; }
.page-head .lede { margin-top: 16px; color: #D9D6C8; }
.page-head a { color: #9FE3E0; }
.page-head :focus-visible { outline-color: var(--tide); }
.poster-hero::before { background-image: url("assets/posters/hero.jpg"); }
.poster-network::before { background-image: url("assets/posters/network.jpg"); }
.poster-storm::before { background-image: url("assets/posters/storm.jpg"); }
.poster-ridge::before { background-image: url("assets/posters/ridge.jpg"); }
.page-head:not([class*="poster-"])::after { background: radial-gradient(120% 140% at 100% 0%, rgba(92, 198, 195, 0.12), rgba(11, 23, 20, 0) 55%); }
@media (max-width: 760px) {
  .page-head::after { background: linear-gradient(180deg, rgba(11, 23, 20, 0.7) 0%, rgba(11, 23, 20, 0.92) 100%); }
  .page-head::before { background-position: 62% 50%; }
}
.lang-switch { margin-top: 16px; font-weight: 600; }
.on-page { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 24px; font-size: var(--s-1); }
.on-page a { font-weight: 600; }

/* ---------- Get Help ---------- */
.urgent {
  border: 1px solid var(--line); border-left: 6px solid var(--signal); border-radius: var(--r-panel);
  padding: 20px 24px; display: grid; gap: 6px; background: var(--alert-bg);
}
.urgent h2 { font-family: var(--display); font-stretch: 105%; font-size: var(--s2); font-weight: 750; color: var(--alert-ink); }
.list-title { font-size: var(--s3); margin: 44px 0 10px; }
.filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 26px; }
.filter button {
  font: 600 0.98rem var(--body); padding: 10px 15px; min-height: 44px; border-radius: 999px; cursor: pointer;
  background: var(--surface); color: var(--ink); border: 1px solid var(--line);
}
.filter button:hover { border-color: var(--ink); }
.filter button[aria-pressed="true"] { background: var(--btn); color: var(--btn-ink); border-color: var(--btn); }
.resource-list { display: grid; gap: 0; list-style: none; padding: 0; margin: 0; }
.resource { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 28px; padding: 22px 0; border-top: 1px solid var(--line); }
.resource:last-child { border-bottom: 1px solid var(--line); }
.resource .body { display: grid; gap: 6px; min-width: 0; }
.resource h3 { font-size: var(--s1); }
.resource .what { color: var(--ink); }
.resource .meta { font-size: var(--s-1); color: var(--muted); }
.resource .where { font-size: var(--s-1); font-weight: 700; color: var(--muted); }
.resource .reach { display: grid; gap: 6px; justify-items: end; align-content: start; text-align: right; }
.reach-line { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: flex-end; gap: 4px 8px; }
.reach-line .label { font-size: var(--s-1); color: var(--muted); }
.phone {
  font-family: var(--display); font-stretch: 100%; font-weight: 700; font-size: var(--s1); font-variant-numeric: tabular-nums;
  white-space: nowrap; color: var(--ink); text-decoration: none;
}
.phone:hover { text-decoration: underline; }
@media (max-width: 640px) {
  .resource { grid-template-columns: 1fr; }
  .resource .reach { justify-items: start; text-align: left; }
  .reach-line { justify-content: flex-start; }
}
.notice { font-size: var(--s-1); color: var(--muted); border-top: 1px solid var(--line); padding-top: 14px; margin-top: 30px; max-width: var(--measure); }
.copy-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

/* ---------- Plain lists ---------- */
.ledger { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; }
.ledger li { padding: 14px 0; border-top: 1px solid var(--line); display: grid; gap: 4px; }
.ledger li:last-child { border-bottom: 1px solid var(--line); }
.ledger b { font-weight: 700; }
.steps { counter-reset: step; list-style: none; padding: 0; margin: 0; display: grid; gap: 0; }
.steps > li { counter-increment: step; display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 16px; padding: 24px 0; border-top: 1px solid var(--line); }
.steps > li::before { content: counter(step); font-family: var(--display); font-stretch: 112%; font-weight: 750; font-size: var(--s3); color: var(--link); line-height: 1; }
.steps > li > div { min-width: 0; }
.steps h3 { margin-bottom: 6px; }
.steps p + p { margin-top: 0.6em; }
details { border-top: 1px solid var(--line); padding: 16px 0; }
details:last-of-type { border-bottom: 1px solid var(--line); }
summary { cursor: pointer; font-family: var(--display); font-weight: 650; font-size: var(--s1); }
details[open] summary { margin-bottom: 10px; }
.checklist { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; }
.checklist li { padding: 10px 0 10px 30px; border-top: 1px solid var(--line); position: relative; }
.checklist li:first-child { border-top: 0; }
.checklist li::before { content: ""; position: absolute; left: 2px; top: 15px; width: 14px; height: 14px; border: 2px solid var(--link); border-radius: 3px; }
.pledge { margin-top: 28px; padding: 18px 22px; border-left: 4px solid var(--link); background: var(--surface); font-weight: 600; border-radius: 0 var(--r-panel) var(--r-panel) 0; }
.plain-list { list-style: none; padding: 0; margin: 6px 0 10px; display: grid; gap: 6px; }
.policy h2 { font-size: var(--s2); margin-top: 1.6em; }
.policy h3 { margin-top: 1.2em; }
.spaced { margin-top: 20px; }
.small.spaced { margin-top: 18px; }

/* ---------- Tools and forms ---------- */
.tool { display: grid; gap: 20px; }
.tool .small:first-child { margin-top: -4px; }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
legend { font-weight: 700; padding: 0; margin-bottom: 8px; }
label { font-weight: 600; }
.field { display: grid; gap: 6px; }
input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="url"], input[type="search"], select, textarea {
  font: 400 1rem var(--body); color: var(--ink); background: var(--field); border: 1px solid var(--muted);
  border-radius: var(--r-control); padding: 12px; min-height: 48px; width: 100%;
}
textarea { min-height: 96px; resize: vertical; }
.hint { font-size: var(--s-1); color: var(--muted); font-weight: 400; }
.req { font-size: var(--s-1); font-weight: 600; color: var(--alert-ink); }
.check-item { display: grid; gap: 10px; padding: 18px 0; border-top: 1px solid var(--line); }
.check-item:last-of-type { border-bottom: 1px solid var(--line); }
.check-item legend, .tenure legend, .tool legend { font-weight: 700; }
fieldset.tenure { padding-bottom: 18px; }
.choices { display: flex; flex-wrap: wrap; gap: 8px; }
.choices label { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; border: 1px solid var(--line); border-radius: 999px; padding: 8px 15px; cursor: pointer; background: var(--surface); min-height: 44px; }
.choices input { accent-color: var(--link); width: 18px; height: 18px; }
.choices label:has(input:checked) { border-color: var(--link); box-shadow: inset 0 0 0 1px var(--link); }
.choices.stacked { flex-direction: column; align-items: stretch; }
.choices.stacked label { border-radius: var(--r-control); }
.check-inline { display: flex; align-items: flex-start; gap: 10px; font-weight: 600; cursor: pointer; }
.check-inline input { width: 20px; height: 20px; margin-top: 3px; accent-color: var(--link); flex: 0 0 auto; }
.result { border-left: 4px solid var(--link); padding: 16px 20px; background: var(--surface); border-radius: 0 var(--r-panel) var(--r-panel) 0; }
.result h3 { margin-bottom: 8px; }
.result ol { padding-left: 1.25em; margin: 8px 0 0; }
.result li + li { margin-top: 10px; }
.result:focus { outline: 3px solid var(--focus); outline-offset: 3px; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 640px) { .grid-2 { grid-template-columns: 1fr; } }
.money { font-family: var(--display); font-stretch: 112%; font-size: var(--s5); font-weight: 750; color: var(--ink); font-variant-numeric: tabular-nums; line-height: 1.05; letter-spacing: -0.02em; }
.calc-out { display: grid; align-content: start; min-height: 220px; }
.calc-out .money { margin: 2px 0 4px; }
.status { display: inline-block; font-size: var(--s-1); font-weight: 700; padding: 3px 10px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--muted); }
.status.live { color: var(--ink); border-color: var(--link); }
.status.live::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #5E8F2E; margin-right: 7px; vertical-align: 1px; }
.form-actions { margin-top: 8px; }
.cc-form { display: grid; gap: 22px; }
.cc-form h2 { font-size: var(--s2); }
.who legend { float: left; width: 100%; padding: 0; font-family: var(--display); font-size: var(--s1); font-weight: 650; margin-bottom: 12px; }
.who .choices { clear: both; }
fieldset.panel { border: 1px solid var(--line); }
.check-group .checks { display: grid; gap: 8px 20px; }
.check-group.cols .checks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.check-group label, .county-list label { display: flex; align-items: flex-start; gap: 10px; font-weight: 400; cursor: pointer; }
.check-group input, .county-list input { width: 18px; height: 18px; margin-top: 4px; accent-color: var(--link); flex: 0 0 auto; }
@media (max-width: 560px) { .check-group.cols .checks { grid-template-columns: 1fr; } }
.county-picker { display: grid; gap: 8px; }
.county-list { max-height: 280px; overflow-y: auto; border: 1px solid var(--muted); border-radius: var(--r-control); padding: 6px 14px 10px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px 16px; background: var(--field); }
.county-list label[hidden] { display: none; }
.county-state { grid-column: 1 / -1; font-weight: 700; font-size: var(--s-1); color: var(--muted); padding: 10px 0 4px; position: sticky; top: -6px; background: var(--field); }
@media (max-width: 560px) { .county-list { grid-template-columns: 1fr 1fr; } }
.consents { display: grid; gap: 12px; padding-top: 6px; border-top: 1px solid var(--line); }
.form-status { font-weight: 600; min-height: 1.4em; }
.form-status.ok { color: var(--link); }
.form-status.error { color: var(--alert-ink); }

/* ---------- What we do, team, donate ---------- */
.programs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.program { display: grid; gap: 12px; align-content: start; padding-top: 20px; border-top: 3px solid var(--ink); }
.program h2 { font-size: var(--s2); font-stretch: 108%; }
.program .status { justify-self: start; }
@media (max-width: 900px) { .programs { grid-template-columns: 1fr; } }
.category-list { list-style: none; padding: 0; margin: 12px 0 0; columns: 2; column-gap: 28px; }
.category-list li { break-inside: avoid; padding: 8px 0; border-top: 1px solid var(--line); }
@media (max-width: 520px) { .category-list { columns: 1; } }
.team { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 4vw, 48px); max-width: 780px; }
.team li { display: grid; gap: 18px; align-content: start; }
.team img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--r-panel); background: var(--bg-2); filter: saturate(0.92); }
.team-text { display: grid; gap: 2px; align-content: start; min-width: 0; }
.team h3 { font-size: var(--s2); margin-bottom: 4px; }
.team-role { font-weight: 600; color: var(--ink); line-height: 1.35; }
.team-place { font-size: var(--s-1); color: var(--muted); }
.team-bio { margin-top: 10px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--muted); }
@media (max-width: 600px) {
  .team { grid-template-columns: 1fr; gap: 32px; }
  .team li { grid-template-columns: 112px minmax(0, 1fr); column-gap: 18px; }
  .team h3 { font-size: var(--s1); }
}
.contact-details { margin: 0; display: grid; gap: 0; max-width: 34rem; border-top: 1px solid var(--line); }
.contact-details > div { display: grid; grid-template-columns: 6rem minmax(0, 1fr); gap: 4px 16px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.contact-details dt { font-weight: 700; }
.contact-details dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.contact-details .soon { color: var(--muted); }
@media (max-width: 420px) { .contact-details > div { grid-template-columns: 1fr; } }
.prose .contact-details { margin-top: 1.25em; }
.contact-direct { display: grid; gap: 14px; margin-top: clamp(36px, 5vw, 52px); }
.contact-direct h2, .fund h2 { font-size: var(--s2); }
.solicitation { margin-top: 20px; padding: 16px 20px; border: 2px solid var(--ink); border-radius: var(--r-control); font-weight: 700; font-size: var(--s-1); line-height: 1.5; display: grid; gap: 8px; max-width: var(--measure); }
.btn-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.fund { display: grid; gap: 10px; }
.cta { display: grid; gap: 14px; justify-items: start; }
.cta .btn-row { margin-top: 4px; }
.ci-detail { font-weight: 400; }
.empty-state h3 { margin-bottom: 8px; }
.empty-state p + p { margin-top: 10px; }
.sponsors { display: grid; gap: 20px; }
.sponsor { display: grid; gap: 10px; }
.sponsor h3 { font-size: var(--s2); }

/* ---------- County finder (Resources) ---------- */
.finder { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 36px; align-items: start; }
.finder-side { display: grid; gap: 20px; }
.map-wrap { min-width: 0; }
.county-map { width: 100%; height: auto; display: block; }
.county-map .counties path { fill: var(--map-fill); stroke: var(--map-stroke); stroke-width: 0.8; cursor: pointer; transition: fill 120ms ease; }
.county-map .counties path:hover { fill: var(--map-hover); }
.county-map .counties path.on { fill: var(--link); }
.county-map .state-line { fill: none; stroke: var(--ink); stroke-width: 1.6; pointer-events: none; }
.county-map .state-edge { fill: none; stroke: var(--ink); stroke-width: 1; pointer-events: none; }
.county-result h2 { font-size: var(--s2); font-stretch: 108%; margin-bottom: 8px; }
.county-result .ledger li { padding: 12px 0; }
.county-result:focus { outline: 3px solid var(--focus); outline-offset: 3px; }
#county-finder { display: grid; gap: 16px; justify-items: start; }
#county-finder .field { width: 100%; }
@media (max-width: 900px) { .finder { grid-template-columns: 1fr; } .finder-side { order: -1; } }

/* ---------- Crisis banner ---------- */
.crisis-banner { background: var(--signal); color: #1A0E06; }
.crisis-banner .banner-inner { padding-block: 16px 18px; display: grid; gap: 8px; max-width: 920px; }
.crisis-banner h2 { font-family: var(--display); font-stretch: 105%; font-size: var(--s1); font-weight: 750; color: #1A0E06; }
.crisis-banner a { color: #1A0E06; font-weight: 700; }
.crisis-banner .small { color: #3A2010; }
.crisis-banner :focus-visible { outline-color: #1A0E06; }
.banner-links { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px 22px; }

/* ---------- Footer: always night ---------- */
.site-footer {
  background: var(--night); color: var(--sage); border-top: 1px solid var(--on-night-line);
  padding-block: 56px calc(32px + env(safe-area-inset-bottom, 0px)); font-size: var(--s-1);
}
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 36px; }
.footer-grid h2 { font-family: var(--display); font-stretch: 100%; font-size: var(--s0); font-weight: 650; color: #FFFFFF; margin-bottom: 12px; letter-spacing: 0; }
.footer-grid ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 7px; }
.footer-grid a { color: var(--cream); }
.footer-brand { display: grid; gap: 16px; align-content: start; }
.footer-brand img { width: 230px; height: auto; display: block; }
.footer-legal { margin-top: 40px; padding-top: 18px; border-top: 1px solid var(--on-night-line); display: grid; gap: 6px; }
.footer-legal a { color: var(--cream); }
.footer-legal p:last-child { display: flex; flex-wrap: wrap; gap: 4px 16px; }
@media (max-width: 880px) { .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .footer-grid { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
@media print {
  .emergency, .site-header, .site-footer, .map-stage, .filter, .no-print { display: none !important; }
  body.print-steps main > *:not(#check), body.print-steps #check .section-head, body.print-steps #readiness, body.print-steps .copy-row { display: none !important; }
  body { background: #fff; color: #000; }
  .page-head, .on-night, .commitments { background: #fff !important; color: #000 !important; }
  .page-head::before, .page-head::after { display: none; }
  .page-head h1, .page-head .lede, .on-night h1, .on-night h2, .on-night p { color: #000 !important; }
  .chapter { min-height: 0; padding-block: 16px; }
  .glass { background: #fff; box-shadow: none; border-color: #999; }
}

/* Get Help quick numbers and state filter */
.quick { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--line); }
.quick li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 16px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.quick li > span:first-child { font-weight: 600; }
.quick .phone { font-size: var(--s0); }
.urgent h2 .phone { font: inherit; color: inherit; text-decoration: underline; text-underline-offset: 0.15em; }
.filter-state { margin-bottom: 4px; }
.key-note { color: rgba(238, 232, 214, 0.6); font-size: 0.8rem; }