
  .my-css :root :where(.wp-block-icon svg) {
    width: 24px;
  }

  .my-css :root :where(.wp-block-pullquote) {
    font-size: 1.5em;
    line-height: 1.6;
  }

  .my-css img#wpstats {
    display: none
  }

  .my-css .e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded):not(.e-no-lazyload),
  .my-css .e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded):not(.e-no-lazyload) * {
    background-image: none !important;
  }

  @media screen and (max-height: 1024px) {

    .my-css .e-con.e-parent:nth-of-type(n+3):not(.e-lazyloaded):not(.e-no-lazyload),
    .my-css .e-con.e-parent:nth-of-type(n+3):not(.e-lazyloaded):not(.e-no-lazyload) * {
      background-image: none !important;
    }
  }

  @media screen and (max-height: 640px) {

    .my-css .e-con.e-parent:nth-of-type(n+2):not(.e-lazyloaded):not(.e-no-lazyload),
    .my-css .e-con.e-parent:nth-of-type(n+2):not(.e-lazyloaded):not(.e-no-lazyload) * {
      background-image: none !important;
    }
  }

  .my-css .forme-hero {
    opacity: 0.1;
  }

  .my-css .e-contact-buttons__chat-button,
  .my-css .e-contact-buttons__chat-button[type=button] {
    background: linear-gradient(45deg, rgba(164, 202, 102, 1) 0%, rgba(0, 165, 100, 1) 100%);
  }

  /* Bloc prix TTC – titre '120€ TTC' */
  .my-css .prix-ttc .elementor-heading-title {
    font-size: 64px;
    /* taille du 120 */
    line-height: 1;
  }

  /* symbole € plus petit, en haut */
  .my-css .prix-ttc .euro {
    font-size: 0.45em;
    vertical-align: super;
    margin-left: 2px;
  }

  /* TTC plus petit, collé au € */
  .my-css .prix-ttc .ttc {
    font-size: 0.2em;
    margin-left: -20px;
    display: inline-block;
  }

  /* Animation de flottement douce */
  @keyframes auditag-float {
    0% {
      transform: translateY(0);
    }

    50% {
      transform: translateY(-6px);
    }

    100% {
      transform: translateY(0);
    }
  }

  /* Style commun à tous les pictos */
  .icon-float-1,
  .icon-float-2,
  .icon-float-3,
  .my-css .icon-float-4 {
    animation-name: auditag-float;
    animation-duration: 2.5s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    will-change: transform;
  }

  /* Décalage léger pour ne pas qu'ils bougent tous en même temps */
  .my-css .icon-float-2 {
    animation-delay: 0.4s;
  }

  .my-css .icon-float-3 {
    animation-delay: 0.8s;
  }

  .my-css .icon-float-4 {
    animation-delay: 1.2s;
  }

  /* ===== Fix iPhone : éviter que la section "Scroll" remonte sur les boutons ===== */
  @media (max-width: 768px) {

    /* On réserve de la place en bas dans le hero pour les boutons + safe area iPhone */
    .my-css .hero-home {
      padding-bottom: calc(140px + env(safe-area-inset-bottom)) !important;
      min-height: 100svh !important;
      min-height: 100dvh !important;
      height: auto !important;
    }

    /* La section Scroll (en dessous) : on limite sa remontée */
    .my-css .hero-scroll-section {
      margin-top: -40px !important;
      /* ajuste: -20 / -40 / -60 si besoin */
      position: relative !important;
      z-index: 5 !important;
    }

    /* Important : le scroll ne doit pas bloquer les clics sur les CTA */
    .my-css .hero-scroll-section {
      pointer-events: none !important;
    }
  }

  /* correction menu article de blog*/
  /* Header visible sur les articles */
  .my-css body.single-post .ekit-template-content-header,
  .my-css body.single-post .elementor-177 .elementor-element-54ba20b {
    background: #ffffff !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.08);
    position: relative;
    z-index: 9999;
  }

  /* =====================================================
   AUDITAG - CORRECTION HEADER + ARTICLES BLOG
   ===================================================== */


  /* =====================================================
   1. HEADER DES ARTICLES - BANDEAU FONCÉ
   Objectif : rendre visible le logo blanc + menu blanc
   ===================================================== */

  .my-css body.single-post .ekit-template-content-header,
  .my-css body.single-post .elementor-177 .elementor-element-54ba20b {
    background: linear-gradient(90deg, #1f2f2a 0%, #214B38 58%, #00A564 100%) !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
    position: relative !important;
    z-index: 9999 !important;
    border-bottom: none !important;
  }

  /* Hauteur et alignement du header */
  .my-css body.single-post .elementor-177 .elementor-element-54ba20b>.e-con-inner {
    min-height: 96px;
    align-items: center !important;
  }

  /* Logo blanc bien visible */
  .my-css body.single-post .elementor-177 .elementor-element-7a8b4069 img {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
  }

  /* Taille du logo sur les articles */
  .my-css body.single-post .elementor-177 .elementor-element-7a8b4069 img {
    max-width: 220px;
    height: auto;
  }


  /* =====================================================
   2. MENU PRINCIPAL DES ARTICLES
   ===================================================== */

  /* Liens du menu en blanc */
  body.single-post .elementor-177 .jkit-menu>li>a,
  .my-css body.single-post .elementor-177 .jkit-menu>li>a:visited {
    color: #ffffff !important;
    text-decoration: none !important;
  }

  /* Hover / focus du menu */
  body.single-post .elementor-177 .jkit-menu>li>a:hover,
  .my-css body.single-post .elementor-177 .jkit-menu>li>a:focus {
    color: #d8f5df !important;
    text-decoration: none !important;
  }

  /* Flèches / icônes du menu */
  body.single-post .elementor-177 .jkit-menu svg,
  .my-css body.single-post .elementor-177 .jkit-menu svg path {
    fill: #ffffff !important;
  }

  /* Sous-menu : fond blanc + texte foncé */
  .my-css body.single-post .elementor-177 .jkit-menu .sub-menu {
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.14);
    border-radius: 10px;
    overflow: hidden;
  }

  /* Liens du sous-menu */
  .my-css body.single-post .elementor-177 .jkit-menu .sub-menu li a {
    color: #222222 !important;
    background: #ffffff !important;
    text-decoration: none !important;
  }

  /* Hover sous-menu */
  body.single-post .elementor-177 .jkit-menu .sub-menu li a:hover,
  .my-css body.single-post .elementor-177 .jkit-menu .sub-menu li a:focus {
    color: #00A564 !important;
    background: #f4faf6 !important;
  }


  /* =====================================================
   3. BOUTON DEVIS DANS LE HEADER
   ===================================================== */

  .my-css body.single-post .elementor-177 .elementor-button {
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.20);
    text-decoration: none !important;
  }

  /* Effet hover bouton */
  .my-css body.single-post .elementor-177 .elementor-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
  }


  /* =====================================================
   4. CONTENEUR ARTICLE - LARGEUR LISIBLE
   Objectif : éviter que le texte prenne toute la largeur écran
   ===================================================== */

  .my-css body.single-post .elementor-1623 .elementor-element-b3d5113 {
    width: 100% !important;
    max-width: 1120px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 52px 28px 85px 28px !important;
    box-sizing: border-box !important;
  }

  /* Widget contenu de l'article */
  .my-css body.single-post .elementor-1623 .elementor-element-fc3db03,
  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content,
  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content .elementor-widget-container {
    width: 100% !important;
    max-width: 100% !important;
  }


  /* =====================================================
   5. LARGEUR DES TEXTES DANS L'ARTICLE
   ===================================================== */

  /* Éléments texte centrés et limités */
  body.single-post .elementor-1623 .elementor-widget-theme-post-content p,
  body.single-post .elementor-1623 .elementor-widget-theme-post-content ul,
  body.single-post .elementor-1623 .elementor-widget-theme-post-content ol,
  body.single-post .elementor-1623 .elementor-widget-theme-post-content h1,
  body.single-post .elementor-1623 .elementor-widget-theme-post-content h2,
  body.single-post .elementor-1623 .elementor-widget-theme-post-content h3,
  body.single-post .elementor-1623 .elementor-widget-theme-post-content h4,
  body.single-post .elementor-1623 .elementor-widget-theme-post-content h5,
  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content h6 {
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
  }

  /* Paragraphes et listes */
  body.single-post .elementor-1623 .elementor-widget-theme-post-content p,
  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content li {
    font-size: 17px;
    line-height: 1.75;
    color: #333333;
  }

  /* Liens dans l'article */
  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content a {
    color: #e9487c;
    text-decoration: none;
  }

  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content a:hover {
    color: #00A564;
    text-decoration: underline;
  }


  /* =====================================================
   6. TITRES ARTICLE
   ===================================================== */

  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content h1 {
    font-size: clamp(32px, 4vw, 48px);
    line-height: 1.15;
    margin-top: 0;
    margin-bottom: 26px;
    color: #222222;
  }

  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content h2 {
    font-size: clamp(26px, 3vw, 36px);
    line-height: 1.25;
    margin-top: 48px;
    margin-bottom: 20px;
    color: #222222;
  }

  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content h3 {
    font-size: clamp(22px, 2.4vw, 28px);
    line-height: 1.3;
    margin-top: 36px;
    margin-bottom: 16px;
    color: #222222;
  }


  /* =====================================================
   7. IMAGES ARTICLE
   ===================================================== */

  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 34px auto;
    border-radius: 0;
  }

  /* Images WordPress / blocs image */
  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content figure,
  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content .wp-block-image {
    max-width: 1040px;
    margin-left: auto;
    margin-right: auto;
  }

  /* Légendes */
  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content figcaption {
    max-width: 920px;
    margin: 10px auto 0 auto;
    font-size: 14px;
    color: #666666;
    text-align: center;
  }


  /* =====================================================
   8. LISTES / SOMMAIRE
   ===================================================== */

  body.single-post .elementor-1623 .elementor-widget-theme-post-content ul,
  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content ol {
    padding-left: 28px;
  }

  .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content li {
    margin-bottom: 6px;
  }


  /* =====================================================
   9. CORRECTION BORDURES / LIGNES INDÉSIRABLES
   ===================================================== */

  body.single-post .elementor-1623,
  body.single-post .elementor-1623 .elementor-element-b3d5113,
  .my-css body.single-post .elementor-1623 .elementor-element-fc3db03 {
    border: none !important;
    outline: none !important;
  }


  /* =====================================================
   10. RESPONSIVE TABLETTE
   ===================================================== */

  @media (max-width: 1024px) {
    .my-css body.single-post .elementor-177 .elementor-element-54ba20b>.e-con-inner {
      min-height: 86px;
    }

    .my-css body.single-post .elementor-1623 .elementor-element-b3d5113 {
      max-width: 100% !important;
      padding: 44px 24px 72px 24px !important;
    }

    .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content p,
    .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content ul,
    .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content ol,
    .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content h1,
    .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content h2,
    .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content h3,
    .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content h4 {
      max-width: 860px;
    }
  }


  /* =====================================================
   11. RESPONSIVE MOBILE
   ===================================================== */

  @media (max-width: 768px) {
    .my-css body.single-post .elementor-177 .elementor-element-54ba20b {
      background: #214B38 !important;
    }

    .my-css body.single-post .elementor-177 .elementor-element-54ba20b>.e-con-inner {
      min-height: 76px;
    }

    .my-css body.single-post .elementor-177 .elementor-element-7a8b4069 img {
      max-width: 170px;
    }

    body.single-post .elementor-177 .jkit-hamburger-menu svg,
    .my-css body.single-post .elementor-177 .jkit-hamburger-menu svg path {
      fill: #ffffff !important;
    }

    .my-css body.single-post .elementor-1623 .elementor-element-b3d5113 {
      max-width: 100% !important;
      padding: 34px 18px 60px 18px !important;
    }

    body.single-post .elementor-1623 .elementor-widget-theme-post-content p,
    .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content li {
      font-size: 16px;
      line-height: 1.65;
    }

    .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content h1 {
      font-size: 30px;
    }

    .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content h2 {
      font-size: 25px;
    }

    .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content h3 {
      font-size: 21px;
    }

    .my-css body.single-post .elementor-1623 .elementor-widget-theme-post-content img {
      margin: 26px auto;
    }
  }

  /* =====================================================
   FIX : ÉVITER QUE LE CONTENU PASSE SOUS LE HEADER
   ===================================================== */

  /* On décale le modèle article sous le header */
  .my-css body.single-post .elementor-1623 {
    padding-top: 110px !important;
  }

  /* Si l’admin bar WordPress est affichée quand on est connecté */
  .my-css body.single-post.admin-bar .elementor-1623 {
    padding-top: 125px !important;
  }

  /* On évite que les ancres / titres soient cachés sous le menu */
  .my-css body.single-post .elementor-1623 h1,
  .my-css body.single-post .elementor-1623 h2,
  .my-css body.single-post .elementor-1623 h3,
  .my-css body.single-post .elementor-1623 h4 {
    scroll-margin-top: 130px;
  }

  /* Version tablette */
  @media (max-width: 1024px) {
    .my-css body.single-post .elementor-1623 {
      padding-top: 95px !important;
    }

    .my-css body.single-post.admin-bar .elementor-1623 {
      padding-top: 115px !important;
    }
  }

  /* Version mobile */
  @media (max-width: 768px) {
    .my-css body.single-post .elementor-1623 {
      padding-top: 82px !important;
    }

    .my-css body.single-post.admin-bar .elementor-1623 {
      padding-top: 105px !important;
    }

    .my-css body.single-post .elementor-1623 h1,
    .my-css body.single-post .elementor-1623 h2,
    .my-css body.single-post .elementor-1623 h3,
    .my-css body.single-post .elementor-1623 h4 {
      scroll-margin-top: 110px;
    }
  }


  *,
  *::before,
  .my-css *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0
  }

  .my-css html {
    scroll-behavior: smooth
  }

  .my-css body {
    font-family: 'DM Sans', sans-serif;
    color: #1B2D6B;
    background: #ffffff;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased
  }

  /* HERO */
  .my-css .hero {
    background: #1B2D6B;
    position: relative;
    overflow: hidden;
    padding: 100px 40px 80px
  }

  .my-css .hero::before {
    content: '';
    position: absolute;
    top: -120px;
    right: -120px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(62, 200, 139, .15) 0%, transparent 70%);
    pointer-events: none
  }

  .my-css .hero::after {
    content: '';
    position: absolute;
    bottom: -80px;
    left: -80px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(62, 200, 139, .08) 0%, transparent 70%);
    pointer-events: none
  }

  .my-css .hero-inner {
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
    z-index: 1
  }

  .my-css .hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(62, 200, 139, .15);
    border: 1px solid rgba(62, 200, 139, .3);
    color: #3EC88B;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: 6px 16px;
    border-radius: 50px;
    margin-bottom: 28px
  }

  .my-css .hero-badge::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #3EC88B
  }

  .my-css .hero h1 {
    font-family: 'Comfortaa', sans-serif;
    font-size: clamp(30px, 4.5vw, 52px);
    font-weight: 700;
    color: #ffffff;
    line-height: 1.15;
    margin-bottom: 24px;
    max-width: 820px
  }

  .my-css .hero h1 em {
    font-style: normal;
    color: #3EC88B
  }

  .my-css .hero-sub {
    font-size: 17px;
    font-weight: 300;
    color: rgba(255, 255, 255, .75);
    max-width: 660px;
    line-height: 1.75;
    margin-bottom: 48px
  }

  .my-css .hero-stats {
    display: flex;
    gap: 48px;
    flex-wrap: wrap
  }

  .my-css .hero-stat-num {
    font-family: 'Comfortaa', sans-serif;
    font-size: 38px;
    font-weight: 700;
    color: #3EC88B;
    line-height: 1;
    display: block
  }

  .my-css .hero-stat-label {
    font-size: 13px;
    color: rgba(255, 255, 255, .6);
    margin-top: 4px;
    display: block
  }

  .my-css .hero-stat-divider {
    width: 1px;
    background: rgba(255, 255, 255, .12);
    height: 60px;
    align-self: center
  }

  /* BANNIÈRE OBLIGATION */
  .my-css .banner {
    background: linear-gradient(135deg, #3EC88B 0%, #2db87a 100%);
    padding: 28px 40px
  }

  .my-css .banner-inner {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap
  }

  .my-css .banner-icon {
    width: 48px;
    height: 48px;
    background: rgba(255, 255, 255, .2);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    flex-shrink: 0
  }

  .my-css .banner-text {
    flex: 1;
    min-width: 280px
  }

  .my-css .banner-text strong {
    font-family: 'Comfortaa', sans-serif;
    font-size: 17px;
    font-weight: 700;
    color: #ffffff;
    display: block;
    margin-bottom: 4px
  }

  .my-css .banner-text p {
    font-size: 14px;
    color: rgba(255, 255, 255, .88);
    margin: 0
  }

  .my-css .banner-cta {
    background: #ffffff;
    color: #3EC88B;
    font-family: 'Comfortaa', sans-serif;
    font-size: 14px;
    font-weight: 700;
    padding: 12px 28px;
    border-radius: 50px;
    text-decoration: none;
    white-space: nowrap;
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 16px rgba(0, 0, 0, .15)
  }

  .my-css .banner-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .2)
  }

  /* SECTIONS */
  .my-css .section {
    padding: 80px 40px
  }

  .my-css .section-alt {
    background: #f8f9fc
  }

  .my-css .section-navy {
    background: #1B2D6B
  }

  .my-css .section-inner {
    max-width: 1100px;
    margin: 0 auto
  }

  .my-css .section-tag {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #3EC88B;
    margin-bottom: 12px;
    display: block
  }

  .my-css .section-title {
    font-family: 'Comfortaa', sans-serif;
    font-size: clamp(24px, 3.5vw, 38px);
    font-weight: 700;
    color: #3EC88B;
    line-height: 1.2;
    margin-bottom: 16px
  }

  .my-css .section-title-white {
    color: #ffffff
  }

  .my-css .section-lead {
    font-size: 16px;
    font-weight: 300;
    color: #fff;
    max-width: 700px;
    line-height: 1.75;
    margin-bottom: 48px
  }

  /* CALENDRIER OBLIGATION */
  .my-css .timeline {
    display: flex;
    gap: 0;
    position: relative;
    margin-bottom: 40px
  }

  .my-css .timeline::before {
    content: '';
    position: absolute;
    top: 36px;
    left: 60px;
    right: 60px;
    height: 3px;
    background: #e2e6f0;
    z-index: 0
  }

  .my-css .tl-item {
    flex: 1;
    text-align: center;
    position: relative;
    z-index: 1;
    padding: 0 12px
  }

  .my-css .tl-dot {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    font-family: 'Comfortaa', sans-serif;
    font-size: 13px;
    font-weight: 700;
    border: 3px solid;
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1)
  }

  .my-css .tl-dot:hover {
    transform: scale(1.1)
  }

  .my-css .tl-item:nth-child(1) .tl-dot {
    background: rgba(62, 200, 139, .1);
    border-color: #3EC88B;
    color: #3EC88B
  }

  .my-css .tl-item:nth-child(2) .tl-dot {
    background: rgba(27, 45, 107, .08);
    border-color: #1B2D6B;
    color: #1B2D6B
  }

  .my-css .tl-item:nth-child(3) .tl-dot {
    background: #3EC88B;
    border-color: #3EC88B;
    color: #ffffff
  }

  .my-css .tl-year {
    font-size: 13px;
    font-weight: 600;
    color: #9aa3c0;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: 6px
  }

  .my-css .tl-desc {
    font-size: 14px;
    color: #4a5478;
    line-height: 1.5
  }

  .my-css .tl-item:nth-child(3) .tl-year {
    color: #3EC88B
  }

  .my-css .tl-item:nth-child(3) .tl-desc {
    color: #1B2D6B;
    font-weight: 500
  }

  /* DÉROULÉ AUDIT */
  .my-css .deroulé-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: start
  }

  .my-css .steps {
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative
  }

  .my-css .steps::before {
    content: '';
    position: absolute;
    left: 24px;
    top: 48px;
    bottom: 48px;
    width: 2px;
    background: #e2e6f0
  }

  .my-css .step {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    padding: 20px 0;
    position: relative
  }

  .my-css .step-circle {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #ffffff;
    border: 2px solid #e2e6f0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Comfortaa', sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #9aa3c0;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
    transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1)
  }

  .my-css .step:hover .step-circle {
    background: #3EC88B;
    border-color: #3EC88B;
    color: #ffffff;
    transform: scale(1.08)
  }

  .my-css .step-content h3 {
    font-family: 'Comfortaa', sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #1B2D6B;
    margin-bottom: 6px
  }

  .my-css .step-content p {
    font-size: 14px;
    color: #4a5478;
    line-height: 1.65
  }

  .my-css .deroulé-aside {
    background: #1B2D6B;
    border-radius: 24px;
    padding: 40px;
    position: relative;
    overflow: hidden
  }

  .my-css .deroulé-aside::before {
    content: '';
    position: absolute;
    top: -40px;
    right: -40px;
    width: 180px;
    height: 180px;
    background: radial-gradient(circle, rgba(62, 200, 139, .2) 0%, transparent 70%)
  }

  .my-css .aside-content {
    position: relative;
    z-index: 1
  }

  .my-css .aside-title {
    font-family: 'Comfortaa', sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 20px
  }

  .my-css .aside-items {
    display: flex;
    flex-direction: column;
    gap: 14px
  }

  .my-css .aside-item {
    display: flex;
    gap: 12px;
    align-items: flex-start
  }

  .my-css .aside-check {
    width: 22px;
    height: 22px;
    background: #3EC88B;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 11px;
    color: #ffffff;
    font-weight: 700;
    margin-top: 1px
  }

  .my-css .aside-item span {
    font-size: 14px;
    color: rgba(255, 255, 255, .75);
    line-height: 1.55
  }

  .my-css .aside-item strong {
    color: #ffffff
  }

  /* DIFFÉRENCES DPE / AUDIT */
  .my-css .comparatif-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px
  }

  .my-css .compa-card {
    border-radius: 24px;
    padding: 36px;
    border: 2px solid
  }

  .my-css .compa-card.dpe {
    background: #f8f9fc;
    border-color: #e2e6f0
  }

  .my-css .compa-card.audit {
    background: #1B2D6B;
    border-color: rgba(62, 200, 139, .3)
  }

  .my-css .compa-title {
    font-family: 'Comfortaa', sans-serif;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 8px
  }

  .my-css .compa-card.dpe .compa-title {
    color: #1B2D6B
  }

  .my-css .compa-card.audit .compa-title {
    color: #ffffff
  }

  .my-css .compa-sub {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    margin-bottom: 20px
  }

  .my-css .compa-card.dpe .compa-sub {
    color: #9aa3c0
  }

  .my-css .compa-card.audit .compa-sub {
    color: #3EC88B
  }

  .my-css .compa-items {
    display: flex;
    flex-direction: column;
    gap: 12px
  }

  .my-css .compa-item {
    display: flex;
    gap: 10px;
    align-items: flex-start
  }

  .my-css .compa-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 6px
  }

  .my-css .compa-card.dpe .compa-dot {
    background: #9aa3c0
  }

  .my-css .compa-card.audit .compa-dot {
    background: #3EC88B
  }

  .my-css .compa-item span {
    font-size: 14px;
    line-height: 1.6
  }

  .my-css .compa-card.dpe .compa-item span {
    color: #4a5478
  }

  .my-css .compa-card.audit .compa-item span {
    color: rgba(255, 255, 255, .75)
  }

  .my-css .compa-badge {
    display: inline-block;
    margin-top: 20px;
    font-size: 12px;
    font-weight: 700;
    padding: 5px 14px;
    border-radius: 50px
  }

  .my-css .compa-card.dpe .compa-badge {
    background: #f0f2f8;
    color: #4a5478
  }

  .my-css .compa-card.audit .compa-badge {
    background: rgba(62, 200, 139, .15);
    color: #3EC88B
  }

  /* AIDES */
  .my-css .aides-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 20px
  }

  .my-css .aide-card {
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 16px;
    padding: 28px;
    transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.28s cubic-bezier(0.4, 0, 0.2, 1)
  }

  .my-css .aide-card:hover {
    background: rgba(255, 255, 255, .08);
    border-color: rgba(62, 200, 139, .4)
  }

  .my-css .aide-icon {
    font-size: 30px;
    margin-bottom: 12px;
    display: block
  }

  .my-css .aide-card h3 {
    font-family: 'Comfortaa', sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 8px
  }

  .my-css .aide-card p {
    font-size: 13px;
    color: rgba(255, 255, 255, .6);
    line-height: 1.65
  }

  .my-css .aide-tag {
    display: inline-block;
    margin-top: 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #3EC88B;
    background: rgba(62, 200, 139, .12);
    padding: 4px 12px;
    border-radius: 50px
  }

  .my-css .aide-tip {
    background: rgba(62, 200, 139, .12);
    border: 1px solid rgba(62, 200, 139, .3);
    border-radius: 16px;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    gap: 14px
  }

  .my-css .aide-tip p {
    font-size: 14px;
    color: rgba(255, 255, 255, .85);
    margin: 0;
    line-height: 1.65
  }

  .my-css .aide-tip strong {
    color: #3EC88B
  }

  /* PPPT LIEN */
  .my-css .pppt-block {
    background: #ffffff;
    border: 1px solid #e2e6f0;
    border-radius: 24px;
    padding: 40px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
    transition: border-color 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1)
  }

  .my-css .pppt-block:hover {
    border-color: #3EC88B;
    box-shadow: 0 8px 32px rgba(27, 45, 107, 0.12)
  }

  .my-css .pppt-icon {
    font-size: 56px;
    margin-bottom: 16px;
    display: block
  }

  .my-css .pppt-block h3 {
    font-family: 'Comfortaa', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: #1B2D6B;
    margin-bottom: 12px
  }

  .my-css .pppt-block p {
    font-size: 15px;
    color: #4a5478;
    line-height: 1.7;
    margin-bottom: 20px
  }

  .my-css .pppt-items {
    display: flex;
    flex-direction: column;
    gap: 10px
  }

  .my-css .pppt-item {
    display: flex;
    gap: 10px;
    align-items: flex-start
  }

  .my-css .pppt-check {
    width: 20px;
    height: 20px;
    background: #3EC88B;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 2px;
    font-size: 11px;
    color: #ffffff;
    font-weight: 700
  }

  .my-css .pppt-item span {
    font-size: 14px;
    color: #4a5478;
    line-height: 1.55
  }

  .my-css .pppt-visual {
    background: #1B2D6B;
    border-radius: 16px;
    padding: 36px;
    text-align: center;
    position: relative;
    overflow: hidden
  }

  .my-css .pppt-visual::before {
    content: '';
    position: absolute;
    top: -30px;
    right: -30px;
    width: 150px;
    height: 150px;
    background: radial-gradient(circle, rgba(62, 200, 139, .25) 0%, transparent 70%)
  }

  .my-css .pppt-num {
    font-family: 'Comfortaa', sans-serif;
    font-size: 64px;
    font-weight: 700;
    color: #3EC88B;
    line-height: 1;
    display: block;
    position: relative;
    z-index: 1
  }

  .my-css .pppt-num-label {
    font-size: 15px;
    color: rgba(255, 255, 255, .7);
    display: block;
    margin-top: 8px;
    position: relative;
    z-index: 1
  }

  /* POURQUOI */
  .my-css .why-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center
  }

  .my-css .why-list {
    display: flex;
    flex-direction: column;
    gap: 14px
  }

  .my-css .why-item {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    padding: 16px 18px;
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid #e2e6f0;
    transition: border-color 0.28s cubic-bezier(0.4, 0, 0.2, 1), transform 0.28s cubic-bezier(0.4, 0, 0.2, 1)
  }

  .my-css .why-item:hover {
    border-color: #3EC88B;
    transform: translateX(4px)
  }

  .my-css .why-check {
    width: 26px;
    height: 26px;
    background: #3EC88B;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700
  }

  .my-css .why-text strong {
    font-size: 14px;
    font-weight: 600;
    color: #1B2D6B;
    display: block
  }

  .my-css .why-text span {
    font-size: 13px;
    color: #4a5478
  }

  .my-css .why-visual {
    background: #1B2D6B;
    border-radius: 24px;
    padding: 44px 40px;
    position: relative;
    overflow: hidden
  }

  .my-css .why-visual::before {
    content: '';
    position: absolute;
    top: -40px;
    right: -40px;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(62, 200, 139, .25) 0%, transparent 70%)
  }

  .my-css .why-inner {
    position: relative;
    z-index: 1
  }

  .my-css .why-num {
    font-family: 'Comfortaa', sans-serif;
    font-size: 68px;
    font-weight: 700;
    color: #3EC88B;
    line-height: 1;
    display: block
  }

  .my-css .why-label {
    font-size: 15px;
    color: rgba(255, 255, 255, .75);
    margin-top: 8px;
    display: block
  }

  .my-css .why-divider {
    width: 40px;
    height: 2px;
    background: rgba(62, 200, 139, .4);
    margin: 24px 0
  }

  .my-css .why-quote {
    font-size: 14px;
    font-style: italic;
    color: rgba(255, 255, 255, .6);
    line-height: 1.7
  }

  .my-css .why-quote strong {
    color: #ffffff;
    font-style: normal
  }

  /* FAQ */
  .my-css .faq-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 800px;
    margin: 0 auto
  }

  .my-css .faq-item {
    background: #ffffff;
    border: 1px solid #e2e6f0;
    border-radius: 16px;
    overflow: hidden;
    transition: border-color 0.28s cubic-bezier(0.4, 0, 0.2, 1)
  }

  .my-css .faq-item:hover {
    border-color: #3EC88B
  }

  .my-css .faq-q {
    width: 100%;
    padding: 20px 24px;
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    text-align: left;
    font-family: 'DM Sans', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #1B2D6B;
    transition: color 0.28s cubic-bezier(0.4, 0, 0.2, 1)
  }

  .my-css .faq-q:hover {
    color: #3EC88B
  }

  .my-css .faq-arrow {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #f0f2f8;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1), transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    font-size: 14px;
    color: #4a5478
  }

  .my-css .faq-item.open .faq-arrow {
    background: #3EC88B;
    color: #ffffff;
    transform: rotate(180deg)
  }

  .my-css .faq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height .35s cubic-bezier(.4, 0, .2, 1)
  }

  .my-css .faq-item.open .faq-a {
    max-height: 400px
  }

  .my-css .faq-a-inner {
    padding: 0 24px 20px;
    font-size: 14px;
    color: #4a5478;
    line-height: 1.7
  }

  /* CTA */
  .my-css .cta-section {
    background: #1B2D6B;
    padding: 80px 40px;
    text-align: center;
    position: relative;
    overflow: hidden
  }

  .my-css .cta-section::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 700px;
    height: 700px;
    background: radial-gradient(circle, rgba(62, 200, 139, .1) 0%, transparent 70%)
  }

  .my-css .cta-inner {
    max-width: 680px;
    margin: 0 auto;
    position: relative;
    z-index: 1
  }

  .my-css .cta-inner h2 {
    font-family: 'Comfortaa', sans-serif;
    font-size: clamp(24px, 3.5vw, 36px);
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 16px
  }

  .my-css .cta-inner p {
    font-size: 16px;
    font-weight: 300;
    color: rgba(255, 255, 255, .7);
    margin-bottom: 40px;
    line-height: 1.7
  }

  .my-css .cta-buttons {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap
  }

  .my-css .btn-primary {
    background: #3EC88B;
    color: #ffffff;
    font-family: 'Comfortaa', sans-serif;
    font-size: 15px;
    font-weight: 700;
    padding: 16px 36px;
    border-radius: 50px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 8px 24px rgba(62, 200, 139, .35)
  }

  .my-css .btn-primary:hover {
    background: #5dd9a0;
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(62, 200, 139, .45)
  }

  .my-css .btn-secondary {
    background: rgba(255, 255, 255, .08);
    color: #ffffff;
    font-family: 'Comfortaa', sans-serif;
    font-size: 15px;
    font-weight: 600;
    padding: 16px 32px;
    border-radius: 50px;
    border: 1px solid rgba(255, 255, 255, .2);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1)
  }

  .my-css .btn-secondary:hover {
    background: rgba(255, 255, 255, .14);
    border-color: rgba(255, 255, 255, .4)
  }

  @keyframes fadeUp {
    from {
      opacity: 0;
      transform: translateY(20px)
    }

    to {
      opacity: 1;
      transform: translateY(0)
    }
  }

  .my-css .fade-up {
    animation: fadeUp .6s ease forwards
  }

  .my-css .fade-up-d1 {
    animation-delay: .1s;
    opacity: 0;
    animation-fill-mode: forwards
  }

  .my-css .fade-up-d2 {
    animation-delay: .2s;
    opacity: 0;
    animation-fill-mode: forwards
  }

  .my-css .fade-up-d3 {
    animation-delay: .3s;
    opacity: 0;
    animation-fill-mode: forwards
  }

  @media(max-width:900px) {
    .my-css .hero {
      padding: 60px 20px
    }

    .my-css .hero-stats {
      gap: 24px
    }

    .my-css .hero-stat-divider {
      display: none
    }

    .my-css .section {
      padding: 56px 20px
    }

    .my-css .banner {
      padding: 20px
    }

    .deroulé-grid,
    .comparatif-grid,
    .why-grid,
    .my-css .pppt-block {
      grid-template-columns: 1fr
    }

    .my-css .aides-grid {
      grid-template-columns: 1fr
    }

    .my-css .timeline {
      flex-direction: column;
      gap: 24px
    }

    .my-css .timeline::before {
      display: none
    }

    .my-css .cta-section {
      padding: 56px 20px
    }
  }
