/* =======================================================
   Paeonia Medical Initiative
   Dark · Sleek · Editorial — v2 redesign layer
   Inspired by: igloo.inc + cosmos.network
   Loaded after style.css; overrides aggressively.
   ======================================================= */

/* ---------- TOKENS ---------- */
:root {
    /* ---- LIGHT THEME ---- */
    --pae-bg:          #EDF1EE;          /* soft off-white, faint green tint */
    --pae-bg-2:        #FFFFFF;          /* cards / raised surfaces */
    --pae-surface:     #F5F8F6;
    --pae-surface-2:   #E6ECE8;
    --pae-line:        rgba(18,33,27,.13);
    --pae-line-soft:   rgba(18,33,27,.07);
    --pae-text:        #14211B;          /* near-black ink, slight green */
    --pae-text-dim:    #2C3832;
    --pae-text-faint:  #8B988F;
    --pae-mint:        #0C9C84;          /* deep teal-green, reads on light */
    --pae-mint-soft:   #0A7A68;
    --pae-magenta:     #C42E8C;
    --pae-magenta-soft:#9A1E6C;
    --pae-teal-accent: #1397AC;

    /* ---- DARK-BAND TOKENS (faded-photo sections) ---- */
    --pae-ink:         #0B1A24;          /* deep navy/teal for dark bands */
    --pae-ink-2:       #0E2230;
    --pae-mint-bright: #6FE3B8;          /* glows on dark */
    --pae-on-ink:      #ECEFF2;
    --pae-on-ink-dim:  rgba(236,239,242,.68);
    --pae-ink-line:    rgba(255,255,255,.14);

    --display: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    --sans:    'Helvetica Neue', Helvetica, Arial, sans-serif;
    --mono:    'Helvetica Neue', Helvetica, Arial, sans-serif;

    --radius: 4px;
    --radius-lg: 12px;
    --easing: cubic-bezier(.2, .8, .2, 1);
}

/* Hero feature photo (homepage) */
.hero-feature-photo {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: var(--radius-lg);
    overflow: hidden;
    margin-bottom: 24px;
    background: var(--pae-bg-2);
}
.hero-feature-photo img {
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: center;
    filter: contrast(1.05) brightness(.92);
    transition: transform .8s var(--easing), filter .6s var(--easing);
}
.hero-right:hover .hero-feature-photo img { transform: scale(1.04); filter: contrast(1.05) brightness(1); }
.hero-feature-tag {
    position: absolute;
    bottom: 16px; left: 16px;
    background: rgba(11, 26, 36, .82);
    backdrop-filter: blur(10px);
    border: 1px solid var(--pae-ink-line);
    color: var(--pae-mint-bright);
    padding: 8px 14px;
    border-radius: 999px;
    font-family: var(--mono);
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.hero-feature-tag i { color: var(--pae-mint-bright); }

/* ---------- BASE ---------- */
html { scroll-behavior: smooth; background: var(--pae-bg); }
body {
    background: var(--pae-bg) !important;
    color: var(--pae-text) !important;
    font-family: var(--sans) !important;
    font-feature-settings: "ss01","cv11";
    font-size: 16px;
    line-height: 1.55;
    letter-spacing: -0.005em;
    overflow-x: hidden;
}
main { background: var(--pae-bg); position: relative; }

::selection { background: var(--pae-mint); color: var(--pae-bg); }

/* Scroll-reveal — keep content visible by default, motion is purely additive. */
@keyframes paeFadeUpAuto {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}
.fade-up {
    opacity: 1;
    transform: none;
    will-change: opacity, transform;
}
.fade-up.appeared, .fade-up.in-view {
    opacity: 1;
    transform: none;
}
@media (prefers-reduced-motion: reduce) {
    .fade-up { animation: none !important; opacity: 1 !important; transform: none !important; }
}

/* H1 character drop-in — also pure CSS, runs once on load */
@keyframes paeCharIn {
    from { opacity: 0; transform: translateY(.4em); }
    to   { opacity: 1; transform: translateY(0); }
}
.char-anim .ch {
    display: inline-block;
    opacity: 1 !important;
    animation: none !important;
    transform: none !important;
}

/* Slow drift behind the page */
@keyframes drift1 {
    0%, 100% { transform: translate3d(0,0,0); }
    50%      { transform: translate3d(40px,-30px,0); }
}
@keyframes drift2 {
    0%, 100% { transform: translate3d(0,0,0); }
    50%      { transform: translate3d(-30px,20px,0); }
}

/* Type */
h1, h2, h3, h4 {
    font-family: var(--display) !important;
    font-weight: 500 !important;
    letter-spacing: -0.025em !important;
    color: var(--pae-text) !important;
    text-wrap: pretty;
}
h1, h2, h3, h4 {
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}
h1 { line-height: 0.95 !important; font-weight: 600 !important; letter-spacing: -0.035em !important; }
h2 { line-height: 1.0 !important; }
h3 { line-height: 1.1 !important; }

p { color: var(--pae-text-dim); }
a { color: inherit; }

/* Background grain + subtle vertical lines à la cosmos */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    background-image:
        radial-gradient(ellipse 80% 50% at 50% -20%, rgba(111, 227, 184, .08), transparent 60%),
        radial-gradient(ellipse 60% 40% at 100% 100%, rgba(232, 68, 164, .06), transparent 60%);
    pointer-events: none;
    z-index: 0;
    animation: drift1 28s ease-in-out infinite;
}
body::after {
    content: "";
    position: fixed;
    inset: 0;
    background-image:
        radial-gradient(ellipse 50% 35% at 0% 30%, rgba(111, 227, 184, .04), transparent 60%);
    pointer-events: none;
    z-index: 0;
    animation: drift2 40s ease-in-out infinite;
}
main > * { position: relative; z-index: 1; }

/* ---------- NAVBAR ---------- */
.navbar {
    background: rgba(255, 255, 255, .78) !important;
    backdrop-filter: blur(16px) saturate(1.2) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.2);
    border-bottom: 1px solid var(--pae-line) !important;
    padding: 14px 32px !important;
    z-index: 100 !important;
}
.logo img {
    width: 44px !important;
    filter: brightness(1.05);
}
.desktop-nav { gap: 36px !important; align-items: center; }
.desktop-nav a {
    font-family: var(--mono) !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.14em !important;
    color: var(--pae-text-dim) !important;
    font-weight: 400 !important;
    transition: color .25s var(--easing) !important;
}
.desktop-nav a::after {
    background: var(--pae-mint) !important;
    height: 1px !important;
    bottom: -8px !important;
}
.desktop-nav a:hover, .desktop-nav a.active { color: var(--pae-text) !important; }
.desktop-nav a.active { color: var(--pae-mint) !important; }

.desktop-join {
    border: 1px solid var(--pae-mint) !important;
    color: var(--pae-mint) !important;
    background: transparent !important;
    padding: 9px 18px !important;
    border-radius: 999px !important;
    font-family: var(--mono) !important;
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.12em !important;
    transition: all .25s var(--easing) !important;
}
.desktop-join:hover {
    background: var(--pae-mint) !important;
    color: var(--pae-bg) !important;
    transform: none !important;
    box-shadow: 0 0 24px rgba(111, 227, 184, .35) !important;
}

.hamburger span { background: var(--pae-text) !important; }
.hamburger.active span { background: var(--pae-mint) !important; }

