:root{
    --navy:#0A1A33;
    --navy-dark:#050D1A;
    --navy-mid:#0D2240;
    --blue:#0A3161;
    --red:#C42127;
    --red-soft:#F0C9CB;
    --brass:#C9A65C;
    --brass-line:rgba(201,166,92,.42);
    --brass-faint:rgba(201,166,92,.22);
    --bone:#F3EFE6;
    --bone-2:#E9E3D6;
    --ink:#0A1A33;
    --muted:#9DB0C6;
    --dim:#6F86A2;
    --star:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M12,1L14.47,8.6L22.46,8.6L16,13.3L18.47,20.9L12,16.2L5.53,20.9L8,13.3L1.54,8.6L9.53,8.6Z' fill='%23000'/%3E%3C/svg%3E");
    --util-h:36px;
    --bar-h:80px;
    --medal-w:132px;
    --hang:74px;
    --head-h:85px;
  }

  *{ box-sizing:border-box }
  html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--head-h) + 12px) }
  body{
    margin:0;
    background:var(--navy-dark);
    color:var(--bone);
    font-family:"Oswald","Arial Narrow",Arial,sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img{ max-width:100%; display:block }
  a{ color:inherit }
  button{ font:inherit; color:inherit; cursor:pointer }
  .skip{ position:absolute; left:-999px; top:8px; background:var(--bone); color:var(--ink); padding:8px 14px; z-index:100 }
  .skip:focus{ left:8px }
  :focus-visible{ outline:2px solid var(--brass); outline-offset:3px }

  /* ---------- shared pieces ---------- */
  .star-i{ display:inline-block; width:11px; height:11px; background:var(--brass); -webkit-mask:var(--star) center/contain no-repeat; mask:var(--star) center/contain no-repeat; flex:none }
  .stars5{ display:inline-flex; gap:8px }
  .rule{ display:flex; align-items:center; gap:14px; max-width:320px }
  .rule .line{ flex:1; height:1px; background:var(--brass-line) }
  .rule.center{ margin-left:auto; margin-right:auto }

  .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    margin:0 0 14px;
    font-size:12px; font-weight:500; letter-spacing:.3em; text-transform:uppercase;
    color:var(--brass);
  }
  .eyebrow::before{ content:""; width:28px; height:1px; background:var(--brass) }
  h2{
    margin:0 0 14px;
    font-size:clamp(30px,4.2vw,48px);
    font-weight:600; line-height:1.05; letter-spacing:.02em; text-transform:uppercase;
  }
  .lede{
    margin:0;
    font-family:"Source Serif 4",Georgia,serif;
    font-size:clamp(17px,1.6vw,20px); line-height:1.6;
    color:#D9DEE6; max-width:36em;
  }
  .wrap{ width:100%; max-width:1200px; margin:0 auto; padding:0 28px; position:relative; z-index:1 }
  section{ position:relative }

  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    min-height:48px; padding:0 24px;
    border:1px solid transparent;
    font-size:14px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; text-decoration:none;
    transition:background .2s, color .2s, border-color .2s, transform .2s;
  }
  .btn:hover{ transform:translateY(-2px) }
  .btn-red{ background:var(--red); color:#fff }
  .btn-red:hover{ background:#D72A31 }
  .btn-ghost{ border-color:var(--brass-line); color:var(--bone) }
  .btn-ghost:hover{ border-color:var(--brass); background:rgba(201,166,92,.1) }
  .btn-navy{ background:var(--navy); color:var(--bone) }
  .btn-navy:hover{ background:var(--blue) }
  .btn .arrow{ transition:transform .2s }
  .btn:hover .arrow{ transform:translateX(4px) }

  /* ---------- flag ribbon ---------- */
  .ribbon{ display:flex; height:8px }
  .ribbon span{ flex:1 }
  .ribbon span:nth-child(1),.ribbon span:nth-child(7){ background:var(--red) }
  .ribbon span:nth-child(2),.ribbon span:nth-child(6){ background:var(--bone) }
  .ribbon span:nth-child(3),.ribbon span:nth-child(5){ background:var(--blue) }
  .ribbon span:nth-child(4){ background:var(--brass) }

  /* ---------- header: Medal Hang ---------- */
  .site-head{ position:sticky; top:calc(var(--util-h) * -1); z-index:50 }
  .util{ height:var(--util-h); background:var(--navy-dark); border-bottom:1px solid var(--brass-faint) }
  .util-in{ display:flex; align-items:center; justify-content:space-between; gap:14px; height:100% }
  .u-l{ display:flex; align-items:center; gap:8px; font-size:11.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--muted) }
  .u-r{ display:flex; align-items:center; gap:18px }
  .u-mail{ font-size:12px; letter-spacing:.14em; color:var(--muted); text-decoration:none }
  .u-mail:hover{ color:var(--bone) }
  .u-help{ display:inline-flex; align-items:center; height:24px; padding:0 12px; background:var(--red); color:#fff; font-size:11.5px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; text-decoration:none; transition:background .2s }
  .u-help:hover{ background:#D72A31 }

  .bar{ position:relative; background:var(--bone); color:var(--navy); box-shadow:0 12px 30px -14px rgba(0,0,0,.7) }
  .bar-in{ display:flex; align-items:center; gap:14px; height:var(--bar-h); position:static; z-index:auto }
  .util-in{ position:static; z-index:auto }
  .bar-line{
    position:relative; z-index:1; height:5px;
    background:linear-gradient(90deg, var(--red) 0 33%, var(--bone) 33% 34%, var(--blue) 34% 66%, var(--bone) 66% 67%, var(--red) 67%);
  }

  /* the medal: strap + shield hanging in FRONT of the red/blue line */
  .medal{ position:relative; z-index:5; align-self:flex-start; flex:none; width:var(--medal-w); height:var(--bar-h); transition:width .35s ease }
  .medal .strap{
    position:absolute; left:50%; top:0; width:calc(var(--medal-w) * .42); height:22px; transform:translateX(-50%);
    background:repeating-linear-gradient(90deg, var(--red) 0 8px, var(--bone) 8px 12px, var(--blue) 12px 20px);
    transition:width .35s ease, height .35s ease;
  }
  .medal img{
    position:absolute; left:50%; top:14px; width:calc(var(--medal-w) * .8); height:auto; transform:translateX(-50%);
    filter:drop-shadow(0 10px 16px rgba(0,0,0,.45));
    transform-origin:50% 0; transition:width .35s ease, top .35s ease, transform .35s ease;
  }
  .medal:hover img{ transform:translateX(-50%) rotate(-4deg) }

  .name{ text-decoration:none; line-height:1.05; flex:none }
  .name b{ display:block; font-size:25px; font-weight:700; letter-spacing:.14em; color:var(--navy) }
  .name small{ display:block; margin-top:3px; font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--red) }

  .nav{ margin-left:auto; display:flex; align-items:center; gap:2px }
  .nav a{
    position:relative; padding:12px 12px;
    font-size:14px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; text-decoration:none; white-space:nowrap;
    color:var(--navy); transition:color .2s;
  }
  .nav a::before{
    content:""; position:absolute; left:50%; top:0; width:9px; height:9px; margin-left:-4.5px;
    background:var(--red); -webkit-mask:var(--star) center/contain no-repeat; mask:var(--star) center/contain no-repeat;
    transform:scale(0); transition:transform .25s;
  }
  .nav a:hover::before,.nav a.active::before{ transform:scale(1) }
  .nav a:hover,.nav a.active{ color:var(--red) }
  .nav .m-only{ display:none }

  .menu-btn{
    display:none; margin-left:auto; height:44px; padding:0 14px; gap:10px; align-items:center;
    border:1.5px solid var(--navy); background:transparent; color:var(--navy);
    font-size:13px; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  }
  .menu-btn i{ position:relative; display:block; width:18px; height:12px }
  .menu-btn i::before,.menu-btn i::after,.menu-btn i span{ content:""; position:absolute; left:0; width:18px; height:2px; background:var(--navy); transition:transform .25s, opacity .25s, top .25s }
  .menu-btn i::before{ top:0 } .menu-btn i span{ top:5px } .menu-btn i::after{ top:10px }
  .menu-btn[aria-expanded="true"] i::before{ top:5px; transform:rotate(45deg) }
  .menu-btn[aria-expanded="true"] i span{ opacity:0 }
  .menu-btn[aria-expanded="true"] i::after{ top:5px; transform:rotate(-45deg) }

  /* shrink the medal once the page scrolls */
  .site-head.scrolled{ --medal-w:74px }
  .site-head.scrolled .medal img{ top:8px }
  .site-head.scrolled .medal .strap{ height:12px }

  /* give the first section room for the hanging medal */
  main > section:first-child{ padding-top:calc(var(--hang) + 28px) !important }

  /* ---------- hero ---------- */
  .hero{
    overflow:hidden;
    background:
      radial-gradient(60% 55% at 30% 40%, rgba(30,68,116,.45), rgba(5,13,26,0) 75%),
      linear-gradient(180deg, var(--navy) 0%, var(--navy-dark) 75%, #03080F 100%);
    padding:clamp(40px,6vh,72px) 0 0;
  }
  .stars-bg{
    position:absolute; inset:0; pointer-events:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cpath d='M30,19L32.47,26.6L40.46,26.6L34,31.3L36.47,38.9L30,34.2L23.53,38.9L26,31.3L19.54,26.6L27.53,26.6Z' fill='%23ffffff'/%3E%3Cpath d='M90,79L92.47,86.6L100.46,86.6L94,91.3L96.47,98.9L90,94.2L83.53,98.9L86,91.3L79.54,86.6L87.53,86.6Z' fill='%23ffffff'/%3E%3C/svg%3E");
    background-size:104px 104px; opacity:.05;
  }
  .stripes{
    position:absolute; left:0; right:0; bottom:0; height:62%;
    pointer-events:none;
    background:repeating-linear-gradient(180deg, rgba(196,33,39,.16) 0 22px, rgba(243,239,230,.035) 22px 44px);
    -webkit-mask:linear-gradient(0deg, #000 0%, rgba(0,0,0,.35) 45%, transparent 100%);
    mask:linear-gradient(0deg, #000 0%, rgba(0,0,0,.35) 45%, transparent 100%);
    transform-origin:bottom;
    animation:rise 1.6s cubic-bezier(.2,.7,.2,1) both;
  }
  @keyframes rise{ from{ transform:scaleY(0); opacity:0 } to{ transform:scaleY(1); opacity:1 } }
  .twinkle{ position:absolute; inset:0; pointer-events:none }
  .twinkle i{
    position:absolute; width:9px; height:9px; background:var(--bone);
    -webkit-mask:var(--star) center/contain no-repeat; mask:var(--star) center/contain no-repeat;
    opacity:0; animation:tw 5s ease-in-out infinite;
  }
  @keyframes tw{ 0%,100%{ opacity:0; transform:scale(.6) } 50%{ opacity:.55; transform:scale(1) } }

  .hero-grid{
    display:grid; grid-template-columns:auto 1fr; align-items:center;
    gap:clamp(32px,5vw,72px);
    padding-bottom:clamp(36px,5vh,56px);
  }
  .hero-logo{
    padding-right:clamp(32px,5vw,72px);
    border-right:1px solid rgba(201,166,92,.28);
  }
  .hero-logo img{
    height:clamp(300px,52vh,470px); width:auto;
    filter:
      drop-shadow(0 0 1px rgba(226,236,248,.9))
      drop-shadow(0 0 10px rgba(190,214,240,.28))
      drop-shadow(0 14px 34px rgba(0,0,0,.65));
    animation:fadeUp 1s .1s both;
  }
  .hero-copy > *{ animation:fadeUp .9s both }
  .hero-copy > *:nth-child(2){ animation-delay:.12s }
  .hero-copy > *:nth-child(3){ animation-delay:.22s }
  .hero-copy > *:nth-child(4){ animation-delay:.32s }
  .hero-copy > *:nth-child(5){ animation-delay:.42s }
  .hero-copy > *:nth-child(6){ animation-delay:.52s }
  @keyframes fadeUp{ from{ opacity:0; transform:translateY(18px) } to{ opacity:1; transform:none } }
  .badge{
    display:inline-flex; align-items:center; gap:9px; margin:0 0 22px;
    padding:8px 16px; border:1px solid rgba(196,33,39,.55); background:rgba(196,33,39,.14);
    font-size:12px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--red-soft);
  }
  .badge .star-i{ background:var(--red); width:10px; height:10px }
  .hero h1{
    margin:0 0 18px;
    font-size:clamp(40px,6vw,76px); font-weight:700; line-height:.98; letter-spacing:.01em; text-transform:uppercase;
  }
  .hero h1 em{ font-style:normal; color:var(--brass) }
  .hero .rule{ margin:0 0 20px }
  .hero .lede{ margin-bottom:28px; font-size:clamp(18px,1.7vw,22px); color:#F7F4EC }
  .cta-row{ display:flex; flex-wrap:wrap; gap:12px }

  .branch-band{
    position:relative; z-index:1;
    border-top:1px solid var(--brass-faint);
    background:rgba(3,8,15,.55);
  }
  .branch-in{ display:flex; align-items:center; gap:24px; min-height:64px; padding:12px 28px }
  .branch-in .label{ flex:none; font-size:11px; font-weight:500; letter-spacing:.3em; text-transform:uppercase; color:var(--brass) }
  .branches{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; flex:1; justify-content:space-between; gap:6px 0 }
  .branches li{
    flex:1; text-align:center; white-space:nowrap;
    font-size:13px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
    border-left:1px solid var(--brass-line); padding:2px 10px;
    transition:color .2s;
  }
  .branches li:first-child{ border-left:0 }
  .branches li:hover{ color:var(--bone) }

  /* ---------- who we serve ---------- */
  .serve{ background:var(--navy-mid); padding:clamp(56px,8vw,88px) 0 }
  .serve-head{ display:grid; grid-template-columns:1fr 1fr; gap:24px 48px; align-items:end; margin-bottom:36px }
  .serve-head .lede{ justify-self:end }
  .aud{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px }
  .aud-card{
    position:relative; overflow:hidden;
    padding:26px 20px 24px;
    background:linear-gradient(180deg, rgba(10,49,97,.55), rgba(5,13,26,.6));
    border:1px solid var(--brass-faint);
    transition:transform .3s, border-color .3s;
  }
  .aud-card::before{ content:""; position:absolute; left:0; right:0; top:0; height:3px; background:var(--red); transform:scaleX(0); transform-origin:left; transition:transform .35s }
  .aud-card:hover{ transform:translateY(-4px); border-color:var(--brass-line) }
  .aud-card:hover::before{ transform:scaleX(1) }
  .aud-num{ font-size:12px; letter-spacing:.24em; color:var(--brass); margin-bottom:22px; display:flex; align-items:center; gap:8px }
  .aud-card h3{ margin:0 0 8px; font-size:22px; font-weight:600; letter-spacing:.08em; text-transform:uppercase }
  .aud-card p{ margin:0; font-family:"Source Serif 4",Georgia,serif; font-size:15.5px; line-height:1.5; color:#C3CDDA }
  .area-note{
    margin-top:18px; display:flex; align-items:center; gap:12px; flex-wrap:wrap;
    font-size:13px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted);
  }
  .area-note b{ color:var(--bone); font-weight:500 }

  /* ---------- resources ---------- */
  .resources{
    padding:clamp(56px,8vw,96px) 0;
    background:
      radial-gradient(50% 60% at 85% 10%, rgba(30,68,116,.35), rgba(5,13,26,0) 70%),
      var(--navy-dark);
  }
  .res-head{ display:grid; grid-template-columns:1.1fr 1fr; gap:24px 48px; align-items:end; margin-bottom:34px }
  .res-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px }
  .res{
    position:relative; text-align:left; width:100%; cursor:pointer;
    display:flex; flex-direction:column;
    min-height:196px; padding:22px 20px 20px;
    background:rgba(13,34,64,.7); border:1px solid var(--brass-faint);
    transition:background .3s, border-color .3s, transform .3s;
  }
  .res:hover{ border-color:var(--brass-line); transform:translateY(-3px) }
  .res-top{ display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:auto }
  .res-ico{ width:46px; height:46px; color:var(--brass) }
  .res-ico svg{ width:100%; height:100%; stroke:currentColor; fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round }
  .res-toggle{
    width:34px; height:34px; border:1px solid var(--brass-line); background:transparent;
    display:flex; align-items:center; justify-content:center; flex:none;
    transition:transform .3s, background .3s;
  }
  .res-toggle::before,.res-toggle::after{ content:""; position:absolute; width:12px; height:1.5px; background:var(--bone) }
  .res-toggle::after{ transform:rotate(90deg); transition:transform .3s }
  .res-toggle{ position:relative }
  .res h3{ margin:22px 0 6px; font-size:21px; font-weight:600; letter-spacing:.08em; text-transform:uppercase }
  .res .short{ margin:0; font-family:"Source Serif 4",Georgia,serif; font-size:15.5px; line-height:1.5; color:#C3CDDA }
  .res .more{
    display:grid; grid-template-rows:0fr; transition:grid-template-rows .35s ease;
  }
  .res .more > span{ overflow:hidden; display:block; min-height:0 }
  .res .more p{ margin:14px 0 14px; font-family:"Source Serif 4",Georgia,serif; font-size:15px; line-height:1.5; color:var(--bone) }
  .ask-link{
    display:inline-flex; align-items:center; gap:8px; padding:0; border:0; background:none;
    font-size:13px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--brass);
  }
  .ask-link:hover{ color:#E2C27A }
  .res.open{ background:linear-gradient(180deg, var(--blue), rgba(13,34,64,.9)); border-color:var(--brass) }
  .res.open .more{ grid-template-rows:1fr }
  .res.open .res-toggle{ background:var(--red); border-color:var(--red) }
  .res.open .res-toggle::after{ transform:rotate(0) }
  .res.soon{ border-style:dashed; background:rgba(5,13,26,.6) }
  .res.soon .res-ico{ color:var(--dim) }
  .soon-tag{
    font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
    padding:5px 10px; border:1px solid rgba(196,33,39,.55); background:rgba(196,33,39,.14); color:var(--red-soft);
  }

  /* how it works strip */
  .steps{
    margin-top:22px;
    display:grid; grid-template-columns:repeat(3,1fr);
    border:1px solid var(--brass-faint); background:rgba(3,8,15,.5);
  }
  .step{ display:flex; align-items:center; gap:16px; padding:20px 22px; border-left:1px solid var(--brass-faint) }
  .step:first-child{ border-left:0 }
  .step-n{
    flex:none; width:44px; height:44px; display:flex; align-items:center; justify-content:center;
    border:1px solid var(--brass); color:var(--brass); font-size:18px; font-weight:600;
  }
  .step b{ display:block; font-size:16px; font-weight:600; letter-spacing:.1em; text-transform:uppercase }
  .step div span{ display:block; font-family:"Source Serif 4",Georgia,serif; font-size:14.5px; color:var(--muted); margin-top:2px }

  /* ---------- mission (bone plaque) ---------- */
  .mission{
    background:var(--bone); color:var(--ink);
    padding:clamp(56px,8vw,96px) 0;
    overflow:hidden;
  }
  .mission::before{
    content:""; position:absolute; inset:0; pointer-events:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cpath d='M30,19L32.47,26.6L40.46,26.6L34,31.3L36.47,38.9L30,34.2L23.53,38.9L26,31.3L19.54,26.6L27.53,26.6Z' fill='%230A3161'/%3E%3Cpath d='M90,79L92.47,86.6L100.46,86.6L94,91.3L96.47,98.9L90,94.2L83.53,98.9L86,91.3L79.54,86.6L87.53,86.6Z' fill='%230A3161'/%3E%3C/svg%3E");
    background-size:104px 104px; opacity:.05;
  }
  .plaque{
    position:relative; max-width:1000px; margin:0 auto;
    padding:clamp(34px,5vw,60px) clamp(24px,6vw,72px);
    border:1px solid rgba(10,26,51,.25);
    background:linear-gradient(180deg,#FBF9F4,#F1ECE1);
    box-shadow:0 30px 60px -30px rgba(10,26,51,.35);
    text-align:center;
  }
  .plaque::before{ content:""; position:absolute; inset:8px; border:1px solid rgba(201,166,92,.55); pointer-events:none }
  .corner{ position:absolute; width:22px; height:22px; border-color:var(--brass); border-style:solid }
  .corner.tl{ top:-1px; left:-1px; border-width:3px 0 0 3px }
  .corner.tr{ top:-1px; right:-1px; border-width:3px 3px 0 0 }
  .corner.bl{ bottom:-1px; left:-1px; border-width:0 0 3px 3px }
  .corner.br{ bottom:-1px; right:-1px; border-width:0 3px 3px 0 }
  .mission .eyebrow{ color:#9A7A35 }
  .mission .eyebrow::before{ background:#9A7A35 }
  .mission .eyebrow::after{ content:""; width:28px; height:1px; background:#9A7A35 }
  .mission h2{ color:var(--ink) }
  .mission .rule{ margin:6px auto 26px }
  .mission blockquote{
    margin:0; font-family:"Source Serif 4",Georgia,serif;
    font-size:clamp(18px,2vw,23px); line-height:1.65; color:#1B2A44;
  }
  .mission blockquote strong{ color:var(--red); font-weight:600 }
  .pillars{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:28px }
  .pillars span{
    padding:8px 16px; border:1px solid rgba(10,26,51,.2);
    font-size:13px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--blue);
    background:rgba(255,255,255,.55);
  }

  /* ---------- partners ---------- */
  .partners{ background:var(--bone-2); color:var(--ink); padding:clamp(56px,8vw,88px) 0; border-top:1px solid rgba(10,26,51,.1) }
  .partners .eyebrow{ color:#9A7A35 }
  .partners .eyebrow::before{ background:#9A7A35 }
  .partners .lede{ color:#33445E }
  .p-head{ display:grid; grid-template-columns:1fr 1fr; gap:24px 48px; align-items:end; margin-bottom:34px }
  .p-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px }
  .p-card{
    position:relative; display:flex; flex-direction:column;
    background:#fff; border:1px solid rgba(10,26,51,.14);
    text-decoration:none; color:var(--ink);
    transition:transform .3s, box-shadow .3s, border-color .3s;
  }
  a.p-card:hover{ transform:translateY(-5px); box-shadow:0 22px 40px -22px rgba(10,26,51,.5); border-color:var(--blue) }
  .p-logo{ height:190px; display:flex; align-items:center; justify-content:center; padding:24px; border-bottom:1px solid rgba(10,26,51,.1) }
  .p-logo img{ max-height:142px; width:auto; object-fit:contain; transition:transform .35s }
  a.p-card:hover .p-logo img{ transform:scale(1.05) }
  .p-logo.small img{ width:200px; max-width:85% }
  .p-body{ padding:18px 20px 20px; display:flex; flex-direction:column; flex:1 }
  .p-body h3{ margin:0 0 6px; font-size:19px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; line-height:1.15 }
  .p-body p{ margin:0 0 16px; font-family:"Source Serif 4",Georgia,serif; font-size:15px; line-height:1.45; color:#4A5A72 }
  .p-link{ margin-top:auto; display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--red) }
  .p-link.none{ color:#8A97AA }
  .p-card::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:var(--blue); transform:scaleX(0); transform-origin:left; transition:transform .35s }
  a.p-card:hover::after{ transform:scaleX(1) }

  /* ---------- stay connected ---------- */
  .connect{ background:var(--navy); padding:clamp(56px,8vw,88px) 0; overflow:hidden }
  .c-head{ text-align:center; margin-bottom:36px }
  .c-head .eyebrow::after{ content:""; width:28px; height:1px; background:var(--brass) }
  .c-head .lede{ margin:0 auto }
  .c-grid{ display:grid; grid-template-columns:1.15fr 1fr 1fr; gap:16px }
  .panel{
    position:relative; display:flex; flex-direction:column;
    padding:26px 24px; background:rgba(5,13,26,.6); border:1px solid var(--brass-faint);
  }
  .panel-title{ display:flex; align-items:center; gap:12px; margin-bottom:18px }
  .panel-title .res-ico{ width:36px; height:36px }
  .panel h3{ margin:0; font-size:22px; font-weight:600; letter-spacing:.08em; text-transform:uppercase }
  .empty{
    flex:1; display:flex; flex-direction:column; justify-content:center;
    padding:20px; border:1px dashed var(--brass-line); background:rgba(10,49,97,.18);
  }
  .empty .cal{ display:flex; gap:12px; align-items:center; margin-bottom:12px }
  .cal-box{ width:58px; flex:none; text-align:center; border:1px solid var(--brass-line) }
  .cal-box small{ display:block; background:var(--red); font-size:11px; letter-spacing:.18em; padding:3px 0 }
  .cal-box b{ display:block; font-size:24px; padding:4px 0; color:var(--muted) }
  .empty p{ margin:0; font-family:"Source Serif 4",Georgia,serif; font-size:15.5px; line-height:1.5; color:#C3CDDA }
  .empty p b{ font-family:"Oswald",sans-serif; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:var(--bone); font-size:15px }
  .doc-list{ list-style:none; margin:0 0 14px; padding:0; display:grid; gap:8px }
  .doc-list li{
    display:flex; align-items:center; gap:12px; padding:12px 14px;
    border:1px dashed var(--brass-line); background:rgba(10,49,97,.18);
    font-size:14px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted);
  }
  .doc-list li svg{ width:20px; height:20px; stroke:var(--brass); fill:none; stroke-width:1.6; flex:none }
  .doc-list li em{ margin-left:auto; font-style:normal; font-size:11px; letter-spacing:.18em; color:var(--red-soft) }
  .panel .note{ margin:0; font-family:"Source Serif 4",Georgia,serif; font-size:15px; line-height:1.5; color:#C3CDDA }
  .panel.news{ background:linear-gradient(160deg, var(--blue), #071A36); border-color:var(--brass-line) }
  .panel.news .note{ margin-bottom:20px; color:var(--bone) }
  .panel.news .btn{ margin-top:auto }

  /* ---------- get involved ---------- */
  .involved{ background:var(--navy-dark); padding:clamp(56px,8vw,88px) 0 }
  .i-head{ display:grid; grid-template-columns:1fr 1fr; gap:24px 48px; align-items:end; margin-bottom:34px }
  .i-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px }
  .i-card{
    position:relative; overflow:hidden;
    padding:30px 26px 26px; display:flex; flex-direction:column;
    border:1px solid var(--brass-faint);
    background:rgba(13,34,64,.6);
  }
  .i-card .big{
    position:absolute; right:-14px; top:-26px; font-size:120px; font-weight:700; line-height:1;
    color:rgba(201,166,92,.07); pointer-events:none;
  }
  .i-card h3{ margin:0 0 10px; font-size:26px; font-weight:600; letter-spacing:.08em; text-transform:uppercase }
  .i-card p{ margin:0 0 22px; font-family:"Source Serif 4",Georgia,serif; font-size:16px; line-height:1.55; color:#C3CDDA }
  .i-card .btn{ margin-top:auto; align-self:flex-start }
  .i-card.donate{ background:linear-gradient(160deg, #7E1418, #3A0A0D); border-color:rgba(196,33,39,.6) }
  .i-card.donate p{ color:#F3DADB }
  .i-card.donate .btn{ background:var(--bone); color:var(--ink) }
  .i-card.donate .big{ color:rgba(255,255,255,.07) }

  /* ---------- contact ---------- */
  .contact{
    padding:clamp(56px,8vw,96px) 0;
    background:
      radial-gradient(55% 60% at 15% 20%, rgba(30,68,116,.4), rgba(5,13,26,0) 70%),
      linear-gradient(180deg, var(--navy) 0%, var(--navy-dark) 100%);
    overflow:hidden;
  }
  .contact .stripes{ height:40%; animation:none; opacity:.6 }
  .ct-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(28px,4vw,56px); align-items:start }
  .ct-info .lede{ margin-bottom:26px }
  .ct-email{
    display:flex; align-items:center; gap:14px; flex-wrap:wrap;
    padding:18px 20px; border:1px solid var(--brass-line); background:rgba(5,13,26,.55); margin-bottom:14px;
  }
  .ct-email .k{ font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--brass); width:100% }
  .ct-email a{ font-size:clamp(22px,2.4vw,28px); font-weight:500; letter-spacing:.04em; text-decoration:none }
  .ct-email a:hover{ color:var(--brass) }
  .copy-btn{
    margin-left:auto; padding:8px 14px; border:1px solid var(--brass-line); background:transparent;
    font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--bone);
  }
  .copy-btn:hover{ border-color:var(--brass) }
  .ct-area{ display:flex; align-items:center; gap:10px; font-size:13px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted) }

  .composer{
    position:relative;
    padding:clamp(22px,3vw,34px);
    background:var(--bone); color:var(--ink);
    box-shadow:0 30px 60px -28px rgba(0,0,0,.7);
  }
  .composer::before{ content:""; position:absolute; inset:7px; border:1px solid rgba(201,166,92,.55); pointer-events:none }
  .composer h3{ margin:0 0 4px; font-size:24px; font-weight:600; letter-spacing:.08em; text-transform:uppercase }
  .composer > p{ margin:0 0 20px; font-family:"Source Serif 4",Georgia,serif; font-size:15.5px; color:#4A5A72 }
  .q{ margin:0 0 18px; border:0; padding:0; min-width:0 }
  .q legend{ padding:0; margin-bottom:10px; display:flex; align-items:center; gap:10px; font-size:13px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--blue) }
  .q legend i{ font-style:normal; width:24px; height:24px; display:inline-flex; align-items:center; justify-content:center; background:var(--navy); color:var(--bone); font-size:12px; letter-spacing:0 }
  .chips{ display:flex; flex-wrap:wrap; gap:8px }
  .chip{ position:relative }
  .chip input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer }
  .chip span{
    display:inline-flex; align-items:center; gap:7px;
    min-height:40px; padding:0 14px;
    border:1px solid rgba(10,26,51,.25); background:#fff;
    font-size:13.5px; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:#2A3A55;
    transition:background .15s, color .15s, border-color .15s;
  }
  .chip input:hover + span{ border-color:var(--blue) }
  .chip input:focus-visible + span{ outline:2px solid var(--brass); outline-offset:2px }
  .chip input:checked + span{ background:var(--navy); color:var(--bone); border-color:var(--navy) }
  .chip input:checked + span::before{ content:""; width:9px; height:9px; background:var(--brass); -webkit-mask:var(--star) center/contain no-repeat; mask:var(--star) center/contain no-repeat }
  .preview{
    margin:4px 0 18px; padding:14px 16px;
    border-left:3px solid var(--red); background:#fff;
    font-family:"Source Serif 4",Georgia,serif; font-size:15px; line-height:1.5; color:#33445E;
  }
  .preview b{ font-family:"Oswald",sans-serif; font-weight:500; letter-spacing:.14em; text-transform:uppercase; font-size:12px; color:var(--red); display:block; margin-bottom:4px }
  .composer .btn{ width:100% }
  .composer small{ display:block; margin-top:10px; font-family:"Source Serif 4",Georgia,serif; font-size:13.5px; color:#5D6B80; text-align:center }

  /* ---------- footer ---------- */
  .site-foot{ background:#03080F; border-top:1px solid var(--brass-faint) }
  .foot-in{ display:grid; grid-template-columns:auto 1fr auto; gap:32px; align-items:center; padding:36px 28px }
  .foot-brand{ display:flex; align-items:center; gap:14px }
  .foot-brand img{ height:64px; width:auto; filter:drop-shadow(0 0 1px rgba(226,236,248,.7)) }
  .foot-brand b{ display:block; font-size:17px; font-weight:600; letter-spacing:.12em; text-transform:uppercase }
  .foot-brand small{ display:block; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--brass); margin-top:3px }
  .foot-nav{ display:flex; flex-wrap:wrap; justify-content:center; gap:4px 18px }
  .foot-nav a{ font-size:12.5px; letter-spacing:.18em; text-transform:uppercase; text-decoration:none; color:var(--muted) }
  .foot-nav a:hover{ color:var(--bone) }
  .foot-mail{ font-size:15px; letter-spacing:.06em; color:var(--bone); text-decoration:none }
  .foot-mail:hover{ color:var(--brass) }
  .foot-base{
    border-top:1px solid rgba(201,166,92,.14);
    padding:16px 28px; display:flex; justify-content:center; align-items:center; gap:12px; flex-wrap:wrap;
    font-size:11.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--dim); text-align:center;
  }

  /* toast */
  .toast{
    position:fixed; left:50%; bottom:22px; transform:translate(-50%,30px); opacity:0; z-index:80;
    padding:12px 20px; background:var(--bone); color:var(--ink);
    font-size:13px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
    box-shadow:0 12px 30px rgba(0,0,0,.4); transition:opacity .25s, transform .25s; pointer-events:none;
  }
  .toast.show{ opacity:1; transform:translate(-50%,0) }

  /* scroll reveal */
  .reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s ease }
  .reveal.in{ opacity:1; transform:none }

  /* ================= TABLET ================= */
  @media (max-width:1080px){
    .nav a{ padding:12px 8px; letter-spacing:.12em; font-size:13px }
    .name b{ font-size:21px } .name small{ font-size:9.5px; letter-spacing:.16em }
    .res-grid{ grid-template-columns:repeat(2,1fr) }
    .aud{ grid-template-columns:repeat(6,1fr) }
    .aud-card{ grid-column:span 2 }
    .aud-card:nth-child(4),.aud-card:nth-child(5){ grid-column:span 3 }
    .p-grid{ grid-template-columns:repeat(2,1fr) }
    .c-grid{ grid-template-columns:1fr 1fr }
    .panel.news{ grid-column:span 2 }
    .branches li{ font-size:12px; letter-spacing:.12em }
  }
  @media (max-width:940px){
    :root{ --bar-h:70px; --medal-w:100px; --hang:52px; --head-h:75px }
    .site-head.scrolled{ --medal-w:66px }
    .u-mail{ display:none }
    .name b{ font-size:21px } .name small{ font-size:9.5px; letter-spacing:.16em }
    .menu-btn{ display:inline-flex }
    .nav{
      position:fixed; inset:0; z-index:-1;
      flex-direction:column; align-items:stretch; gap:0;
      padding:calc(var(--util-h) + var(--bar-h) + var(--hang) + 10px) 24px 32px;
      background:var(--navy-dark);
      transform:translateY(-12px); opacity:0; visibility:hidden; transition:transform .3s, opacity .3s, visibility .3s;
      overflow-y:auto;
    }
    .nav.open{ transform:none; opacity:1; visibility:visible }
    .nav a{ padding:17px 4px; font-size:17px; color:var(--bone); border-bottom:1px solid var(--brass-faint) }
    .nav a::before{ display:none }
    .nav a:hover,.nav a.active{ color:var(--brass) }
    .nav .m-only{ display:block }
    .nav a.m-help{ margin-top:22px; border:0; background:var(--red); color:#fff; text-align:center; padding:16px; letter-spacing:.2em }
    .nav a.m-mail{ border:0; text-align:center; font-size:15px; color:var(--muted); letter-spacing:.1em; text-transform:none }
    .hero-grid{ grid-template-columns:1fr; justify-items:center; text-align:center; gap:28px }
    .hero-logo{ padding:0 0 28px; border-right:0; border-bottom:1px solid rgba(201,166,92,.28); width:100%; display:flex; justify-content:center }
    .hero-logo img{ height:clamp(220px,34vh,320px) }
    .hero .rule{ margin:0 auto 20px }
    .hero .lede{ margin-left:auto; margin-right:auto }
    .cta-row{ justify-content:center }
    .branch-in{ flex-direction:column; gap:10px; padding:16px 20px }
    .branches{ width:100% }
    .serve-head,.res-head,.p-head,.i-head{ grid-template-columns:1fr }
    .serve-head .lede{ justify-self:start }
    .ct-grid{ grid-template-columns:1fr }
    .i-grid{ grid-template-columns:1fr 1fr }
    .i-card.donate{ grid-column:span 2; order:-1 }
    .steps{ grid-template-columns:1fr }
    .step{ border-left:0; border-top:1px solid var(--brass-faint) }
    .step:first-child{ border-top:0 }
    .foot-in{ grid-template-columns:1fr; justify-items:center; text-align:center }
  }

  /* ================= PHONE ================= */
  @media (max-width:600px){
    :root{ --util-h:32px; --bar-h:62px; --medal-w:80px; --hang:40px; --head-h:67px }
    .site-head.scrolled{ --medal-w:58px }
    .wrap{ padding:0 16px }
    .u-l{ font-size:10px; letter-spacing:.16em }
    .u-help{ font-size:10px; letter-spacing:.14em; padding:0 9px; height:22px }
    .bar-in{ gap:8px }
    .name b{ font-size:17px; letter-spacing:.12em } .name small{ font-size:7.8px; letter-spacing:.1em }
    .menu-btn{ padding:0 10px; height:40px } .menu-btn .lbl{ display:none }
    .hero-logo{ padding-bottom:22px }
    .hero-logo img{ height:210px }
    .badge{ font-size:10.5px; letter-spacing:.16em; padding:7px 13px; margin-bottom:16px }
    .cta-row{ flex-direction:column; width:100% }
    .cta-row .btn{ width:100% }
    .branches{ display:grid; grid-template-columns:repeat(3,1fr); row-gap:8px }
    .branches li{ font-size:11px; letter-spacing:.1em; padding:2px 4px }
    .branches li:nth-child(4){ border-left:0 }
    .aud{ grid-template-columns:1fr 1fr; gap:10px }
    .aud-card,.aud-card:nth-child(4){ grid-column:span 1 }
    .aud-card:nth-child(5){ grid-column:span 2 }
    .aud-card{ padding:18px 16px }
    .aud-num{ margin-bottom:12px }
    .aud-card h3{ font-size:18px }
    .aud-card p{ font-size:14.5px }
    .res-grid{ grid-template-columns:1fr; gap:10px }
    .res{ min-height:0; padding:16px }
    .res-top{ margin-bottom:0; align-items:center }
    .res-ico{ width:38px; height:38px }
    .res-head-row{ display:flex; align-items:center; gap:14px }
    .res h3{ margin:14px 0 4px; font-size:19px }
    .p-grid{ grid-template-columns:1fr 1fr; gap:10px }
    .p-logo{ height:130px; padding:14px }
    .p-logo img{ max-height:100px }
    .p-body{ padding:14px }
    .p-body h3{ font-size:15px }
    .p-body p{ font-size:13.5px; margin-bottom:12px }
    .p-link{ font-size:11.5px; letter-spacing:.12em }
    .c-grid,.i-grid{ grid-template-columns:1fr }
    .panel.news,.i-card.donate{ grid-column:auto }
    .i-card .big{ font-size:96px }
    .ct-email a{ font-size:21px }
    .copy-btn{ margin-left:0 }
    .chip span{ font-size:12.5px; padding:0 12px; min-height:42px }
    .foot-base{ letter-spacing:.14em }
  }


  /* ================= MULTI-PAGE ADDITIONS ================= */
  .page-head{
    position:relative; overflow:hidden;
    padding:clamp(40px,6vw,72px) 0 clamp(34px,5vw,56px);
    background:
      radial-gradient(55% 80% at 80% 20%, rgba(30,68,116,.45), rgba(5,13,26,0) 75%),
      linear-gradient(180deg, var(--navy) 0%, var(--navy-dark) 100%);
    border-bottom:1px solid var(--brass-faint);
  }
  .page-head .stripes{ height:70%; opacity:.7 }
  .ph-grid{ display:grid; grid-template-columns:1fr; gap:28px; align-items:end }
  .crumbs{ display:flex; align-items:center; gap:10px; margin:0 0 18px; font-size:12px; letter-spacing:.24em; text-transform:uppercase; color:var(--muted) }
  .crumbs a{ text-decoration:none; color:var(--muted) }
  .crumbs a:hover{ color:var(--bone) }
  .crumbs .star-i{ width:8px; height:8px }
  .crumbs b{ color:var(--brass); font-weight:500 }
  .page-head h1{
    margin:0 0 16px; font-size:clamp(38px,5.6vw,68px); font-weight:700; line-height:1; text-transform:uppercase; letter-spacing:.01em;
    animation:fadeUp .8s both;
  }
  .page-head .rule{ margin:0 0 18px }
  .page-head .lede{ color:#F7F4EC; animation:fadeUp .8s .15s both }
  .ph-mark{ height:clamp(120px,14vw,170px); width:auto; opacity:.9; filter:drop-shadow(0 0 1px rgba(226,236,248,.8)) drop-shadow(0 12px 28px rgba(0,0,0,.6)); animation:fadeUp .9s .1s both }

  /* sections sitting right under a page head need less top room */
  .tight-top{ padding-top:clamp(40px,5vw,64px) !important }

  /* home: help tiles */
  .home-help{ padding:clamp(52px,7vw,84px) 0; background:radial-gradient(50% 60% at 85% 10%, rgba(30,68,116,.35), rgba(5,13,26,0) 70%), var(--navy-dark) }
  .tiles{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px }
  .tile{
    position:relative; display:flex; align-items:center; gap:14px;
    padding:18px; min-height:84px; text-decoration:none;
    background:rgba(13,34,64,.7); border:1px solid var(--brass-faint);
    transition:background .25s, border-color .25s, transform .25s;
  }
  .tile .res-ico{ width:38px; height:38px; flex:none }
  .tile b{ font-size:16.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; line-height:1.15 }
  .tile .go{ margin-left:auto; color:var(--brass); transition:transform .25s }
  .tile:hover{ background:var(--blue); border-color:var(--brass); transform:translateY(-3px) }
  .tile:hover .go{ transform:translateX(4px) }
  .tile.soon{ border-style:dashed; background:rgba(5,13,26,.6) }
  .tile.soon .res-ico{ color:var(--dim) }
  .tile.soon em{ margin-left:auto; font-style:normal; font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--red-soft) }
  .sec-foot{ margin-top:22px; display:flex; justify-content:flex-end }
  .more-link{ display:inline-flex; align-items:center; gap:10px; font-size:13.5px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; text-decoration:none; color:var(--brass) }
  .more-link:hover{ color:#E2C27A }
  .more-link .arrow{ transition:transform .2s }
  .more-link:hover .arrow{ transform:translateX(4px) }

  /* home: mission band */
  .m-band{ background:var(--bone); color:var(--ink); padding:clamp(44px,6vw,72px) 0; position:relative; overflow:hidden }
  .m-band::before{ content:""; position:absolute; inset:0; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cpath d='M30,19L32.47,26.6L40.46,26.6L34,31.3L36.47,38.9L30,34.2L23.53,38.9L26,31.3L19.54,26.6L27.53,26.6Z' fill='%230A3161'/%3E%3Cpath d='M90,79L92.47,86.6L100.46,86.6L94,91.3L96.47,98.9L90,94.2L83.53,98.9L86,91.3L79.54,86.6L87.53,86.6Z' fill='%230A3161'/%3E%3C/svg%3E"); background-size:104px 104px; opacity:.05 }
  .m-grid{ display:grid; grid-template-columns:auto 1fr auto; gap:clamp(24px,4vw,56px); align-items:center }
  .m-grid .eyebrow{ color:#9A7A35; margin:0 }
  .m-grid .eyebrow::before{ background:#9A7A35 }
  .m-quote{ margin:0; font-family:"Source Serif 4",Georgia,serif; font-size:clamp(22px,2.6vw,32px); line-height:1.35; color:var(--ink); border-left:3px solid var(--red); padding-left:clamp(18px,2.5vw,32px) }
  .m-band .more-link{ color:var(--red) }

  /* home: partner strip */
  .p-strip{ background:var(--bone-2); color:var(--ink); padding:clamp(40px,5vw,60px) 0; border-top:1px solid rgba(10,26,51,.1) }
  .ps-grid{ display:grid; grid-template-columns:auto 1fr auto; gap:clamp(20px,3vw,44px); align-items:center }
  .ps-grid h2{ font-size:clamp(24px,2.6vw,32px); margin:0; color:var(--ink) }
  .ps-grid .eyebrow{ color:#9A7A35 }
  .ps-grid .eyebrow::before{ background:#9A7A35 }
  .ps-logos{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px }
  .ps-logos a,.ps-logos span{
    height:104px; display:flex; align-items:center; justify-content:center; padding:14px;
    background:#fff; border:1px solid rgba(10,26,51,.14); transition:transform .25s, box-shadow .25s, border-color .25s;
  }
  .ps-logos img{ max-height:76px; width:auto; object-fit:contain }
  .ps-logos a:hover{ transform:translateY(-4px); box-shadow:0 18px 30px -18px rgba(10,26,51,.5); border-color:var(--blue) }
  .p-strip .more-link{ color:var(--red) }

  /* home: split CTA */
  .split{ display:grid; grid-template-columns:1fr 1fr }
  .split a{
    position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:center;
    min-height:250px; padding:clamp(32px,5vw,60px); text-decoration:none;
  }
  .split .s-help{ background:linear-gradient(150deg,#A3181E,#5A0D11) }
  .split .s-inv{ background:linear-gradient(150deg,var(--blue),#071A36) }
  .split small{ font-size:12px; letter-spacing:.3em; text-transform:uppercase; color:rgba(243,239,230,.75); margin-bottom:10px }
  .split b{ font-size:clamp(28px,3.6vw,44px); font-weight:700; line-height:1.02; text-transform:uppercase; letter-spacing:.02em; max-width:12em }
  .split span.t{ margin-top:12px; font-family:"Source Serif 4",Georgia,serif; font-size:17px; color:rgba(243,239,230,.88); max-width:28em }
  .split .go{ position:absolute; right:clamp(24px,4vw,48px); bottom:clamp(22px,3vw,40px); width:54px; height:54px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(243,239,230,.5); font-size:22px; transition:transform .3s, background .3s }
  .split a:hover .go{ transform:translateX(6px); background:rgba(243,239,230,.15) }
  .split .bigstar{ position:absolute; right:-40px; top:-40px; width:220px; height:220px; background:rgba(255,255,255,.06); -webkit-mask:var(--star) center/contain no-repeat; mask:var(--star) center/contain no-repeat; transition:transform .6s }
  .split a:hover .bigstar{ transform:rotate(36deg) scale(1.08) }

  /* highlight card reached by link */
  .res.flash{ animation:flash 1.6s ease 1 }
  @keyframes flash{ 0%,100%{ box-shadow:0 0 0 0 rgba(201,166,92,0) } 30%{ box-shadow:0 0 0 4px rgba(201,166,92,.6) } }

  @media (max-width:1080px){
    .tiles{ grid-template-columns:repeat(2,1fr) }
    .m-grid{ grid-template-columns:1fr auto }
    .m-grid .eyebrow{ grid-column:1 / -1 }
    .ps-grid{ grid-template-columns:1fr auto }
    .ps-logos{ grid-column:1 / -1; grid-row:2 }
  }
  @media (max-width:940px){
    .ph-mark{ display:none }
    .ph-grid{ grid-template-columns:1fr }
  }
  @media (max-width:600px){
    .tiles{ grid-template-columns:1fr; gap:8px }
    .tile{ min-height:64px; padding:14px 16px }
    .m-grid{ grid-template-columns:1fr; gap:14px }
    .ps-grid{ grid-template-columns:1fr; gap:14px }
    .ps-logos{ grid-template-columns:1fr 1fr; grid-row:auto }
    .ps-logos a,.ps-logos span{ height:90px }
    .split{ grid-template-columns:1fr }
    .split a{ min-height:200px; padding:30px 22px 80px }
    .page-head h1{ font-size:clamp(34px,10vw,46px) }
    .crumbs{ font-size:11px; margin-bottom:14px }
  }

  .ct-h{ font-size:clamp(24px,2.6vw,30px); margin-bottom:16px }

  /* home hero without the big logo: copy left, how-it-works plaque right */
  .hero-grid.no-logo{ grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); padding-bottom:clamp(40px,6vh,64px) }
  .hero-steps{
    position:relative; align-self:center;
    padding:30px 28px 26px;
    background:rgba(5,13,26,.62); border:1px solid var(--brass-line);
    -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
    animation:fadeUp .9s .35s both;
  }
  .hero-steps .corner{ border-color:var(--brass) }
  .hs-label{ display:flex; align-items:center; gap:10px; margin:0 0 18px; font-size:12px; font-weight:500; letter-spacing:.3em; text-transform:uppercase; color:var(--brass) }
  .hero-steps ol{ list-style:none; margin:0; padding:0; counter-reset:none }
  .hero-steps li{ display:flex; align-items:center; gap:16px; padding:14px 0; border-top:1px solid var(--brass-faint) }
  .hero-steps li:first-child{ border-top:0; padding-top:0 }
  .hero-steps .step-n{ flex:none; width:46px; height:46px; display:flex; align-items:center; justify-content:center; border:1px solid var(--brass); color:var(--brass); font-size:19px; font-weight:600; transition:background .25s, color .25s }
  .hero-steps li:hover .step-n{ background:var(--brass); color:var(--navy-dark) }
  .hero-steps b{ display:block; font-size:17px; font-weight:600; letter-spacing:.1em; text-transform:uppercase }
  .hero-steps li div span{ display:block; margin-top:2px; font-family:"Source Serif 4",Georgia,serif; font-size:15px; color:var(--muted) }
  @media (max-width:940px){
    .hero-grid.no-logo{ grid-template-columns:1fr }
    .hero-steps{ width:100%; max-width:560px; text-align:left }
  }
  @media (max-width:600px){
    .hero-steps{ padding:24px 18px 20px }
    .hero-steps b{ font-size:15.5px }
  }

  /* home: single path to resources */
  .home-help{ padding:clamp(44px,6vw,72px) 0 }
  .help-band{ display:grid; grid-template-columns:1fr auto; gap:24px 48px; align-items:center }
  .help-band h2{ margin-bottom:10px }
  .mission-btn{
    display:inline-flex; align-items:center; gap:16px;
    min-height:76px; padding:0 34px;
    background:var(--red); color:#fff; text-decoration:none;
    font-size:clamp(17px,1.6vw,20px); font-weight:600; letter-spacing:.2em; text-transform:uppercase;
    box-shadow:0 18px 36px -18px rgba(196,33,39,.8);
    transition:background .2s, transform .2s;
  }
  .mission-btn .star-i{ width:16px; height:16px; background:#fff; transition:transform .5s }
  .mission-btn .arrow{ font-size:22px; transition:transform .2s }
  .mission-btn:hover{ background:#D72A31; transform:translateY(-3px) }
  .mission-btn:hover .star-i{ transform:rotate(144deg) scale(1.15) }
  .mission-btn:hover .arrow{ transform:translateX(5px) }
  .res-grid{ align-items:start }
  @media (max-width:940px){
    .help-band{ grid-template-columns:1fr }
    .mission-btn{ justify-content:center; width:100% }
  }
  @media (max-width:600px){
    .mission-btn{ min-height:64px; padding:0 18px; letter-spacing:.14em; gap:12px }
  }

  /* ===== home photos ===== */
  .hero.has-photo{ background:var(--navy-dark) }
  .hero-photo{
    position:absolute; inset:0; pointer-events:none;
    background:url("images/photos/home-hero.webp") 78% 40% / cover no-repeat;
    animation:slowzoom 24s ease-out both;
  }
  .hero-photo::after{
    content:""; position:absolute; inset:0;
    background:
      linear-gradient(90deg, rgba(5,13,26,.94) 0%, rgba(5,13,26,.82) 34%, rgba(5,13,26,.35) 60%, rgba(5,13,26,.05) 82%),
      linear-gradient(0deg, rgba(5,13,26,.95) 0%, rgba(5,13,26,0) 34%),
      linear-gradient(180deg, rgba(5,13,26,.55) 0%, rgba(5,13,26,0) 22%);
  }
  @keyframes slowzoom{ from{ transform:scale(1.08) } to{ transform:scale(1) } }
  .hero.has-photo .twinkle{ height:45% }
  .hero-grid.no-logo{ grid-template-columns:1fr; gap:34px; padding-bottom:clamp(30px,4vh,44px) }
  .hero.has-photo .hero-copy{ max-width:640px }
  .hero.has-photo h1{ text-shadow:0 2px 24px rgba(0,0,0,.45) }
  .hero.has-photo .hero-steps{ justify-self:stretch; padding:20px 24px; background:rgba(5,13,26,.72) }
  .hero.has-photo .hs-label{ margin-bottom:14px }
  .hero.has-photo .hero-steps ol{ display:grid; grid-template-columns:repeat(3,1fr); gap:0 }
  .hero.has-photo .hero-steps li{ padding:0 22px; border-top:0; border-left:1px solid var(--brass-faint) }
  .hero.has-photo .hero-steps li:first-child{ padding-left:0; border-left:0 }
  .hero.has-photo .branch-band{ background:rgba(3,8,15,.8) }

  .m-photo-band{ display:grid; grid-template-columns:1fr 1fr; padding:0 }
  .m-photo-band::before{ left:50% }
  .m-photo{ position:relative; min-height:380px; overflow:hidden }
  .m-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:40% 50%; transition:transform 6s ease }
  .m-photo-band:hover .m-photo img{ transform:scale(1.04) }
  .m-photo::after{ content:""; position:absolute; top:0; bottom:0; right:0; width:6px; background:linear-gradient(180deg,var(--red) 0 33%,var(--bone) 33% 34%,var(--blue) 34% 66%,var(--bone) 66% 67%,var(--red) 67%) }
  .m-text{ position:relative; display:flex; flex-direction:column; justify-content:center; gap:22px; padding:clamp(36px,5vw,72px) }
  .m-text .eyebrow{ color:#9A7A35; margin:0 }
  .m-text .eyebrow::before{ background:#9A7A35 }
  .m-text .more-link{ color:var(--red) }

  .split .s-help{ background:linear-gradient(150deg, rgba(163,24,30,.8), rgba(90,13,17,.74)), url("images/photos/home-reachout.webp") center/cover no-repeat }
  .split .s-inv{ background:linear-gradient(150deg, rgba(10,49,97,.8), rgba(7,26,54,.74)), url("images/photos/home-involved.webp") center/cover no-repeat }
  .split a{ min-height:300px; transition:background-size .6s }

  @media (max-width:940px){
    .hero-photo{ background-position:72% 30% }
    .hero-photo::after{
      background:
        linear-gradient(180deg, rgba(5,13,26,.55) 0%, rgba(5,13,26,.78) 40%, rgba(5,13,26,.92) 100%);
    }
    .hero.has-photo .hero-copy{ max-width:none }
    .hero.has-photo .hero-steps ol{ grid-template-columns:1fr }
    .hero.has-photo .hero-steps li{ padding:12px 0; border-left:0; border-top:1px solid var(--brass-faint) }
    .hero.has-photo .hero-steps li:first-child{ border-top:0; padding-top:0 }
    .m-photo-band{ grid-template-columns:1fr }
    .m-photo-band::before{ left:0; top:280px }
    .m-photo{ min-height:280px }
    .m-photo::after{ top:auto; left:0; width:auto; height:6px; background:linear-gradient(90deg,var(--red) 0 33%,var(--bone) 33% 34%,var(--blue) 34% 66%,var(--bone) 66% 67%,var(--red) 67%) }
  }
  @media (max-width:600px){
    .m-photo{ min-height:230px }
    .m-photo-band::before{ top:230px }
    .m-text{ padding:30px 18px 36px; gap:16px }
    .split a{ min-height:220px }
  }

  /* ===== resource card photos ===== */
  .res{ min-height:0; padding-top:0; overflow:hidden }
  .res-photo{ position:relative; display:block; height:150px; margin:0 -20px 0; overflow:hidden; background:var(--blue) }
  .res-photo img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease }
  .res:hover .res-photo img{ transform:scale(1.06) }
  .res-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(5,13,26,.15) 0%, rgba(5,13,26,.05) 45%, rgba(10,26,51,.85) 100%) }
  .res-photo.none{ background:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cpath d='M15,9.5L16.24,13.3L20.23,13.3L17,15.65L18.24,19.45L15,17.1L11.76,19.45L13,15.65L9.77,13.3L13.76,13.3Z' fill='%23C9A65C' fill-opacity='.25'/%3E%3Cpath d='M45,39.5L46.24,43.3L50.23,43.3L47,45.65L48.24,49.45L45,47.1L41.76,49.45L43,45.65L39.77,43.3L43.76,43.3Z' fill='%23C9A65C' fill-opacity='.25'/%3E%3C/svg%3E"),
      linear-gradient(160deg, var(--blue), var(--navy-dark)) }
  .res .res-top{ position:relative; margin-top:-26px; z-index:2; align-items:flex-end }
  .res .res-ico{ width:52px; height:52px; padding:10px; background:var(--navy-dark); border:1px solid var(--brass-line) }
  .res .res-toggle{ position:absolute; right:0; top:-120px; background:rgba(5,13,26,.7) }
  .res h3{ margin-top:14px }
  .res{ padding-bottom:20px }
  .res.open .res-photo::after{ background:linear-gradient(180deg, rgba(5,13,26,.1) 0%, rgba(10,49,97,.9) 100%) }
  .res.soon .res-photo img{ filter:grayscale(.55) brightness(.75) }
  .res.soon .soon-tag{ position:absolute; right:0; top:-120px }
  @media (max-width:600px){
    .res{ padding:0 16px 16px }
    .res-photo{ height:140px; margin:0 -16px }
    .res .res-ico{ width:46px; height:46px; padding:8px }
    .res .res-toggle,.res.soon .soon-tag{ top:-110px }
    .res h3{ margin-top:12px }
  }
  .steps.steps-top{ margin:0 0 22px }

  /* footer credit */
  .foot-base{ justify-content:space-between; max-width:1200px; margin:0 auto; padding:16px 28px }
  .foot-base .fb-l{ display:inline-flex; align-items:center; gap:12px; flex-wrap:wrap }
  .fb-by{ color:var(--muted); text-decoration:none; border-bottom:1px solid transparent; transition:color .2s, border-color .2s }
  .fb-by:hover{ color:var(--brass); border-bottom-color:var(--brass) }
  @media (max-width:760px){
    .foot-base{ flex-direction:column; justify-content:center; gap:10px; padding:16px 18px }
    .foot-base .fb-l{ justify-content:center }
  }

  /* ===== inner page photos ===== */
  .page-head.has-photo{ padding-top:calc(var(--hang) + 70px) !important; padding-bottom:clamp(48px,6vw,80px); background:var(--navy-dark) }
  .ph-photo{ position:absolute; inset:0; background-size:cover; background-position:center 55%; animation:slowzoom 24s ease-out both }
  .ph-photo::after{ content:""; position:absolute; inset:0; background:
      linear-gradient(90deg, rgba(5,13,26,.92) 0%, rgba(5,13,26,.72) 40%, rgba(5,13,26,.25) 75%, rgba(5,13,26,.15) 100%),
      linear-gradient(0deg, rgba(5,13,26,.7) 0%, rgba(5,13,26,0) 40%) }
  .page-head.has-photo h1{ text-shadow:0 2px 22px rgba(0,0,0,.5) }

  .aud-card{ padding-top:0 }
  .aud-photo{ margin:0 -20px 18px; height:170px; overflow:hidden; position:relative }
  .aud-photo img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease }
  .aud-card:hover .aud-photo img{ transform:scale(1.06) }
  .aud-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(5,13,26,0) 55%, rgba(10,34,64,.9) 100%) }

  .plaque.with-flag{ display:grid; grid-template-columns:220px 1fr; column-gap:44px; text-align:left; align-items:center }
  .plaque.with-flag > *:not(.corner):not(.plaque-flag){ grid-column:2 }
  .plaque-flag{ grid-column:1; grid-row:1 / span 5; width:100%; height:auto; box-shadow:0 18px 36px -16px rgba(10,26,51,.55); border:1px solid rgba(201,166,92,.6) }
  .plaque.with-flag .eyebrow::after{ display:none }
  .plaque.with-flag .rule{ margin:6px 0 22px }
  .plaque.with-flag .pillars{ justify-content:flex-start }

  .i-card{ padding-top:0 }
  .i-photo{ margin:0 -26px 22px; height:180px; overflow:hidden; position:relative }
  .i-photo img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease }
  .i-card:hover .i-photo img{ transform:scale(1.06) }
  .i-photo.none{ background:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cpath d='M15,9.5L16.24,13.3L20.23,13.3L17,15.65L18.24,19.45L15,17.1L11.76,19.45L13,15.65L9.77,13.3L13.76,13.3Z' fill='%23C9A65C' fill-opacity='.25'/%3E%3Cpath d='M45,39.5L46.24,43.3L50.23,43.3L47,45.65L48.24,49.45L45,47.1L41.76,49.45L43,45.65L39.77,43.3L43.76,43.3Z' fill='%23C9A65C' fill-opacity='.25'/%3E%3C/svg%3E"),
      linear-gradient(160deg, var(--blue), var(--navy-dark)) }
  .i-card .big{ top:auto; bottom:-24px; z-index:0 }
  .i-card > *:not(.big){ position:relative; z-index:1 }

  @media (max-width:940px){
    .ph-photo{ background-position:60% 50% }
    .ph-photo::after{ background:linear-gradient(180deg, rgba(5,13,26,.6) 0%, rgba(5,13,26,.8) 100%) }
    .plaque.with-flag{ grid-template-columns:1fr; text-align:center }
    .plaque.with-flag > *:not(.corner):not(.plaque-flag){ grid-column:1 }
    .plaque-flag{ grid-row:auto; width:150px; margin:0 auto 22px }
    .plaque.with-flag .rule{ margin:6px auto 22px }
    .plaque.with-flag .pillars{ justify-content:center }
  }
  @media (max-width:600px){
    .page-head.has-photo{ padding-top:calc(var(--hang) + 50px) !important }
    .aud-card{ padding-top:0 }
    .aud-photo{ margin:0 -16px 12px; height:130px }
    .i-photo{ height:160px }
  }
  @media (prefers-reduced-motion:reduce){
    *,*::before,*::after{ animation:none !important; transition:none !important }
    html{ scroll-behavior:auto }
    .reveal{ opacity:1; transform:none }
  }