/*
Theme Name: Pixeles x Divi
Description: Theme enfant de Divi par Pixeles
Author: Pixeles
Author URI: https://www.pixeles.fr
Template: Divi
Version: 1.1
*/

/* 
** CENTRER DU CONTENU VERTICALEMENT 
** Voir tuto : https://www.divi-community.fr/snippets-divi/centrer-du-contenu-verticalement
*/

.dc-centrer-verticalement {
	display: flex;
	flex-direction: column;
	justify-content: center;
  	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	 -moz-box-orient: vertical;
	 -moz-box-direction: normal;
	  -ms-flex-direction: column;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;
}

/*
** INVERSER LE SENS DES COLONNES SUR MOBILE
** Voir tuto : https://www.divi-community.fr/snippets-divi/inverser-ordre-des-colonnes-sur-mobile
*/

@media only screen and (max-width : 980px) {
	.dc-inverser-colonnes--section .dc-inverser-colonnes--ligne, .inverse {
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-webkit-flex-direction: column-reverse;
		-ms-flex-direction: column-reverse;
		flex-direction: column-reverse;
	}
}

/*
** forcer la colonee 100% sur mobile
*/
@media (max-width: 767px) {
  .et_flex_row {
    flex-wrap: wrap !important;
  }

  .et_flex_row > .et_pb_column {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* 
** AUGMENTER LA LARGEUR CHAMP RÉSULTAT CAPTCHA 
** Parfois, suivant la taille du texte, certains chiffres du résultat sont masqués
*/
.et_pb_contact_right p input {
	max-width: 50px;
}


:lang(en-GB) .et-l--footer #fr { display: none;}
:lang(fr-FR) .et-l--footer #en { display: none;}
/*
** METTRE EXPOSANTS ET INDICES À LA BONNE TAILLE
** Généralement, ils sont bien trop gros…
*/
sup, sub {
    font-size: 70%;
}

/*
** MENU MOBILE :le hamburger devient une croix pour fermer*/

.mobile_menu_bar::before { color: #001144 !important;}
.mobile_nav.opened .mobile_menu_bar:before {
	content: "\4d";
}
/*
** LOADER */

#site-loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  z-index: 999999;
  pointer-events: none;
  transition: opacity .2s ease, visibility .2s ease;
}

#site-loader.is-hidden {
  opacity: 0;
  visibility: hidden;
}

.loader-line {
  position: relative;
  width: 100%;
  height: 100%;
  background: rgba(0, 53, 148, .15);
  overflow: hidden;
}

.loader-line::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 45%;
  height: 100%;
  background: #003594;
  animation: loaderMove 1.2s ease-in-out infinite;
}

#site-loader.is-hidden .loader-line::after {
  animation: none;
}

@keyframes loaderMove {
  from { transform: translateX(-100%); }
  to { transform: translateX(225%); }
}

@media (prefers-reduced-motion: reduce) {
  #site-loader {
    transition: none;
  }

  .loader-line::after {
    animation: none;
  }
}


/* MENU MOBILE : Divi Menu full width*/

.et_mobile_menu {
    min-width: 100vw !important;
    width: 100vw !important;
    margin-left: -50vw !important; /* Adjust if using custom row width */
    left: 50% !important;
}

/* MENU MOBILE : Remove the top line */
.et_mobile_menu {
border-top:0;
}

/* Agrandir les zones de clic + lisibilité */

.et_mobile_menu li li { padding-left: 2%;}
.et_mobile_menu li a {
  padding: 8px 10px !important;
  line-height: 1.8 !important;
}


/* snippet by wpzone */

.et_pb_menu .et_mobile_menu .menu-item-has-children > a,
#main-header .et_mobile_menu .menu-item-has-children > a {
    background-color: transparent;
    position: relative;
}
.et_pb_menu .et_mobile_menu .menu-item-has-children > a:after, #main-header .et_mobile_menu .menu-item-has-children > a:after {
    font-family: 'ETmodules';
    text-align: center;
    speak: none;
    font-weight: 600;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    font-size: 18px;
    content: '\4c';
    top: 11px;
    right: 13px;
}
.et_pb_menu .et_mobile_menu .menu-item-has-children.visible > a:after,
#main-header .et_mobile_menu .menu-item-has-children.visible > a:after {
    content: '\4d';
}
.et_pb_menu .et_mobile_menu ul.sub-menu,
#main-header .et_mobile_menu ul.sub-menu,
.et-db #et-boc .et-l .et_pb_menu .et_mobile_menu li ul.sub-menu {
    display: none !important;
    visibility: hidden !important;
    transition: all 1.5s ease-in-out;
}
.et_pb_menu .et_mobile_menu li.visible > ul.sub-menu,
#main-header .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l #main-header .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l .et_pb_fullwidth_menu .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l .et_pb_menu .et_mobile_menu li.visible > ul.sub-menu {
    display: block !important;
    visibility: visible !important;
}

