/* Simon Wiesenthal Center Learning Center
   Matched to the existing SWC landing page template. */

:root{
  --swc-blue:#0b5c9c;
  --swc-blue-dark:#08477a;
  --swc-blue-deep:#063a63;
  --swc-navy:#12324f;
  --black:#000000;

  --ink:#1e242b;
  --ink-2:#414952;
  --ink-3:#6b7480;
  --rule:#dfe3e8;
  --rule-soft:#edeff2;
  --paper:#ffffff;
  --paper-2:#f4f6f8;
  --paper-3:#eaeef2;

  --sans:"Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;

  --measure:40rem;
  --wrap:72rem;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:1.0625rem;
  line-height:1.6;
}

h1,h2,h3{ font-family:var(--sans); font-weight:600; line-height:1.22; margin:0 0 .6em; }
h2,h3{ color:var(--swc-blue); }
p{ margin:0 0 1.1em; }
p:last-child{ margin-bottom:0; }

a{ color:var(--swc-blue); text-underline-offset:.15em; }
a:hover{ color:var(--swc-blue-dark); }
:focus-visible{ outline:3px solid var(--swc-blue); outline-offset:2px; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:clamp(1.1rem,4vw,2rem); }

.skip{ position:absolute; left:-9999px; top:0; z-index:100;
  background:var(--swc-blue); color:#fff; padding:.7rem 1.1rem; }
.skip:focus{ left:0; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-block; padding:.8rem 1.9rem;
  font-family:inherit; font-size:.92rem; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; text-decoration:none;
  border:none; border-radius:3px; cursor:pointer; text-align:center;
}
.btn--primary{ background:var(--swc-blue); color:#fff; }
.btn--primary:hover{ background:var(--swc-blue-dark); color:#fff; }
.btn--lg{ padding:.95rem 2.4rem; font-size:.98rem; }

/* ---------- Header ---------- */
.site-header{ background:var(--black); }
.site-header__inner{
  display:flex; flex-direction:column; align-items:center; gap:.9rem;
  padding-block:1.4rem; text-align:center;
}
.site-header__brand{ text-decoration:none; }
.site-header__logo{
  color:#fff; font-size:1.05rem; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; line-height:1.35;
}
.site-nav__list{ display:flex; flex-wrap:wrap; justify-content:center; gap:1.1rem 2.6rem;
  list-style:none; margin:0; padding:0; }
.site-nav a{ color:#fff; text-decoration:none; font-size:.95rem; font-weight:600; }
.site-nav a:hover{ color:#9ec8e8; }
.site-header__back{ display:none; }

/* ---------- Hero ---------- */
.hero{ position:relative; background:var(--swc-blue-deep); color:#fff; overflow:hidden; }
.hero__media{
  position:absolute; inset:0;
  background:linear-gradient(135deg,var(--swc-blue-deep) 0%,var(--swc-blue) 55%,var(--swc-blue-dark) 100%);
}
.hero__inner{
  position:relative; z-index:1;
  display:grid; gap:clamp(1.6rem,4vw,3rem);
  grid-template-columns:1fr;
  padding-block:clamp(2.2rem,5vw,3.4rem);
  align-items:start;
}
@media (min-width:60rem){
  .hero__inner{ grid-template-columns:1.05fr minmax(23rem,.95fr); }
}
.hero__eyebrow{
  font-size:.74rem; text-transform:uppercase; letter-spacing:.14em; font-weight:700;
  color:#a9d2ef; margin:0 0 .85rem;
}
.hero__h1{
  font-size:clamp(1.85rem,4vw,2.7rem); color:#fff;
  max-width:18ch; margin-bottom:.5em; font-weight:700;
}
.hero__dek{ font-size:1.06rem; color:#dbe8f4; max-width:34rem; margin:0; }

/* ---------- Signup form ---------- */
.signup{ background:#fff; border-radius:5px; overflow:hidden; box-shadow:0 6px 26px rgba(0,0,0,.22); }
.signup__bar{ background:var(--swc-blue); padding:.85rem 1.25rem; text-align:center; }
.signup__heading{
  margin:0; color:#fff; font-size:1.02rem; font-weight:700;
  letter-spacing:.07em; text-transform:uppercase;
}
.signup__body{ padding:1.35rem 1.4rem 1.5rem; color:var(--ink); }
.signup__value{ font-size:.92rem; color:var(--ink-2); margin:0 0 1rem; }
.signup__field{ margin-bottom:.85rem; }
.signup__label{ display:block; font-size:.84rem; font-weight:600; color:var(--ink-2); margin-bottom:.28rem; }
.req{ color:#c0392b; margin-left:.15em; }
.signup__input{
  width:100%; padding:.62rem .7rem; font-size:.98rem; font-family:inherit;
  border:1px solid #c8ced6; border-radius:3px; background:#fff; color:var(--ink);
}
.signup__input::placeholder{ color:#9aa3ad; }
.signup__input:focus{ border-color:var(--swc-blue); outline-offset:0; }
.signup__privacy-note,
.signup__legal{ font-size:.78rem; color:var(--ink-3); margin:.75rem 0; line-height:1.5; }
.signup__consent{ margin:.7rem 0; font-size:.82rem; color:var(--ink-2); }
.signup__consent label{ display:flex; gap:.5rem; align-items:flex-start; cursor:pointer; }
.signup__consent input{ margin-top:.28em; flex:0 0 auto; }
.signup__actions{ margin-top:1rem; }
.signup__button{ width:auto; min-width:9rem; }
.signup__privacy{ margin:.8rem 0 0; font-size:.78rem; }
.signup__privacy a{ color:var(--ink-3); }

@media (min-width:34rem){
  .signup__form{ display:grid; grid-template-columns:1fr 1fr; gap:0 .8rem; }
  .signup__field--email,
  .signup__field--zip,
  .signup__privacy-note,
  .signup__consent,
  .signup__legal,
  .signup__actions,
  .signup__privacy{ grid-column:1 / -1; }
}

/* ---------- Trust strip ---------- */
.trust-strip{ background:var(--swc-navy); color:#dce7f0; }
.trust-strip__list{
  display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem 2.4rem;
  list-style:none; margin:0; padding:.8rem 0; font-size:.86rem;
}
.trust-strip__item{ position:relative; padding-left:1rem; }
.trust-strip__item::before{
  content:""; position:absolute; left:0; top:.62em;
  width:5px; height:5px; border-radius:50%; background:#7fb6df;
}

/* ---------- Content sections ---------- */
.quick-answer__inner,
.section__inner,
.faq__inner,
.related__inner,
.mission-bridge__inner,
.email-value__inner{ padding-block:clamp(2rem,4.5vw,3rem); }

.quick-answer__heading{ font-size:1.55rem; }
.quick-answer__body{ max-width:var(--measure); font-size:1.08rem; }
.quick-answer__body p+p{ font-size:1rem; color:var(--ink-2); }

.section{ border-top:1px solid var(--rule-soft); }
.section__heading{ font-size:1.42rem; max-width:34ch; }
.section__body{ max-width:var(--measure); color:var(--ink-2); }

/* Cards */
.cards{ list-style:none; margin:1.5rem 0 0; padding:0;
  display:grid; gap:.8rem; grid-template-columns:repeat(auto-fit,minmax(12.5rem,1fr)); }
.card{ background:var(--paper-2); border:1px solid var(--rule);
  border-left:3px solid var(--swc-blue); padding:.9rem 1rem; border-radius:3px; }
.card__label{ font-weight:600; color:var(--ink); font-size:.96rem; }
.module--evidence-cards .card{ background:#e8f1f8; border-left-width:5px; }
.module--source-cards .card{ border-left-style:dashed; }
.module--distinction-cards .card{ border-left:none; border-top:3px solid var(--swc-blue); }
.module--heritage-cards .card{ border-radius:3px 12px 3px 12px; }
.module--organization-cards .card,
.module--benefit-cards .card,
.module--factor-cards .card{ background:#fff; }

/* Lists */
.checks{ list-style:none; margin:1.4rem 0 0; padding:0; max-width:var(--measure); }
.checks li{ position:relative; padding:.5rem 0 .5rem 1.8rem;
  border-bottom:1px solid var(--rule-soft); color:var(--ink); }
.checks li:last-child{ border-bottom:none; }
.checks li::before{
  content:""; position:absolute; left:.3rem; top:1.02em;
  width:.6rem; height:.6rem; border:2px solid var(--swc-blue);
  border-top:none; border-right:none; transform:rotate(-45deg);
}
.module--principles .checks li::before,
.module--pattern-list .checks li::before,
.module--definition-list .checks li::before,
.module--list .checks li::before{
  border:none; transform:none; top:1.15em; width:.7rem; height:2px; background:var(--swc-blue);
}
.module--definition-list .checks li{ font-weight:600; }

/* Sequence */
.sequence{ list-style:none; margin:1.5rem 0 0; padding:0; max-width:var(--measure); }
.sequence__step{ display:flex; gap:.9rem; align-items:baseline; padding:.55rem 0; position:relative; }
.sequence__num{
  flex:0 0 auto; width:1.7rem; height:1.7rem;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--swc-blue); color:#fff; border-radius:50%;
  font-size:.78rem; font-weight:700; transform:translateY(.15em);
}
.sequence__label{ color:var(--ink); }
.module--timeline .sequence{ position:relative; padding-left:1.4rem; }
.module--timeline .sequence::before{
  content:""; position:absolute; left:.42rem; top:.9rem; bottom:.9rem; width:2px; background:var(--rule);
}
.module--timeline .sequence__num{
  position:absolute; left:-1.4rem; width:.85rem; height:.85rem;
  background:var(--swc-blue); color:transparent; font-size:0; transform:translateY(.55em);
}
.module--framework .sequence__num,
.module--evidence-check .sequence__num{ border-radius:3px; }

/* ---------- Inline CTA ---------- */
.cta-inline{ background:var(--paper-2); border-block:1px solid var(--rule); }
.cta-inline__inner{
  padding-block:1.7rem; display:flex; flex-wrap:wrap; gap:1rem 2rem;
  align-items:center; justify-content:center; text-align:center;
}
.cta-inline__text{ margin:0; font-size:1.08rem; font-weight:600; color:var(--swc-blue); }

/* ---------- Mission bridge ---------- */
.mission-bridge{ background:var(--paper-2); border-block:1px solid var(--rule); }
.mission-bridge__heading{ font-size:1.42rem; max-width:32ch; }
.mission-bridge p{ max-width:var(--measure); color:var(--ink-2); }

/* ---------- FAQ ---------- */
.faq{ border-top:1px solid var(--rule-soft); }
.faq__heading{ font-size:1.42rem; }
.faq__list{ margin:1.3rem 0 0; max-width:var(--measure); }
.faq__item{ padding:1rem 0; border-bottom:1px solid var(--rule-soft); }
.faq__item:last-child{ border-bottom:none; }
.faq__q{ font-size:1.06rem; font-weight:700; color:var(--ink); margin:0 0 .35rem; }
.faq__a{ margin:0; color:var(--ink-2); }

/* ---------- Related ---------- */
.related{ background:var(--paper-3); border-top:1px solid var(--rule); }
.related__heading{ font-size:1.42rem; }
.related__list{ list-style:none; margin:1.2rem 0 0; padding:0;
  display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(16rem,1fr)); }
.related__item{ background:#fff; border:1px solid var(--rule); border-radius:3px; padding:1rem 1.1rem; }
.related__link{ font-size:1.02rem; font-weight:700; color:var(--swc-blue); text-decoration:none; display:block; }
.related__link:hover{ text-decoration:underline; }
.related__note{ display:block; margin-top:.4rem; font-size:.9rem; color:var(--ink-3); }

/* ---------- Email value ---------- */
.email-value{ background:var(--paper-2); border-top:1px solid var(--rule); }
.email-value__inner{ text-align:center; }
.email-value__heading{ font-size:1.42rem; }
.email-value__intro{ max-width:46ch; margin-inline:auto; color:var(--ink-2); }
.email-value__benefits{ list-style:none; margin:1.5rem auto 0; padding:0; max-width:52rem;
  display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(14rem,1fr)); text-align:left; }
.benefit{ padding-left:.9rem; border-left:3px solid var(--swc-blue); }
.benefit__title{ display:block; font-weight:700; color:var(--ink); font-size:.97rem; }
.benefit__body{ display:block; color:var(--ink-3); font-size:.91rem; }
.email-value__action{ margin:1.6rem 0 0; }

/* ---------- Final CTA ---------- */
.final-cta{ background:var(--swc-blue-deep); color:#fff; }
.final-cta__inner{ padding-block:clamp(2.2rem,5vw,3rem); text-align:center; }
.final-cta__heading{ color:#fff; font-size:1.5rem; }
.final-cta__body{ max-width:46ch; margin-inline:auto; color:#cfe0ee; }
.final-cta .btn--primary{ background:#fff; color:var(--swc-blue-deep); margin-top:1.2rem; }
.final-cta .btn--primary:hover{ background:#e4eef7; color:var(--swc-blue-deep); }

/* ---------- Org mission ---------- */
.org-mission{ background:#fff; border-top:1px solid var(--rule); }
.org-mission .wrap{ padding-block:clamp(1.8rem,4vw,2.5rem); }
.org-mission__heading{ font-size:1.2rem; }
.org-mission__body{ max-width:58ch; color:var(--ink-2); font-size:.97rem; }
.org-mission__more{ font-size:.92rem; margin:0; }

/* ---------- Footer ---------- */
.site-footer{ background:var(--swc-blue); color:#d6e6f3; }
.site-footer__inner{ padding-block:2.4rem; display:grid; gap:1.8rem; grid-template-columns:1fr; }
@media (min-width:48rem){ .site-footer__inner{ grid-template-columns:1.5fr 1fr 1fr; } }
.site-footer__name{ font-size:1rem; color:#fff; margin:0 0 .5rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase; }
.site-footer__address,.site-footer__contact{ margin:0 0 .35rem; font-size:.89rem; }
.site-footer__contact a{ color:#d6e6f3; display:block; margin-bottom:.25rem; }
.site-footer__contact a:hover{ color:#fff; }
.site-footer__nav ul{ list-style:none; margin:0; padding:0; display:grid; gap:.45rem; }
.site-footer__nav a{ color:#d6e6f3; text-decoration:none; font-size:.89rem; }
.site-footer__nav a:hover{ color:#fff; text-decoration:underline; }
.site-footer__legal{ grid-column:1/-1; margin:0; padding-top:1.3rem;
  border-top:1px solid rgba(255,255,255,.2); font-size:.8rem; color:#a9cbe4; }

@media print{
  .site-header,.trust-strip,.signup,.cta-inline,.final-cta,.skip{ display:none; }
  body{ font-size:11pt; color:#000; }
}
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *{ animation:none !important; transition:none !important; }
}

/* ---------- Header: logo bar + dropdown nav ---------- */
.site-header{ background:var(--black); }
.site-header__logobar{ display:flex; justify-content:center; padding:1.15rem 1rem .55rem; }
.site-header__brand{ display:inline-block; line-height:0; }
.site-header__logo-img{ display:block; height:62px; width:auto; }

.site-nav{ border-top:0; }
.site-nav__list{
  display:flex; flex-wrap:wrap; justify-content:center; gap:0 2.4rem;
  list-style:none; margin:0; padding:0 1rem .9rem;
}
.site-nav__item{ position:relative; }
.site-nav__link{
  display:inline-flex; align-items:center; gap:.35rem;
  color:#fff; text-decoration:none; font-size:.95rem; font-weight:600;
  padding:.4rem 0;
}
.site-nav__link:hover{ color:#9ec8e8; }
.site-nav__caret{
  width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent;
  border-top:5px solid currentColor; opacity:.8;
}

/* Dropdowns: CSS only, hover plus keyboard focus. No JS, so the full nav is in
   the initial HTML response. */
.site-nav__sub{
  position:absolute; left:50%; top:100%; transform:translateX(-50%);
  min-width:16rem; margin:0; padding:.45rem 0; list-style:none;
  background:#fff; border-radius:0 0 4px 4px;
  box-shadow:0 8px 24px rgba(0,0,0,.28);
  opacity:0; visibility:hidden; pointer-events:none; z-index:60;
}
.site-nav__item.has-children:hover > .site-nav__sub,
.site-nav__item.has-children:focus-within > .site-nav__sub{
  opacity:1; visibility:visible; pointer-events:auto;
}
.site-nav__sub a{
  display:block; padding:.5rem 1.1rem; color:var(--ink); text-decoration:none;
  font-size:.9rem; font-weight:500; white-space:nowrap;
}
.site-nav__sub a:hover{ background:var(--paper-2); color:var(--swc-blue); }

@media (max-width:44rem){ .site-header__logo-img{ height:50px; } }

/* Hero sits under a photographic background supplied inline per page. */
.hero__media{ background-color:var(--swc-blue-deep); }

/* ============================================================
   REVISIONS
   ============================================================ */

/* ---- Content centering ----
   The reading measure stays at 40rem for legibility, but the column now sits
   centred in the 72rem container instead of pinned left with dead space. */
.quick-answer__body,
.section__body,
.section .cards,
.section .checks,
.section .sequence,
.mission-bridge p,
.faq__list{
  margin-inline:auto;
}
.quick-answer__heading,
.section__heading,
.mission-bridge__heading,
.faq__heading,
.related__heading{
  margin-inline:auto; max-width:var(--measure);
}
.related__list{ max-width:var(--measure); margin-inline:auto; }
.quick-answer__inner,
.section__inner,
.faq__inner,
.related__inner,
.mission-bridge__inner{ max-width:calc(var(--measure) + 6rem); margin-inline:auto; }

/* ---- Hero: legibility + form no longer overflowing the band ---- */
.hero__inner{
  padding-block:clamp(2.6rem,5vw,3.8rem) clamp(3rem,6vw,4.6rem);
  align-items:center;
}
.hero__h1{
  max-width:20ch;
  text-shadow:0 2px 14px rgba(0,0,0,.55);
}
.hero__dek{
  color:#eaf2f9;
  max-width:36rem;
  text-shadow:0 1px 10px rgba(0,0,0,.7);
}
.hero__eyebrow{ text-shadow:0 1px 8px rgba(0,0,0,.6); }
.hero__copy{ position:relative; }

/* ---- Inline CTA copy ---- */
.cta-inline__text{ max-width:34ch; text-align:center; }

/* ---- Mobile navigation ---- */
.site-nav__toggle{
  display:none;
  align-items:center; gap:.55rem;
  margin:0 auto .9rem; padding:.55rem 1rem;
  background:transparent; color:#fff;
  border:1px solid rgba(255,255,255,.45); border-radius:3px;
  font-family:inherit; font-size:.88rem; font-weight:600;
  letter-spacing:.06em; text-transform:uppercase; cursor:pointer;
}
.site-nav__toggle:hover{ border-color:#fff; }
.site-nav__bars{ display:inline-block; width:18px; height:2px; background:#fff; position:relative; }
.site-nav__bars::before,
.site-nav__bars::after{
  content:""; position:absolute; left:0; width:18px; height:2px; background:#fff;
}
.site-nav__bars::before{ top:-6px; }
.site-nav__bars::after{ top:6px; }
.site-nav__toggle[aria-expanded="true"] .site-nav__bars{ background:transparent; }
.site-nav__toggle[aria-expanded="true"] .site-nav__bars::before{ top:0; transform:rotate(45deg); }
.site-nav__toggle[aria-expanded="true"] .site-nav__bars::after{ top:0; transform:rotate(-45deg); }







/* Screen-reader-only text. Used by the mobile submenu expander buttons. */
.visually-hidden{
  position:absolute !important; width:1px; height:1px;
  padding:0; margin:-1px; overflow:hidden;
  clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}

/* ---- Card and resource grids escape the reading measure ----
   The 40rem measure exists for prose legibility. These blocks hold short labels
   and links, so constraining them to it forced 3+2 and 2+1 orphan rows.
   Flex with centred wrapping means any item count wraps evenly. */
.section .cards,
.related__list,
.email-value__benefits{
  max-width:calc(var(--measure) + 9rem);
}

.cards{
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:.8rem;
}
.card{
  flex:1 1 10.5rem; max-width:15rem; min-width:9rem;
}

.related__list{
  display:flex; flex-wrap:wrap; justify-content:center; gap:1rem;
}
.related__item{
  flex:1 1 14.5rem; max-width:20rem; min-width:12rem;
}

.email-value__benefits{
  display:flex; flex-wrap:wrap; justify-content:center; gap:1rem 1.4rem;
}
.benefit{ flex:1 1 12rem; max-width:16rem; min-width:10rem; }

@media (max-width:34rem){
  .card{ flex:1 1 100%; max-width:none; }
  .related__item{ flex:1 1 100%; max-width:none; }
  .benefit{ flex:1 1 100%; max-width:none; }
}


/* ---- Mobile navigation ----
   Submenus are always visible inside the open menu, indented under their
   parent. No per-item toggle, no borders. One JS toggle for the whole menu. */
@media (max-width:52rem){
  .site-nav__toggle{ display:flex; }

  .site-nav__list{ display:none; }
  .site-nav[data-open="true"] .site-nav__list{
    display:block; flex-direction:column;
    padding:0 0 1rem; margin:0; border:none;
  }

  .site-nav__item{ display:block; width:100%; border:none; position:static; }
  .site-nav__link{
    display:block; width:100%; padding:.75rem 1.3rem;
    font-size:1.02rem; font-weight:700; text-align:left;
  }
  .site-nav__caret{ display:none; }
  .site-nav__expand{ display:none; }

  .site-nav__sub{
    position:static; transform:none;
    display:block; opacity:1; visibility:visible; pointer-events:auto;
    min-width:0; margin:0; padding:0 0 .4rem;
    background:transparent; box-shadow:none; border:none; border-radius:0;
  }
  .site-nav__sub a{
    display:block; color:#b9cfe3; font-weight:400;
    padding:.42rem 1.3rem .42rem 2.4rem; font-size:.92rem;
    white-space:normal; background:transparent;
  }
  .site-nav__sub a:hover{ color:#fff; background:rgba(255,255,255,.08); }
}

/* ---- Mobile menu refinements ----
   Fourteen sublinks makes a long list, so the panel scrolls rather than pushing
   the hero off screen, and top-level items read as section headers. */
@media (max-width:52rem){
  .site-nav[data-open="true"] .site-nav__list{
    max-height:70vh; overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    padding:.2rem 0 .8rem;
  }
  .site-nav__item + .site-nav__item{ margin-top:.15rem; }
  .site-nav__link{
    padding:.5rem 1.3rem .3rem;
    font-size:.78rem; font-weight:700;
    letter-spacing:.11em; text-transform:uppercase;
    color:#7fb6df;
  }
  .site-nav__link:hover{ color:#a9d2ef; }
  .site-nav__sub{ padding:0 0 .5rem; }
  .site-nav__sub a{
    padding:.4rem 1.3rem .4rem 1.3rem;
    font-size:.97rem; color:#fff; font-weight:500;
  }
  .site-nav__sub a:hover{ color:#9ec8e8; background:transparent; }
  /* News has no children, so it needs to read as a link not a header. */
  .site-nav__item:not(.has-children) .site-nav__link{
    font-size:.97rem; font-weight:500; letter-spacing:0;
    text-transform:none; color:#fff; padding:.4rem 1.3rem;
  }
}

/* ============================================================
   MOBILE NAV, REBUILT
   ============================================================ */
@media (max-width:52rem){
  /* The toggle's bottom margin was showing the page background as a white strip
     between the black header and the hero. Spacing moves to the header itself
     so it paints black. */
  .site-nav__toggle{ margin:0 auto; }
  .site-header{ padding-bottom:1rem; }

  /* Submenus collapsed by default, expanded per item. */
  .site-nav__sub{
    position:static; transform:none; box-shadow:none; border-radius:0;
    min-width:0; margin:0; padding:0;
    background:transparent;
    opacity:1; visibility:visible; pointer-events:auto;
    display:none;
  }
  .site-nav__item[data-open="true"] > .site-nav__sub{ display:block; padding:.1rem 0 .5rem; }

  .site-nav__link{
    display:flex; align-items:center; justify-content:space-between;
    width:100%; padding:.72rem 1.3rem;
    font-size:1rem; font-weight:600; color:#fff;
    text-transform:none; letter-spacing:0; text-align:left;
  }
  .site-nav__sub a{
    display:block; padding:.45rem 1.3rem .45rem 2.4rem;
    font-size:.94rem; font-weight:400; color:#b9cfe3;
    white-space:normal; background:transparent;
  }
  .site-nav__sub a:hover{ color:#fff; background:rgba(255,255,255,.08); }

  .site-nav__caret{
    display:inline-block; flex:0 0 auto;
    border-left:5px solid transparent; border-right:5px solid transparent;
    border-top:6px solid #fff; opacity:.85;
    transition:transform .15s ease;
  }
  .site-nav__item[data-open="true"] > .site-nav__link .site-nav__caret{ transform:rotate(180deg); }

  .site-nav[data-open="true"] .site-nav__list{
    display:block; max-height:72vh; overflow-y:auto;
    padding:.2rem 0 .4rem; margin:0; border:none;
  }
  .site-nav__item{ display:block; width:100%; border:none; position:static; }
  .site-nav__item + .site-nav__item{ margin-top:.1rem; }
}

/* Honeypot: off-screen rather than display:none, since some bots skip
   display:none fields but fill positioned ones. */
.signup__hp{
  position:absolute !important; left:-9999px; top:auto;
  width:1px; height:1px; overflow:hidden;
}
.signup__status{
  margin:.9rem 0 0; padding:.65rem .8rem; border-radius:3px;
  font-size:.9rem; line-height:1.45;
}
.signup__status.is-success{ background:#e6f4ea; color:#1a5b2c; border:1px solid #b7e0c3; }
.signup__status.is-error{ background:#fdecea; color:#8c1d13; border:1px solid #f5c6c2; }
.signup__button[disabled]{ opacity:.7; cursor:default; }

/* ---- Success / share panel ----
   Replaces the form inside the same card, so the header bar stays and the card
   does not jump in size. */
.signup-share,
.signup-done{ text-align:center; }
.share__title{
  margin:.2rem 0 .35rem; color:var(--swc-blue);
  font-size:1.12rem; font-weight:700;
}
.share__sub{ margin:0 0 1.1rem; font-size:.92rem; color:var(--ink-2); }
.share__btn{
  display:block; width:100%; padding:.72rem 1rem; margin-bottom:.5rem;
  border-radius:4px; background:var(--swc-blue); color:#fff;
  font-size:.95rem; font-weight:600; text-decoration:none;
  letter-spacing:.02em;
}
.share__btn:hover{ background:var(--swc-blue-dark); color:#fff; }
.share__toast{
  margin:.7rem 0 0; padding:.55rem .7rem; border-radius:3px;
  background:#e6f4ea; color:#1a5b2c; border:1px solid #b7e0c3; font-size:.85rem;
}
.share__skip{ margin:.9rem 0 0; }
.share__skip a{ font-size:.86rem; color:var(--ink-3); }
.share__skip a:hover{ color:var(--swc-blue); }

/* ============================================================
   READING RHYTHM
   Wider measure and tighter vertical gaps. 400 words in a 640px
   column with large section padding reads as thinner than it is.
   ============================================================ */
:root{ --measure:45rem; }  /* 720px, up from 640px */

.quick-answer__inner,
.section__inner,
.faq__inner,
.related__inner,
.mission-bridge__inner,
.email-value__inner{
  padding-block:clamp(1.5rem,3.4vw,2.3rem);
  max-width:calc(var(--measure) + 5rem);
}

/* Enumerated modules get more room than prose: they hold short labels,
   not sentences, so the reading measure does not apply to them. */
.section .cards,
.related__list,
.email-value__benefits{
  max-width:calc(var(--measure) + 8rem);
}

.cards{ margin-top:1.1rem; }
.checks{ margin-top:1rem; }
.sequence{ margin-top:1.1rem; }
.checks li{ padding-block:.42rem; }
.sequence__step{ padding-block:.45rem; }

.faq__list{ margin-top:1rem; }
.faq__item{ padding-block:.85rem; }

.related__list{ margin-top:1rem; }
.cta-inline__inner{ padding-block:1.35rem; }
.final-cta__inner{ padding-block:clamp(1.8rem,4vw,2.5rem); }
.org-mission .wrap{ padding-block:clamp(1.5rem,3.2vw,2.1rem); }

/* Hero copy can use the extra width too. */
.hero__dek{ max-width:38rem; }

/* ---- Organization mission ----
   Renders outside <main> so uniqueness measurement can scope to <main>, which
   meant it missed the centring rules applied to the body sections. */
.org-mission .wrap{
  max-width:calc(var(--measure) + 5rem);
}
.org-mission__heading,
.org-mission__body,
.org-mission__more{
  max-width:var(--measure);
  margin-inline:auto;
}

/* ---- Section rhythm by content weight ----
   Prose sections hold two or three sentences; card, list and sequence sections
   hold a paragraph plus a module. Giving both the same vertical space made the
   short ones read as padding around a fragment. */
.section--prose .section__inner{
  padding-block:clamp(1.15rem,2.4vw,1.6rem);
}
.section--cards .section__inner,
.section--list .section__inner,
.section--sequence .section__inner{
  padding-block:clamp(1.5rem,3.2vw,2.2rem);
}

/* Consecutive prose sections read as one continuous passage rather than a
   stack of separately boxed fragments. */
.section--prose + .section--prose{ border-top-color:transparent; }
.section--prose + .section--prose .section__inner{ padding-block-start:.2rem; }

/* Heading sits closer to the text it introduces. */
.section__heading{ margin-bottom:.45em; }
.section--prose .section__heading{ font-size:1.32rem; }

/* Quick answer keeps its weight: it is the highest-value block on the page. */
.quick-answer__inner{ padding-block:clamp(1.7rem,3.6vw,2.5rem); }

/* Merge only runs of three or more prose sections. An isolated pair reads as
   two distinct points and needs the divider kept. */
.section--prose + .section--prose{ border-top-color:var(--rule-soft); }
.section--prose + .section--prose + .section--prose{ border-top-color:transparent; }
.section--prose + .section--prose .section__inner{ padding-block-start:clamp(1.15rem,2.4vw,1.6rem); }
.section--prose + .section--prose + .section--prose .section__inner{ padding-block-start:.2rem; }

/* Hero columns align at the top rather than centring. The form card is taller
   than the copy, so centring pushed the headline down and left the eyebrow
   floating well below the top of the band. */
.hero__inner{ align-items:start; }

/* ---- Form hierarchy ----
   Email is the conversion. ZIP is useful for regional programming but should
   never look like a second requirement, so it is visually demoted: narrower,
   lighter label, marked optional, and set on the same row as nothing else so
   the eye lands on email first. */
.signup__form{ display:block; }

.signup__field--email{ margin-bottom:.75rem; }
.signup__field--email .signup__label{
  font-size:.9rem; font-weight:700; color:var(--ink);
  letter-spacing:.005em;
}
.signup__field--email .signup__input{
  padding:.82rem .85rem;
  font-size:1.05rem;
  border:1.5px solid #b9c2cc;
  border-radius:4px;
  background:#fff;
  transition:border-color .12s ease, box-shadow .12s ease;
}
.signup__field--email .signup__input:focus{
  border-color:var(--swc-blue);
  box-shadow:0 0 0 3px rgba(11,92,156,.14);
  outline:none;
}

.signup__field--zip{
  max-width:11rem;
  margin-bottom:1rem;
}
.signup__field--zip .signup__label{
  font-size:.78rem; font-weight:500; color:var(--ink-3);
  display:flex; align-items:baseline; gap:.4rem;
}
.signup__field--zip .signup__input{
  padding:.5rem .65rem;
  font-size:.94rem;
  border:1px solid #d4dae1;
  background:var(--paper-2);
}
.signup__field--zip .signup__input:focus{
  border-color:var(--swc-blue); background:#fff; outline:none;
}
.opt{
  font-size:.7rem; font-weight:500; color:var(--ink-3);
  text-transform:uppercase; letter-spacing:.07em;
}

/* The button carries the same weight as the email field it completes. */
.signup__actions{ margin-top:.9rem; }
.signup__button{ width:100%; padding:.85rem 1.2rem; font-size:.95rem; }

/* Legal copy recedes. It has to be present, it does not have to compete. */
.signup__privacy-note,
.signup__legal{
  font-size:.73rem; color:#8a929b; line-height:1.45; margin:.6rem 0;
}
.signup__consent{ margin:.85rem 0; font-size:.84rem; color:var(--ink-2); }

/* ---- Form density ----
   Tightened so the card sits closer in height to the copy column beside it.
   Legal copy stays present and legible but recedes: it is a requirement, not
   a selling point. */
.signup__body{ padding:1.1rem 1.25rem 1.15rem; }
.signup__value{ font-size:.85rem; line-height:1.45; margin:0 0 .85rem; color:var(--ink-2); }

.signup__field--email{ margin-bottom:.6rem; }
.signup__field--zip{ margin-bottom:.7rem; max-width:9.5rem; }
.signup__label{ margin-bottom:.22rem; }
.opt{ display:none; }

.signup__consent{ margin:.6rem 0 .5rem; font-size:.78rem; line-height:1.4; }
.signup__consent input{ margin-top:.22em; }
.signup__legal{ font-size:.68rem; color:#949ba4; line-height:1.4; margin:.45rem 0 0; }

.signup__actions{ margin-top:.85rem; }
.signup__button{ padding:.78rem 1.2rem; }