/* About page — layout only (primitives live in components.css) */ /* Hero background image */ .page-template-template-about .hero { background-image: url('../images/values/teamwork.jpg'); } /* Intro paragraph */ .about-intro { max-width: 780px; margin: 0 auto; text-align: center; font-size: 1.125rem; line-height: 1.7; color: var(--muted); } /* Core values grid: 3-up → 2-up → 1-up */ .about-values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; } @media (max-width: 900px) { .about-values-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 560px) { .about-values-grid { grid-template-columns: 1fr; } } /* Team grid: 5-up → 3-up → 2-up */ .about-team-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; } @media (max-width: 1000px) { .about-team-grid { grid-template-columns: repeat(3, 1fr); } } @media (max-width: 640px) { .about-team-grid { grid-template-columns: repeat(2, 1fr); } } /* Closing CTA band */ .about-cta { text-align: center; } /* Interactive team cards — the whole card is a button that opens the bio modal. Reuses the .team-card component look; this just resets the