/* ============ TOKENS — sampled from the PAC logo ============ */
  :root{
    --navy:#0E2E4E;
    --navy-2:#164066;
    --navy-ink:#0A2340;
    --teal:#0E7C61;
    --teal-2:#0B6650;
    --orange:#F58220;
    --gold:#FBBE2C;
    --sky:#2E7CD6;
    --paper:#F8F5EF;
    --paper-2:#EDE7DC;
    --body-ink:#3E4A56;
    --rule:rgba(14,46,78,.16);

    --maxw:1180px;
    --pad:clamp(20px,5vw,64px);
    --display:"Archivo Black","Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
    --body:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  }

  *,*::before,*::after{box-sizing:border-box}
  html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  }
  body{
    margin:0;background:var(--paper);color:var(--navy);
    font-family:var(--body);font-size:clamp(16px,1.05vw,18px);line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%;display:block}
  a{color:inherit}
  .wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}

  h1,h2,h3{font-family:var(--display);font-weight:400;line-height:.95;letter-spacing:-.02em;margin:0;text-wrap:balance}
  p{text-wrap:pretty}

  .eyebrow{
    font-family:var(--body);font-weight:800;font-size:.72rem;
    letter-spacing:.18em;text-transform:uppercase;
    display:inline-flex;align-items:center;gap:.6em;margin:0 0 1.1rem;
  }
  .eyebrow::before{content:"";width:28px;height:3px;background:var(--orange);display:block}

  /* ============ BUTTONS ============ */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:.5em;
    font-family:var(--body);font-weight:800;font-size:.95rem;
    letter-spacing:.04em;text-transform:uppercase;text-decoration:none;
    padding:.95em 1.6em;border:2.5px solid var(--navy);border-radius:2px;
    background:var(--orange);color:var(--navy);cursor:pointer;
    box-shadow:4px 4px 0 var(--navy);
    transition:transform .12s ease, box-shadow .12s ease, background .12s ease;
  }
  .btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--navy);background:var(--gold)}
  .btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--navy)}
  .btn--ghost{background:transparent;color:var(--navy)}
  .btn--ghost:hover{background:var(--navy);color:var(--paper)}
  .btn--teal{background:var(--teal);color:#fff}
  .btn--teal:hover{background:var(--teal-2)}
  .btn--sm{padding:.7em 1.15em;font-size:.8rem;box-shadow:3px 3px 0 var(--navy)}
  :is(a,button,input):focus-visible{outline:3px solid var(--sky);outline-offset:3px}

  /* ============ HEADER ============ */
  .skip{position:absolute;left:-9999px}
  .skip:focus{left:var(--pad);top:10px;z-index:100;background:var(--navy);color:var(--paper);padding:.7em 1em;border-radius:2px}

  header{
    position:sticky;top:0;z-index:50;
    background:rgba(248,245,239,.94);
    backdrop-filter:saturate(160%) blur(10px);
    border-bottom:2px solid var(--navy);
  }
  .nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:.7rem}
  .brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;flex-shrink:0}
  /* Circular emblem is illegible at nav scale, so it rides as a mark
     beside a permanent text wordmark. Emoji mark stands in if the file is missing. */
  .brand__logo{height:54px;width:54px;flex:none;border-radius:50%;background:#fff}
  .brand.is-fallback .brand__logo{display:none}
  .brand__mark{
    display:none;width:54px;height:54px;flex:none;background:var(--navy);border-radius:50%;
    place-items:center;color:var(--gold);font-size:1.4rem;
  }
  .brand.is-fallback .brand__mark{display:grid}
  .brand__txt{font-family:var(--display);font-size:1rem;line-height:.9;letter-spacing:-.02em}
  .brand__txt span{display:block}
  .brand__txt span:last-child{color:var(--teal)}

  .nav__links{display:flex;align-items:center;gap:1.6rem}
  .nav__links a:not(.btn){
    text-decoration:none;font-weight:700;font-size:.86rem;
    letter-spacing:.06em;text-transform:uppercase;padding-block:.3em;
    border-bottom:2px solid transparent;
  }
  .nav__links a:not(.btn):hover{border-bottom-color:var(--orange)}
  .nav__right{display:flex;align-items:center;gap:1.6rem}
  .vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

  /* hamburger — hidden on desktop */
  .nav__toggle{
    display:none;background:transparent;border:2.5px solid var(--navy);border-radius:2px;
    width:44px;height:44px;cursor:pointer;padding:0;place-items:center;color:var(--navy);
  }
  .nav__bars{display:grid;gap:5px;width:20px}
  .nav__bars i{display:block;height:2.5px;background:currentColor;border-radius:2px;transition:transform .18s ease,opacity .18s ease}
  .nav.is-open .nav__bars i:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  .nav.is-open .nav__bars i:nth-child(2){opacity:0}
  .nav.is-open .nav__bars i:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

  @media (max-width:880px){
    .nav{position:relative}
    .nav__toggle{display:grid}
    .nav__right{gap:.7rem}
    .nav__links{
      display:none;position:absolute;top:calc(100% + .7rem);
      left:calc(var(--pad) * -1);right:calc(var(--pad) * -1);
      flex-direction:column;align-items:stretch;gap:0;
      background:var(--paper);border-top:2px solid var(--navy);border-bottom:2px solid var(--navy);
      box-shadow:0 14px 28px rgba(14,46,78,.18);
    }
    .nav.is-open .nav__links{display:flex}
    .nav__links a:not(.btn){
      display:block;padding:1em var(--pad);font-size:.95rem;
      border-bottom:1px solid var(--rule);
    }
    .nav__links a:not(.btn):last-child{border-bottom:0}
    .nav__links a:not(.btn):hover{background:var(--paper-2);border-bottom-color:var(--rule)}
    .nav__links a[aria-current="page"]{color:var(--teal)}
  }

  /* ============ HERO ============ */
  .hero{position:relative;overflow:hidden;background:var(--navy);color:var(--paper);border-bottom:3px solid var(--navy-ink)}
  /* sunburst rays, echoing the logo */
  .hero::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:repeating-conic-gradient(from 180deg at 50% 118%,
      rgba(251,190,44,.13) 0deg 3.2deg, transparent 3.2deg 9deg);
  }
  .hero::after{
    content:"";position:absolute;left:50%;bottom:-42%;translate:-50% 0;
    width:min(120vw,1300px);aspect-ratio:1;border-radius:50%;pointer-events:none;
    background:radial-gradient(circle,rgba(245,130,32,.30) 0%,rgba(245,130,32,.10) 42%,transparent 68%);
  }
  .hero__inner{position:relative;z-index:1;padding-block:clamp(64px,10vw,124px)}
  .hero h1{font-size:clamp(2.9rem,9.2vw,7rem);line-height:.88;letter-spacing:-.035em;margin:0 0 1.4rem;max-width:15ch}
  .hero h1 em{font-style:normal;color:var(--gold)}
  .hero .eyebrow{color:var(--gold)}
  .hero .eyebrow::before{background:var(--gold)}
  .hero__lede{font-size:clamp(1.1rem,2.1vw,1.42rem);line-height:1.5;max-width:56ch;color:#D5DEE8;margin:0 0 2.4rem;font-weight:500}
  .hero__lede strong{color:#fff;font-weight:800}
  .hero__cta{display:flex;flex-wrap:wrap;gap:1rem}
  .hero .btn{border-color:var(--paper);box-shadow:4px 4px 0 var(--paper)}
  .hero .btn:hover{box-shadow:6px 6px 0 var(--paper)}
  .hero .btn:active{box-shadow:1px 1px 0 var(--paper)}
  .hero .btn--ghost{color:var(--paper)}
  .hero .btn--ghost:hover{background:var(--paper);color:var(--navy)}

  /* ============ TICKER ============ */
  .ticker{background:var(--gold);color:var(--navy);border-bottom:3px solid var(--navy);overflow:hidden;padding-block:.6rem}
  .ticker__track{display:flex;gap:2.5rem;width:max-content;animation:slide 40s linear infinite}
  .ticker span{font-family:var(--display);font-size:.95rem;white-space:nowrap;display:flex;align-items:center;gap:2.5rem}
  .ticker span::after{content:"★";color:var(--teal)}
  @keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  @media (prefers-reduced-motion:reduce){.ticker__track{animation:none;width:100%;justify-content:center}}

  /* ============ SECTIONS ============ */
  section{scroll-margin-top:84px}
  .sec{padding-block:clamp(60px,8vw,110px)}
  .sec--rule{border-top:2px solid var(--navy)}
  .sec--navy{background:var(--navy);color:var(--paper)}
  .sec--navy .eyebrow{color:var(--gold)}
  .sec--navy .eyebrow::before{background:var(--gold)}
  .sec--teal{background:var(--teal);color:#fff}
  .sec--teal .eyebrow{color:var(--gold)}
  .sec--teal .eyebrow::before{background:var(--gold)}

  .sec__head{max-width:24ch;margin-bottom:2.6rem}
  .sec__head h2{font-size:clamp(2rem,5.2vw,3.6rem)}
  .h2-lg{font-size:clamp(2rem,5.2vw,3.6rem)}

  .two-col{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,5rem);align-items:start}
  @media (max-width:820px){.two-col{grid-template-columns:1fr}}

  .lede-lg{font-size:clamp(1.15rem,2.2vw,1.55rem);line-height:1.45;font-weight:600;margin:0 0 1.4rem}
  .body-copy p{margin:0 0 1.15rem;color:var(--body-ink);max-width:62ch}
  .sec--navy .body-copy p,.sec--teal .body-copy p{color:#CBD6E1}
  .sec--teal .body-copy p{color:#D8EDE6}

  .pull{border-left:6px solid var(--orange);padding:.2rem 0 .2rem 1.5rem;margin:2rem 0 0}
  .pull p{font-family:var(--display);font-size:clamp(1.3rem,2.8vw,1.9rem);line-height:1.1;margin:0;letter-spacing:-.02em}
  .pull cite{display:block;margin-top:.9rem;font-style:normal;font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}

  /* ============ PILLARS ============ */
  .pillars{display:grid;grid-template-columns:repeat(3,1fr);border:2.5px solid currentColor}
  @media (max-width:860px){.pillars{grid-template-columns:1fr}}
  .pillar{padding:clamp(1.6rem,3vw,2.4rem);border-right:2.5px solid currentColor}
  .pillar:last-child{border-right:0}
  @media (max-width:860px){
    .pillar{border-right:0;border-bottom:2.5px solid currentColor}
    .pillar:last-child{border-bottom:0}
  }
  .pillar__num{font-family:var(--display);font-size:2.6rem;line-height:1;color:var(--gold);display:block;margin-bottom:.7rem}
  .pillar h3{font-size:1.3rem;margin-bottom:.7rem;line-height:1.05}
  .pillar p{margin:0;font-size:.96rem;line-height:1.55;color:#CBD6E1}

  /* ============ CANDIDATE ============ */
  .cand{display:grid;grid-template-columns:minmax(0,340px) 1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
  @media (max-width:820px){.cand{grid-template-columns:1fr}}
  .cand__photo{
    aspect-ratio:4/5;border:3px solid var(--navy);background:var(--paper-2);
    display:grid;place-items:center;text-align:center;padding:1.5rem;
    box-shadow:12px 12px 0 var(--navy);position:relative;overflow:hidden;
  }
  .cand__photo img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
  .cand__photo .ph{font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--body-ink);line-height:1.8}
  .badge{
    display:inline-block;background:var(--orange);color:var(--navy);
    font-weight:800;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
    padding:.45em .85em;border:2px solid var(--navy);margin-bottom:1.1rem;
  }
  .cand h2{font-size:clamp(2.2rem,5.6vw,4rem);margin-bottom:.4rem}
  .cand__role{font-weight:800;font-size:.95rem;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);margin:0 0 1.5rem}

  .stats{display:grid;grid-template-columns:repeat(3,1fr);border:2.5px solid var(--navy);margin:1.9rem 0}
  .stat{padding:1rem .95rem;border-right:2.5px solid var(--navy)}
  .stat:last-child{border-right:0}
  .stat b{display:block;font-family:var(--display);font-size:clamp(1.45rem,3.2vw,2.3rem);line-height:1;color:var(--navy)}
  .stat span{
    display:block;margin-top:.45rem;font-size:.66rem;font-weight:800;
    letter-spacing:.09em;text-transform:uppercase;color:var(--body-ink);line-height:1.45;
  }
  .contrast{background:var(--navy);color:var(--paper);padding:1.3rem 1.5rem;margin:1.9rem 0;border-left:6px solid var(--orange)}
  .contrast p{margin:0;color:#CBD6E1;font-size:.95rem;line-height:1.55}
  .contrast p.contrast__line{
    font-family:var(--display);font-size:clamp(1.1rem,2.3vw,1.5rem);
    line-height:1.12;letter-spacing:-.02em;color:var(--paper);margin-bottom:.6rem;
  }
  .facts{list-style:none;padding:0;margin:1.8rem 0 2rem;display:grid;gap:.8rem}
  /* Block, not flex: an inline <strong> lead-in would otherwise become its own
     flex item and break onto a separate column. */
  .facts li{position:relative;padding-left:1.75rem;font-size:1rem;line-height:1.5;font-weight:500}
  .facts li::before{content:"";position:absolute;left:0;top:.42em;width:11px;height:11px;background:var(--gold);border:2px solid var(--navy)}
  .facts li strong{font-weight:800;color:var(--paper)}
  .sec:not(.sec--navy):not(.sec--teal) .facts li strong{color:var(--navy)}

  /* ============ SIGNUP ============ */
  .signup{background:var(--gold);border:3px solid var(--navy);box-shadow:12px 12px 0 var(--navy-ink);padding:clamp(1.8rem,4vw,3rem);color:var(--navy)}
  .signup h2{font-size:clamp(1.8rem,4vw,2.8rem);margin-bottom:.8rem}
  .signup p{margin:0 0 1.8rem;font-weight:600;max-width:48ch}
  .form-row{display:grid;grid-template-columns:1fr 1fr;gap:.85rem;margin-bottom:.85rem}
  @media (max-width:640px){.form-row{grid-template-columns:1fr}}
  .field{display:flex;flex-direction:column;gap:.35rem}
  .field label{font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
  .field input{
    font-family:var(--body);font-size:1rem;padding:.8em .9em;
    border:2.5px solid var(--navy);border-radius:2px;background:var(--paper);color:var(--navy);width:100%;
  }
  .field input::placeholder{color:#9AA3AC}
  .form-note{font-size:.78rem;line-height:1.5;margin:1.1rem 0 0;font-weight:500;opacity:.85}
  .signup .btn{width:100%;margin-top:.4rem;padding-block:1.05em;background:var(--navy);color:var(--paper)}
  .signup .btn:hover{background:var(--teal)}
  .form-ok{display:none;border:2.5px solid var(--navy);background:var(--paper);padding:1.1rem 1.2rem;font-weight:700;margin-top:1rem}
  .form-ok.is-visible{display:block}

  .join-side h2{font-size:clamp(2rem,5vw,3.4rem);margin-bottom:1.2rem}
  .ways{list-style:none;padding:0;margin:2rem 0 0;display:grid;gap:1.4rem}
  .ways > li{border-top:2px solid rgba(248,245,239,.22);padding-top:1.2rem}
  .ways h3{font-size:1.15rem;margin-bottom:.4rem}
  .ways p{margin:0 0 .7rem;font-size:.95rem;color:#CBD6E1}
  .ways a.txtlink{font-weight:800;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-bottom:2px solid var(--orange);padding-bottom:2px}
  .ways a.txtlink:hover{background:var(--orange);color:var(--navy);border-bottom-color:var(--orange)}

  /* ============ DONATE ============ */
  .donate{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem)}
  @media (max-width:900px){.donate{grid-template-columns:1fr}}
  /* The Zeffy form auto-sizes to ~1700px, so the pitch rides along with it. */
  .donate__intro{align-self:start;position:sticky;top:96px}
  @media (max-width:900px){.donate__intro{position:static}}
  .donate__intro h2{font-size:clamp(2rem,5vw,3.4rem);margin-bottom:1.1rem}
  /* No frame here on purpose: the embed renders its own white rounded card and
     resizes itself, so wrapping it in more chrome just fights the widget. */
  .donate__card{min-height:460px}
  .donate__note{
    margin:1.1rem 0 0;font-size:.78rem;line-height:1.55;color:#AEBBC8;
  }
  .donate__note a{color:var(--gold)}

  /* ============ CLOSER ============ */
  .closer{position:relative;overflow:hidden;background:var(--teal);color:#fff;border-block:3px solid var(--navy);text-align:center;padding-block:clamp(56px,8vw,96px)}
  .closer::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:repeating-conic-gradient(from 180deg at 50% 130%,
      rgba(251,190,44,.085) 0deg 3.2deg, transparent 3.2deg 9deg);
  }
  .closer > *{position:relative;z-index:1}
  .closer h2{font-size:clamp(2.2rem,7vw,5rem);margin-bottom:1.4rem;max-width:16ch;margin-inline:auto}
  .closer p{font-size:1.1rem;max-width:50ch;margin:0 auto 2.2rem;font-weight:500}
  .closer .btn{background:var(--gold);color:var(--navy);border-color:var(--navy)}
  .closer .btn:hover{background:var(--paper)}

  /* ============ FOOTER ============ */
  footer{background:var(--navy-ink);color:#9FB0C2;padding-block:clamp(40px,6vw,64px);font-size:.88rem}
  .foot-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2rem;padding-bottom:2rem;border-bottom:1px solid rgba(248,245,239,.18)}
  .foot-brand .brand__txt{color:var(--paper)}
  .foot-brand .brand__txt span:last-child{color:var(--gold)}
  .foot-brand .brand__mark{background:var(--paper)}
  .foot-brand .brand__logo{height:88px;width:88px}
  .foot-nav{display:flex;flex-wrap:wrap;gap:1.6rem;align-items:center}
  .foot-nav a{text-decoration:none;font-weight:700;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;color:#C6D2DE}
  .foot-nav a:hover{color:var(--gold)}
  .tagline{
    margin-top:1.8rem;font-family:var(--display);font-size:.9rem;letter-spacing:.1em;color:var(--paper);
    display:flex;gap:.7rem;flex-wrap:wrap;align-items:center;
  }
  .tagline i{font-style:normal;color:var(--teal);font-size:1.1em}
  .disclaimer{margin-top:1.6rem;padding:1.1rem 1.2rem;border:1px solid rgba(248,245,239,.28);font-size:.8rem;line-height:1.6;max-width:80ch}
    .disclaimer em{font-style:normal;font-weight:700;color:var(--paper)}
  .disclaimer strong{color:var(--paper);text-transform:uppercase;letter-spacing:.08em;font-size:.74rem;display:block;margin-bottom:.4rem}
  .copyright{margin-top:1.6rem;font-size:.78rem;opacity:.75}

  /* ============ INTERIOR PAGE HERO ============ */
  .phero{position:relative;overflow:hidden;background:var(--navy);color:var(--paper);border-bottom:3px solid var(--navy-ink)}
  .phero::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:repeating-conic-gradient(from 180deg at 50% 135%,
      rgba(251,190,44,.10) 0deg 3.2deg, transparent 3.2deg 9deg);
  }
  .phero__inner{position:relative;z-index:1;padding-block:clamp(48px,7vw,84px)}
  .phero h1{font-size:clamp(2.3rem,6.5vw,4.6rem);line-height:.92;letter-spacing:-.03em;margin:0 0 1rem;max-width:18ch}
  .phero h1 em{font-style:normal;color:var(--gold)}
  .phero .eyebrow{color:var(--gold)}
  .phero .eyebrow::before{background:var(--gold)}
  .phero p{font-size:clamp(1.05rem,2vw,1.3rem);line-height:1.5;max-width:56ch;color:#D5DEE8;margin:0;font-weight:500}

  /* ============ GIVE PAGES ============ */
  .give{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem)}
  @media (max-width:900px){.give{grid-template-columns:1fr}}
  .give__intro{align-self:start;position:sticky;top:96px}
  @media (max-width:900px){.give__intro{position:static}}
  .give__intro h2{font-size:clamp(1.8rem,4.2vw,2.9rem);margin-bottom:1.1rem}
  /* No frame around the embed on purpose: it renders its own white rounded
     panel and resizes itself, so extra chrome just fights the widget. */
  .give__form{min-height:320px}
  .give__note{margin:1.3rem 0 0;font-size:.78rem;line-height:1.55;color:#AEBBC8}
  .give__note a{color:var(--gold)}

  /* switch between membership and one-time */
  .switch{
    display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;
    margin:1.6rem 0 0;padding-top:1.4rem;border-top:2px solid rgba(248,245,239,.2);
  }
  .switch p{margin:0;font-size:.9rem;color:#CBD6E1;font-weight:600}
  .switch a{
    font-weight:800;font-size:.8rem;letter-spacing:.09em;text-transform:uppercase;
    text-decoration:none;border-bottom:2px solid var(--gold);padding-bottom:2px;color:var(--paper);
  }
  .switch a:hover{background:var(--gold);color:var(--navy)}

  /* ============ NEWSLETTER ============ */
  .news__form{min-height:260px;margin-top:1.4rem}
  .news h2{font-size:clamp(1.7rem,3.6vw,2.5rem);margin-bottom:.7rem}
  .news p{color:#CBD6E1;margin:0;font-size:.98rem;line-height:1.55}

  /* ============ TEASER (home -> 2026) ============ */
  .teaser{display:grid;grid-template-columns:minmax(0,280px) 1fr;gap:clamp(1.8rem,4vw,3.5rem);align-items:center}
  @media (max-width:760px){.teaser{grid-template-columns:1fr}}
  .teaser__photo{
    aspect-ratio:4/5;border:3px solid var(--navy);background:var(--paper-2);
    position:relative;overflow:hidden;box-shadow:12px 12px 0 var(--teal);
  }
  .teaser__photo img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}

  /* ============ SOCIALS ============ */
  .socials{display:flex;gap:.7rem;margin-top:1.4rem}
  .socials a{
    width:42px;height:42px;display:grid;place-items:center;flex:none;
    border:2px solid rgba(248,245,239,.35);border-radius:2px;color:var(--paper);
    transition:background .12s ease,color .12s ease,border-color .12s ease;
  }
  .socials a:hover{background:var(--gold);color:var(--navy);border-color:var(--gold)}
  .socials svg{width:20px;height:20px;fill:currentColor;display:block}

  .foot-contact{margin:1.15rem 0 0;font-size:.9rem;font-weight:700}
  .foot-contact a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(251,190,44,.45)}
  .foot-contact a:hover{border-bottom-color:var(--gold)}



  /* ============ PHONE (<=560px) ============
     Every clamp() above has a floor sized for tablet and up. On a 375px screen the
     vw term falls under that floor, so headings lock at 32-46px and read as blown up.
     These are explicit phone sizes rather than lower floors, which would go too small
     on the vw term alone. */
  @media (max-width:560px){
    .hero h1{font-size:2.15rem;letter-spacing:-.025em;max-width:none}
    .hero__lede{font-size:1.02rem;margin-bottom:1.9rem}
    .hero__inner{padding-block:52px}
    .hero__cta{gap:.7rem}
    .hero__cta .btn,.closer .btn{width:100%}

    .phero h1{font-size:1.95rem;max-width:none}
    .phero p{font-size:1rem}
    .phero__inner{padding-block:40px}

    .sec{padding-block:46px}
    .sec__head{margin-bottom:1.9rem}
    .sec__head h2,.h2-lg{font-size:1.8rem}
    .cand h2{font-size:1.95rem}
    .closer{padding-block:48px}
    .closer h2{font-size:1.95rem}
    .closer p{font-size:1rem}
    .donate__intro h2,.give__intro h2{font-size:1.7rem}
    .join-side h2,.news h2{font-size:1.65rem}
    .signup h2{font-size:1.6rem}

    .lede-lg{font-size:1.08rem}
    .pull p{font-size:1.18rem}
    .pull{padding-left:1.1rem;border-left-width:5px}
    .pillar__num{font-size:2rem}
    .pillar h3{font-size:1.15rem}

    /* stat row: three columns is too tight for currency at this width */
    .stats{grid-template-columns:1fr 1fr}
    .stat{border-right:2.5px solid var(--navy);border-bottom:2.5px solid var(--navy)}
    .stat:nth-child(2n){border-right:0}
    .stat:nth-last-child(-n+1){border-bottom:0}
    .stat:last-child{grid-column:1 / -1;border-right:0}
    .stat b{font-size:1.75rem}

    .contrast{padding:1.1rem 1.15rem}
    .cand__photo,.teaser__photo{box-shadow:8px 8px 0 var(--teal)}
    .give__note,.donate__note{font-size:.76rem}
  }

  /* ============ NARROW HEADER (<=560px) ============
     Brand + Donate + hamburger overflowed the bar at 375px (340px of content in
     335px of room). Shrink the lockup and the button rather than dropping either. */
  @media (max-width:560px){
    .brand{gap:.5rem}
    .brand__logo,.brand__mark{height:44px;width:44px}
    .brand__txt{font-size:.82rem}
    .nav{padding-block:.55rem}
    .nav__right{gap:.55rem}
    .btn--sm{padding:.62em .85em;font-size:.72rem;box-shadow:2.5px 2.5px 0 var(--navy)}
    .nav__toggle{width:40px;height:40px}
  }

  @media (max-width:380px){
    .hero h1{font-size:1.95rem}
    .brand__txt{font-size:.75rem}
    .stats{grid-template-columns:1fr}
    .stat{border-right:0}
    .stat:nth-child(2n){border-right:0}
  }