.mobile-menu {
    background: var(--pae-bg-2) !important;
    border-left: 1px solid var(--pae-line) !important;
}
.mobile-menu a {
    font-family: var(--mono) !important;
    text-transform: uppercase !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.1em !important;
    border-radius: 0 !important;
    color: var(--pae-text) !important;
}
.mobile-menu a:hover, .mobile-menu a.active {
    background: var(--pae-surface) !important;
    color: var(--pae-mint) !important;
}
.mobile-menu a::before { background: var(--pae-mint) !important; }
.mobile-join {
    background: var(--pae-mint) !important;
    color: var(--pae-bg) !important;
    border-radius: 999px !important;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-family: var(--mono);
    font-size: 0.85rem !important;
}
.mobile-join:hover { background: var(--pae-text) !important; }

/* ---------- ATOMIC: PRE-TITLE / EYEBROWS ---------- */
.section-code, .pre-title {
    font-family: var(--display) !important;
    font-size: 0.82rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    color: var(--pae-mint) !important;
    border-left: none !important;
    padding-left: 0 !important;
    display: inline-flex !important;
    align-items: center;
    gap: 12px;
}
.section-code::before, .pre-title::before {
    display: none !important;
}

.section-title {
    font-family: var(--display) !important;
    font-size: clamp(2.4rem, 5vw, 4.4rem) !important;
    font-weight: 500 !important;
    letter-spacing: -0.03em !important;
    line-height: 0.98 !important;
    margin: 16px 0 48px !important;
    color: var(--pae-text) !important;
}

/* ---------- BUTTONS (default) ---------- */
.btn-accent, .btn-start-branch, .btn-primary {
    display: inline-flex !important;
    align-items: center !important;
    background: var(--pae-text) !important;
    color: #fff !important;
    border: 1px solid var(--pae-text) !important;
    border-radius: 999px !important;
    padding: 16px 38px !important;
    font-family: var(--display) !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition: background .3s var(--easing), border-color .3s var(--easing), color .3s var(--easing), transform .3s var(--easing) !important;
}
.btn-accent:hover, .btn-start-branch:hover, .btn-primary:hover {
    background: var(--pae-mint) !important;
    border-color: var(--pae-mint) !important;
    color: #fff !important;
    box-shadow: none !important;
    transform: translateY(-2px) !important;
}

/* ---------- CARDS / CHROME — flatten, tint dark surfaces ---------- */
.hero-right,
.spotlight-modern,
.spotlight-right,
.pillar,
.quote-block,
.member,
.impact-section,
.contact-simple,
.mission-block,
.goal-card,
.student-quote,
.world-section,
.programs-header,
.program-card,
.benefit-card,
.quote-stats-section,
.branch-quote-section,
.impact-showcase,
.thank-you-section,
.volunteer-hero-right {
    border-radius: var(--radius-lg) !important;
    box-shadow: none !important;
    color: var(--pae-text);
}

.spotlight-modern,
.mission-block,
.world-section,
.impact-showcase,
.quote-stats-section,
.branch-quote-section,
.contact-simple {
    background: var(--pae-surface) !important;
    border: 1px solid var(--pae-line) !important;
}

/* ---------- HERO (homepage) ---------- */
.hero {
    padding: 100px 32px 120px !important;
    max-width: 1320px !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 80px !important;
    position: relative;
}
@media (max-width: 980px) {
    .hero { grid-template-columns: 1fr !important; gap: 40px !important; }
}
.hero::after {
    content: "";
    position: absolute;
    left: 32px; right: 32px;
    bottom: 0;
    height: 1px;
    background: var(--pae-line);
}
.hero-left h1 {
    font-family: var(--display) !important;
    font-size: clamp(2.8rem, 6.8vw, 5.6rem) !important;
    font-weight: 500 !important;
    letter-spacing: -0.035em !important;
    line-height: 0.96 !important;
    color: var(--pae-text) !important;
    margin: 24px 0 28px !important;
}
.hero-left h1 .accent-highlight {
    color: var(--pae-mint) !important;
    font-style: normal;
}
.hero-left p { color: var(--pae-text-dim) !important; font-size: 1.1rem !important; max-width: 56ch; margin-bottom: 36px !important; }
.hero-left .btn-accent { margin-top: 12px !important; }
.hero-left > span:first-of-type {
    /* "EVENT SPOTLIGHT" eyebrow */
    color: var(--pae-mint) !important;
    border-left: none !important;
    padding-left: 0 !important;
    font-family: var(--mono) !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase;
    display: inline-flex !important;
    align-items: center;
    gap: 12px;
}
.hero-left > span:first-of-type::before {
    content: "";
    width: 24px; height: 1px;
    background: var(--pae-mint);
}

.hero-right {
    background: var(--pae-surface) !important;
    border: 1px solid var(--pae-line) !important;
    border-radius: var(--radius-lg) !important;
    padding: 32px !important;
    text-align: left !important;
    backdrop-filter: blur(12px);
    transition: transform .4s var(--easing), border-color .4s var(--easing) !important;
}
.hero-right:hover {
    transform: translateY(-4px) !important;
    border-color: var(--pae-mint) !important;
}
.hero-right i { color: var(--pae-mint) !important; font-size: 1.6rem !important; margin-bottom: 20px !important; }
.hero-right h3 {
    font-family: var(--display) !important;
    font-size: 1.8rem !important;
    color: var(--pae-text) !important;
    margin-bottom: 8px !important;
}
.hero-right p { color: var(--pae-text-dim) !important; }
.hero-right > div[style*="border-radius"] {
    border-radius: 999px !important;
    background: rgba(232, 68, 164, .12) !important;
    border: 1px solid rgba(232, 68, 164, .35) !important;
    padding: 6px 14px !important;
    font-family: var(--mono) !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    color: var(--pae-magenta) !important;
    letter-spacing: 0.12em !important;
    margin-top: 20px !important;
}

/* ---------- SPOTLIGHT (homepage) ---------- */
.spotlight-modern {
    padding: 56px !important;
    margin: 60px 0 !important;
}
.spotlight-left h2 {
    font-family: var(--display) !important;
    font-size: clamp(2rem, 4vw, 3.2rem) !important;
    color: var(--pae-text) !important;
    line-height: 1.02 !important;
    font-weight: 500 !important;
}
.spotlight-left p { color: var(--pae-text-dim) !important; }
.spotlight-left .stat-badge {
    background: rgba(111, 227, 184, .1) !important;
    border: 1px solid var(--pae-mint) !important;
    border-radius: 999px !important;
    color: var(--pae-mint) !important;
    font-family: var(--mono) !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.12em !important;
    padding: 6px 14px !important;
}
.spotlight-right {
    background: var(--pae-bg-2) !important;
    border: 1px solid var(--pae-line) !important;
    border-radius: var(--radius-lg) !important;
    padding: 28px !important;
}
.metric-icon {
    background: rgba(111, 227, 184, .1) !important;
    border: 1px solid rgba(111, 227, 184, .25) !important;
    border-radius: 999px !important;
    color: var(--pae-mint) !important;
    font-size: 1.1rem !important;
    width: 44px !important; height: 44px !important;
}
.metric-text h4 { font-family: var(--sans) !important; font-size: 1rem !important; font-weight: 600 !important; color: var(--pae-text) !important; }
.metric-text p { font-size: 0.88rem !important; color: var(--pae-text-dim) !important; }

