/* about.css — the About page. Shares section heads, stat strip and cards with home.css. */
.ab-hero { padding-block: clamp(48px, 7vw, 104px) clamp(48px, 6vw, 88px); background: radial-gradient(ellipse 60% 70% at 85% 30%, rgba(230,182,95,.10), transparent 70%); }
.ab-hero-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(36px, 6vw, 88px); align-items: center; }
.ab-hero h1 { font-size: clamp(40px, 5.4vw, 76px); line-height: 1.02; letter-spacing: -.06em; font-weight: 650; margin: 0 0 24px; text-wrap: balance; }
.ab-lede { font-size: clamp(17px, 1.5vw, 20px); line-height: 1.65; color: var(--text-2); margin: 0 0 32px; max-width: 50ch; }
.ab-founder { display: flex; gap: 16px; align-items: center; padding: 18px 20px; border: 1px solid var(--hair); border-radius: 16px; background: #151713; max-width: 480px; }
.ab-mono { flex-shrink: 0; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--gold); color: #17180f; font-weight: 800; font-size: 19px; letter-spacing: -.03em; }
.ab-founder p { margin: 0; }
.ab-name { font-size: 18px; font-weight: 750; letter-spacing: -.02em; }
.ab-role { font-size: 13.5px; color: var(--text-3); margin-top: 2px !important; }
.ab-reach { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px !important; font-size: 14px; color: var(--text-3); }
.ab-reach a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.ab-photo { margin: 0; }
.ab-photo img { display: block; width: 100%; height: auto; border-radius: 18px; border: 1px solid var(--hair); box-shadow: 0 40px 90px -35px rgba(0,0,0,.85); }
.ab-photo figcaption { margin-top: 12px; font-size: 13px; color: var(--text-3); }
.ab-story { padding-block: clamp(64px, 8vw, 112px); border-top: 1px solid var(--hair); }
.ab-story-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(32px, 6vw, 88px); align-items: start; }
.ab-story-copy p { font-size: 17px; line-height: 1.8; color: var(--text-2); margin: 0 0 18px; max-width: 62ch; }
.ab-values { padding-block: clamp(64px, 8vw, 112px); }
.ab-values .why-card h3 { margin-top: 0; }
.ab-cta { padding-block: 0 clamp(72px, 9vw, 120px); }
.ab-cta-box { display: grid; grid-template-columns: 1.3fr 1fr; gap: 32px; align-items: center; padding: clamp(28px, 4vw, 52px); border: 1px solid #5d5238; border-radius: 22px; background: linear-gradient(135deg, #221e14, #151511 70%); }
.ab-cta-box h2 { font-size: clamp(30px, 3.6vw, 48px); letter-spacing: -.05em; line-height: 1.05; font-weight: 650; margin: 0 0 12px; }
.ab-cta-box p { margin: 0; color: var(--text-2); font-size: 16.5px; line-height: 1.7; max-width: 48ch; }
.ab-cta-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.ab-visit { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; font-size: 15px; }
@media (max-width: 900px) {
  .ab-hero-grid, .ab-story-grid, .ab-cta-box { grid-template-columns: 1fr; }
}
.ab-values .why-card li { overflow-wrap: anywhere; }
.ab-values .why-card a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
