/*
 Theme Name: Divi Child
 Description: Thème enfant Divi
 Author: 110bl
 Template: Divi
 Version: 1.0.0
*/


/* =========================================================================================
 * GLOBAL
 * ========================================================================================= */

 /* ---------------------------------------------------------
* Couleurs
* --------------------------------------------------------- */

:root {
  --primary: #E5C288;
  --darkprimary: #ceaf7a;
  --darkcolor: #363636;
  --lightcolor: #FFFFFF;

}
/* ---------------------------------------------------------
* Fonts
* --------------------------------------------------------- */
/* Jomolhari */
@font-face{
  font-family: "Jomolhari";
  src: url("./fonts/Jomolhari-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Source Sans Pro */
@font-face{
  font-family: "Source Sans Pro";
  src: url("./fonts/SourceSans3-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face{
  font-family: "Source Sans Pro";
  src: url("./fonts/SourceSans3-Italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face{
  font-family: "Source Sans Pro";
  src: url("./fonts/SourceSans3-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "Source Sans Pro";
  src: url("./fonts/SourceSans3-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}


/* ---------------------------------------------------------
* Titres
* --------------------------------------------------------- */



body h2,
.et_pb_module_header {
  font-family: "Jomolhari", serif;
  font-weight: 400;
  font-size: 70px;
  line-height: 1.2;
  margin: 0 0 0.2em;
}

body h3 {
  font-family: "Source Sans Pro", Arial, sans-serif !important;
  font-weight: 600 !important;
  font-size: 20px !important;
  letter-spacing: 0.11em !important;
  color: var(--primary) !important;
  line-height: 1.3 !important;
  text-transform: uppercase !important;
}


body h4 {
  font-family: "Source Sans Pro", Arial, sans-serif !important;
  font-weight: 600 !important;
  font-size: 20px !important;
  line-height: 1.2 !important;
}


@media (max-width: 980px) {

  body h2,
  .et_pb_module_header {
    font-size: 48px;
    line-height: 1.2;
  }
}

@media (max-width: 767px) {

  body h2,
  .et_pb_module_header {
    font-size: 33px;
    line-height: 1.1 !important;
  }

  body h3 {
    font-size: 16px !important;
  }

  body h4 {
    font-size: 18px !important;
  }
}

/* ---------------------------------------------------------
* Alignements, overlays, ...
* --------------------------------------------------------- */

/* Overlay sur les images */
.overlay-pic {
  position: relative;
}

.overlay-pic::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(10, 10, 10, 0.4);
  z-index: 1;
  pointer-events: none;
}

.overlay-pic .et_pb_row {
  position: relative;
  z-index: 10;
}


/* Alignement vertical centré dans une row */
.vertical-center {
  display: flex;
  align-items: center;
}

@media (max-width: 980px) {
  .vertical-center {
    display: block;
  }
}


/* =========================================================================================
 * END GLOBAL
 * ========================================================================================= */



/* =========================================================================================
 * MENU
 * ========================================================================================= */

/* ---------------------------------------------------------
* Style du menu principal
* --------------------------------------------------------- */
/* Desktop */
#top-menu>li>a {
  font-weight: 600 !important;
  /* semi-bold */
}

#top-menu>li>a:hover {
  color: black;
  /* semi-bold */
}

/* Item actif et survol */
#top-menu>li.current-menu-item>a,
#top-menu>li>a:hover {
  font-weight: 600 !important;
}



/* ---------------------------------------------------------
* Bouton Contactez-moi!
* --------------------------------------------------------- */

/* Aligner le logo*/
span.logo_helper {
  margin-top: 15px;
}

/* Neutraliser les espacements Divi autour du dernier item */
#main-header #et-top-navigation nav>ul#top-menu>li:last-child {
  padding-right: 0 !important;
  margin-right: 0 !important;
}

/* Divi réserve souvent de la place à droite du menu ; si tu n'as pas d'icône recherche/panier,
   on supprime ce padding pour éviter le "vide" visuel */
#main-header #et-top-navigation {
  padding-right: 0 !important;
}

/* Transformer le dernier lien en vrai bouton et CENTRER le texte */
#main-header #top-menu>li:last-child>a {
  display: inline-flex;
  /* centre le contenu */
  align-items: center;
  justify-content: center;
  padding: .80em 1.05em;
  /* padding symétrique */
  margin-left: 0px;
  /* espace avec l'item précédent */
  background: var(--primary);
  color: var(--lightcolor) !important;
  border: 1px solid var(--primary);
  line-height: 1;
  /* évite les décalages verticaux */
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  transition: filter .2s ease, background-color .2s ease, color .2s ease;
}

#top-menu>li:last-child>a:hover,
#top-menu>li:last-child>a:focus {
  color: var(--primary) !important;
  border: 1px solid var(--primary);
}