/* ---------- PILLARS — 3-up split with vertical rules ---------- */
.container.pillars {
    max-width: 1320px !important;
    padding: 60px 32px !important;
    margin: 60px auto !important;
    display: flex !important;
}
.pillars { gap: 0 !important; display: flex !important; }
.pillar {
    flex: 1 1 0 !important;
    text-align: left !important;
    padding: 32px 32px !important;
    background: transparent !important;
    border: none !important;
    border-left: 1px solid var(--pae-line) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    min-height: 220px;
    min-width: 0 !important;
    transition: background .3s var(--easing) !important;
}
.pillar:first-child { border-left: none !important; padding-left: 0 !important; }
.pillar:last-child { padding-right: 0 !important; }
.pillar:hover {
    background: linear-gradient(180deg, rgba(111, 227, 184, .04), transparent) !important;
    transform: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}
.pillar .code {
    font-family: var(--display) !important;
    color: var(--pae-mint) !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.12em !important;
    margin-bottom: 28px !important;
}
.pillar h3 {
    font-family: var(--display) !important;
    font-size: 1.7rem !important;
    color: var(--pae-text) !important;
    margin-bottom: 16px !important;
    font-weight: 500 !important;
}
.pillar p { color: var(--pae-text-dim) !important; font-size: 0.98rem !important; }

/* ---------- QUOTE BLOCK ---------- */
.quote-block {
    background: transparent !important;
    border: none !important;
    border-left: 1px solid var(--pae-mint) !important;
    border-radius: 0 !important;
    margin: 100px 0 !important;
    padding: 16px 0 16px 40px !important;
}
.quote-block i { display: none !important; }
.quote-block span {
    font-family: var(--display) !important;
    font-size: clamp(1.6rem, 3vw, 2.6rem) !important;
    color: var(--pae-text) !important;
    line-height: 1.2 !important;
    letter-spacing: -0.02em !important;
    font-weight: 400 !important;
}
.quote-block > div:last-child {
    font-family: var(--mono) !important;
    font-size: 0.95rem !important;
    color: var(--pae-mint) !important;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    margin-top: 32px !important;
}

/* ---------- TEAM (homepage) ---------- */
.team-grid {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 16px !important;
    margin: 32px 0 !important;
    background: transparent !important;
    border: none !important;
}
.member {
    background: var(--pae-surface) !important;
    border: 1px solid var(--pae-line) !important;
    border-radius: var(--radius-lg) !important;
    padding: 0 !important;
    text-align: left !important;
    overflow: hidden;
    transition: transform .4s var(--easing), border-color .4s var(--easing) !important;
}
.member:hover {
    transform: translateY(-4px) !important;
    border-color: var(--pae-mint) !important;
    box-shadow: none !important;
}
.member .avatar {
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    border-radius: 0 !important;
    background: var(--pae-bg-2) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    display: block;
    box-sizing: border-box !important;
}
.member .avatar img {
    width: 100% !important;
    height: 100% !important;
    border-radius: 0 !important;
    object-fit: cover !important;
    object-position: center 28% !important;
    filter: contrast(1.04) saturate(1.05);
    transition: filter .4s var(--easing), transform .6s var(--easing);
}
/* Per-person crop tuning (home team grid) */
.member:nth-of-type(1) .avatar img { object-position: center 22% !important; }
.member:nth-of-type(2) .avatar img { object-position: center 22% !important; }
.member:nth-of-type(3) .avatar img { object-position: center 22% !important; }
.member:nth-of-type(4) .avatar img { object-position: center 14% !important; }
.member:hover .avatar img { filter: none; transform: scale(1.04); }
.member h4 {
    font-family: var(--display) !important;
    font-size: 1.05rem !important;
    color: var(--pae-text) !important;
    margin: 16px 16px 4px !important;
    font-weight: 500 !important;
}
.member.view-more-card {
    background: var(--pae-bg-2) !important;
    border: 1px dashed var(--pae-mint) !important;
}
.view-more-link {
    height: 100%;
    justify-content: center;
    padding: 32px 16px;
}
.view-more-link .avatar {
    background: transparent !important;
    color: var(--pae-mint) !important;
    height: auto !important;
    margin: 0 0 12px !important;
    font-size: 2rem !important;
}
.view-more-link h4 { color: var(--pae-text) !important; margin: 0 !important; }
.view-more-link > div { color: var(--pae-mint) !important; margin: 4px 0 0 !important; }

/* ---------- IMPACT BANNER (numbers row) ---------- */
.impact-section {
    background:
        linear-gradient(135deg, rgba(11,26,36,.90), rgba(14,34,48,.94)),
        url('images/drive1400-1.jpg') left center / cover no-repeat !important;
    color: var(--pae-on-ink) !important;
    border: 1px solid var(--pae-ink-line) !important;
    border-radius: var(--radius-lg) !important;
    padding: 80px 56px !important;
    margin: 80px 0 !important;
    position: relative;
    overflow: hidden;
}
.impact-section::before {
    content: "";
    position: absolute; inset: 0;
    background:
        radial-gradient(circle at 20% 30%, rgba(111, 227, 184, .12), transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(232, 68, 164, .08), transparent 50%);
    pointer-events: none;
}
.impact-section .impact-grid { gap: 0 !important; position: relative; }
.impact-item {
    flex: 1;
    padding: 0 24px;
    border-left: 1px solid var(--pae-ink-line);
    text-align: left !important;
}
.impact-item:first-child { border-left: none; padding-left: 0; }
.impact-number {
    font-family: var(--display) !important;
    color: var(--pae-mint-bright) !important;
    font-size: clamp(2.5rem, 5vw, 4rem) !important;
    font-weight: 500 !important;
    letter-spacing: -0.03em !important;
}
.impact-label {
    font-family: var(--mono) !important;
    font-size: 0.68rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.14em !important;
    color: var(--pae-on-ink-dim) !important;
    margin-top: 8px;
}
.impact-section > p {
    font-family: var(--mono) !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.18em !important;
    color: var(--pae-mint-bright) !important;
    text-align: left !important;
    margin-top: 56px !important;
    border-top: 1px solid var(--pae-ink-line);
    padding-top: 24px;
    position: relative;
}

/* ---------- CONTACT (everywhere) ---------- */
.contact-simple {
    background: var(--pae-surface) !important;
    border: 1px solid var(--pae-line) !important;
    border-radius: var(--radius-lg) !important;
    padding: 56px !important;
    margin: 60px 0 !important;
}
.contact-simple h2 {
    font-family: var(--display) !important;
    font-size: clamp(2rem, 4vw, 3.2rem) !important;
    color: var(--pae-text) !important;
    font-weight: 500 !important;
    letter-spacing: -0.025em !important;
}
.contact-flex { gap: 32px !important; }
.contact-item {
    font-family: var(--mono) !important;
    font-size: 0.78rem !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase;
    color: var(--pae-text) !important;
}
.contact-item i { color: var(--pae-mint) !important; font-size: 0.95rem !important; width: 24px !important; }
.contact-item a { color: var(--pae-text) !important; }
.contact-item a:hover { color: var(--pae-mint) !important; }

footer {
    background: var(--pae-bg) !important;
    color: var(--pae-text-faint) !important;
    border-top: 1px solid var(--pae-line) !important;
    padding: 48px 32px !important;
    font-family: var(--mono) !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.12em !important;
    text-align: left !important;
    max-width: 1320px;
    margin: 80px auto 0 !important;
}

