/*
Theme Name: An Grèn Koulèr
Template: Divi
Version: 1.0
*/

/* Police perso */
@font-face{
  font-family: "Camping Holiday";
  src: url("../fonts/Camping-Holiday.otf") format("opentype");
  font-display: swap;
  font-weight: normal;
  font-style: normal;
}

/* Forcer la police sur le menu */
#top-menu li{
  font-family: "Camping Holiday" !important;
}

/* Screen larger than 600px? 2 columns */
@media (min-width: 600px){
  .col_f_1 { grid-template-columns: repeat(1, 1fr); }
  .col_f_2 { grid-template-columns: repeat(1, 1fr); }
  .col_f_3 { grid-template-columns: repeat(2, 1fr); }
  .col_f_4 { grid-template-columns: repeat(2, 1fr); }
  .col_f_5 { grid-template-columns: repeat(3, 1fr); }
  .col_f_6 { grid-template-columns: repeat(3, 1fr); }
}

/* Screen larger than 900px? 3 columns */
@media (min-width: 900px){
  .col_f_1 { grid-template-columns: repeat(1, 1fr); }
  .col_f_2 { grid-template-columns: repeat(2, 1fr); }
  .col_f_3 { grid-template-columns: repeat(3, 1fr); }
  .col_f_4 { grid-template-columns: repeat(4, 1fr); }
  .col_f_5 { grid-template-columns: repeat(5, 1fr); }
  .col_f_6 { grid-template-columns: repeat(6, 1fr); }

  .wrapper-sidebar { grid-template-columns: auto 215px; }
}

.partenaires_grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(305px, 1fr));
  width: 1200px;
  max-width: 100%;
  margin: auto;
}

.partenaires_grid .column{
  display: flex;
  flex-direction: column;
  flex: 1 1 300px;
  margin: 1em;
}

.grid_fiche{
  width: 100%;
  max-width: 1200px;
  margin: 1rem auto;
  display: grid;
  grid-gap: 1rem;
}

.mw_column{
  padding: 1rem;
  height: auto;
}

.galerie_projet li{
  display: inline-block;
  border: none;
  padding: 5px;
  margin: 0 auto;
}

.galerie_projet img{
  max-width: 300px;
  height: 100%;
  max-height: 225px;
}

.clearfix{
  /* height: 50px; */ /* REMOVED - was breaking blog grid layout */
}
/* ========================================
   TOPBAR - Réduction de la hauteur
   ======================================== */
#top-header .container {
  padding-top: 0.35em;
}

#et-info,
#et-secondary-menu > ul > li > a {
  padding-bottom: 0.35em;
}

/* ========================================
   HEADER - Correction chevauchement menu / logo
   ======================================== */

/* Z-index : logo derrière le menu */
.et_header_style_left .logo_container {
  z-index: 1;
}

#et-top-navigation {
  position: relative;
  z-index: 2;
}

/* Desktop : flexbox pour aligner logo et menu sans chevauchement */
@media (min-width: 981px) {
  .et_header_style_left #main-header .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .et_header_style_left .logo_container {
    position: relative;
    width: auto;
    height: auto;
    flex-shrink: 0;
  }

  .et_header_style_left #et-top-navigation {
    float: none;
    padding-top: 0;
    display: flex;
    align-items: center;
  }

  .et_header_style_left #et-top-navigation nav > ul > li > a {
    padding-bottom: 0;
  }
}
#top-header { padding: 0 !important; height: 28px !important; max-height: 28px !important; }
#top-header .container { height: 28px !important; line-height: 28px !important; }

/* ========================================
   CORRECTIONS RESPONSIVE MOBILE / TABLETTE
   Ajouté le 2026-03-23
   ======================================== */

/* Empêcher le débordement horizontal */
body, #page-container {
  overflow-x: hidden;
  max-width: 100%;
}

/* Annuler le margin-left: 420px sur mobile (déjà corrigé en desktop via flexbox ci-dessus) */
@media (max-width: 980px) {
  #main-header.et_header_style_left .et_menu_container {
    margin-left: 0 !important;
  }
}