/*icon mega menu*/

.mega-menu .title a::after {
  color: #3599ce;
}

/*
**
** HEADER MOBILE : TOP BAR (secondary-nav)
**
*/

@media (max-width: 980px) {
/*Forcer l'affichage de la top bar (où vit #et-secondary-menu) */
#top-header, #et-secondary-nav, #et-secondary-menu { display: block !important; text-align: left; }
#top-header .container { 
    width: 80% !important;
    font-weight: normal !important;
    margin-left: auto;
    margin-right: auto;
    padding: 5px 0 !important;
  }
#baseline { display: none; }
#et-secondary-nav li { margin-right: 10px;}
#top-header #et-secondary-nav .tel { left: 5px;}


/* Cacher / Afficher btn RDV  */
.btn-orange.mobile { display: block; float: right;}
.btn-orange.desktop { display: none !important;}
.btn-vert.mobile { display: block; float: right;}
.btn-vert.desktop { display: none !important;}
.btn-bleu.mobile { display: block; float: right;}
.btn-bleu.desktop { display: none !important;}

/* Base : cache le texte des liens */
  #top-header #et-secondary-nav .tel a {
    font-size: 0 !important;
    line-height: 0 !important;
    padding: 10px 10px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
  }

  /* Icônes Divi */
  #top-header #et-secondary-nav .tel a:before {
    font-family: "ETmodules" !important;
    font-size: 18px !important;
    line-height: 1;
    speak-as: none;
  }

  /* 📞 Téléphone */
  #top-header #et-secondary-nav .tel > a:before{
    content: "\e090"; /* phone */
  }

  /* 📝 Devis */
  #top-header #et-secondary-nav .devis { display: none;}
  #top-header #et-secondary-nav .devis > a:before{
    content: "\e058"; /* document */
  }
}

/*
** HEADER 
*/


@media (max-width: 980px) {

/* 1) Sur mobile, PAS de fixed : 2 lignes en flux normal */
  #top-header,
  #main-header{
    position: relative !important;
    top: auto !important;
    transform: none !important;
  }

  /* 2) Neutralise la règle Divi admin-bar qui décale le main header */
  body.admin-bar.et_fixed_nav.et_secondary_nav_only_menu #main-header{
    top: auto !important; /* IMPORTANT: pas 0, mais auto */
  }

  /* 3) Si Divi ajoute un padding-top global, on l'annule en mobile */
  body.et_fixed_nav #page-container,
  body.et_secondary_nav_enabled #page-container,
  body.et_fixed_nav.et_secondary_nav_enabled #page-container{
    padding-top: 0 !important;
  }


/* logo à gauche, burger en haut à droite */
  #main-header .container {
    display: flex !important;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    align-items: center !important;
    justify-content: space-between !important;
    padding-top: 0;
  }

/* évite que la nav prenne toute la largeur et passe sous le logo */
  #et-top-navigation {
    width: auto !important;
    padding-left: 0 !important;
    float: none !important;
  }

  #baseline-mobile {
  display: block;
  font-size: 12px;
  padding-left: 8px;
}
}

/* Sur Desktop  */

  @media all and (min-width: 980px) {
    /* Cacher btn rdv pour mobile  */
  .btn-orange.mobile { display: none !important;} 
  .btn-vert.mobile { display: none !important;} 
  .btn-bleu.mobile { display: none !important;}
}


/*
LOGO
*/

#baseline {
  position: absolute;
  left: 38px;
  top: 19px;
}


.et_header_style_left .logo_container {
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
  }

@media screen and (min-width:980px) {
  #baseline-mobile { display: none;}
  .et_header_style_left .logo_container {
    position: absolute;
    margin-top: 0;
  }
}

@media all and (max-width: 1200px) {
.et_header_style_left #logo {
  height: 55% !important;
}
}

/*
MENU TOP
*/
/*add icon to Divi main menu items*/

#top-header .container { 
  width: 100%;
  max-width: 100%;
  padding-right: 32px;
  padding-left: 30px;
  font-weight: normal !important;
  padding-top: 5px;
}

.et-secondary-menu li a {
	color: #001144;
	padding: 6px 10px 8px;
}

.devis { margin-left: 10px;}