/* ---------- SITE FOOTER (rich, multi-column) ---------- */
.site-footer {
    background: var(--pae-bg);
    border-top: 1px solid var(--pae-line);
    color: var(--pae-text);
    font-family: var(--display);
    margin-top: 0;
    padding: 32px 0 20px;
    text-align: left;
    text-transform: none;
    letter-spacing: normal;
}
.site-footer .sf-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 48px;
}
.site-footer .sf-cols {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    padding-bottom: 24px;
}
.site-footer .sf-col h4 {
    font-family: var(--display);
    font-weight: 600;
    font-size: 1.08rem;
    letter-spacing: -0.01em;
    color: var(--pae-text);
    margin: 0 0 12px;
}
.site-footer .sf-col a {
    display: block;
    font-size: 0.86rem;
    line-height: 1.3;
    color: var(--pae-text);
    text-decoration: none;
    margin-bottom: 8px;
    width: fit-content;
    transition: color .25s var(--easing, ease);
}
.site-footer .sf-col a:last-child { margin-bottom: 0; }
.site-footer .sf-col a:hover { color: var(--pae-mint); }
.site-footer .sf-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 16px 0;
    border-top: 1px solid var(--pae-line);
    border-bottom: 1px solid var(--pae-line);
}
.site-footer .sf-legal {
    display: flex;
    align-items: center;
    gap: 26px;
}
.site-footer .sf-legal .sf-status {
    background: var(--pae-surface-2);
    border-radius: 8px;
    padding: 10px 15px;
    font-size: 0.8rem;
    color: var(--pae-text);
}
.site-footer .sf-legal a {
    font-size: 0.8rem;
    color: var(--pae-text);
    text-decoration: none;
    transition: color .25s var(--easing, ease);
}
.site-footer .sf-legal a:hover { color: var(--pae-mint); }
.site-footer .sf-social {
    display: flex;
    align-items: center;
    gap: 30px;
}
.site-footer .sf-social a {
    font-size: 0.85rem;
    color: var(--pae-text);
    text-decoration: none;
    transition: color .25s var(--easing, ease);
}
.site-footer .sf-social a:hover { color: var(--pae-mint); }
.site-footer .sf-tag {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 24px;
    padding-top: 16px;
}
.site-footer .sf-tag p {
    margin: 0;
    font-size: 0.84rem;
    color: var(--pae-text-dim);
    max-width: 70ch;
    text-wrap: pretty;
}
.site-footer .sf-tag .sf-by {
    font-size: 0.8rem;
    color: var(--pae-text-faint);
    white-space: nowrap;
}
@media (max-width: 900px) {
    .site-footer { padding: 40px 0 24px; }
    .site-footer .sf-inner { padding: 0 28px; }
    .site-footer .sf-cols { grid-template-columns: repeat(2, 1fr); gap: 28px 24px; padding-bottom: 32px; }
    .site-footer .sf-col h4 { font-size: 1rem; margin-bottom: 14px; }
    .site-footer .sf-bar { flex-direction: column; align-items: flex-start; gap: 16px; }
    .site-footer .sf-tag { flex-direction: column; gap: 12px; }
}
@media (max-width: 540px) {
    .site-footer .sf-cols { grid-template-columns: 1fr; }
    .site-footer .sf-legal { flex-wrap: wrap; gap: 16px; }
    .site-footer .sf-bar { display: none; }
}

/* ---------- ABOUT PAGE ---------- */
.about-hero {
    padding: 140px 32px 80px !important;
    max-width: 1320px !important;
    margin: 0 auto !important;
    text-align: left !important;
    position: relative;
}
.about-hero h1 {
    font-family: var(--display) !important;
    font-size: clamp(3rem, 7vw, 5.6rem) !important;
    font-weight: 600 !important;
    letter-spacing: -0.035em !important;
    line-height: 1 !important;
    text-align: left !important;
    color: var(--pae-text) !important;
    margin: 0 !important;
}
.about-hero .pre-title {
    display: inline-block;
    font-family: var(--display) !important;
    font-size: 0.78rem !important;
    color: var(--pae-mint) !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    margin: 0 0 24px !important;
    padding: 8px 14px;
    border: 1px solid var(--pae-line);
    border-radius: 999px;
    background: var(--pae-bg-2);
}
.about-hero h1::after {
    content: "";
    display: block;
    width: 80px; height: 1px;
    background: var(--pae-mint);
    margin-top: 40px;
}

.mission-block { padding: 64px !important; margin: 40px 0 !important; }
.mission-text {
    font-family: var(--display) !important;
    font-size: clamp(1.4rem, 2.4vw, 2rem) !important;
    line-height: 1.3 !important;
    color: var(--pae-text) !important;
    font-weight: 400 !important;
    letter-spacing: -0.015em;
}

.goals-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    grid-auto-rows: 1fr !important;
    gap: 0 !important;
    margin: 60px 0 !important;
    border-top: 1px solid var(--pae-line);
    border-bottom: 1px solid var(--pae-line);
    counter-reset: goal;
}
.goal-card {
    border-radius: 0 !important;
    padding: 48px 32px !important;
    border-left: 1px solid var(--pae-line) !important;
    border-bottom: 1px solid var(--pae-line) !important;
    border-top: none !important;
    background: transparent !important;
    counter-increment: goal;
    position: relative;
    transition: background .3s var(--easing) !important;
}
.goal-card:nth-child(3n+1) { border-left: none !important; }
.goal-card:nth-last-child(-n+3) { border-bottom: none !important; }
.goal-card:hover {
    background: rgba(111, 227, 184, .04) !important;
    transform: none !important;
    border-bottom-color: var(--pae-line) !important;
    box-shadow: none !important;
}
.goal-card::before {
    content: "0" counter(goal);
    font-family: var(--mono);
    font-size: 0.72rem;
    color: var(--pae-mint);
    letter-spacing: 0.12em;
    position: absolute; top: 24px; right: 24px;
}
.goal-card i {
    font-size: 1.6rem !important;
    color: var(--pae-mint) !important;
    margin-bottom: 28px !important;
    display: block;
}
.goal-card:hover i { transform: none !important; }
.goal-card p {
    font-family: var(--display) !important;
    font-size: 1.3rem !important;
    line-height: 1.25 !important;
    color: var(--pae-text) !important;
    font-weight: 500;
    letter-spacing: -0.015em;
}

.student-quote {
    background: transparent !important;
    border: none !important;
    border-left: 1px solid var(--pae-mint) !important;
    border-radius: 0 !important;
    padding: 16px 0 16px 48px !important;
    margin: 100px 0 !important;
    box-shadow: none !important;
}
.student-quote h2 {
    font-family: var(--display) !important;
    font-size: clamp(2.4rem, 5vw, 4rem) !important;
    line-height: 1.0 !important;
    color: var(--pae-text) !important;
    font-weight: 500 !important;
    letter-spacing: -0.03em;
}
.student-quote p {
    font-family: var(--sans) !important;
    font-size: 1.1rem !important;
    color: var(--pae-text-dim) !important;
    margin-top: 24px;
}

