/*
Theme Name: FOUF
Theme URI: https://fouf.ch/
Description: Thème enfant basé sur Divi pour la plateforme FOUF
Author: Équipe FOUF
Author URI: https://fouf.ch/
Template: Divi
Version: 1.0
Text Domain: fouf
*/

/* ====== Section Sponsors FOUF ====== */
.fouf-sponsors {
  --bg: transparent;
  --card-bg: rgba(255,255,255,0.06);
  --border: rgba(0,0,0,0.08);
  --shadow: 0 6px 30px rgba(0,0,0,0.08);
  --radius: 16px;
  --gap: clamp(14px, 2vw, 24px);
  --pad: clamp(16px, 3vw, 32px);
  --maxw: 1200px;
  --hover-scale: 1.04;
  --logo-max-h: 42px;
  --logo-max-h-sm: 36px;
  background: var(--bg);
}

/* Caché visuellement, visible pour les lecteurs d’écran */
.sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,1px,1px);
  white-space: nowrap; border: 0;
}

/* Grille des logos */
.fouf-sponsors__wrap {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: var(--pad);
  display: grid;
  gap: var(--gap);
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* Carte du sponsor */
.fouf-sponsor {
  display: grid;
  place-items: center;
  padding: clamp(14px, 2.2vw, 22px);
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  text-decoration: none;
  transition: transform .35s ease, box-shadow .35s ease, background-color .35s ease;
  will-change: transform;
}

/* Logo */
.fouf-sponsor img {
  max-height: var(--logo-max-h);
  width: auto;
  height: auto;
  max-width: 100%;
  object-fit: contain;
  filter: grayscale(100%) contrast(1.05) opacity(.85);
  transition: filter .35s ease, transform .35s ease;
}

/* Effet hover/focus */
.fouf-sponsor:hover,
.fouf-sponsor:focus {
  transform: translateY(-2px) scale(var(--hover-scale));
  box-shadow: 0 10px 40px rgba(0,0,0,0.12);
}
.fouf-sponsor:hover img,
.fouf-sponsor:focus img {
  filter: grayscale(0%) opacity(1);
}

/* Responsive */
@media (max-width: 980px) {
  .fouf-sponsors__wrap {
    grid-template-columns: repeat(2, 1fr);
  }
  .fouf-sponsor img {
    max-height: var(--logo-max-h-sm);
  }
}
@media (max-width: 480px) {
  .fouf-sponsor { padding: 12px; }
}

/* Accessibilité: animations réduites */
@media (prefers-reduced-motion: reduce) {
  .fouf-sponsor, .fouf-sponsor img { transition: none !important; }
}

/* Mode sombre auto */
@media (prefers-color-scheme: dark) {
  .fouf-sponsors {
    --card-bg: rgba(255,255,255,0.06);
    --border: rgba(255,255,255,0.10);
  }
}


/*fixer la couleur du menu*/
/* Couleur du header (fond) */
#main-header,
.et-fixed-header{
  background-color:#a6191f !important; /* rouge FOUF */
}

/* Liens du menu principal */
#top-menu > li > a { color:#fff !important; }

/* Icône hamburger */
.mobile_menu_bar:before{ color:#fff !important; }

/* Conteneur du menu mobile + liens */
#et_mobile_nav_menu,
.et_mobile_menu{
  background:#a6191f !important;
}
.et_mobile_menu li a{
  color:#fff !important;
  border-color: rgba(255,255,255,.2) !important; /* séparateurs */
}

/* Survol / focus mobile (si thème l'applique) */
.et_mobile_menu li a:hover,
.et_mobile_menu li a:focus{
  color:#fff !important;
  background: rgba(255,255,255,.08) !important;
}

/**/

form.fouf-form {
  max-width: 500px;
  margin: 2rem auto;
  padding: 2rem;
  background: #f7f7f7;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.05);
  font-family: sans-serif;
}

form.fouf-form input,
form.fouf-form textarea,
form.fouf-form button {
  width: 100%;
  padding: 12px;
  margin-bottom: 1rem;
  border: 1px solid #ddd;
  border-radius: 8px;
  font-size: 16px;
}

form.fouf-form input:focus,
form.fouf-form textarea:focus {
  border-color: #A6191F;
  outline: none;
  box-shadow: 0 0 5px rgba(145, 70, 255, 0.2);
}

form.fouf-form button {
  background-color: #A6191F;
  color: white;
  font-weight: bold;
  border: none;
  cursor: pointer;
  transition: background 0.3s;
}

form.fouf-form button:hover {
  background-color: #732ddc;
}

.fouf-form {
  max-width: 600px;
  margin: 2rem auto;
  padding: 2rem;
  background: #f9f9f9;
  border-radius: 16px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
  font-family: "Segoe UI", sans-serif;
}

.fouf-form h2 {
  margin-bottom: 1rem;
  font-size: 24px;
  color: #333;
}

.fouf-form p {
  color: #555;
  font-size: 16px;
  margin-bottom: 1.5rem;
}

.fouf-form input[type="file"] {
  border: 1px solid #ddd;
  padding: 12px;
  width: 100%;
  border-radius: 8px;
  font-size: 16px;
  background-color: #fff;
  cursor: pointer;
  transition: border-color 0.3s;
}

.fouf-form input[type="file"]:hover {
  border-color: #9146ff;
}

.fouf-form button {
  margin-top: 1rem;
  background-color: #9146ff;
  color: #fff;
  padding: 12px 24px;
  font-size: 16px;
  font-weight: bold;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 0.3s ease;
} 

.acf-form {
  max-width: 600px;
  margin: 2rem auto;
  padding: 2rem;
  background: #fdfdfd;
  border-radius: 16px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
  font-family: "Segoe UI", sans-serif;
}

.acf-form input,
.acf-form select,
.acf-form textarea {
  width: 100%;
  padding: 12px;
  margin-bottom: 1rem;
  border: 1px solid #ccc;
  border-radius: 8px;
  font-size: 16px;
}

.acf-form input[type="submit"] {
  background-color: #a6191f;
  color: white;
  border: none;
  cursor: pointer;
  transition: background-color 0.3s;
}

.acf-form input[type="submit"]:hover {
  background-color: #7e1318;
}

.fouf-grid-offres {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: center;
  margin: 2rem 0;
}

.fouf-offre-card {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
  padding: 1.5rem;
  text-align: center;
  width: 300px;
  transition: transform 0.3s;
}

.fouf-offre-card:hover {
  transform: translateY(-5px);
}

.fouf-offre-card img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  margin-bottom: 1rem;
}

.fouf-offre-card .btn-fouf {
  display: inline-block;
  margin-top: 1rem;
  padding: 0.6rem 1.2rem;
  background: #a6191f;
  color: white;
  border-radius: 8px;
  text-decoration: none;
  transition: background-color 0.3s;
}

.fouf-offre-card .btn-fouf:hover {
  background-color: #7e1318;
}
.fiche-entrepreneuse {
  max-width: 960px;
  margin: 0 auto;
  padding: 2rem;
}

.fiche-header {
  background: #fdf4f5;
  border-left: 8px solid #a6191f;
  border-radius: 16px;
  padding: 2rem;
  margin-bottom: 2rem;
  text-align: center;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}

.fiche-header img {
  border-radius: 50%;
  margin-bottom: 1rem;
}

.fiche-header h1 {
  font-size: 2rem;
  margin: 0.5rem 0;
}

.fiche-header h2 {
  font-size: 1.2rem;
  color: #a6191f;
  margin-bottom: 1rem;
}

.fiche-header p {
  font-size: 1rem;
  color: #444;
}

.fouf-grid-offres {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: center;
}

.fouf-offre-card {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  padding: 1.5rem;
  text-align: center;
  width: 280px;
  transition: transform 0.3s;
}

.fouf-offre-card:hover {
  transform: translateY(-5px);
}

.fouf-offre-card h4 {
  margin: 1rem 0 0.5rem;
  font-size: 1.1rem;
}

.fouf-offre-card p {
  font-size: 0.95rem;
  color: #555;
}

.btn-fouf {
  display: inline-block;
  margin-top: 1rem;
  padding: 0.6rem 1.2rem;
  background: #a6191f;
  color: white;
  border-radius: 8px;
  text-decoration: none;
  font-weight: bold;
  transition: background-color 0.3s;
}

.btn-fouf:hover {
  background-color: #7e1318;
}

/* SECTION PARTENAIRES */
.fouf-partenaires {
  max-width: 1200px;
  margin: 3rem auto;
  padding: 0 1rem;
  text-align: center;
}

.fouf-partenaires h2 {
  font-size: 2rem;
  margin-bottom: 2rem;
  color: #a6191f;
}

.partenaires-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 2rem;
  justify-content: center; /* ✅ centre les colonnes */
  justify-items: center; /* ✅ centre chaque item */
  max-width: 800px; /* ✅ limite la largeur de la grille */
  margin: 0 auto;
}