/* === TOPBAR CUSTOM HEADER (Theme Builder) === */
@media (max-width: 980px) {
  /* Masquer la topbar jaune sur mobile pour gagner de la place */
  .et-db #et-boc .et_pb_section:first-of-type .et_pb_row:first-of-type {
    overflow: hidden;
    max-width: 100%;
  }

  /* Réduire la taille de police du menu custom */
  .et-db #et-boc .et_pb_menu .et_mobile_menu {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Logo dans le header custom : réduire la largeur */
  .et-db #et-boc .et_pb_image img {
    max-width: 100%;
    height: auto;
  }

  /* Header row : supprimer les marges négatives */
  .et-db #et-boc .et_pb_row {
    overflow: hidden;
  }
}

/* === PAGE DACCUEIL : chiffres et titres === AppData/ Application Data/ Contacts/ Cookies/ Desktop/ Documents/ Downloads/ Favorites/ Games/ IntelGraphicsProfiles/ Links/ Local Settings/ Local Sites/ Menu Démarrer/ Mes documents/ Modèles/ Music/ OneDrive/ Pictures/ Recent/ Saved Games/ Searches/ SendTo/ Videos/ Voisinage d'impression/ Voisinage réseau/ bolt.diy/ gtatest/ iTubeGo/ logs/

/* ========================================
   CORRECTIONS RESPONSIVE MOBILE / TABLETTE
   Ajouté le 2026-03-23
   ======================================== */

/* Empêcher le débordement horizontal */
body, #page-container {
  overflow-x: hidden;
  max-width: 100%;
}

@media (max-width: 980px) {
  /* Annuler le margin-left 420px du header standard */
  #main-header.et_header_style_left .et_menu_container {
    margin-left: 0 !important;
  }

  /* Eviter les debordements du header custom Theme Builder */
  .et-db #et-boc .et_pb_row {
    overflow: hidden;
  }

  /* Images du header : eviter le debordement */
  .et-db #et-boc .et_pb_image img {
    max-width: 100%;
    height: auto;
  }

  /* Sections : supprimer les min-height fixes (ex: 1821px) */
  .et_pb_section {
    min-height: auto !important;
  }

  /* Rows : reduire les paddings excessifs (ex: 327px) */
  .et_pb_row {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  /* Chiffres : reduire le transform scale (232%) et la taille (100px) */
  .et_pb_section .et_pb_text .et_pb_text_inner p {
    font-size: clamp(28px, 10vw, 55px) !important;
    transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4em !important;
  }

  /* Titres H1 : reduire la taille (55px, 72px) */
  .et_pb_text_inner h1 {
    font-size: clamp(22px, 6vw, 45px) !important;
    letter-spacing: normal !important;
  }
}

@media (max-width: 600px) {
  .et_pb_text_inner h1 {
    font-size: clamp(18px, 5vw, 30px) !important;
  }
}

/* ========================================
   CORRECTIONS RESPONSIVE MOBILE / TABLETTE
   Ajouté le 2026-03-23
   ======================================== */

/* Empêcher le débordement horizontal */
body, #page-container {
  overflow-x: hidden;
  max-width: 100%;
}

@media (max-width: 980px) {
  /* Annuler le margin-left 420px du header standard */
  #main-header.et_header_style_left .et_menu_container {
    margin-left: 0 !important;
  }

  /* Eviter les debordements du header custom Theme Builder */
  .et-db #et-boc .et_pb_row {
    overflow: hidden;
  }

  /* Images du header : eviter le debordement */
  .et-db #et-boc .et_pb_image img {
    max-width: 100%;
    height: auto;
  }

  /* Sections : supprimer les min-height fixes (ex: 1821px) */
  .et_pb_section {
    min-height: auto !important;
  }

  /* Rows : reduire les paddings excessifs (ex: 327px) */
  .et_pb_row {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  /* Chiffres : reduire le transform scale (232%) et la taille (100px) */
  .et_pb_section .et_pb_text .et_pb_text_inner p {
    font-size: clamp(28px, 10vw, 55px) !important;
    transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4em !important;
  }

  /* Titres H1 : reduire la taille (55px, 72px) */
  .et_pb_text_inner h1 {
    font-size: clamp(22px, 6vw, 45px) !important;
    letter-spacing: normal !important;
  }
}

@media (max-width: 600px) {
  .et_pb_text_inner h1 {
    font-size: clamp(18px, 5vw, 30px) !important;
  }
}

/* ========================================
   CORRECTIONS RESPONSIVE MOBILE / TABLETTE
   Ajouté le 2026-03-23
   ======================================== */

/* Empêcher le débordement horizontal */
body, #page-container {
  overflow-x: hidden;
  max-width: 100%;
}

