/* ── Bloc CTA ── */

.bloc-cta__inner {
    text-align: center;
    max-width: var(--cta-inner-max-width);
    margin: 0 auto;
}

.bloc-cta__titre {
    font-size: var(--font-size-section-title);
    font-weight: var(--font-weight-heading);
    text-transform: uppercase;
    margin-bottom: var(--space-sm);
}

.bloc-cta__texte {
    font-size: var(--font-size-body);
    line-height: 1.7;
    margin-bottom: var(--space-lg);
    color: var(--color-text);
}

/* Fond sombre — surcharge couleur texte */
.sec--dark .bloc-cta__titre {
    color: #ffffff;
}

.sec--dark .bloc-cta__texte {
    color: rgba(255, 255, 255, 0.75);
}

/* ── Image de fond — overlay dégradé brun-orangé ── */
.bloc-cta--image {
    background-size: cover;
    background-position: center right;
    position: relative;
}

/* Overlay desktop : opaque à gauche (contenu), transparent à droite (photo) */
.bloc-cta--image::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to right,
        var(--cta-overlay-start) 0%,
        var(--cta-overlay-mid)   45%,
        var(--cta-overlay-end)   75%
    );
    z-index: 0;
}

.bloc-cta--image .container {
    position: relative;
    z-index: 1;
}

/* Boutons — utilisent .btn .btn--primary et .btn--ghost (components.css) */
.bloc-cta__boutons {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    justify-content: center;
}

/* Sur fond clair, .btn--ghost devient secondaire sombre */
.bloc-cta:not(.sec--dark) .btn--ghost {
    color: var(--color-primary);
    border-color: var(--color-border);
}
.bloc-cta:not(.sec--dark) .btn--ghost:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .bloc-cta__boutons {
        flex-direction: column;
        align-items: center;
    }

    .bloc-cta__boutons .btn {
        width: 100%;
        text-align: center;
        justify-content: center;
    }

    /* Overlay mobile : uniforme opaque (image quasi invisible) */
    .bloc-cta--image::before {
        background: var(--cta-overlay-start);
    }
}