/* Item 7 public-page additions. Heather Ascend upload, Sep 29–30 2026. */

:root { --muted: #556476; }

#safety-exit:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 5px #111;
}
a:focus-visible,
button:focus-visible,
summary:focus-visible {
  outline: 3px solid #524087;
  outline-offset: 3px;
}
.nav-cta:focus-visible,
.btn-primary:focus-visible,
.btn-danger:focus-visible {
  outline-color: #fff;
  box-shadow: 0 0 0 4px #111;
}

/* Safety Exit is the only exit control. It is fixed at the top-right and
   48px tall, so the top bar is at least that tall and the tab sits inside it.
   Keep the hotline and tagline clear of the button. */
.topbar { min-height: 48px; display: flex; align-items: center; }
.topbar .inner { width: 100%; padding-right: 130px; }
.topbar-left { min-width: 0; }
/* Tagline is two balanced groups. They sit on one line when the bar is wide
   and wrap to two centered lines when it is not. */
.topbar-mid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 2px 0.35em;
  max-width: 100%;
  min-width: 0;
  text-align: center;
  font-size: 16px;
  line-height: 1.35;
}
.topbar-mid span { white-space: nowrap; }
@media (max-width: 420px) {
  .topbar .inner { padding-left: 16px; padding-right: 124px; }
}
/* Page styles hide the tagline below 960px. Keep it, on its own row, centered
   in the bar. The Safety Exit gutter is only needed beside the hotline. */
@media (max-width: 1200px) {
  .topbar .inner { flex-wrap: wrap; align-items: center; row-gap: 2px; }
  .topbar-mid {
    display: flex;
    flex: 1 0 100%;
    order: 2;
    width: calc(100% + 144px);
    max-width: none;
    margin-right: -144px;
    padding-inline: 8px;
    box-sizing: border-box;
  }
}
@media (max-width: 560px) {
  .footer-grid { grid-template-columns: 1fr; }
}

/* Ratings and supporters (Mike, Oct 1 2026). The two logo rows share one
   markup pattern on every page: the first .funder-logos is Ratings, the
   second is supporters. Styling only; logos, links and alt text unchanged. */