/* quand le header se compresse (si Fixed Navigation) */
#main-header.et-fixed-header #top-menu>li:last-child>a {
  padding: .55em 1em;
}



/* ---------------------------------------------------------
* Menu mobile
* --------------------------------------------------------- */
/* Couleur de l’icône hamburger (header par défaut) 
.mobile_menu_bar:before { color: #363636; }*/

/* Fond du panneau mobile
.et_mobile_menu { background: #ffffff; }*/

/* Couleur des liens du menu mobile
.et_mobile_menu li a { color: #111111; } */

/* État hover/actif 
.et_mobile_menu li a:hover { color: #4a6cf7; }
.et_mobile_menu .menu-item-has-children > a { border-bottom-color: rgba(0,0,0,0.08); }*/

/* Menu mobile (burger) */
.et_mobile_menu li a {
  font-weight: 600 !important;
  text-transform: uppercase;
  color: var(--darkcolor) !important;
}

/* Mobile : #main-header fixé en haut quand on lui ajoute .is-fixed */
@media (max-width:980px) {
  #main-header.is-fixed {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10010;
    background: #fff;
    /* fond opaque pour le défilement */
  }

  /* on réserve la place seulement via la variable --mh */
  #page-container {
    padding-top: var(--mh, 0px);
  }

  /* ne pas cacher ce qui dépasse (sinon le header peut se retrouver dessous) */
  #page-container {
    overflow: visible;
  }
}

/* petite ombre quand on a scrolé */
@media (max-width:980px) {
  .is-stuck #main-header {
    box-shadow: 0 10px 24px -12px rgba(0, 0, 0, .18);
  }

  span.logo_helper {
    margin-top: 5px;
  }
}

/* Mobile (menu burger) : dernier item → bouton plein large */
.et_mobile_menu li:last-child>a {
  display: block;
  margin: 8px 14px;
  padding: .7em 1em;
  background: var(--primary, #dcbc86);
  color: #fff !important;
  border: 1px solid var(--primary, #dcbc86);
  text-align: center;
  font-weight: 600;
}

.et_mobile_menu li:last-child>a:hover,
.et_mobile_menu li:last-child>a:focus {
  filter: brightness(.92);
}




/* =========================================================================================
 * END MENU
 * ========================================================================================= */


/* =========================================================================================
 * FOOTER
 * ========================================================================================= */

.footer-presentation {
  width: 35% !important;
}

.footer-instagram {
  width: 25% !important;
}

.footer-presta,
.footer-knmore {
  width: 15% !important;
}

@media (max-width:980px) {

  .footer-presentation,
  .footer-instagram,
  .footer-presta,
  .footer-knmore {
    width: 100% !important;
  }
}

/* items Instagram (icône + textes)*/
.footer-ig .ig-item {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 10px 0 30px 0;
  text-decoration: none;
}

.footer-ig .ig-icon {
  /*width:36px; height:36px;*/
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
}

.footer-ig .ig-icon svg {
  width: 36px;
  height: 36px;
  display: block;
}

.footer-ig .ig-title {
  color: var(--lightcolor);
  font-size: 18px;
  line-height: 1.1em;
}

.footer-ig .ig-sub {
  color: var(--primary);
  font-size: 14px;
}

@media (max-width:980px) {
  .footer-ig {
    display: flex;
    flex-direction: column;
    align-items: center;
    /* centre le conteneur dans la colonne */
    gap: 12px;
    /* surtout PAS de text-align:center ici */
    text-align: initial;
    margin-left: 20%;
  }

  .footer-ig .ig-item {
    width: 100%;
    max-width: 340px;
    /* largeur fixe/limite de l’item */
    margin: 0 auto;
    /* centre l’item lui-même */
    justify-content: flex-start;
    /* contenu aligné à gauche */
    text-align: left;
    /* textes alignés à gauche */
  }
}


/* listes de liens */
.site-footer ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.site-footer a {
  color: var(--lightcolor);
  text-decoration: none;
}

.site-footer a:hover {
  color: var(--lightcolor);
  text-decoration: none;
}


/* =========================================================================================
 * END FOOTER
 * ========================================================================================= */

/* =========================================================================================
 * MODULE GALERIE
 * ========================================================================================= */

.fg-panel-area-inner {
  background-color: var(--lightcolor);
}

.fg-panel-thumbs-button,
.fg-panel-button {
  border: none;
  box-shadow: 0 10px 24px -12px rgba(0, 0, 0, .18);
  color: var(--darkcolor) !important;
}

.fg-panel-thumb,
.fg-panel-thumb-spacer {
  border: none;
}

.fg-selected {
  background-color: var(--primary) !important;
}

/* =========================================================================================
 * END MODULE GALERIE
 * ========================================================================================= */