.about-page .about-story-content h2 { color: #171717 !important; }
.about-page .about-story-text p { color: #222222 !important; }
.about-page .about-values h2,
.about-page .about-values h2 em,
.about-page .about-values h3 { color: #ffffff !important; }

/* Keep the story inside consistent page gutters at every width. */
.about-page .about-story {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: clamp(36px, 5vw, 80px) max(clamp(20px, 4vw, 64px), calc((100% - 1280px) / 2));
    box-sizing: border-box;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(24px, 4vw, 56px);
}
.about-page .about-story-image,
.about-page .about-story-content,
.about-page .about-story-text {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}
.about-page .about-story-content {
    padding: 0;
    overflow-wrap: anywhere;
}
.about-page .about-story-content h2 {
    max-width: 100%;
    font-size: clamp(34px, 4vw, 64px);
    line-height: 1.08;
    margin-bottom: 24px;
}
.about-page .about-story-text p {
    overflow-wrap: anywhere;
}
@media (max-width: 1000px) {
    .about-page .about-story {
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
    }
    .about-page .about-story-image {
        min-height: 0;
        height: auto;
        aspect-ratio: 4 / 3;
    }
    .about-page .about-story-image img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }
}
@media (max-width: 600px) {
    .about-page .about-story-content h2 {
        font-size: clamp(34px, 9vw, 44px);
    }
    .about-page .about-story-image {
        aspect-ratio: 1 / 1;
    }
}


/* Rich Text & Paragraph Handling */
.about-page .about-hero-description p {
    font-size: 15px;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.88);
    margin: 0 auto;
    max-width: 580px;
}
.about-page .about-value-desc p,
.about-page .about-value p {
    font-size: 13.5px;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.7) !important;
    margin: 0;
}
.about-page .about-vp-body p,
.about-page .about-vp-card p,
.about-page .about-vp-text {
    font-size: 14.5px;
    line-height: 1.75;
    color: #5a5046 !important;
    margin: 0 0 14px;
}
.about-page .about-brand-description p {
    font-size: 15px;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.85);
    margin: 0 auto 18px;
    max-width: 580px;
}
