.about-hero { padding: 160px 40px 80px; border-bottom: 1px solid var(--line); }
.about-hero-photo {
  background-image: url('../images/heroes/about-hero.jpg');
  background-position: center 30%;
}
.about-hero-inner { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: 1.3fr 1fr; gap: 80px; align-items: end; }
.about-eyebrow { font-family: var(--mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--meta); margin-bottom: 24px; display: flex; align-items: center; gap: 12px; }
.about-eyebrow::before { content: ''; width: 40px; height: 1px; background: var(--accent); }
.about-hero h1 { font-family: var(--serif); font-weight: 300; font-size: clamp(48px, 7vw, 96px); line-height: 0.95; letter-spacing: -0.03em; }
.about-hero h1 em { font-style: italic; color: var(--accent); }
.about-hero-right p { font-family: var(--serif); font-size: clamp(18px, 1.6vw, 22px); line-height: 1.45; color: var(--fg); }

.about-body { max-width: 800px; margin: 0 auto; padding: 80px 40px 120px; }
.about-body p { font-size: 15px; line-height: 1.7; color: var(--fg-muted); margin-bottom: 20px; }
.about-body p strong { color: var(--fg); font-weight: 500; }
.about-body h2 { font-family: var(--serif); font-weight: 300; font-size: clamp(28px, 3vw, 40px); line-height: 1.1; margin: 48px 0 20px; color: var(--fg); }
.about-body h2 em { font-style: italic; color: var(--accent); }
.about-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin: 48px 0; padding: 32px 0; border-top: 1px solid var(--line-brand); border-bottom: 1px solid var(--line-brand); }
.about-stat-num { font-family: var(--serif); font-size: 40px; line-height: 1; letter-spacing: -0.03em; }
.about-stat-label { font-family: var(--mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--meta); margin-top: 8px; }
.about-cta { margin-top: 48px; display: flex; gap: 16px; flex-wrap: wrap; }
.about-btn { font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; padding: 14px 24px; text-decoration: none; border: 1px solid var(--line-strong); color: var(--fg); transition: all 0.2s; }
.about-btn:hover { background: var(--accent); border-color: var(--accent); color: var(--bone); }
.about-btn.primary { background: var(--ets-blue); border-color: var(--ets-blue); color: var(--bone); }
.about-btn.primary:hover { background: var(--ets-blue-light); }

@media (max-width: 900px) {
  .about-hero-inner { grid-template-columns: 1fr; gap: 40px; }
  .about-stats { grid-template-columns: 1fr; }
}