/* =========================================================================
   Pied de page du site (includes/home-sections.php, mci_hs_render_footer) — refait le 2026-10-08,
   textes agrandis le 2026-10-09 (« ils ont l'air petits ») : 15,5 px au lieu de 14 px
   (ancienne version : sauvegardes-tcf/2026-10-08-avant-pied-de-page/)
   Fin et sobre : bleu nuit profond, filet lumineux en haut, intitulés courts, liens en Inter,
   coordonnées avec petite étiquette, paiement en une ligne, barre du bas discrète.
   Chargé sur toutes les pages où il s'affiche : remise à zéro des styles du thème sous .mci-ft.
   Couleurs du site (bleu nuit, bleu, vert), aucune bordure latérale.
   ========================================================================= */

.mci-ft {
    --ft-bg: #061A3D;
    --ft-text: rgba(255, 255, 255, 0.72);
    --ft-strong: #fff;
    --ft-line: rgba(255, 255, 255, 0.08);
    --ft-green: #12BB6A;
    --ft-inter: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    position: relative;
    overflow: hidden;
    padding: 48px 0 0;
    background-color: var(--ft-bg);
    background-image: radial-gradient(720px 320px at 88% 0%, rgba(19, 99, 223, 0.22), transparent 70%);
    font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15.5px;
    line-height: 1.55;
    color: var(--ft-text);
    -webkit-font-smoothing: antialiased;
}

/* Filet lumineux en haut (bleu puis vert, qui s'estompe vers les bords) */
.mci-ft::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(19, 99, 223, 0.7) 30%, rgba(18, 187, 106, 0.6) 65%, transparent 100%);
}

.mci-ft *,
.mci-ft *::before,
.mci-ft *::after {
    box-sizing: border-box;
}

/* Remise à zéro (le thème stylise p, ul, li, a, img) */
.mci-ft.mci-ft :where(p, ul, li, nav) {
    margin: 0;
    padding: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    list-style: none;
}

.mci-ft.mci-ft :where(a) {
    color: inherit;
    text-decoration: none;
    box-shadow: none;
}

.mci-ft.mci-ft :where(img) {
    display: block;
    max-width: 100%;
}

.mci-ft-wrap {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 16px;
}

/* ── Haut : marque | colonnes ────────────────────────────────────────── */
.mci-ft-top {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 36px 24px;
    padding-bottom: 40px;
}

.mci-ft-brand,
.mci-ft-contact {
    grid-column: 1 / -1;
}

.mci-ft .mci-ft-logo {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: var(--ft-strong);
}

.mci-ft .mci-ft-logo:hover {
    color: var(--ft-strong);
}

.mci-ft-logo img {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.mci-ft-logo b {
    display: block;
    font-size: 19px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: 0.01em;
}

.mci-ft-logo small {
    display: block;
    margin-top: 3px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
}

.mci-ft .mci-ft-about {
    max-width: 360px;
    margin-top: 16px;
    font-family: var(--ft-inter);
    font-size: 15.5px;
    line-height: 1.7;
    letter-spacing: -0.006em;
}

.mci-ft-social {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
}

.mci-ft .mci-ft-social .mci-hh-social {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    color: rgba(255, 255, 255, 0.82);
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.mci-ft .mci-ft-social .mci-hh-social:hover,
.mci-ft .mci-ft-social .mci-hh-social:focus-visible {
    background: var(--ft-green);
    border-color: var(--ft-green);
    color: #082A5E;
}

.mci-ft-social svg {
    width: 15px;
    height: 15px;
}

/* Colonnes de liens */
.mci-ft .mci-ft-h {
    margin-bottom: 16px;
    font-size: 15.5px;
    font-weight: 700;
    letter-spacing: 0.01em;
    color: var(--ft-strong);
}

.mci-ft-col ul {
    display: grid;
    gap: 12px;
}

.mci-ft .mci-ft-col a {
    font-family: var(--ft-inter);
    font-size: 15.5px;
    letter-spacing: -0.006em;
    color: var(--ft-text);
    transition: color 0.15s ease;
}

.mci-ft .mci-ft-col a:hover,
.mci-ft .mci-ft-col a:focus-visible {
    color: var(--ft-strong);
}

.mci-ft a:focus-visible {
    outline: 2px solid var(--ft-green);
    outline-offset: 3px;
    border-radius: 4px;
}

/* Nous joindre : icône + petite étiquette + valeur */
.mci-ft-contact ul {
    gap: 14px;
}

.mci-ft .mci-ft-contact a,
.mci-ft-line {
    display: inline-flex;
    align-items: flex-start;
    gap: 11px;
}

.mci-ft-ic {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin-top: 1px;
    border-radius: 8px;
    background: rgba(18, 187, 106, 0.12);
    color: #3DDC8F;
}

.mci-ft-contact small {
    display: block;
    margin-bottom: 1px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
}

.mci-ft .mci-ft-contact a span,
.mci-ft-line > span:last-child {
    font-family: var(--ft-inter);
    font-size: 15.5px;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.86);
}

.mci-ft .mci-ft-contact a:hover span:last-child {
    color: var(--ft-strong);
}

/* Paiement : une seule ligne discrète */
.mci-ft .mci-ft-pay {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 14px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--ft-line);
    font-family: var(--ft-inter);
    font-size: 14.5px;
}

.mci-ft-pay-label {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.42);
}

.mci-ft-pay-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: rgba(255, 255, 255, 0.78);
}

.mci-ft-pay-item svg {
    color: #3DDC8F;
}

/* ── Barre du bas ────────────────────────────────────────────────────── */
.mci-ft-bottom {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 18px 0 22px;
    border-top: 1px solid var(--ft-line);
    font-family: var(--ft-inter);
    font-size: 14.5px;
}

.mci-ft .mci-ft-copy {
    color: rgba(255, 255, 255, 0.58);
}

.mci-ft-legal {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 20px;
}

.mci-ft .mci-ft-legal a {
    color: rgba(255, 255, 255, 0.7);
    transition: color 0.15s ease;
}

.mci-ft .mci-ft-legal a:hover {
    color: var(--ft-strong);
}

/* Grand nom en filigrane (désactivé par défaut, réglable dans l'administration) */
.mci-ft-word {
    margin-bottom: -0.2em;
    font-size: clamp(48px, 12.6vw, 180px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.04em;
    text-align: center;
    white-space: nowrap;
    color: rgba(255, 255, 255, 0.04);
    user-select: none;
}

/* ── Tablette ────────────────────────────────────────────────────────── */
@media (min-width: 640px) {
    .mci-ft-wrap {
        padding: 0 24px;
    }

    .mci-ft-bottom {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
    }
}

/* ── Ordinateur : marque | Épreuves | Ressources | Nous joindre ─────── */
@media (min-width: 1024px) {
    .mci-ft {
        padding-top: 64px;
    }

    .mci-ft-top {
        grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 0.9fr) minmax(0, 1.15fr);
        gap: 48px;
        padding-bottom: 52px;
    }

    .mci-ft-brand,
    .mci-ft-contact {
        grid-column: auto;
    }

    .mci-ft-bottom {
        padding: 20px 0 26px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mci-ft *,
    .mci-ft *::before {
        transition: none !important;
    }
}