/* ==========================================================================
   THEME MAURIN — GEELY
   --------------------------------------------------------------------------
   Fichier de marque DÉDIÉ aux sites Geely du groupe Maurin.
   Self-contained : applique la charte officielle Geely (Brand Guidelines 2025).

   Règles clés de la charte Geely :
     1. Polices :
        - GEELY BOLD : Titres uniquement, STRICTEMENT EN MAJUSCULES (ALL CAPS)
        - INTER : Sous-titres, corps de texte, boutons, navigation, menus
     2. Couleurs officielles :
        - Geely Active Blue : #3A7FF8 (Pantone 2727 C / RGB: 58, 127, 248)
        - Geely Active Blue Dark/Hover : #2567DE
        - Geely Black : #000000
        - Geely White : #FFFFFF
        - Geely Grays : #464646 / #737373 / #F4F4F6 / bordures #E2E2E6
     3. Boutons & Conteneurs : Bords carrés (border-radius: 0px)
   ========================================================================== */


/* ==========================================================================
   1. POLICES OFFICIELLES GEELY
   -------------------------------------------------------------------------- */

@font-face {
    font-family: 'Geely Bold';
    src: url('/geely/assets/fonts/GeelyBold.woff2') format('woff2'),
         url('/geely/assets/fonts/GeelyBold.woff') format('woff'),
         url('/geely/assets/fonts/GeelyBold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GEELY BOLD';
    src: url('/geely/assets/fonts/GeelyBold.woff2') format('woff2'),
         url('/geely/assets/fonts/GeelyBold.woff') format('woff'),
         url('/geely/assets/fonts/GeelyBold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('/geely/assets/fonts/Inter-Regular.woff2') format('woff2'),
         url('/geely/assets/fonts/Inter-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('/geely/assets/fonts/Inter-Medium.woff2') format('woff2'),
         url('/geely/assets/fonts/Inter-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('/geely/assets/fonts/Inter-SemiBold.woff2') format('woff2'),
         url('/geely/assets/fonts/Inter-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('/geely/assets/fonts/Inter-Bold.woff2') format('woff2'),
         url('/geely/assets/fonts/Inter-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}


:root {

    /* ----------------------------------------------------------------------
       2. PALETTE MARQUE GEELY (valeurs officielles Brand Guidelines Section 5.2)
       ---------------------------------------------------------------------- */

    --geely-active-blue:         #3A7FF8;
    --geely-active-blue-hover:   #2567DE;
    --geely-active-blue-75:      #5B9BF8;
    --geely-active-blue-50:      #85B4F8;
    --geely-active-blue-25:      #C3D8FA;
    --geely-active-blue-soft:    #EBF2FE;

    --geely-black:               #000000;
    --geely-black-hover:         #141414;
    --geely-white:               #ffffff;
    --geely-slate:               #0F172B;

    /* Nuances neutres officielles Geely (Section 5.2 : Warm & Cool Neutrals) */
    --geely-warm-gray:           #E8E7E7;
    --geely-warm-gray-light:     #E6E0DB;
    --geely-cool-gray:           #D0D7EB;
    --geely-soft-blue:           #EBF2FE;
    --geely-muted-blue:          #C3D8FA;
    --geely-card-bg-light:       #F8FAFC;
    --geely-card-bg-neutral:     #F1F5F9;
    --geely-card-bg-warm:        #F6F5F3;

    --geely-gray-dark:           #464646;
    --geely-gray-mid:            #737373;
    --geely-gray-light:          #F1F5F9;
    --geely-border:              #E2E8F0;

    /* Aliases de compatibilité pour neutraliser les résidus Renault / Toyota */
    --renault-yellow:            var(--geely-active-blue);
    --renault-yellow-hover:      var(--geely-active-blue-hover);
    --renault-black:             var(--geely-black);
    --renault-black-hover:       var(--geely-black-hover);
    --renault-white:             var(--geely-white);
    --renault-gray-light:        var(--geely-card-bg-neutral);
    --renault-gray-mid:          var(--geely-gray-mid);
    --renault-gray-dark:         var(--geely-gray-dark);
    --renault-border:            var(--geely-border);

    /* Mapping vers les noms de palette Maurin */
    --maurin-primary:            var(--geely-black);
    --maurin-secondary:          var(--geely-black-hover);
    --maurin-accent:             var(--geely-active-blue);
    --maurin-accent-hover:       var(--geely-active-blue-hover);
    --maurin-text:               var(--geely-black);
    --maurin-bg-soft:            var(--geely-card-bg-light);
    --maurin-white:              var(--geely-white);
    --maurin-light-gray:         var(--geely-card-bg-neutral);
    --maurin-black:              var(--geely-black);

    /* ----------------------------------------------------------------------
       Typographies officielles Geely
       ---------------------------------------------------------------------- */

    --maurin-font-primary:   'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    --maurin-font-secondary: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    --maurin-font-title:     'Geely Bold', 'GEELY BOLD', sans-serif;

    --theme-font-primary:    var(--maurin-font-primary);
    --theme-font-secondary:  var(--maurin-font-secondary);
    --theme-title-font:      'Geely Bold', 'GEELY BOLD', sans-serif;
    --theme-text-font:       'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    --theme-button-font:     'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;

    /* ----------------------------------------------------------------------
       Radius / arrondis — Geely = design moderne angulaire, boutons RECTANGULAIRES.
       ---------------------------------------------------------------------- */

    --maurin-section-radius: 0px;
    --maurin-image-radius:   0px;
    --maurin-button-radius:  0px;

    --theme-section-radius:           var(--maurin-section-radius);
    --theme-section-container-radius: var(--maurin-section-radius);
    --theme-card-radius:              var(--maurin-section-radius);
    --theme-image-radius:             var(--maurin-image-radius);
    --theme-button-radius:            var(--maurin-button-radius);

    /* ----------------------------------------------------------------------
       Boutons (dimensions génériques)
       ---------------------------------------------------------------------- */

    --maurin-button-height:      48px;
    --maurin-button-padding-x:   24px;
    --maurin-button-font-size:   15px;
    --maurin-button-font-weight: 600;

    --theme-button-height:      var(--maurin-button-height);
    --theme-button-padding-x:   var(--maurin-button-padding-x);
    --theme-button-font-size:   var(--maurin-button-font-size);
    --theme-button-font-weight: var(--maurin-button-font-weight);

    /* ----------------------------------------------------------------------
       3. TOKENS SÉMANTIQUES GLOBAUX
       ---------------------------------------------------------------------- */

    /* Sections */
    --theme-section-title-color:    var(--geely-black);
    --theme-section-subtitle-color: var(--geely-black);
    --theme-section-text-color:     var(--geely-black);
    --theme-section-background:     var(--geely-white);

    /* Blocs de contenu */
    --theme-block-title-color:    var(--geely-black);
    --theme-block-subtitle-color: var(--geely-black);
    --theme-block-text-color:     var(--geely-black);

    /* Boutons */
    --theme-button-bg:         var(--geely-black);
    --theme-button-bg-hover:   var(--geely-active-blue);
    --theme-button-text-color: var(--geely-white);

    /* Bordures / contours / accents */
    --theme-border-accent-color: var(--geely-active-blue);

    /* Médias / cards */
    --theme-card-border-color: var(--geely-border);
    --theme-card-background:   var(--geely-gray-light);

    /* Fonds */
    --theme-bg-default: var(--geely-white);
    --theme-bg-light:   var(--geely-gray-light);
    --theme-bg-white:   var(--geely-white);

    /* Texte global / liens */
    --theme-text-color:       var(--geely-black);
    --theme-link-color:       var(--geely-black);
    --theme-link-hover-color: var(--geely-active-blue);

    /* ----------------------------------------------------------------------
       4a. TOKENS SPÉCIFIQUES — BARRE DE NAVIGATION / HEADER
       ---------------------------------------------------------------------- */

    --theme-menu-bg:                var(--geely-white);
    --theme-menu-text-color:        var(--geely-black);
    --theme-menu-link-color:        var(--geely-black);
    --theme-menu-link-hover-color:  var(--geely-active-blue);
    --theme-menu-accent:            var(--geely-active-blue);
    --theme-menu-border-color:      var(--geely-border);
    --theme-menu-icon-color:        var(--geely-black);
    --theme-menu-action-hover-color: var(--geely-active-blue);
    --theme-menu-sitename-color:    var(--geely-black);
    --theme-menu-separator-color:   var(--geely-black);
    --theme-menu-height:            160px;
    --theme-menu-font:              var(--maurin-font-primary);

    /* ----------------------------------------------------------------------
       4a-bis. TOKENS SPÉCIFIQUES — FOOTER
       ---------------------------------------------------------------------- */

    --theme-footer-bg:                   var(--geely-black);
    --theme-footer-text-color:           var(--geely-white);
    --theme-footer-title-color:          var(--geely-white);
    --theme-footer-link-color:           var(--geely-white);
    --theme-footer-link-hover-color:     var(--geely-active-blue-75);
    --theme-footer-accent:               var(--geely-active-blue);
    --theme-footer-topbar-bg:            var(--geely-white);
    --theme-footer-topbar-text-color:    var(--geely-black);
    --theme-footer-bottombar-bg:         var(--geely-white);
    --theme-footer-bottombar-text-color: var(--geely-black);
    --theme-footer-font:                 var(--maurin-font-primary);

    /* ----------------------------------------------------------------------
       4b. TOKENS SPÉCIFIQUES — BOUTONS GEELY 3 NIVEAUX
       ---------------------------------------------------------------------- */

    --theme-btn-radius: 0px;

    --theme-btn-super-primary-bg:          var(--geely-active-blue);
    --theme-btn-super-primary-color:       var(--geely-white);
    --theme-btn-super-primary-bg-hover:    var(--geely-active-blue-hover);
    --theme-btn-super-primary-color-hover: var(--geely-white);

    --theme-btn-primary-bg:          var(--geely-black);
    --theme-btn-primary-color:       var(--geely-white);
    --theme-btn-primary-bg-hover:    var(--geely-active-blue);
    --theme-btn-primary-color-hover: var(--geely-white);

    --theme-btn-secondary-bg:           var(--geely-white);
    --theme-btn-secondary-color:        var(--geely-black);
    --theme-btn-secondary-border-color: var(--geely-black);
    --theme-btn-secondary-bg-hover:     var(--geely-gray-light);
    --theme-btn-secondary-color-hover:  var(--geely-active-blue);
}


/* ==========================================================================
   Classes utilitaires (parité avec theme-maurin.css)
   ========================================================================== */

.theme-text-primary   { color: var(--maurin-primary); }
.theme-text-secondary { color: var(--maurin-secondary); }
.theme-text-accent    { color: var(--maurin-accent); }
.theme-bg-soft        { background-color: var(--maurin-bg-soft); }
.theme-bg-primary     { background-color: var(--maurin-primary); }
.theme-border-accent  { border-color: var(--maurin-accent); }


/* ==========================================================================
   RÈGLES TYPOGRAPHIQUES GLOBALES CHARTE GEELY (SECTION 5.3 : RÈGLE DES 3 NIVEAUX)
   - NIVEAU 1 : Titres d'impact (GEELY BOLD all-caps)
   - NIVEAU 2 : Sous-titres, Chapôs, Accroches (Inter SemiBold / Medium)
   - NIVEAU 3 : Corps de texte, paragraphes, boutons, formulaires (Inter Regular)
   ========================================================================== */

/* NIVEAU 1 : Titres d'impact (Geely Bold ALL-CAPS) */
h1, h2, h3, .h1, .h2, .h3,
[class*="__title"]:not([class*="subtitle"]):not([class*="eyebrow"]),
.section-title,
.page-title,
.sec-head-title {
    font-family: 'Geely Bold', 'GEELY BOLD', sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: 0.02em !important;
    line-height: 1.15 !important;
}

h1, .h1 {
    font-size: clamp(32px, 4.5vw, 52px) !important;
}

h2, .h2, .section-title {
    font-size: clamp(24px, 3.2vw, 36px) !important;
}

h3, .h3 {
    font-size: clamp(19px, 2.2vw, 24px) !important;
}

/* NIVEAU 2 : Sous-titres, Chapôs, Accroches (Inter SemiBold / Medium) */
[class*="__subtitle"]:not(.franck-fullscreen-banner__subtitle):not(.franck-main-banner-renault-home__subtitle):not(.fmh-card__subtitle),
[class*="__lead"],
.lead,
.sec-head-subtitle {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
    font-weight: 500 !important;
    font-size: clamp(16px, 1.6vw, 19px) !important;
    line-height: 1.45 !important;
    color: var(--geely-gray-dark, #464646) !important;
}

/* Bannières et heroes à fond sombre : sous-titres toujours en blanc pur pour une lisibilité parfaite */
.franck-fullscreen-banner__subtitle,
.franck-fullscreen-banner .franck-fullscreen-banner__subtitle,
.franck-main-banner-renault-home__subtitle,
.franck-main-banner-renault-home .franck-main-banner-renault-home__subtitle,
.fmh-card__subtitle,
.franck-modele-hero__subtitle {
    color: #ffffff !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6) !important;
}

/* NIVEAU 3 : Corps de texte, paragraphes, liens, formulaires (Inter Regular) */
body, p, li,
[class*="__text"],
[class*="__desc"],
[class*="__content"] p {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
    font-weight: 400 !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
}

button, .btn,
[class*="__button"],
[class*="__btn"] {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
    border-radius: 0px !important;
}

/* ==========================================================================
   NUANCES NEUTRES & FONDS DE CARTES GEELY (SECTION 5.2)
   - Cartes et conteneurs sur fond neutre doux (#F8FAFC / #F1F5F9)
   - Bordures légères (#E2E8F0) et angles carrés stricts (0px)
   ========================================================================== */

.franck-cards-static__card,
.fma-card,
.vehicle-card,
.warranty-detail-row,
.used-car-card {
    background-color: var(--geely-card-bg-light, #F8FAFC) !important;
    border-radius: 0px !important;
    border: 1px solid var(--geely-border, #E2E8F0) !important;
}

.franck-cards-static__card:hover,
.fma-card:hover {
    border-color: var(--geely-active-blue, #3A7FF8) !important;
}

/* CARTE HERO MODÈLE (fmh-card) : FOND SOMBRE TRANSPARENT & DÉCALAGE GAUCHE */
.fmh-card {
    background: rgba(0, 0, 0, 0.46) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-radius: 0px !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
    max-width: 520px !important;
    padding: 30px 32px !important;
}

@media (min-width: 992px) {
    .franck-modele-hero__inner {
        max-width: 1400px !important;
        padding-left: clamp(24px, 4vw, 56px) !important;
        padding-right: clamp(24px, 4vw, 56px) !important;
        margin: 0 auto !important;
    }
    .franck-modele-hero--text-left .franck-modele-hero__inner {
        max-width: 1440px !important;
        margin-left: clamp(24px, 4vw, 64px) !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 32px !important;
    }
    .franck-modele-hero--text-left .fmh-card {
        max-width: 500px !important;
        margin-right: auto !important;
    }
}

.fmh-card__name,
.fmh-card__name a,
.fmh-card__price-value {
    color: #ffffff !important;
}

.fmh-card__price-label {
    color: rgba(255, 255, 255, 0.75) !important;
}

.fmh-energy {
    cursor: pointer !important;
}

.fmh-energy__label {
    color: rgba(255, 255, 255, 0.9) !important;
    cursor: pointer !important;
    transition: color 0.2s ease !important;
}

.fmh-energy:hover .fmh-energy__label {
    color: #ffffff !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

.franck-modele-hero {
    overflow: visible !important;
}

/* Modal Étiquette Énergie Geely (centré, jamais tronqué) */
.fmh-energy-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483647 !important;
    display: none;
    align-items: center !important;
    justify-content: center !important;
    padding: 16px !important;
    box-sizing: border-box !important;
}
.fmh-energy-modal__backdrop {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0, 0, 0, 0.72) !important;
    z-index: 1 !important;
    cursor: pointer !important;
}
.fmh-energy-modal__dialog {
    position: relative !important;
    z-index: 2 !important;
    background: #ffffff !important;
    border-radius: 0px !important;
    max-width: min(780px, 94vw) !important;
    max-height: 90vh !important;
    display: flex !important;
    flex-direction: column !important;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.5) !important;
    overflow: hidden !important;
    animation: fmhModalFadeIn 0.25s ease forwards;
}
.fmh-energy-modal__header {
    background: #000000 !important;
    color: #ffffff !important;
    padding: 12px 48px 12px 20px !important;
    display: flex !important;
    align-items: center !important;
    min-height: 48px !important;
    box-sizing: border-box !important;
}
.fmh-energy-modal__title {
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em !important;
    text-transform: uppercase !important;
    color: #ffffff !important;
    font-family: 'Geely Bold', 'GEELY BOLD', sans-serif !important;
    margin: 0 !important;
}
.fmh-energy-modal__close {
    position: absolute !important;
    top: 6px !important;
    right: 8px !important;
    width: 36px !important;
    height: 36px !important;
    border: none !important;
    border-radius: 0px !important;
    background: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
    font-size: 24px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 10 !important;
    transition: background 0.2s ease !important;
    padding: 0 !important;
}
.fmh-energy-modal__close:hover {
    background: #3A7FF8 !important;
    color: #ffffff !important;
}
.fmh-energy-modal__body {
    padding: 16px !important;
    background: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    max-height: calc(90vh - 60px) !important;
    overflow: auto !important;
}
.fmh-energy-modal__body img {
    max-width: 100% !important;
    max-height: calc(90vh - 92px) !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
}
@media (max-width: 600px) {
    .fmh-energy-modal {
        padding: 8px !important;
    }
    .fmh-energy-modal__dialog {
        max-width: 100% !important;
        max-height: 94vh !important;
    }
    .fmh-energy-modal__header {
        padding: 10px 42px 10px 14px !important;
        min-height: 42px !important;
    }
    .fmh-energy-modal__title {
        font-size: 13px !important;
    }
    .fmh-energy-modal__close {
        width: 30px !important;
        height: 30px !important;
        font-size: 20px !important;
        top: 6px !important;
        right: 6px !important;
    }
    .fmh-energy-modal__body {
        padding: 8px !important;
        max-height: calc(94vh - 50px) !important;
    }
    .fmh-energy-modal__body img {
        max-height: calc(94vh - 66px) !important;
    }
}

/* BOUTONS HERO MODÈLE */
.fmh-btn {
    border-radius: 0px !important;
    font-weight: 600 !important;
    transition: all 0.25s ease !important;
}

.fmh-btn--primary,
.fmh-btn--secondary {
    background: #000000 !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.4) !important;
}

.fmh-btn--primary:hover,
.fmh-btn--secondary:hover {
    background: #222222 !important;
    color: #ffffff !important;
    border-color: #ffffff !important;
    transform: translateY(-2px) !important;
}

/* FRANCK MODÈLE ADVANTAGES : ICÔNES CARRÉES BLEU GEELY */
.fma-icon {
    border-radius: 0px !important;
    background: rgba(58, 127, 248, 0.1) !important;
    color: var(--geely-active-blue, #3A7FF8) !important;
}

.fma-card:hover .fma-icon {
    background: var(--geely-active-blue, #3A7FF8) !important;
    color: #ffffff !important;
}

/* DIRECTION ARTISTIQUE DES VISUELS (SECTION 6 & NEW ENERGY 2025 : "MADE FOR REAL LIFE")
   - Lumière naturelle, rendu contrasté propre, pas de filtres sombres artificiels */
.franck-cards-static__card-media img,
.fmh-card img,
.fma-card img,
.franck-modele-hero img {
    image-rendering: -webkit-optimize-contrast;
}


/* ==========================================================================
   OVERRIDES "CHARTE" — composants Maurin réutilisés sur Geely
   ========================================================================== */

/* franck-cards-static : titres en MAJUSCULES Geely Bold + centré */
.franck-cards-static__title {
    font-family: 'Geely Bold', 'GEELY BOLD', sans-serif !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    line-height: 40px !important;
    letter-spacing: 0 !important;
}
.franck-cards-static__subtitle {
    font-family: 'Inter', sans-serif !important;
    font-weight: 400 !important;
    line-height: 22px !important;
    letter-spacing: 0 !important;
}
.franck-cards-static__eyebrow,
.franck-cards-static__title,
.franck-cards-static__subtitle { text-align: center !important; }


/* franck-two-lines-img-text : en-tête de section centré + titre MAJUSCULES */
.franck-two-lines-img-text__title {
    font-family: 'Geely Bold', 'GEELY BOLD', sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: 0 !important;
    font-size: 35px !important;
}
.franck-two-lines-img-text__subtitle {
   font-family: 'Inter', sans-serif !important;
   font-size: 20px !important;
}
.franck-two-lines-img-text__eyebrow,
.franck-two-lines-img-text__title,
.franck-two-lines-img-text__subtitle,
.franck-two-lines-img-text__section-text { text-align: center !important; }


/* franck-faq-with-picture : en-tête de section centré + titre MAJUSCULES */
.franck-faq-with-picture__header { text-align: center !important; }
.franck-faq-with-picture__title {
   font-family: 'Geely Bold', 'GEELY BOLD', sans-serif !important;
   text-transform: uppercase !important;
   letter-spacing: 0 !important;
   font-size: 35px !important;
}
.franck-faq-with-picture__subtitle {
   font-family: 'Inter', sans-serif !important;
   font-size: 20px !important;
}

/* franck-slider-banner-cta */
.franck-slider-banner-cta__header {
   text-align: center !important;
   margin-left: auto !important;
   margin-right: auto !important;
}
.franck-slider-banner-cta__title {
   font-family: 'Geely Bold', 'GEELY BOLD', sans-serif !important;
   text-transform: uppercase !important;
   letter-spacing: 0 !important;
   font-size: 35px !important;
}
.franck-slider-banner-cta__subtitle {
   font-family: 'Inter', sans-serif !important;
   font-size: 20px !important;
}
.franck-slider-banner-cta__eyebrow,
.franck-slider-banner-cta__title,
.franck-slider-banner-cta__subtitle,
.franck-slider-banner-cta__section-text { text-align: center !important; }

.franck-slider-banner-cta__slider {
   margin-left: auto !important;
   margin-right: auto !important;
}

/* franck-faq-with-picture : accordéon */
.franck-faq-with-picture__accordion     { border-top-color: var(--geely-black) !important; }
.franck-faq-with-picture__item          { border-bottom-color: var(--geely-black) !important; }
.franck-faq-with-picture__question-icon { color: var(--geely-black); }

/* Accordéon OUVERT : liseré Active Blue + icône Active Blue */
.franck-faq-with-picture__item.is-open { border-bottom-color: var(--geely-active-blue) !important; }
.franck-faq-with-picture__item.is-open .franck-faq-with-picture__question-icon { color: var(--geely-active-blue) !important; }

/* Arrondis à 0 */
.franck-faq-with-picture__main-card,
.franck-faq-with-picture-wrapper--container .franck-faq-with-picture,
.franck-faq-with-picture__answer-media,
.franck-faq-with-picture__button,
.franck-faq-with-picture__answer-button { border-radius: 0 !important; }

.franck-faq-with-picture__question-icon {
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
}
.franck-faq-with-picture__question-icon::after { display: none !important; }
.franck-faq-with-picture__question-icon::before {
    width: 13px !important;
    height: 8px !important;
    border-radius: 0 !important;
    background: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='8' viewBox='0 0 13 8'%3E%3Cpath d='M1 1.5 6.5 6.5 12 1.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 13px 8px no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='8' viewBox='0 0 13 8'%3E%3Cpath d='M1 1.5 6.5 6.5 12 1.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 13px 8px no-repeat;
    transform: translate(-50%, -50%) rotate(0deg);
    transition: transform .25s ease;
}
.franck-faq-with-picture__item.is-open .franck-faq-with-picture__question-icon::before {
    transform: translate(-50%, -50%) rotate(180deg);
}

.franck-faq-with-picture__item.is-open {
    padding-bottom: 32px;
}
.franck-faq-with-picture__item.is-open .franck-faq-with-picture__answer {
    padding-bottom: 0 !important;
}

/* franck-gamme-neuve */
.franck-gamme-neuve__title {
    font-family: 'Geely Bold', 'GEELY BOLD', sans-serif !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    line-height: 40px !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    font-size: 35px !important;
}

/* franck-carousel-renault-insight */
.franck-carousel-renault-insight__title {
    font-family: 'Geely Bold', 'GEELY BOLD', sans-serif !important;
    text-transform: uppercase !important;
}

/* franck-latest-usedcars */
.franck-latest-usedcars__section-title {
    font-family: 'Geely Bold', 'GEELY BOLD', sans-serif !important;
    color: var(--geely-black, #000) !important;
    text-transform: uppercase !important;
}

.franck-latest-usedcars__card,
.franck-latest-usedcars__price-box,
.franck-latest-usedcars__button,
.franck-latest-usedcars__all-button { border-radius: 0 !important; }

.franck-latest-usedcars__title-band,
.franck-latest-usedcars__price-box { background: var(--geely-gray-light, #f4f4f6) !important; }

.franck-latest-usedcars__brand,
.franck-latest-usedcars__specs i,
.franck-latest-usedcars__monthly strong,
.franck-latest-usedcars__monthly em { color: var(--geely-black, #000) !important; }

.franck-latest-usedcars__button,
.franck-latest-usedcars__all-button {
    background: var(--geely-black, #000) !important;
    color: var(--geely-white, #fff) !important;
    box-shadow: none !important;
}
.franck-latest-usedcars__button:hover,
.franck-latest-usedcars__all-button:hover {
    background: var(--geely-active-blue, #3A7FF8) !important;
    color: #ffffff !important;
}

.franck-latest-usedcars__card:hover { border-color: var(--geely-active-blue, #3A7FF8) !important; }

.franck-latest-usedcars-wrapper,
.franck-latest-usedcars__section-title,
.franck-latest-usedcars__section-subtitle,
.franck-latest-usedcars__section-text {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
}
.franck-latest-usedcars-wrapper {
    --fluv-section-title-size: 35px !important;
    --fluv-section-subtitle-size: 20px !important;
}
.franck-latest-usedcars__header-row {
    flex-direction: column !important;
    align-items: center !important;
}
.franck-latest-usedcars__header {
    max-width: 100% !important;
    text-align: center !important;
}
.franck-latest-usedcars__actions { justify-content: center !important; }

.franck-latest-usedcars-wrapper { --fluv-image-ratio: 57% !important; }
.franck-latest-usedcars__card--renault { background: #fff !important; }
.flur-card__body { display: flex; flex-direction: column; gap: 6px; padding: 16px; }
.flur-card__name {
    margin: 0;
    font-family: 'Geely Bold', 'GEELY BOLD', sans-serif !important;
    font-weight: 700;
    font-size: 18px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--geely-black, #000);
}
.flur-card__version { margin: 0; font-weight: 400; font-size: 16px; line-height: 16px; color: var(--geely-black, #000); }
.flur-card__specs { margin: 4px 0 0; font-weight: 400; font-size: 12px; line-height: 16px; color: var(--geely-black, #000); }
.flur-card__price { margin: 8px 0 0; font-weight: 700; font-size: 18px; line-height: 22px; color: var(--geely-black, #000); }
.flur-card__monthly { margin: 2px 0 0; font-weight: 700; font-size: 14px; line-height: 18px; text-transform: lowercase; color: var(--geely-black, #000); }
.flur-card__dealer { margin: 8px 0 0; font-weight: 400; font-size: 12px; line-height: 16px; color: var(--geely-black, #000); }
.franck-latest-usedcars__card--renault .franck-latest-usedcars__button {
    border: 1px solid var(--geely-black, #000) !important;
    border-radius: 0 !important;
    padding: 11px 18px !important;
    gap: 9px !important;
    background: var(--geely-black, #000) !important;
    color: var(--geely-white, #fff) !important;
    box-shadow: none !important;
}
.franck-latest-usedcars__card--renault .franck-latest-usedcars__button:hover {
    background: var(--geely-active-blue, #3A7FF8) !important;
    border-color: var(--geely-active-blue, #3A7FF8) !important;
    color: #fff !important;
}

.franck-latest-usedcars__card--renault .flur-card__body { flex: 1 1 auto; }
.franck-latest-usedcars__card--renault .flur-card__dealer { margin-top: auto; }

.franck-latest-usedcars__viewport { position: relative; }
.franck-latest-usedcars__viewport .franck-latest-usedcars__control {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 5;
    width: 32px; height: 60px; min-width: 0; padding: 0;
    border: none; border-radius: 0;
    background: var(--geely-black, #000); color: var(--geely-white, #fff);
}
.franck-latest-usedcars__viewport [data-fluv-prev] { left: 0; }
.franck-latest-usedcars__viewport [data-fluv-next] { right: 0; }
.franck-latest-usedcars__viewport .franck-latest-usedcars__control:hover:not(:disabled) {
    background: var(--geely-active-blue, #3A7FF8); color: var(--geely-white, #fff);
    transform: translateY(-50%); box-shadow: none;
}
.franck-latest-usedcars__viewport .franck-latest-usedcars__control:disabled { opacity: .35; }

.franck-latest-usedcars__controls.flur-dots {
    display: flex; justify-content: center; align-items: center;
    gap: 10px; margin-top: 20px;
}
.flur-dot {
    width: 14px; height: 14px; padding: 0; cursor: pointer;
    border: 2px solid var(--geely-active-blue, #3A7FF8); border-radius: 999px;
    background: transparent;
}
.flur-dot.is-active { background: var(--geely-active-blue, #3A7FF8); }

.franck-latest-usedcars__card--renault .flur-card__body { gap: 0; padding: 16px 16px 0; }
.franck-latest-usedcars__card--renault .flur-card__version { margin-top: 6px; }
.franck-latest-usedcars__card--renault .flur-card__specs   { margin-top: 8px; }
.franck-latest-usedcars__card--renault .flur-card__price   { margin-top: 24px; }
.franck-latest-usedcars__card--renault .flur-card__monthly { margin-top: 16px; }
.franck-latest-usedcars__card--renault .flur-card__dealer  { margin-top: auto; padding-top: 24px; }
.franck-latest-usedcars__card--renault .franck-latest-usedcars__button {
    align-self: flex-start; width: auto; min-width: 0; min-height: 0;
    margin: 24px 16px 16px;
}

.franck-latest-usedcars-wrapper .franck-latest-usedcars__section-subtitle {
    font-size: 20px !important;
    line-height: 1.4 !important;
}
.franck-latest-usedcars__all-button span { display: none !important; }
.franck-latest-usedcars-wrapper .franck-latest-usedcars__all-button {
    border: 1px solid var(--geely-black, #000) !important;
}
.franck-latest-usedcars-wrapper .franck-latest-usedcars__all-button:hover {
    background: var(--geely-active-blue, #3A7FF8) !important;
    border-color: var(--geely-active-blue, #3A7FF8) !important;
    color: #fff !important;
}

.franck-latest-usedcars-wrapper .franck-latest-usedcars__section-subtitle { font-weight: 400 !important; }

/* ==========================================================================
   CHARTE GEELY — BOUTONS RECTANGULAIRES / BORDS CARRÉS (radius: 0)
   Cohérence globale : tous les boutons du site ont des bords carrés
   ========================================================================== */
.franck-cards-static__button,
.franck-cards-static__card-button,
.franck-two-columns-left-picture-text-cta__block-button,
.franck-two-columns-left-picture-text-cta__button,
.franck-two-columns-right-picture-text-cta__block-button,
.franck-two-columns-right-picture-text-cta__button,
.franck-fullscreen-banner__button,
.franck-banner-text-cta__button,
.franck-slider-banner-cta__button,
.franck-two-lines-img-text__button,
.franck-two-pictures-left-text-right__button,
.franck-big-title-two-columns-animated__button,
.franck-latest-articles__button,
.franck-latest-articles__card-button,
.franck-latest-offers__button,
.franck-latest-offers__card-button,
.franck-latest-usedcars__button,
.franck-latest-usedcars__all-button,
.franck-mega-menu__cta,
.franck-dealer-contact__button,
.franck-modele-cta__button,
.fmh-btn,
.franck-modele-hero__button,
.form-contact-us-submit-btn,
.form-request-offer-submit-btn,
.form-offer-interest-submit-btn,
.franck-form-sav-submit-btn,
.fcus-form-submit,
.fcus-dealer-card,
.fcus-tab-btn,
.fcus-input,
.fcus-select,
.fcus-textarea {
    border-radius: 0 !important;
}

.fmh-card__buttons,
.franck-modele-hero__buttons {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;
    width: 100% !important;
    justify-content: center !important;
    align-items: center !important;
}

.fmh-card__buttons .fmh-btn,
.franck-modele-hero__buttons .franck-modele-hero__button {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    white-space: nowrap !important;
    text-align: center !important;
    justify-content: center !important;
    padding: 0 16px !important;
    font-size: 14px !important;
}
@media (max-width: 768px) {
    .fmh-card__buttons,
    .franck-modele-hero__buttons {
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
    }
    .fmh-card__buttons .fmh-btn,
    .franck-modele-hero__buttons .franck-modele-hero__button {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        width: auto !important;
        padding: 0 10px !important;
        font-size: 13px !important;
    }
}
@media (max-width: 480px) {
    .fmh-card {
        padding: 20px 16px !important;
    }
    .fmh-card__buttons,
    .franck-modele-hero__buttons {
        gap: 8px !important;
    }
    .fmh-card__buttons .fmh-btn,
    .franck-modele-hero__buttons .franck-modele-hero__button {
        padding: 0 6px !important;
        font-size: 12px !important;
        min-height: 44px !important;
    }
}

/* Modale Popup Geely */
.maurin-fpopup {
    max-width: 680px !important;
    border-radius: 0px !important;
}
.maurin-fpopup-iframe {
    border-radius: 0px !important;
}
.maurin-fpopup-close {
    top: 4px !important;
    right: 8px !important;
    border-radius: 0px !important;
    background: #000000 !important;
    color: #ffffff !important;
}
.maurin-fpopup-close:hover {
    background: #222222 !important;
}

/* Forcer la grille de formulaire 2 colonnes Geely sur tous les écrans */
.cmp-form-grid,
.form-popup-embed .cmp-form-grid,
[id] .cmp-form-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
}
.form-cmp-group.full,
.form-popup-embed .form-cmp-group.full,
[id] .form-cmp-group.full {
    grid-column: span 2 !important;
}

/* Menu Mobile Geely : Contraste élevé (fond noir / texte blanc) au survol des rubriques */
@media (max-width: 1199px) {
    .franck-mega-menu.is-mobile-open .franck-mega-menu__list {
        padding: 14px 0 !important;
    }
    .franck-mega-menu.is-mobile-open .franck-mega-menu__item,
    .franck-mega-menu--transparent.is-mobile-open .franck-mega-menu__item {
        border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
        margin: 2px 0 !important;
    }
    .franck-mega-menu.is-mobile-open .franck-mega-menu__link,
    .franck-mega-menu--transparent.is-mobile-open .franck-mega-menu__link {
        min-height: 52px !important;
        padding: 12px 18px !important;
        color: #111827 !important;
        background-color: transparent !important;
        font-weight: 700 !important;
        text-shadow: none !important;
        box-sizing: border-box !important;
        transition: background-color 0.2s ease, color 0.2s ease !important;
        border-radius: 0px !important;
    }
    .franck-mega-menu.is-mobile-open .franck-mega-menu__link:hover,
    .franck-mega-menu.is-mobile-open .franck-mega-menu__link:focus,
    .franck-mega-menu.is-mobile-open .franck-mega-menu__link:active,
    .franck-mega-menu.is-mobile-open .franck-mega-menu__item:hover > .franck-mega-menu__link,
    .franck-mega-menu.is-mobile-open .franck-mega-menu__item.is-open > .franck-mega-menu__link,
    .franck-mega-menu--transparent.is-mobile-open .franck-mega-menu__link:hover,
    .franck-mega-menu--transparent.is-mobile-open .franck-mega-menu__link:focus,
    .franck-mega-menu--transparent.is-mobile-open .franck-mega-menu__link:active,
    .franck-mega-menu--transparent.is-mobile-open .franck-mega-menu__item:hover > .franck-mega-menu__link,
    .franck-mega-menu--transparent.is-mobile-open .franck-mega-menu__item.is-open > .franck-mega-menu__link {
        background-color: #000000 !important;
        color: #ffffff !important;
        text-shadow: none !important;
    }
    .franck-mega-menu.is-mobile-open .franck-mega-menu__item--mega > .franck-mega-menu__link:hover::after,
    .franck-mega-menu.is-mobile-open .franck-mega-menu__item:hover > .franck-mega-menu__link::after,
    .franck-mega-menu--transparent.is-mobile-open .franck-mega-menu__item--mega > .franck-mega-menu__link:hover::after,
    .franck-mega-menu--transparent.is-mobile-open .franck-mega-menu__item:hover > .franck-mega-menu__link::after {
        border-color: #ffffff !important;
    }
}