#top-header li > a:before, .icon-tel:before, .icon-map:before {
    font-family: 'ETMODULES';
    text-align: center;
    vertical-align: middle;
    margin-right: 5px;
    margin-left: -10px;
    color: #001144;
    font-size: 1.2em;
    transition: all .3s ease;
}
.icon-tel:before, .icon-map:before { color: #FFF;}

li.devis > a:before {
   content: '\e058';
}
li.tel > a:before, .icon-tel:before {
   content: '\e090';
}
.icon-map:before {
   content: '\e081';
}

li.btn-orange {
  margin-top: 2px;
}
li.btn-orange a {
  background-color: #f47521;
  border-radius: 50px;
  color: #FFF !important;
  font-weight: 700;
  padding: 12px 12px 12px 15px;
}
li.btn-orange a:hover {
 background-color: #001144;
 opacity: 1 !important;
}

li.btn-bleu a {
  background-color: #3599ce;
  border-radius: 50px;
  color: #FFF !important;
  font-weight: 700;
  padding: 12px 12px 10px 12px;
}
li.btn-bleu a:hover {
 background-color: #001144;
 opacity: 1 !important;
}

.btn-bleu a img{
vertical-align: bottom;
margin-left: 5px;
}
/* Sélecteur de langue discret */
#et-secondary-nav > li.lang-item {
  margin-left: 10px !important;
  margin-right: 0 !important;
}

#et-secondary-nav > li.lang-item > a {
  display: inline-block;
  padding: 3px 0 !important;
  border: 0;
  border-bottom: 1px solid transparent;
  background: transparent !important;
  color: #001144 !important;
  line-height: 1.4;
  opacity: 1 !important;
}

/* Langue active */
#et-secondary-nav > li.lang-item.current-lang > a {
  color: #3599ce !important;
  font-weight: 600;
}

/* Survol et navigation au clavier */
#et-secondary-nav > li.lang-item > a:hover {
  color: #001144 !important;
  border-bottom-color: #001144;
}

#et-secondary-nav > li.lang-item > a:focus-visible {
  outline: 1px solid #001144;
  outline-offset: 4px;
}

/* Trait vertical entre les deux langues */
#et-secondary-nav > li.lang-item + li.lang-item {
  position: relative;
  margin-left: 5px !important;
  padding-left: 7px !important;
}

#et-secondary-nav > li.lang-item + li.lang-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 12px;
  width: 1px;
  background: rgba(0, 53, 148, .25);
}

/* Masquer les langues dans le menu déroulant mobile */
.et_mobile_menu .lang-item,
.et_mobile_menu .pll-parent-menu-item,
.et_mobile_menu .polylang-item {
  display: none !important;
}

/* Cacher les menu devis ou tel ou langue dans le menu mobile principal */
#mobile_menu .btn-orange, #mobile_menu .tel, #mobile_menu .devis, #mobile_menu .pll-parent-menu-item { display: none;}
#mobile_menu .btn-vert, #mobile_menu .tel, #mobile_menu .devis, #mobile_menu .pll-parent-menu-item { display: none;}
#mobile_menu .btn-bleu { display: none;}

/*
MENU principal
*/
@media all and (min-width: 980px) {
.et_header_style_left #et-top-navigation {
  padding-top: 50px;
}

.et_header_style_left #et-top-navigation nav>ul>li>a {
  padding-bottom: 15px !important;
}
#menu-principal a { padding-bottom: 15px;}
#menu-principal a:hover, #top-menu-nav>ul>li>a:hover { opacity: 1;}

}
#menu-principal .sub-menu {
  top: calc(100% - 3px);
}

/*
Langue
*/
.et_header_style_left #et-top-navigation nav>ul>li.pll-parent-menu-item a { padding-bottom: 0 !important;}
.pll-parent-menu-item ul.sub-menu { width: 60px !important; }
#top-menu li.pll-parent-menu-item a { padding-left: 15px; border-left: 1px solid;}
#top-menu li.button-underline.last { padding-right: 12px;}
#top-menu li.pll-parent-menu-item ul.sub-menu a { padding: 0; border: 0;}

@media screen and (min-width:980px) {
/*
surlignement bouton de gauche à droite
*/
.button-underline {
  position: relative;
  display: inline-block;
  text-decoration: none;
}
.button-underline::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0%;
  height: 3px;
  background-color: #001144; /* ta couleur bleu */
  transition: width 0.3s ease;
}
.button-underline:hover::after {
  width: 100%;
}
}

/*
MEGA MENU
*/
.et_fullwidth_nav #top-menu li.mega-menu>ul {
  display: flex;
  right: 0 !important;
  left: 0 !important;
  padding: 40px;
}