.background-white{
  background: #FFFFFF;
}

/* ============================================================
   Maillage interne (fiches 10 et 49)
   ============================================================ */

/* Adresses d'agences cliquables (pied de page, accueil, contact) */
.footer-agencies ul li a,
.blk-agencies ul li a {
  color: inherit;
  text-decoration: none;
}
.footer-agencies ul li a:hover,
.blk-agencies ul li a:hover {
  color: #3EC88B;
}

/* Pied de page : zones d'intervention */
.footer-zones {
  padding: 28px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
}
.footer-zones__titre {
  color: #FFF;
  font-family: "Comfortaa", sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 14px;
}
.footer-zones__grid {
  display: grid;
  grid-template-columns: 1.6fr repeat(4, minmax(0, 1fr));
  gap: 24px 32px;
}
.footer-zones__secteur {
  color: #3EC88B;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.footer-zones ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.footer-zones__grid > div:first-child ul {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 24px;
}
@media (max-width: 991px) {
  .footer-zones__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-zones__grid > div:first-child { grid-column: 1 / -1; }
}
@media (max-width: 575px) {
  .footer-zones__grid, .footer-zones__grid > div:first-child ul { grid-template-columns: 1fr; }
}
.footer-zones ul li a {
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.9rem;
  line-height: 1.5em;
  text-decoration: none;
}
.footer-zones ul li a:hover {
  color: #3EC88B;
}

