﻿/*
 * About page — scale-down pass, same reasoning as front-page.css's
 * equivalent section. Headings on this page use shared global classes
 * (.page-hero-split, .sticky-title, .mission-card, .purpose-copy,
 * .faq-intro) that other pages also use, so these overrides live here
 * (loaded only on this page via inc/enqueue/styles.php's slug matching)
 * rather than in global/sections.css, keeping the change page-scoped.
 */

.page-hero-split h1 {
    font-size: clamp(2.25rem, 3.4vw, 3.4rem);
}

.sticky-title h2,
.mission-card h2,
.purpose-copy h2,
.faq-intro h2 {
    font-size: clamp(1.75rem, 2.6vw, 2.5rem);
}

/* Mission/Vision cards — global/sections.css sizes these at
   min-height:380px with up to 58px padding, tuned for the old, much
   larger heading size. First pass (300px/40px) still left visible empty
   space since the card was forced taller than its own content needs —
   min-height removed entirely here so the card sizes to fit its actual
   content, consistent with how the rest of the homepage/about scale-down
   let text define spacing rather than a fixed box. */
.mission-card {
    min-height: 0;
    padding: clamp(20px, 3vw, 32px);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* "Clarity before expansion" section banner. */
.impact-banner { background-position: center; background-repeat: no-repeat; background-size: cover; }
.mission-card p:last-child {
    margin-top: 16px;
    font-size: 1rem;
}

/* Same zero-gap issue as the homepage's .purpose-copy .lead — h2/p both
   reset to margin:0 globally, and .lead never got a margin-top here. */
.purpose-copy .lead {
    margin-top: 18px;
}