.elementor-kit-8{--e-global-color-primary:#1B6E89;--e-global-color-secondary:#F5B72C;--e-global-color-text:#000000;--e-global-color-accent:#FFFFFF;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-size:48px;--e-global-typography-primary-font-weight:700;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-size:32px;--e-global-typography-secondary-font-weight:700;--e-global-typography-text-font-family:"Poppins";--e-global-typography-text-font-size:17px;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Poppins";--e-global-typography-accent-font-size:14px;--e-global-typography-accent-font-weight:400;}.elementor-kit-8 button,.elementor-kit-8 input[type="button"],.elementor-kit-8 input[type="submit"],.elementor-kit-8 .elementor-button{background-color:var( --e-global-color-secondary );font-family:"Poppins", Sans-serif;font-size:16px;font-weight:600;color:#FFFFFF;border-radius:30px 30px 30px 30px;padding:14px 28px 14px 28px;}.elementor-kit-8 button:hover,.elementor-kit-8 button:focus,.elementor-kit-8 input[type="button"]:hover,.elementor-kit-8 input[type="button"]:focus,.elementor-kit-8 input[type="submit"]:hover,.elementor-kit-8 input[type="submit"]:focus,.elementor-kit-8 .elementor-button:hover,.elementor-kit-8 .elementor-button:focus{background-color:#D9A124;color:#FFFFFF;}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}.elementor-kit-8 h1{font-size:55px;}.elementor-kit-8 h3{color:var( --e-global-color-secondary );font-family:"Playfair Display", Sans-serif;font-size:22px;font-style:italic;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-lightbox{--lightbox-ui-color:var( --e-global-color-primary );--lightbox-ui-color-hover:#FFFFFF;--lightbox-navigation-icons-size:0px;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-8{--e-global-typography-primary-font-size:32px;--e-global-typography-secondary-font-size:24px;--e-global-typography-text-font-size:16px;--e-global-typography-accent-font-size:12px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}:root { --Bleu:#1B6E89; --Orange:#F5B72C; }
/* Start custom CSS *//* =========================
   ORANGE CRE - SIDEBAR + ACCORDÉON
========================= */
.elementor-kit-8 {
  --main-orange: #F5B72C;
  --orange-hover: #e0a61f;
}

/* =========================
   SIDEBAR (menu à droite)
========================= */

/* Item actif */
.elementor-kit-8 .sidebar .widget ul li.current a,
.elementor-kit-8 .service-sidebar ul li.current a {
    background: var(--main-orange) !important;
    color: #ffffff !important;
    border-color: var(--main-orange) !important;
}

/* Hover */
.elementor-kit-8 .sidebar .widget ul li a:hover,
.elementor-kit-8 .service-sidebar ul li a:hover {
    background: var(--main-orange) !important;
    color: #ffffff !important;
}

/* Bordure / contour */
.elementor-kit-8 .sidebar .widget ul li a {
    border-color: rgba(0,0,0,0.05);
}

/* =========================
   ACCORDÉON
========================= */

/* Onglet actif */
.elementor-kit-8 .accordion-box .block.active .acc-btn,
.elementor-kit-8 .accordion-box .block .acc-btn.active {
    background: var(--main-orange) !important;
    color: #ffffff !important;
}

/* Hover accordéon */
.elementor-kit-8 .accordion-box .block .acc-btn:hover {
    background: var(--main-orange) !important;
    color: #ffffff !important;
}



/* Contenu ouvert (optionnel plus clean) */
.elementor-kit-8 .accordion-box .block .acc-content {
    border-top: 2px solid var(--main-orange) !important;
}

/* SIDEBAR SERVICES - orange CRE Piscines */
.elementor-kit-8 .service-sidebar .service-widget li.current-menu-item > a,
.elementor-kit-8 .service-sidebar .service-widget li.current_page_item > a,
.elementor-kit-8 .service-sidebar .widget_nav_menu li.current-menu-item > a,
.elementor-kit-8 .service-sidebar .widget_nav_menu li.current_page_item > a,
.elementor-kit-8 .service-sidebar .menu li.current-menu-item > a,
.elementor-kit-8 .service-sidebar .menu li.current_page_item > a,
.elementor-kit-8 .service-sidebar li:first-child > a {
    background: #F5B72C !important;
    background-color: #F5B72C !important;
    border-color: #F5B72C !important;
    color: #ffffff !important;
}

/* Hover sidebar */
.elementor-kit-8 .service-sidebar .service-widget li > a:hover,
.elementor-kit-8 .service-sidebar .widget_nav_menu li > a:hover,
.elementor-kit-8 .service-sidebar .menu li > a:hover {
    background: #F5B72C !important;
    background-color: #F5B72C !important;
    border-color: #F5B72C !important;
    color: #ffffff !important;
}

/* Flèche / icône dans item actif */
.elementor-kit-8 .service-sidebar li.current-menu-item > a i,
.elementor-kit-8 .service-sidebar li.current_page_item > a i,
.elementor-kit-8 .service-sidebar li:first-child > a i {
    color: #ffffff !important;
}

/* ===== IMPORT POLICE POPPINS ===== */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

/* ===== CONTENEUR JAUNE PRINCIPAL ===== */
.piscine-etapes {
  background: linear-gradient(135deg, #F4B942 0%, #E89B1F 100%) !important;
  border-radius: 32px !important;
  padding: 80px 40px 56px 40px !important;
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 18px !important;
  position: relative;
  overflow: hidden;
  font-family: 'Poppins', sans-serif !important;
}

/* Cercles décoratifs en arrière-plan */
.piscine-etapes::before {
  content: '';
  position: absolute;
  top: -100px;
  right: -100px;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  z-index: 1;
  pointer-events: none;
}

.piscine-etapes::after {
  content: '';
  position: absolute;
  bottom: -80px;
  left: -80px;
  width: 250px;
  height: 250px;
  border-radius: 50%;
  background: rgba(12, 47, 74, 0.08);
  z-index: 1;
  pointer-events: none;
}

/* ===== CARTE BLANCHE ===== */
.piscine-carte {
  background: #FFFFFF !important;
  border-radius: 20px !important;
  padding: 28px 16px 20px 16px !important;
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  min-height: 170px !important;
  box-shadow: 0 4px 20px rgba(12, 47, 74, 0.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  font-family: 'Poppins', sans-serif !important;
}

.piscine-carte:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 30px rgba(12, 47, 74, 0.15);
}

/* ===== BADGE NUMÉROTÉ FLOTTANT ===== */
.piscine-numero {
  position: absolute !important;
  top: -16px !important;
  left: 16px !important;
  background: #0C2F4A !important;
  color: #FFFFFF !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  box-shadow: 0 4px 12px rgba(12, 47, 74, 0.25);

/* ===== TEXTE DESCRIPTIF ===== */
.piscine-texte,
.piscine-texte * {
  color: #0C2F4A !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  letter-spacing: 0.2px !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

.piscine-texte {
  flex-grow: 1;
}

.piscine-texte {
  flex-grow: 1;
}

/* ===== TRAIT JAUNE DÉCORATIF ===== */
.piscine-carte::after {
  content: '';
  display: block;
  margin-top: 14px;
  height: 3px;
  width: 28px;
  background: #F4B942;
  border-radius: 2px;
}

/* ===== TABLETTE ===== */
@media (max-width: 1024px) {
  .piscine-etapes {
    grid-template-columns: repeat(3, 1fr) !important;
    padding: 60px 32px 40px 32px !important;
    gap: 24px !important;
  }
  .piscine-carte {
    min-height: 150px !important;
  }
  .piscine-texte,
  .piscine-texte * {
    font-size: 12px !important;
  }
}

/* ===== MOBILE ===== */
@media (max-width: 600px) {
  .piscine-etapes {
    grid-template-columns: 1fr !important;
    padding: 48px 24px 32px 24px !important;
    gap: 32px !important;
    border-radius: 24px !important;
  }
  .piscine-carte {
    min-height: auto !important;
    padding: 24px 18px 18px 18px !important;
  }
  .piscine-texte,
  .piscine-texte * {
    font-size: 12px !important;
  }
}

/* ===== OVERLAY ROND DES SERVICES EN JAUNE PARTOUT ===== */

/* Icône ronde en bas de chaque carte service */
.service-block .icon-box,
.service-block .service-icon,
.service-block .icon-wrap,
.poolix-service-grid .icon-box,
.poolix-service-grid .service-icon,
.service-grid .icon-box,
.service-grid .service-icon,
.service-grid-style-one .icon-box,
.service-grid-style-one .service-icon,
.service-block-one .icon-box,
.service-block-one .service-icon {
  background: #F5B72C !important;
  background-color: #F5B72C !important;
}

/* Couleur de l'icône à l'intérieur (en blanc pour contraster) */
.service-block .icon-box i,
.service-block .icon-box svg,
.service-block .service-icon i,
.service-block .service-icon svg,
.poolix-service-grid .icon-box i,
.poolix-service-grid .icon-box svg {
  color: #FFFFFF !important;
  fill: #FFFFFF !important;
}

/* ===== AÉRER LE SITE — VERSION AGRESSIVE ===== */

/* Forcer l'espacement entre les sections Elementor */
body .elementor section.elementor-section,
body .elementor .elementor-top-section {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

/* Forcer la largeur max du contenu */
body .elementor .elementor-section.elementor-section-boxed > .elementor-container,
body .elementor .elementor-container.elementor-column-gap-default {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
}

/* Espacement entre les colonnes (cartes) */
body .elementor .elementor-column-gap-default > .elementor-row > .elementor-column > .elementor-element-populated,
body .elementor .elementor-column-gap-default .elementor-column > .elementor-element-populated {
    padding: 16px !important;
}

/* Sur mobile */
@media (max-width: 767px) {
    body .elementor section.elementor-section,
    body .elementor .elementor-top-section {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
}/* End custom CSS */