/* About-page composition using the shared GraphicStream components. */
.about-page {
    --about-ink: #162e42;
    --about-muted: #526575;
    --about-accent: #076e8a;
    color: var(--about-ink);
    background: #fff;
    font-size: 1rem;
    line-height: 1.7;
}
.about-page *, .about-page *::before, .about-page *::after { box-sizing: border-box; }
.about-container { width: min(1200px, calc(100% - 4rem)); margin-inline: auto; }
.about-page :is(h1, h2, h3) { padding: 0; color: inherit; text-wrap: balance; }
.about-page p { margin: 0 0 1rem; }
.about-page :is(a, button, summary):focus-visible { outline: 3px solid #076e8a; outline-offset: 5px; }
.about-page :is(section[id], #scroll-target, #principes) { scroll-margin-top: 6rem; }
.about-section { padding-block: clamp(3.5rem, 7vw, 6rem); }
.about-page .gs-content-header { margin-bottom: 2.5rem; color: inherit; }
.about-page .gs-content-header__text { font-size: 1.1rem; }
.about-page .gs-content-block__text { font-size: 1rem; }
.about-page :is(.gs-content-header__eyebrow, .gs-content-block__eyebrow) { color: var(--about-accent); font-size: .78rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.about-page :is(.gs-content-header__text, .gs-content-block__text, .gs-promo-card__text) { color: var(--about-muted); }
.about-page .gs-content-block__actions > p { flex-basis: 100%; }
.about-page .gs-action { white-space: normal; overflow-wrap: anywhere; }
.about-page .gs-grid-item, .about-page .gs-layout-grid > * { min-width: 0; }
.about-page .gs-media-section { --gs-media-section-content-width: 1200px; }

.about-hero { background: radial-gradient(ellipse at 90% 25%, #d2e5ee 0, transparent 58%), #f3f7f9; padding-top: 1.5rem; }
.about-breadcrumb { display: flex; gap: .75rem; margin-bottom: 3rem; font-size: .8rem; color: var(--about-muted); }
.about-breadcrumb a { color: inherit; }
.about-hero .gs-layout-grid { align-items: center; }
.about-hero .gs-content-block__title { max-width: 16ch; font-size: clamp(2.8rem, 5.2vw, 4.8rem); font-weight: 750; line-height: 1.04; letter-spacing: -.055em; }
.about-hero .gs-content-block__text { font-size: clamp(1.1rem, 1.6vw, 1.35rem); margin-top: 1.5rem; }
.about-hero .gs-content-block__actions { margin-top: 1.25rem; }
.about-hero .gs-content-block__actions > p { color: var(--about-muted); }
.about-hero__photo { margin: 0; padding: .75rem; border-radius: 1.5rem; background: #ffffffc9; box-shadow: 0 20px 60px #162e4214; }
.about-hero__photo img { display: block; width: 100%; height: auto; border-radius: .9rem; }
.about-hero__photo figcaption { padding: .8rem .4rem .3rem; font-size: .8rem; color: var(--about-muted); }
.about-hero .gs-stat-grid { margin-top: 3rem; border-top: 1px solid #162e4220; }
.about-hero .gs-stat__value { font-size: clamp(2.5rem, 5vw, 4rem); }
.about-hero .gs-stat__content p { margin: 0; }
.about-prose { color: var(--about-muted); }
.about-prose strong { color: var(--about-ink); }
.about-lead { font-size: 1.15rem; }
.about-story { padding-left: 2rem; border-left: 3px solid #b5d8e5; }
.about-story .gs-content-block__actions { margin-top: 1rem; }
.about-story .gs-content-block__actions p { color: var(--about-muted); }
.about-details { margin-top: 3rem; padding-top: 3rem; border-top: 1px solid #dce6eb; }
.about-details .gs-benefit-list { color: inherit; }
.about-details .gs-benefit-list__title { font-size: 1.65rem; }
.about-details .gs-benefit__title { font-size: 1.25rem; margin-bottom: 1rem; }
.about-details .gs-benefit__description { color: var(--about-muted); line-height: 1.75; }

.about-expertise { background: #f3f7f9; }
.about-expertise .gs-promo-card { box-shadow: none; border: 1px solid #dce6eb; }
.about-section-heading { padding-top: clamp(3.5rem, 7vw, 6rem); }
.about-projects .gs-content-block__title { font-size: clamp(1.6rem, 2.7vw, 2.5rem); }
.about-projects .gs-content-header { margin-bottom: 2rem; }
.about-commitments { background: #162e42; color: #fff; }
.about-commitments .gs-content-header__eyebrow { color: #9bd9ed; }
.about-commitment { display: flex; flex-direction: column; padding: 2rem; border: 1px solid #ffffff2b; border-radius: 1rem; }
.about-number { display: block; color: #9bd9ed; font-size: .8rem; letter-spacing: .1em; margin-bottom: 1.5rem; }
.about-commitment .gs-content-block { flex: 1; display: flex; flex-direction: column; color: #fff; }
.about-commitment .gs-content-block__title { font-size: 1.4rem; }
.about-commitment .gs-content-block__text { color: #d4e2eb; line-height: 1.75; }
.about-commitment .gs-content-block__actions { margin-top: auto; padding-top: 1.5rem; }
.about-commitment .gs-action { --gs-primary: #9bd9ed; color: #9bd9ed; text-align: left; }
.about-clients { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1rem; }
.about-clients li { min-width: 0; display: grid; place-items: center; padding: 1.1rem; border: 1px solid #e1e8ed; border-radius: .65rem; background: #fff; }
.about-clients img { display: block; width: 100%; height: 4rem; object-fit: contain; }
.about-team { background: #f3f7f9; }
.about-team .gs-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.about-team .gs-promo-card { box-shadow: none; border: 1px solid #dce6eb; }
.about-team .gs-promo-card__media { max-height: 16rem; background: #e7eff3; }
.about-team .gs-promo-card__content { padding: 1.5rem 1rem 1rem; }
.about-contact { margin-bottom: clamp(2rem, 4vw, 4rem); background: #e4f0f5; }
.about-contact .gs-content-header { margin-bottom: 0; }
.about-contact .gs-content-header__actions > p { flex-basis: 100%; font-size: 1.15rem; color: var(--about-muted); }
.about-contact .gs-action-group { justify-content: center; }

@media (max-width: 1024px) {
    .about-story { padding-left: 1.5rem; }
    .about-clients { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .about-team .gs-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .about-container { width: calc(100% - 2rem); }
    .about-breadcrumb { margin-bottom: 2rem; }
    .about-hero .gs-content-block__title { font-size: clamp(2.4rem, 11vw, 3.4rem); }
    .about-hero__photo { padding: .5rem; }
    .about-hero .gs-stat-grid { margin-top: 2rem; }
    .about-clients { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
    .about-team .gs-card-grid { grid-template-columns: 1fr; }
    .about-team .gs-promo-card__media { max-height: 18rem; }
    .about-commitment { padding: 1.5rem; }
    .about-page .gs-action-group { align-items: stretch; }
    .about-page .gs-action-group .gs-action { flex: 1 1 100%; justify-content: center; }
}
