/**
 * Pied de page — maquette Figma « Scala_Webdesign_Home_0926 » (1440 × 721).
 * Cotes relevées dans le mode Dev, depuis le haut du pied de page :
 *
 *   Logo        240 × 63, centré, à 74 px
 *   Colonnes    à 186 px, pas de 307 px depuis x = 118 (largeur 1205)
 *               accroche Termina 700/14px/19px blanc (284 px) ;
 *               « Contactez-nous » Montserrat 700/12px rouge, capitales, filet de 128 px
 *               titres Montserrat 700/12px blanc, capitales, interlettrage 1px
 *               listes Montserrat 500/10px/19px #999
 *               réseaux : pictos rouges 24 px
 *   Univers     rangée de logos à 416 px, répartis sur la largeur
 *   Mentions    à 536 px : Montserrat 300/12px #999, gauche et droite
 *   Contour     mot SCALA 1206 × 198, filet rouge, à 590 px, rogné par le bas
 */

.scrf {
    position: relative; overflow: hidden; background: #000; color: #fff;
    /* Sans le mot SCALA sous les mentions (retours du 27/10) : plus de
       hauteur réservée en bas. */
    box-sizing: border-box; padding: 64px 0 48px;
    font-family: Montserrat, Helvetica, Arial, sans-serif;
}
.scrf p, .scrf ul { margin: 0; padding: 0; }
.scrf li { list-style: none !important; margin: 0; padding: 0; }
.scrf a { text-decoration: none; }
.scrf-wrap { position: relative; z-index: 1; max-width: 1205px; margin: 0 auto; padding: 0 24px; box-sizing: content-box; }

.scrf-logo { display: block; width: 240px; margin: 0 auto; color: #fff !important; line-height: 0; }
.scrf-logo-svg { display: block; width: 240px; height: auto; }

.scrf-colonnes { display: grid; grid-template-columns: 307px 307px 307px auto; margin-top: 0; }
.scrf-accroche {
    max-width: 284px; font-family: var(--scr-f-titre, 'termina', sans-serif); font-weight: 700; font-size: 14px; line-height: 19px; color: #fff;
}
.scrf-contact {
    position: relative; display: inline-block; margin-top: 16px; padding-bottom: 8px;
    font-weight: 700; font-size: 12px; line-height: 14px; letter-spacing: 1px; text-transform: uppercase; color: #d60407 !important;
}
.scrf-contact::after { content: ''; position: absolute; left: 0; bottom: 0; width: 128px; height: 1px; background: #d60407; }
.scrf-titre { font-weight: 700; font-size: 12px; line-height: 14px; letter-spacing: 1px; text-transform: uppercase; color: #fff; }
/* Listes : alignées sur leur titre (le thème indente les <ul> et espace les
   <li>), même rythme partout. « Nous trouver » : les villes seules, deux
   colonnes, puis le lien rouge « Toutes nos concessions » (retours du 23/10). */
.scrf ul.scrf-liste { margin: 14px 0 0 !important; padding: 0 !important; list-style: none !important; }
.scrf ul.scrf-liste li { margin: 0 !important; padding: 0 !important; line-height: 0; }
.scrf-liste a {
    display: inline-block; padding: 3px 0; font-weight: 500; font-size: 12px; line-height: 18px;
    color: #999 !important; transition: color .15s ease;
}
.scrf ul.scrf-villes { columns: 2; column-gap: 36px; max-width: 250px; }
.scrf ul.scrf-villes li { break-inside: avoid; }
.scrf-toutes { margin-top: 16px; }
.scrf-liste a:hover, .scrf-liste a:focus-visible { color: #fff !important; }
.scrf-reseaux { display: flex; align-items: center; gap: 28px; margin-top: 14px !important; }
.scrf-reseaux a { display: block; line-height: 0; transition: transform .15s ease, filter .15s ease; }
.scrf-reseaux a:hover { transform: translateY(-2px); filter: brightness(1.2); }
.scrf-reseaux img { display: block; width: auto; height: 24px; }

.scrf-univers { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 70px !important; }
.scrf-univers a { display: block; line-height: 0; opacity: .9; transition: opacity .15s ease; }
.scrf-univers a:hover { opacity: 1; }
.scrf-univers img { display: block; width: auto; height: 34px; max-width: 130px; object-fit: contain; }
.scrf-univers img.scrf-blanchir { filter: brightness(0) invert(1); }

.scrf-bas { display: flex; justify-content: space-between; gap: 24px; margin-top: 43px; }
.scrf-mentions, .scrf-covoiturage { font-weight: 300; font-size: 12px; line-height: 19px; color: #999; }
.scrf-mentions a { color: #999 !important; text-decoration: underline; text-underline-offset: 2px; }
.scrf-mentions a:hover { color: #fff !important; }
.scrf-covoiturage { text-align: right; }
.scrf-covoiturage strong { font-weight: 700; }

.scrf-contour {
    position: absolute; z-index: 0; top: 590px; left: 50%; transform: translateX(-50%);
    width: 1206px; max-width: 84vw; pointer-events: none; user-select: none;
}
.scrf-contour-svg { display: block; width: 100%; height: auto; overflow: visible; }
/* Tracé normalisé : le pointillé 1/1 masque tout le contour, puis se
   referme quand le pied de page arrive à l'écran (classe .is-dessine). */
.scrf-trace {
    fill: none; stroke: #d60407; stroke-width: 2px; vector-effect: non-scaling-stroke;
    stroke-linecap: round; stroke-linejoin: round;
    stroke-dasharray: 1 1; stroke-dashoffset: 1;
}
/* Transition au dessin seulement : hors de l'écran, il s'efface d'un coup
   et se redessine au prochain passage. */
.scrf-contour.is-dessine .scrf-trace { stroke-dashoffset: 0; transition: stroke-dashoffset 3.2s cubic-bezier(.65, 0, .35, 1) .15s; }
@media (prefers-reduced-motion: reduce) { .scrf-trace { transition: none; stroke-dashoffset: 0; } }

@media (max-width: 1100px) {
    .scrf-colonnes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 24px; }
    .scrf-univers { flex-wrap: wrap; justify-content: center; gap: 28px 40px; margin-top: 56px !important; }
}
@media (max-width: 767px) {
    .scrf { padding: 40px 0 32px; min-height: 0; }
    .scrf-wrap { padding: 0 16px; }
    .scrf-logo, .scrf-logo-svg { width: 180px; }
    .scrf-colonnes { grid-template-columns: minmax(0, 1fr); text-align: center; margin-top: 0; }
    .scrf-accroche { margin: 0 auto; }
    /* Liste des villes (250 px max) centrée sous son titre (retours du 29/10). */
    .scrf ul.scrf-villes { margin-left: auto !important; margin-right: auto !important; }
    .scrf ul, .scrf li { text-align: center; }
    .scrf-reseaux { justify-content: center; }
    .scrf-univers img { height: 28px; }
    .scrf-bas { flex-direction: column; align-items: center; text-align: center; margin-top: 40px; }
    .scrf-covoiturage { text-align: center; }
    .scrf-contour { top: auto; bottom: -40px; max-width: 110vw; }
}

/* Téléphone : plus de barre d'icônes fixée en bas d'écran (retours du 29/10),
   la barre du haut suffit. Section « nav-footer » des pieds de page Divi. */
.et-l--footer .nav-footer { display: none !important; }