.partenaires-grid a {
  display: block;
}

.partenaires-grid img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
  filter: grayscale(100%);
  transition: transform 0.3s ease, filter 0.3s ease;
}

.partenaires-grid img:hover {
  transform: scale(1.05);
  filter: grayscale(0%);
}

.fouf-grid-entrepreneuses {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 2rem;
  margin: 2rem 0;
}

.fouf-card-entrepreneuse {
  background: #fff5f7;
  border: 2px solid #f7c8d2;
  border-radius: 16px;
  padding: 20px;
  text-align: center;
  box-shadow: 0 4px 10px rgba(166, 25, 31, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.fouf-card-entrepreneuse:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(166, 25, 31, 0.15);
}

.fouf-card-entrepreneuse img {
  width: 120px;
  height: 120px;
  object-fit: cover;
  border-radius: 50%;
  margin-bottom: 10px;
  border: 3px solid #a6191f;
}

.fouf-card-entrepreneuse h3 {
  font-size: 1.2rem;
  color: #a6191f;
  margin: 0.5rem 0;
  font-weight: bold;
}

.fouf-card-entrepreneuse p {
  margin: 0.3rem 0 1rem 0;
  color: #333;
  font-size: 0.95rem;
}

.fouf-card-entrepreneuse .btn-fouf {
  display: inline-block;
  padding: 10px 20px;
  background: #a6191f;
  color: #fff;
  text-decoration: none;
  border-radius: 25px;
  font-weight: 600;
  transition: background 0.3s ease;
}

.fouf-card-entrepreneuse .btn-fouf:hover {
  background: #871419;
}

.fiche-entrepreneuse {
  max-width: 800px;
  margin: 2rem auto;
  background: #fff5f7;
  border: 2px solid #f7c8d2;
  border-radius: 16px;
  padding: 30px;
  text-align: center;
  box-shadow: 0 4px 10px rgba(166, 25, 31, 0.1);
}

.fiche-entrepreneuse img {
  width: 150px;
  height: 150px;
  object-fit: cover;
  border-radius: 50%;
  border: 4px solid #a6191f;
  margin-bottom: 1rem;
}

.fiche-entrepreneuse h1 {
  font-size: 1.8rem;
  color: #a6191f;
  margin: 0.5rem 0;
}

.fiche-entrepreneuse h2 {
  font-size: 1.2rem;
  color: #333;
  margin-bottom: 1rem;
  font-weight: 500;
}

.fiche-entrepreneuse p {
  margin: 0.5rem 0;
  font-size: 1rem;
  color: #444;
}

.fiche-entrepreneuse button.btn-fouf {
  display: inline-block;
  margin-top: 1.5rem;
  padding: 12px 25px;
  background: #a6191f;
  color: #fff;
  text-decoration: none;
  border: none;
  border-radius: 25px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.3s ease;
}

.fiche-entrepreneuse button.btn-fouf:hover {
  background: #871419;
}

/* ===== FOUF – Mobile header harmonisé ===== */
@media (max-width: 980px){

  /* 1) Même couleur partout pour le header mobile */
  #main-header,
  #main-header .et_menu_container,
  #main-header.et-fixed-header,
  #main-header.et-fixed-header .et_menu_container{
    background-color:#a6191f !important;
    box-shadow:none !important;
  }

  /* 2) Enlever toute "bande" plus foncée autour du menu mobile */
  #main-header .mobile_nav{
    background:transparent !important;
    box-shadow:none !important;
    border:0 !important;
  }

  /* 3) Placer le hamburger en haut à gauche, taille compacte */
  #et_mobile_nav_menu{
    position:absolute;          /* ancré sur le header */
    top:10px; left:12px;        /* coin haut gauche */
    z-index:10000;
  }
	
  #et_mobile_nav_menu .mobile_menu_bar.mobile_menu_bar_toggle{
    display:inline-block !important;
    width:36px; height:24px;
    padding:12px 4px;
    margin:-10% 0 0 0;
    background:transparent !important;  /* pas de fond plus foncé */
    box-shadow:none !important;

  }

  /* 4) Désactiver l'icône Divi par défaut + le libellé "Sélectionner une page" */
  .et_mobile_nav_menu .select_page,
  .mobile_nav .select_page{ display:none !important; }
  #et_mobile_nav_menu .mobile_menu_bar:before{ content:'' !important; }

  /* 5) Hamburger custom : traits blancs + animation en X */
  #et_mobile_nav_menu .mobile_menu_bar.mobile_menu_bar_toggle::before,
  #et_mobile_nav_menu .mobile_menu_bar.mobile_menu_bar_toggle::after{
    content:''; position:absolute; left:0; right:0;
    height:2px; background:#fff; border-radius:2px;
    transition:transform .25s ease, top .25s ease, opacity .2s ease;
  }
  #et_mobile_nav_menu .mobile_menu_bar.mobile_menu_bar_toggle::before{ top:0; }
  #et_mobile_nav_menu .mobile_menu_bar.mobile_menu_bar_toggle::after{ top:16px; }
  #et_mobile_nav_menu .mobile_menu_bar.mobile_menu_bar_toggle .burger-line{
    position:absolute; left:0; right:0; top:8px;
    height:2px; background:#fff; border-radius:2px;
    transition:opacity .2s ease;
  }
  #et_mobile_nav_menu .mobile_menu_bar.mobile_menu_bar_toggle.is-active::before{
    top:8px; transform:rotate(45deg); background:#fff;
  }
  #et_mobile_nav_menu .mobile_menu_bar.mobile_menu_bar_toggle.is-active::after{
    top:8px; transform:rotate(-45deg); background:#fff;
  }
  #et_mobile_nav_menu .mobile_menu_bar.mobile_menu_bar_toggle.is-active .burger-line{ opacity:0; }

  /* 6) Panneau du menu mobile : sans rouge parasite */
  #mobile_menu{
    background:#fff;
    border:1px solid #eee; border-radius:14px;
    margin-top:10px; box-shadow:0 12px 30px rgba(0,0,0,.08);
    overflow:hidden;
  }
  #mobile_menu a{
    color:#111; background:transparent !important;
    padding:14px 18px; font-size:16px; line-height:1.3;
  }
  #mobile_menu li:not(:last-child) a{ border-bottom:1px solid #f3f3f3; }
}

