.about-hero { padding: 180px 0 90px; background: radial-gradient(ellipse at top right, rgba(56,189,248,.12), transparent 65%); }
.about-eyebrow { color: var(--primary); font-size: .8rem; font-weight: 700; letter-spacing: .16em; margin-bottom: 16px; }
.about-hero h1 { font-size: clamp(2.6rem, 6vw, 4.7rem); line-height: 1.1; letter-spacing: -.03em; margin-bottom: 25px; }
.about-hero h1 span { color: var(--primary); }
.about-lead { font-size: 1.35rem; max-width: 720px; color: #dbe5f1; margin-bottom: 28px; }
.about-intro { max-width: 800px; }
.about-intro p, .about-copy p, .about-card > p:not(.about-role), .about-contact > p:not(.about-eyebrow) { color: var(--text-dim); margin-bottom: 18px; }
.about-actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 30px; }
.about-section { padding: 80px 0; }
.about-tint { background: rgba(255,255,255,.02); border-block: 1px solid var(--border); }
.about-section h2 { font-size: clamp(1.9rem, 4vw, 2.6rem); line-height: 1.2; margin-bottom: 28px; }
.about-mission { display: grid; grid-template-columns: 1fr 1.2fr; gap: 60px; align-items: start; }
.about-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 36px; }
.about-card { padding: 32px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 20px; }
.about-card h3 { font-size: 1.4rem; margin-bottom: 12px; }
.about-card strong { color: var(--text-main); font-weight: 600; }
.about-role { color: var(--primary); margin-bottom: 22px; }
.about-monogram { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 18px; background: rgba(56,189,248,.1); color: var(--primary); font-size: 1.35rem; font-weight: 700; margin-bottom: 24px; }
.about-icon { color: var(--primary); font-size: 1.7rem; margin-bottom: 22px; }
.about-contact { text-align: center; }
.about-contact .about-actions { justify-content: center; }
@media (max-width: 700px) {
    .about-hero { padding: 145px 0 60px; }
    .about-section { padding: 55px 0; }
    .about-grid, .about-mission { grid-template-columns: 1fr; gap: 20px; }
    .about-card { padding: 25px; }
    .about-lead { font-size: 1.15rem; }
    .about-actions .btn { max-width: 100%; overflow-wrap: anywhere; }
}
