.body--services {
    background: var(--color-surface);
}

.page-hero--services {
    background: url("../../assets/images/about/entreprise.png") right center/cover no-repeat;
}

.page-hero--services::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(3, 3, 105, 0.95), rgba(3, 3, 105, 0.7));
    z-index: 0;
}

.page-hero__media {
    background: rgba(255, 255, 255, 0.94);
    border-radius: 2rem;
}

.page-hero__media h3 {
    font-size: clamp(1.25rem, 2vw, 1.5rem);
    font-weight: 600;
}

.page-hero__media p {
    color: var(--color-base-70);
    font-size: clamp(1rem, 1.5vw, 1.2rem);
}

.hero-metrics .metric-value {
    font-size: clamp(1.9rem, 2.4vw, 2.3rem);
    color: var(--color-primary);
}

.hero-metrics .metric-label {
    color: var(--color-base-60);
    font-size: 0.95rem;
}

.bullet-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 0.6rem;
    color: rgba(255, 255, 255, 0.88);
}

.bullet-list li::before {
    content: "";
    display: inline-block;
    width: 0.8rem;
    height: 0.8rem;
    margin-right: 0.8rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.7);
}

.services-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(2rem, 3vw, 2.6rem);
}

.service-card {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    gap: clamp(1.6rem, 2.4vw, 2.4rem);
    padding: clamp(2.4rem, 3vw, 3rem);
    border-top: 3px solid rgba(3, 3, 105, 0.08);
    align-items: start;
}

.service-card__intro {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: clamp(1.1rem, 2vw, 1.6rem);
    align-items: start;
}

.service-card__text {
    display: grid;
    gap: 0.6rem;
}

.service-card__list {
    align-self: stretch;
}

.checklist {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 0.8rem;
    font-size: clamp(0.95rem, 1.4vw, 1.1rem);
    color: var(--color-base-80);
}

.checklist li::before {
    content: "";
    display: inline-block;
    width: 1.1rem;
    height: 1.1rem;
    border-radius: 999px;
    margin-right: 0.75rem;
    background: var(--color-primary);
}

.methodology {
    gap: clamp(1.6rem, 3vw, 2.4rem);
}

.methodology .card {
    display: grid;
    gap: 1rem;
}

.catalogue-cta {
    margin-top: clamp(2.4rem, 4vw, 3.2rem);
    display: flex;
    justify-content: center;
}

.catalogue-cta .btn {
    min-width: 20rem;
}

@media (max-width: 768px) {
    .page-hero--services {
        background-position: center;
    }

    .service-card {
        grid-template-columns: 1fr;
    }
}