.stats-banner {
    background: var(--pae-surface) !important;
    border: 1px solid var(--pae-line) !important;
    border-radius: var(--radius-lg) !important;
    padding: 64px 48px !important;
    color: var(--pae-text) !important;
    gap: 0 !important;
    margin: 60px 0 !important;
}
.stat-item {
    flex: 1 1 160px;
    padding: 0 24px;
    border-left: 1px solid var(--pae-line);
    text-align: left;
}
.stat-item:first-child { border-left: none; padding-left: 0; }
.stat-number {
    font-family: var(--display) !important;
    color: var(--pae-mint) !important;
    font-size: clamp(2.6rem, 5vw, 4.4rem) !important;
    font-weight: 500 !important;
    letter-spacing: -0.03em;
    line-height: 1;
}
.stat-label {
    font-family: var(--mono) !important;
    font-size: 0.7rem !important;
    letter-spacing: 0.14em !important;
    color: var(--pae-text-dim) !important;
    margin-top: 12px;
}

.world-section { padding: 64px !important; margin: 60px 0 !important; }
.world-content h3 {
    font-family: var(--display) !important;
    font-size: clamp(2rem, 4vw, 3.2rem) !important;
    color: var(--pae-text) !important;
    font-weight: 500 !important;
    letter-spacing: -0.025em;
}
.world-content p { color: var(--pae-text-dim) !important; }
.world-map-icon {
    background: linear-gradient(135deg, var(--pae-mint-soft), var(--pae-bg-2)) !important;
    border: 1px solid var(--pae-line) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: none !important;
    padding: 64px !important;
    color: var(--pae-text) !important;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.world-map-icon:hover { transform: none !important; }
.world-map-icon i { font-size: 6rem !important; color: var(--pae-mint) !important; }

.programs-header { text-align: left !important; margin: 100px 0 48px !important; }
.programs-grid {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 0 !important;
    border-top: 1px solid var(--pae-line);
    border-bottom: 1px solid var(--pae-line);
    margin-bottom: 80px !important;
}
.program-card {
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 48px 32px !important;
    border-left: 1px solid var(--pae-line) !important;
    transition: background .3s var(--easing) !important;
}
.program-card:first-child { border-left: none !important; }
.program-card:hover {
    background: rgba(111, 227, 184, .04) !important;
    transform: none !important;
    box-shadow: none !important;
}
.program-icon {
    width: 52px !important; height: 52px !important;
    border-radius: 999px !important;
    background: rgba(111, 227, 184, .1) !important;
    border: 1px solid var(--pae-mint) !important;
    color: var(--pae-mint) !important;
    font-size: 1.3rem !important;
    margin-bottom: 32px !important;
}
.program-card:hover .program-icon { background: var(--pae-mint) !important; color: var(--pae-bg) !important; transform: none !important; }
.program-card h3 {
    font-family: var(--display) !important;
    font-size: 1.6rem !important;
    color: var(--pae-text) !important;
    margin-bottom: 12px !important;
    font-weight: 500 !important;
}
.program-card p { color: var(--pae-text-dim) !important; }

/* ---------- BRANCHES PAGE ---------- */
.branches-hero { padding: 80px 32px 60px !important; gap: 64px !important; max-width: 1320px !important; }
.branches-hero-left h1 {
    font-family: var(--display) !important;
    font-size: clamp(3rem, 6.5vw, 5.6rem) !important;
    font-weight: 600 !important;
    letter-spacing: -0.035em !important;
    line-height: 0.96 !important;
    color: var(--pae-text) !important;
}
.branches-hero-left p { color: var(--pae-text-dim) !important; }
.branches-hero-right video, .branches-hero-right img { border-radius: var(--radius-lg) !important; box-shadow: 0 30px 60px -20px rgba(0,0,0,.5) !important; border: 1px solid var(--pae-line); }

.impact-showcase { padding: 72px 56px !important; margin: 0 auto 80px !important; }
.impact-content h2 { font-family: var(--display) !important; color: var(--pae-text) !important; font-weight: 500 !important; letter-spacing: -0.025em; font-size: clamp(2rem, 4vw, 3.2rem) !important; }
.impact-content p { color: var(--pae-text-dim) !important; }
.impact-image { border-radius: var(--radius-lg) !important; }
.impact-image img { filter: contrast(1.05) saturate(1.05); transition: filter .4s var(--easing), transform .6s var(--easing); }
.impact-image:hover img { filter: none; }

.why-start-content h2 { font-family: var(--display) !important; color: var(--pae-text) !important; font-weight: 500 !important; letter-spacing: -0.025em; font-size: clamp(2rem, 4vw, 3.2rem) !important; }
.why-start-content p { color: var(--pae-text-dim) !important; }
.why-start-image { border-radius: var(--radius-lg) !important; box-shadow: 0 30px 60px -20px rgba(0,0,0,.5) !important; border: 1px solid var(--pae-line); }
@media (max-width: 900px) { .why-start-image img { object-position: center 20% !important; } }
.why-start-image img { object-position: center 20% !important; }
.quarterly-link {
    background: transparent !important;
    border: 1px solid var(--pae-mint) !important;
    border-radius: 999px !important;
    color: var(--pae-mint) !important;
    font-family: var(--mono) !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    padding: 12px 22px !important;
}
.quarterly-link:hover { background: var(--pae-mint) !important; color: var(--pae-bg) !important; gap: 16px !important; }

.thank-you-section {
    background: linear-gradient(135deg, var(--pae-surface), var(--pae-bg-2)) !important;
    border: 1px solid var(--pae-line) !important;
    border-radius: var(--radius-lg) !important;
    padding: 80px 56px !important;
    color: var(--pae-text) !important;
}
.thank-you-header h2 { font-family: var(--display) !important; color: var(--pae-text) !important; font-weight: 500 !important; }
.thank-you-header h2 span { color: var(--pae-mint) !important; }
.thank-you-header p { color: var(--pae-text-dim) !important; }
.gallery-image { border-radius: var(--radius-lg) !important; }

.branch-quote-section {
    background: var(--pae-surface) !important;
    border: 1px solid var(--pae-line) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: none !important;
    padding: 64px !important;
}
.image-placeholder {
    border-radius: var(--radius-lg) !important;
    background: linear-gradient(135deg, var(--pae-magenta), var(--pae-magenta-soft)) !important;
    box-shadow: 0 30px 60px -20px rgba(232, 68, 164, .35) !important;
    color: var(--pae-text) !important;
}
.quote-content blockquote {
    font-family: var(--display) !important;
    color: var(--pae-text) !important;
    font-weight: 400 !important;
    letter-spacing: -0.02em;
}
.quote-icon { color: var(--pae-mint) !important; opacity: .4; }
.quote-author strong { font-family: var(--mono) !important; font-size: 0.72rem !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; color: var(--pae-mint) !important; }
.quote-author span { font-family: var(--mono) !important; font-size: 0.7rem !important; letter-spacing: 0.1em !important; color: var(--pae-text-dim) !important; text-transform: uppercase; }

/* ---------- VOLUNTEER PAGE ---------- */
.volunteer-hero { padding: 80px 32px 60px !important; gap: 64px !important; max-width: 1320px !important; }
.volunteer-hero-left h1 {
    font-family: var(--display) !important;
    font-size: clamp(3rem, 6.5vw, 5.6rem) !important;
    font-weight: 600 !important;
    letter-spacing: -0.035em !important;
    line-height: 0.96 !important;
    color: var(--pae-text) !important;
}
.volunteer-hero-left p { color: var(--pae-text-dim) !important; }
.volunteer-hero-right {
    background: var(--pae-surface) !important;
    border: 1px solid var(--pae-line) !important;
    border-radius: var(--radius-lg) !important;
    padding: 48px !important;
}
.hero-stat .stat-number { font-family: var(--display) !important; color: var(--pae-mint) !important; font-weight: 500 !important; }
.hero-stat .stat-label { font-family: var(--mono) !important; font-size: 0.7rem !important; letter-spacing: 0.14em !important; color: var(--pae-text-dim) !important; }

.benefits-grid {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 0 !important;
    border-top: 1px solid var(--pae-line);
    border-bottom: 1px solid var(--pae-line);
    margin: 0 !important;
}
.benefit-card {
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 48px 28px !important;
    border-left: 1px solid var(--pae-line) !important;
    text-align: left !important;
    transition: background .3s var(--easing) !important;
}
.benefit-card:first-child { border-left: none !important; }
.benefit-card:hover {
    background: rgba(111, 227, 184, .04) !important;
    transform: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}
.benefit-icon {
    width: 52px !important; height: 52px !important;
    border-radius: 999px !important;
    background: rgba(111, 227, 184, .1) !important;
    border: 1px solid var(--pae-mint) !important;
    color: var(--pae-mint) !important;
    font-size: 1.3rem !important;
    margin: 0 0 28px !important;
}
.benefit-card:hover .benefit-icon { background: var(--pae-mint) !important; color: var(--pae-bg) !important; transform: none !important; }
.benefit-card h3 { font-family: var(--display) !important; font-size: 1.4rem !important; color: var(--pae-text) !important; font-weight: 500 !important; letter-spacing: -0.02em; }
.benefit-card p { color: var(--pae-text-dim) !important; font-size: 0.95rem !important; }

.quote-stats-section {
    background: var(--pae-surface) !important;
    border: 1px solid var(--pae-line) !important;
    border-radius: var(--radius-lg) !important;
    padding: 80px 56px !important;
}
.quote-left blockquote { font-family: var(--display) !important; color: var(--pae-text) !important; font-weight: 400 !important; letter-spacing: -0.02em; }
.quote-left .quote-author { color: var(--pae-mint) !important; font-family: var(--mono) !important; font-size: 0.78rem !important; letter-spacing: 0.12em !important; text-transform: uppercase; }
.stat-block .stat-number { font-family: var(--display) !important; color: var(--pae-mint) !important; font-weight: 500 !important; letter-spacing: -0.03em; }
.stat-block .stat-label { font-family: var(--mono) !important; font-size: 0.7rem !important; letter-spacing: 0.14em !important; color: var(--pae-text-dim) !important; }

/* ---------- OUR TEAM ---------- */
.team-hero { background: var(--pae-bg) !important; }
.team-hero h1 { font-family: var(--display) !important; font-style: normal !important; color: var(--pae-text) !important; font-weight: 600 !important; }

/* Counteract our-team's embedded cream/light styles by re-tinting cofounders */
.officer-card, .cofounder-card {
    background: var(--pae-surface) !important;
    border: 1px solid var(--pae-line) !important;
    border-radius: var(--radius-lg) !important;
    overflow: hidden !important;
    transition: transform .4s var(--easing), border-color .4s var(--easing) !important;
}
.officer-card:hover, .cofounder-card:hover {
    border-color: var(--pae-mint) !important;
    transform: translateY(-4px) !important;
    box-shadow: 0 30px 60px -30px rgba(111, 227, 184, .3) !important;
}
.officer-card .officer-avatar, .cofounder-card .cofounder-avatar {
    background: var(--pae-bg-2) !important;
    overflow: hidden;
}
.officer-card h3, .cofounder-card h3 { font-family: var(--display) !important; font-weight: 500 !important; color: var(--pae-text) !important; letter-spacing: -0.02em !important; }
.officer-card p, .cofounder-card p { color: var(--pae-text-dim) !important; }
.officer-card .officer-title, .cofounder-card .cofounder-title { color: var(--pae-mint) !important; }
.officer-card .officer-avatar img, .cofounder-card .cofounder-avatar img { filter: none !important; transition: transform .5s var(--easing); }
.officer-card:hover .officer-avatar img, .cofounder-card:hover .cofounder-avatar img { transform: scale(1.03); }

/* "honorable mention" line in cofounders grid */
.cofounders-grid > div[style*="grid-column"] {
    background: rgba(111, 227, 184, .04) !important;
    border: 1px dashed var(--pae-mint) !important;
    color: var(--pae-text-dim) !important;
}
.cofounders-grid > div[style*="grid-column"] strong { color: var(--pae-mint) !important; }

.global-stat-section, .global-stats {
    background: var(--pae-bg-2) !important;
    border: 1px solid var(--pae-line) !important;
}
.global-stat-number { color: var(--pae-mint) !important; }

/* Global stats banner — kept as a dark accent band */
.global-stats-banner {
    background: var(--pae-surface) !important;
    border: 1px solid var(--pae-line) !important;
}
.global-stats-banner .global-stat-number { color: #fff !important; }
.global-stats-banner .global-stat-label { color: rgba(255,255,255,.86) !important; }

/* Sun section becomes "home" feature */
.sun-section { background: var(--pae-surface) !important; border: 1px solid var(--pae-line) !important; border-radius: var(--radius-lg) !important; padding: 64px !important; }
.sun-content h2 { color: var(--pae-text) !important; }
.sun-content h2 span { color: var(--pae-mint) !important; }
.sun-content p { color: var(--pae-text-dim) !important; }
.sun-image { background: transparent !important; border: none !important; border-radius: 16px !important; overflow: hidden !important; }
.sun-image i, .sun-image svg { color: var(--pae-mint) !important; width: clamp(140px, 22vw, 220px) !important; height: clamp(140px, 22vw, 220px) !important; }

.join-cta {
    background: linear-gradient(135deg, var(--pae-magenta-soft), var(--pae-bg-2)) !important;
    border: 1px solid var(--pae-line) !important;
    border-radius: var(--radius-lg) !important;
    color: var(--pae-text) !important;
}
.join-cta h3 { color: var(--pae-text) !important; font-family: var(--display) !important; font-weight: 500 !important; }
.join-cta p { color: var(--pae-text-dim) !important; }
.join-cta .btn-join, .btn-join {
    background: var(--pae-mint) !important;
    color: var(--pae-bg) !important;
    border-radius: 999px !important;
    font-family: var(--mono) !important;
    font-size: 1.2rem !important;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 500 !important;
    padding: 22px 54px !important;
    transition: all .3s var(--easing) !important;
}
.join-cta .btn-join:hover, .btn-join:hover { background: transparent !important; color: var(--pae-mint) !important; box-shadow: 0 0 30px rgba(111, 227, 184, .3) !important; }

/* ---------- IMAGE PLACEHOLDERS for missing files ---------- */
.image-placeholder-dark {
    background: linear-gradient(135deg, var(--pae-bg-2), var(--pae-surface));
    border: 1px solid var(--pae-line);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--pae-text-faint);
    font-family: var(--mono);
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    aspect-ratio: 4/3;
    width: 100%;
    height: 100%;
    min-height: 200px;
    position: relative;
    overflow: hidden;
}
.image-placeholder-dark::before {
    content: "";
    position: absolute; inset: 0;
    background-image:
        linear-gradient(45deg, transparent 49%, rgba(18,33,27,.05) 49%, rgba(18,33,27,.05) 51%, transparent 51%);
    background-size: 8px 8px;
}
.image-placeholder-dark span {
    position: relative;
    z-index: 1;
    padding: 4px 12px;
    background: var(--pae-bg);
    border: 1px solid var(--pae-line);
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1024px) {
    .team-grid { grid-template-columns: repeat(3, 1fr) !important; }
    .benefits-grid, .programs-grid, .goals-grid { grid-template-columns: repeat(2, 1fr) !important; }
    .goal-card:nth-child(3n+1) { border-left: 1px solid var(--pae-line) !important; }
    .goal-card:nth-child(2n+1) { border-left: none !important; }
    .program-card, .benefit-card { border-left: none !important; }
    .program-card:nth-child(2n), .benefit-card:nth-child(2n) { border-left: 1px solid var(--pae-line) !important; }
}

@media (max-width: 900px) {
    .navbar { padding: 12px 20px !important; }
    .hero { padding: 60px 24px 80px !important; gap: 32px !important; }
    .container.pillars { padding: 40px 24px !important; flex-direction: column !important; flex-wrap: wrap !important; gap: 0 !important; display: flex !important; }
    .pillar { border-left: none !important; border-top: 1px solid var(--pae-line) !important; padding: 32px 0 !important; min-height: 0 !important; flex: 1 1 100% !important; width: 100% !important; max-width: 100% !important; }
    .team-grid { grid-template-columns: repeat(2, 1fr) !important; }
    .impact-section .impact-grid { flex-wrap: wrap; }
    .impact-item { flex: 1 1 45%; border-left: none; padding: 16px 0; }
    .stats-banner { flex-wrap: wrap; }
    .stat-item { flex: 1 1 45%; border-left: none; padding: 16px 0; }
    .mission-block, .world-section, .impact-showcase, .branch-quote-section, .quote-stats-section, .contact-simple { padding: 40px !important; }
}

@media (max-width: 600px) {
    .hero-left h1, .branches-hero-left h1, .volunteer-hero-left h1 { font-size: 2.6rem !important; }
    .about-hero h1 { font-size: 3.4rem !important; }
    .goals-grid, .programs-grid, .benefits-grid { grid-template-columns: 1fr !important; }
    .goal-card, .program-card, .benefit-card { border-left: none !important; }
    .quote-block, .student-quote { padding-left: 24px !important; }
    .impact-section { padding: 48px 24px !important; }
    .contact-simple { padding: 32px !important; }
    .team-grid { grid-template-columns: 1fr !important; }
    .mission-block, .world-section, .impact-showcase, .branch-quote-section, .quote-stats-section { padding: 28px !important; }
}

/* ============================================================
   APPENDED v3: video hero, branch-cta, dark contact, fixes
============================================================ */

/* --- Video hero --- */
.hero-feature-video video {
    width: 100% !important;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
    border-radius: 20px;
    background: var(--pae-bg-2);
}

/* --- Member card alignment (Syosset, NY, USA centering + view-more) --- */
.member {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    text-align: left !important;
    overflow: hidden !important;
    padding: 0 !important;
    min-width: 0 !important;
}
.member > h4 {
    margin: 20px 22px 6px !important;
    text-align: left !important;
    font-size: 1.05rem !important;
    overflow-wrap: break-word !important;
    word-break: keep-all !important;
}
/* div #1 is .avatar (no margin), #2 is role, #3 is location */
.member > div:nth-of-type(2),
.member > div:nth-of-type(3) {
    margin: 0 22px 4px !important;
    text-align: left !important;
    font-size: 0.7rem !important;
    overflow-wrap: break-word !important;
    word-break: keep-all !important;
    line-height: 1.4 !important;
}
.member > div:nth-of-type(3) {
    margin: 0 22px 22px !important;
    color: var(--pae-mint) !important;
    font-family: var(--mono) !important;
    letter-spacing: .04em !important;
    font-size: 0.7rem !important;
}
.member > .avatar {
    margin: 0 !important;
}

/* --- View more card: align to match siblings --- */
.member.view-more-card {
    background: var(--pae-bg-2) !important;
    border: 1px dashed var(--pae-mint) !important;
}
.view-more-link {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    padding: 0 !important;
    text-decoration: none !important;
    color: inherit !important;
}
.view-more-link .avatar {
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    background: rgba(114,197,152,.08) !important;
    color: var(--pae-mint) !important;
    border-radius: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 2rem !important;
    border-bottom: 1px solid var(--pae-line);
}
.view-more-link h4 {
    margin: 18px 18px 4px !important;
    color: var(--pae-text) !important;
    text-align: left !important;
}
.view-more-link > div {
    margin: 0 18px 22px !important;
    color: var(--pae-mint) !important;
    text-align: left !important;
    font-family: var(--mono) !important;
    font-size: 0.62rem !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
}

/* --- Branch CTA / Volunteer CTA block (shared) --- */
.branch-cta {
    margin: 80px auto !important;
    padding: 64px 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    position: relative;
    overflow: hidden;
}
.branch-cta::before {
    content: "";
    position: absolute;
    inset: 0;
    display: none;
    background: radial-gradient(600px circle at 90% 0%, rgba(114,197,152,.10), transparent 60%);
    pointer-events: none;
}
.branch-cta .pre-title { color: var(--pae-mint) !important; }
.branch-cta h2 {
    font-family: var(--display) !important;
    font-size: clamp(2rem, 4vw, 3.2rem) !important;
    line-height: 1.05 !important;
    color: var(--pae-text) !important;
    margin: 12px 0 20px !important;
    max-width: 720px;
}
.branch-cta > p {
    color: var(--pae-text-2) !important;
    font-size: 1.08rem !important;
    line-height: 1.55 !important;
    max-width: 620px;
    margin: 0 0 32px !important;
}
.branch-cta-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 32px;
}
.btn-accent-large {
    font-size: 1rem !important;
    padding: 16px 38px !important;
}
.btn-ghost {
    display: inline-flex;
    align-items: center;
    padding: 16px 38px;
    border: 1px solid var(--pae-text);
    border-radius: 999px;
    color: var(--pae-text) !important;
    text-decoration: none !important;
    font-family: var(--display);
    font-weight: 600;
    font-size: 1rem;
    letter-spacing: normal;
    text-transform: none;
    transition: border-color .3s, color .3s, background .3s;
}
.btn-ghost:hover {
    border-color: var(--pae-mint);
    color: var(--pae-mint) !important;
    background: transparent;
}
.branch-cta-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
    padding-top: 24px;
    border-top: 1px solid var(--pae-line);
    font-family: var(--display);
    font-size: 0.95rem;
    letter-spacing: normal;
    text-transform: none;
    color: var(--pae-text-2);
}
.branch-cta-meta i { color: var(--pae-mint); margin-right: 8px; }