/* Accessibilité : pas de fond sombre à l'état hover/focus du bouton */
#et_mobile_nav_menu .mobile_menu_bar.mobile_menu_bar_toggle:hover,
#et_mobile_nav_menu .mobile_menu_bar.mobile_menu_bar_toggle:focus,
#et_mobile_nav_menu .mobile_menu_bar.mobile_menu_bar_toggle.is-active{
  background:transparent !important; box-shadow:none !important;
}

.fiche-header .logo-entreprise{
  width: 120px; max-width: 60%;
  height: auto; object-fit: contain;
  display:block; margin: 0 auto 12px auto;
  background:#fff; padding:8px; border-radius:12px;
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
}
/* FOUF: couper tout débordement horizontal sur mobile */
html, body, #page-container, #et-main-area, #main-content {
  overflow-x: hidden !important;
}

/* Empêche les rows/sections de dépasser la largeur écran */
.et_pb_section, .et_pb_row {
  max-width: 100vw !important;
}

/* Certains modules (slider/galerie) dépassent via translate/width */
.et_pb_slider, .et_pb_fullwidth_slider,
.et_pb_gallery, .et_pb_portfolio_grid, .et_pb_shop {
  overflow: hidden !important;
}

/* Les images/medias ne doivent jamais dépasser */
img, video, svg {
  max-width: 100% !important;
  height: auto;
}

/* Longs mots/URLs */
.et_pb_text, .et_pb_module, .et_pb_column {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Divi met une ligne verticale via :before sur certaines vues */
#main-content .container:before {
  display: none !important;
}