/* Pied de page (footer.php), commun à tout le site */

.lc-footer{
    border-top: 4px solid var(--c-green);
    background: var(--c-ink-deep);
    color: var(--c-cream);
    font-size: 1rem;
    line-height: 1.6;
}

.lc-footer__haut,
.lc-footer__bas{
    width: min(100% - 2 * var(--gutter), var(--container));
    margin-inline: auto;
}

:where(.lc-footer) :is(ul, p, h2){
    margin: 0;
}

:where(.lc-footer) ul{
    padding: 0;
    list-style: none;
}

.lc-footer a{
    color: inherit;
    text-decoration: none;
    transition: color 200ms ease;
}

.lc-footer a:hover{
    color: var(--c-green);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.25em;
}

/* ---------- Haut : la marque à gauche, trois colonnes de liens à droite ---------- */

/* La colonne Contact est plus large : l'adresse e-mail doit tenir sur une ligne */
.lc-footer__haut{
    display: grid;
    grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr) minmax(0, 1.6fr) minmax(0, 1fr);
    gap: 2.5rem clamp(1.5rem, 4vw, 4rem);
    padding-block: clamp(3rem, 7vw, 5rem);
}

.lc-footer__logo{
    display: inline-block;
}

.lc-footer__logo img{
    display: block;
    width: 3.5rem;
    height: 3.5rem;
    transition: transform 600ms ease;
}

.lc-footer__logo:hover img{
    transform: rotate(360deg);
}

.lc-footer__nom{
    margin-top: 1rem;
    font-family: var(--font-display);
    font-size: clamp(1.75rem, 3vw, 2.25rem);
    line-height: 1.1;
}

.lc-footer__baseline{
    max-width: 24rem;
    margin-top: 0.75rem;
    color: color-mix(in srgb, var(--c-cream) 75%, transparent);
}

.lc-footer .lc-footer__titre{
    margin-bottom: 0.75rem;
    color: color-mix(in srgb, var(--c-cream) 65%, transparent);
    font-family: var(--font-sans);
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 0;
}

.lc-footer__liens{
    display: grid;
    gap: 0.5rem;
    font-family: var(--font-serif);
    font-size: 1.125rem;
    line-height: 1.3;
}

.lc-footer__liens a{
    overflow-wrap: anywhere;
}

/* ---------- Bas : la signature et les liens légaux ---------- */

.lc-footer__bas{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.75rem 2rem;
    padding-block: 1.25rem;
    border-top: 1px solid color-mix(in srgb, var(--c-cream) 18%, transparent);
    color: color-mix(in srgb, var(--c-cream) 75%, transparent);
    font-size: 0.875rem;
}

.lc-footer__bas ul{
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
}

/* « Gérer les cookies » : un bouton qui a l'allure des liens voisins
   (le thème parent donne un fond et un cadre à tout bouton, y compris au survol) */
.lc-footer .lc-footer__cookies,
.lc-footer .lc-footer__cookies:hover,
.lc-footer .lc-footer__cookies:focus{
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    color: inherit;
    font: inherit;
    cursor: pointer;
}

.lc-footer .lc-footer__cookies:hover{
    color: var(--c-green);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.25em;
}

/* ---------- Bannière de cookies ---------- */

/* Une carte posée en bas à gauche : elle ne bloque pas la lecture de la page */
.lc-cookies{
    position: fixed;
    bottom: 1rem;
    left: 1rem;
    z-index: 9998;
    display: grid;
    gap: 1rem;
    width: min(24rem, 100% - 2rem);
    padding: 1.25rem;
    border: 1px solid color-mix(in srgb, var(--c-cream) 18%, transparent);
    border-radius: var(--r-md);
    background: var(--c-ink-deep);
    box-shadow: 0 1rem 3rem color-mix(in srgb, var(--c-ink-deep) 35%, transparent);
    color: var(--c-cream);
    font-size: 0.9375rem;
    line-height: 1.5;
    animation: lc-cookies-entree 500ms cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

.lc-cookies[hidden]{
    display: none;
}

.lc-cookies p{
    margin: 0;
}

.lc-cookies a{
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.lc-cookies a:hover{
    color: var(--c-green);
}

.lc-cookies__actions{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

/* Refuser et accepter : deux boutons identiques */
.lc-cookies .lc-cookies__btn,
.lc-cookies .lc-cookies__btn:focus{
    min-height: 2.75rem;
    padding: 0.5rem 1rem;
    border: 0;
    border-radius: var(--r-sm);
    background: var(--c-cream);
    color: var(--c-ink-deep);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    transition: background-color 200ms ease;
}

.lc-cookies .lc-cookies__btn:hover{
    background: var(--c-white);
    color: var(--c-ink-deep);
}

@keyframes lc-cookies-entree{
    from{ opacity: 0; translate: 0 1rem; }
}

/* ---------- Responsive ---------- */

@media (max-width: 64rem){
    .lc-footer__haut{
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) minmax(0, 1fr);
    }

    .lc-footer__marque{
        grid-column: 1 / -1;
    }
}

@media (max-width: 40rem){
    .lc-footer__haut{
        grid-template-columns: minmax(0, 1fr);
        gap: 2rem;
    }
}

/* Écrans tactiles : les liens sont assez hauts pour être touchés du doigt (44 px) */
@media (pointer: coarse){
    .lc-footer__liens,
    .lc-footer__bas ul{
        row-gap: 0;
    }

    .lc-footer__liens a,
    .lc-footer__bas a,
    .lc-footer__bas .lc-footer__cookies{
        display: inline-flex;
        align-items: center;
        gap: 0.3em; /* l'espace entre le texte et la flèche, que la mise en ligne flexible supprime */
        min-height: 2.75rem;
    }
}

@media (prefers-reduced-motion: reduce){
    .lc-cookies{
        animation: none;
    }

    .lc-cookies .lc-cookies__btn,
    .lc-footer a,
    .lc-footer__logo img{
        transition: none;
    }
}