/* --- Branches: leader photo (Jeren) — head & shoulders crop --- */
.leader-photo {
    width: 100% !important;
    max-width: 380px !important;
    height: auto !important;
    aspect-ratio: 4 / 5 !important;
    border-radius: 8px !important;
    overflow: hidden;
    background: var(--pae-bg-2);
    display: block !important;
    margin: 0 auto !important;
    padding: 0 !important;
}
.leader-photo img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center 0% !important;
    display: block;
}

/* ============================================================
   CONTACT-US PAGE (dark redesign)
============================================================ */
.contact-hero-dark {
    max-width: 1280px;
    margin: 0 auto;
    padding: 140px 48px 80px !important;
    text-align: center;
}
.contact-hero-dark .pre-title { display: inline-block; margin-bottom: 24px; }
.contact-hero-dark h1 {
    font-family: var(--display) !important;
    font-size: clamp(3rem, 7vw, 5.8rem) !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    color: var(--pae-text) !important;
    margin: 0 0 28px !important;
    letter-spacing: -0.02em;
}
.contact-hero-sub {
    max-width: 640px;
    margin: 0 auto !important;
    color: var(--pae-text-2) !important;
    font-size: 1.15rem !important;
    line-height: 1.6 !important;
}

/* Three-up channel cards */
.contact-channels {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 24px !important;
    max-width: 1280px;
    margin: 40px auto !important;
    padding: 0 48px !important;
}
.channel-card {
    display: block;
    background: var(--pae-surface) !important;
    border: 1px solid var(--pae-line);
    border-radius: 20px;
    padding: 36px;
    text-decoration: none !important;
    color: var(--pae-text) !important;
    transition: transform .35s var(--easing), border-color .35s var(--easing), background .35s var(--easing);
    position: relative;
    overflow: hidden;
    min-height: 320px;
    display: flex;
    flex-direction: column;
}
.channel-card:hover {
    transform: translateY(-4px);
    border-color: var(--pae-mint);
    background: var(--pae-bg-2) !important;
}
.channel-card::before {
    content: "";
    position: absolute;
    inset: auto -20% -40% auto;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(114,197,152,.10), transparent 70%);
    pointer-events: none;
    transition: transform .5s var(--easing);
}
.channel-card:hover::before { transform: translate(-20px, -20px) scale(1.2); }
.channel-num {
    font-family: var(--mono);
    font-size: 0.72rem;
    letter-spacing: .15em;
    color: var(--pae-mint);
    margin-bottom: 24px;
}
.channel-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: rgba(114,197,152,.10);
    border: 1px solid rgba(114,197,152,.30);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    color: var(--pae-mint);
    margin-bottom: 28px;
}
.channel-card h3 {
    font-family: var(--display);
    font-size: 1.6rem;
    font-weight: 500;
    margin: 0 0 12px !important;
    color: var(--pae-text);
}
.channel-card > p {
    color: var(--pae-text-2);
    font-size: 0.98rem;
    line-height: 1.55;
    margin: 0 0 24px !important;
    flex: 1;
}
.channel-handle {
    font-family: var(--mono);
    font-size: 0.78rem;
    color: var(--pae-text);
    padding: 10px 14px;
    background: var(--pae-bg);
    border: 1px solid var(--pae-line);
    border-radius: 8px;
    margin-bottom: 18px;
    word-break: break-all;
}
.channel-arrow {
    font-family: var(--mono);
    font-size: 0.72rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--pae-mint);
}

