/**
 * Forty-Five Years (/45-years/): the year-end campaign page.
 *
 * Loaded only on pages that use [ploughshares_eoy_campaign]
 * (includes/shortcodes/eoy-campaign.php), so the page-level rules at the top
 * touch no other page. Everything below "Design" is the design file's own
 * stylesheet (references/eoy-campaign/index.html), scoped under .psh,
 * unchanged except where marked "WP:".
 */

/* ---------- Page level (from the design's page <style>) ---------- */
html { scroll-behavior: smooth; }
body { background: #fff; color: #262626; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* ---------- Design ---------- */
/* Layout: Twilight campaign panel + duotone archival photo, then a long-read story,
   a give band, campaign features and a report archive shelf. */
.psh {
  /* Ploughshares design system tokens */
  --twilight: #2a3691;
  --twilight-deep: #1d2668;
  --sky: #18a8e2;
  --ink: #262626;
  --ink-muted: #4a4f6a;
  --surface-000: #ffffff;
  --surface-100: #f1f1f1;
  --border: #d2d9e8;
  --maxw: 1180px;
  --nav-h: 64px;

  font-family: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.625;
  color: var(--ink);
  background: var(--surface-000);
  -webkit-font-smoothing: antialiased;
}
.psh *, .psh *::before, .psh *::after { box-sizing: border-box; }
/* Reset so a WordPress theme's element styles don't leak in. */
.psh :where(h1, h2, h3, p, figure, figcaption, blockquote, cite) { margin: 0; padding: 0; font-family: inherit; color: inherit; text-transform: none; font-style: normal; border: 0; quotes: none; background: none; }
.psh :where(blockquote)::before, .psh :where(blockquote)::after { content: none; }
.psh :where(ol, ul, li) { list-style: none; margin: 0; padding: 0; }
.psh :where(li)::before, .psh :where(li)::marker { content: none; }
.psh :where(img) { max-width: 100%; display: block; height: auto; border: 0; padding: 0; margin: 0; box-shadow: none; border-radius: 0; }
.psh :where(a) { color: inherit; text-decoration: none; }
/* WP: the theme skin's a:hover and a:focus (colour and underline) outrank the line above; this ties them, prints later, and loses to every design rule that sets its own hover. */
.psh a:where(:hover, :focus) { color: inherit; text-decoration: none; }
.psh :where(button) { font: inherit; margin: 0; cursor: pointer; text-transform: none; box-shadow: none; }
.psh a:focus-visible, .psh button:focus-visible { outline: 2px solid var(--sky); outline-offset: 3px; }
.psh h1, .psh h2, .psh h3 { text-wrap: balance; }
.psh-wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 16px; }
@media (min-width: 768px) { .psh-wrap { padding: 0 32px; } }

