/* ============================================================
   PRÉ-FOOTER — 3 colonnes pilotées par les champs ACF "Options communes"
   (Colonne 1/2/3). Structure/espacements calés sur PartnersSection.tsx
   (Lovable) — le composant qui correspond réellement à la forme des champs
   (titre + image + texte + lien pour Col 1/2, titre + grille de logos pour
   Col 3). Fond = --color-skin (#ffe1d7, pêche CLAIR — pas un fond sombre),
   chaque élément de texte porte sa propre couleur explicite (titre=primary,
   texte=deep-blue, lien=cta) pour un contraste correct sur ce fond clair.
   ============================================================ */

.pre-footer {
    background-color: var(--color-skin);
    padding: 48px 0;
    /* py-12 (PartnersSection) */

    @media (max-width: 768px) {
        padding: 32px 0;
    }
}

.pre-footer__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    /* gap-10 (PartnersSection) */

    @media (min-width: 768px) {
        /* grid-cols-1 md:grid-cols-3 : pas de palier intermédiaire à 2 colonnes
           chez Lovable, on reste fidèle (empilé jusqu'à 768px, 3 colonnes ensuite). */
        grid-template-columns: repeat(3, 1fr);
    }
}

.pre-footer__title {
    margin: 0 0 16px;
    /* mb-4 */
    font-size: 0.875rem;
    /* text-sm */
    font-weight: var(--semibold);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    /* tracking-wider */
    color: var(--color-primary);
}

.pre-footer__image {
    margin-bottom: 16px;
    /* mb-4 */

    img {
        display: block;
        height: 80px;
        /* h-[80px] */
        width: auto;
        max-width: 160px;
        /* w-[160px] : plafond, sans forcer une largeur fixe qui déformerait
           un logo dont le ratio réel diffère (contrairement aux 2 logos de
           démo Lovable, homogènes) */
        object-fit: contain;
    }
}

.pre-footer__text {
    margin-bottom: 12px;
    /* mb-3 */
    /* text-sm */
    /* leading-relaxed */
    /* text-cerf-deep-blue/70 (PartnersSection) — fond clair (--color-skin), conservé tel quel */
    
    p {
        font-size: 0.875rem;
        line-height: 1.625;
        color: #04081bb3;
        margin: 0;
    }
}

.pre-footer__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.875rem;
    /* text-sm */
    font-weight: var(--medium);
    /* font-medium */
    color: var(--color-cta);
    /* text-cerf-orange adapté en fond sombre : couleur déjà utilisée pour
       les liens clairs sur fond deep-blue ailleurs dans le thème (footer.css) */
    text-decoration: none;
    transition: color 0.2s ease;

    svg {
        flex-shrink: 0;
        /* Pas d'animation de la flèche au survol : même mécanisme/icône que
           le CTA "Dernier congrès" (.dar__btn), qui n'anime pas non plus son
           icône au survol (seul le fond/texte change) — reste cohérent. */
    }

    &:hover {
        color: var(--color-primary-dark);
    }
}

/* Colonne "partenaires" : grille de logos, sans texte/lien */
.pre-footer__partenaires {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    /* gap-3 (PartnersSection) */
}

.pre-footer__partenaire {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: color-mix(in srgb, var(--white) 10%, transparent);
    /* bg-cerf-deep-blue/10 (PartnersSection) adapté en fond sombre : white/10 */
    border-radius: var(--border-radius-sm);
    padding: 8px;

    img {
        max-width: 100%;
        height: 64px;
        /* h-16 (LogoPlaceholder, PartnersSection) */
        width: auto;
        object-fit: contain;
    }
}