/* =========================================================================
   Footer — transposition pixel-perfect de la maquette Lovable
   (components/site/Footer.tsx : bg deep-blue, grille 5 colonnes, gap 64px)
   Mobile-first. Toutes les valeurs récurrentes proviennent de _variables.css.
   ========================================================================= */

.footer {
    background: var(--color-deep-blue);
    color: var(--white);
}

/* Conteneur : max-w-7xl (1280px) mx-auto px-6 (24px) + py-16 (64px) */
.footer__container {
    max-width: var(--main-layout-max-width);
    margin: 0 auto;
    padding: var(--spacing-16) var(--spacing-6);
}

/* Grille principale : grid-cols-1 -> sm:grid-cols-2 -> lg:[280px auto*4] */
.footer__main {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-16);
}

@media (min-width: 640px) {
    .footer__main {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .footer__main {
        grid-template-columns: 280px auto auto auto auto;
    }
}

/* Colonne agence (logo + présentation) */
.footer__logo {
    display: block;
    height: var(--footer-logo-height);
    width: auto;
    margin-bottom: var(--spacing-4);
}

.footer__presentation {
    margin: 0;
    font-size: var(--font-size-sm);
    line-height: var(--line-height-relaxed);
    color: var(--color-white-70);
}

/* Le <ul> du menu footer devient transparent : ses <li> deviennent
   directement des colonnes de la grille .footer__main (display: contents). */
.menu__footer {
    display: contents;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Neutralise les puces / pseudo-éléments décoratifs globaux du thème */
.footer li {
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer li::before {
    display: none;
    content: none;
}

/* Seules les entrées de menu ayant des sous-éléments forment des colonnes.
   Les entrées de premier niveau sans sous-menu ne font pas partie du design. */
.menu__footer>li:not(.menu-item-has-children) {
    display: none;
}

/* Titre de colonne (entrée de menu de premier niveau) */
.menu__footer>li>a {
    display: inline-block;
    margin-bottom: var(--spacing-4);
    font-size: var(--font-size-sm);
    font-weight: var(--semibold);
    line-height: var(--line-height-sm);
    text-transform: uppercase;
    letter-spacing: var(--letter-spacing-wide);
    color: var(--color-skin);
    text-decoration: none;
}

/* Liste de liens de la colonne */
.menu__footer .sub-menu {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2);
}

.menu__footer .sub-menu a {
    display: inline-block;
    font-size: var(--font-size-sm);
    line-height: var(--line-height-sm);
    color: var(--color-white-70);
    text-decoration: none;
    transition: var(--transition);
}

.menu__footer .sub-menu a:hover,
.menu__footer .sub-menu li.current-menu-item>a {
    color: var(--color-primary-light);
}
