/* ===== About page ===== */

/* Hero */
.about-hero { padding: 74px 0; }
.about-hero__inner { display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center; }
.about-hero__copy h1 { font-size: clamp(26px, 3vw, 37px); margin-bottom: 20px; }
.hero-rule { display: block; width: 64px; height: 3px; background: var(--green-500); margin-bottom: 24px; border-radius: 2px; }
.about-hero__copy p { max-width: 46ch; }
.about-hero__art { position: relative; }
.about-hero__art img { width: 100%; height: auto; }

/* Intro */
.intro__title { font-size: clamp(21px, 2.4vw, 28px); margin-bottom: 16px; max-width: 18ch; }
.intro__art img { width: 100%; height: auto; }

/* Step / value cards */
.step-card h3, .value-card h3 { font-size: 18px; margin: 16px 0 9px; }
.step-card p, .value-card p { font-size: 13.5px; }
.step-card .icon-ring, .value-card .icon-ring { margin: 0 auto; }

/* Stat cards */
.stat-card { display: flex; align-items: center; gap: 18px; }
.stat-icon { width: 54px; height: 54px; border-radius: 12px; background: var(--green-050); color: var(--green); display: grid; place-items: center; flex-shrink: 0; }
.stat-icon svg, .stat-icon img { width: 26px; height: 26px; object-fit: contain; }
.stat-card b { display: block; font-family: var(--serif); font-size: 21px; color: var(--ink); line-height: 1.1; }
.stat-card span { font-size: 12.5px; color: var(--body); }

/* More than an accountant */
.mta__title { font-size: clamp(21px, 2.4vw, 28px); margin-bottom: 16px; }
.mta__art img { width: 100%; height: auto; border-radius: 16px; box-shadow: var(--shadow); }

/* (CTA band styles are shared — see style.css) */

@media (max-width: 980px) {
  .about-hero__inner { grid-template-columns: 1fr; }
}