#top-menu li.mega-menu ul li { float: none !important;}
#top-menu li.mega-menu li a { padding: 0; line-height: 1.4em;}
@media all and (min-width: 1400px) {  #top-menu li.mega-menu li a { line-height: 1.5em;}}
.subtitle a { color: #3599ce !important; }
.subtitle a:before { 
  font-family: 'ETmodules';
  content: "'";
  font-size: 15px;
  color: #3599ce;
  margin-right: 10px;
}
li.mega-menu .sub-menu .subtitle a:hover { color: #001144 !important; cursor: default }

@media all and (min-width: 981px) {  
  #top-menu li.mega-menu>ul>li {
  float: none;
  border-right: 1px solid;
  padding-left: 30px !important;
  }
  #top-menu li.mega-menu>ul>li:last-child {
    border-right:0;
  }
  #top-menu li.mega-menu>ul>li:nth-of-type(1) {
    width: 50%;
    padding-left: 0 !important;
  }

  #top-menu li.mega-menu>ul>li:nth-of-type(1) ul {
    column-count: 2;
  }
  li.break {
      break-before: column;
  }

  #top-menu li.mega-menu>ul>li:nth-of-type(2), #top-menu li.mega-menu>ul>li:nth-of-type(3) {
    width: 25%;
  }
  #top-menu li.mega-menu .sub-menu .title>a {
    font-size: 17px !important;
    color: #3599ce !important;
    padding: 0;
    border: 0 !important;
  }

  .subtitle a { font-size: 15px !important; font-weight: 600 !important; margin-top: 20px; }
  li.mega-menu .sub-menu a { font-size: 14px; font-weight: 300;}
  li.mega-menu .sub-menu a:hover { color: #3599ce !important; opacity: 1;}
  .subtitle a { color: #001144 !important; }
  .subtitle a:before { color: #001144;
 }

}



/*
CONTENT
*/


@media (max-width:479px) {
  .mob-2 .et_pb_column { width: 50% !important;}
  .et_pb_blurb_position_left .et_pb_main_blurb_image, .et_pb_blurb_position_left .et_pb_blurb_container { display: block;}
  .et_pb_main_blurb_image { margin-bottom: 20px !important;}
}

h1 { padding-bottom: 20px; font-size: 50px !important;}
h1.et_pb_module_header { padding-bottom: 0; }
@media (max-width: 767px) { 
  h1 { font-size: 40px !important;}
  h1.et_pb_module_header {line-height: 1.1em !important;}
}

#main-content h2 { 
  font-size: 45px;
  color: #3599CE;
  font-weight: 300;
  margin-bottom: 20px;
  margin-top: 20px;
}
#main-content .interventions h2 {
  font-size: 22px;
  color: #3599ce;
  font-weight: 600;
}
#main-content h3 {
  font-size: 23px !important;
  color: #3599ce !important;
  font-weight: 600 !important;
  margin-top: 20px;
  line-height: 30px;
}
#main-content .interventions h3 {
  font-size: 20px !important;
  color: #001144 !important;
  font-weight: 300 !important;
  margin-top: 0px;
  line-height: 20px;
}
.et_pb_fullwidth_header_0.et_pb_fullwidth_header .et_pb_header_content_wrapper {
	margin-top: 50px;
}
.entry-content p a, .et_pb_text_inner a {
	border-bottom: 1px dotted;
  font-weight: normal;
}
.entry-content p a:hover, .et_pb_text_inner a:hover {
  color: #3599CE;
}
.wp-block-heading { font-size: 13px;}
.copyrights p, .copyrights a {color: rgba(255,255,255,0.31)!important;}
.interventions a { font-weight: 300 !important; border-bottom: 0 !important;}
.interventions a:hover { color: #3599CE; border-bottom: 1px dotted #3599CE !important;}
footer { font-size: 14px; line-height: 22px;}
.menu-footer a { color: #FFF;}
.menu-footer a:hover { color: #3599CE; border-bottom: 1px dotted}

.et_pb_main_blurb_image { width: 20px; padding-top: 5px;}

.footer-devis a { color: #FFF; border-bottom: 1px dotted;}
.footer-devis a:hover { color: #3599ce; border-bottom: 1px solid;}

.et_pb_blurb_content { width: 100%; max-width: 100% !important;}
@media only screen and (max-width:980px) {
  body #page-container .et_pb_section .et_pb_fullwidth_header_0 .et_pb_button_two.et_pb_button {
    background-color: #3599ce !important;
  }
  body #page-container .et_pb_section .et_pb_fullwidth_header_0 .et_pb_button_two.et_pb_button:hover {
    background-color: #001144 !important;
  }
}

.et_pb_accordion .et_pb_toggle { margin-bottom: 0 !important; border: 0; border-bottom: 1px solid #FFF;}
.et_pb_accordion .et_pb_toggle:hover {background-color: #C5DFF8;}
.et_pb_toggle_open, .et_pb_toggle_close { padding: 0 20px;}
.et_pb_toggle h4.et_pb_toggle_title { padding: 20px 20px 20px 10px !important;}
.faqs.et_pb_accordion .et_pb_toggle:hover h4.et_pb_toggle_title {color:#001144 !important;}
.faqs.et_pb_accordion .et_pb_toggle { margin-bottom: 10px !important;}
.et_pb_accordion .et_pb_toggle_content { padding-top: 15px !important;}



  /* Fil d'Ariane*/
.et_pb_text_0 .wp-block-heading a[href="https://www.new.philippeletertre.com/"] {
  font-size: 20px;
  border-bottom: none;
}

/*
fleche home
*/

.et_pb_fullwidth_header .et_pb_fullwidth_header_scroll {
  padding-bottom: 30px !important;
}
.scroll-down {
  animation: bounce-arrow 1.7s ease-in-out infinite;
}

/* Animation de haut en bas */
@keyframes bounce-arrow {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(8px); /* descend */
  }
  100% {
    transform: translateY(0);   /* remonte */
  }
}
/*
OVERLAY HOME
*/

@media all and (min-width: 981px) {   
  .et-fb-root-ancestor .et-overlay-item {
    opacity: 1; /*shows hidden overlay items when using the visual Divi Builder*/
  }
  .et-overlay-item {
    opacity: 0; /*hides overlay items by default*/
    margin-bottom: 0px;
  }
  .et-overlay-item,.et-overlay-title, .et-overlay-image {
    transition: all 400ms !important; /*sets transition speed of all overlay items*/
  }
  .et-overlay-container:hover .et-overlay-item {
    opacity: 1; /*reveals hidden overlay items on hover*/
  }
  .et-overlay-container:hover .et-overlay-image {
    /*add new styles here to change image on hover*/
  }
  .et-overlay-container:hover .et-overlay-image.et-scale {
    transform: scale(1.2); /*adjust scale of image here*/
  }
  .et-overlay-container:hover .et-overlay-image.et-rotate {
    transform: scale(1.4)
    rotateZ(10deg)!important; /*adjust rotation of image and scale needed for rotation here*/
  } 
  
	.et-overlay-container:hover .et-overlay-title.move-up {
	opacity: 0;
  }
  .et-overlay-container:hover .et-overlay-item.move-up {
    margin-bottom: 20px !important; /*adjust how far you want the overlay item to move up*/
  }
  .et-overlay-container:hover .et-overlay-item.move-down {
    margin-top: 10%; /*adjust how far you want the overlay item to move down*/
  }
 
}

/*Références*/
@media all and (min-width: 981px) {
  #references h2 { writing-mode: vertical-lr;transform: rotate(180deg);}  
  #references .et_pb_column:first-of-type { width: 6%;}
  #references .et_pb_column { width: 52%;}
  #references .et_pb_column:last-of-type { width:30%;}
}

/*pullquotes css content: "\201C";*/
 
/*Pull quote text styling*/
blockquote {
  font-size: 18px;
  letter-spacing: 1px;
  position: relative;
  border-left: none;
  padding-top: 10px;
  padding-left: 0;
  margin-top: 40px;
}
 
blockquote:before {
  content: "-";
  font-size: 20px;
  position: absolute;
  top: -30px;
  left: -2px;
  color: #64b2d6;
  font-family: Andale Mono;
}
 
/* Slider touch on mobile */ 
@media (max-width: 767px){
  .swipe-gallery .et_pb_gallery,
  .swipe-gallery .et_pb_gallery_items{
    touch-action: pan-y;
    -webkit-user-select: none;
    user-select: none;
  }

  /* au cas où Divi met un overlay qui bouffe le touch */
  .swipe-gallery .et_pb_gallery_items,
  .swipe-gallery .et_pb_gallery_item{
    pointer-events: auto;
  }
}
/* Spécifique à ta galerie swipe */
.swipe-gallery .et-pb-controllers {
    position: relative !important;
    bottom: auto !important;
    margin-top: 15px;
    text-align: center;
}

/* Form Devis */
.et_pb_contact_form .et_pb_contact_field_options_title {
  margin-left: 30px !important;
}
.et_pb_contact .et_pb_contact_field .et_contact_error,
.et_pb_contact .et_pb_contact_form .et_pb_contact_field.et_contact_error .et_pb_contact_field_radio_title, 
.et_pb_contact .et_pb_contact_form .et_pb_contact_field.et_contact_error .et_pb_contact_field_radio label, 
.et_pb_contact .et_pb_contact_form .et_pb_contact_field.et_contact_error input[type=checkbox]+label, 
.et_pb_contact .et_pb_contact_form .et_pb_contact_field.et_contact_error input[type=radio]+label, 
.et_pb_contact .et_pb_contact_form p.et_contact_error .et_pb_contact_field_radio_title, 
.et_pb_contact .et_pb_contact_form p.et_contact_error .et_pb_contact_field_radio label, 
.et_pb_contact .et_pb_contact_form p.et_contact_error input[type=checkbox]+label,
.et_pb_contact .et_pb_contact_form .et_pb_contact_field.et_contact_error input[type=checkbox]+label i, 
.et_pb_contact .et_pb_contact_form .et_pb_contact_field.et_contact_error input[type=radio]+label i {
  border-color: #a60ca9 !important;
  color: #a60ca9 !important;
}

body .et_pb_button.et_pb_contact_submit { background-color: #001144 !important; }

@media (max-width: 980px) {
  #et_pb_contact_form_form-devis-fr .et_contact_bottom_container {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 20px !important;
    width: 100% !important;
    margin: 20px 0 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
  }

  #et_pb_contact_form_form-devis-fr .et_pb_contact_right {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    position: static !important;
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    text-align: center !important;
  }

  #et_pb_contact_form_form-devis-fr .et_pb_button_wrapper {
    grid-column: 1 !important;
    grid-row: 2 !important;
    justify-self: stretch !important;
    position: static !important;
    inset: auto !important;
    transform: none !important;
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #et_pb_contact_form_form-devis-fr .et_pb_contact_submit {
    position: static !important;
    float: none !important;
    transform: none !important;
    margin: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
    white-space: normal !important;
  }
}

/* Table Tarifs */
.tarifs table {
  background-color: #FFF;
  border: none !important;
}
.tarifs tr.table-title {
  background-color: #001144;
  color: #FFF !important;
}
tr:nth-child(2n), tr:nth-child(2n) a { color: #3599CE;}
.tarifs tr td {
  border: 0;
  border-color: #FFF;
}
.tarifs tr td:first-child {
  width: 60%;
}
.tarifs tr.last {
  margin-bottom: 10px;
}
.tarifs tr td a { border-bottom: 1px dotted;}
@media all and (max-width: 981px) { 
  .tarifs tr td:first-child, .tarifs td { display: block; width: 100%;}
  .entry-content tr { border-bottom: 1px solid #001144;}
}

/* Page Avant-apres */

.et_pb_filterable_portfolio .et_pb_portfolio_filters li a {
  border: 1px solid #c5dff8;
}

.et_pb_filterable_portfolio .et_pb_portfolio_filters li a:hover, .et_pb_filterable_portfolio .et_pb_portfolio_filters li a.active {
  background-color: #e8f2fd;
}

.et_pb_portfolio_filters a::before{
    content:"";
    display:block;
    width:70px;
    height:70px;
    margin:0 auto 10px;
    background-size:cover;
    background-position:center;
    border-radius:50%;
}
.et_pb_portfolio_filters a[data-category-slug="all"]::before{background-image:url("/wp-content/uploads/2026/09/icon-all-1.png");}
.et_pb_portfolio_filters a[data-category-slug="poitrine"]::before{background-image:url("/wp-content/uploads/2026/09/icon-seins.png");}
.et_pb_portfolio_filters a[data-category-slug="rhinoplastie"]::before{background-image:url("/wp-content/uploads/2026/09/icon-nez.png");}
.et_pb_portfolio_filters a[data-category-slug="plastie-abdominale"]::before{background-image:url("/wp-content/uploads/2026/09/icon-ventre.png");}
.et_pb_portfolio_filters a[data-category-slug="fesses"]::before{background-image:url("/wp-content/uploads/2026/09/icon-fesses.png");}
.et_pb_portfolio_filters a[data-category-slug="liposuccion"]::before{background-image:url("/wp-content/uploads/2026/09/icon-liposuccion.png");}
.et_pb_portfolio_filters a[data-category-slug="paupieres"]::before{background-image:url("/wp-content/uploads/2026/09/icon-paupieres.png");}
.et_pb_portfolio_filters a[data-category-slug="greffe"]::before{background-image:url("/wp-content/uploads/2026/09/icon-greffes.png");}
.et_pb_portfolio_filters a[data-category-slug="lifting"]::before{background-image:url("/wp-content/uploads/2026/09/icon-lifting.png");}

.et_pb_portfolio_filters a[data-category-slug="all"]::before{background-image:url("/wp-content/uploads/2026/09/icon-all-1.png");}
.et_pb_portfolio_filters a[data-category-slug="breasts"]::before{background-image:url("/wp-content/uploads/2026/09/icon-seins.png");}
.et_pb_portfolio_filters a[data-category-slug="rhinoplasty"]::before{background-image:url("/wp-content/uploads/2026/09/icon-nez.png");}
.et_pb_portfolio_filters a[data-category-slug="abdominoplasty"]::before{background-image:url("/wp-content/uploads/2026/09/icon-ventre.png");}
.et_pb_portfolio_filters a[data-category-slug="buttock"]::before{background-image:url("/wp-content/uploads/2026/09/icon-fesses.png");}
.et_pb_portfolio_filters a[data-category-slug="liposuction"]::before{background-image:url("/wp-content/uploads/2026/09/icon-liposuccion.png");}
.et_pb_portfolio_filters a[data-category-slug="blepharoplasty"]::before{background-image:url("/wp-content/uploads/2026/09/icon-paupieres.png");}
.et_pb_portfolio_filters a[data-category-slug="hair-transplant"]::before{background-image:url("/wp-content/uploads/2026/09/icon-greffes.png");}
.et_pb_portfolio_filters a[data-category-slug="lift"]::before{background-image:url("/wp-content/uploads/2026/09/icon-lifting.png");}

.et_pb_filterable_portfolio .et_pb_portofolio_pagination ul li a { color: #001144;}
.et_pb_filterable_portfolio .et_pb_portofolio_pagination ul li a.active { color: #3599ce !important; border-bottom: 1px dashed;}
/* =====================================================
   FILTRE AVANT / APRÈS
   Menu Divi sur ordinateur
   Menu déroulant sur mobile
===================================================== */


/* ---------- MENU DÉROULANT : BASE ---------- */

/* Caché par défaut sur ordinateur et tablette */
.portfolio-avant-apres .portfolio-mobile-select {
  display: none;
}


/* ---------- VERSION MOBILE ---------- */

@media only screen and (max-width: 767px) {

  /* Masquer le menu de filtres Divi d’origine */
  .portfolio-avant-apres
  .et_pb_portfolio_filters
  > ul.clearfix {
    display: none !important;
  }

  /* Conteneur du menu */
  .portfolio-avant-apres
  .et_pb_portfolio_filters {
    display: block !important;
    width: 100%;
    margin: 0 0 30px;
  }

  /* Menu déroulant */
  .portfolio-avant-apres
  .portfolio-mobile-select {
    display: block !important;

    width: 100%;
    height: 54px;
    margin: 0;
    padding: 0 50px 0 18px;

    color: #091536;
    background-color: #ffffff;

    border: 1px solid #d8dce3;
    border-radius: 8px;

    font-family: inherit;
    font-size: 16px;
    font-weight: 500;
    line-height: 54px;

    cursor: pointer;

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    /* Flèche personnalisée */
    background-image:
      linear-gradient(45deg, transparent 50%, #003594 50%),
      linear-gradient(135deg, #003594 50%, transparent 50%);

    background-position:
      calc(100% - 21px) 23px,
      calc(100% - 15px) 23px;

    background-size: 6px 6px;
    background-repeat: no-repeat;

    box-sizing: border-box;
  }

  /* État au toucher ou au focus */
  .portfolio-avant-apres
  .portfolio-mobile-select:focus {
    border-color: #003594;
    outline: 2px solid rgba(0, 53, 148, 0.12);
    outline-offset: 2px;
  }
}

/* =====================================================
   GALERIE AVANT / APRÈS
===================================================== */

.et_pb_portfolio_item { margin-bottom: 30px;}

/* Le projet indique clairement qu’il peut être agrandi */
.portfolio-avant-apres .et_pb_portfolio_item a {
  display: block;
  cursor: zoom-in;
}


/* Afficher le nom de l’intervention sous l’image */
.portfolio-avant-apres .et_pb_portfolio_item a::after {
  content: attr(title);

  display: block;
  padding: 12px 5px 5px;

  color: #091536;

  font-size: 16px;
  font-weight: 500;
  line-height: 1.35;
  text-align: center;
}


/* Remplacer visuellement le + par une loupe */
.portfolio-avant-apres .et_overlay::before {
  content: "\55" !important;

  font-family: "ETmodules" !important;
  font-size: 30px !important;

  color: #ffffff !important;
}


/* =====================================================
   GRILLE MOBILE EN DEUX COLONNES
===================================================== */

@media only screen and (max-width: 767px) {

  .portfolio-avant-apres .et_pb_portfolio_items {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 12px;
  }

  .portfolio-avant-apres .et_pb_portfolio_item {
    width: 100% !important;
    margin: 0 !important;
  }

  .portfolio-avant-apres .et_pb_portfolio_item a::after {
    padding: 9px 2px 0;

    font-size: 14px;
    line-height: 1.3;
  }

  .portfolio-avant-apres .et_portfolio_image img {
    display: block;
    width: 100%;
    height: auto;
  }
}


/* =====================================================
   LIGHTBOX
===================================================== */


/* Empêcher la page de défiler derrière */
body.portfolio-lightbox-open {
  overflow: hidden;
}


/* Fond général */
.portfolio-lightbox {
  position: fixed;
  z-index: 999999;
  inset: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 60px 90px 35px;

  background: rgba(5, 12, 28, 0.95);

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transition:
    opacity 0.25s ease,
    visibility 0.25s ease;
}


/* Lightbox ouverte */
.portfolio-lightbox.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}


/* Contenu central */
.portfolio-lightbox-content {
  position: relative;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  width: 100%;
  height: 100%;
}


/* Image */
.portfolio-lightbox-image {
  display: block;

  width: auto;
  height: auto;

  max-width: 100%;
  max-height: calc(100vh - 155px);

  object-fit: contain;

  border-radius: 4px;
  box-shadow: 0 15px 50px rgba(0, 0, 0, 0.35);

  opacity: 0;
  transform: scale(0.97);

  transition:
    opacity 0.2s ease,
    transform 0.25s ease;
}


/* Image chargée */
.portfolio-lightbox-image.is-loaded {
  opacity: 1;
  transform: scale(1);
}


/* Informations sous l’image */
.portfolio-lightbox-information {
  min-height: 60px;
  padding-top: 15px;

  color: #ffffff;
  text-align: center;
}


.portfolio-lightbox-title {
  font-size: 17px;
  font-weight: 500;
  line-height: 1.35;
}


.portfolio-lightbox-counter {
  margin-top: 4px;

  color: rgba(255, 255, 255, 0.7);

  font-size: 13px;
  letter-spacing: 0.05em;
}


/* =====================================================
   FLÈCHES
===================================================== */

.portfolio-lightbox-arrow {
  position: absolute;
  z-index: 3;
  top: 50%;

  display: flex;
  justify-content: center;

  width: 52px;
  height: 52px;
  padding: 0;

  color: #ffffff;
  background: rgba(255, 255, 255, 0.1);

  border: 0;
  border-radius: 50%;

  font-family: Arial, sans-serif;
  font-size: 45px;
  font-weight: 200;
  line-height: 1;

  cursor: pointer;

  transform: translateY(-50%);

  transition:
    background-color 0.2s ease,
    transform 0.2s ease;
}


.portfolio-lightbox-arrow:hover {
  background: rgba(255, 255, 255, 0.2);
}


.portfolio-lightbox-prev {
  left: 22px;
}


.portfolio-lightbox-next {
  right: 22px;
}


.portfolio-lightbox-arrow[hidden] {
  display: none;
}


/* =====================================================
   BOUTON FERMER
===================================================== */

.portfolio-lightbox-close {
  position: absolute;
  z-index: 4;
  top: 14px;
  right: 18px;

  display: flex;
  align-items: center;
  justify-content: center;

  width: 46px;
  height: 46px;
  padding: 0;

  color: #ffffff;
  background: transparent;

  border: 0;

  font-family: Arial, sans-serif;
  font-size: 42px;
  font-weight: 200;
  line-height: 1;

  cursor: pointer;

  transition:
    opacity 0.2s ease,
    transform 0.2s ease;
}


.portfolio-lightbox-close:hover {
  opacity: 0.7;
  transform: scale(1.08);
}


/* =====================================================
   CHARGEMENT
===================================================== */

.portfolio-lightbox-loader {
  position: absolute;
  top: 50%;
  left: 50%;

  display: none;

  width: 34px;
  height: 34px;

  border: 3px solid rgba(255, 255, 255, 0.25);
  border-top-color: #ffffff;
  border-radius: 50%;

  transform: translate(-50%, -50%);

  animation: portfolio-loader 0.8s linear infinite;
}


.portfolio-lightbox-loader.is-visible {
  display: block;
}


@keyframes portfolio-loader {

  from {
    transform: translate(-50%, -50%) rotate(0deg);
  }

  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }

}


/* =====================================================
   LIGHTBOX MOBILE
===================================================== */

@media only screen and (max-width: 767px) {

  .portfolio-lightbox {
    padding: 58px 12px 20px;
  }

  .portfolio-lightbox-image {
    max-width: 100%;
    max-height: calc(100vh - 145px);

    border-radius: 2px;
  }

  /*
   * Les flèches sont discrètes sur mobile,
   * car le swipe est prioritaire.
   */
  .portfolio-lightbox-arrow {
    top: 50%;

    width: 40px;
    height: 48px;

    background: rgba(5, 12, 28, 0.5);
    border: 0;
    border-radius: 3px;
    align-items: center;
    font-size: 36px;
  }

  .portfolio-lightbox-prev {
    left: 4px;
  }

  .portfolio-lightbox-next {
    right: 4px;
  }

  .portfolio-lightbox-close {
    top: 6px;
    right: 6px;
  }

  .portfolio-lightbox-information {
    min-height: 55px;
    padding-top: 12px;
  }

  .portfolio-lightbox-title {
    font-size: 15px;
  }

  .portfolio-lightbox-counter {
    font-size: 12px;
  }
}