.sponsors-section { background: #fff; padding: 28px 0 48px; border-top: 1px solid var(--border, #e7e2f0); }
.sponsors-wave-bar { height: 4px; background: linear-gradient(90deg, #524087, #AA89D9); margin-bottom: 28px; }
.sponsors-label {
  font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .14em;
  color: var(--muted); margin-bottom: 20px; text-align: center;
}
.funder-logos { --s: 1.1; }
.funder-logos a,
.funder-logos span { display: flex; align-items: center; justify-content: center; }
.funder-logos img { width: auto; max-width: 100%; object-fit: contain; }

/* Ratings: one centered pair at a matched height. */
.sponsors-section .container > .funder-logos:nth-of-type(1) {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px 48px;
}
.sponsors-section .container > .funder-logos:nth-of-type(1) img { height: 72px; }

/* Supporters: an even grid of equal tiles, 5 + 5 on desktop and tablet,
   2 per row on phones. Each logo is sized by its visible artwork so round
   seals and wide wordmarks carry the same visual weight. */
.sponsors-section .container > .funder-logos:nth-of-type(2) {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px;
  max-width: 1040px; margin: 0 auto;
}
.sponsors-section .container > .funder-logos:nth-of-type(2) > * {
  height: 104px; padding: 12px 16px; background: #fff;
  border: 1px solid var(--border, #e7e2f0); border-radius: 12px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.sponsors-section .container > .funder-logos:nth-of-type(2) > a:hover {
  border-color: #c9bde3; box-shadow: 0 4px 14px rgba(82, 64, 135, .08);
}
.sponsors-section .container > .funder-logos:nth-of-type(2) img { height: calc(var(--logo-h, 44px) * var(--s)); max-height: 100%; }
.funder-logos img[src$="ag-seal.jpg"]             { --logo-h: 62px; }
.funder-logos img[src$="united-way-martin.webp"]  { --logo-h: 42px; }
.funder-logos img[src$="signature-411800482.png"] { --logo-h: 50px; }
.funder-logos img[src$="truist-foundation.jpg"]   { --logo-h: 46px; }
.funder-logos img[src$="tcf.png"]                 { --logo-h: 72px; }
.funder-logos img[src$="loblolly.png"]            { --logo-h: 74px; }
.funder-logos img[src$="cscmc.webp"]              { --logo-h: 62px; }
.funder-logos img[src$="microtech.webp"]          { --logo-h: 35px; }
.funder-logos img[src$="level-4.webp"]            { --logo-h: 34px; }
.funder-logos img[src$="united-way-irc.webp"]     { --logo-h: 39px; }

@media (max-width: 960px) {
  .funder-logos { --s: .82; }
  .sponsors-section .container > .funder-logos:nth-of-type(1) img { height: 64px; }
  .sponsors-section .container > .funder-logos:nth-of-type(2) { gap: 12px; }
  .sponsors-section .container > .funder-logos:nth-of-type(2) > * { height: 88px; padding: 10px; }
}
@media (max-width: 640px) {
  .funder-logos { --s: .9; }
  .sponsors-section .container > .funder-logos:nth-of-type(1) { gap: 16px 32px; }
  .sponsors-section .container > .funder-logos:nth-of-type(1) img { height: 60px; }
  .sponsors-section .container > .funder-logos:nth-of-type(2) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sponsors-section .container > .funder-logos:nth-of-type(2) > * { height: 92px; }
}
@media (max-width: 360px) {
  .funder-logos { --s: .8; }
  .sponsors-section .container > .funder-logos:nth-of-type(2) > * { height: 84px; padding: 8px; }
}
.fvpsa-note {
  margin-top: 28px;
  font-size: .78rem;
  line-height: 1.55;
  color: rgba(255,255,255,.72);
  max-width: 44rem;
}
.footer-office {
  font-size: .88rem;
  line-height: 1.5;
  color: rgba(255,255,255,.78);
}
.footer-office a { color: var(--teal); font-weight: 700; }
.exit-history-note {
  margin-top: 18px;
  font-size: .78rem;
  line-height: 1.45;
  color: rgba(255,255,255,.62);
  max-width: 280px;
}

.prose p { margin-bottom: 1em; color: var(--muted); }
.prose h2, .block-title {
  font-size: 1.45rem;
  font-weight: 800;
  color: var(--dark);
  margin: 28px 0 10px;
}
.prose h3 { font-size: 1.15rem; font-weight: 750; color: var(--purple-deep); margin: 22px 0 8px; }
.prose ul, .plain-list { margin: 0 0 16px 1.1rem; color: var(--muted); }
.prose li { margin-bottom: 6px; }
.lede { font-size: 20px; color: var(--text); max-width: 760px; }
.page-hero p { font-size: 20px; }

.nav-inner { min-height: 84px; align-items: center; }
.nav-logo { display: flex; align-items: center; min-width: 0; flex: 0 1 auto; line-height: 0; }
.nav-logo img { display: block; height: 72px; width: auto; max-width: 100%; max-height: 72px; }
.funder-logos + .sponsors-label { margin-top: 40px; }

.quote {
  border-left: 4px solid var(--teal);
  margin: 18px 0;
  padding: 8px 0 8px 16px;
  color: var(--text);
}
.quote p { margin: 0; font-size: 1.05rem; }
.quote cite {
  display: block;
  margin-top: 8px;
  font-style: normal;
  font-weight: 700;
  font-size: .88rem;
  color: var(--purple);
}

.source-note { font-size: .82rem; color: var(--muted); margin-top: 12px; }
.placeholder-note {
  background: #fff8e8;
  border: 1px dashed #c4922a;
  border-radius: 12px;
  padding: 16px 18px;
  color: #2a2545;
  font-size: .95rem;
}
.placeholder-note p,
.prose .placeholder-note p,
.placeholder-note strong { color: #2a2545; }
.safety-note p { color: #2a2545; }

.program {
  border-top: 1px solid var(--border);
  padding: 28px 0;
}
.program h2 { font-size: 1.35rem; font-weight: 800; color: var(--dark); margin-bottom: 10px; }
.program p { color: var(--muted); margin-bottom: 8px; }

.data-table { width: 100%; border-collapse: collapse; font-size: .92rem; margin: 12px 0 20px; }
.data-table th, .data-table td {
  text-align: left;
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}
.data-table th { font-size: .75rem; letter-spacing: .04em; text-transform: uppercase; color: var(--purple); }
.table-wrap { overflow-x: auto; max-width: 100%; }
.two-col > * { min-width: 0; }

.county-links, .anchor-links { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 8px; }
.county-links a, .anchor-links a {
  display: inline-block;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(215, 196, 242, 0.45);
  color: var(--purple-deep);
  font-weight: 700;
  font-size: .88rem;
}
.county-links a:hover, .anchor-links a:hover { background: rgba(215, 196, 242, 0.8); }

.board-directory, .stat-list { list-style: none; display: grid; gap: 12px; margin: 0; padding: 0; }
.board-directory li, .stat-list li {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px 16px;
}
.board-directory span, .role { display: block; color: var(--muted); font-size: .9rem; margin-top: 2px; }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
@media (max-width: 800px) { .two-col { grid-template-columns: 1fr; } }

.nav-links { flex-wrap: nowrap; }
.nav-links a { font-size: 14px; padding: 8px 12px; white-space: nowrap; }

.opt-switch { color: #6b657c; }

.footer-bottom { color: rgba(255,255,255,.65); }

.impact-panel .section-label { color: #524087; }

.footer .footer-label {
  font-size: .78rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #fff;
  margin: 0 0 14px;
}

h1, h2, h3, .section-title { text-wrap: balance; }

.prose p,
.prose li,
.lede,
.hero p,
.page-hero p,
.path-card p,
.svc-card p,
.way-card p,
.section-sub,
.story-text,
.program p,
.safety-note p,
.contact-card p,
.cq-card p {
  max-width: 44rem;
}

.nav-links a.nav-cta.active { background: var(--purple-dark) !important; }

.nav-burger span { transition: transform .15s ease, opacity .15s ease; }
.nav-burger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-burger.open span:nth-child(2) { opacity: 0; }
.nav-burger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Hamburger up to 1023px so iPad landscape does not put Donate under the
   fixed Safety Exit tab. */
@media (max-width: 1023.98px) {
  .nav-inner { padding-right: 150px; }
  .nav-burger { display: flex; position: relative; z-index: 2; }
  .nav-links {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    flex-direction: column;
    align-items: stretch;
    padding: 12px 20px 24px;
    border-top: 1px solid var(--border);
    box-shadow: 0 8px 24px rgba(0,0,0,.1);
    z-index: 1;
    /* nowrap so a max-height never wraps links into a second column; the
       panel scrolls on its own when the screen is short (landscape). */
    flex-wrap: nowrap;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  .nav-links.open { display: flex; }
  .nav-links li { width: 100%; }
  .nav-links a { display: block; padding: 12px 14px; font-size: 16px; }
}
/* Desktop nav up to 1400px: keep Donate clear of the fixed Safety Exit tab. */
@media (min-width: 1024px) and (max-width: 1400px) {
  .nav-inner { padding-right: 140px; }
}

/* Donor disclosure (Heather trifold wording), Sep 30 2026. */
.legal-note {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--muted);
  max-width: 44rem;
}
.legal-note a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

/* Tap targets: pill links and standalone buttons are at least 48px tall. */
.county-links a, .anchor-links a {
  display: inline-flex; align-items: center; min-height: 48px; padding: 8px 16px;
}
.btn, .btn-sm { min-height: 48px; }
a.btn, button.btn, summary.btn, a.btn-sm {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-sizing: border-box;
  padding: 14px 28px;
  border-radius: 12px;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.2;
  text-decoration: none;
}
a.btn-sm {
  padding: 10px 18px;
  border-radius: 10px;
  border: 2px solid var(--purple, #524087);
  background: var(--purple, #524087);
  color: #fff;
}
a.btn-sm.outline {
  background: transparent;
  color: var(--purple, #524087);
}
a.btn + a.btn, a.btn-sm + a.btn-sm { margin-left: 8px; }

/* Phone and tablet readability: body copy at least 16px (Sep 30 2026 QA
   gate, extended to tablets Oct 1 2026). */
@media (max-width: 1024px) {
  .path-card p, .svc-card p, .impact-panel p, .way-card p,
  .safety-note p, .contact-card p, .faq-a p, .cq-card p, .info-block p,
  .placeholder-note, .placeholder-note p,
  .data-table, .data-table td, .data-table th,
  .impact-label, .cq-card h2, .hotline-box .sub, .page-hero .hotline-box .sub,
  .crisis-strip p,
  table td, table th,
  .source-note { font-size: 1rem; }
}

/* Tap targets at least 48px (Sep 30 2026 QA gate). Inline links inside
   running text are exempt. */
#safety-exit { min-height: 48px; }
.topbar a.hotline { display: inline-flex; align-items: center; min-height: 48px; margin-block: -14px; }
.nav-burger { min-width: 48px; min-height: 48px; align-items: center; justify-content: center; }
.nav-links a { display: inline-flex; align-items: center; min-height: 48px; }
@media (max-width: 1023.98px) { .nav-links a { display: flex; } }
.footer-social { gap: 8px; }
.social-icon.brand-social { width: 48px; height: 48px; }
.footer-links { gap: 0; }
.footer-links a { display: inline-flex; align-items: center; min-height: 48px; }
.path-link, .svc-card h3 a, .svc-card a, .contact-val a, .cq-val a, .hotline-box .num a, .cta-link {
  display: inline-flex; align-items: center; min-height: 48px;
}
.quick-links a, .btn-home { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; }
.footer-links a { min-width: 48px; }
.contact-val a, .cq-val a { min-width: 48px; }
.placeholder-note, .placeholder-note p { font-size: 1rem; }
@media (max-width: 1024px) {
  .impact-panel p[style] { font-size: 1rem !important; }
}

/* Mobile QA fixes for PR #8 (Sep 30 2026). Styling and performance only. */

/* In-page anchors clear the sticky nav (about 85px tall). */
html { scroll-padding-top: 96px; }

/* Phone numbers never split across lines. */
a[href^="tel:"] { white-space: nowrap; }

/* Page styles reset a { color: inherit; text-decoration: none }, which hid
   links in running text. Plain links in body copy get the brand treatment. */
section p a:not([class]),
section li a:not([class]) {
  color: var(--purple);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}
/* Light variant for dark surfaces. */
.crisis-strip p a:not([class]),
.crisis-strip li a:not([class]) { color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }

/* Shorter top bar on small phones. */
@media (max-width: 420px) {
  .topbar { padding: 6px 0; }
  .topbar-left > span[aria-hidden] { display: none; }
  .topbar .inner { row-gap: 8px; }
}
/* Narrow phones: the hotline wraps to two lines beside Safety Exit. */
@media (max-width: 379px) {
  .topbar .inner { padding-right: 16px; }
  .topbar-left { max-width: calc(100% - 108px); min-height: 42px; }
}

/* Path cards: three across on tablets when they fit. */
@media (min-width: 700px) and (max-width: 960px) {
  .paths-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .path-card { padding: 26px 20px; }
}

/* Phone text sizes. */
@media (max-width: 767.98px) {
  .crisis-strip p,
  .impact-label,
  .page-hero .hotline-box .sub,
  .hotline-box .sub,
  .cq-card h2 { font-size: 1rem; }
  .footer .footer-tagline,
  .footer .footer-office { font-size: .9rem; }
  .footer .exit-history-note,
  .footer .fvpsa-note,
  .footer .footer-bottom,
  .footer .footer-bottom span { font-size: .875rem; }
}

/* Phones and tablets: keep the burger below the fixed Safety Exit tab once the
   nav is stuck to the top, so neither covers the other. */
@media (max-width: 1023.98px) {
  nav .nav-burger { align-self: flex-end; margin-top: 52px; }
}

/* ---- Layout pass: full-bleed gala, foundation columns, footer, FAQ ---- */

/* Running copy fills the container. A single heading sits in 5 columns and
   the copy beside it in 7, from 1024. Lists and long paragraphs use two
   readable columns when a section has more than one heading. Short standalone
   lines (a lone CTA) are centered. Grids and two-column layouts are unchanged. */
@media (max-width: 1023.98px) {
  .hero-copy,
  .hero h1,
  .hero p { max-width: none; width: auto; }
}
@media (min-width: 1024px) {
  .page-hero:not(.help-hero) > .container {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: 24px;
    align-items: start;
  }
  .page-hero:not(.help-hero) > .container > .section-label { grid-column: 1 / span 5; grid-row: 1; }
  .page-hero:not(.help-hero) > .container > .hero-wave-mark { grid-column: 1 / span 5; grid-row: 2; margin-bottom: 10px; }
  .page-hero:not(.help-hero) > .container > h1 { grid-column: 1 / span 5; grid-row: 3; }
  .page-hero:not(.help-hero) > .container > :is(p, .lede, .anchor-links, .county-links, .hotline-box, .placeholder-note) {
    grid-column: 6 / span 7;
    max-width: none;
  }
  .page-hero:not(.help-hero) > .container > form { grid-column: 1 / -1; max-width: none; }
  .page-hero:not(.help-hero) .lede,
  .page-hero:not(.help-hero) p { max-width: none; }

  article.program {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: 24px;
    align-items: start;
  }
  article.program > h2 { grid-column: 1 / span 5; grid-row: 1 / span 8; margin-top: 0; }
  article.program > :not(h2) { grid-column: 6 / span 7; max-width: none; }

  section:not(.page-hero) > .container.prose:not(:has(h2 ~ h2, .table-wrap, .two-col, .row, .data-table, .give-layout, .reach-grid)) {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: 24px;
    align-items: start;
  }
  section:not(.page-hero) > .container.prose:not(:has(h2 ~ h2, .table-wrap, .two-col, .row, .data-table, .give-layout, .reach-grid)) > :is(.section-label, h2, .section-title, h3) {
    grid-column: 1 / span 5;
    grid-row: 1 / span 8;
  }
  section:not(.page-hero) > .container.prose:not(:has(h2 ~ h2, .table-wrap, .two-col, .row, .data-table, .give-layout, .reach-grid)) > :is(p, ul, ol, blockquote, .quote, .county-links, .placeholder-note, .source-note, .legal-note, .anchor-links) {
    grid-column: 6 / span 7;
    max-width: none;
  }
  /* #survivor-impact has one h2, plus a label and an h3. The rule above puts
     all three in the same cell (grid-row 1 / span 8), so the heading overlaps
     the quotes. Stack this section only. */
  section#survivor-impact > .container.prose { display: block; }
  section#survivor-impact > .container.prose > :is(.section-label, h2, .section-title, h3, p, div, blockquote, .quote) {
    grid-column: auto;
    grid-row: auto;
    max-width: none;
  }

  section:not(.page-hero) > .container.prose:has(h2 ~ h2):not(:has(.table-wrap, .two-col, .row, .data-table, .give-layout)) {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: 24px;
  }
  section:not(.page-hero) > .container.prose:has(h2 ~ h2):not(:has(.table-wrap, .two-col, .row, .data-table, .give-layout)) > :is(h2, h3, .section-title, .section-label) {
    grid-column: 1 / -1;
    max-width: none;
  }
  section:not(.page-hero) > .container.prose:has(h2 ~ h2):not(:has(.table-wrap, .two-col, .row, .data-table, .give-layout)) > :is(p, ul, ol, blockquote, .quote, .placeholder-note, .source-note, .legal-note) {
    grid-column: 1 / -1;
    max-width: none;
    columns: 2;
    column-gap: 28px;
  }
  section:not(.page-hero) > .container.prose:has(.table-wrap, .data-table) > :is(p, ul, .placeholder-note, .source-note) {
    max-width: none;
  }
}
.page-hero p,
.program p,
.container.prose > p,
.container.prose li,
.lede,
.legal-note { max-width: none; }
p.lone-cta { text-align: center; }
.copy-center { text-align: center; }
.copy-center .section-title,
.copy-center .section-label { max-width: none; }

.safety-note p { max-width: none; }
@media (min-width: 1024px) {
  .safety-note {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: 24px;
    align-items: start;
  }
  .safety-note > h2 { grid-column: 1 / span 5; margin: 0; }
  .safety-note > p { grid-column: 6 / span 7; margin: 0; }
}

/* Home gala: full-bleed wash, crisp image and text inside the container. */
.gala-band {
  position: relative;
  overflow: hidden;
  padding: 40px 0 48px;
}
.gala-band-bg {
  position: absolute;
  inset: -14%;
  z-index: 0;
  background: url("../img/events/amethyst-2027-banner-1280.webp") center / cover no-repeat;
  filter: blur(50px);
  transform: scale(1.18);
}
.gala-band-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 252, 248, 0.8);
}
.gala-band .container { position: relative; z-index: 1; }
.gala-band .gala-banner {
  width: 100%;
  max-width: none;
  height: auto;
  margin: 0;
  border-radius: 16px;
}
.gala-band .gala-card .section-title { margin-bottom: 8px; }
.gala-band .gala-card p,
.gala-band .gala-card .placeholder-note { font-size: 16px; }
.gala-band .btn { min-height: 48px; font-size: 16px; }
.gala-band .row { align-items: center; }

/* Get Help hero */
.help-hero-photo img {
  width: 100%;
  height: auto;
  max-width: 1672px;
  border-radius: 20px;
  object-fit: cover;
  display: block;
}
@media (min-width: 1024px) {
  .help-hero-row { align-items: stretch; }
  .help-hero-photo img {
    height: 100%;
    min-height: 420px;
    object-fit: cover;
  }
}

/* How to reach SafeSpace */
.reach-grid { align-items: stretch; margin-bottom: 36px; }
.reach-card {
  background: #fff;
  border: 2px solid var(--border);
  border-radius: 16px;
  padding: 24px;
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
  height: 100%;
  text-align: left;
  min-width: 0;
}
.reach-card h3 { font-weight: 700; margin: 0 0 8px; color: var(--dark); min-height: 2.6em; }
.reach-card .contact-val { font-size: 1.3rem; font-weight: 800; color: var(--purple); margin: 0 0 8px; }
.reach-card .contact-val a { color: var(--purple); min-height: 48px; }
.reach-card p { font-size: 16px; color: var(--muted); margin: 0 0 8px; max-width: none; }
.reach-card .btn { margin-top: auto; align-self: flex-start; min-height: 48px; }
.reach-side { display: flex; flex-direction: column; gap: 16px; height: 100%; }
.reach-side .reach-card { flex: 1 1 auto; }
.arrive-list {
  margin: 8px 0 16px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.arrive-list li {
  margin: 0;
  max-width: none;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 12px;
}
@media (min-width: 1024px) {
  .arrive-list { grid-template-columns: 1fr 1fr; column-gap: 24px; }
}
#reach h2 { max-width: none; }

/* FAQ: native details/summary, collapsed until opened. */
.faq-list { max-width: none; margin: 0; width: 100%; }
details.faq-item { interpolate-size: allow-keywords; }
details.faq-item > summary {
  list-style: none;
  min-height: 48px;
  cursor: pointer;
}
details.faq-item > summary::-webkit-details-marker { display: none; }
details.faq-item .faq-a {
  max-height: none;
  overflow: visible;
}
details.faq-item::details-content {
  height: 0;
  overflow: hidden;
  transition: height 0.3s ease, content-visibility 0.3s ease allow-discrete;
}
details.faq-item[open]::details-content { height: auto; }
details.faq-item[open] > summary.faq-q::after { transform: rotate(180deg); }

/* Footer: compact quick links, FVPSA full width, no extra gap. */
.footer-grid { margin-bottom: 12px; }
.fvpsa-note {
  max-width: none;
  width: 100%;
  margin-top: 8px;
  line-height: 1.45;
}
.footer-links a {
  line-height: 1.25;
}
@media (max-width: 639.98px) {
  .footer-links a {
    min-height: 48px;
    padding-top: 12px;
    padding-bottom: 12px;
    line-height: 1.2;
  }
}
@media (min-width: 640px) {
  .footer-links a {
    min-height: 0;
    padding-top: 4px;
    padding-bottom: 4px;
    line-height: 1.25;
  }
  .footer-grid > div:last-child .footer-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 16px;
    row-gap: 0;
  }
}
@media (min-width: 1024px) {
  .footer-grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 8px 24px;
    margin-bottom: 8px;
  }
  .footer-grid > div:nth-child(1) { grid-column: span 4; }
  .footer-grid > div:nth-child(2) { grid-column: span 3; }
  .footer-grid > div:nth-child(3) { grid-column: span 2; }
  .footer-grid > div:nth-child(4) { grid-column: span 3; }
}

/* Photos smaller than the card frame are not scaled past their pixels. */
.person-photo-fit {
  width: 168px;
  height: auto;
  max-height: 200px;
  aspect-ratio: 1;
  object-fit: cover;
}

/* Oct 26 Heather answers */
.person-photo.person-photo-sm { width: 132px; height: 132px; aspect-ratio: 1; object-position: center 25%; }
.person-monogram { width: 132px; height: 132px; border-radius: 12px; margin-bottom: 12px; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--purple, #524087), var(--teal-dark, #4fa8a8)); color: #fff; font-weight: 700; font-size: 2.5rem; letter-spacing: .04em; }
.qgiv-embed-container,
.qgiv-embed-container.qgiv-live { display: block; width: 100%; max-width: 630px; margin: 0 auto; min-height: 0; }
.news-date { font-size: 1rem; font-weight: 600; color: var(--purple, #524087); margin-bottom: 8px; }
.news-card { display: grid; gap: 20px; align-items: start; }
.news-thumb { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 12px; display: block; }
.news-thumb-mark { display: flex; align-items: center; justify-content: center; background: var(--lavender-soft, #f3edfb); }
.news-thumb-mark img { width: 60%; height: auto; }
.news-card h3 a { color: inherit; text-decoration: none; }
.news-card h3 a:hover { text-decoration: underline; }
.news-card .btn-sm { display: inline-flex; align-items: center; min-height: 48px; }
.news-article .prose h2, .news-article h2 { margin-top: 28px; }
.news-gallery { display: grid; grid-template-columns: 1fr; gap: 24px; margin: 32px 0; }
.news-gallery figure { margin: 0; width: 100%; }
.news-gallery img { width: 100%; height: auto; border-radius: 12px; display: block; }
.news-gallery figcaption { font-size: 1rem; color: var(--muted, #556476); margin-top: 8px; }
@media (min-width: 640px) {
  .news-card { grid-template-columns: 240px minmax(0, 1fr); }
  .news-gallery { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) { .news-card { grid-template-columns: 300px minmax(0, 1fr); } }
.news-card-body { min-width: 0; }
.news-card-body p, .news-card-body h3 { max-width: 100%; }
.container.prose > .news-card, .container.prose > .event-card, .container.prose > .news-gallery { grid-column: 1 / -1; }
/* News stories are one column. These selectors outrank the multi-heading
   columns:2 rule above, which was winning over columns: auto. */
section.news-article:not(.page-hero) > .container.prose:not(:has(h2 ~ h2, .table-wrap, .two-col, .row, .data-table, .give-layout, .reach-grid)),
section.news-article:not(.page-hero) > .container.prose:has(h2 ~ h2):not(:has(.table-wrap, .two-col, .row, .data-table, .give-layout)) {
  display: block;
  max-width: 760px;
}
section.news-article:not(.page-hero) > .container.prose:has(h2 ~ h2):not(:has(.table-wrap, .two-col, .row, .data-table, .give-layout)) > :is(p, ul, ol, blockquote, .quote, .placeholder-note, .source-note, .legal-note) {
  columns: auto;
}
section.news-article > .container.prose > p { columns: auto; }

/* Oct 26 spacing pass (Mike): gala band sizes to content, paths get their own band, quote mark is a crisp SVG. */
html { scroll-padding-top: 128px; }
@media (min-width: 1024px) { html { scroll-padding-top: 104px; } }
section.gala-band { padding: 72px 0; }
section.gala-band .gala-banner { margin: 0 0 24px; aspect-ratio: auto; object-fit: contain; }
section.gala-band .row { align-items: center; row-gap: 24px; }
section.gala-band .gala-card { padding: 0; }
section.gala-band .gala-card > :last-child { margin-bottom: 0; }
@media (min-width: 640px) { section.gala-band .gala-banner { margin-bottom: 0; } }
section.paths { margin-top: 0 !important; padding: 36px 0 56px !important; }
.hero-inner { padding-bottom: 32px; }
@media (max-width: 639.98px) { section.gala-band, section.paths { padding: 48px 0 !important; } }
.story-quote-img { width: 56px !important; height: 42px !important; display: block; margin: 8px 0 16px; overflow: visible; }
.split-section .story-panel { display: flex; flex-direction: column; justify-content: center; }
.split-section .story-panel .story-text { flex: none; font-size: 1.25rem; line-height: 1.6; }
.split-section .story-panel .story-author { margin-top: 16px !important; margin-bottom: 20px; }

/* Oct 26: forms and figures were auto-placed into a single 1/12 grid track at 1024+ (volunteer, newsletter, speaker, contact). */
@media (min-width: 1024px) {
  section:not(.page-hero) > .container.prose > :is(form, .demo-form, figure, div:not(.section-label)) { grid-column: 6 / span 7; max-width: none; min-width: 0; }
  section:not(.page-hero) > .container.prose:has(h2 ~ h2) > :is(form, .demo-form, figure, div:not(.section-label)) { grid-column: 1 / -1; }
}
.demo-form input, .demo-form textarea, .demo-form select { width: 100%; box-sizing: border-box; min-height: 48px; font-size: 16px; }
.demo-form textarea { min-height: 140px; }

/* Oct 26: Home first in nav with current-page state. */
.nav-links a.active:not(.nav-cta) { background: var(--lavender); color: var(--purple); }

/* Oct 26: Survivor Impact section is one centered column at every width. */
.split-section .split-grid { grid-template-columns: 1fr !important; max-width: 760px; margin: 0 auto; gap: 24px; }
.split-section .story-panel { align-items: center; text-align: center; padding: 48px 32px; }
.split-section .story-panel .story-quote-img { margin: 8px auto 16px; }
.split-section .story-panel .story-text { max-width: 36rem; margin-left: auto; margin-right: auto; }
@media (max-width: 639.98px) { .split-section .story-panel { padding: 36px 20px; } }

/* Oct 26: dropdown menus (Heather nav guidance). Desktop: hover/focus panel. Phone/tablet: accordion. */
.nav-links .has-sub { position: relative; display: flex; align-items: center; }
.nav-links .sub-toggle { background: none; border: 0; cursor: pointer; color: inherit; display: inline-flex; align-items: center; justify-content: center; padding: 0; }
.nav-links .sub-toggle span { width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .2s; }
.nav-links .sub-toggle[aria-expanded="true"] span { transform: rotate(-135deg) translateY(-2px); }
.nav-links .sub-menu { list-style: none; margin: 0; padding: 8px; background: #fff; }
.nav-links .sub-menu a { display: flex; align-items: center; min-height: 48px; padding: 8px 14px; font-size: 15px; border-radius: 8px; white-space: nowrap; }
.nav-links .sub-menu a:hover, .nav-links .sub-menu a[aria-current="page"] { background: var(--lavender); color: var(--purple); }
@media (min-width: 1024px) {
  .nav-links .has-sub > a { padding-right: 2px; }
  .nav-links .sub-toggle { width: 20px; height: 48px; margin-right: 4px; }
  .nav-links .sub-menu { position: absolute; top: 100%; left: 0; min-width: 240px; border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 12px 32px rgba(52,40,88,.14); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .15s, transform .15s, visibility .15s; z-index: 950; }
  .nav-links .has-sub:last-of-type .sub-menu, .nav-links .has-sub:nth-last-child(2) .sub-menu { left: auto; right: 0; }
  .nav-links .has-sub:hover > .sub-menu, .nav-links .has-sub:focus-within > .sub-menu, .nav-links .has-sub.open > .sub-menu { opacity: 1; visibility: visible; transform: none; }
}
@media (max-width: 1023.98px) {
  .nav-links .has-sub { flex-wrap: wrap; }
  .nav-links .has-sub > a { flex: 1 1 auto; }
  .nav-links .sub-toggle { width: 48px; height: 48px; flex: none; }
  .nav-links .sub-menu { display: none; width: 100%; padding: 0 0 8px 16px; }
  .nav-links .has-sub.open > .sub-menu { display: block; }
  .nav-links .sub-menu a { font-size: 16px; white-space: normal; }
  .nav-links.open { overflow-y: auto; }
}
.apply-choice { margin: 16px 0 24px; }
.apply-choice summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; min-height: 48px; }
.apply-choice summary::-webkit-details-marker { display: none; }
.apply-choice-panel { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 12px; }
.apply-choice-panel .btn { min-height: 48px; display: inline-flex; align-items: center; }
.sponsors-section .funder-logos img[src$="microtech.webp"] { max-height: 36px !important; } /* 54px source, keep >=1.5x */
/* Phone: compact people cards (photo left) so Leadership/Board stay near 6 screens. */
@media (max-width: 639.98px) {
  .person { display: grid; grid-template-columns: 96px minmax(0,1fr); column-gap: 16px; align-items: start; }
  .person > .person-photo, .person > .person-monogram, .person > .photo-placeholder { grid-row: 1 / span 6; width: 96px !important; height: 96px !important; aspect-ratio: 1; margin: 0; font-size: 1.5rem; }
  .person > :not(.person-photo):not(.person-monogram):not(.photo-placeholder) { grid-column: 2; }
}
@media (max-width: 639.98px) {
  .person:not(.is-open) .person-bio { display: none; }
  .person .bio-toggle { min-height: 48px; }
  .person { padding: 16px; }
}

/* Oct 26: client-review notes stay in code/NOTES.md, never on the visitor page. */
.placeholder-note, .photo-placeholder, .logo-placeholder, .demo-form-note { display: none !important; }

/* Oct 26: page heroes are one aligned stack (eyebrow, swoosh, h1, intro share one left edge). */
@media (min-width: 1024px) {
  .page-hero:not(.help-hero) > .container { display: block !important; }
  .page-hero:not(.help-hero) > .container > * { max-width: 46rem; }
  .page-hero:not(.help-hero) > .container > h1 { margin-top: 4px; margin-bottom: 16px; }
}

/* Oct 26: contact quick cards: equal height, left aligned, CTA pinned to the bottom. */
.contact-quick { display: grid; gap: 16px; grid-template-columns: 1fr; align-items: stretch; }
@media (min-width: 640px) { .contact-quick { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .contact-quick { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.contact-quick .cq-card { display: flex; flex-direction: column; align-items: flex-start; text-align: left; height: 100%; }
.contact-quick .cq-card h2 { margin-bottom: 8px; }
.contact-quick .cq-card .cq-val { margin-bottom: 8px; line-height: 1.3; }
.contact-quick .cq-card .cq-val a { display: inline-flex; align-items: center; min-height: 48px; }
.contact-quick .cq-card p { margin: 0 0 8px; }
.contact-quick .cq-card .btn { margin-top: auto !important; }
.contact-quick a.cq-card { color: inherit; text-decoration: none; }
@media (min-width: 1024px) {
  .contact-quick a.cq-card .btn { width: 100%; padding-inline: 10px; font-size: .95rem; white-space: nowrap; justify-content: center; }
}
.contact-quick a.cq-card:hover,
.contact-quick a.cq-card:focus-visible { border-color: var(--purple, #524087); box-shadow: 0 12px 32px rgba(82,64,135,.14); }
.form-crisis-note {
  background: #fff5f5;
  border: 2px solid var(--danger, #dc2626);
  border-radius: 12px;
  padding: 14px 16px;
  margin: 0 0 20px;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--text, #2a2545);
  font-weight: 600;
}
.form-crisis-note a { font-weight: 800; color: var(--purple, #524087); }

/* Oct 26: Safety Exit (fixed top-right, 48px) never covers Donate. Reserve its width on the nav row. */
@media (min-width: 1024px) {
  .nav-inner { padding-right: max(28px, calc(176px - (100vw - 1160px) / 2)) !important; }
}
@media (min-width: 1024px) and (max-width: 1279.98px) {
  /* Keep the nav clear of the fixed 149px Safety Exit once the sticky nav reaches the top. */
  .nav-inner { padding-right: 168px !important; }
  .nav-links { gap: 0 !important; }
  .nav-links > li > a { padding: 8px 4px !important; font-size: 13px !important; }
  .nav-links .sub-toggle { width: 24px; min-height: 48px; margin-right: 0; }
  .nav-logo { flex: 0 0 auto; }
  .nav-logo img { max-width: 96px; height: auto; }
}

/* Nov 11: Donate band — Give Securely Online opens Qgiv. No embed, no reserved form height. */
.give-band { position: relative; overflow: hidden; padding: 56px 0 28px; background: linear-gradient(135deg, rgba(215,196,242,.55), rgba(235,247,247,.7)); }
.give-band-swoosh { position: absolute; right: -40px; top: 24px; width: 420px; max-width: 60%; height: auto; opacity: .35; pointer-events: none; }
.give-band-grid { position: relative; display: grid; gap: 0; grid-template-columns: minmax(0, 42rem); justify-content: center; align-items: start; }
.give-band-lead { font-size: 1.125rem; margin-bottom: 20px; }
.give-online { text-align: center; margin: 4px 0 28px; }
.give-online .btn { font-size: 1.15rem; font-weight: 800; padding: 16px 36px; min-height: 56px; }
.give-wishlist { margin: 18px 0 0; }
.give-points { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; }
.give-points li { display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 14px; align-items: center; font-size: 1rem; }
.give-points img { width: 48px; height: 48px; }
.give-card { background: #fff; border-radius: 20px; box-shadow: 0 18px 48px rgba(52,40,88,.14); padding: 24px; display: flex; flex-direction: column; align-items: center; }
.give-card .qgiv-embed-container,
.give-card .qgiv-embed-container.qgiv-live { margin: 0 auto; min-height: 0; border: 0; }
.give-card iframe { width: 100% !important; border: 0 !important; display: block; min-height: 0; }
@media (max-width: 639.98px) { .give-band { padding: 40px 0 20px; } .give-online .btn { width: 100%; padding-inline: 16px; } }
#ways .way-stack > .way-give:first-child { grid-column: auto; grid-row: auto; }
#ways { padding-top: 20px; }

/* Oct 26: nav pills wrap label + chevron as one unit; subtle, consistent current state. */
.nav-links > li > a:not(.nav-cta) { border-radius: 8px; }
@media (min-width: 1024px) {
  .nav-links > li.has-sub { border-radius: 8px; padding-right: 6px; transition: background .15s; }
  .nav-links > li.has-sub > a, .nav-links > li.has-sub > a.active, .nav-links > li.has-sub > a:hover { background: transparent !important; padding-right: 2px !important; }
  .nav-links > li.has-sub:hover, .nav-links > li.has-sub:focus-within, .nav-links > li.has-sub.open,
  .nav-links > li.has-sub:has(> a.active) { background: var(--lavender); }
  .nav-links > li.has-sub:has(> a.active) > a, .nav-links > li.has-sub:has(> a.active) > .sub-toggle { color: var(--purple); }
  .nav-links .has-sub:last-of-type .sub-menu, .nav-links .has-sub:nth-last-child(2) .sub-menu { left: 0; right: auto; }
  .nav-links .sub-menu { left: 0; margin-top: 6px; padding: 8px; min-width: 220px; }
  .nav-links .sub-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -8px; height: 8px; }
  .nav-links .sub-menu a { padding: 0 14px; min-height: 48px; }
  nav, .nav-inner { overflow: visible !important; }
}

/* Oct 26: people grids — real gaps, contained, uniform photo frame, equal heights. */
.row:has(> div > .person) { display: grid !important; grid-template-columns: 1fr; gap: 24px; margin: 0 0 32px !important; width: 100%; max-width: 100%; }
@media (min-width: 640px) { .row:has(> div > .person) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .row:has(> div > .person) { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; } }
.row:has(> div > .person) > div { width: auto !important; max-width: none !important; padding: 0 !important; margin: 0 !important; flex: none !important; display: flex; }
.row:has(> div > .person) .person { width: 100%; height: 100%; margin: 0 !important; box-sizing: border-box; display: flex; flex-direction: column; align-items: flex-start; }
.row:has(> div > .person) .person > .person-photo,
.row:has(> div > .person) .person > .person-monogram { width: 132px !important; height: 132px !important; aspect-ratio: 1 !important; object-fit: cover; object-position: center 20%; border-radius: 12px; margin: 0 0 14px; flex: none; }
.row:has(> div > .person) .person > .bio-toggle { margin-top: auto; }
.row:has(> div > .person) .person > .person-bio + .bio-toggle { margin-top: auto; }
@media (max-width: 639.98px) {
  .row:has(> div > .person) .person { display: grid; grid-template-columns: 96px minmax(0,1fr); column-gap: 16px; }
  .row:has(> div > .person) .person > .person-photo,
  .row:has(> div > .person) .person > .person-monogram { width: 96px !important; height: 96px !important; margin: 0; }
  .row:has(> div > .person) .person > .bio-toggle { margin-top: 8px; }
}
@media (min-width: 640px) {
  .row:has(> div > .person) .person > .person-photo,
  .row:has(> div > .person) .person > .person-monogram { width: 112px !important; height: 112px !important; } /* smallest source is 169px: keeps >=1.5x */
  .row:has(> div > .person) .person { padding: 20px; }
}

/* Oct 26: Get Help reach cards — balanced 2x2, hotline emphasized, no stranded button. */
.row.reach-grid { display: grid !important; grid-template-columns: 1fr; gap: 24px; margin: 0 0 36px !important; align-items: stretch; }
.row.reach-grid > div, .row.reach-grid .reach-side { display: contents !important; }
.row.reach-grid .reach-card { margin: 0 !important; height: 100%; box-sizing: border-box; }
.row.reach-grid > div:first-child .reach-card { border: 2px solid var(--danger, #dc2626); background: #fff5f5; }
.row.reach-grid > div:first-child .reach-card .contact-val a { color: var(--danger, #dc2626); }
.row.reach-grid .reach-card .btn { margin-top: 8px; }
.row.reach-grid .reach-card h3 { min-height: 0; }
@media (min-width: 640px) { .row.reach-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; } }

/* Oct 26: Get Help safety planning card + FAQ band. */
.safety-plan-card { display: grid; grid-template-columns: 1fr; gap: 16px; align-items: start; margin: 0; padding: 28px; border-radius: 20px; background: var(--lavender-soft, rgba(215,196,242,.28)); border-left: 6px solid var(--purple, #524087); }
.safety-plan-card img { width: 64px; height: 64px; }
.safety-plan-card h2 { margin: 0 0 8px; }
.safety-plan-card p { line-height: 1.65; margin: 0; max-width: 46rem; }
.safety-plan-card .btn { min-height: 48px; display: inline-flex; align-items: center; }
@media (min-width: 640px) { .safety-plan-card { grid-template-columns: 64px minmax(0,1fr); gap: 24px; padding: 32px; } }
section#reach .row:not(.reach-grid) p { line-height: 1.6; }

.faq-band { background: linear-gradient(180deg, rgba(215,196,242,.35), rgba(215,196,242,.18)); padding: 72px 0; }
.faq-band .faq-head { text-align: center; margin-bottom: 32px; }
.faq-band .faq-head .section-title { margin: 0 0 8px; }
.faq-band .faq-swoosh { width: 140px; height: auto; display: block; margin: 0 auto; }
.faq-band .faq-list { max-width: 880px; margin: 0 auto; display: grid; gap: 16px; }
.faq-band details.faq-item { background: #fff; border-radius: 16px; border: 1px solid var(--border, #e8e0f0); box-shadow: 0 6px 18px rgba(52,40,88,.06); overflow: hidden; }
.faq-band details.faq-item > summary.faq-q { position: relative; display: flex; align-items: center; min-height: 48px; padding: 20px 72px 20px 24px; font-weight: 700; font-size: 1.125rem; cursor: pointer; list-style: none; }
.faq-band details.faq-item > summary.faq-q::after { content: "+" !important; position: absolute; right: 16px; top: 50%; width: 48px; height: 48px; margin-top: -24px; display: flex; align-items: center; justify-content: center; font-size: 32px; font-weight: 500; line-height: 1; color: var(--purple, #524087); transform: none !important; background: none !important; border: 0 !important; }
.faq-band details.faq-item[open] > summary.faq-q::after { content: "−" !important; }
.faq-band details.faq-item .faq-a { padding: 0 24px 24px; }
.faq-band details.faq-item .faq-a p { font-size: 16px; line-height: 1.65; margin: 0; }
@media (max-width: 639.98px) { .faq-band { padding: 48px 0; } .faq-band details.faq-item > summary.faq-q { padding: 16px 64px 16px 20px; } }
.faq-band details.faq-item > summary.faq-q::after { font-size: 32px !important; font-family: Arial, sans-serif; }

/* Oct 26: services hero + program cards; no pill clouds anywhere. */
.county-links, .anchor-links { display: flex; flex-wrap: wrap; gap: 4px 20px; }
.county-links a, .anchor-links a { background: none !important; border: 0 !important; border-radius: 0 !important; padding: 12px 0 !important; min-height: 48px; display: inline-flex; align-items: center; color: var(--purple) !important; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; box-shadow: none !important; }
p a[href^="tel:"]:not(.btn), li a[href^="tel:"]:not(.btn) { display: inline !important; min-width: 0 !important; min-height: 0 !important; padding: 12px 2px; margin: -12px -2px; }
.svc-intro { padding: 48px 0 8px; }
.programs-band { padding: 48px 0 64px; background: var(--lavender-soft, rgba(215,196,242,.28)); }
.prog-grid { display: grid; grid-template-columns: 1fr; gap: 24px; margin-top: 24px; }
@media (min-width: 640px) { .prog-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (min-width: 1024px) { .prog-grid { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 28px; } }
.prog-card { display: flex; flex-direction: column; gap: 10px; height: 100%; box-sizing: border-box; padding: 24px; background: #fff; border: 1px solid var(--border, #e8e0f0); border-radius: 16px; text-decoration: none !important; color: var(--text); transition: transform .15s, box-shadow .15s; }
.prog-card:hover, .prog-card:focus-visible { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(52,40,88,.12); }
.prog-card img { width: 48px; height: 48px; }
.prog-card-title { font-weight: 700; font-size: 1.125rem; color: var(--dark, #1c1a35); }
.prog-card-text { font-size: 16px; line-height: 1.55; color: var(--muted, #556476); }
#counties, #martin, #st-lucie, #indian-river { scroll-margin-top: 140px; }
.serve-strip { margin-top: 36px; text-align: center; }
.serve-strip h3 { margin: 0 0 4px; }
.serve-strip a { display: inline-flex; align-items: center; min-height: 48px; font-weight: 600; color: var(--purple); }
/* Photo slot ready for Heather's approved images: add <figure class="program-media"> inside an article.program. */
@media (min-width: 1024px) {
  article.program:has(.program-media) { grid-template-columns: repeat(12, minmax(0,1fr)); }
  article.program:has(.program-media) > .program-media { grid-column: 8 / span 5; grid-row: 1 / span 8; margin: 0; }
  article.program:has(.program-media) > :not(.program-media) { grid-column: 1 / span 6; }
  article.program:has(.program-media):nth-of-type(even) > .program-media { grid-column: 1 / span 5; }
  article.program:has(.program-media):nth-of-type(even) > :not(.program-media) { grid-column: 7 / span 6; }
}
.program-media img { width: 100%; height: auto; border-radius: 16px; display: block; }
section.svc-intro > .container.prose { display: block !important; max-width: 46rem; margin: 0 auto; text-align: center; }
section.svc-intro > .container.prose > p { columns: auto !important; }
.prog-card { min-height: 100%; }
.prog-grid > .prog-card { height: auto; }
.prog-grid { align-items: stretch; }

/* Oct 26 get-help: no 2-col rows with empty space; short content centered. */
.help-shelter { max-width: 46rem; margin: 48px auto 0; }
.help-shelter p { line-height: 1.65; }
.help-counties { margin: 40px calc(50% - 50vw) 0; padding: 40px 24px; text-align: center; background: var(--teal-soft, #EBF7F7); }
.help-counties h2 { margin: 0 0 8px; }
.help-counties p { max-width: 40rem; margin: 0 auto 8px; }
.help-counties .county-links { justify-content: center; }
.safety-plan-card { max-width: none; width: 100%; box-sizing: border-box; }
.faq-band { margin-top: 0; padding: 56px 0; background: linear-gradient(180deg, #efe6fb 0%, #f6f1fd 100%); }
.faq-band .faq-head .section-title { font-size: clamp(1.75rem, 3vw, 2.4rem); }
.faq-band details.faq-item > summary.faq-q { font-size: 1.15rem; }

/* Oct 26: Get Help "Help that responds to real life" band. */
.real-life-band { padding: 72px 0; background: linear-gradient(180deg, #f6f1fd 0%, #fff 100%); }
.real-head { text-align: center; margin-bottom: 32px; }
.real-head .section-title { margin: 0 0 8px; }
.real-grid { list-style: none; margin: 0 auto; padding: 0; max-width: 960px; display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 640px) { .real-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
.real-card { display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 16px; align-items: start; height: 100%; box-sizing: border-box; margin: 0; padding: 24px; background: #fff; border: 1px solid var(--border, #e8e0f0); border-radius: 16px; box-shadow: 0 6px 18px rgba(52,40,88,.06); font-size: 16px; line-height: 1.6; color: var(--text); }
.real-card::before { content: none !important; }
.real-card img { width: 48px; height: 48px; }
.real-cta { text-align: center; margin: 32px 0 0; }
.real-cta .btn { min-height: 48px; display: inline-flex; align-items: center; }
.help-more { padding: 48px 0; }
.help-callout { padding: 48px 0; background: #fff; }
.help-callout .safety-plan-card { margin: 0; }
.help-shelter-card { margin: 0; }
.prose-band { padding: 48px 0; background: #fff; }
.prose-measure { max-width: 68ch; margin: 0 auto; text-align: center; }
.prose-measure h2,
.prose-measure .section-title { text-align: center; margin-bottom: 16px; }
.prose-measure p { text-align: center; line-height: 1.65; margin: 0; }
.prose-measure p + p { margin-top: 1em; }
@media (max-width: 639.98px) { .real-life-band { padding: 48px 0; } }
.real-head .faq-swoosh { width: 140px; height: auto; display: block; margin: 0 auto; }

/* Escape closes an open desktop dropdown even while focus or hover is still inside it. */
@media (min-width: 1024px) { .nav-links .has-sub.esc-closed > .sub-menu { opacity: 0 !important; visibility: hidden !important; } }