/* Executive section */
.exec-section {
    margin: 100px auto !important;
    max-width: 1280px;
    padding: 0 48px;
}
.exec-header { text-align: center; margin-bottom: 48px; }
.exec-header h2 {
    font-family: var(--display);
    font-size: clamp(2.2rem, 4.5vw, 3.6rem);
    font-weight: 500;
    color: var(--pae-text);
    margin: 12px 0 16px !important;
    line-height: 1.05;
}
.exec-header p {
    color: var(--pae-text-2);
    max-width: 560px;
    margin: 0 auto !important;
    font-size: 1.05rem;
}
.exec-card-dark {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 48px;
    align-items: center;
    background: var(--pae-surface);
    border: 1px solid var(--pae-line);
    border-radius: 24px;
    padding: 48px;
    max-width: 900px;
    margin: 0 auto;
    transition: border-color .35s var(--easing);
}
.exec-card-dark:hover { border-color: var(--pae-mint); }
.exec-card-dark + .exec-card-dark { margin-top: 24px; }
.exec-photo {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1.05;
    border-radius: 5px;
    overflow: hidden;
    isolation: isolate;
    background: linear-gradient(180deg, rgba(205,238,231,0) 0%, #cdeee7 58%, #b3e4da 100%);
}
.exec-photo::before { content:""; position:absolute; inset:0; background:#3FBFA6; opacity:0; transition: opacity .5s var(--easing); z-index:0; }
.exec-card-dark:hover .exec-photo::before { opacity:1; }
.exec-photo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    z-index: 1;
}
.exec-tag {
    font-family: var(--mono);
    font-size: 0.72rem;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--pae-mint);
    margin-bottom: 14px;
}
.exec-meta h3 {
    font-family: var(--display);
    font-size: 2.6rem;
    font-weight: 500;
    color: var(--pae-text);
    margin: 0 0 16px !important;
    line-height: 1;
}
.exec-meta p {
    color: var(--pae-text-2);
    font-size: 1rem;
    line-height: 1.55;
    margin: 0 0 24px !important;
}
.exec-email {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--pae-text) !important;
    text-decoration: none !important;
    padding: 14px 20px;
    border: 1px solid var(--pae-line);
    border-radius: 10px;
    font-family: var(--mono);
    font-size: 0.85rem;
    transition: border-color .3s, color .3s, background .3s;
}
.exec-email:hover {
    border-color: var(--pae-mint);
    color: var(--pae-mint) !important;
    background: rgba(114,197,152,.05);
}
.exec-email i { color: var(--pae-mint); }