/* CTA: Bold uppercase on a pill */
.psh .psh-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  padding: 12px 24px; border-radius: 9999px;
  font-size: 14px; line-height: 20px; font-weight: 600; letter-spacing: normal; text-transform: uppercase;
  background: var(--twilight); color: #fff; border: 2px solid var(--twilight);
  transition: background .2s, color .2s, border-color .2s;
}
.psh .psh-btn:hover { background: var(--sky); border-color: var(--sky); color: #fff; }
.psh .psh-btn--light { background: #fff; color: var(--twilight); border-color: #fff; }
.psh .psh-btn--outline { background: transparent; color: #fff; border-color: rgba(255,255,255,.7); }
.psh .psh-btn--light:hover, .psh .psh-btn--outline:hover { background: var(--sky); border-color: var(--sky); color: #fff; }
.psh .psh-btn--lg { padding: 15px 32px; font-size: 15px; }

.psh-eyebrow { font-size: 14px; line-height: 20px; font-weight: 600; letter-spacing: normal; text-transform: uppercase; color: var(--twilight); }
.psh-section-head { display: grid; gap: 10px; max-width: 640px; margin-bottom: 40px; }
.psh-section-head h2 { font-size: clamp(1.6rem, 3.6vw, 2.25rem); line-height: 1.2; font-weight: 600; }
.psh-section-head p { color: var(--ink-muted); }

/* Beacons: large, cropped to an edge, never shown whole */
.psh-beacon { position: absolute; pointer-events: none; user-select: none; z-index: 0; }

/* Brand duotone as a gradient map (SVG filter #psh-duo in the markup) */
.psh-duotone { position: relative; overflow: hidden; background: var(--twilight); }
.psh-duotone img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) url(#psh-duo); }
/* Dark originals: lift brightness before the duotone so faces read */
.psh .psh-duotone--lift img:not(.psh-duotone__orig) { filter: grayscale(1) brightness(1.45) contrast(1.15) url(#psh-duo); }
.psh-svgdefs { position: absolute; width: 0; height: 0; overflow: hidden; }

/* ---------- Hero ---------- */
.psh-hero { display: grid; grid-template-columns: 1fr; background: var(--twilight); color: #fff; }
.psh-hero__panel { position: relative; overflow: hidden; padding: 24px 16px 40px; }
.psh-hero__panel > *:not(.psh-beacon) { position: relative; z-index: 1; }
.psh-hero__panel .psh-beacon { width: 380px; right: -150px; top: -150px; opacity: .2; }
.psh-logo img { height: 24px; width: auto; }
.psh-hero__text { margin-top: 40px; max-width: 600px; }
.psh-hero .psh-eyebrow { color: #fff; margin-bottom: 14px; }
.psh-hero h1 { font-size: clamp(2.4rem, 6.4vw, 4rem); line-height: 1.05; letter-spacing: -.015em; font-weight: 700; margin-bottom: 22px; }
.psh-hero__lede { font-size: 18px; line-height: 30px; margin-bottom: 30px; color: rgba(255,255,255,.92); max-width: 34em; }
.psh-hero__lede strong { font-weight: 700; color: #fff; }
.psh-hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; }
.psh-hero__photo { position: relative; aspect-ratio: 4 / 3; max-width: 100%; margin: 0; }
.psh-hero__photo img { object-position: 52% 30%; }
.psh-hero__photo figcaption {
  position: absolute; left: 16px; bottom: 14px; right: 16px;
  font-size: 13px; line-height: 18px; font-weight: 300; color: #fff;
  text-shadow: 0 1px 8px rgba(16,21,63,.7);
}
@media (max-width: 599px) {
  .psh-hero h1 { font-size: 1.9rem; }
  .psh-hero__lede { font-size: 16px; line-height: 26px; margin-bottom: 24px; }
}
@media (min-width: 768px) {
  .psh-hero__panel { padding: 36px 32px 64px; }
  .psh-logo img { height: 30px; }
  .psh-hero__text { margin-top: 64px; }
  .psh-hero__photo { aspect-ratio: 16 / 9; }
}
@media (min-width: 1000px) {
  .psh-hero { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); min-height: min(80vh, 720px); }
  .psh-hero__panel { display: flex; flex-direction: column; padding: 40px 56px 64px max(32px, calc((100vw - var(--maxw)) / 2 + 32px)); }
  .psh-hero__text { margin-top: auto; padding-top: 56px; }
  .psh-hero__photo { aspect-ratio: auto; }
  .psh-hero__photo figcaption { left: 24px; bottom: 20px; }
  .psh-hero__panel .psh-beacon { width: 620px; right: -250px; top: -230px; }
}

/* ---------- Sticky nav ---------- */
.psh-nav {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50;
  background: rgba(255,255,255,.95);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
}
.psh-nav .psh-wrap { display: flex; align-items: center; gap: 12px; height: var(--nav-h); }
.psh-nav__logo { display: none; margin-right: auto; }
.psh-nav__logo img { height: 24px; width: auto; }
@media (min-width: 1000px) { .psh-nav__logo { display: block; } }
.psh-nav ul { display: flex; gap: 2px; flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: none; }
@media (min-width: 1000px) { .psh-nav ul { flex: 0 1 auto; } }
.psh-nav ul::-webkit-scrollbar { display: none; }
.psh-nav ul a { display: block; padding: 6px 14px; border-radius: 9999px; font-size: 15px; font-weight: 600; color: var(--ink-muted); white-space: nowrap; transition: background .2s, color .2s; }
.psh-nav ul a:hover { color: var(--twilight); }
.psh-nav ul a.is-active { background: var(--twilight); color: #fff; }
.psh-nav .psh-btn { padding: 9px 20px; flex: none; }
@media (max-width: 420px) { .psh-nav ul a { padding: 6px 10px; font-size: 14px; } .psh-nav .psh-btn { padding: 8px 14px; font-size: 13px; } }
[id^="psh-"] { scroll-margin-top: calc(var(--nav-h) + 8px); }

/* ---------- Story ---------- */
.psh-story { padding: 72px 0 64px; }
/* One reading column; the two quotes break out to the full width of the page */
.psh-story__flow { display: grid; gap: 32px; }
.psh-story__row { display: grid; gap: 32px; }
.psh-story__col { display: grid; gap: 28px; align-content: start; min-width: 0; }
@media (min-width: 960px) {
  .psh-story__row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 64px; align-items: center; }
  .psh-story__row + .psh-story__row { margin-top: 32px; }
  .psh-story__row--flip > .psh-photo { order: -1; }
  .psh-story__row .psh-photo { margin-block: 0; }
  .psh-story__row .psh-photo--portrait { max-width: 460px; justify-self: center; }
}
.psh-story__head { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 20px 56px; margin-bottom: 8px; }
.psh-story__head .psh-section-head { margin-bottom: 0; }
.psh-sf { display: block; flex: 1 1 380px; min-width: 0; width: 100%; max-width: 680px; height: auto; color: var(--sky); }
.psh.js .psh-sf path { stroke-dasharray: 1; stroke-dashoffset: 1; }
.psh.js .is-visible .psh-sf path { animation: psh-draw 2.2s cubic-bezier(.4,.1,.2,1) forwards; }
.psh.js .is-visible .psh-sf g:last-child path { animation-delay: 1.1s; animation-duration: 1.4s; }
@keyframes psh-draw { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) { .psh.js .psh-sf path { stroke-dasharray: none; stroke-dashoffset: 0; animation: none !important; } }
@media (max-width: 599px) { .psh-sf { max-width: 300px; } }
.psh-prose { max-width: 40em; display: grid; gap: 24px; font-size: 18px; line-height: 31px; }

/* Quotes sit in the reading column at body size, set apart by weight and color */
.psh-quote, .psh-consensus { display: grid; gap: 10px; max-width: 40em; }
.psh-quote p, .psh-consensus p { font-size: 18px; line-height: 31px; font-weight: 600; color: var(--twilight); }
.psh-quote footer, .psh-consensus footer { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.psh-quote footer strong, .psh-consensus footer strong { display: block; font-weight: 600; color: var(--ink); }

.psh-photo { display: grid; gap: 10px; margin-block: 8px; }
.psh-photo--portrait { max-width: 480px; }
.psh-photo--wide { max-width: 100%; }
.psh-photo .psh-duotone { max-width: 100%; }
.psh-photo figcaption { max-width: 48em; font-size: 14px; line-height: 22px; font-weight: 300; color: var(--ink-muted); }

/* Stockpile figure, drawn to scale (56,000 → 12,000) */
.psh-stock { background: var(--surface-100); padding: 28px 24px 26px; display: grid; gap: 22px; }
.psh-stock h3 { font-size: 14px; line-height: 20px; font-weight: 600; letter-spacing: normal; text-transform: uppercase; color: var(--twilight); }
.psh-stock__row { display: grid; gap: 8px; }
.psh-stock__label { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 14px; color: var(--ink-muted); }
.psh-stock__label b { font-size: clamp(1.75rem, 4vw, 2.5rem); line-height: 1; font-weight: 700; color: var(--ink); font-variant-numeric: lining-nums tabular-nums; letter-spacing: -.02em; }
.psh-stock__track { height: 18px; background: var(--surface-000); }
.psh-stock__bar { height: 100%; width: var(--w); background: var(--twilight); transform-origin: left; }
.psh-stock__row--now .psh-stock__bar { background: var(--sky); }
.psh-stock__note { font-size: 14px; line-height: 22px; color: var(--ink-muted); }
.psh .psh-stock__btn { justify-self: start; }
.psh-stock__pair { display: grid; gap: 24px; }
.psh-stock__photo { display: none; }
@media (min-width: 960px) {
  .psh-stock__pair { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; }
  .psh-stock__photo { display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 10px; min-height: 100%; }
  .psh-stock__photo .psh-duotone { min-height: 220px; }
  .psh-stock__photo figcaption { font-size: 14px; line-height: 22px; font-weight: 300; color: var(--ink-muted); }
}
.psh.js .psh-stock__bar { transform: scaleX(.02); transition: transform 1.4s cubic-bezier(.2,.7,.2,1); }
.psh.js .is-visible .psh-stock__bar { transform: none; }

/* ---------- Sections alternate white and light gray; add psh-band--gray to every other new section ---------- */
.psh-band--gray { background: var(--surface-100); }

/* ---------- Today's Threats ---------- */
.psh-threats { padding: 64px 0 80px; }
.psh-threats__head { max-width: none; display: grid; gap: 14px; margin-bottom: 16px; }
.psh-threats__head h2 { font-size: clamp(2rem, 5vw, 3rem); line-height: 1.1; font-weight: 700; }
.psh-threats__head p { max-width: 720px; font-size: 18px; line-height: 30px; color: var(--ink-muted); }
.psh-jump { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.psh-jump a { display: inline-flex; align-items: center; gap: 6px; padding: 7px 16px; border-radius: 9999px; border: 1px solid var(--border); font-size: 14px; line-height: 20px; font-weight: 600; color: var(--twilight); transition: background .2s, color .2s, border-color .2s; }
@media (min-width: 960px) { .psh-jump { flex-wrap: nowrap; } }
.psh-jump a { white-space: nowrap; }
.psh-jump a::after { content: "↓"; font-weight: 400; }
.psh-jump a:hover { background: var(--twilight); border-color: var(--twilight); color: #fff; }
.psh-threat { display: grid; gap: 28px 64px; padding-block: 56px; border-top: 1px solid var(--border); scroll-margin-top: calc(var(--nav-h) + 8px); }
.psh-threats__head + .psh-threat { border-top: 0; }
.psh-threat__text { display: grid; gap: 14px; align-content: start; min-width: 0; }
.psh-threat__text h3 { font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.2; font-weight: 600; }
.psh-threat__text > p { color: var(--ink-muted); max-width: 36em; }
.psh-threat__source { font-size: 14px; line-height: 22px; color: var(--ink-muted); }
.psh-threat__source a { color: var(--twilight); text-decoration: underline; text-underline-offset: 3px; }
.psh-threat__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
.psh .psh-btn--ghost { background: transparent; color: var(--twilight); }
.psh .psh-btn--ghost:hover { color: #fff; }
.psh-label { font-size: 14px; line-height: 20px; font-weight: 600; text-transform: uppercase; color: var(--twilight); }
@media (min-width: 960px) {
  .psh-threat { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: center; }
  .psh-threat--flip .psh-threat__visual { order: 2; }
  .psh-threat--wide { grid-template-columns: 1fr; }
}

/* Blast map: circle-cropped map like the NYC packet, rings drawn to scale */
.psh-blast__map { display: block; width: 100%; max-width: 560px; margin-inline: auto; border-radius: 50%; }
.psh-blast__map:focus-visible { outline-offset: 6px; }
.psh-blast__svg { display: block; width: 100%; height: auto; }
.psh-blast__land { fill: #9a9fcc; }
.psh-blast__water { fill: #6478c4; }
.psh-blast__zone { transition: opacity .25s; transform-box: view-box; transform-origin: 260px 260px; }
.psh-blast__zone--heat { fill: #2a3691; }
.psh-blast__zone--shock { fill: #18a8e2; }
.psh-blast__zone--radiation { fill: #fb8e44; }
.psh-blast__zone--fireball { fill: #f4df45; }
.psh-blast__ring { fill: none; stroke: #fff; stroke-width: 1.5; opacity: .9; }
.psh-blast__dc { fill: none; stroke: #fff; stroke-width: 1.4; stroke-dasharray: 2 4; stroke-linecap: round; opacity: .85; }
.psh-blast__frame { fill: none; stroke: var(--twilight); stroke-width: 2; }
.psh-blast__place, .psh-blast__gzlabel { font-family: inherit; fill: #fff; paint-order: stroke; stroke: #232d7a; stroke-width: 3px; stroke-linejoin: round; }
.psh-blast__place { font-size: 10px; font-weight: 600; letter-spacing: .04em; text-anchor: middle; }
.psh-blast__gzlabel { font-size: 14px; font-weight: 700; }
.psh-blast__gz { fill: #fff; stroke: var(--twilight); stroke-width: 3; }
.psh-blast.is-focus .psh-blast__zone:not(.is-on) { opacity: .25; }
.psh.js .psh-blast:not(.is-visible) .psh-blast__zone { transform: scale(.08); }
.psh.js .psh-blast .psh-blast__zone { transition: transform 1.1s cubic-bezier(.2,.7,.2,1), opacity .25s; }
.psh.js .psh-blast .psh-blast__zone--shock { transition-delay: .12s, 0s; }
.psh.js .psh-blast .psh-blast__zone--heat { transition-delay: .24s, 0s; }

.psh-zones { display: grid; gap: 4px; margin-top: 6px; }
.psh .psh-zone {
  display: grid; grid-template-columns: 22px minmax(0, 1fr); column-gap: 14px; align-items: start; text-align: left;
  width: 100%; padding: 10px 12px; border: 1px solid transparent; border-radius: 4px; background: transparent; color: var(--ink);
  transition: background .2s, border-color .2s;
}
.psh .psh-zone:hover, .psh .psh-zone[aria-pressed="true"] { background: var(--surface-100); border-color: var(--border); }
.psh-zone__sw { width: 22px; height: 22px; border-radius: 4px; margin-top: 2px; }
.psh-zone__name { font-size: 17px; line-height: 24px; font-weight: 600; }
.psh-zone__area { font-size: 14px; line-height: 20px; color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.psh-zone__desc { display: block; font-size: 14px; line-height: 21px; color: var(--ink-muted); margin-top: 2px; }

/* World map (option B) */
.psh-world { display: grid; gap: 24px; }
.psh-world__top { display: grid; gap: 24px; align-items: start; }
@media (min-width: 960px) { .psh-world__top { grid-template-columns: minmax(0, 1fr) 340px; } }
.psh-world__map { position: relative; min-width: 0; }
.psh-world__svg { display: block; width: 100%; height: auto; }
.psh-world__c { fill: #e3e6f1; stroke: #fff; stroke-width: .5; }
.psh-world__c--armed, .psh-world__c--risk, .psh-world__num { cursor: pointer; }
.psh-world__c--b1, .psh-world__b1 { fill: #2a3691; background: #2a3691; }
.psh-world__c--b2, .psh-world__b2 { fill: #2f5fb3; background: #2f5fb3; }
.psh-world__c--b3, .psh-world__b3 { fill: #3d9ad8; background: #3d9ad8; }
.psh-world__c--b4, .psh-world__b4 { fill: #8fcdee; background: #8fcdee; }
.psh-world__c--risk, .psh-world__brisk { fill: #fdd5b9; background: #fdd5b9; stroke: #fb8e44; stroke-width: .8; }
.psh-world__brisk { border: 1px solid #fb8e44; }
.psh-world__c.is-on { stroke: #f4df45; stroke-width: 2.2; }
.psh-world__num { font-family: inherit; font-size: 15px; font-weight: 700; fill: #fff; paint-order: stroke; stroke: #1d2668; stroke-width: 3.5px; stroke-linejoin: round; font-variant-numeric: tabular-nums; }
.psh-world__card { background: var(--twilight); color: #fff; padding: 24px; display: grid; gap: 8px; min-height: 196px; align-content: start; }
.psh-world__card .psh-label { color: #fff; opacity: .85; }
.psh-world__name { font-size: 24px; line-height: 30px; font-weight: 700; }
.psh-world__count { font-size: 40px; line-height: 1; font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.psh-world__count small { display: block; margin-top: 6px; font-size: 14px; line-height: 20px; font-weight: 400; letter-spacing: 0; opacity: .9; }
.psh-world__ctx { font-size: 15px; line-height: 24px; opacity: .92; }
.psh-world__card.is-risk .psh-world__ctx { font-size: 16px; line-height: 26px; opacity: 1; }
.psh-world__ctx a { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.psh-world__ctx a:hover { color: #8fcdee; }
.psh-world__ctx em { font-style: italic; opacity: .8; }
.psh-world__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.psh-world__groups { display: grid; gap: 18px; }
.psh-world__group { display: grid; gap: 8px; }
@media (min-width: 960px) { .psh-world__groups { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 40px; align-items: start; } }
.psh-world__swipe { display: none; }
/* Phones and tablets: larger map that scrolls sideways; buttons sit between the map and the card */
@media (max-width: 959px) {
  .psh-world { display: grid; gap: 20px; }
  .psh-world__top, .psh-world__map { display: contents; }
  .psh-world__scroll { order: 1; overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; scrollbar-width: thin; margin-inline: -16px; padding-inline: 16px; }
  .psh-world__scroll .psh-world__svg { width: 760px; max-width: none; }
  .psh-world__swipe { display: block; order: 2; margin-top: -8px; font-size: 13px; line-height: 20px; color: var(--ink-muted); }
  .psh-world__groups { order: 3; }
  .psh-world__card { order: 4; min-height: 0; }
  .psh-world .psh-key { order: 5; }
  .psh-world .psh-threat__source { order: 6; }
}
.psh .psh-chip { padding: 6px 14px; border-radius: 9999px; border: 1px solid var(--border); background: var(--surface-000); font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink-muted); transition: background .2s, color .2s, border-color .2s; }
.psh .psh-chip:hover { border-color: var(--twilight); color: var(--twilight); }
.psh .psh-chip[aria-pressed="true"] { background: var(--twilight); border-color: var(--twilight); color: #fff; }
.psh .psh-chip--risk { border-style: dashed; border-color: #fb8e44; }
.psh-chip b { font-weight: 400; margin-left: 6px; font-variant-numeric: tabular-nums; }
.psh-key { display: flex; flex-wrap: wrap; gap: 10px 24px; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.psh-key span { display: inline-flex; align-items: center; gap: 8px; }
.psh-key i { display: inline-block; width: 16px; height: 16px; border-radius: 3px; flex: none; }

/* RECA map: 2025 by default, coverage before 2025 on hover or toggle */
.psh-reca__map { position: relative; min-width: 0; }
@media (min-width: 960px) { .psh-threat.psh-reca { align-items: start; } .psh-reca__map { position: sticky; top: calc(var(--nav-h) + 24px); } }
.psh-reca__svg { display: block; width: 100%; height: auto; }
.psh-reca__st { fill: #e6e9f3; }
.psh-reca__co { fill: transparent; }
.psh-reca__mesh { fill: none; stroke: #fff; stroke-width: 1; stroke-linejoin: round; pointer-events: none; }
.psh-reca .is-w { fill: #a6daf2; }
.psh-reca .is-d { fill: #fb8e44; }
.psh-reca .is-b { fill: url(#psh-reca-both); }
.psh-reca__site { fill: #f4df45; stroke: var(--twilight); stroke-width: 2.5; }
.psh-reca__sitelabel { font-family: inherit; font-size: 15px; font-weight: 600; fill: var(--twilight); paint-order: stroke; stroke: #fff; stroke-width: 4px; stroke-linejoin: round; }
.psh-reca[data-view="before"] .psh-reca__sites { display: none; }
@media (max-width: 599px) { .psh-reca__sitelabel { display: none; } .psh-reca__site { r: 11; } }
.psh-reca__co.is-d, .psh-reca__co.is-b { stroke: #fff; stroke-width: .4; }
.psh-reca__year { display: block; margin-top: 8px; text-align: right; font-size: clamp(1.4rem, 3.4vw, 2.2rem); line-height: 1; font-weight: 700; color: var(--twilight); font-variant-numeric: lining-nums; }
.psh-toggle { display: inline-flex; padding: 4px; border-radius: 9999px; background: var(--surface-100); border: 1px solid var(--border); justify-self: start; }
.psh .psh-toggle button { padding: 7px 16px; border: 0; border-radius: 9999px; background: transparent; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink-muted); }
.psh .psh-toggle button[aria-pressed="true"] { background: var(--twilight); color: #fff; }
.psh-reca__hint { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.psh-reca__areas { display: grid; gap: 8px; font-size: 14px; line-height: 22px; color: var(--ink-muted); max-width: 40em; }
.psh-reca__areas strong { font-weight: 600; color: var(--ink); }
.psh-reca__test { fill: #fff; stroke: var(--twilight); stroke-width: 2.5; }
.psh-reca__zips summary { cursor: pointer; font-weight: 600; color: var(--twilight); }
.psh-reca__zips summary:focus-visible { outline: 2px solid var(--sky); outline-offset: 2px; }
.psh-reca__zips dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 16px; margin: 10px 0 0; }
.psh-reca__zips dt { font-weight: 600; color: var(--ink); }
.psh-reca__zips dd { margin: 0; font-variant-numeric: tabular-nums; }


/* ---------- Give band ---------- */
.psh-give { position: relative; overflow: hidden; background: var(--twilight); color: #fff; padding: 88px 0 96px; }
.psh-give .psh-beacon--a { width: 520px; left: -240px; top: -200px; opacity: .2; }
.psh-give .psh-beacon--b { width: 380px; right: -170px; bottom: -170px; opacity: .2; }
.psh-give .psh-wrap { position: relative; z-index: 1; text-align: center; }
.psh-give .psh-eyebrow { color: #fff; margin-bottom: 14px; }
.psh-give h2 { font-size: clamp(2rem, 5vw, 3.25rem); line-height: 1.1; font-weight: 700; margin: 0 auto 18px; max-width: 760px; }
.psh-give__lede { font-size: 18px; line-height: 30px; max-width: 600px; margin: 0 auto 32px; color: rgba(255,255,255,.92); }

/* ---------- Explore: campaign features ---------- */
.psh-explore { background: var(--surface-100); padding: 80px 0 88px; }
.psh-tiles { display: grid; gap: 24px; }
@media (min-width: 800px) { .psh-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* One feature for now: image and text side by side */
@media (min-width: 800px) {
  .psh-tiles--one { grid-template-columns: 1fr; }
  .psh-tiles--one .psh-tile { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); grid-template-rows: auto; }
  .psh-tiles--one .psh-tile__img { aspect-ratio: auto; min-height: 300px; }
  .psh-tiles--one .psh-tile__body { align-content: center; padding: 40px; }
}
.psh-tile { display: grid; grid-template-rows: auto 1fr; background: var(--surface-000); border: 1px solid var(--border); transition: border-color .2s; }
.psh-tile:hover { border-color: var(--twilight); }
.psh-tile__img { aspect-ratio: 16 / 9; max-width: 100%; }
.psh-tile__img img { transition: transform .8s ease; }
.psh-tile:hover .psh-tile__img img { transform: scale(1.03); }
.psh-tile__body { display: grid; gap: 10px; align-content: start; padding: 26px 26px 28px; }
.psh-tile h3 { font-size: 24px; line-height: 1.25; font-weight: 600; }
.psh-tile p { color: var(--ink-muted); }
.psh-tile__go { margin-top: 6px; font-size: 14px; font-weight: 600; letter-spacing: normal; text-transform: uppercase; color: var(--twilight); display: inline-flex; gap: 8px; align-items: center; }
.psh-tile__go span { transition: transform .2s; }
.psh-tile:hover .psh-tile__go span { transform: translateX(4px); }

/* ---------- Footer ---------- */
.psh-footer { position: relative; overflow: hidden; background: var(--twilight-deep); color: rgba(255,255,255,.85); font-size: 14px; padding: 40px 0; }
.psh-footer .psh-wrap { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 12px 24px; justify-content: space-between; align-items: center; }
.psh-footer a img { height: 26px; width: auto; }

/* ---------- Mobile donate bar ---------- */
.psh-mbar { display: none; }
@media (max-width: 759px) {
  .psh-mbar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
    background: var(--twilight); color: #fff; font-size: 14px; line-height: 20px; font-weight: 600;
    box-shadow: 0 -6px 20px rgba(16, 21, 63, .18);
    transform: translateY(110%); visibility: hidden; transition: transform .35s ease, visibility 0s linear .35s;
  }
  .psh-mbar.is-on { transform: none; visibility: visible; transition: transform .35s ease, visibility 0s; }
  .psh-mbar .psh-btn { padding: 9px 16px; font-size: 13px; flex: none; }
}

/* ---------- Photo hover reveal (mouse only): the original fades in over the duotone ---------- */
.psh .psh-duotone img.psh-duotone__orig { filter: none; }
.psh-duotone__orig { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .6s ease, transform .8s ease; pointer-events: none; }
@media (any-hover: hover) {
  .psh-duotone:hover .psh-duotone__orig, .psh-tile:hover .psh-duotone__orig { opacity: 1; }
}

/* ---------- Motion ---------- */
.psh.js .psh-reveal { opacity: .35; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.psh.js .psh-reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .psh.js .psh-reveal, .psh.js .psh-stock__bar { opacity: 1; transform: none; transition: none; }
  .psh-tile__img img, .psh .psh-btn, .psh-mbar, .psh-duotone__orig { transition: none; }
}

/* ---------- WP: Beaver Builder's global styles ----------
 * The page sits in a Beaver Builder HTML module, so it is inside
 * .fl-builder-content, and the site's Beaver Builder global styles
 * (".fl-builder-content a:not(...)" sets every link bold;
 * ".fl-builder-content button:not(...)" makes every button an uppercase,
 * white-text, 2px-bordered pill) outrank the design's .psh class rules.
 * The rules below are the design's own button rules again, scoped to the
 * page's root ID so they win; they are generated from the design file and say
 * nothing new. Then the links get back the weight the design gives them.
 */
#psh-top :where(button) { font: inherit; margin: 0; cursor: pointer; text-transform: none; box-shadow: none; }
#psh-top button:focus-visible { outline: 2px solid var(--sky); outline-offset: 3px; }
#psh-top .psh-zone { display: grid; grid-template-columns: 22px minmax(0, 1fr); column-gap: 14px; align-items: start; text-align: left; width: 100%; padding: 10px 12px; border: 1px solid transparent; border-radius: 4px; background: transparent; color: var(--ink); transition: background .2s, border-color .2s; }
#psh-top .psh-zone:hover, #psh-top .psh-zone[aria-pressed="true"] { background: var(--surface-100); border-color: var(--border); }
#psh-top .psh-chip { padding: 6px 14px; border-radius: 9999px; border: 1px solid var(--border); background: var(--surface-000); font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink-muted); transition: background .2s, color .2s, border-color .2s; }
#psh-top .psh-chip:hover { border-color: var(--twilight); color: var(--twilight); }
#psh-top .psh-chip[aria-pressed="true"] { background: var(--twilight); border-color: var(--twilight); color: #fff; }
#psh-top .psh-chip--risk { border-style: dashed; border-color: #fb8e44; }
#psh-top .psh-toggle button { padding: 7px 16px; border: 0; border-radius: 9999px; background: transparent; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink-muted); }
#psh-top .psh-toggle button[aria-pressed="true"] { background: var(--twilight); color: #fff; }
#psh-top button * { color: inherit; }
#psh-top .psh-zone__area, #psh-top .psh-zone__desc { color: var(--ink-muted); }
#psh-top a { font-weight: inherit; }
#psh-top .psh-btn, #psh-top .psh-nav ul a, #psh-top .psh-jump a, #psh-top .psh-world__ctx a { font-weight: 600; }