/* Pages de prestation : « Près de chez vous » */
.liens-locaux-section {
  padding: 60px 0 20px;
}
.liens-locaux {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}
.liens-locaux li a {
  display: inline-block;
  padding: 8px 16px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  border-radius: 100px;
  color: #FFF;
  font-size: 0.95rem;
  text-decoration: none;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}
.liens-locaux li a:hover {
  background-color: #3EC88B;
  border-color: #3EC88B;
  color: #000739;
}
.liens-locaux__plus {
  margin-top: 16px;
}
.liens-locaux__plus a {
  color: #FFF;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: #3EC88B;
  text-underline-offset: 3px;
}
.liens-locaux__plus a:hover { color: #3EC88B; }

/* Pages locales : autres prestations dans la ville */
.liens-ville__titre {
  font-family: "Comfortaa", sans-serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: #000739;
}

/* ============================================================
   Pages locales (villes) : annuaire_commune.php
   Bleu marine #000739, vert menthe #3EC88B, fond clair #F4F6FB
   ============================================================ */

.lp-ico { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.btn-icon .lp-ico { color: #000739; width: 16px; height: 16px; }

/* Bandeau */
.lp-hero {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 85% 20%, rgba(62, 200, 139, 0.18), transparent 45%), #000739;
  color: #FFF;
  padding: 150px 0 72px;
}
.lp-breadcrumb { display: flex; flex-wrap: wrap; gap: 6px 10px; font-size: 0.85rem; color: rgba(255, 255, 255, 0.65); margin-bottom: 32px; }
.lp-breadcrumb a { color: rgba(255, 255, 255, 0.8); text-decoration: none; }
.lp-breadcrumb a:hover { color: #3EC88B; }
.lp-breadcrumb [aria-current] { color: #FFF; }
.lp-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 48px; align-items: center; }
.lp-hero__agence {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 14px; border-radius: 100px;
  background: rgba(62, 200, 139, 0.14); color: #3EC88B;
  font-size: 0.9rem; font-weight: 500; margin-bottom: 18px;
}
.lp-hero__title {
  font-family: "Comfortaa", sans-serif; font-weight: 700; color: #FFF;
  font-size: clamp(2rem, 4.2vw, 3.1rem); line-height: 1.15; margin: 0 0 18px; text-wrap: balance;
}
.lp-hero__title span { display: block; color: #3EC88B; }
.lp-hero__lead { font-size: 1.1rem; line-height: 1.65; color: rgba(255, 255, 255, 0.85); max-width: 60ch; margin: 0 0 28px; }
.lp-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin-bottom: 28px; }
.lp-btn-tel {
  display: inline-flex; align-items: center; gap: 10px; height: 52px; padding: 0 24px;
  border: 1px solid rgba(255, 255, 255, 0.6); border-radius: 100px;
  color: #FFF; font-weight: 500; text-decoration: none; transition: background-color 0.2s, border-color 0.2s;
}
.lp-btn-tel:hover { background: rgba(255, 255, 255, 0.1); border-color: #3EC88B; color: #FFF; }
.lp-hero__trust { display: flex; flex-wrap: wrap; gap: 10px 26px; margin: 0; padding: 0; list-style: none; font-size: 0.92rem; color: rgba(255, 255, 255, 0.85); }
.lp-hero__trust li { display: inline-flex; align-items: center; gap: 8px; }
.lp-hero__trust .lp-ico { color: #3EC88B; }
.lp-hero__trust a { color: #FFF; text-decoration: underline; }
.lp-stars { display: inline-flex; gap: 1px; }
.lp-stars .lp-ico { width: 15px; height: 15px; fill: #FFDC6B; stroke: #FFDC6B; stroke-width: 1; }
.lp-hero__visuel { display: flex; justify-content: center; }
.lp-hero__badge {
  width: 240px; height: 240px; border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.05);
  box-shadow: 0 0 0 18px rgba(255, 255, 255, 0.03), 0 0 0 36px rgba(255, 255, 255, 0.02);
}
.lp-hero__badge img { width: 72px; height: 72px; }
.lp-hero__badge span { font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.1rem; text-align: center; padding: 0 20px; }

/* Contenu */
.lp-main { background: #F4F6FB; padding: 72px 0; }
.lp-main__grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 48px; align-items: start; }
.lp-article {
  background: #FFF; border-radius: 16px; padding: 44px 48px;
  color: #1F2440; font-size: 1.05rem; line-height: 1.75;
}
.lp-article > *:first-child { margin-top: 0; }
.lp-article p { margin: 0 0 18px; max-width: 72ch; }
.lp-article h2 {
  font-family: "Comfortaa", sans-serif; font-weight: 700; color: #000739;
  font-size: 1.45rem; line-height: 1.3; margin: 38px 0 14px; text-wrap: balance;
}
.lp-article h2::after { content: ""; display: block; width: 44px; height: 3px; border-radius: 3px; background: #3EC88B; margin-top: 12px; }
.lp-article h3 { font-family: "Comfortaa", sans-serif; font-weight: 700; color: #000739; font-size: 1.15rem; margin: 28px 0 10px; }
.lp-article ul { margin: 0 0 18px; padding-left: 22px; }
.lp-article li { margin-bottom: 8px; }
.lp-article a { color: #000739; text-decoration: underline; text-decoration-color: #3EC88B; text-underline-offset: 3px; }

/* FAQ */
.lp-faq { margin-top: 40px; }
.lp-faq__item { border: 1px solid #E1E5F0; border-radius: 12px; margin-bottom: 10px; background: #FFF; }
.lp-faq__item summary {
  cursor: pointer; list-style: none; padding: 16px 52px 16px 20px; position: relative;
  font-weight: 700; color: #000739; line-height: 1.4;
}
.lp-faq__item summary::-webkit-details-marker { display: none; }
.lp-faq__item summary::after {
  content: "+"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%);
  width: 26px; height: 26px; border-radius: 50%; background: #F4F6FB; color: #000739;
  display: flex; align-items: center; justify-content: center; font-size: 1.1rem;
}
.lp-faq__item[open] summary::after { content: "\2212"; background: #3EC88B; color: #FFF; }
.lp-faq__item summary:focus-visible { outline: 2px solid #3EC88B; outline-offset: 2px; border-radius: 12px; }
.lp-faq__reponse { padding: 0 20px 18px; color: #3B4260; }

/* Colonne de droite */
.lp-aside { display: grid; gap: 18px; position: sticky; top: 104px; }
/* default.css met overflow: hidden sur .site-main, ce qui désactive position: sticky.
   overflow: clip coupe les débordements de la même façon sans bloquer le sticky. */
.lp-page .site-main { overflow: visible; overflow: clip; }
.lp-card { display: block; background: #FFF; border-radius: 16px; padding: 26px; text-decoration: none; }
.lp-card__label { font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: #6B7280; font-weight: 700; margin-bottom: 8px; }
.lp-card__title { display: block; font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.2rem; color: #000739; }
/* Fiche agence : pastille du département (76, 14…) à la place d'un liseré de couleur */
.lp-agence-tete { display: flex; align-items: center; gap: 14px; }
.lp-agence-dep {
  flex-shrink: 0; width: 48px; height: 48px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  background: #000739; color: #FFF;
  font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.1rem; font-variant-numeric: tabular-nums;
}
.lp-agence-zone { display: block; margin-top: 2px; font-size: 0.88rem; color: #6B7280; }
.lp-contacts { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 12px; }
.lp-contacts li { display: flex; align-items: center; gap: 12px; color: #3B4260; font-size: 0.95rem; }
.lp-contacts__ico {
  width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(62, 200, 139, 0.14); color: #000739;
}
.lp-contacts a { color: #3B4260; text-decoration: none; }
.lp-contacts a:hover { color: #000739; text-decoration: underline; }
.lp-card__hours { margin: 16px 0 18px; font-size: 0.88rem; color: #6B7280; }
.lp-card__btn { width: 100%; justify-content: space-between; }
.lp-list { list-style: none; margin: 4px 0 0; padding: 0; display: grid; }
.lp-list li a { display: block; padding: 10px 0; border-bottom: 1px solid #EEF1F7; color: #000739; text-decoration: none; }
.lp-list li:last-child a { border-bottom: 0; }
.lp-list li a:hover { color: #1E9E64; }
.lp-card--lien { transition: transform 0.2s, box-shadow 0.2s; }
.lp-card--lien:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0, 7, 57, 0.08); }

/* Bande d'appel à l'action */
.lp-cta { background: #F4F6FB; padding: 0 0 72px; }
.lp-cta__inner {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px;
  background: #000739; color: #FFF; border-radius: 20px; padding: 36px 44px;
}
.lp-cta__title { font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.4rem; line-height: 1.3; margin-bottom: 6px; text-wrap: balance; }
.lp-cta__inner p { margin: 0; color: rgba(255, 255, 255, 0.8); }
.lp-cta__actions { display: flex; flex-wrap: wrap; gap: 14px; }

/* Villes voisines */
.lp-proches { padding: 72px 0; background: #FFF; }
.lp-section-title { font-family: "Comfortaa", sans-serif; font-weight: 700; color: #000739; font-size: 1.6rem; margin: 0 0 24px; text-wrap: balance; }
.lp-proches__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.lp-proches__list a {
  display: grid; gap: 2px; padding: 16px 20px; border: 1px solid #E1E5F0; border-radius: 12px;
  text-decoration: none; transition: border-color 0.2s, background-color 0.2s;
}
.lp-proches__list a:hover { border-color: #3EC88B; background: #F4F6FB; }
.lp-proches__ville { font-family: "Comfortaa", sans-serif; font-weight: 700; color: #000739; }
.lp-proches__meta { font-size: 0.88rem; color: #6B7280; font-variant-numeric: tabular-nums; }

@media (max-width: 991px) {
  .lp-hero { padding: 120px 0 56px; }
  .lp-hero__grid { grid-template-columns: 1fr; }
  .lp-hero__visuel { display: none; }
  .lp-main__grid { grid-template-columns: 1fr; }
  .lp-aside { position: static; }
  .lp-proches__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .lp-article { padding: 28px 22px; font-size: 1rem; }
  .lp-main { padding: 40px 0; }
  .lp-cta__inner { padding: 28px 24px; }
  .lp-proches__list { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .lp-card--lien, .lp-proches__list a, .lp-btn-tel { transition: none; }
}

/* Anciennes pages locales reprises du site WordPress : échelle DPE, étapes, colonnes, citation, FAQ */
.lp-article ul.lp-dpe { list-style: none; padding: 0; margin: 0 0 22px; display: grid; gap: 6px; max-width: 440px; }
.lp-article .lp-dpe li { display: flex; align-items: center; gap: 14px; margin: 0; font-size: 0.95rem; }
.lp-dpe strong {
  display: inline-flex; align-items: center; height: 30px; padding-left: 12px; flex-shrink: 0;
  color: #FFF; font-weight: 700; clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%);
}
.lp-dpe--a strong { width: 44px; background: #009C6D; }
.lp-dpe--b strong { width: 58px; background: #52B153; }
.lp-dpe--c strong { width: 72px; background: #78BD76; }
.lp-dpe--d strong { width: 86px; background: #F4E70F; color: #1F2440; }
.lp-dpe--e strong { width: 100px; background: #F0B40F; color: #1F2440; }
.lp-dpe--f strong { width: 114px; background: #EB8235; }
.lp-dpe--g strong { width: 128px; background: #D7221F; }
.lp-dpe--e, .lp-dpe--f, .lp-dpe--g { font-weight: 700; color: #000739; }
.lp-article ol.lp-steps { list-style: none; counter-reset: etape; padding: 0; margin: 0 0 22px; display: grid; gap: 12px; }
.lp-article .lp-steps li { counter-increment: etape; position: relative; margin: 0; padding: 16px 20px 16px 66px; border: 1px solid #E1E5F0; border-radius: 12px; }
.lp-steps li::before {
  content: counter(etape); position: absolute; left: 18px; top: 16px; width: 32px; height: 32px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; background: #000739; color: #FFF; font-weight: 700; font-size: 0.95rem;
}
.lp-article .lp-steps h3 { margin: 3px 0 4px; font-size: 1.05rem; }
.lp-article .lp-steps p { margin: 0; }
.lp-article ul.lp-cols { columns: 2 200px; column-gap: 32px; }
.lp-article blockquote { margin: 0 0 22px; padding: 22px 26px; border-radius: 12px; background: #F4F6FB; }
.lp-article blockquote p:last-child { margin: 0; font-size: 0.9rem; color: #6B7280; }
.lp-faq__intro { margin: -4px 0 18px; color: #3B4260; }
.lp-faq__reponse p { margin: 0 0 10px; }
.lp-faq__reponse ul { margin: 0 0 12px; padding-left: 20px; }

/* ============================================================
   Annuaire : annuaire.php (point d'entrée, régions, départements, recherche)
   Mêmes couleurs que les pages locales ; carte : annuaire_carte.php
   ============================================================ */
.an-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 440px); }

/* Recherche */
.an-search {
  position: relative; display: flex; align-items: center; gap: 10px; max-width: 540px;
  margin: 0 0 26px; padding: 6px 6px 6px 18px; border-radius: 100px; background: #FFF;
}
.an-search:focus-within { box-shadow: 0 0 0 3px rgba(62, 200, 139, 0.5); }
.an-search__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.an-search > .lp-ico { color: #6B7280; }
.an-search input { flex: 1; min-width: 0; height: 46px; border: 0; background: transparent; color: #1F2440; font-size: 1rem; outline: none; }
.an-search input::placeholder { color: #8A90A6; }
.an-search button {
  height: 46px; padding: 0 22px; border: 0; border-radius: 100px; cursor: pointer;
  background: #3EC88B; color: #000739; font-weight: 700; white-space: nowrap; transition: background-color 0.2s;
}
.an-search button:hover, .an-search button:focus-visible { background: #6BD9A8; }
.an-hero__tel { display: inline-flex; align-items: center; gap: 8px; color: #FFF; text-decoration: none; }
.an-hero__tel:hover { color: #3EC88B; }
.an-hero__tel .lp-ico { color: #3EC88B; }

/* Carte */
.an-hero__carte { justify-content: flex-end; }
.an-carte { width: 100%; max-width: 440px; margin: 0; }
.an-carte svg { display: block; width: 100%; height: auto; overflow: visible; }
.an-carte path { fill: rgba(255, 255, 255, 0.09); stroke: #000739; stroke-width: 1.5; stroke-linejoin: round; }
.an-carte .is-active path { fill: rgba(62, 200, 139, 0.55); cursor: pointer; transition: fill 0.2s; }
.an-carte .is-active:hover path, .an-carte .is-active:focus-visible path, .an-carte .is-current path { fill: #3EC88B; }
.an-carte a:focus { outline: none; }
.an-carte .is-active:focus-visible path { stroke: #FFF; stroke-width: 3; }
.an-carte__agence circle { fill: #FFF; stroke: #000739; stroke-width: 2; }
.an-carte__agence .an-carte__point { fill: #000739; stroke: none; }
.an-carte__agence:hover circle, .an-carte__agence:focus-visible circle { fill: #FFDC6B; }
.an-carte__agence:hover .an-carte__point { fill: #000739; }
.an-carte__lieu circle { fill: #FFDC6B; stroke: #000739; stroke-width: 2.5; }
.an-carte__legende { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; margin-top: 16px; font-size: 0.85rem; color: rgba(255, 255, 255, 0.75); }
.an-carte__legende span { display: inline-flex; align-items: center; gap: 8px; }
.an-carte__cle { display: inline-block; width: 12px; height: 12px; border-radius: 3px; }
.an-carte__cle--active { background: #3EC88B; }
.an-carte__cle--agence { border-radius: 50%; background: radial-gradient(circle, #000739 0 2px, #FFF 2.5px); box-shadow: 0 0 0 1px #FFF; }
.an-carte__cle--lieu { border-radius: 50%; background: #FFDC6B; }

/* Sections */
.an-section { padding: 72px 0; }
.an-section--villes { background: #FFF; }
.lp-section-title.an-mt { margin-top: 56px; }

/* Agences */
.an-agences { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 18px; }
.an-agence { display: flex; flex-direction: column; }
.an-agence .lp-contacts li { align-items: flex-start; }
.an-agence .lp-contacts li > span:last-child, .an-agence .lp-contacts li > a { padding-top: 8px; }
.an-agence .lp-card__hours { margin-bottom: 16px; }
.an-agence__liens { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: auto; padding-top: 14px; border-top: 1px solid #EEF1F7; font-size: 0.92rem; }
.an-agence__liens a { display: inline-flex; align-items: center; gap: 6px; color: #000739; font-weight: 700; text-decoration: none; }
.an-agence__liens a:hover { color: #1E9E64; }
.an-agence__liens .lp-ico { width: 15px; height: 15px; }
.an-agence__distance {
  align-self: flex-start; margin-bottom: 12px; padding: 4px 12px; border-radius: 100px;
  background: rgba(62, 200, 139, 0.14); color: #1E7A50; font-size: 0.82rem; font-weight: 700; font-variant-numeric: tabular-nums;
}

/* Villes */
.an-region { display: flex; align-items: baseline; gap: 12px; margin: 0 0 14px; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #6B7280; }
.an-region a { color: #1E9E64; text-decoration: none; }
.an-region a:hover { text-decoration: underline; }
.an-dep + .an-dep { margin-top: 44px; }
.an-dep__titre { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin: 0 0 18px; font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.3rem; }
.an-dep__titre a { color: #000739; text-decoration: none; }
.an-dep__titre a:hover { color: #1E9E64; }
.an-dep__titre a span { color: #6B7280; font-weight: 400; }
.an-dep__titre small { font-family: "Poppins", sans-serif; font-size: 0.85rem; font-weight: 400; color: #6B7280; }
.an-villes { list-style: none; margin: 0; padding: 0; columns: 3 250px; column-gap: 16px; }
.an-ville { break-inside: avoid; margin: 0 0 16px; padding: 18px 20px 12px; border: 1px solid #E1E5F0; border-radius: 12px; background: #FFF; }
.an-ville__head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.an-ville__nom { font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.05rem; color: #000739; }
.an-ville__meta { font-size: 0.82rem; color: #6B7280; white-space: nowrap; font-variant-numeric: tabular-nums; }
.an-ville__liens { list-style: none; margin: 0; padding: 0; }
.an-ville__liens a { display: block; padding: 5px 0; font-size: 0.95rem; color: #1F2440; text-decoration: none; }
.an-ville__liens a span { color: #8A90A6; }
.an-ville__liens a:hover, .an-ville__liens a:hover span { color: #1E9E64; }

/* Pastilles et messages (recherche) */
.an-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.an-chips a { display: inline-block; padding: 10px 18px; border: 1px solid #E1E5F0; border-radius: 100px; background: #FFF; color: #000739; font-weight: 500; text-decoration: none; }
.an-chips a:hover { border-color: #3EC88B; }
.an-notice { margin-bottom: 40px; padding: 24px 28px; border: 1px solid #F0DC96; border-radius: 16px; background: #FFF9E3; }
.an-notice__title { margin: 0 0 6px; font-weight: 700; color: #000739; }
.an-notice p { margin: 0 0 12px; color: #3B4260; }
.an-notice p:last-child { margin-bottom: 0; }
.an-notice a:not(.btn-1) { color: #000739; font-weight: 700; }
.an-article { max-width: 900px; }
.an-cta { padding-top: 72px; }

@media (max-width: 575px) {
  .an-search { flex-wrap: wrap; padding: 10px; border-radius: 16px; }
  .an-search > .lp-ico { display: none; }
  .an-search input { flex-basis: 100%; padding: 0 8px; }
  .an-search button { width: 100%; }
  .an-section { padding: 48px 0; }
  .an-cta { padding-top: 48px; }
}

@media (prefers-reduced-motion: reduce) {
  .an-carte .is-active path, .an-search button { transition: none; }
}

/* Puces des listes dans les textes des pages locales (le thème les retire) */
.lp-article ul:not([class]) > li, .lp-faq__reponse ul > li { list-style: disc; }
.lp-article ul:not([class]) > li::marker, .lp-faq__reponse ul > li::marker { color: #3EC88B; }

/* Bandeau devis : mention RGPD sous le formulaire (fiche 07) */
.form-quote__rgpd { margin: 16px 0 0; font-size: 0.8rem; line-height: 1.5; opacity: 0.85; }
.form-quote__rgpd a { color: inherit; text-decoration: underline; }

/* Annuaire : liste de communes proposées sous le champ de recherche (annuaire_suggestions.php) */
.an-hero { overflow: visible; }
.an-suggest {
  position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 40;
  max-height: 340px; overflow-y: auto; margin: 0; padding: 6px; list-style: none;
  background: #FFF; border-radius: 16px; box-shadow: 0 18px 40px rgba(0, 7, 57, 0.28);
}
.an-suggest__item {
  display: flex; align-items: baseline; gap: 10px; padding: 11px 14px; border-radius: 10px;
  color: #1F2440; cursor: pointer;
}
.an-suggest__item:hover, .an-suggest__item.is-actif { background: #F4F6FB; }
.an-suggest__nom { font-weight: 700; color: #000739; }
.an-suggest__badge { padding: 2px 8px; border-radius: 100px; background: rgba(62, 200, 139, 0.16); color: #1E7A50; font-size: 0.75rem; font-weight: 700; white-space: nowrap; }
.an-suggest__meta { margin-left: auto; font-size: 0.85rem; color: #6B7280; font-variant-numeric: tabular-nums; white-space: nowrap; }
.an-suggest__item--info { cursor: default; font-size: 0.85rem; }
.an-suggest__item--info:hover { background: transparent; }
.an-suggest__item--info .an-suggest__nom { font-weight: 400; color: #6B7280; }

/* Pages locales : autres prestations dans la même ville, sous le texte */
.lp-autres { margin-top: 56px; }
.lp-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.lp-chips a { display: inline-block; padding: 10px 18px; border: 1px solid #E1E5F0; border-radius: 100px; background: #FFF; color: #000739; font-weight: 500; text-decoration: none; transition: border-color 0.2s, color 0.2s; }
.lp-chips a:hover, .lp-chips a:focus-visible { border-color: #000739; color: #000739; }
@media (prefers-reduced-motion: reduce) { .lp-chips a { transition: none; } }

/* Menu : entrées réservées au mobile (Contact, Devis gratuit). Sur ordinateur, les boutons de l'en-tête les remplacent. */
@media screen and (min-width: 1200px) {
  .main-header .site-navigation .menu > ul > li.menu-mobile > a { display: none; }
  .main-header .site-navigation .menu > ul > li:nth-last-child(3) > a { margin-right: 0; }
}

/* Articles : date de publication sous le titre (fiche 41) */
.actu-date { margin: 12px 0 0; font-size: 0.95rem; opacity: 0.75; }

/* Mentions légales et politique de confidentialité : texte lisible (largeur, puces, tableau) */
.page-legale { max-width: 900px; font-size: 1rem; line-height: 1.7; }
.page-legale > *:first-child { margin-top: 0; }
.page-legale h2 { margin: 44px 0 14px; font-size: 1.6rem; line-height: 1.3; }
.page-legale h3 { margin: 26px 0 10px; font-size: 1.2rem; }
.page-legale p { margin: 0 0 14px; }
.page-legale ul { margin: 0 0 18px; padding-left: 22px; }
.page-legale li { list-style: disc; margin-bottom: 6px; }
.page-legale li::marker { color: #3EC88B; }
.page-legale a { color: #FFF; text-decoration: underline; text-decoration-color: #3EC88B; text-underline-offset: 3px; }
.page-legale a:hover { color: #3EC88B; }
.page-legale table { width: 100%; border-collapse: collapse; margin: 0 0 20px; }
.page-legale th, .page-legale td { padding: 10px 14px; border: 1px solid rgba(255, 255, 255, 0.2); text-align: left; vertical-align: top; }
.page-legale th { background: rgba(255, 255, 255, 0.06); }

/* Formulaires contact et devis : libellés, mention des champs obligatoires, erreurs sous chaque champ (fiches 18 et 28) */
.contact-form label { display: block; margin-bottom: 6px; font-weight: 500; font-size: 0.95rem; text-align: left; }
.form-devis { text-align: left; }
.form-obligatoire { margin: 0 0 16px; font-size: 0.85rem; opacity: 0.8; text-align: left; }
.form-erreur { display: block; margin-top: 6px; font-size: 0.85rem; line-height: 1.45; font-weight: 500; color: #FF9EA1; text-align: left; }
.contact-form .form-control.is-invalid, .form-quote .form-control.is-invalid, .nice-select.is-invalid, .form-fichier-zone.is-invalid {
  border-color: #FF6B70 !important; box-shadow: 0 0 0 3px rgba(255, 107, 112, 0.22);
}

/* Formulaires : message après l'envoi, résumé des erreurs, aides (theme/js/formulaires.js et message_formulaire()) */
.form-retour { display: flex; gap: 14px; align-items: flex-start; margin: 0 0 22px; padding: 16px 18px; border-radius: 16px; text-align: left; color: #FFF; scroll-margin-top: 140px; outline: none; }
.form-retour--ok { background: rgba(62, 200, 139, 0.14); border: 1px solid rgba(62, 200, 139, 0.6); }
.form-retour--erreur { background: rgba(255, 107, 112, 0.12); border: 1px solid rgba(255, 107, 112, 0.55); }
.form-retour__icone { flex: 0 0 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000739; }
.form-retour--ok .form-retour__icone { background: #3EC88B; }
.form-retour--erreur .form-retour__icone { background: #FF8A8E; }
.form-retour__titre { display: block; margin: 2px 0 4px; font-family: "Comfortaa", sans-serif; font-size: 1.05rem; font-weight: 700; }
.form-retour__texte { margin: 0; font-size: 0.93rem; line-height: 1.55; opacity: 0.92; }
.form-retour a { color: inherit; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.form-resume { margin: 4px 0 14px; padding: 10px 14px; border-radius: 12px; background: rgba(255, 107, 112, 0.12); border: 1px solid rgba(255, 107, 112, 0.5); color: #FFD6D7; font-size: 0.9rem; text-align: left; }
.form-quote .form-resume { margin: 14px 0 0; }
.form-resume ul { margin: 6px 0 0; padding-left: 18px; }
.form-resume li { margin: 2px 0; }
/* Menu déroulant stylé en erreur : pas d'icône d'alerte Bootstrap par-dessus la flèche */
.nice-select.is-invalid { background-image: none !important; }
.form-compteur, .form-aide { display: block; margin-top: 6px; font-size: 0.8rem; opacity: 0.7; text-align: left; }
.form-intro { margin: -4px 0 22px; line-height: 1.6; opacity: 0.9; }
.form-piege { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; }

/* Envoi en cours : la flèche du bouton laisse place à un indicateur de chargement */
.btn-2.is-loading { pointer-events: none; opacity: 0.8; }
.btn-2.is-loading .btn-icon { position: relative; }
.btn-2.is-loading .btn-icon svg { opacity: 0; }
.btn-2.is-loading .btn-icon::after { content: ""; position: absolute; inset: 0; margin: auto; width: 16px; height: 16px; border: 2px solid #000739; border-right-color: transparent; border-radius: 50%; animation: form-chargement 0.8s linear infinite; }
@keyframes form-chargement { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .btn-2.is-loading .btn-icon::after { animation: none; } }

/* Candidature : choix Oui / Non et dépôt du CV */
.contact-form .form-label, .form-radios legend { display: block; margin-bottom: 8px; font-weight: 500; font-size: 0.95rem; text-align: left; }
.form-radios { margin: 0; padding: 0; border: 0; text-align: left; }
.form-radios legend { width: auto; float: none; }
.form-facultatif { font-weight: 400; opacity: 0.7; }
.contact-form label.form-radio { display: inline-flex; align-items: center; gap: 8px; margin: 0 24px 0 0; font-weight: 400; cursor: pointer; }
.form-radio input { width: 18px; height: 18px; margin: 0; accent-color: #3EC88B; }
.contact-form label.form-fichier-zone { display: flex; align-items: center; gap: 14px; margin: 0; padding: 7px; border: 1px dashed rgba(255, 255, 255, 0.45); border-radius: 40px; background: rgba(255, 255, 255, 0.04); cursor: pointer; font-weight: 400; }
.form-fichier-zone:hover, .form-group:focus-within > .form-fichier-zone { border-color: #3EC88B; }
.form-group:focus-within > .form-fichier-zone { box-shadow: 0 0 0 3px rgba(62, 200, 139, 0.3); }
.form-fichier-bouton { flex: none; padding: 9px 18px; border-radius: 30px; background: #3EC88B; color: #000739; font-weight: 600; font-size: 0.9rem; }
.form-fichier { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.9rem; opacity: 0.85; }
.form-fichier-input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }

/* Recrutement : lien vers la candidature spontanée */
.jobs-spontanee { margin: 12px 0 0; opacity: 0.9; }
.jobs-spontanee a, .jobs-section .col-md-12 p a { color: #3EC88B; text-decoration: underline; text-underline-offset: 3px; }
.candidature-spontanee { padding-top: 0; scroll-margin-top: 120px; }

/* Listes déroulantes du thème (nice-select) : hauteur limitée avec défilement, libellés longs sur plusieurs lignes */
.nice-select .list { max-height: 320px; overflow-y: auto; min-width: 100%; }
.nice-select .option { white-space: normal; line-height: 1.4; min-height: 0; padding-top: 10px; padding-bottom: 10px; }
.nice-select .option.disabled[data-value=""] { display: none; }

/* Remise à zéro des marges, reprise des anciennes feuilles des pages Audits (audit-*.css, plus chargées) :
   le reste du site a été mis en page avec elle. */
*, *::before { box-sizing: border-box; margin: 0; padding: 0; }

/* Performance (fiche 21) : le diaporama de l'accueil occupe sa place dès l'affichage, avant le démarrage du
   carrousel (qui le masquait jusque-là), pour éviter le décalage de toute la page et afficher l'image tout de suite */
.banner-slide.owl-carousel:not(.owl-loaded) { display: block; }
.banner-slide.owl-carousel:not(.owl-loaded) > .banner-item ~ .banner-item { display: none; }
.banner-item__image picture { display: block; width: 100%; height: 100%; }
/* Le texte de la première diapositive est lisible dès le premier affichage, sans attendre le carrousel */
.banner-slide.owl-carousel:not(.owl-loaded) > .banner-item:first-child .banner-title,
.banner-slide.owl-carousel:not(.owl-loaded) > .banner-item:first-child .bloc-text,
.banner-slide.owl-carousel:not(.owl-loaded) > .banner-item:first-child .banner-actions { opacity: 1; visibility: visible; transform: none; transition: none; }

/* En-tête : numéro de téléphone toujours visible, y compris dans l'en-tête fixe au défilement (fiche 45) */
.main-header .header-tel {
  display: flex; align-items: center; gap: 10px; margin-right: 6px;
  color: #FFF; font-weight: 700; font-size: 1rem; white-space: nowrap; text-decoration: none;
  font-variant-numeric: tabular-nums;
}
.main-header .header-tel__icon {
  display: flex; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 38px; height: 38px; border-radius: 50%; background: #3EC88B;
}
.main-header .header-tel:hover, .main-header .header-tel:focus-visible { color: #3EC88B; }
@media (min-width: 1200px) {
  .main-header .site-navigation .menu > ul > li > a { white-space: nowrap; }
}
@media (min-width: 1200px) and (max-width: 1599px) {
  .main-header .site-navigation .menu > ul > li > a { margin-right: 14px; font-size: 0.95rem; }
  .main-header .site-navigation .menu > ul > li.has-submenu > a:after { margin-left: 5px; }
  .main-header .site-branding { padding-left: 0; padding-right: 14px; }
}
@media (min-width: 1200px) and (max-width: 1399px) {
  .main-header .img-logo { width: 170px; height: auto; }
  .main-header .site-navigation .menu > ul > li > a { margin-right: 11px; font-size: 0.9rem; }
  .main-header .header-tel__icon { display: none; }
  .main-header .header-tel { font-size: 0.92rem; margin-right: 4px; }
}

/* Pages de prestation : intertitres, listes et tableaux dans l'accordéon, FAQ (fiches 09 et 48) */
.faq-section .bloc-text h3 {
  margin: 26px 0 10px; font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.2rem; line-height: 1.3; color: #FFF;
}
.faq-section .bloc-text ol li { list-style: decimal; }
.faq-section .bloc-text ul, .faq-section .bloc-text ol { margin: 0 0 18px; padding-left: 22px; }
.faq-section .bloc-text li { margin-bottom: 6px; }
.faq-section .bloc-text li::marker { color: #3EC88B; }
.faq-section .bloc-text a { color: #FFF; text-decoration: underline; text-decoration-color: #3EC88B; text-underline-offset: 3px; }
.faq-section .bloc-text a:hover { color: #3EC88B; }
.faq-section .bloc-text table {
  width: 100%; margin: 0 0 20px; border-collapse: collapse; font-size: 0.95rem; font-variant-numeric: tabular-nums;
}
.faq-section .bloc-text th, .faq-section .bloc-text td {
  padding: 9px 14px; border: 1px solid rgba(255, 255, 255, 0.2); text-align: left; vertical-align: top;
}
.faq-section .bloc-text th { background: rgba(255, 255, 255, 0.07); font-weight: 700; }
@media (max-width: 575px) {
  .faq-section .bloc-text table { display: block; overflow-x: auto; }
}
.page-faq { margin-top: 56px; }
.pa-section ~ .page-faq { margin-top: 90px; }
.page-faq h2 {
  margin: 0 0 20px; font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: clamp(24px, 1rem + 1vw, 32px); line-height: 1.2;
}

/* ============================================================
   Pages Audits remises dans la charte du site (préfixe pa-) : titres blancs Comfortaa avec mot souligné,
   cartes blanches à icône verte, blocs sombres à liseré, frise d'étapes à cercles verts.
   Marges posées explicitement : audit-individuel.css remet à zéro marges et retraits de tous les éléments.
   ============================================================ */
.pa-section { padding: 80px 0 0; }
.pa-section--premiere { padding-top: 10px; }
.pa-section .sect-title .bloc-title { margin: 0 0 20px; }
.pa-lead { max-width: 780px; margin: 0 0 40px; font-size: 1.05rem; line-height: 1.7; color: rgba(255, 255, 255, 0.85); }
.pa-grille { display: grid; gap: 24px; margin: 0; padding: 0; list-style: none; }
.pa-grille--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pa-grille--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* Deux blocs qui se suivent dans une section (grilles, tableau, frise) : même écart qu'entre deux cartes */
.pa-section > * + .pa-grille, .pa-section > * + .pa-tableau, .pa-section > * + .pa-deux-colonnes,
.pa-section > * + .pa-etapes, .pa-section > * + .pa-coches { margin-top: 24px; }

/* Cartes blanches, comme les cartes de prestations de l'accueil */
.pa-carte {
  display: flex; flex-direction: column; gap: 16px; padding: 40px 34px 34px;
  border-radius: 30px; background: #FFF; color: #000739;
}
.pa-carte--compacte { padding: 34px 32px; }
.pa-carte__icone { font-size: 2.6rem; line-height: 1; color: #3EC88B; }
.pa-carte__surtitre { margin: 4px 0 0; font-size: 0.82rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(0, 7, 57, 0.55); }
.pa-carte__titre {
  margin: 0; font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: clamp(22px, 1rem + 0.7vw, 26px);
  line-height: 1.25; letter-spacing: -0.02em; color: #000739;
}
.pa-carte p { margin: 0; line-height: 1.65; color: rgba(0, 7, 57, 0.82); }
.pa-carte .btn-1 { align-self: flex-start; margin-top: auto; }
.pa-carte .pa-coches { margin: 4px 0 8px; }

/* Listes à coches vertes */
.pa-coches { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.pa-coches li { position: relative; padding-left: 32px; line-height: 1.5; }
.pa-coches li::before {
  content: ""; position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 50%;
  background: #3EC88B url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000739' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 12.5l4 4L18.5 8'/%3E%3C/svg%3E") center / 12px no-repeat;
}

/* Encart sombre translucide, comme le bloc « Demandez votre devis gratuit » */
.pa-encart {
  display: flex; align-items: flex-start; gap: 22px; margin: 28px 0 0; padding: 30px 34px;
  border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 30px; background: rgba(219, 219, 219, 0.08);
}
.pa-encart__icone {
  display: flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 52px; height: 52px;
  border-radius: 50%; background: #3EC88B; color: #000739; font-size: 1.4rem;
}
.pa-encart__titre { margin: 0 0 6px; font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.2rem; color: #FFF; }
.pa-encart p { margin: 0; line-height: 1.65; color: rgba(255, 255, 255, 0.85); }
.pa-encart p + p { margin-top: 6px; }

/* Déroulé : frise d'étapes et rapport */
.pa-deux-colonnes { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 56px; align-items: start; }
.pa-etapes { margin: 0; padding: 0; list-style: none; }
.pa-etapes li { position: relative; display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 22px; padding-bottom: 30px; }
.pa-etapes li::before {
  content: ""; position: absolute; left: 27px; top: 60px; bottom: 4px; width: 2px; background: rgba(62, 200, 139, 0.35);
}
.pa-etapes li:last-child { padding-bottom: 0; }
.pa-etapes li:last-child::before { display: none; }
.pa-etapes__num {
  display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%;
  border: 2px solid #3EC88B; font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.3rem; color: #FFF;
}
.pa-etapes h3 { margin: 12px 0 8px; font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.25rem; line-height: 1.3; color: #FFF; }
.pa-etapes p { margin: 0; line-height: 1.65; color: rgba(255, 255, 255, 0.82); }
.pa-panneau { padding: 40px 36px; border-radius: 30px; background: #FFF; color: #000739; }
.pa-panneau__titre {
  margin: 0 0 24px; font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: clamp(22px, 1rem + 0.7vw, 26px); line-height: 1.25; color: #000739;
}
.pa-panneau__note { margin: 26px 0 0; padding-top: 20px; border-top: 1px solid rgba(0, 7, 57, 0.12); font-size: 0.93rem; line-height: 1.6; color: rgba(0, 7, 57, 0.7); }

/* Blocs sombres à liseré, comme les avis clients */
.pa-bloc {
  display: flex; flex-direction: column; gap: 12px; padding: 34px 30px 30px;
  border: 1px solid rgba(255, 255, 255, 0.45); border-radius: 30px;
}
.pa-bloc h3 { margin: 0; font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.25rem; line-height: 1.3; color: #FFF; }
.pa-bloc p { margin: 0; line-height: 1.65; color: rgba(255, 255, 255, 0.82); }
.pa-etiquette {
  align-self: flex-start; margin-top: auto; padding: 6px 16px; border-radius: 100px;
  background: rgba(62, 200, 139, 0.14); color: #3EC88B; font-size: 0.85rem; font-weight: 700;
}

/* Tableau comparatif */
.pa-tableau { overflow-x: auto; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 30px; }
.pa-tableau table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: 0.98rem; }
.pa-tableau thead th {
  padding: 20px 24px; background: rgba(255, 255, 255, 0.05); border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  font-family: "Comfortaa", sans-serif; font-weight: 700; color: #3EC88B; text-align: left;
}
.pa-tableau tbody th, .pa-tableau tbody td { padding: 16px 24px; border-top: 1px solid rgba(255, 255, 255, 0.1); text-align: left; vertical-align: top; line-height: 1.55; }
.pa-tableau tbody tr:first-child th, .pa-tableau tbody tr:first-child td { border-top: 0; }
.pa-tableau tbody th { font-weight: 700; color: #FFF; }
.pa-tableau tbody td { color: rgba(255, 255, 255, 0.85); }
.pa-note { margin: 18px 0 0; font-size: 0.93rem; line-height: 1.6; color: rgba(255, 255, 255, 0.7); }

/* Pourquoi AUDITAG : chiffre clé et atouts, comme la section « partenaire conseil » de l'accueil */
.pa-pourquoi { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 48px; align-items: start; }
.pa-pourquoi__intro .pa-lead { margin-bottom: 28px; }
.pa-pourquoi__intro > p:last-child { margin: 0; line-height: 1.65; color: rgba(255, 255, 255, 0.85); }
.pa-chiffre { display: flex; flex-direction: column; margin: 0 0 24px; }
.pa-chiffre__nombre { font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 96px; line-height: 1; color: #FFF; }
.pa-chiffre__titre {
  margin-top: 16px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, 0.5);
  font-size: 1rem; letter-spacing: 0.04em; text-transform: uppercase; color: #FFF;
}
.pa-atout { display: flex; flex-direction: column; gap: 10px; padding: 30px 28px; border-radius: 30px; background: #FFF; color: #000739; }
.pa-atout__icone { font-size: 1.9rem; line-height: 1; color: #3EC88B; }
.pa-atout h3 { margin: 6px 0 0; font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.15rem; line-height: 1.3; color: #000739; }
.pa-atout p { margin: 0; line-height: 1.6; color: rgba(0, 7, 57, 0.8); }

/* Liens dans le texte : blancs soulignés de vert sur fond sombre, bleu nuit soulignés de vert sur fond blanc */
.pa-section a:not(.btn-1), .page-faq .lp-faq__reponse a {
  color: #FFF; text-decoration: underline; text-decoration-color: #3EC88B; text-underline-offset: 3px;
}
.pa-carte a:not(.btn-1), .pa-atout a, .pa-panneau a, .page-faq .lp-faq__reponse a { color: #000739; }
.pa-section a:not(.btn-1):hover, .page-faq .lp-faq__reponse a:hover { color: #3EC88B; }

@media (max-width: 1199px) {
  .pa-grille--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pa-pourquoi { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 991px) {
  .pa-deux-colonnes { grid-template-columns: minmax(0, 1fr); gap: 40px; }
}
@media (max-width: 767px) {
  .pa-section { padding-top: 60px; }
  .pa-grille--3, .pa-grille--2 { grid-template-columns: minmax(0, 1fr); }
  .pa-carte, .pa-panneau { padding: 30px 24px; }
  .pa-encart { flex-direction: column; padding: 26px 22px; }
  .pa-chiffre__nombre { font-size: 72px; }
}

/* Pages d'ensemble Diagnostics / Audits / Bureau d'études (fiche 40) et page Nos agences (fiche 46) */
.rubrique { padding: 20px 0 70px; }
.rubrique__intro { max-width: 820px; margin-bottom: 20px; font-size: 1.05rem; line-height: 1.7; }
.rubrique__intro h1 {
  margin: 0 0 20px; font-family: "Comfortaa", sans-serif; font-weight: 700;
  font-size: clamp(30px, 1rem + 2vw, 46px); line-height: 1.15; text-wrap: balance;
}
.rubrique__intro a { color: #FFF; text-decoration: underline; text-decoration-color: #3EC88B; text-underline-offset: 3px; }
.rubrique__intro a:hover { color: #3EC88B; }
.rubrique__groupe, .rubrique__agences { margin-top: 56px; }
.rubrique__groupe-titre {
  margin: 0 0 22px; font-family: "Comfortaa", sans-serif; font-weight: 700;
  font-size: clamp(24px, 1rem + 1vw, 32px); line-height: 1.2;
}
.rubrique-grille {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 20px;
  margin: 0; padding: 0; list-style: none;
}
.rubrique-carte {
  position: relative; display: flex; flex-direction: column; gap: 12px; padding: 26px 24px 22px;
  border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 20px; background: rgba(255, 255, 255, 0.04);
  transition: border-color 0.2s, background-color 0.2s;
}
.rubrique-carte:hover, .rubrique-carte:focus-within { border-color: #3EC88B; background: rgba(62, 200, 139, 0.07); }
.rubrique-carte__icone { width: 48px; height: 48px; }
.rubrique-carte__titre { margin: 0; font-family: "Comfortaa", sans-serif; font-size: 1.25rem; font-weight: 700; line-height: 1.3; }
.rubrique-carte__titre a { color: #FFF; text-decoration: none; }
/* Toute la carte est cliquable (le lien du titre la recouvre) */
.rubrique-carte__titre a::after { content: ""; position: absolute; inset: 0; border-radius: 20px; }
.rubrique-carte__titre a:focus-visible { outline: none; }
.rubrique-carte:focus-within { outline: 2px solid #3EC88B; outline-offset: 2px; }
.rubrique-carte__texte { margin: 0; color: rgba(255, 255, 255, 0.82); font-size: 0.97rem; line-height: 1.6; }
.rubrique-carte__infos { display: flex; flex-direction: column; gap: 6px; margin: 2px 0 0; font-size: 0.9rem; line-height: 1.5; }
.rubrique-carte__infos div { display: flex; flex-wrap: wrap; gap: 0 6px; }
.rubrique-carte__infos dt { color: #3EC88B; font-weight: 700; }
.rubrique-carte__infos dt::after { content: " :"; }
.rubrique-carte__infos dd { margin: 0; color: rgba(255, 255, 255, 0.9); }
.rubrique-carte__plus { display: flex; align-items: center; gap: 10px; margin-top: auto; padding-top: 8px; font-weight: 700; font-size: 0.95rem; }
.rubrique-carte__fleche {
  display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px;
  border-radius: 50%; background: #3EC88B;
}

.agences-liste { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 36px; }
.agence-fiche {
  display: flex; flex-direction: column; gap: 16px; padding: 30px 28px;
  border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 20px; background: rgba(255, 255, 255, 0.04);
}
.agence-fiche__photo { margin: -30px -28px 4px; border-radius: 19px 19px 0 0; overflow: hidden; aspect-ratio: 16 / 10; background: rgba(255, 255, 255, 0.06); }
.agence-fiche__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.agence-fiche__nom { margin: 0; font-family: "Comfortaa", sans-serif; font-weight: 700; font-size: 1.5rem; line-height: 1.25; }
.agence-fiche__coord { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.agence-fiche__coord li { display: flex; align-items: flex-start; gap: 12px; line-height: 1.5; }
.agence-fiche__coord svg { flex: 0 0 auto; margin-top: 3px; color: #3EC88B; }
.agence-fiche__coord a { color: #FFF; text-decoration: underline; text-decoration-color: rgba(62, 200, 139, 0.8); text-underline-offset: 3px; }
.agence-fiche__coord a:hover { color: #3EC88B; }
.agence-fiche__page { margin: 4px 0 0; }
.agence-fiche__sous-titre { margin: 8px 0 0; font-size: 1rem; font-weight: 700; color: #3EC88B; }
.agence-fiche__communes { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0; padding: 0; list-style: none; font-size: 0.93rem; }
.agence-fiche__communes a { color: rgba(255, 255, 255, 0.88); text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, 0.25); }
.agence-fiche__communes a:hover { color: #3EC88B; border-color: #3EC88B; }
@media (max-width: 991px) {
  .agences-liste { grid-template-columns: 1fr; }
}
@media (max-width: 575px) {
  .rubrique-grille { grid-template-columns: 1fr; }
  .agence-fiche { padding: 24px 20px; }
  .agence-fiche__photo { margin: -24px -20px 4px; }
}
@media (prefers-reduced-motion: reduce) {
  .rubrique-carte { transition: none; }
}

/* Page Équipe : grille de portraits toujours visibles (fiche 47) */
.equipe-pole { padding-top: 60px; padding-bottom: 20px; }
.equipe-pole .sect-title { margin-bottom: 28px; }
.equipe-grille {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 32px 24px;
  margin: 0; padding: 0; list-style: none;
}
.equipe-carte { display: flex; flex-direction: column; gap: 14px; }
.equipe-carte__photo {
  position: relative; aspect-ratio: 4 / 5; max-width: 100%; overflow: hidden;
  border-radius: 20px; background: #1A2150;
}
.equipe-carte__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 25%; display: block; }
.equipe-carte__initiales {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-family: "Comfortaa", sans-serif; font-size: 2.6rem; font-weight: 700; color: #3EC88B;
}
.equipe-carte__nom { color: #FFF; font-family: "Comfortaa", sans-serif; font-size: 1.2rem; font-weight: 700; line-height: 1.25; }
.equipe-carte__poste { margin-top: 4px; color: rgba(255, 255, 255, 0.75); font-size: 0.95rem; line-height: 1.45; }
.equipe-carte__linkedin { display: inline-block; margin-top: 8px; color: #3EC88B; font-weight: 600; font-size: 0.9rem; }
@media (max-width: 575px) {
  .equipe-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 14px; }
  .equipe-carte__nom { font-size: 1.02rem; }
  .equipe-carte__poste { font-size: 0.86rem; }
}

/* Accueil : lien vers la page Nos agences sous les adresses (fiche 46) */
.agencies__plus { position: relative; margin: 28px 0 0; text-align: center; }
.agencies__plus a { color: #FFF; font-weight: 700; text-decoration: underline; text-decoration-color: #3EC88B; text-underline-offset: 4px; }
.agencies__plus a:hover { color: #3EC88B; }

/* Pied de page : réseaux sociaux de l'entreprise (fiche 31) */
.footer-reseaux { display: flex; gap: 12px; margin: 0; padding: 0; list-style: none; }
.footer-reseaux .social-link:hover { border-color: #3EC88B; }

/* Barre d'action mobile et tablette sur toutes les pages : Appeler / Devis gratuit (fiches 17 et 45) */
.barre-mobile { display: none; }
@media (max-width: 1199px) {
  .barre-mobile {
    display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
    background: #000739; box-shadow: 0 -6px 20px rgba(0, 0, 0, 0.25);
  }
  .barre-mobile a {
    display: flex; align-items: center; justify-content: center; gap: 8px; height: 46px;
    border-radius: 100px; font-weight: 700; text-decoration: none; white-space: nowrap;
  }
  .barre-mobile__tel { border: 1px solid rgba(255, 255, 255, 0.6); color: #FFF; }
  .barre-mobile__tel:hover { color: #FFF; border-color: #3EC88B; }
  .barre-mobile__devis { background: #3EC88B; color: #000739; }
  .barre-mobile__devis:hover { color: #000739; }
  body { padding-bottom: calc(66px + env(safe-area-inset-bottom, 0px)); }

}
@media (min-width: 768px) and (max-width: 1199px) {
  .barre-mobile { grid-template-columns: repeat(2, minmax(0, 240px)); justify-content: center; }
}

/* Page « Demande de devis » : bandeau compact, le formulaire remonte sous le titre */
.intern .banner-section--compact .banner-inner { min-height: 0; padding-bottom: 0; }
.intern .banner-section--compact .banner-content { padding-bottom: 10px; }
.banner-section--compact + .content-page { padding-top: 10px; }

/* Listes déroulantes (nice-select) : .site-main coupait tout ce qui dépasse, donc la liste « type de prestation » du
   bandeau devis quand il est la dernière section avant le pied de page (dernières prestations invisibles).
   On ne coupe plus que les débordements horizontaux (animations d'entrée, décors) ; flow-root garde la même mise en page. */
@supports (overflow-x: clip) {
  body .site-main, .lp-page .site-main { display: flow-root; overflow: visible; overflow-x: clip; }
}
/* Pas assez de place sous le champ (bas de l'écran) : la liste s'ouvre vers le haut (classe posée par main.js) */
.nice-select.nice-select--haut .list { top: auto; bottom: 100%; margin-top: 0; margin-bottom: 4px; transform-origin: 50% 100%; }
.nice-select.nice-select--haut:not(.open) .list { transform: scale(0.75) translateY(21px); }

/* ============================================================
   Menu mobile et tablette (moins de 1200 px, header.php) : panneau plein écran sur téléphone, tiroir à droite sur
   tablette. Rubriques en accordéon, sigles expliqués, appel et devis toujours visibles en bas.
   Les boutons remettent à zéro les styles globaux des boutons du thème (fond vert, hauteur fixe, bordure blanche).
   ============================================================ */
.mnav-burger, .mnav, .mnav-fond { display: none; }
@media (max-width: 1199px) {
  .main-header .site-navigation .menu { display: none !important; }

  /* Bouton « Menu » de l'en-tête */
  .mnav-burger {
    position: absolute; top: 50%; right: 0; z-index: 2; transform: translateY(-50%);
    display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0 18px 0 16px;
    border: 1px solid rgba(255, 255, 255, 0.35); border-radius: 100px; background: rgba(255, 255, 255, 0.06);
    color: #FFF; font-family: "DM Sans", sans-serif; font-size: 15px; font-weight: 500; line-height: 1; overflow: visible;
  }
  .mnav-burger:hover, .mnav-burger:focus-visible { color: #FFF; background: rgba(62, 200, 139, 0.14); border-color: #3EC88B; }
  .mnav-burger__icone { display: flex; flex-direction: column; gap: 4px; width: 18px; }
  .mnav-burger__icone span { display: block; width: 100%; height: 2px; border-radius: 2px; background: currentColor; transition: width 0.25s ease; }
  .mnav-burger__icone span:last-child { width: 60%; }
  .mnav-burger:hover .mnav-burger__icone span:last-child { width: 100%; }

  /* Panneau */
  .mnav {
    position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1000;
    display: flex; flex-direction: column;
    background: #000739 radial-gradient(120% 50% at 100% 0%, rgba(62, 200, 139, 0.14), rgba(62, 200, 139, 0) 65%);
    color: #FFF; font-family: "DM Sans", sans-serif;
    visibility: hidden; opacity: 0; transform: translateY(-10px); pointer-events: none;
    transition: opacity 0.25s ease, transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), visibility 0s linear 0.35s;
  }
  .mnav.is-ouvert {
    visibility: visible; opacity: 1; transform: none; pointer-events: auto;
    transition: opacity 0.25s ease, transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), visibility 0s;
  }
  html.mnav-ouvert, html.mnav-ouvert body { overflow: hidden; }

  /* Le thème impose outline: none !important aux boutons : le contour clavier est rétabli dans le panneau */
  .mnav a:focus-visible, .mnav button:focus-visible, .mnav-burger:focus-visible {
    outline: 2px solid #3EC88B !important; outline-offset: 3px;
  }

  /* Haut : logo et « Fermer », à la même place que le logo et le bouton « Menu » de l'en-tête */
  .mnav__haut {
    display: flex; align-items: center; justify-content: space-between; gap: 16px; flex: 0 0 auto;
    min-height: 74px; padding: 0 15px; border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }
  .mnav__logo { display: block; width: 170px; }
  .mnav__logo img { display: block; width: 100%; height: auto; }
  .mnav__fermer {
    display: inline-flex; align-items: center; gap: 9px; height: 44px; padding: 0 18px 0 16px; margin-left: auto;
    border: 1px solid rgba(255, 255, 255, 0.35); border-radius: 100px; background: rgba(255, 255, 255, 0.06);
    color: #FFF; font-family: "DM Sans", sans-serif; font-size: 15px; font-weight: 500; line-height: 1; overflow: visible; z-index: auto;
  }
  .mnav__fermer:hover, .mnav__fermer:focus-visible { color: #FFF; background: rgba(62, 200, 139, 0.14); border-color: #3EC88B; }

  /* Liste des rubriques (zone qui défile) */
  .mnav__corps { position: relative; flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 6px 20px 28px; }
  .mnav__liste { margin: 0; padding: 0; list-style: none; }
  .mnav__item {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    opacity: 0; transform: translateY(12px); transition: opacity 0.3s ease, transform 0.45s cubic-bezier(0.2, 0.8, 0.2, 1);
  }
  .mnav.is-ouvert .mnav__item { opacity: 1; transform: none; transition-delay: calc(70ms + var(--i, 0) * 35ms); }
  .mnav__item:last-child { border-bottom: 0; }

  .mnav__rubrique {
    display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; height: auto; min-height: 76px;
    padding: 14px 0; margin: 0; border: 0; border-radius: 0; background: none; box-shadow: none;
    color: #FFF; font: inherit; text-align: left; overflow: visible; z-index: auto; cursor: pointer;
  }
  .mnav__rubrique:hover, .mnav__rubrique:focus { color: #FFF; background: none; border: 0; }
  .mnav__textes { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
  .mnav__titre { font-family: "Comfortaa", sans-serif; font-size: 21px; font-weight: 700; line-height: 1.2; letter-spacing: -0.02em; transition: color 0.2s ease; }
  .mnav__detail { font-size: 14px; line-height: 1.35; color: rgba(255, 255, 255, 0.62); }
  .mnav__pastille {
    display: flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 40px; height: 40px;
    border: 1px solid rgba(255, 255, 255, 0.22); border-radius: 50%; color: #FFF;
    transition: transform 0.3s ease, background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
  }
  .mnav__rubrique:hover .mnav__pastille { border-color: #3EC88B; }
  .mnav__rubrique[aria-current="page"] .mnav__titre, .mnav__item.is-ouverte .mnav__titre { color: #3EC88B; }
  .mnav__rubrique[aria-current="page"] .mnav__pastille,
  .mnav__item.is-ouverte .mnav__pastille { background: #3EC88B; border-color: #3EC88B; color: #000739; }
  .mnav__item.is-ouverte .mnav__pastille--chevron { transform: rotate(180deg); }

  /* Sous-rubriques : accordéon (hauteur animée de 0 à la hauteur du contenu) */
  .mnav__sous {
    display: grid; grid-template-rows: 0fr; visibility: hidden;
    transition: grid-template-rows 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), visibility 0s linear 0.35s;
  }
  /* inherit et non visible : sinon la rubrique ouverte resterait cliquable panneau fermé */
  .mnav__item.is-ouverte .mnav__sous {
    grid-template-rows: 1fr; visibility: inherit;
    transition: grid-template-rows 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), visibility 0s;
  }
  .mnav__sous-cadre { min-height: 0; overflow: hidden; }
  .mnav__sous-liste {
    margin: 0 0 18px; padding: 8px; list-style: none;
    border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 20px; background: rgba(255, 255, 255, 0.05);
  }
  .mnav__lien {
    display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 11px 14px; border-radius: 13px;
    color: rgba(255, 255, 255, 0.9); font-size: 16px; line-height: 1.35; text-decoration: none;
  }
  .mnav__lien:hover, .mnav__lien:focus { color: #3EC88B; background: rgba(255, 255, 255, 0.05); }
  .mnav__lien--tous { justify-content: space-between; color: #3EC88B; font-weight: 700; }
  .mnav__lien--tous svg { flex: 0 0 auto; }
  .mnav__lien[aria-current="page"] { color: #3EC88B; font-weight: 700; background: rgba(62, 200, 139, 0.12); }

  /* Bas : appel et devis, toujours visibles (comme la barre d'action des pages) */
  .mnav__actions {
    display: grid; grid-template-columns: 1fr 1fr; gap: 10px; flex: 0 0 auto;
    padding: 12px 15px calc(12px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid rgba(255, 255, 255, 0.1); background: #000739;
  }
  .mnav__action {
    display: flex; align-items: center; justify-content: center; gap: 8px; height: 50px; padding: 0 10px;
    border-radius: 100px; font-size: 15px; font-weight: 700; white-space: nowrap; text-decoration: none;
    font-variant-numeric: tabular-nums;
  }
  .mnav__action--tel { border: 1px solid rgba(255, 255, 255, 0.6); color: #FFF; }
  .mnav__action--tel:hover, .mnav__action--tel:focus { color: #FFF; border-color: #3EC88B; }
  .mnav__action--devis { background: #3EC88B; color: #000739; }
  .mnav__action--devis:hover, .mnav__action--devis:focus { color: #000739; background: #5AD6A0; }
}
@media (max-width: 767px) {
  .mnav__haut { min-height: 61px; }
  .mnav__logo { width: 135px; }
}
@media (max-width: 374px) {
  .mnav__corps { padding-left: 15px; padding-right: 15px; }
  .mnav__titre { font-size: 19px; }
  .mnav__action { gap: 6px; font-size: 14px; }
  .mnav__action svg { width: 16px; height: 16px; }
}
/* Tablette : tiroir à droite, la page reste visible derrière un voile */
@media (min-width: 600px) and (max-width: 1199px) {
  .mnav {
    left: auto; width: 440px; max-width: 100%; transform: translateX(48px);
    border-left: 1px solid rgba(255, 255, 255, 0.08); box-shadow: -24px 0 60px rgba(0, 0, 0, 0.35);
  }
  .mnav__logo { display: none; }
  .mnav-fond {
    display: block; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 999;
    background: rgba(0, 4, 30, 0.6); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
    opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0s linear 0.3s;
  }
  html.mnav-ouvert .mnav-fond { opacity: 1; visibility: visible; transition: opacity 0.3s ease, visibility 0s; }
}
@media (prefers-reduced-motion: reduce) {
  .mnav, .mnav__item, .mnav__sous, .mnav__pastille, .mnav-fond, .mnav-burger__icone span { transition: none !important; }
  .mnav, .mnav__item { transform: none; }
}

/* Flèche décorative à côté du titre des pages internes : elle dépasse sous le bandeau, qui la coupait (overflow: hidden).
   Le bandeau la laisse déborder et passe au-dessus du bloc suivant ; les débordements horizontaux restent coupés par .site-main. */
.intern .banner-section { position: relative; z-index: 2; }
.intern .banner-inner { overflow: visible; }

/* Étiquette reCAPTCHA masquée (autorisé par Google : la mention « protégé par reCAPTCHA » figure sous chaque formulaire) */
.grecaptcha-badge { visibility: hidden !important; }

/* Pied de page : médiateur de la consommation (article L 611-1 du Code de la consommation), sur toutes les pages */
.footer-mediateur { margin: 0; padding: 0 0 20px; color: rgba(255, 255, 255, 0.7); font-size: 0.8rem; line-height: 1.6; text-align: center; }
.footer-mediateur a { color: rgba(255, 255, 255, 0.85); text-decoration: underline; text-underline-offset: 3px; word-break: break-word; }
.footer-mediateur a:hover { color: #3EC88B; }
@media (min-width: 1200px) { .footer-mediateur { text-align: left; } }