/* Foot info row */
.contact-foot {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    max-width: 1280px;
    margin: 60px auto 80px !important;
    padding: 32px 48px;
    border-top: 1px solid var(--pae-line);
    border-bottom: 1px solid var(--pae-line);
}
.foot-block {}
.foot-label {
    font-family: var(--mono);
    font-size: 0.68rem;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--pae-text-2);
    margin-bottom: 10px;
}
.foot-value {
    color: var(--pae-text);
    font-size: 0.95rem;
}
.foot-value i { color: var(--pae-mint); margin-right: 8px; }

/* Responsive */
@media (max-width: 980px) {
    .contact-channels { grid-template-columns: 1fr !important; padding: 0 24px !important; }
    .exec-section { padding: 0 24px; }
    .exec-card-dark { grid-template-columns: 1fr !important; padding: 32px !important; gap: 28px !important; }
    .contact-hero-dark { padding: 100px 24px 56px !important; }
    .contact-foot { grid-template-columns: 1fr !important; padding: 32px 24px; gap: 24px; }
    .branch-cta { padding: 40px 0 !important; margin: 60px 16px !important; }
}

/* ---------- SMALL UPPERCASE LABELS: standardized Helvetica, tight tracking ---------- */
.section-code, .pre-title, .cta-eyebrow,
.feed-eyebrow, .feed-count, .filter-chip, .ph-label,
.feat-tag, .feat-meta, .read-btn, .fi-meta, .fi-by,
.article-cat, .article-byline .a-role, .article-table th,
.article-quote cite, .article-sources h4,
.t-cat, .t-role, .hl-tag, .hl-cta,
.global-stat-label, .branch-cta-meta, .feat-eyebrow {
    font-family: var(--display) !important;
    letter-spacing: 0.04em !important;
}

