/* ════════════ RESET ════════════ */
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
    body {
      font-family: 'Montserrat', sans-serif;
      font-size: 16px;
      line-height: 1.6;
      color: var(--text);
      background: var(--bg);
      -webkit-font-smoothing: antialiased;
      overflow-x: hidden;
    }
    a { text-decoration: none; color: inherit; }
    button { font-family: inherit; cursor: pointer; border: none; background: none; }
    img, video { max-width: 100%; display: block; }
    ::selection { background: var(--amber); color: #fff; }

    /* ════════════ TOKENS ════════════ */
    :root {
      --ink:        #15314e;
      --ink-2:      #1c4068;
      --ink-3:      #275a90;
      --blue:       #275a90;
      --blue-bright:#3a7ec0;
      --blue-soft:  #e9f0f8;
      --blue-soft-2:#d6e4f1;
      --amber:      #d9802f;
      --amber-deep: #b1641d;
      --amber-soft: #fbe7d3;
      --gold:       #e0a83e;
      --feather-red:#cf5942;
      --feather-green:#5f9444;
      --feather-teal:#4f8090;
      --logo: url('../images/logo.png');
      --paper:      #ffffff;
      --bg:         #f5f8fc;
      --line:       #e3eaf4;
      --line-2:     #d4dfee;
      --text:       #12233b;
      --muted:      #5c6e85;
      --muted-2:    #8a99ac;
      --r-sm: 8px; --r-md: 14px; --r-lg: 22px; --r-xl: 30px; --r-pill: 999px;
      --maxw: 1200px;
      --pad: clamp(1.25rem, 5vw, 3.5rem);
      --shadow-sm: 0 1px 3px rgba(10,37,64,.06), 0 1px 2px rgba(10,37,64,.04);
      --shadow-md: 0 12px 32px rgba(10,37,64,.09);
      --shadow-lg: 0 28px 64px rgba(10,37,64,.14);
      --ease: cubic-bezier(.22,.61,.36,1);
    }

    /* ════════════ HELPERS ════════════ */
    .wrap { max-width: var(--maxw); margin: 0 auto; padding-left: var(--pad); padding-right: var(--pad); }
    .display { font-family: 'Lora', serif; font-weight: 700; letter-spacing: -0.02em; line-height: 1.04; }
    .hl { color: var(--amber); }
    .ink-bg { background: var(--ink); color: #fff; }

    .view { display: none; }
    .view.is-active { display: block; animation: viewIn .5s var(--ease); }
    @keyframes viewIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

    .block { padding-top: clamp(3.5rem, 7vw, 6.5rem); padding-bottom: clamp(3.5rem, 7vw, 6.5rem); }
    .block-sm { padding-top: clamp(2.5rem, 5vw, 4rem); padding-bottom: clamp(2.5rem, 5vw, 4rem); }

    .eyebrow {
      display: inline-flex; align-items: center; gap: 10px;
      font-size: 12.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
      color: var(--blue); margin-bottom: 18px;
    }
    .eyebrow::before { content: ""; width: 26px; height: 3px; border-radius: 2px; background: var(--amber); }
    .ink-bg .eyebrow { color: var(--amber); }
    .ink-bg .eyebrow::before { background: var(--amber); }

    .h-xl { font-size: clamp(2.4rem, 6.2vw, 4.4rem); }
    .h-lg { font-size: clamp(1.9rem, 4vw, 3rem); }
    .h-md { font-size: clamp(1.4rem, 2.6vw, 2rem); }
    .lead { font-size: clamp(1rem, 1.4vw, 1.18rem); color: var(--muted); line-height: 1.7; max-width: 60ch; }
    .ink-bg .lead { color: rgba(255,255,255,.72); }

    /* spectrum signature rule (peacock feather colours from the logo) */
    .spectrum { display: inline-flex; height: 6px; border-radius: 4px; overflow: hidden; box-shadow: var(--shadow-sm); }
    .spectrum span { width: 20px; height: 100%; }
    .spectrum span:nth-child(1){ background: #cf5942; }
    .spectrum span:nth-child(2){ background: #de8d43; }
    .spectrum span:nth-child(3){ background: #e3ae4b; }
    .spectrum span:nth-child(4){ background: #5f9444; }
    .spectrum span:nth-child(5){ background: #4f8090; }
    .spectrum span:nth-child(6){ background: #275a90; }

    /* ════════════ BUTTONS ════════════ */
    .btn {
      display: inline-flex; align-items: center; gap: 9px;
      font-size: 15px; font-weight: 600; padding: 14px 26px; border-radius: var(--r-pill);
      transition: transform .2s var(--ease), background .2s, box-shadow .2s, color .2s, border-color .2s;
      white-space: nowrap;
    }
    .btn i { font-size: 18px; }
    /* Shiny donate button — rotating conic shine in brand amber/gold (adapted from ShinyButton) */
    @property --gradient-angle { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
    @property --gradient-angle-offset { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
    @property --gradient-percent { syntax: "<percentage>"; initial-value: 5%; inherits: false; }
    @property --gradient-shine { syntax: "<color>"; initial-value: #fbe7d3; inherits: false; }
    .btn-amber {
      --shine-bg: var(--amber);
      --shine-highlight: var(--gold);
      --shine-highlight-subtle: #f6d9b5;
      --shine-anim: gradient-angle linear infinite;
      --shine-duration: 3s;
      --shine-transition: 800ms cubic-bezier(.25, 1, .5, 1);
      isolation: isolate; position: relative; overflow: hidden; outline-offset: 4px;
      border: 1px solid transparent;
      color: #fff;
      background:
        linear-gradient(var(--shine-bg), var(--shine-bg)) padding-box,
        conic-gradient(
          from calc(var(--gradient-angle) - var(--gradient-angle-offset)),
          transparent,
          var(--shine-highlight) var(--gradient-percent),
          var(--gradient-shine) calc(var(--gradient-percent) * 2),
          var(--shine-highlight) calc(var(--gradient-percent) * 3),
          transparent calc(var(--gradient-percent) * 4)
        ) border-box;
      box-shadow: inset 0 0 0 1px var(--amber-deep), 0 8px 20px rgba(217,128,47,.28);
    }
    .btn-amber::after {
      content: ""; pointer-events: none; position: absolute;
      left: 50%; top: 50%; translate: -50% -50%; z-index: -1;
      --shine-anim: shimmer linear infinite;
      width: 100%; aspect-ratio: 1;
      background: linear-gradient(-50deg, transparent, var(--shine-highlight), transparent);
      -webkit-mask-image: radial-gradient(circle at bottom, transparent 40%, black);
      mask-image: radial-gradient(circle at bottom, transparent 40%, black);
      opacity: .5;
    }
    .btn-amber, .btn-amber::after {
      animation: var(--shine-anim) var(--shine-duration), var(--shine-anim) calc(var(--shine-duration) / 0.4) reverse paused;
      animation-composition: add;
    }
    .btn-amber:hover, .btn-amber:focus-visible {
      --gradient-percent: 20%;
      --gradient-angle-offset: 95deg;
      --gradient-shine: var(--shine-highlight-subtle);
      --shine-bg: var(--amber-deep);
      transform: translateY(-2px);
      box-shadow: inset 0 0 0 1px var(--amber-deep), 0 12px 26px rgba(217,128,47,.34);
    }
    .btn-amber:is(:hover, :focus-visible), .btn-amber:is(:hover, :focus-visible)::after { animation-play-state: running; }
    .btn-amber:active { translate: 0 1px; }
    @keyframes gradient-angle { to { --gradient-angle: 360deg; } }
    @keyframes shimmer { to { rotate: 360deg; } }
    .btn-dark { background: var(--ink); color: #fff; }
    .btn-dark:hover { background: var(--ink-3); transform: translateY(-2px); }
    .btn-ghost { background: transparent; color: var(--ink); border: 1.5px solid var(--line-2); }
    .btn-ghost:hover { border-color: var(--ink); transform: translateY(-2px); }
    .ink-bg .btn-ghost { color: #fff; border-color: rgba(255,255,255,.35); }
    .ink-bg .btn-ghost:hover { border-color: #fff; background: rgba(255,255,255,.06); }
    .btn-light { background: #fff; color: var(--ink); }
    .btn-light:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }

    /* ════════════ NAV ════════════ */
    .nav {
      position: sticky; top: 0; z-index: 100;
      backdrop-filter: saturate(150%) blur(14px);
      background: rgba(245,248,252,.82);
      border-bottom: 1px solid transparent;
      transition: border-color .3s, background .3s, box-shadow .3s;
    }
    .nav.scrolled { border-bottom-color: var(--line); background: rgba(255,255,255,.9); box-shadow: 0 6px 24px rgba(10,37,64,.05); }
    .nav-inner { display: flex; align-items: center; justify-content: space-between; height: 76px; }
    .brand { display: flex; align-items: center; gap: 13px; cursor: pointer; flex-shrink: 0; }
    .brand-badge {
      width: 48px; height: 48px; border-radius: 13px;
      background: #fff; border: 1px solid var(--line);
      background-image: var(--logo); background-repeat: no-repeat; background-position: center; background-size: auto 82%;
      flex-shrink: 0; box-shadow: var(--shadow-sm);
    }
    .brand-text { line-height: 1.1; }
    .brand-name { font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: 17px; color: var(--ink); letter-spacing: -0.01em; }
    .brand-sub { font-size: 11px; color: var(--muted); letter-spacing: 0.02em; }
    .nav-links { display: flex; align-items: center; gap: 4px; }
    .nav-link {
      font-size: 14.5px; font-weight: 500; color: var(--muted);
      padding: 9px 15px; border-radius: var(--r-pill);
      transition: color .15s, background .15s; cursor: pointer; white-space: nowrap;
    }
    .nav-link:hover { color: var(--ink); background: rgba(26,95,168,.07); }
    .nav-link.is-active { color: var(--blue); background: var(--blue-soft); }
    .nav-cta { display: flex; align-items: center; gap: 10px; }
    .nav-toggle { display: none; width: 44px; height: 44px; border-radius: 12px; align-items: center; justify-content: center; color: var(--ink); }
    .nav-toggle i { font-size: 24px; }

    .mobile-menu { display: none; }

    /* ════════════ HERO ════════════ */
    .hero { position: relative; overflow: hidden; padding-top: clamp(2.5rem, 5vw, 4.5rem); padding-bottom: clamp(3rem, 6vw, 5rem); }
    .hero::before {
      content: ""; position: absolute; top: -30%; right: -10%; width: 60vw; height: 60vw; max-width: 760px; max-height: 760px;
      background: radial-gradient(circle, rgba(39,90,144,.10), transparent 62%); z-index: 0;
    }
    .hero::after {
      content: ""; position: absolute; bottom: -20%; left: -8%; width: 44vw; height: 44vw; max-width: 540px; max-height: 540px;
      background: radial-gradient(circle, rgba(217,128,47,.10), transparent 64%); z-index: 0;
    }
    .hero-inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 4vw, 4rem); align-items: center; }
    .hero-pill {
      display: inline-flex; align-items: center; gap: 8px;
      background: #fff; border: 1px solid var(--line); border-radius: var(--r-pill);
      padding: 7px 16px 7px 8px; font-size: 13px; font-weight: 500; color: var(--ink);
      box-shadow: var(--shadow-sm); margin-bottom: 24px;
    }
    .hero-pill .dot { width: 22px; height: 22px; border-radius: 50%; background: var(--amber-soft); color: var(--amber-deep); display: flex; align-items: center; justify-content: center; }
    .hero-pill .dot i { font-size: 14px; }
    .hero h1 { margin-bottom: 22px; color: var(--ink); }
    .hero .lead { margin-bottom: 32px; }
    .hero-actions { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 36px; }
    .hero-trust { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
    .hero-trust .spectrum { height: 6px; }
    .hero-trust-label { font-size: 13px; color: var(--muted); }

    .hero-media {
      position: relative; border-radius: var(--r-xl); overflow: hidden; aspect-ratio: 4/4.4;
      background: linear-gradient(150deg, var(--ink), var(--ink-3));
      box-shadow: var(--shadow-lg); border: 1px solid rgba(255,255,255,.08);
      display: flex; align-items: center; justify-content: center;
    }
    .hero-media img, .hero-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
    .hero-media-up { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; cursor: pointer; z-index: 2; color: #fff; }
    .hero-media-up input { display: none; }
    .hero-media-play { width: 76px; height: 76px; border-radius: 50%; background: rgba(255,255,255,.14); border: 1.5px solid rgba(255,255,255,.45); display: flex; align-items: center; justify-content: center; transition: background .2s, transform .2s; }
    .hero-media-up:hover .hero-media-play { background: rgba(255,255,255,.26); transform: scale(1.05); }
    .hero-media-play i { font-size: 30px; }
    .hero-media-cap { font-size: 13px; color: rgba(255,255,255,.7); text-align: center; max-width: 70%; }
    .hero-media-tag {
      position: absolute; left: 18px; bottom: 18px; z-index: 3;
      background: rgba(10,37,64,.55); backdrop-filter: blur(6px); color: #fff;
      border-radius: var(--r-pill); padding: 9px 16px; font-size: 13px; font-weight: 600;
      display: flex; align-items: center; gap: 8px;
    }
    .hero-media-tag .pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 0 0 rgba(217,128,47,.6); animation: pulse 2s infinite; }
    @keyframes pulse { 0%{box-shadow:0 0 0 0 rgba(217,128,47,.5);} 70%{box-shadow:0 0 0 9px rgba(217,128,47,0);} 100%{box-shadow:0 0 0 0 rgba(217,128,47,0);} }

    /* hero stat strip */
    .hero-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: clamp(2.5rem, 5vw, 4rem); position: relative; z-index: 1; }
    .hstat { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 22px 22px; box-shadow: var(--shadow-sm); transition: transform .25s var(--ease), box-shadow .25s; }
    .hstat:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
    .hstat-num { font-family: 'Lora', serif; font-weight: 700; font-size: clamp(1.7rem, 3vw, 2.3rem); color: var(--ink); letter-spacing: -0.02em; }
    .hstat-num em { font-style: normal; color: var(--amber); }
    .hstat-lbl { font-size: 13.5px; color: var(--muted); margin-top: 4px; }

    /* ════════════ PARTNER MARQUEE ════════════ */
    .partners { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #fff; padding-top: 22px; }
    .partners .partners-label { display: block; text-align: center; font-size: 12.5px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted-2); margin-bottom: 18px; }
    .marquee { overflow: hidden; position: relative; padding-bottom: 24px; -webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent); }
    .marquee-track { display: flex; width: max-content; animation: marquee-scroll 15s linear infinite; will-change: transform; }
    .marquee:hover .marquee-track { animation-play-state: paused; }
    .partners-list { display: flex; align-items: center; gap: 56px; flex-wrap: nowrap; padding: 0 28px; }
    .partner-chip { display: inline-flex; align-items: center; flex-shrink: 0; opacity: 1; transition: transform .2s; }
    .partner-chip img { height: 62px; width: auto; max-width: 220px; object-fit: contain; }
    .partner-chip img[src*="bpcl"], .partner-chip img[src*="hpcl"] { height: 78px; }
    .partner-chip img[src*="ujjivan"] { height: 70px; }
    .partner-chip img[src*="niepmd"] { height: 74px; }
    .partner-chip img[src*="stanley-medical-college"] { height: 76px; }
    .partner-chip img[src*="srmc"] { height: 78px; }
    .partner-chip img[src*="byst"] { height: 74px; }
    .partner-chip img[src*="city-guilds"] { height: 56px; }
    .partner-chip img[src*="district-administrations"] { height: 76px; }
    @keyframes marquee-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
    @media (prefers-reduced-motion: reduce) {
      .marquee-track { animation: none; }
      .marquee { overflow-x: auto; }
    }

    /* ════════════ FOCUS / WHAT WE DO ════════════ */
    .sec-head { max-width: 760px; margin-bottom: clamp(2.2rem, 4vw, 3.4rem); }
    .sec-head.center { margin-left: auto; margin-right: auto; text-align: center; }
    .sec-head.center .eyebrow { justify-content: center; }
    .sec-head h2 { color: var(--ink); margin-bottom: 16px; }
    .ink-bg .sec-head h2 { color: #fff; }

    .focus-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
    .focus-card {
      position: relative; background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg);
      padding: 30px 26px 28px; overflow: hidden;
      transition: transform .3s var(--ease), box-shadow .3s, border-color .3s;
    }
    .focus-card::after { content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 4px; background: var(--accent, var(--blue)); transform: scaleY(0); transform-origin: top; transition: transform .3s var(--ease); }
    .focus-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-color: transparent; }
    .focus-card:hover::after { transform: scaleY(1); }
    .focus-ic { width: 56px; height: 56px; border-radius: 16px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; background: var(--accent-soft, var(--blue-soft)); color: var(--accent, var(--blue)); }
    .focus-ic i { font-size: 28px; }
    .focus-card h3 { font-family: 'Lora', serif; font-weight: 600; font-size: 20px; color: var(--ink); margin-bottom: 10px; letter-spacing: -0.01em; }
    .focus-card p { font-size: 14.5px; color: var(--muted); line-height: 1.65; margin-bottom: 16px; }
    .focus-link { font-size: 14px; font-weight: 600; color: var(--accent, var(--blue)); display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
    .focus-link i { transition: transform .2s; }
    .focus-card:hover .focus-link i { transform: translateX(4px); }

    /* ════════════ IMPACT BAND ════════════ */
    .impact-band { position: relative; overflow: hidden; }
    .impact-band::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 80% 20%, rgba(39,90,144,.18), transparent 50%), radial-gradient(circle at 10% 90%, rgba(217,128,47,.14), transparent 48%); }
    .impact-grid { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(1.5rem, 3vw, 3rem); }
    .hero-stats.cols-3, .impact-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
    .ibig { }
    .ibig-num { font-family: 'Lora', serif; font-weight: 700; font-size: clamp(2.6rem, 5vw, 3.8rem); line-height: 1; color: #fff; letter-spacing: -0.03em; }
    .ibig-num em { font-style: normal; color: var(--amber); }
    .ibig-lbl { font-size: 14.5px; color: rgba(255,255,255,.7); margin-top: 12px; line-height: 1.5; }
    .ibig + .ibig { border-left: 1px solid rgba(255,255,255,.12); padding-left: clamp(1.5rem, 3vw, 3rem); }

    /* ════════════ FEATURE SPLIT ════════════ */
    .split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 4vw, 4.5rem); align-items: center; }
    .split.rev .split-media { order: 2; }
    .split-media {
      position: relative; border-radius: var(--r-xl); overflow: hidden; aspect-ratio: 5/4;
      background: var(--blue-soft); border: 1px solid var(--line);
      display: flex; align-items: center; justify-content: center;
    }
    .split-media img, .split-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
    .split-up { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; cursor: pointer; color: var(--blue); }
    .split-up input { display: none; }
    .split-up i { font-size: 34px; }
    .split-up span { font-size: 13px; color: var(--muted); }
    .split-badge { position: absolute; top: 16px; left: 16px; background: #fff; border-radius: var(--r-pill); padding: 7px 15px; font-size: 12.5px; font-weight: 600; color: var(--ink); box-shadow: var(--shadow-sm); z-index: 2; }
    .checklist { list-style: none; margin: 22px 0 30px; display: grid; gap: 12px; }
    .checklist li { display: flex; align-items: flex-start; gap: 12px; font-size: 15px; color: var(--text); }
    .checklist .ck { flex-shrink: 0; width: 24px; height: 24px; border-radius: 50%; background: var(--amber-soft); color: var(--amber-deep); display: flex; align-items: center; justify-content: center; margin-top: 1px; }
    .checklist .ck i { font-size: 15px; }

    /* ════════════ QUOTE ════════════ */
    .quote-card { position: relative; max-width: 880px; margin: 0 auto; text-align: center; }
    .quote-mark { font-family: 'Lora', serif; font-size: 90px; line-height: .5; color: var(--amber); opacity: .9; }
    .quote-card blockquote { font-family: 'Lora', serif; font-weight: 500; font-size: clamp(1.4rem, 3vw, 2.1rem); line-height: 1.4; color: #fff; letter-spacing: -0.01em; margin: 18px 0 26px; }
    .quote-card cite { display: inline-flex; flex-direction: column; font-style: normal; }
    .quote-card cite b { font-size: 15px; font-weight: 600; color: #fff; }
    .quote-card cite span { font-size: 13px; color: rgba(255,255,255,.6); margin-top: 3px; }

    /* ════════════ CTA BAND ════════════ */
    .cta-band { position: relative; overflow: hidden; border-radius: var(--r-xl); padding: clamp(2.5rem, 5vw, 4.5rem); text-align: center; }
    .cta-band::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 20% 20%, rgba(39,90,144,.25), transparent 45%), radial-gradient(circle at 85% 80%, rgba(217,128,47,.22), transparent 45%); }
    .cta-band > * { position: relative; }
    .cta-band h2 { color: #fff; margin-bottom: 16px; }
    .cta-band .lead { margin: 0 auto 30px; }
    .cta-actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

    /* ════════════ PAGE HEADER (inner) ════════════ */
    .pagehead { position: relative; overflow: hidden; padding-top: clamp(2.5rem, 5vw, 4rem); padding-bottom: clamp(2.5rem, 5vw, 4rem); }
    .pagehead::before { content: ""; position: absolute; top: -40%; right: -5%; width: 50vw; height: 50vw; max-width: 620px; max-height: 620px; background: radial-gradient(circle, rgba(39,90,144,.09), transparent 62%); }
    .crumbs { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); margin-bottom: 18px; position: relative; }
    .crumbs a { color: var(--blue); cursor: pointer; }
    .crumbs a:hover { text-decoration: underline; }
    .pagehead h1 { color: var(--ink); position: relative; margin-bottom: 14px; }
    .pagehead .lead { position: relative; }

    /* ════════════ ABOUT ════════════ */
    .about-grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: clamp(2rem, 4vw, 3.5rem); align-items: start; }
    .prose p { font-size: 16px; color: var(--muted); line-height: 1.8; margin-bottom: 18px; }
    .mv-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 8px 0 4px; }
    .mv-card { border-radius: var(--r-lg); padding: 24px; border: 1px solid var(--line); }
    .mv-card.mission { background: var(--blue-soft); }
    .mv-card.vision { background: var(--amber-soft); }
    .mv-card .mv-ic { width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; background: #fff; }
    .mv-card.mission .mv-ic { color: var(--blue); }
    .mv-card.vision .mv-ic { color: var(--amber-deep); }
    .mv-card h4 { font-family: 'Lora', serif; font-size: 17px; color: var(--ink); margin-bottom: 8px; }
    .mv-card p { font-size: 14px; color: var(--muted); line-height: 1.6; }

    .sidecard { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 26px; box-shadow: var(--shadow-sm); }
    .sidecard + .sidecard { margin-top: 18px; }
    .sidecard-title { font-family: 'Lora', serif; font-weight: 600; font-size: 15px; color: var(--ink); margin-bottom: 16px; display: flex; align-items: center; gap: 10px; }
    .sidecard-title::before { content: ""; width: 20px; height: 3px; border-radius: 2px; background: var(--amber); }
    .facts { width: 100%; border-collapse: collapse; }
    .facts tr { border-bottom: 1px solid var(--line); }
    .facts tr:last-child { border-bottom: none; }
    .facts td { padding: 11px 0; font-size: 14px; }
    .facts td:first-child { color: var(--muted); }
    .facts td:last-child { font-weight: 600; color: var(--ink); text-align: right; }
    .jump { display: flex; align-items: center; gap: 10px; padding: 11px 0; font-size: 14px; color: var(--text); border-bottom: 1px solid var(--line); cursor: pointer; transition: color .15s, padding-left .15s; }
    .jump:last-child { border-bottom: none; }
    .jump:hover { color: var(--blue); padding-left: 4px; }
    .jump i { color: var(--blue); font-size: 17px; }

    /* leadership feature */
    .leader-feature { display: grid; grid-template-columns: 280px 1fr; gap: clamp(1.5rem, 3vw, 2.5rem); align-items: center; background: var(--ink); border-radius: var(--r-xl); padding: clamp(1.5rem, 3vw, 2.4rem); overflow: hidden; position: relative; }
    .leader-feature::before { content: ""; position: absolute; top: -30%; right: -10%; width: 380px; height: 380px; background: radial-gradient(circle, rgba(217,128,47,.16), transparent 60%); }
    .leader-photo-lg { position: relative; aspect-ratio: 1; border-radius: var(--r-lg); overflow: hidden; background: linear-gradient(150deg, var(--ink-3), var(--blue)); display: flex; align-items: center; justify-content: center; }
    .leader-photo-lg .mono-lg { font-family: 'Lora', serif; font-weight: 700; font-size: clamp(2.4rem, 6vw, 3.6rem); color: rgba(255,255,255,.92); letter-spacing: .02em; }
    .leader-photo-lg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
    .leader-photo-lg label { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; cursor: pointer; color: rgba(255,255,255,.8); }
    .leader-photo-lg label i { font-size: 38px; }
    .leader-photo-lg label span { font-size: 12px; }
    .leader-photo-lg input { display: none; }
    .leader-info { position: relative; color: #fff; }
    .leader-info .tagn { font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--amber); margin-bottom: 10px; }
    .leader-info h3 { font-family: 'Lora', serif; font-weight: 700; font-size: clamp(1.4rem, 2.4vw, 1.9rem); margin-bottom: 6px; letter-spacing: -0.01em; }
    .leader-info .role { font-size: 14.5px; color: rgba(255,255,255,.7); margin-bottom: 16px; }
    .leader-info p { font-size: 14.5px; color: rgba(255,255,255,.78); line-height: 1.7; }

    /* team grid */
    .team-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
    .team-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 22px; display: grid; grid-template-columns: 72px 1fr; gap: 18px; align-items: start; transition: transform .25s var(--ease), box-shadow .25s, border-color .25s; }
    .team-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: transparent; }
    .team-photo { width: 72px; height: 72px; border-radius: 18px; background: var(--blue-soft); border: 1px solid var(--line); overflow: hidden; position: relative; flex-shrink: 0; }
    .team-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
    .team-photo label { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; cursor: pointer; }
    .team-photo label i { font-size: 24px; color: var(--blue); }
    .team-photo label span { font-size: 8px; color: var(--muted-2); letter-spacing: .04em; }
    .team-photo input { display: none; }
    .team-name { font-family: 'Lora', serif; font-weight: 600; font-size: 16px; color: var(--ink); line-height: 1.25; }
    .team-role { font-size: 12.5px; color: var(--blue); font-weight: 600; margin: 4px 0 10px; }
    .team-bio { font-size: 13px; color: var(--muted); line-height: 1.6; }
    .tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
    .tag { font-size: 11.5px; font-weight: 600; padding: 4px 10px; border-radius: var(--r-pill); background: var(--blue-soft); color: var(--ink-3); }
    .tag.amber { background: var(--amber-soft); color: var(--amber-deep); }
    .tag.teal { background: #e7eef1; color: #2f5d6b; }

    /* awards */
    .awards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .award { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 24px; position: relative; overflow: hidden; transition: transform .25s var(--ease), box-shadow .25s; }
    .award:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
    .award-ic { width: 48px; height: 48px; border-radius: 14px; display: flex; align-items: center; justify-content: center; margin-bottom: 16px; }
    .award-ic i { font-size: 24px; }
    .award h4 { font-family: 'Lora', serif; font-size: 17px; color: var(--ink); margin-bottom: 8px; }
    .award p { font-size: 13.5px; color: var(--muted); line-height: 1.6; }
    .award-year { position: absolute; top: 20px; right: 22px; font-family: 'Lora', serif; font-weight: 700; font-size: 14px; color: var(--line-2); }

    /* ════════════ PROGRAMS ════════════ */
    .prog-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
    .prog-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r-xl); overflow: hidden; transition: transform .3s var(--ease), box-shadow .3s; display: flex; flex-direction: column; cursor: pointer; }
    .prog-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
    .prog-card:hover .focus-link i { transform: translateX(4px); }
    .prog-card-date { position: absolute; top: 16px; right: 16px; z-index: 3; background: rgba(10,37,64,.68); backdrop-filter: blur(4px); color: #fff; font-size: 12px; font-weight: 600; padding: 6px 12px; border-radius: var(--r-pill); }
    .prog-media { position: relative; aspect-ratio: 16/8; background: var(--accent, var(--blue)); display: flex; align-items: center; justify-content: center; overflow: hidden; }
    .prog-media img, .prog-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
    .prog-media-up { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; cursor: pointer; color: #fff; z-index: 2; }
    .prog-media-up input { display: none; }
    .prog-media-up i { font-size: 30px; opacity: .9; }
    .prog-media-up span { font-size: 12.5px; opacity: .85; }
    .prog-media-ic { position: absolute; top: 16px; left: 16px; width: 46px; height: 46px; border-radius: 13px; background: rgba(255,255,255,.92); display: flex; align-items: center; justify-content: center; z-index: 3; box-shadow: var(--shadow-sm); }
    .prog-media-ic i { font-size: 24px; color: var(--accent, var(--blue)); }
    /* provision: card awaiting its real photo — drop an <img> in .prog-media to replace */
    .prog-media.pending { background: var(--bg); border-bottom: 2px dashed var(--line-2); display: flex; align-items: center; justify-content: center; }
    .prog-media.pending .pending-note { display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--muted-2); }
    .prog-media.pending .pending-note i { font-size: 30px; color: var(--accent, var(--blue)); opacity: .55; }
    .prog-media.pending .pending-note span { font-size: 12px; font-weight: 600; letter-spacing: .03em; }
    .prog-media.pending .prog-media-ic { background: #fff; }
    .prog-body { padding: 26px; flex: 1; display: flex; flex-direction: column; }
    .prog-loc { font-size: 12.5px; color: var(--muted-2); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
    .prog-card h3 { font-family: 'Lora', serif; font-weight: 600; font-size: 21px; color: var(--ink); margin-bottom: 10px; letter-spacing: -0.01em; }
    .prog-card p { font-size: 14.5px; color: var(--muted); line-height: 1.65; margin-bottom: 16px; flex: 1; }

    /* ════════════ MEDIA / NEWS ════════════ */
    .news-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: clamp(1.5rem, 3vw, 2.5rem); align-items: start; }
    .outlet { background: #fff; border: 1px solid var(--line); border-radius: var(--r-md); padding: 20px 22px; display: grid; grid-template-columns: 12px 1fr auto; gap: 16px; align-items: center; transition: background .15s, transform .15s; margin-bottom: 12px; }
    .outlet:hover { background: var(--blue-soft); transform: translateX(3px); }
    .outlet-dot { width: 11px; height: 11px; border-radius: 50%; }
    .outlet-name { font-family: 'Lora', serif; font-weight: 600; font-size: 15px; color: var(--ink); }
    .outlet-head { font-size: 13.5px; color: var(--muted); margin-top: 3px; }
    .outlet-date { font-size: 12.5px; color: var(--muted-2); white-space: nowrap; }
    .press-panel { background: var(--ink); border-radius: var(--r-xl); padding: 30px; color: #fff; position: relative; overflow: hidden; }
    .press-panel::before { content: ""; position: absolute; top: -30%; right: -20%; width: 300px; height: 300px; background: radial-gradient(circle, rgba(217,128,47,.18), transparent 60%); }
    .press-panel h3 { position: relative; font-family: 'Lora', serif; font-size: 22px; margin-bottom: 10px; }
    .press-panel p { position: relative; font-size: 14px; color: rgba(255,255,255,.72); line-height: 1.65; margin-bottom: 20px; }
    .press-count { position: relative; display: flex; gap: 22px; margin-bottom: 22px; }
    .press-count .n { font-family: 'Lora', serif; font-weight: 700; font-size: 30px; color: var(--amber); }
    .press-count .l { font-size: 12.5px; color: rgba(255,255,255,.6); }

    /* ════════════ GALLERY ════════════ */
    .gal-controls { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }
    .filters { display: flex; gap: 8px; flex-wrap: wrap; }
    .filter { font-size: 13.5px; font-weight: 600; padding: 9px 18px; border-radius: var(--r-pill); border: 1px solid var(--line-2); color: var(--muted); background: #fff; cursor: pointer; transition: all .18s; }
    .filter:hover { border-color: var(--blue); color: var(--blue); }
    .filter.is-active { background: var(--ink); border-color: var(--ink); color: #fff; }
    .gal-upload { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-size: 14px; font-weight: 600; color: var(--blue); }
    .gal-upload input { display: none; }
    .gal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .gal-card { position: relative; border-radius: var(--r-lg); overflow: hidden; background: var(--blue-soft); border: 1px solid var(--line); aspect-ratio: 4/3.2; cursor: pointer; transition: transform .3s var(--ease), box-shadow .3s; }
    .gal-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }
    .gal-card img, .gal-card video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
    .gal-card:hover img { transform: scale(1.06); }
    .gal-up { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; cursor: pointer; color: var(--blue); z-index: 1; }
    .gal-up input { display: none; }
    .gal-up i { font-size: 26px; opacity: .65; }
    .gal-cat-ic { font-size: 30px !important; }
    .gal-overlay { position: absolute; inset: 0; z-index: 2; background: linear-gradient(to top, rgba(10,37,64,.85) 0%, rgba(10,37,64,.1) 55%, transparent 100%); opacity: 0; transition: opacity .3s; display: flex; flex-direction: column; justify-content: flex-end; padding: 18px; pointer-events: none; }
    .gal-card:hover .gal-overlay { opacity: 1; }
    .gal-cap { font-size: 13.5px; font-weight: 600; color: #fff; line-height: 1.4; }
    .gal-meta { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
    .gal-pill { font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: var(--r-pill); background: var(--amber); color: #fff; text-transform: capitalize; }
    .gal-count { font-size: 11.5px; color: rgba(255,255,255,.8); display: flex; align-items: center; gap: 4px; }
    /* default static label shown when no overlay (for empty slots) */
    .gal-static { position: absolute; left: 0; bottom: 0; right: 0; z-index: 1; padding: 14px; background: linear-gradient(to top, rgba(10,37,64,.78), transparent); }
    .gal-static .c { font-size: 12.5px; font-weight: 600; color: #fff; line-height: 1.35; }
    .gal-static .t { font-size: 10.5px; font-weight: 700; color: var(--amber); text-transform: uppercase; letter-spacing: .05em; margin-top: 4px; display: block; }

    /* ════════════ CONTACT ════════════ */
    .contact-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(1.5rem, 3vw, 3rem); align-items: start; }
    .contact-info .crow { display: flex; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--line); }
    .contact-info .crow:first-child { padding-top: 0; }
    .crow-ic { width: 46px; height: 46px; border-radius: 13px; background: var(--blue-soft); color: var(--blue); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .crow-ic i { font-size: 22px; }
    .crow p { font-size: 15px; font-weight: 600; color: var(--ink); }
    .crow span { font-size: 13px; color: var(--muted); }
    .form-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r-xl); padding: clamp(1.5rem, 3vw, 2.4rem); box-shadow: var(--shadow-sm); }
    .form-card h3 { font-family: 'Lora', serif; font-size: 20px; color: var(--ink); margin-bottom: 6px; }
    .form-card .sub { font-size: 14px; color: var(--muted); margin-bottom: 22px; }
    .field { margin-bottom: 16px; }
    .field label { display: block; font-size: 13px; font-weight: 600; color: var(--ink); margin-bottom: 7px; }
    .field input, .field select, .field textarea {
      width: 100%; font-family: inherit; font-size: 14.5px; color: var(--text);
      padding: 13px 15px; border: 1.5px solid var(--line-2); border-radius: var(--r-md); background: #fff; transition: border-color .15s, box-shadow .15s;
    }
    .field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(39,90,144,.12); }
    .field textarea { resize: vertical; min-height: 110px; }
    .field-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

    /* ════════════ FOOTER ════════════ */
    .footer { background: var(--ink); color: #fff; }
    .footer-top { display: grid; grid-template-columns: 2fr 1fr 1fr 1.4fr; gap: clamp(2rem, 4vw, 4rem); padding-top: clamp(3rem, 5vw, 4.5rem); padding-bottom: 3rem; }
    .footer-lockup { display: flex; align-items: center; gap: 13px; margin-bottom: 16px; }
    .footer-badge { width: 46px; height: 46px; border-radius: 12px; background: #fff; background-image: var(--logo); background-repeat: no-repeat; background-position: center; background-size: auto 82%; flex-shrink: 0; }
    .footer-brand .bn { font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: 22px; margin-bottom: 0; }
    .footer-brand .spectrum { margin-bottom: 16px; }
    .footer-brand p { font-size: 14px; color: rgba(255,255,255,.6); line-height: 1.7; max-width: 34ch; }
    .footer-col h5 { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.45); margin-bottom: 16px; }
    .footer-col a { display: block; font-size: 14px; color: rgba(255,255,255,.7); margin-bottom: 11px; cursor: pointer; transition: color .15s, padding-left .15s; }
    .footer-col a:hover { color: #fff; padding-left: 4px; }
    .footer-news p { font-size: 13.5px; color: rgba(255,255,255,.6); margin-bottom: 14px; line-height: 1.6; }
    .footer-news .fbox { display: flex; gap: 8px; }
    .footer-news input { flex: 1; min-width: 0; font-family: inherit; font-size: 13.5px; padding: 11px 14px; border-radius: var(--r-pill); border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: #fff; }
    .footer-news input::placeholder { color: rgba(255,255,255,.4); }
    .footer-news input:focus { outline: none; border-color: var(--amber); }
    .footer-news button { flex-shrink: 0; width: 46px; height: 46px; border-radius: 50%; background: var(--amber); color: #fff; display: flex; align-items: center; justify-content: center; transition: background .15s; }
    .footer-news button:hover { background: var(--amber-deep); }
    .footer-bottom { border-top: 1px solid rgba(255,255,255,.1); padding: 20px 0; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
    .footer-bottom span { font-size: 12.5px; color: rgba(255,255,255,.4); }

    /* ════════════ REVEAL ════════════ */
    .reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
    .reveal.in { opacity: 1; transform: none; }

    /* ════════════ RESPONSIVE ════════════ */
    @media (max-width: 1000px) {
      .hero-inner { grid-template-columns: 1fr; }
      .hero-media { aspect-ratio: 16/11; max-height: 420px; order: -1; }
      .hero-stats, .hero-stats.cols-3 { grid-template-columns: repeat(2, 1fr); }
      .focus-grid { grid-template-columns: repeat(2, 1fr); }
      .impact-grid, .impact-grid.cols-3 { grid-template-columns: repeat(2, 1fr); gap: 2rem 1.5rem; }
      .ibig + .ibig { border-left: none; padding-left: 0; }
      .ibig:nth-child(2) { border-left: 1px solid rgba(255,255,255,.12); padding-left: 1.5rem; }
      .split, .split.rev .split-media { grid-template-columns: 1fr; }
      .split.rev .split-media, .split .split-media { order: -1; }
      .about-grid { grid-template-columns: 1fr; }
      .leader-feature { grid-template-columns: 1fr; }
      .leader-photo-lg { max-width: 220px; }
      .news-grid { grid-template-columns: 1fr; }
      .contact-grid { grid-template-columns: 1fr; }
      .gal-grid { grid-template-columns: repeat(2, 1fr); }
      .footer-top { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 760px) {
      .nav-links { display: none; }
      .nav-toggle { display: flex; }
      .nav-cta .btn:not(.nav-toggle) { display: none; }
      /* absolute (not fixed): .nav's backdrop-filter makes it the containing block, which collapses a fixed panel */
      .mobile-menu.open { display: block; position: absolute; top: 100%; left: 0; right: 0; height: calc(100vh - 76px); z-index: 99; background: var(--bg); padding: 24px var(--pad); overflow-y: auto; }
      .mobile-menu a { display: block; font-family: 'Lora', serif; font-weight: 600; font-size: 26px; color: var(--ink); padding: 14px 0; border-bottom: 1px solid var(--line); }
      .mobile-menu .btn { margin-top: 24px; width: 100%; justify-content: center; font-family: 'Montserrat', sans-serif; font-size: 17px; color: #fff; border-bottom: none; }
      .prog-grid { grid-template-columns: 1fr; }
      .team-grid { grid-template-columns: 1fr; }
      .awards { grid-template-columns: 1fr; }
      .mv-grid { grid-template-columns: 1fr; }
      .field-2 { grid-template-columns: 1fr; }
    }
    @media (max-width: 480px) {
      .hero-stats, .hero-stats.cols-3 { grid-template-columns: 1fr 1fr; gap: 10px; }
      .focus-grid { grid-template-columns: 1fr; }
      .impact-grid, .impact-grid.cols-3 { grid-template-columns: 1fr 1fr; }
      .gal-grid { grid-template-columns: 1fr 1fr; }
      .footer-top { grid-template-columns: 1fr; }
      .partners-inner { gap: 14px; }
    }
    @media (prefers-reduced-motion: reduce) {
      * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
      .reveal { opacity: 1; transform: none; }
    }

    /* ════════════ ADDITIONS: ACCESSIBILITY ════════════ */
    .skip-link {
      position: absolute; left: -9999px; top: 0; z-index: 999;
      background: var(--ink); color: #fff; padding: 12px 20px; border-radius: 0 0 12px 0;
      font-weight: 600; font-size: 14px;
    }
    .skip-link:focus { left: 0; }
    a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
      outline: 2px solid var(--blue); outline-offset: 2px;
    }

    /* ════════════ ADDITIONS: MEDIA FRAMES ════════════ */
    .hero-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
    .photo-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
    .photo-strip figure { position: relative; border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--line); background: var(--blue-soft); aspect-ratio: 4/3; margin: 0; }
    .photo-strip img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
    .photo-strip figure:hover img { transform: scale(1.05); }
    .photo-strip figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 14px 12px; font-size: 12.5px; font-weight: 600; color: #fff; background: linear-gradient(to top, rgba(10,37,64,.78), transparent); }

    /* ════════════ ADDITIONS: FLAGSHIP SHOWCASE ════════════ */
    .flagship { background: #fff; border: 1px solid var(--line); border-radius: var(--r-xl); overflow: hidden; box-shadow: var(--shadow-sm); }
    .flagship + .flagship { margin-top: clamp(2rem, 4vw, 3rem); }
    .flagship-head { display: grid; grid-template-columns: 1.05fr .95fr; gap: 0; align-items: stretch; }
    .flagship-head.rev .flagship-media { order: 2; }
    .flagship-media { position: relative; min-height: 340px; background: var(--blue-soft); }
    .flagship-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
    .flagship-copy { padding: clamp(1.8rem, 3.5vw, 3rem); }
    .flagship-copy h2 { color: var(--ink); margin-bottom: 14px; }
    .flagship-copy .lead { font-size: 15.5px; margin-bottom: 4px; }
    .flagship-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 22px 0 4px; }
    .fstat { background: var(--bg); border: 1px solid var(--line); border-radius: var(--r-md); padding: 14px 16px; }
    .fstat .n { font-family: 'Lora', serif; font-weight: 700; font-size: 22px; color: var(--ink); }
    .fstat .n em { font-style: normal; color: var(--amber); }
    .fstat .l { font-size: 12px; color: var(--muted); margin-top: 2px; line-height: 1.4; }
    .flagship-gallery { padding: 0 clamp(1.8rem, 3.5vw, 3rem) clamp(1.8rem, 3.5vw, 3rem); }
    .flagship-lists { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 3vw, 3rem); padding: 0 clamp(1.8rem, 3.5vw, 3rem); margin-bottom: clamp(1.6rem, 3vw, 2.2rem); }
    .flagship-photos { padding: 0 clamp(1.8rem, 3.5vw, 3rem) clamp(1.8rem, 3.5vw, 3rem); }
    @media (max-width: 700px) { .flagship-lists { grid-template-columns: 1fr; } }

    /* ════════════ ADDITIONS: TIMELINE ════════════ */
    .timeline { position: relative; margin-top: 10px; }
    .timeline::before { content: ""; position: absolute; left: 7px; top: 6px; bottom: 6px; width: 2px; background: var(--line-2); }
    .tl-item { position: relative; padding: 0 0 28px 36px; }
    .tl-item:last-child { padding-bottom: 0; }
    .tl-item::before { content: ""; position: absolute; left: 0; top: 6px; width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 4px solid var(--amber); box-shadow: var(--shadow-sm); }
    .tl-year { font-family: 'Lora', serif; font-weight: 700; font-size: 15px; color: var(--blue); letter-spacing: .02em; }
    .tl-item h4 { font-family: 'Lora', serif; font-size: 17px; color: var(--ink); margin: 4px 0 6px; }
    .tl-item p { font-size: 14px; color: var(--muted); line-height: 1.65; max-width: 62ch; }

    /* ════════════ ADDITIONS: VALUES ════════════ */
    .values-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
    .value-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 24px; transition: transform .25s var(--ease), box-shadow .25s; }
    .value-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
    .value-card .v-ic { width: 46px; height: 46px; border-radius: 13px; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; background: var(--blue-soft); color: var(--blue); }
    .value-card .v-ic i { font-size: 23px; }
    .value-card h4 { font-family: 'Lora', serif; font-size: 16.5px; color: var(--ink); margin-bottom: 7px; }
    .value-card p { font-size: 13.5px; color: var(--muted); line-height: 1.6; }

    /* monogram avatars for team (no photos available) */
    .team-photo.mono { display: flex; align-items: center; justify-content: center; background: linear-gradient(150deg, var(--ink-2), var(--blue-bright)); }
    .team-photo.mono span { font-family: 'Lora', serif; font-weight: 700; font-size: 22px; color: #fff; letter-spacing: .02em; }
    .leader-photo-lg img { cursor: default; }

    /* ════════════ ADDITIONS: STORY CARDS ════════════ */
    .story-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
    .story-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 28px 26px; display: flex; flex-direction: column; transition: transform .25s var(--ease), box-shadow .25s; }
    .story-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
    .story-card .q-mark { font-family: 'Lora', serif; font-size: 46px; line-height: .6; color: var(--amber); margin-bottom: 14px; }
    .story-card blockquote { font-size: 14.5px; color: var(--text); line-height: 1.7; margin: 0 0 18px; flex: 1; }
    .story-card cite { font-style: normal; border-top: 1px solid var(--line); padding-top: 14px; }
    .story-card cite b { display: block; font-size: 14.5px; color: var(--ink); }
    .story-card cite span { font-size: 12.5px; color: var(--muted); }

    /* ════════════ ADDITIONS: DONATE ════════════ */
    .tier-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
    .tier { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 28px 26px; position: relative; overflow: hidden; transition: transform .25s var(--ease), box-shadow .25s, border-color .25s; }
    .tier:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); border-color: transparent; }
    .tier::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--accent, var(--blue)); }
    .tier .amount { font-family: 'Lora', serif; font-weight: 700; font-size: 26px; color: var(--ink); margin-bottom: 4px; }
    .tier .gives { font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--accent, var(--blue)); margin-bottom: 12px; }
    .tier p { font-size: 14px; color: var(--muted); line-height: 1.65; }
    .transparency { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }

    /* ════════════ ADDITIONS: DONATE GIVE BAND (copy + bank details + QR) ════════════ */
    .give-band { position: relative; overflow: hidden; border-radius: var(--r-xl); padding: clamp(2rem, 4.5vw, 4rem); display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(2rem, 4vw, 3.5rem); align-items: center; }
    .give-band::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 20% 20%, rgba(39,90,144,.25), transparent 45%), radial-gradient(circle at 85% 80%, rgba(217,128,47,.22), transparent 45%); }
    .give-band > * { position: relative; }
    .give-band h2 { color: #fff; margin-bottom: 16px; }
    .give-band .lead { margin-bottom: 4px; }
    .bank-card { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.16); border-radius: var(--r-lg); padding: 22px 24px; margin: 24px 0; backdrop-filter: blur(4px); }
    .bank-title { font-family: 'Lora', serif; font-weight: 600; font-size: 17px; color: #fff; margin-bottom: 10px; display: flex; align-items: center; gap: 10px; }
    .bank-title::before { content: ""; width: 20px; height: 3px; border-radius: 2px; background: var(--amber); }
    .bank-facts tr { border-bottom: 1px solid rgba(255,255,255,.1); }
    .bank-facts td:first-child { color: rgba(255,255,255,.55); }
    .bank-facts td:last-child { color: #fff; }
    .bank-note { font-size: 13px; color: rgba(255,255,255,.6); line-height: 1.6; margin-top: 12px; }
    .give-note { margin-top: 20px; font-size: 13px; color: rgba(255,255,255,.55); }
    .give-note a { color: rgba(255,255,255,.8); text-decoration: underline; }
    .give-qr { display: flex; flex-direction: column; align-items: center; gap: 18px; text-align: center; }
    .qr-frame { position: relative; width: min(272px, 78vw); aspect-ratio: 1; flex-shrink: 0; background: #fff; border-radius: var(--r-lg); padding: 8px; box-shadow: var(--shadow-md); }
    .qr-frame img { width: 100%; height: 100%; object-fit: contain; border-radius: 8px; }
    .qr-frame .qr-placeholder { display: none; }
    /* provision state: no QR image yet — dashed slot with icon until the QR file is added */
    .qr-frame.qr-missing img { display: none; }
    .qr-frame.qr-missing { background: rgba(255,255,255,.06); border: 2px dashed rgba(255,255,255,.35); box-shadow: none; }
    .qr-frame.qr-missing .qr-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; height: 100%; color: rgba(255,255,255,.65); }
    .qr-frame.qr-missing .qr-placeholder i { font-size: 44px; color: var(--gold); }
    .qr-frame.qr-missing .qr-placeholder span { font-size: 12.5px; line-height: 1.5; text-align: center; max-width: 20ch; }
    .qr-caption { max-width: 32ch; }
    .qr-caption h3 { font-family: 'Lora', serif; font-weight: 600; font-size: 20px; color: #fff; margin-bottom: 8px; }
    .qr-caption p { font-size: 14px; color: rgba(255,255,255,.72); line-height: 1.65; }
    @media (max-width: 900px) {
      .give-band { grid-template-columns: 1fr; }
      .give-qr { order: -1; }
      .bank-facts td { font-size: 13.5px; }
      .bank-facts td:last-child { word-break: break-all; }
      .give-band .cta-actions { justify-content: center !important; }
      .give-band .cta-actions .btn { width: 100%; justify-content: center; }
      .give-copy .eyebrow { justify-content: flex-start; }
    }

    /* ════════════ ADDITIONS: GALLERY (REAL) ════════════ */
    .gal-card { aspect-ratio: 4/3.2; }
    .gal-card.doc { aspect-ratio: 3/3.6; }
    .gal-card img { cursor: zoom-in; }
    .gal-count-note { font-size: 13.5px; color: var(--muted); }

    /* lightbox */
    .lightbox { position: fixed; inset: 0; z-index: 300; background: rgba(8,20,36,.92); display: none; align-items: center; justify-content: center; padding: 24px; }
    .lightbox.open { display: flex; }
    .lb-frame { position: relative; max-width: min(1080px, 94vw); width: 100%; display: flex; flex-direction: column; align-items: center; }
    .lb-frame img { max-width: 100%; max-height: 78vh; width: auto; height: auto; border-radius: 12px; box-shadow: 0 30px 80px rgba(0,0,0,.5); position: static; }
    .lb-cap { margin-top: 16px; color: rgba(255,255,255,.85); font-size: 14px; text-align: center; max-width: 70ch; }
    .lb-cap .cat { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gold); margin-right: 10px; }
    .lb-btn { position: absolute; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; border-radius: 50%; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); color: #fff; display: flex; align-items: center; justify-content: center; transition: background .15s; }
    .lb-btn:hover { background: rgba(255,255,255,.24); }
    .lb-btn i { font-size: 24px; }
    .lb-prev { left: -6px; } .lb-next { right: -6px; }
    .lb-close { position: fixed; top: 20px; right: 24px; width: 48px; height: 48px; border-radius: 50%; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); color: #fff; display: flex; align-items: center; justify-content: center; }
    .lb-close:hover { background: rgba(255,255,255,.24); }
    .lb-close i { font-size: 24px; }

    /* ════════════ ADDITIONS: FORMS ════════════ */
    .field .err { display: none; font-size: 12.5px; color: #c0392b; margin-top: 6px; }
    .field.invalid input, .field.invalid textarea, .field.invalid select { border-color: #c0392b; }
    .field.invalid .err { display: block; }
    .form-note { display: none; margin-top: 16px; padding: 14px 16px; border-radius: var(--r-md); background: #eaf5e9; border: 1px solid #bfdcbc; color: #2d6a2a; font-size: 14px; }
    .form-note.show { display: block; }
    .form-note.is-error { background: #fbe9e7; border-color: #f3c8c2; color: #a83a2c; }
    /* honeypot: off-screen but present in the DOM, so basic bots that fill every field trip it */
    .hp-field { position: absolute; left: -9999px; top: -9999px; width: 1px; height: 1px; opacity: 0; }

    /* map */
    .map-frame { border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--line); box-shadow: var(--shadow-sm); margin-top: 28px; }
    .map-frame iframe { display: block; width: 100%; height: 360px; border: 0; }

    /* socials */
    .socials { display: flex; gap: 10px; margin-top: 18px; }
    .socials a { width: 42px; height: 42px; border-radius: 12px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); color: #fff; display: flex; align-items: center; justify-content: center; transition: background .15s, transform .15s; }
    .socials a:hover { background: var(--amber); transform: translateY(-2px); }
    .socials.on-light a { background: var(--blue-soft); border-color: var(--line); color: var(--blue); }
    .socials.on-light a:hover { background: var(--amber); color: #fff; }

    /* media coverage strip */
    .clips { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
    .clip { position: relative; border-radius: var(--r-md); overflow: hidden; border: 1px solid var(--line); background: #fff; aspect-ratio: 4/4.6; }
    .clip img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform .4s var(--ease); }
    .clip:hover img { transform: scale(1.04); }

    /* ════════════ ADDITIONS: RESPONSIVE ════════════ */
    @media (max-width: 1000px) {
      .flagship-head { grid-template-columns: 1fr; }
      .flagship-head.rev .flagship-media { order: -1; }
      .flagship-media { min-height: 260px; aspect-ratio: 16/9; }
      .values-grid { grid-template-columns: repeat(2, 1fr); }
      .story-grid { grid-template-columns: 1fr; }
      .tier-grid { grid-template-columns: 1fr; }
      .transparency { grid-template-columns: 1fr; }
      .clips { grid-template-columns: repeat(3, 1fr); }
      .photo-strip { grid-template-columns: repeat(3, 1fr); }
    }
    @media (max-width: 760px) {
      .values-grid { grid-template-columns: 1fr; }
      .flagship-stats { grid-template-columns: repeat(3, 1fr); gap: 8px; }
      .photo-strip { grid-template-columns: 1fr 1fr; }
      .clips { grid-template-columns: repeat(2, 1fr); }
      .lb-prev { left: 4px; } .lb-next { right: 4px; }
    }

    /* anchor-based brand + nav links */
    a.brand { display: flex; }
    .brand-badge, .footer-badge { display: block; }
    a.nav-link { display: inline-block; }

    /* flagship detail two-column */
    .flagship-detail { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.2rem, 2.5vw, 2rem); align-items: start; }
    @media (max-width: 860px) { .flagship-detail { grid-template-columns: 1fr; } }

    /* ════════════ HOME PAGE ONLY: PARALLAX + HOVER ════════════ */
    /* Parallax images: JS drives --py; slight over-scale hides the shifting edges */
    .page-home .hero-media img,
    .page-home .split-media img {
      transform: translateY(var(--py, 0px)) scale(1.12);
      will-change: transform;
      transition: transform .18s linear;
    }
    /* Media frames lift on hover instead of zooming (zoom would fight the parallax transform) */
    .page-home .hero-media,
    .page-home .split-media {
      transition: transform .35s var(--ease), box-shadow .35s var(--ease);
    }
    .page-home .hero-media:hover,
    .page-home .split-media:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }

    /* Gallery preview: card lift + caption slide on top of the existing image zoom */
    .page-home .photo-strip figure { transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
    .page-home .photo-strip figure:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
    .page-home .photo-strip figcaption { transform: translateY(6px); opacity: .85; transition: transform .35s var(--ease), opacity .35s; }
    .page-home .photo-strip figure:hover figcaption { transform: none; opacity: 1; }

    /* Focus cards: icon tilt */
    .page-home .focus-ic { transition: transform .3s var(--ease); }
    .page-home .focus-card:hover .focus-ic { transform: scale(1.1) rotate(-5deg); }

    /* Hero stat cards: accent the number on hover */
    .page-home .hstat-num { transition: color .25s; }
    .page-home .hstat:hover .hstat-num { color: var(--blue); }

    /* Partner chips */
    .page-home .partner-chip { transition: opacity .2s, transform .25s var(--ease); }
    .page-home .partner-chip:hover { transform: translateY(-3px); }

    /* Story cards: quote mark warms up */
    .page-home .story-card .q-mark { transition: transform .3s var(--ease); }
    .page-home .story-card:hover .q-mark { transform: scale(1.15); }

    /* Respect reduced motion: no parallax, no decorative movement */
    @media (prefers-reduced-motion: reduce) {
      .page-home .hero-media img,
      .page-home .split-media img { transform: scale(1.02); }
    }