/* About Us — page-about.php */

/* Hero mechanics (full-bleed image, overlay, sizing) come from the shared
   ../hero.css; this page only needs its own heading size. */
.sfm-about-hero .sfm-hero__heading { font-size: clamp(1.6rem, 3.5vw, 2.3rem); }

.sfm-about-stats .sfm-stat { background: var(--sfm-white); border: 1px solid var(--sfm-color-border); border-radius: var(--sfm-radius-md); }

.sfm-director { display: grid; gap: 1.5rem; grid-template-columns: 1fr; align-items: stretch; }
.sfm-director__photo { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--sfm-radius-lg); }
.sfm-director__quote { background: var(--sfm-white); border-radius: var(--sfm-radius-lg); padding: 1.75rem; position: relative; }
.sfm-director__mark { color: var(--sfm-blue-100); display: block; margin-bottom: 0.5rem; }
.sfm-director__mark .sfm-icon { width: 34px; height: 34px; }
.sfm-director__quote p:first-of-type { font-size: 1.05rem; font-style: italic; color: var(--sfm-navy-800); }
.sfm-director__name { font-weight: 700; margin-bottom: 0; }
.sfm-director__title { font-size: 0.85rem; color: var(--sfm-gray-400); }
@media (min-width: 700px) {
    .sfm-director { grid-template-columns: 0.9fr 1.4fr; }
}

.sfm-checklist--grid { display: grid; grid-template-columns: 1fr; gap: 0.6rem 1.5rem; }
@media (min-width: 700px) {
    .sfm-checklist--grid { grid-template-columns: 1fr 1fr; }
}

.sfm-about-story__media { position: relative; }
.sfm-about-story__badge { position: absolute; top: 1rem; left: 1rem; }

.sfm-community-photo { display: block; width: 100%; height: auto; aspect-ratio: 3 / 1; object-fit: cover; border-radius: var(--sfm-radius-md); margin-top: 1.25rem; }
.sfm-panel__art { aspect-ratio: 3 / 1; margin-bottom: 1.25rem; }
.sfm-panel__art .sfm-artwork__glyph .sfm-icon { width: 16%; height: 16%; }

.sfm-philosophy .sfm-section-head { margin-bottom: 2.5rem; }
.sfm-philosophy .sfm-eyebrow { color: var(--sfm-orange-600); }
.sfm-philosophy .sfm-section-lede { color: rgba(255, 255, 255, 0.75); max-width: 42em; }
.sfm-philosophy__item { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 0.75rem; }
.sfm-philosophy__item .sfm-stat__icon { background: rgba(255, 255, 255, 0.1); color: var(--sfm-white); }
.sfm-philosophy__item p { font-size: 0.82rem; font-weight: 600; margin: 0; }

.sfm-voice-cta__inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.25rem;
    text-align: left;
}
.sfm-voice-cta .sfm-stat__icon { width: 56px; height: 56px; }
@media (min-width: 700px) {
    .sfm-voice-cta__inner { flex-direction: row; align-items: center; }
    .sfm-voice-cta__inner > div { flex: 1; }
}

.sfm-value-card { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 0.6rem; }
.sfm-value-card h4 { font-size: 0.95rem; margin: 0; }
.sfm-value-card p { font-size: 0.8rem; color: var(--sfm-gray-400); margin: 0; }

.sfm-journey__track {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    position: relative;
}
.sfm-journey__item { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 0.5rem; }
.sfm-journey__item strong { color: var(--sfm-navy-900); font-family: var(--sfm-font-display); }
.sfm-journey__item p { font-size: 0.82rem; color: var(--sfm-gray-600); margin: 0; max-width: 18em; }
@media (min-width: 900px) {
    .sfm-journey__track { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .sfm-journey__track::before {
        content: '';
        position: absolute;
        top: 26px;
        left: 10%;
        right: 10%;
        height: 2px;
        background: var(--sfm-color-border);
        z-index: 0;
    }
    .sfm-journey__item .sfm-stat__icon { position: relative; z-index: 1; }
}