/* =============================================================
   about.css — Styles for the About page
   ============================================================= */

/* ── Section Heading Bar (vertical accent line beside h2) ── */
.section-heading-bar {
    width: 4px;
    height: 32px;
    background-color: #0f172a;
    margin-right: 16px;
    flex-shrink: 0;
}

/* ── Section Title h2 ── */
.about-section-title {
    font-size: 32px;
    letter-spacing: -0.5px;
    color: #0f172a;
}

/* ── Body paragraph text ── */
.about-body-text {
    font-size: 16px;
    line-height: 1.8;
    color: #475569;
}

/* ── General dark heading / icon color ── */
.about-dark {
    color: #0f172a;
}

/* ── Shared card background (warm off-white) ── */
.about-card-bg {
    background-color: #f6f3ef;
}

/* ── Stats card wrapper ── */
.about-stat-card {
    background-color: #f6f3ef;
    height: 100%;
    min-height: 120px;
}

/* ── Large stat number ── */
.about-stat-num {
    font-size: 32px;
    color: #0f172a;
    letter-spacing: -1px;
}

/* ── Small uppercase label (stats, milestones, roles, news) ── */
.about-meta-label {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1.5px;
    color: #64748b;
}

/* ── Milestones section heading ── */
.about-milestones-heading {
    letter-spacing: 5px;
    color: #0f172a;
}

/* ── Milestone icon circle (light) ── */
.milestone-icon {
    width: 72px;
    height: 72px;
    background-color: #fafafa;
    border-color: #e2e8f0 !important;
}

/* ── Milestone icon circle (dark / "Today") ── */
.milestone-icon--dark {
    width: 72px;
    height: 72px;
    background-color: #0f172a;
}

/* ── CTA banner section ── */
.about-cta-section {
    background-color: #eaf1fa;
}

/* ── CTA paragraph text ── */
.about-cta-text {
    color: #475569;
    max-width: 450px;
    margin: 0 auto;
    font-size: 15px;
    line-height: 1.6;
}

/* ── CTA link ── */
.about-cta-link {
    letter-spacing: 1.5px;
    font-size: 13px;
}

/* ── Mission / Vision card text ── */
.about-card-text {
    font-size: 14px;
    line-height: 1.7;
}

/* ── Team profile image wrapper ── */
.about-profile-img {
    width: 80px;
    height: 80px;
    background-color: #e2e8f0;
}

.about-profile-img img {
    object-fit: cover;
}

/* ── Certification card text ── */
.about-cert-text {
    font-size: 13.5px;
    line-height: 1.6;
}

/* ── Career open role badge ── */
.about-role-badge {
    background-color: #0f172a !important;
    font-size: 10px;
    letter-spacing: 1px;
}

/* ── Career location text ── */
.about-career-meta {
    font-size: 13px;
}

/* ── Career "Apply Now" link ── */
.about-career-link {
    font-size: 12px;
    letter-spacing: 1px;
}

/* ── News image ── */
.about-news-img {
    height: 180px;
    object-fit: cover;
}

/* ── Region / Global presence card text ── */
.about-region-text {
    font-size: 13px;
}

/* ── Featured card sidebar badge ── */
.about-featured-badge {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    background-color: #0f172a !important;
    border-radius: 6px !important;
    z-index: 2;
}

/* ── Featured card title ── */
.about-featured-title {
    font-size: 20px;
    color: #0f172a;
    letter-spacing: -0.3px;
}