@media (max-width: 980px) {
  /* Annuler le margin-left 420px du header standard */
  #main-header.et_header_style_left .et_menu_container {
    margin-left: 0 !important;
  }

  /* Eviter les debordements du header custom Theme Builder */
  .et-db #et-boc .et_pb_row {
    overflow: hidden;
  }

  /* Images du header : eviter le debordement */
  .et-db #et-boc .et_pb_image img {
    max-width: 100%;
    height: auto;
  }

  /* Sections : supprimer les min-height fixes (ex: 1821px) */
  .et_pb_section {
    min-height: auto !important;
  }

  /* Rows : reduire les paddings excessifs (ex: 327px) */
  .et_pb_row {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  /* Chiffres : reduire le transform scale (232%) et la taille (100px) */
  .et_pb_section .et_pb_text .et_pb_text_inner p {
    font-size: clamp(28px, 10vw, 55px) !important;
    transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4em !important;
  }

  /* Titres H1 : reduire la taille (55px, 72px) */
  .et_pb_text_inner h1 {
    font-size: clamp(22px, 6vw, 45px) !important;
    letter-spacing: normal !important;
  }
}

@media (max-width: 600px) {
  .et_pb_text_inner h1 {
    font-size: clamp(18px, 5vw, 30px) !important;
  }
}

@media only screen and (max-width: 980px) {
  #top-header {
    padding: 5px 0 !important;
  }
  #top-header .et_pb_row {
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
  }
  #main-header {
    margin-top: 0 !important;
  }
  .et_pb_section_0 {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}

/* ========================================
   CORRECTION CHEVAUCHEMENT GRILLE ACTUALITÉS
   (module et_pb_blog en mode grille)
   ======================================== */

/* Conteneur grille : forcer flexbox avec alignement en haut */
.et_pb_blog_grid .et_pb_blog_grid_wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 30px !important;
}

/* Chaque article : désactiver le float, taille fixe par colonne */
.et_pb_blog_grid .et_pb_blog_grid_wrapper .et_pb_post {
  float: none !important;
  width: calc(33.333% - 20px) !important;
  margin: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* Image de l'article */
.et_pb_blog_grid .entry-featured-image-url {
  display: block !important;
  overflow: hidden !important;
}

.et_pb_blog_grid .entry-featured-image-url img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

/* Tablette : 2 colonnes */
@media (max-width: 980px) {
  .et_pb_blog_grid .et_pb_blog_grid_wrapper .et_pb_post {
    width: calc(50% - 15px) !important;
  }
}

/* Mobile : 1 colonne */
@media (max-width: 600px) {
  .et_pb_blog_grid .et_pb_blog_grid_wrapper .et_pb_post {
    width: 100% !important;
  }
}

/* ========================================
   FIX CHEVAUCHEMENT ACTUALITÉS - CORRECT
   Sélecteurs réels : et_pb_blog_grid_wrapper
   ======================================== */

/* Forcer flexbox sur le wrapper pour remplacer les floats */
.et_pb_blog_grid_wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
}

/* Chaque article : supprimer le float, largeur fixe */
.et_pb_blog_grid_wrapper .et_pb_post {
  float: none !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  margin-bottom: 30px !important;
}

/* Image : hauteur uniforme pour éviter les décalages */
.et_pb_blog_grid_wrapper .entry-featured-image-url {
  display: block !important;
  overflow: hidden !important;
}

.et_pb_blog_grid_wrapper .entry-featured-image-url img {
  width: 100% !important;
  height: 200px !important;
  object-fit: cover !important;
  display: block !important;
}

/* ========================================
   PORTFOLIO GRID - REGLES FINALES
   ======================================== */

.et_pb_portfolio_grid .et_pb_portfolio_item {
  margin-bottom: 30px !important;
  border: none !important;
  outline: none !important;
}
.et_pb_portfolio_grid .et_pb_portfolio_item .et_portfolio_image img {
  width: 100% !important;
  height: 220px !important;
  object-fit: cover !important;
  display: block !important;
  border: none !important;
  outline: none !important;
  vertical-align: bottom !important;
}

.cool-timeline-wrap .cd-timeline-content {
  overflow: visible !important;
}
.cool-timeline-wrap .cd-timeline-content p {
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  transform: none !important;
  white-space: normal !important;
  word-wrap: break-word !important;
}
.cool-timeline-wrap .clt-story-title {
  writing-mode: horizontal-tb !important;
  transform: none !important;
}
