/* =========================
   Base: police + entête
========================= */
@import url('https://fonts.googleapis.com/css2?family=Ruwudu:wght@600&display=swap');

/* Titre principal (ONG CAV-TOGO) */
.site-title,
.site-title a,
.site-branding a { color:#F1EBE7 !important; }

/* Slogan avec défilement */
.site-description{
  color:#F1EBE7 !important;
  display:inline-block;
  white-space:nowrap;
  overflow:hidden;
  animation:defilement 12s linear infinite;
}
@keyframes defilement{
  0%{transform:translateX(100%)}
  100%{transform:translateX(-100%)}
}

/* Menu principal + hover */
nav ul li a,
nav a,
.main-navigation a { color:#F1EBE7 !important; }
nav ul li a:hover,
.main-navigation a:hover { color:#FFFFFF !important; }

/* Menu sur une seule ligne */
/* MENU DESKTOP UNIQUEMENT */
@media (min-width: 900px){
  header nav ul,
  .ekit-navbar-nav{
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:center;
  }
  header nav ul li,
  .ekit-navbar-nav > li{
    white-space:nowrap;
  }
}

/* MENU MOBILE – laisser Elementor/Elementskit gérer */
@media (max-width: 899px){
  .ekit-navbar-nav{
    display:block !important;
    flex-wrap:wrap !important;
  }
}

/* Sous-menus */
.sub-menu,
.elementor-nav-menu--dropdown{ background:#222222 !important; }
.sub-menu a,
.elementor-nav-menu--dropdown a{ color:#F1EBE7 !important; }
.sub-menu a:hover,
.elementor-nav-menu--dropdown a:hover{
  color:#ffffff !important;
  background:#444444 !important;
}

/* Survol Elementskit */
header nav ul.elementskit-submenu li a:hover{
  color:#ffffff !important;
  background:#111111 !important;
}

/* =========================
   Trombinoscope
========================= */
.trombino-photo img{
  transition:transform .3s ease;
  border-radius:50% !important;
  border:3px solid #ccc;
  max-width:150px;
}
.trombino-photo img:hover{
  transform:scale(1.05);
  box-shadow:0 0 10px rgba(0,0,0,.2);
}

/* =========================
   Partners (logos)
========================= */
.partners{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center;
  justify-content:center;
  gap:16px;
}
.partners img{
  max-height:64px;
  width:auto;
  height:auto;
  object-fit:contain;
  filter:grayscale(100%);
  opacity:.85;
  transition:filter .2s ease, opacity .2s ease;
}
.partners img:hover{ filter:none; opacity:1; }
@media (max-width:767px){ .partners img{ max-height:44px; } }

/* =========================
   Pages article (single post)
========================= */
body.single-post .site-main,
body.single-post main,
body.single-post #primary,
body.single-post #content,
body.single-post .elementor-location-single{
  background:#FFFFFF !important;
  color:#020101 !important;
}
body.single-post .entry-title,
body.single-post .entry-content,
body.single-post .entry-content p,
body.single-post .entry-content li,
body.single-post .elementor-location-single,
body.single-post .elementor-location-single p,
body.single-post .elementor-location-single li{
  color:#020101 !important;
}
body.single-post .entry-content a,
body.single-post .elementor-location-single a{ color:#0056b3 !important; }
body.single-post .entry-content a:hover,
body.single-post .elementor-location-single a:hover{ color:#003366 !important; }
body.single-post header,
body.single-post .elementor-location-header,
body.single-post footer,
body.single-post .elementor-location-footer{
  background:transparent !important;
  color:inherit !important;
}

/* =========================
   Boutons header (CTA)
========================= */
.oc-header-cta{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.oc-btn{
  display:inline-block; padding:.6rem 1rem; border-radius:999px;
  border:2px solid transparent; font-weight:600; text-decoration:none;
  line-height:1; transition:all .2s ease;
}
.oc-btn--primary{ background:#2E7D32; color:#fff; }
.oc-btn--primary:hover{ filter:brightness(0.95); }
.oc-btn--secondary{ background:#FBC02D; color:#000; }
.oc-btn--secondary:hover{ filter:brightness(0.95); }
@media (max-width:768px){
  .oc-header-cta{ gap:8px; }
  .oc-btn{ padding:.55rem .9rem; font-weight:600; }
}

/* =========================
   Grille + Cartes
========================= */
.oc-section{ padding:48px 0; }
.oc-container{ max-width:1200px; margin:0 auto; padding:0 16px; }
.oc-grid{ display:grid; gap:24px; }
.oc-cols-3{ grid-template-columns:repeat(3,1fr); }
@media (max-width:1024px){ .oc-cols-3{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:768px){ .oc-cols-3{ grid-template-columns:1fr; } }

.oc-card{
  background:#fff; border:1px solid #EDEDED; border-radius:12px;
  box-shadow:0 10px 24px rgba(0,0,0,.16);
  padding:18px; color:#212121;
}
.oc-card-title{ font-weight:700; margin-bottom:6px; color:inherit !important; }
.oc-card-desc{ color:#4E4E4E !important; font-size:15px; margin-bottom:10px; }
.oc-card > *:last-child{ margin-bottom:0; }

.oc-btn.outline-dark{
  display:inline-block; padding:.6rem 1rem; border-radius:999px;
  border:2px solid #000; color:#000; text-decoration:none; font-weight:600;
}
.oc-btn.outline-dark:hover{ background:#000; color:#fff; }

/* Mode sombre cartes */
:root.dark .oc-card{ background:#151821 !important; border-color:#2b3242 !important; color:#e5e7eb; }
:root.dark .oc-card-desc{ color:#c7cad1 !important; }

/* =========================
   Slider overlay
========================= */
.slider .overlay{ background:rgba(0,0,0,.45) !important; }

/* =========================
   Overlap propre Domains
========================= */
:root{ --domains-overlap:230px; } /* ajuste la valeur */

/* Overlap stable */
.oc-section.oc-domains{
  position: relative;
  isolation: isolate;
  z-index: 10;
  transform: translateY(calc(var(--domains-overlap) * -1));
  padding-top: var(--domains-overlap);
  margin: 0;
  overflow: visible !important;
}

/* Laisser passer les ombres */
.oc-section.oc-domains > .oc-container,
.oc-section.oc-domains .oc-grid{ overflow: visible !important; }

/* La section suivante ne recouvre pas la base */
.oc-section.oc-domains + .oc-section,
.oc-section.oc-domains + .elementor-section{
  position: relative;
  z-index: 1;
  margin-top: 0 !important;
  padding-top: 56px !important; /* ajuste si besoin */
  overflow: visible !important;
}

/* Variante mobile */
@media (max-width:768px){
  :root{ --domains-overlap:140px; }
  .oc-section.oc-domains + .oc-section,
  .oc-section.oc-domains + .elementor-section{
    padding-top: 40px !important;
  }
}



/* Harmoniser les cartes d'actualités avec celles des domaines */
.ekit-post-grid .ekit-post-card,
.ekit-post-carousel .ekit-post-card{
  background:#fff;
  border:1px solid #EDEDED;
  border-radius:12px;
  box-shadow:0 6px 16px rgba(0,0,0,.08);
  padding:16px;
  transition:transform .2s ease, box-shadow .2s ease;
}
.ekit-post-grid .ekit-post-card:hover,
.ekit-post-carousel .ekit-post-card:hover{
  transform:translateY(-4px);
  box-shadow:0 10px 24px rgba(0,0,0,.16);
}
.ekit-post-grid .ekit-post-card img,
.ekit-post-carousel .ekit-post-card img{
  border-radius:12px 12px 0 0;
}



/* ====== Uniformisation des hauteurs pour les Actualités (Elementskit) ====== */
/* Scope : ne s'applique qu'au bloc où tu as mis la classe 'oc-news' */
.oc-news .ekit-post-grid .ekit-post-card,
.oc-news .ekit-post-carousel .ekit-post-card{
  background:#fff;
  border:1px solid #EDEDED;
  border-radius:12px;
  box-shadow:0 6px 16px rgba(0,0,0,.08);
  padding:16px;
  transition:transform .2s ease, box-shadow .2s ease;

  /* Hauteurs égales */
  display:flex;
  flex-direction:column;
  height:100%;
}

/* Le conteneur direct des cartes doit permettre la prise de hauteur */
.oc-news .ekit-post-grid [class*="grid"] > *,
.oc-news .ekit-post-grid .elementor-grid-item,
.oc-news .ekit-post-grid .ekit-post-col,
.oc-news .ekit-post-grid .ekit-post-item{
  display:flex;
}

/* Image de tête : garde le ratio et ne casse pas la hauteur */
.oc-news .ekit-post-grid .ekit-post-card img,
.oc-news .ekit-post-carousel .ekit-post-card img{
  border-radius:12px 12px 0 0;
  width:100%;
  height:auto;
  object-fit:cover;
  max-height:220px; /* ajuste 180–260 selon ta maquette */
}

/* Corps de la carte : prend l'espace restant pour pousser le bouton en bas */
.oc-news .ekit-post-card .ekit-post-body,
.oc-news .ekit-post-card .entry-summary,
.oc-news .ekit-post-card .post-content{
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
}

/* Titre */
.oc-news .ekit-post-card h3,
.oc-news .ekit-post-card .entry-title{
  font-size:18px;
  font-weight:700;
  margin:12px 0 6px;
}

/* Extrait : clamp pour éviter les hauteurs variables */
.oc-news .ekit-post-card .ekit-post-excerpt,
.oc-news .ekit-post-card .entry-summary p,
.oc-news .ekit-post-card .post-content p{
  color:#4E4E4E;
  font-size:15px;
  margin:0 0 10px;

  display:-webkit-box;
  -webkit-line-clamp: 3;          /* nombre de lignes max du résumé */
  -webkit-box-orient: vertical;
  overflow:hidden;
  min-height: calc(1.5em * 3);    /* réserve l'espace pour 3 lignes */
}

/* Bouton aligné en bas */
.oc-news .ekit-post-card a.more-link,
.oc-news .ekit-post-card .read-more,
.oc-news .ekit-post-card .btn-read-more{
  margin-top:auto;                /* pousse le bouton en bas */
  align-self:flex-start;

  display:inline-block;
  font-weight:600;
  color:#000;
  border:2px solid #000;
  border-radius:999px;
  padding:.4rem 1rem;
  text-decoration:none;
}
.oc-news .ekit-post-card a.more-link:hover,
.oc-news .ekit-post-card .read-more:hover,
.oc-news .ekit-post-card .btn-read-more:hover{
  background:#000;
  color:#fff;
}

/* Hover global */
.oc-news .ekit-post-grid .ekit-post-card:hover,
.oc-news .ekit-post-carousel .ekit-post-card:hover{
  transform:translateY(-4px);
  box-shadow:0 10px 24px rgba(0,0,0,.16);
}

/* Responsive : un peu moins d'image sur mobile pour gagner de la place */
@media (max-width: 767px){
  .oc-news .ekit-post-grid .ekit-post-card img,
  .oc-news .ekit-post-carousel .ekit-post-card img{
    max-height:180px;
  }
}


/* === MOBILE : éviter chevauchement Domaines ↔ Chiffres === */
@media (max-width: 768px){

  /* Section Domaines */
  #vdomain{
    position: relative !important;
    transform: none !important;         /* annule le chevauchement */
    margin: 0 !important;
    padding-top: 24px !important;
    padding-bottom: 24px !important;
    z-index: 5 !important;              /* au-dessus des éléments de fond */
    overflow: visible !important;
  }

  /* Section Chiffres clés */
  #chiffres{
    position: relative !important;
    z-index: 0 !important;              /* reste derrière Domaines */
    margin-top: 0 !important;
    padding-top: 40px !important;       /* espace ("ciel") au-dessus */
    overflow: visible !important;
  }

  /* Désactiver tout clipping des wrappers */
  #vdomain .elementor-container,
  #vdomain .elementor-column,
  #vdomain .elementor-widget-wrap,
  #chiffres .elementor-container,
  #chiffres .elementor-column,
  #chiffres .elementor-widget-wrap{
    overflow: visible !important;
  }

  /* Si Elementor force une position absolute en mobile, on neutralise */
  .elementor-position-absolute{
    position: static !important;
  }

  /* Shape dividers du bas : masqués en mobile pour éviter le chevauchement */
  #vdomain .elementor-shape-bottom,
  #chiffres .elementor-shape-top{
    display: none !important;
  }
}



/* Limiter à 1 carte quand les cartes sont placées DANS un slide */
.elementor-widget-slides .oc-grid{
  /* au cas où ta grille forcerait 2–3 colonnes, on la réduit à 1 */
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 24px;
}

/* On cache toutes les cartes sauf la 1re dans chaque slide */
.elementor-widget-slides .oc-grid .oc-card{
  display: none !important;
}
.elementor-widget-slides .oc-grid .oc-card:first-child{
  display: block !important;
}

/* Si le slider clone des slides pour la boucle, on masque leurs contenus
   (sinon on voit "doublé/triplé"). */
.elementor-widget-slides .swiper-slide-duplicate .oc-grid,
.elementor-widget-slides .swiper-slide-duplicate .oc-card{
  visibility: hidden !important;  /* évite un trou de mise en page */
  pointer-events: none !important;
}

/* Variante mobile : on peut resserrer un peu les marges */
@media (max-width: 768px){
  .elementor-widget-slides .oc-grid{ gap: 16px; }
}



/* ===== Base / couleurs ===== */
:root{
  --oc-secondary: #FBC02D;   /* jaune maquette */
  --oc-black: #000;
  --oc-text: #000;           /* texte du bandeau */
  --oc-gap: 24px;
  --oc-height: 72px;         /* hauteur du bandeau */
  --oc-speed: 18s;           /* vitesse du défilement (↓ = plus lent) */
}
:root.dark {
  --oc-secondary: #ffd166;   /* jaune lisible en dark */
  --oc-text: #111;
}

/* ===== Structure ===== */
.oc-marquee-cta{
  background: var(--oc-secondary);
  color: var(--oc-text);
  width: 100%;
}
.oc-marquee-cta__inner{
  max-width: 1200px; margin: 0 auto;
  min-height: var(--oc-height);
  display: grid; align-items: center;
  grid-template-columns: 1fr auto; gap: var(--oc-gap);
  padding: 8px 16px;
}

/* Accessibilité: titre caché visuellement */
.sr-only{ position:absolute !important; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* ===== Marquee ===== */
.oc-marquee{ overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.oc-marquee__track{
  display: inline-flex; gap: 32px;
  white-space: nowrap;
  will-change: transform;
  animation: oc-marquee var(--oc-speed) linear infinite;
  font-weight: 800; letter-spacing: .02em;
  font-size: clamp(16px, 2.4vw, 20px);
}
.oc-marquee__track span{ display:inline-block; }

/* Animation continue gauche → droite */
@keyframes oc-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); } /* le contenu est répété, c'est fluide */
}

/* ===== Boutons ===== */
.oc-btn{
  display:inline-block; padding:.6rem 1rem; border-radius:999px;
  border:2px solid transparent; font-weight:700; text-decoration:none;
  line-height:1; transition:transform .15s ease, filter .15s ease;
  user-select:none;
}
.oc-btn--dark{ background: var(--oc-black); color:#fff; border-color: var(--oc-black); }
.oc-btn--outline-dark{ background: transparent; color: var(--oc-black); border-color: var(--oc-black); }
.oc-btn:hover{ transform: translateY(-1px); filter: brightness(.97); }

/* ===== Responsive ===== */
@media (max-width: 768px){
  .oc-marquee-cta__inner{ grid-template-columns: 1fr; gap: 12px; }
  .oc-marquee__track{ gap: 24px; }
  .oc-btn{ padding:.55rem .9rem; }
}

/* Respecte les préférences "réduire les animations" */
@media (prefers-reduced-motion: reduce){
  .oc-marquee__track{ animation: none; transform: none; }
}

/* Option: rendre le bandeau "collant" en haut (ou bas) de la page */
/* .oc-marquee-cta{ position: sticky; top: 0; z-index: 100; } */
/* .oc-marquee-cta{ position: sticky; bottom: 0; z-index: 100; } */



/* ===== Footer ===== */
.oc-footer{
  background:#020101; color:#FAFAFA;
  padding:48px 16px 24px;
  font-size:15px;
}
.oc-footer a{ color:#FAFAFA; text-decoration:none; }
.oc-footer a:hover{ text-decoration:underline; }

/* Colonnes */
.oc-footer-columns{
  display:grid; gap:24px;
  grid-template-columns:repeat(4,1fr);
  margin-bottom:32px;
}
.oc-footer-col h4{
  margin:0 0 12px; font-size:16px; font-weight:700;
}
.oc-footer-col ul{ list-style:none; margin:0; padding:0; }
.oc-footer-col ul li{ margin-bottom:6px; }

/* Newsletter */
.oc-newsletter{ display:flex; gap:8px; margin-bottom:12px; }
.oc-newsletter input{
  flex:1; padding:8px; border:none; border-radius:6px;
}
.oc-newsletter button{
  background:#FBC02D; border:none; border-radius:6px;
  padding:8px 14px; font-weight:600; cursor:pointer;
}
.oc-newsletter button:hover{ filter:brightness(.95); }

/* Réseaux */
.oc-social a{
  display:inline-block; margin-right:8px;
  font-weight:600; font-size:14px;
}

/* Bas de page */
.oc-footer-bottom{
  border-top:1px solid rgba(255,255,255,.15);
  padding-top:16px; display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
  font-size:14px;
}
.oc-footer-bottom .links a{ margin-left:16px; }

/* Responsive */
@media (max-width:1024px){
  .oc-footer-columns{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px){
  .oc-footer-columns{ grid-template-columns:1fr; }
}




/* ===========================================
   BLOG : 3 derniers articles, cartes uniformes
   Scope: conteneur avec la classe .oc-news
=========================================== */

/* Grille en 3 colonnes sur desktop */
.oc-news .elementor-grid,
.oc-news .ekit-post-grid .row,
.oc-news .ekit-post-grid [class*="grid"]{
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  align-items: stretch !important;
}

/* 2 colonnes tablette, 1 colonne mobile */
@media (max-width: 1024px){
  .oc-news .elementor-grid,
  .oc-news .ekit-post-grid .row,
  .oc-news .ekit-post-grid [class*="grid"]{
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 767px){
  .oc-news .elementor-grid,
  .oc-news .ekit-post-grid .row,
  .oc-news .ekit-post-grid [class*="grid"]{
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
}

/* Chaque cellule doit permettre à la carte de prendre 100% de la hauteur */
.oc-news .elementor-grid > *,
.oc-news .ekit-post-grid .elementor-grid-item,
.oc-news .ekit-post-grid .ekit-post-col,
.oc-news .ekit-post-grid .ekit-post-item{
  display: flex !important;
}

/* Carte = conteneur flex en colonne, hauteur pleine */
.oc-news .ekit-post-card,
.oc-news .post-card,
.oc-news .elementor-post__card{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  background:#fff;
  border:1px solid #EDEDED;
  border-radius:12px;
  box-shadow:0 6px 16px rgba(0,0,0,.08);
  overflow: hidden; /* masque tout débordement */
}

/* Image : ratio constant (16/9), pas de variation de hauteur */
.oc-news .ekit-post-card img,
.oc-news .elementor-post__thumbnail img,
.oc-news .post-card .post-thumbnail img{
  width: 100% !important;
  height: auto !important;
  display: block !important;
  aspect-ratio: 16/9 !important;   /* verrouille la hauteur visuelle */
  object-fit: cover !important;     /* recadre proprement */
  border-radius: 0 !important;      /* bord déjà géré par la carte */
}

/* Corps de carte : pousse le bouton en bas */
.oc-news .ekit-post-card .ekit-post-body,
.oc-news .elementor-post__text,
.oc-news .post-card .post-content{
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 16px !important;
}

/* Titre: taille et marges cohérentes */
.oc-news .ekit-post-card h3,
.oc-news .elementor-post__title,
.oc-news .post-card h3{
  font-size: 18px !important;
  font-weight: 700 !important;
  margin: 8px 0 6px !important;
  line-height: 1.25 !important;
}

/* Extrait : clamp 3 lignes => hauteurs identiques */
.oc-news .ekit-post-excerpt,
.oc-news .elementor-post__excerpt,
.oc-news .post-card .entry-summary p{
  color:#4E4E4E !important;
  font-size:15px !important;
  margin:0 0 10px !important;
  display:-webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: calc(1.5em * 3) !important; /* réserve pour 3 lignes */
}

/* Bouton en bas, style cohérent */
.oc-news .ekit-post-card a.more-link,
.oc-news .elementor-post__read-more,
.oc-news .post-card .read-more{
  margin-top: auto !important;
  align-self: flex-start !important;
  display: inline-block !important;
  font-weight: 600 !important;
  color: #000 !important;
  border: 2px solid #000 !important;
  border-radius: 999px !important;
  padding: .4rem 1rem !important;
  text-decoration: none !important;
}
.oc-news .ekit-post-card a.more-link:hover,
.oc-news .elementor-post__read-more:hover,
.oc-news .post-card .read-more:hover{
  background:#000 !important;
  color:#fff !important;
}

/* Hover carte (optionnel) */
.oc-news .ekit-post-card:hover,
.oc-news .post-card:hover,
.oc-news .elementor-post__card:hover{
  transform: translateY(-4px);
  box-shadow: 0 10px 24px rgba(0,0,0,.16);
}




/* === Elementskit Post Grid : 3 cartes uniformes (scope local) === */
.oc-news-ekit .ekit-post-grid .ekit-post-col,
.oc-news-ekit .ekit-post-grid .elementor-grid-item,
.oc-news-ekit .ekit-post-grid [class*="col-"]{
  display: flex !important;          /* les colonnes s'étirent */
}

.oc-news-ekit .ekit-post-card{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  background: #fff;
  border: 1px solid #EDEDED;
  border-radius: 12px;
  overflow: hidden;
}

/* Image au ratio fixe 16:9 */
.oc-news-ekit .ekit-post-card img{
  width: 100% !important;
  height: auto !important;
  display: block !important;
  aspect-ratio: 16/9 !important;
  object-fit: cover !important;
  border-radius: 0 !important;
}

/* Corps : pousse le bouton en bas */
.oc-news-ekit .ekit-post-card .ekit-post-body{
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 16px !important;
}

/* Titre sobre et régulier */
.oc-news-ekit .ekit-post-card .entry-title,
.oc-news-ekit .ekit-post-card h3{
  font-size: 18px !important;
  font-weight: 700 !important;
  margin: 8px 0 6px !important;
  line-height: 1.25 !important;
}

/* Extrait limité à 3 lignes = hauteurs stables */
.oc-news-ekit .ekit-post-card .ekit-post-excerpt,
.oc-news-ekit .ekit-post-card .entry-summary,
.oc-news-ekit .ekit-post-card .post-content{
  color:#4E4E4E !important;
  font-size:15px !important;
  margin:0 0 10px !important;
  display:-webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: calc(1.5em * 3) !important;
}

/* Bouton en bas */
.oc-news-ekit .ekit-post-card .more-link,
.oc-news-ekit .ekit-post-card .read-more{
  margin-top: auto !important;
  align-self: flex-start !important;
}


/* === EKit Post Grid : images en background === */
.oc-news-ekit .ekit-post-card{
  display:flex !important; flex-direction:column !important; height:100% !important; overflow:hidden !important;
}
.oc-news-ekit .ekit-post-card .elementskit-entry-thumb,
.oc-news-ekit .ekit-post-card .post-thumbnail,
.oc-news-ekit .ekit-post-card .ekit-post-thumb,
.oc-news-ekit .ekit-post-card .thumb{
  width:100% !important; aspect-ratio:16/9 !important; display:block !important; overflow:hidden !important;
  background-size:cover !important; background-position:center !important; background-repeat:no-repeat !important;
  min-height:auto !important; height:auto !important;  /* on fige par aspect-ratio */
}
.oc-news-ekit .ekit-post-card .ekit-post-body{
  flex:1 1 auto !important; display:flex !important; flex-direction:column !important; padding:16px !important;
}
.oc-news-ekit .ekit-post-card .entry-title{
  margin:8px 0 6px !important; font-size:18px !important; line-height:1.25 !important;
  display:-webkit-box !important; -webkit-line-clamp:2 !important; -webkit-box-orient:vertical !important; overflow:hidden !important; min-height:calc(1.25em * 2) !important;
}
.oc-news-ekit .ekit-post-card .ekit-post-excerpt{
  color:#4E4E4E !important; margin:0 0 10px !important; font-size:15px !important;
  display:-webkit-box !important; -webkit-line-clamp:3 !important; -webkit-box-orient:vertical !important; overflow:hidden !important; min-height:calc(1.5em * 3) !important;
}
.oc-news-ekit .ekit-post-card .read-more,
.oc-news-ekit .ekit-post-card .more-link{ margin-top:auto !important; align-self:flex-start !important; }



/* (optionnel) Forcer une grille 3/2/1 sur le wrapper */
.oc-news-ekit .ekit-post-grid .row{
  display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:24px !important; align-items:stretch !important;
}
@media (max-width:1024px){
  .oc-news-ekit .ekit-post-grid .row{ grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:767px){
  .oc-news-ekit .ekit-post-grid .row{ grid-template-columns:1fr !important; gap:16px !important; }
}
.oc-news-ekit .ekit-post-grid .row > *{ display:flex !important; }









/* --- Forcer une vraie grille 3/2/1 au wrapper EKit --- */
.oc-news-ekit .ekit-post-grid .row,
.oc-news-ekit .ekit-post-grid .ekit-row,
.oc-news-ekit .ekit-post-grid .elementskit-post-items,
.oc-news-ekit .ekit-post-grid .elementor-grid{
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  align-items: stretch !important;
}
@media (max-width:1024px){
  .oc-news-ekit .ekit-post-grid .row,
  .oc-news-ekit .ekit-post-grid .ekit-row,
  .oc-news-ekit .ekit-post-grid .elementskit-post-items,
  .oc-news-ekit .ekit-post-grid .elementor-grid{
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width:767px){
  .oc-news-ekit .ekit-post-grid .row,
  .oc-news-ekit .ekit-post-grid .ekit-row,
  .oc-news-ekit .ekit-post-grid .elementskit-post-items,
  .oc-news-ekit .ekit-post-grid .elementor-grid{
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
}

/* Chaque cellule s’étire */
.oc-news-ekit .ekit-post-grid .row > *,
.oc-news-ekit .ekit-post-grid .ekit-row > *,
.oc-news-ekit .ekit-post-grid .elementskit-post-items > *,
.oc-news-ekit .ekit-post-grid .elementor-grid > *{
  display: flex !important;
}

/* --- Carte 100% hauteur, colonnes flex --- */
.oc-news-ekit .ekit-post-card,
.oc-news-ekit .elementskit-post-image-card,
.oc-news-ekit .post-card,
.oc-news-ekit .elementskit-post-default{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  background: #fff;
  border: 1px solid #EDEDED;
  border-radius: 12px;
  overflow: hidden;
}

/* --- Cas A : image présente (balise img) --- */
.oc-news-ekit .ekit-post-card img,
.oc-news-ekit .elementskit-post-image-card img{
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

/* Conteneur image : 16/9 + recadrage */
.oc-news-ekit .ekit-post-card .elementskit-entry-thumb,
.oc-news-ekit .ekit-post-card .post-thumbnail,
.oc-news-ekit .ekit-post-card .ekit-post-thumb,
.oc-news-ekit .ekit-post-card .thumb,
.oc-news-ekit .elementskit-post-image-card .elementskit-entry-thumb,
.oc-news-ekit .elementskit-post-image-card .post-thumbnail,
.oc-news-ekit .elementskit-post-image-card .ekit-post-thumb,
.oc-news-ekit .elementskit-post-image-card .thumb{
  position: relative !important;
  width: 100% !important;
  padding-top: 56.25% !important;      /* 16:9 */
  overflow: hidden !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
.oc-news-ekit .elementskit-entry-thumb img,
.oc-news-ekit .post-thumbnail img,
.oc-news-ekit .ekit-post-thumb img,
.oc-news-ekit .thumb img{
  position: absolute !important;
  top: 0; left: 0; right: 0; bottom: 0; /* remplace inset:0; */
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Corps : pousser le bouton en bas */
.oc-news-ekit .ekit-post-body,
.oc-news-ekit .post-content,
.oc-news-ekit .elementor-post__text{
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 16px !important;
}

/* Titre 2 lignes max */
.oc-news-ekit h3,
.oc-news-ekit .entry-title,
.oc-news-ekit .title{
  margin: 8px 0 6px !important;
  font-size: 18px !important;
  line-height: 1.25 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: calc(1.25em * 2) !important;
}

/* Extrait 3 lignes max */
.oc-news-ekit .ekit-post-excerpt,
.oc-news-ekit .entry-summary,
.oc-news-ekit .post-content p,
.oc-news-ekit .elementor-post__excerpt{
  color: #4E4E4E !important;
  font-size: 15px !important;
  margin: 0 0 10px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: calc(1.5em * 3) !important;
}

/* Bouton en bas */
.oc-news-ekit .more-link,
.oc-news-ekit .read-more,
.oc-news-ekit .elementor-post__read-more{
  margin-top: auto !important;
  align-self: flex-start !important;
}



.oc-card {
  background: #fff;              /* fond blanc (ou ta couleur) */
  border-radius: 12px;           /* angles arrondis */
  box-shadow: 0 4px 12px rgba(0,0,0,0.1); /* ombre légère */
  padding: 20px;                 /* respiration interne */
  transition: transform .2s, box-shadow .2s;
}

/* effet au survol */
.oc-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
}

/* image en haut de la carte */
.oc-card img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  margin-bottom: 12px;
}

/* titre et texte */
.oc-card h3 {
  margin: 0 0 8px;
  font-size: 1.2rem;
  font-weight: 600;
}
.oc-card p {
  font-size: 0.95rem;
  color: #444;
  margin-bottom: 12px;
}

/* bouton */
.oc-card a.btn {
  display: inline-block;
  padding: 10px 16px;
  background: #0066cc;
  color: #fff;
  text-decoration: none;
  border-radius: 6px;
}
.oc-card a.btn:hover {
  background: #004a99;
}



.oc-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}



/* Cache les breadcrumbs / barre de titre sur la page d'accueil */
body.home .breadcrumbs,
body.home .breadcrumb,
body.home .page-header,
body.home .page-title,
body.home .site-breadcrumbs {
  display: none !important;
}

/* Annule tout espace résiduel en haut de la première section */
body.home .elementor-location-content > section:first-of-type,
body.home .elementor-section-wrap > section:first-of-type {
  margin-top: 0 !important;
  padding-top: clamp(0px, 2vh, 24px);
}



/* Accessibilité label masqué */
.sr-only {
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* --------- Newsletter --------- */
.oc-footer .oc-footer-news .oc-newsletter{
  display:flex; flex-wrap:wrap; align-items:center; gap:12px;
  max-width: 440px;
}
.oc-footer .oc-footer-news .oc-newsletter input[type="email"]{
  flex:1 1 220px;
  height:40px; padding:0 12px; border-radius:8px;
  border:1px solid rgba(255,255,255,.18);
  background:#fff; color:#111;
  outline: none;
}
.oc-footer .oc-footer-news .oc-newsletter input::placeholder{ color:#666; }

.oc-footer .oc-footer-news .oc-newsletter button{
  flex:0 0 auto;
  height:40px; padding:0 14px; border-radius:8px;
  border:1px solid rgba(255,255,255,.18);
  background:#F4A62A; color:#111; font-weight:600; cursor:pointer;
  transition:transform .06s ease, filter .2s ease;
}
.oc-footer .oc-footer-news .oc-newsletter button:hover{ filter:brightness(1.05); }
.oc-footer .oc-footer-news .oc-newsletter button:active{ transform: translateY(1px); }

/* Focus visibles (accessibilité) */
.oc-footer .oc-footer-news .oc-newsletter input:focus,
.oc-footer .oc-footer-news .oc-newsletter button:focus{
  box-shadow: 0 0 0 3px rgba(244,166,42,.35);
}

/* Message (succès/erreur) */
.oc-footer .oc-footer-news .oc-newsletter .oc-newsletter-msg{
  flex:1 1 100%; margin:6px 0 0; font-size:13px; color:#fff; min-height:18px;
}
.oc-footer .oc-footer-news .oc-newsletter .oc-newsletter-msg.ok{ color:#9BE38F; }
.oc-footer .oc-footer-news .oc-newsletter .oc-newsletter-msg.err{ color:#FFA6A6; }

/* --------- Icônes sociaux (widget Social Icons Elementor) --------- */
.oc-footer .oc-footer-news .oc-social .elementor-social-icons{
  display:flex; gap:10px; flex-wrap:wrap;
}
.oc-footer .oc-footer-news .oc-social .elementor-social-icon{
  width:36px; height:36px; line-height:36px;
  background: transparent; color:#fff; border-radius:999px;
  border:1px solid rgba(255,255,255,.22);
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.oc-footer .oc-footer-news .oc-social .elementor-social-icon:hover{
  border-color: rgba(255,255,255,.5);
}

/* Couleurs hover par réseau */
.oc-footer .elementor-social-icon-facebook:hover{ background:#1877F2; color:#fff; }
.oc-footer .elementor-social-icon-twitter:hover{ background:#000; color:#fff; } /* X */
.oc-footer .elementor-social-icon-youtube:hover{ background:#FF0000; color:#fff; }

/* --------- Responsive --------- */
@media (max-width: 767px){
  .oc-footer .oc-footer-news .oc-newsletter{ gap:10px; }
  .oc-footer .oc-footer-news .oc-newsletter input[type="email"]{ flex:1 1 100%; }
  .oc-footer .oc-footer-news .oc-newsletter button{ width:100%; }
}


/* Pleine largeur visuelle (si le thème impose un conteneur boxé) */
.elementor-section.oc-footer-bottom {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: #000; /* même fond que le footer */
}

/* Aligner contenu gauche/droite et donner de l'air */
.oc-footer-bottom .elementor-container,
.oc-footer-bottom .elementor-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding-left: 16px;
  padding-right: 16px;
}

/* Liens de droite espacés */
.oc-footer-bottom .links a { margin-left: 20px; }
.oc-footer-bottom a { color:#fff; text-decoration:none; }
.oc-footer-bottom a:hover { text-decoration: underline; }

/* Mobile */
@media (max-width: 767px){
  .oc-footer-bottom .elementor-container { justify-content: flex-start; }
  .oc-footer-bottom .links a { margin: 0 12px 8px 0; display:inline-block; }
}



.oc-grid.oc-cols-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 24px;
}
@media (max-width:1024px){
  .oc-grid.oc-cols-3 { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width:767px){
  .oc-grid.oc-cols-3 { grid-template-columns: 1fr; }
}






/* Fond blanc pour toutes les pages d'articles */
body.single-post {
  background: #ffffff !important;
}

/* Encadrer le contenu de l'article */
body.single-post .entry-content,
body.single-post .post,
body.single-post article {
  background: #ffffff;         /* fond blanc pour le contenu */
  padding: 30px;               /* marges internes */
  margin: 40px auto;           /* espacement avec le haut/bas */
  max-width: 900px;            /* largeur max lisible */
  border-radius: 10px;         /* coins arrondis */
  box-shadow: 0 4px 20px rgba(0,0,0,0.08); /* ombre douce */
}



/* ✅ Articles : nettoyer styles Word collés (gris + cadres) */
body.single-post .entry-content .wp-block-table,
body.single-post .entry-content table {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-collapse: collapse !important;
}

/* Cellules : pas de fond gris, pas de bordures */
body.single-post .entry-content table td,
body.single-post .entry-content table th {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Styles Word (Mso*) et fonds inline */
body.single-post .entry-content [class*="Mso"],
body.single-post .entry-content span[style*="background"],
body.single-post .entry-content p[style*="background"],
body.single-post .entry-content td[style*="background"],
body.single-post .entry-content th[style*="background"] {
  background: transparent !important;
}

/* Tables Gutenberg "rayées" : enlever les rayures grises */
body.single-post .entry-content .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  background: transparent !important;
}

/* Optionnel : garder un peu d'air dans les cellules (sans cadre) */
body.single-post .entry-content table td,
body.single-post .entry-content table th {
  padding: 8px 10px;
}





/* --- Style générique pour toutes les pages de catégories --- */
body.category,
.archive.category {
  background: #fff;         /* fond blanc */
  color: #111;              /* texte noir */
  font-family: Arial, sans-serif;
}

/* Titres des articles */
body.category .entry-title a,
.archive.category .entry-title a {
  font-size: 1.3rem;
  font-weight: 700;
  color: #111 !important;
}

/* Catégorie affichée au-dessus de l'article */
body.category .cat-links a,
.archive.category .cat-links a {
  background: rgba(0,0,0,0.7);
  color: #fff !important;
  padding: 4px 8px;
  border-radius: 4px;
  text-transform: uppercase;
  font-size: 0.85rem;
}

/* Images à la une → toujours nettes */
body.category .post-thumbnail img,
.archive.category .post-thumbnail img {
  width: 100% !important;
  height: auto !important;
  object-fit: cover;
  display: block;
}




/* ===== HOME ONLY — Patch Slider Elementor ===== */
body.home .elementor-widget-slides .swiper-wrapper{
  display: flex !important;
  grid-template-columns: unset !important;
}
body.home .elementor-widget-slides .swiper-slide-duplicate{
  display: none !important;   /* utile si la boucle est restée ON */
}
body.home .elementor-widget-slides .swiper-slide img{
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}

/* La section superposée crée sa propre pile de rendu */
body.home .oc-section.oc-domains{
  isolation: isolate;
  z-index: 10;
}



/* ===== HERO (slider Elementor) — blindage local ===== */
#home-hero .elementor-widget-slides .swiper-wrapper{
  display: flex !important;
  grid-template-columns: unset !important;
}
#home-hero .elementor-widget-slides .swiper-slide-duplicate{
  display: none !important; /* au cas où la boucle est ON */
}
#home-hero .elementor-widget-slides .swiper-slide img{
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}

/* ===== DOMAINES superposés — pile isolée + ordre au-dessus ===== */
#home-domains{
  isolation: isolate;
  z-index: 10;
}

/* ===== Mobile : NE PAS casser tout le site, seulement là où tu veux neutraliser l'absolu ===== */
@media (max-width:768px){
  /* si tu avais une règle globale .elementor-position-absolute{position:static}, supprime-la */
  /* et garde une version ciblée si besoin : */
  /* #home-domains .elementor-position-absolute{ position: static !important; } */
}

/* (optionnel) debug rapide : encadre les clones si loop=ON */
/* #home-hero .elementor-widget-slides .swiper-slide-duplicate{ outline:2px dashed red; } */


/* Archives / Blog en blanc */
.archive,
.blog,
.post-type-archive {
  background: #fff !important;
  color: #111;
}

/* Nettoyage marges/cohérence titres */
.archive .page-title,
.blog .page-title {
  margin: 0 0 20px;
  font-weight: 800;
}


/* Layout 3 colonnes pour la page article */
.single .oc-article-layout {
  display: grid;
  grid-template-columns: 1fr minmax(0, 640px) 1fr; /* colonnes latérales étroites, contenu central max 640px */
  gap: 24px;
  align-items: start;
}

/* Colonnes latérales */
.single .oc-aside {
  display: grid;
  grid-template-rows: repeat(3, auto);
  gap: 16px;
  position: sticky;
  top: 80px; /* colle visuellement en défilement, ajuste si nécessaire */
}

/* Images des colonnes latérales */
.single .oc-aside .oc-aside-img img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border-radius: 8px;
}

/* Colonne contenu */
.single .oc-article-content {
  background: #fff;
  color: #111;
}

/* Titre & image à la une si le thème la place dans le contenu */
.single .entry-title { font-weight: 800; line-height: 1.2; margin-bottom: 12px; }
.single .post-thumbnail img, 
.single .entry-header img,
.single .single-thumb {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border-radius: 8px;
  margin-bottom: 16px;
}

/* Responsive : en-dessous de 1024px, on passe à 1 colonne (les 6 images se placent au-dessus puis le texte) */
@media (max-width: 1024px){
  /* ✅ Mise en page stable : article 3 colonnes (images + contenu + images) */
.single .oc-article-layout {
  display: grid !important;
  grid-template-columns: 1.5fr minmax(720px, 860px) 1.5fr !important;
  gap: 32px !important;
  align-items: start;
  max-width: 1600px;
  margin: 0 auto;
}

.single .oc-aside {
  display: grid;
  grid-template-rows: repeat(3, auto);
  gap: 18px;
  position: sticky;
  top: 84px;
}

.single .oc-aside .oc-aside-img img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border-radius: 12px;
  transition: transform .25s ease;
}

.single .oc-aside .oc-aside-img img:hover {
  transform: scale(1.03);
}

/* Responsive tablette / mobile */
@media (max-width: 1024px){
  .single .oc-article-layout {
    grid-template-columns: 1fr !important;
    gap: 20px;
  }
  .single .oc-aside {
    position: static;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: none;
    order: -1;
  }
}

@media (max-width: 640px){
  .single .oc-aside {
    grid-template-columns: repeat(2, 1fr);
  }
}

  .single .oc-aside {
    position: static;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: none;
    grid-auto-rows: auto;
    order: -1;      /* galeries au-dessus du contenu */
  }
  .single .oc-aside--right { margin-top: 8px; }
}

/* Responsive mobile strict : 2 colonnes d’images */
@media (max-width: 640px){
  .single .oc-aside { grid-template-columns: repeat(2, 1fr); }
}



/* === Mise en page article : 3 colonnes (gauche images / contenu / droite images) === */
.single .oc-article-layout {
  display: grid;
  grid-template-columns: 1.2fr minmax(0, 720px) 1.2fr; /* colonnes latérales plus larges */
  gap: 32px;
  align-items: start;
}

/* Colonnes latérales : 3 images empilées, grandes */
.single .oc-aside {
  display: grid;
  grid-template-rows: repeat(3, auto);
  gap: 18px;
  position: sticky;
  top: 84px; /* ajuste si ton header est plus/moins haut */
}

/* Cartes images */
.single .oc-aside .oc-aside-img {
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.15);
}

/* Images : grandes, nettes, prêtes pour zoom */
.single .oc-aside .oc-aside-img img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  cursor: zoom-in;
  transition: transform .25s ease;
}
.single .oc-aside .oc-aside-img img:hover { transform: scale(1.03); }

/* Zone contenu */
.single .oc-article-content {
  background: #fff;
  color: #111;
}

/* Image à la une dans le flux (si injectée dans le contenu) */
.single .post-thumbnail img,
.single .entry-header img,
.single .single-thumb {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border-radius: 12px;
  margin-bottom: 16px;
}

/* Responsive : en-dessous de 1024px, tout en 1 colonne, les images passent au-dessus */
@media (max-width: 1024px){
  .single .oc-article-layout { grid-template-columns: 1fr; }
  .single .oc-aside {
    position: static;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: none;
    gap: 12px;
    order: -1; /* galeries au-dessus du texte */
  }
  .single .oc-aside--right { margin-top: 10px; }
}

/* Mobile : grille 2 colonnes pour plus grand rendu */
@media (max-width: 640px){
  .single .oc-aside { grid-template-columns: repeat(2, 1fr); }
}

/* Conteneur lightbox caché par défaut */
.oc-lightbox-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.85);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

/* Image zoomée */
.oc-lightbox-overlay img {
  max-width: 90%;
  max-height: 90%;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.5);
}

/* Curseur fermeture */
.oc-lightbox-overlay.active { display: flex; }
.oc-lightbox-overlay::after {
  content: "✕";
  position: absolute;
  top: 20px; right: 30px;
  color: #fff;
  font-size: 32px;
  cursor: pointer;
}




/* 1) Élargir le conteneur de la page article (selon thèmes) */
.single .container,
.single .site-container,
.single .site,
.single .content-area,
.single .site-main,
.single #primary,
.single .wrap {
  max-width: 1400px !important;  /* augmente la largeur utile */
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}

/* 2) Donner plus d'espace aux colonnes d'images */
.single .oc-article-layout {
  display: grid;
  grid-template-columns: 1.6fr minmax(640px, 760px) 1.6fr; /* images plus larges */
  gap: 36px;
  align-items: start;
  max-width: 1600px;    /* largeur totale du bloc */
  margin: 0 auto;       /* centré */
}

/* 3) Les figures d'images : plein espace, sans contrainte cachée du thème */
.single .oc-aside { width: 100%; }
.single .oc-aside .oc-aside-img { overflow: hidden; border-radius: 12px; box-shadow: 0 6px 20px rgba(0,0,0,.15); }
.single .oc-aside .oc-aside-img img {
  width: 100% !important;
  height: auto !important;
  display: block;
  object-fit: cover;
  cursor: zoom-in;
  transition: transform .25s ease;
}
.single .oc-aside .oc-aside-img img:hover { transform: scale(1.03); }

/* 4) Empêcher le thème de restreindre la largeur du contenu central */
.single .entry-content, 
.single .post-content {
  max-width: none !important;
}

/* Responsive inchangé (tu peux garder tes règles mobiles existantes) */
@media (max-width: 1024px){
  .single .oc-article-layout { grid-template-columns: 1fr; gap: 20px; }
}


/* Conteneur global plus large sur les articles */
.single .container,
.single .site-container,
.single .site,
.single .content-area,
.single .site-main,
.single #primary,
.single .wrap {
  max-width: 1760px !important;   /* augmente si tu veux (jusqu'à 1920px) */
  width: 100%;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}

/* Grille 3 colonnes : images plus présentes, texte confortable */
.single .oc-article-layout {
  display: grid;
  grid-template-columns: 1.8fr minmax(780px, 920px) 1.5fr; /* élargis/resserre ici */
  gap: 40px;
  align-items: start;
  max-width: 1800px;           /* largeur du bloc grille */
  margin: 0 auto;
}

/* Images latérales : grandes, nettes */
.single .oc-aside .oc-aside-img img{
  width: 100% !important; height: auto !important; object-fit: cover;
}

/* Le contenu central ne se fait pas écraser par des styles de thème */
.single .entry-content, .single .post-content { max-width: none !important; }

/* Breakpoints */
@media (max-width: 1280px){
  .single .oc-article-layout{
    grid-template-columns: 1.4fr minmax(640px, 760px) 1.4fr;
    gap: 32px;
  }
}
@media (max-width: 1024px){
  .single .oc-article-layout{ grid-template-columns: 1fr; gap: 20px; }
  .single .oc-aside{ position: static; grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px){
  .single .oc-aside{ grid-template-columns: repeat(2, 1fr); }
}


/* Overlay lightbox */
.oc-lightbox-overlay{
  position:fixed; inset:0; z-index:9999;
  display:none; align-items:center; justify-content:center;
  background:rgba(0,0,0,.9);
}
.oc-lightbox-overlay.active{ display:flex; }

/* Conteneur visuel pour permettre le zoom/pan */
.oc-lightbox-stage{
  position:relative;
  max-width: 98vw;  /* plus large qu'avant */
  max-height: 98vh;
  overflow:hidden;          /* on masque les débords quand on zoome */
  touch-action:none;        /* meilleur contrôle du geste */
  cursor: grab;
}
.oc-lightbox-stage.grabbing{ cursor: grabbing; }

/* L'image qu'on va transformer (scale/translate) */
.oc-lightbox-img{
  display:block;
  user-select:none;
  will-change: transform;
  transform-origin: center center;
  /* au chargement, on “fit” dans la stage */
  max-width:100%;
  max-height:100%;
  border-radius:10px;
  box-shadow:0 12px 40px rgba(0,0,0,.55);
}

/* Contrôles */
.oc-lightbox-close, .oc-lightbox-prev, .oc-lightbox-next{
  position:absolute; top:50%; transform:translateY(-50%);
  width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.12); color:#fff; border-radius:9999px; cursor:pointer;
  backdrop-filter: blur(4px);
}
.oc-lightbox-close{ top:24px; right:24px; transform:none; }
.oc-lightbox-prev{ left:24px; }
.oc-lightbox-next{ right:24px; }
.oc-lightbox-btn{ font-size:22px; line-height:1; }
.oc-lightbox-caption{
  position:absolute; left:0; right:0; bottom:18px; text-align:center;
  color:#eee; font-size:14px; padding:6px 12px;
  text-shadow:0 2px 8px rgba(0,0,0,.8);
}

/* Body sans scroll quand ouvert */
.oc-noscroll{ overflow:hidden; }


/* Carré centré */
.avatar img {
  width: 200px; height: 200px;
  object-fit: cover; object-position: center;
  display: block; margin: 0 auto;
  border-radius: 12px; /* 50% pour rond */
}

/* Rond parfait */
.avatar--round img {
  width: 200px; height: 200px;
  object-fit: cover; object-position: center;
  display: block; margin: 0 auto;
  border-radius: 50%;
}

/* ✅ Correction nette des images floues (articles, actualités, catégories) */
.archive .post-thumbnail img,
.blog .post-thumbnail img,
body.category .post-thumbnail img,
.oc-news .ekit-post-card img,
.oc-news .elementor-post__thumbnail img,
.single .post-thumbnail img {
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  object-fit: contain !important;   /* évite d’étirer l’image */
  image-rendering: auto;
  display: block !important;
  margin: 0 auto;
}

/* === Articles : titre et image à la une WP User Frontend === */

/* Titre plus discret */
.oc-single-title {
  font-size: 1.8rem !important;       /* ~28px */
  line-height: 1.3 !important;
  font-weight: 700 !important;
  text-align: center !important;
  margin: 12px auto 18px !important;
  max-width: 900px !important;
  color: #111 !important;
}

/* Image à la une agrandie et centrée */
.oc-single-thumb-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: 24px;
}

.oc-single-thumb {
  width: 100%;
  max-width: 1200px;        /* élargie dans la colonne centrale */
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 8px 24px rgba(0,0,0,.15);
}

/* Sur mobile : image pleine largeur, moins haute */
@media (max-width: 768px){
  .oc-single-thumb {
    max-width: 100%;
    border-radius: 8px;
  }
  .oc-single-title {
    font-size: 1.4rem !important;
  }
}

/* === Image à la une : effet zoom harmonisé avec les colonnes latérales === */

/* Conteneur centré et espacé */
.single .post-thumbnail,
.single .entry-header,
.single .single-thumb {
  display: flex;
  justify-content: center;
  margin-bottom: 28px;
}

/* Image principale */
.single .post-thumbnail img,
.single .entry-header img,
.single .single-thumb img {
  width: 100%;
  max-width: 1200px;             /* pleine largeur dans la colonne centrale */
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 8px 24px rgba(0,0,0,.15);
  transition: transform .25s ease, box-shadow .25s ease;
  cursor: zoom-in;
}

/* Effet zoom doux au survol */
.single .post-thumbnail img:hover,
.single .entry-header img:hover,
.single .single-thumb img:hover {
  transform: scale(1.05);
  box-shadow: 0 12px 32px rgba(0,0,0,.25);
}

/* Titre d’article harmonisé */
.single .entry-title {
  font-size: 1.8rem !important;
  text-align: center;
  margin: 0 auto 16px;
  font-weight: 700;
  max-width: 900px;
  color: #111;
}

/* Mobile */
@media (max-width:768px){
  .single .entry-title {
    font-size: 1.4rem !important;
  }
  .single .post-thumbnail img {
    max-width: 100%;
  }
}


/* === Image à la une agrandie et déverrouillée (Hello Elementor + WPUF) === */

/* Force la section principale à se détendre */
.single .site-main,
.single .site-content,
.single .content-area,
.single .elementor-location-single,
.single .elementor-container,
.single .elementor-section-wrap,
.single .elementor-column,
.single .elementor-widget-wrap {
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 auto !important;
}

/* Conteneur image : pleine largeur */
.single .post-thumbnail,
.single .entry-header {
  width: 100vw !important;             /* pleine largeur de la fenêtre */
  margin-left: calc(50% - 50vw) !important;  /* recentre en sortant du cadre */
  margin-right: calc(50% - 50vw) !important;
  overflow: hidden !important;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Image elle-même : très grande, nette, recadrée */
.single .post-thumbnail img,
.single .entry-header img,
.single .single-thumb img {
  width: 100% !important;
  height: auto !important;
  max-height: 720px;            /* ajuste la hauteur visible ici */
  object-fit: cover !important;
  border-radius: 0 !important;  /* pleine largeur = pas de coins arrondis */
  display: block;
  transition: transform .3s ease, box-shadow .3s ease;
  cursor: zoom-in;
}

/* Effet zoom doux */
.single .post-thumbnail img:hover,
.single .entry-header img:hover {
  transform: scale(1.04);
  box-shadow: 0 16px 48px rgba(0,0,0,.35);
}

/* Titre : harmonisé et centré sous la photo */
.single .entry-title {
  font-size: 1.8rem !important;
  font-weight: 700;
  text-align: center;
  margin: 24px auto;
  max-width: 960px;
  color: #111;
}

/* Mobile : hauteur réduite, image adaptée */
@media (max-width: 768px) {
  .single .post-thumbnail img,
  .single .entry-header img {
    max-height: 400px;
  }
  .single .entry-title {
    font-size: 1.4rem !important;
  }
}

/* === Elementor : images pleine taille nettes === */
.elementor img,
.elementor-widget-image img,
.elementor-widget-posts img,
.elementor-widget-posts-carousel img {
  width: 100%;
  height: auto !important;
  object-fit: cover !important;
  image-rendering: auto !important;
  filter: none !important;
  transform: none !important;
}


/* === Images nettes et non compressées === */
.single .post-thumbnail img,
.single .entry-header img,
.single .single-thumb,
.elementor img,
.elementor-widget-image img,
.elementor-widget-posts img {
  width: 100%;
  height: auto !important;
  object-fit: cover !important;
  image-rendering: auto !important;
  filter: none !important;
  transform: none !important;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.15);
}


/* --- TROMBINOSCOPE CENTRÉ, AVEC ANIMATION --- */
.trombinoscope {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 30px;
  justify-items: center;
  align-items: center;
  text-align: center;
  padding: 20px;
}

/* Chaque fiche membre */
.trombinoscope-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #fff;
  padding: 20px;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  max-width: 280px;
  text-align: center;
  transition: all 0.3s ease-in-out;
  border: 3px solid transparent;
}

/* Animation au survol */
.trombinoscope-item:hover {
  transform: translateY(-8px);
  border-color: #2e7d32; /* 💚 couleur verte ONG CAV (modifiable) */
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}

/* Image du membre */
.trombinoscope-item img {
  width: 180px;
  height: auto;
  border-radius: 10px;
  object-fit: cover;
  margin-bottom: 10px;
}

/* Nom */
.trombinoscope-item h3 {
  font-weight: 600;
  margin: 8px 0 4px 0;
  color: #000;
}

/* Fonction */
.trombinoscope-item p {
  font-style: italic;
  color: #333;
  margin: 0;
}

/* --- Responsive --- */
@media (max-width: 768px) {
  .trombinoscope {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .trombinoscope {
    grid-template-columns: 1fr;
  }
}


/* --- Styles uniformes pour le trombinoscope --- */
.trombinoscope-item img {
  width: 180px;           /* taille identique */
  height: 180px;          /* carré parfait */
  object-fit: cover;      /* rogne proprement au centre */
  border-radius: 50%;     /* rend l’image ronde */
  border: 3px solid #2e7d32; /* contour vert ONG CAV */
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
  margin-bottom: 10px;
  transition: transform 0.3s ease;
}

/* effet au survol */
.trombinoscope-item img:hover {
  transform: scale(1.05);
}

/* --- STYLE GLOBAL DU TROMBINOSCOPE ONG CAV --- */
.trombinoscope {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 30px;
  justify-items: center;
  align-items: center;
  text-align: center;
  padding: 20px;
}

.trombinoscope-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #fff;
  padding: 20px;
  border-radius: 16px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease-in-out;
  max-width: 280px;
  position: relative;
}

.trombinoscope-item::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 16px;
  background: radial-gradient(circle, rgba(46,125,50,0.15) 0%, transparent 70%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.trombinoscope-item:hover::before {
  opacity: 1;
}

.trombinoscope-item img {
  width: 180px;
  height: 180px;
  object-fit: cover;
  border-radius: 50%;
  border: 3px solid #2e7d32;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
  margin-bottom: 10px;
  z-index: 1;
}

.trombinoscope-item h3 {
  font-weight: 600;
  margin: 8px 0 4px 0;
  color: #000;
}

.trombinoscope-item p {
  color: #333;
  font-size: 15px;
  margin: 0;
}

@media (max-width: 768px) {
  .trombinoscope {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .trombinoscope {
    grid-template-columns: 1fr;
  }
}

/* --- STYLE TROMBINOSCOPE ONG CAV (cartes plus grandes) --- */
.trombinoscope {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); /* plus large */
  gap: 35px; /* espace entre les cartes */
  justify-items: center;
  align-items: center;
  text-align: center;
  padding: 30px;
}

.trombinoscope-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #fff;
  padding: 25px; /* plus d’espace intérieur */
  border-radius: 18px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  transition: all 0.3s ease-in-out;
  max-width: 330px; /* largeur maximale augmentée */
  position: relative;
}

/* Halo vert au survol */
.trombinoscope-item::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 18px;
  background: radial-gradient(circle, rgba(46,125,50,0.15) 0%, transparent 70%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.trombinoscope-item:hover::before {
  opacity: 1;
}

/* Portraits ronds agrandis */
.trombinoscope-item img {
  width: 220px;  /* agrandi de 180 → 220 */
  height: 220px;
  object-fit: cover;
  border-radius: 50%;
  border: 4px solid #2e7d32;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
  margin-bottom: 12px;
  z-index: 1;
}

/* Nom */
.trombinoscope-item h3 {
  font-weight: 600;
  margin: 10px 0 5px 0;
  color: #000;
  font-size: 1.1rem;
}

/* Fonction (gras italique déjà présent) */
.trombinoscope-item p {
  color: #333;
  font-size: 16px;
  margin: 0;
}

/* Responsive */
@media (max-width: 768px) {
  .trombinoscope {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .trombinoscope {
    grid-template-columns: 1fr;
  }

  .trombinoscope-item img {
    width: 180px; /* réduit sur mobile */
    height: 180px;
  }
}






/* Assurer une bonne mise en page mobile pour les articles */
@media (max-width: 480px) {
  .single-post .entry-content {
    line-height: 1.5;       /* meilleure interlignage */
    font-size: 1rem;        /* taille de police lisible */
    padding: 0 15px;        /* marges latérales */
  }
  .single-post .entry-content h2,
  .single-post .entry-content h3 {
    margin-top: 1.2em;
    margin-bottom: 0.6em;
    font-size: 1.2rem;
  }
  .single-post .entry-content img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 1em auto;
  }
}



.single-post .entry-content p {
  font-weight: normal;      /* désactive styles lourds */
}
.single-post .entry-content p strong {
  font-weight: bold;
}
.single-post .entry-content p em {
  font-style: italic;
}
.single-post .entry-content p u {
  text-decoration: underline;
}



/* ✅ Single : supprimer le titre natif du thème pour éviter le doublon */
body.single-post header.entry-header,
body.single-post .page-header {
  display: none !important;
}

/* 🔥 AUTO — Colonnes latérales infinies : autant de photos que tu veux */
.single .oc-aside {
  display: grid !important;
  grid-auto-rows: auto !important;      /* chaque photo prend sa place */
  grid-template-rows: none !important;  /* supprime toutes les limites */
  gap: 18px !important;                 /* espace entre les images */
}




/* ================================ PALETTE ONG – COULEURS UNIFORMES ================================ */ :root { --ong-bleu: #0A3D62; --ong-vert: #2ECC71; --ong-beige: #F8F4EF; --ong-noir: #1A1A1A; --ong-blanc: #FFFFFF; } /* Fond général */ body { background-color: var(--ong-beige) !important; color: var(--ong-noir)} /* ================================ TITRES – Harmonisation typographique ================================ */ h1, h3, h4, h5, h6 { font-family: 'Ruwudu', serif !important; color: var(--ong-bleu) !important; margin-bottom: 18px !important; } h1 { font-size: 45px !important; } h2 { font-size: 32px !important; } h3 { font-size: 24px !important; } /* ================================ PARAGRAPHES ================================ */ p { font-family: 'Poppins', sans-serif !important; font-size: 17px !important; line-height: 1.6 !important; margin-bottom: 18px !important; color: var(--ong-noir) !important; } /* ================================ BOUTONS ================================ */ button, .elementor-button, input[type="submit"], a.button { background-color: var(--ong-vert) !important; color: var(--ong-blanc) !important; border-radius: 6px !important; padding: 12px 25px !important; font-weight: 600 !important; text-transform: uppercase !important; border: none !important; } /* Le hover reste neutre — Elementor contrôlera les couleurs */ button:hover, .elementor-button:hover, input[type="submit"]:hover, a.button:hover { opacity: 0.9; } button:hover, .elementor-button:hover, input[type="submit"]:hover, a.button:hover { background-color: #27AE60 !important; } /* ================================ IMAGES – QUALITÉ & ALIGNEMENT ================================ */ img { width: 100% !important; height: auto !important; image-rendering: auto !important; border-radius: 6px !important; } /* Empêcher le flou dû à la compression */ .elementor-image img, .wp-post-image { object-fit: cover !important; } /*******************************
  MENU UAE — STYLES DÉDIÉS
  Appliqué UNIQUEMENT au header (pas au footer)
*******************************/

/* Liens du menu principal dans le header */
header .hfe-nav-menu a.hfe-menu-item {
  color: #000;
  font-weight: 600;
}

/* Liens du sous-menu */
header .hfe-nav-menu .sub-menu a.hfe-sub-menu-item {
  color: #000;
  font-weight: 500;
}

/* Hamburger */
header .hfe-nav-menu__toggle,
header .hfe-nav-menu__toggle svg,
header .hfe-nav-menu__toggle i {
  color: #000;
  fill: #000;
  stroke: #000;
}

/* Fond des sous-menus */
header .hfe-nav-menu .sub-menu {
  background: #ffffff;
  border-radius: 6px;
  padding: 5px 0;
}

/* Séparateurs */
header .hfe-nav-menu .sub-menu li {
  border-bottom: 1px solid rgba(0,0,0,0.08);
}
header .hfe-nav-menu .sub-menu li:last-child {
  border-bottom: none;
}

/* Menu mobile */
@media (max-width: 979px){
  header .hfe-nav-menu a.hfe-menu-item,
  header .hfe-nav-menu a.hfe-sub-menu-item {
    color: #000;
  }

  header .hfe-nav-menu .sub-menu {
    background: #fff;
    padding-left: 10px;
  }

  nav ul, .ekit-navbar-nav {
    display: block;
  }
}

/* =======================================================
   🎨 RÉHARMONISATION MENU HEADER (sans impacter le footer)
======================================================= */

/* --- Menu principal --- */
header .hfe-nav-menu a.hfe-menu-item {
  color: #000000 !important;            /* texte noir sur fond clair */
  background: transparent !important;
}

/* --- Menu principal : hover --- */
header .hfe-nav-menu a.hfe-menu-item:hover {
  color: #FBC02D !important;            /* jaune ONG pour hover */
}

/* --- Sous-menus --- */
header .hfe-nav-menu .sub-menu {
  background: #ffffff !important;       /* fond clair pour le sous-menu */
}
header .hfe-nav-menu .sub-menu a.hfe-sub-menu-item {
  color: #000000 !important;            /* texte noir dans le sous-menu */
}
header .hfe-nav-menu .sub-menu a.hfe-sub-menu-item:hover {
  color: #FBC02D !important;            /* hover jaune dans le sous-menu */
}

/* --- Version mobile (menu burger) --- */
@media (max-width: 979px) {
  header .hfe-nav-menu a.hfe-menu-item,
  header .hfe-nav-menu a.hfe-sub-menu-item {
    color: #000000 !important;
  }
  header .hfe-nav-menu .sub-menu {
    background: #ffffff !important;
  }
}

/* ======================================================
   🔓 DÉVERROUILLAGE COULEURS MENU HEADER Elementor #591
   (corrige texte et fond du menu sans toucher au footer)
====================================================== */

/* Liens du menu principal */
.elementor-591 .elementor-element.elementor-element-9f35492 .menu-item a.hfe-menu-item {
  color: #000000 !important;          /* texte noir */
  background: transparent !important; /* pas de fond parasite */
}

/* Hover menu principal */
.elementor-591 .elementor-element.elementor-element-9f35492 .menu-item a.hfe-menu-item:hover {
  color: #FBC02D !important;          /* jaune ONG au survol */
}

/* Sous-menu */
.elementor-591 .elementor-element.elementor-element-9f35492 .sub-menu {
  background: #ffffff !important;     /* fond clair */
  border-radius: 6px !important;
}

/* Liens du sous-menu */
.elementor-591 .elementor-element.elementor-element-9f35492 .sub-menu a.hfe-sub-menu-item {
  color: #000000 !important;
}

/* Hover du sous-menu */
.elementor-591 .elementor-element.elementor-element-9f35492 .sub-menu a.hfe-sub-menu-item:hover {
  color: #FBC02D !important;
  background: rgba(0,0,0,0.05) !important;
}

/* Burger et menu mobile */
@media (max-width: 979px) {
  .elementor-591 .elementor-element.elementor-element-9f35492 nav.hfe-dropdown,
  .elementor-591 .elementor-element.elementor-element-9f35492 .sub-menu {
    background: #ffffff !important;
  }

  .elementor-591 .elementor-element.elementor-element-9f35492 nav.hfe-dropdown a.hfe-menu-item,
  .elementor-591 .elementor-element.elementor-element-9f35492 nav.hfe-dropdown a.hfe-sub-menu-item {
    color: #000000 !important;
  }
}
/* ======================================================
   ✴️ Taille de police du menu principal (desktop + mobile)
====================================================== */

/* Menu principal */
.elementor-591 .elementor-element.elementor-element-9f35492 .menu-item a.hfe-menu-item {
  font-size: 18px !important;       /* taille recommandée */
  font-weight: 600 !important;      /* solide mais lisible */
  letter-spacing: 0.3px;            /* légère respiration entre les lettres */
}

/* Sous-menu : un peu plus petit */
.elementor-591 .elementor-element.elementor-element-9f35492 .sub-menu a.hfe-sub-menu-item {
  font-size: 16px !important;
  font-weight: 500 !important;
}

/* Menu mobile : taille légèrement réduite pour tenir dans l’écran */
@media (max-width: 979px) {
  .elementor-591 .elementor-element.elementor-element-9f35492 .menu-item a.hfe-menu-item,
  .elementor-591 .elementor-element.elementor-element-9f35492 .sub-menu a.hfe-sub-menu-item {
    font-size: 16px !important;
  }
}

/* ======================================================
   ✅ Couleur du COPYRIGHT en blanc (footer Elementor)
====================================================== */

/* Texte du copyright ONG CAV-TOGO */
.elementor-545 .elementor-element.elementor-element-7d80c10 p {
  color: #ffffff !important;        /* texte blanc pur */
  font-size: 14px !important;       /* taille lisible mais discrète */
  text-align: center !important;    /* centré */
  margin: 0 !important;
  opacity: 0.95;                    /* léger adoucissement */
}

/* Liens éventuels dans le copyright */
.elementor-545 .elementor-element.elementor-element-7d80c10 p a {
  color: #ffffff !important;
  text-decoration: none !important;
}
.elementor-545 .elementor-element.elementor-element-7d80c10 p a:hover {
  text-decoration: underline !important;
  opacity: 1;
}

/* ============================================================
   ✅ Supprime le fond neutre du diaporama (section accueil)
============================================================ */

.elementor-element-8d8ab5b,
.elementor-element-8d8ab5b .elementor-background-overlay,
.elementor-element-8d8ab5b .elementor-background,
.elementor-element-8d8ab5b .elementor-background-slideshow,
.elementor-element-8d8ab5b .elementor-background-slideshow__slide {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* Supprime les couches de préchargement */
.elementor-element-8d8ab5b::before,
.elementor-element-8d8ab5b::after {
  background: transparent !important;
  background-color: transparent !important;
}

/* Transition fluide d'apparition */
.elementor-element-8d8ab5b .elementor-background-slideshow {
  opacity: 1 !important;
  animation: fadeInHero 0.6s ease-in-out;
}
@keyframes fadeInHero {
  from { opacity: 0; }
  to { opacity: 1; }
}


/* ✅ ARTICLES — images JAMAIS coupées */
.single-post .post-thumbnail img,
.single-post .entry-header img,
.single-post .single-thumb img,
.single-post .entry-content img {
    object-fit: contain !important;   /* affiche l’image entière */
    object-position: center top !important;
    height: auto !important;
    max-height: none !important;
}

.single-post .post-thumbnail,
.single-post .entry-header {
    background: #000;
}

/* ===== ARTICLE DESKTOP : texte plus large, photos repoussées ===== */
@media (min-width: 1025px){

  .single .oc-article-layout{
    display: grid !important;
    grid-template-columns: 180px minmax(850px, 1050px) 180px !important;
    gap: 56px !important;
    max-width: 1650px !important;
    width: 100% !important;
    margin: 0 auto !important;
    align-items: start !important;
  }

  .single .oc-article-content{
    max-width: 1050px !important;
    width: 100% !important;
    margin: 0 auto !important;
  }

  .single .oc-article-content p,
  .single .oc-article-content li{
    font-size: 18px !important;
    line-height: 1.75 !important;
  }

  .single .oc-aside{
    width: 180px !important;
    max-width: 180px !important;
    display: grid !important;
    gap: 18px !important;
    position: sticky !important;
    top: 90px !important;
  }

  .single .oc-aside-img img{
    width: 180px !important;
    max-width: 180px !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
    border-radius: 10px !important;
  }
}
/* ===== ONG CAV — Correction finale desktop article ===== */
@media screen and (min-width: 1025px) {

  body.single-post .oc-article-layout {
    display: grid !important;
    grid-template-columns: 220px 	minmax(950px, 1100px) 220px         !important;
    column-gap: 70px !important;
    max-width: 1400px !important;
    width: 100% !important;
    margin: 0 auto !important;
    align-items: start !important;
  }

  body.single-post .oc-aside--left {
    grid-column: 1 / 2 !important;
    grid-row: 1 !important;
  }

  body.single-post .oc-article-content {
    grid-column: 2 / 3 !important;
    grid-row: 1 !important;
    max-width: 1100px !important;
    width: 100% !important;
  }

  body.single-post .oc-aside--right {
    grid-column: 3 / 4 !important;
    grid-row: 1 !important;
  }

  body.single-post .oc-aside {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-auto-flow: row !important;
    gap: 18px !important;
    width: 190px !important;
    max-width: 190px !important;
    position: sticky !important;
    top: 90px !important;
  }

  body.single-post .oc-aside-img,
  body.single-post .oc-aside-img img {
    display: block !important;
    width: 240px !important;
    max-width: 240px !important;
    height: auto !important;
  }
}






/* Masquer seulement les colonnes vides, pas les vraies colonnes photos */
body.single-post > .oc-article-layout > .oc-aside:empty {
  display: none !important;
}


/* Article desktop : photos gauche + texte + photos droite + articles récents */
@media screen and (min-width: 1025px) {

  body.single-post .oc-article-layout {
    display: grid !important;
    grid-template-columns: 220px minmax(820px, 1000px) 220px 230px !important;
    column-gap: 28px !important;
    max-width: 1750px !important;
    margin: 0 auto !important;
    align-items: start !important;
  }

  body.single-post .oc-aside--left {
    grid-column: 1 !important;
  }

  body.single-post .oc-article-content {
    grid-column: 2 !important;
  }

  body.single-post .oc-aside--right {
    grid-column: 3 !important;
  }

  body.single-post .oc-recent-posts {
    grid-column: 4 !important;
    position: sticky !important;
    top: 90px !important;
    background: #fff !important;
    padding: 14px !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 14px rgba(0,0,0,.08) !important;
    font-size: 13px !important;
  }

  body.single-post .oc-recent-posts h3 {
    font-size: 16px !important;
    margin: 0 0 12px !important;
    color: #0A3D62 !important;
  }

  body.single-post .oc-recent-item {
    margin-bottom: 12px !important;
    border-bottom: 1px solid #eee !important;
    padding-bottom: 8px !important;
  }

  body.single-post .oc-recent-cat {
    display: block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #2E7D32 !important;
    margin-bottom: 3px !important;
  }

  body.single-post .oc-recent-item a {
    color: #111 !important;
    text-decoration: none !important;
    line-height: 1.35 !important;
  }

  body.single-post .oc-recent-item a:hover {
    color: #2E7D32 !important;
    text-decoration: underline !important;
  }
}

/* Forcer l’affichage des 6 photos même avec la colonne articles récents */
@media screen and (min-width: 1025px) {

  body.single-post .oc-article-layout {
    display: grid !important;
    grid-template-columns: 220px minmax(760px, 950px) 220px 240px !important;
    column-gap: 24px !important;
    max-width: 1680px !important;
    margin: 0 auto !important;
    align-items: start !important;
  }

  body.single-post .oc-aside--left {
    grid-column: 1 !important;
    display: grid !important;
  }

  body.single-post .oc-article-content {
    grid-column: 2 !important;
  }

  body.single-post .oc-aside--right {
    grid-column: 3 !important;
    display: grid !important;
  }

  body.single-post .oc-recent-posts {
    grid-column: 4 !important;
    display: block !important;
  }

  body.single-post .oc-aside {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    width: 280px !important;
    max-width: 280px !important;
    position: sticky !important;
    top: 90px !important;
  }

  body.single-post .oc-aside-img,
  body.single-post .oc-aside-img img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 220px !important;
    max-width: 220px !important;
    height: auto !important;
  }
}

/* Correction finale : photos visibles + colonne articles récents */
@media screen and (min-width:1025px){

  body.single-post .oc-article-layout{
    display:grid !important;
    grid-template-columns: 230px minmax(720px, 920px) 230px 220px !important;
    gap:24px !important;
    max-width:1650px !important;
    margin:0 auto !important;
    align-items:start !important;
  }

  body.single-post .oc-aside--left{
    grid-column:1 !important;
    display:grid !important;
  }

  body.single-post .oc-article-content{
    grid-column:2 !important;
    max-width:920px !important;
    width:100% !important;
  }

  body.single-post .oc-aside--right{
    grid-column:3 !important;
    display:grid !important;
  }

  body.single-post .oc-recent-posts{
    grid-column:4 !important;
    display:block !important;
    width:220px !important;
  }

  body.single-post .oc-aside{
    width:230px !important;
    max-width:230px !important;
    grid-template-columns:1fr !important;
    gap:18px !important;
    position:sticky !important;
    top:90px !important;
  }

  body.single-post .oc-aside-img,
  body.single-post .oc-aside-img img{
    display:block !important;
    width:230px !important;
    max-width:230px !important;
    height:auto !important;
    visibility:visible !important;
    opacity:1 !important;
  }
}

/* Métadonnées article */
.oc-article-meta{
    text-align:center;
    font-size:15px;
    color:#666;
    margin-bottom:50px !important;
}

.oc-article-meta .oc-author{
    display:block;
    margin-bottom:8px;
}

.oc-article-meta .oc-date{
    display:block;
}


/* Slider automatique des photos supplémentaires après les 6 latérales */
.oc-extra-slider {
  margin: 50px 0 30px;
}

.oc-extra-slider h3 {
  text-align: center;
  margin-bottom: 18px;
  color: #0A3D62;
}

.oc-extra-slider-track {
  display: flex;
  gap: 18px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 12px;
}

.oc-extra-slide {
  flex: 0 0 80%;
  scroll-snap-align: center;
}

.oc-extra-slide img{
  width:100%;
  max-height:420px;
  height:auto !important;
  object-fit:contain !important;
  border-radius:12px;
  background:#f5f5f5;
}

@media (max-width: 768px) {
  .oc-extra-slide {
    flex: 0 0 90%;
  }

  .oc-extra-slide img {
    height: 280px;
  }
}

.single-post .post-thumbnail img,
.single-post .wp-post-image {
    max-height: 300px;
    width: auto;
    margin: 0 auto;
    display: block;
    object-fit: contain;
}

@media screen and (min-width:1025px){
  body.single-post .oc-article-layout{
    display:grid !important;
    grid-template-columns:220px minmax(720px, 920px) 220px 240px !important;
    gap:24px !important;
    max-width:1650px !important;
    margin:0 auto !important;
    align-items:start !important;
  }

  body.single-post .oc-aside--left{ grid-column:1 !important; }
  body.single-post .oc-article-content{ grid-column:2 !important; }
  body.single-post .oc-aside--right{ grid-column:3 !important; }
  body.single-post .oc-recent-posts{ grid-column:4 !important; display:block !important; }
}


/* =========================================================
   ONG CAV — structure article
   ========================================================= */

@media screen and (min-width: 1025px) {

  body.single-post .oc-article-layout {
    display: grid !important;
    grid-template-columns:
      280px
      minmax(0, 900px)
      280px
      240px !important;
    gap: 24px !important;
    align-items: start !important;
    width: min(100%, 1650px) !important;
    max-width: 1650px !important;
    margin: 0 auto !important;
  }

  body.single-post .oc-aside--left {
    grid-column: 1 !important;
  }

  body.single-post .oc-article-content {
    grid-column: 2 !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  body.single-post .oc-aside--right {
    grid-column: 3 !important;
  }

  body.single-post .oc-recent-posts {
    grid-column: 4 !important;
    display: block !important;
    min-width: 0 !important;
  }

  body.single-post .oc-aside {
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
    width: 220px !important;
    max-width: 220px !important;
  }
}

/* =========================================================
   Photos latérales
   ========================================================= */

body.single-post .oc-aside-img {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
}

body.single-post .oc-aside-img a {
  display: block !important;
}

body.single-post .oc-aside-img img,
body.single-post .oc-aside-photo {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  border-radius: 8px !important;
}

/* =========================================================
   Galerie horizontale des photos après la 6e
   ========================================================= */

body.single-post .oc-surplus-gallery {
  display: block !important;
  clear: both !important;
  width: 100% !important;
  margin: 45px 0 25px !important;
  overflow: hidden !important;
}

body.single-post .oc-surplus-gallery-title {
  margin: 0 0 18px !important;
  text-align: center !important;
}

body.single-post .oc-surplus-gallery-track {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 18px !important;
  width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x mandatory !important;
  scroll-behavior: smooth !important;
  padding: 4px 4px 16px !important;
}

body.single-post .oc-surplus-gallery-item {
  display: block !important;
  flex: 0 0 78% !important;
  width: 78% !important;
  max-width: 780px !important;
  margin: 0 !important;
  scroll-snap-align: center !important;
}

body.single-post .oc-surplus-gallery-item a {
  display: block !important;
  width: 100% !important;
}

body.single-post .oc-surplus-gallery-image {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 480px !important;
  object-fit: contain !important;
  background: #f5f5f5 !important;
  border-radius: 10px !important;
  image-rendering: auto !important;
}

/* =========================================================
   Mobile et tablette
   ========================================================= */

@media screen and (max-width: 1024px) {

  body.single-post .oc-article-layout {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
  }

  body.single-post .oc-article-content {
    order: 1 !important;
    width: 100% !important;
  }

  body.single-post .oc-aside--left {
    order: 2 !important;
  }

  body.single-post .oc-aside--right {
    order: 3 !important;
  }

  body.single-post .oc-recent-posts {
    order: 4 !important;
    width: 100% !important;
  }

  body.single-post .oc-aside {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: none !important;
    margin-top: 20px !important;
  }

  body.single-post .oc-surplus-gallery-item {
    flex-basis: 90% !important;
    width: 90% !important;
  }

  body.single-post .oc-surplus-gallery-image {
    max-height: 340px !important;
  }
}
/* =========================================================
   ONG CAV — Article v2 (priorité max)
   Colonnes photos plus larges + fond image à la une corrigé
   ========================================================= */

/* Bandes noires : fond blanc sur la une */
body.single-post .post-thumbnail,
body.single-post .entry-header,
body.single-post .oc-single-thumb-wrap {
  background: #ffffff !important;
}

/* Retire le cadre/ombre sur le contenu dans la grille */
body.single-post .oc-article-content {
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
}

/* Conteneur article plus large */
@media screen and (min-width: 1025px) {
  body.single-post .site-main,
  body.single-post .container,
  body.single-post .site-container,
  body.single-post #primary,
  body.single-post .wrap {
    max-width: 1820px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* 4 colonnes : photos ~320px | texte | photos ~320px | récents */
  body.single-post .oc-article-layout {
    display: grid !important;
    grid-template-columns:
      minmax(300px, 340px)
      minmax(0, 1fr)
      minmax(300px, 340px)
      minmax(200px, 240px) !important;
    column-gap: 28px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 1780px !important;
    margin: 0 auto !important;
  }

  body.single-post .oc-aside--left  { grid-column: 1 !important; }
  body.single-post .oc-article-content { grid-column: 2 !important; min-width: 0 !important; }
  body.single-post .oc-aside--right { grid-column: 3 !important; }
  body.single-post .oc-recent-posts {
    grid-column: 4 !important;
    position: sticky !important;
    top: 90px !important;
    background: #fff !important;
    padding: 14px !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 14px rgba(0,0,0,.08) !important;
    font-size: 13px !important;
  }

  /* Colonnes photos : pleine largeur de la piste (plus de plafond 180/220px) */
  body.single-post .oc-aside {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    position: sticky !important;
    top: 90px !important;
  }

  body.single-post .oc-aside-img,
  body.single-post .oc-aside-img a {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
  }

  body.single-post .oc-aside-img img,
  body.single-post .oc-aside-photo {
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 14px rgba(0,0,0,.12) !important;
    cursor: zoom-in;
  }
}

/* Tablette : grille 3 colonnes de photos au-dessus du texte */
@media screen and (max-width: 1024px) {
  body.single-post .oc-article-layout {
    display: flex !important;
    flex-direction: column !important;
  }
  body.single-post .oc-article-content { order: 1 !important; }
  body.single-post .oc-aside--left  { order: 2 !important; }
  body.single-post .oc-aside--right { order: 3 !important; }
  body.single-post .oc-recent-posts { order: 4 !important; width: 100% !important; }

  body.single-post .oc-aside {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: none !important;
    position: static !important;
  }

  body.single-post .oc-aside-img img,
  body.single-post .oc-aside-photo {
    width: 100% !important;
    max-width: none !important;
  }
}

@media screen and (max-width: 640px) {
  body.single-post .oc-aside {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* =========================================================
   ONG CAV — Addendum Article v2 + snippet v5 (surplus visible)
   À coller TOUT EN BAS du Customizer, APRÈS le bloc Article v2
   Supprime les anciens blocs v4 / v5 / v5b / v5c si encore présents
   Prérequis snippet #6 : v5 (oc-article-wrap + oc-surplus-gallery-below)
   ========================================================= */

/* Wrap v5 : grille en haut, galerie surplus en dessous (empilé) */
body.single-post .oc-article-wrap {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: 1780px !important;
  margin: 0 auto !important;
}

body.single-post .oc-article-wrap > .oc-article-layout {
  flex: 0 0 auto !important;
  width: 100% !important;
}

/* Galerie 7e+ : toujours visible, pleine largeur sous les 4 colonnes */
body.single-post .oc-surplus-gallery-below {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  clear: both !important;
  float: none !important;
  flex: 0 0 auto !important;
  order: 2 !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 1px !important;
  overflow: visible !important;
  margin: 48px 0 24px !important;
  padding: 24px 0 0 !important;
  border-top: 2px solid #e8e8e8 !important;
  position: relative !important;
  z-index: 20 !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

body.single-post .oc-surplus-gallery-below .oc-surplus-gallery {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  clear: both !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  overflow: visible !important;
}

body.single-post .oc-surplus-gallery-below .oc-surplus-gallery-title {
  display: block !important;
  visibility: visible !important;
  margin: 0 0 18px !important;
  text-align: center !important;
}

body.single-post .oc-surplus-gallery-below .oc-surplus-gallery-track {
  display: flex !important;
  visibility: visible !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 18px !important;
  width: 100% !important;
  min-height: 120px !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  padding: 4px 4px 16px !important;
  scroll-snap-type: x mandatory !important;
}

body.single-post .oc-surplus-gallery-below .oc-surplus-gallery-item {
  display: block !important;
  visibility: visible !important;
  flex: 0 0 78% !important;
  width: 78% !important;
  max-width: 780px !important;
  scroll-snap-align: center !important;
}

body.single-post .oc-surplus-gallery-below .oc-surplus-gallery-image {
  display: block !important;
  visibility: visible !important;
  width: 100% !important;
  height: auto !important;
  max-height: 480px !important;
  object-fit: contain !important;
  border-radius: 10px !important;
  background: #f5f5f5 !important;
}

@media screen and (min-width: 1025px) {

  /*
   * Article v2 : colonnes ~340px | texte | ~340px | ~240px, gap 28px
   * Pas de display:contents — la galerie reste sous la grille, pleine largeur
   */
  body.single-post .oc-surplus-gallery-below {
    margin-top: 56px !important;
  }

}

@media screen and (max-width: 1024px) {

  body.single-post .oc-surplus-gallery-below {
    margin-top: 32px !important;
    padding-top: 16px !important;
    border-top-width: 1px !important;
  }

  body.single-post .oc-surplus-gallery-below .oc-surplus-gallery-item {
    flex-basis: 90% !important;
    width: 90% !important;
  }

}

/* =========================================================
   ONG CAV — Accueil : supprimer le flash coloré avant le diapo
   À coller TOUT EN BAS du CSS additionnel (Customizer)
   =========================================================
   Cause : Smart Slider #7 (n2-ss-7) charge en "afterOnLoad"
   + loadingTime 2000 ms → la zone 800px affiche les dégradés
   Elementor de #home-hero avant l'initialisation JS.
   ========================================================= */

/* 1. Section hero : fonds Elementor neutres (plus de flash rose/mauve) */
body.home #home-hero,
body.home #home-hero > .elementor-background-overlay,
body.home #home-hero .elementor-element-populated,
body.home #home-hero .elementor-widget-wrap {
  background: transparent !important;
  background-image: none !important;
}

/* Widgets superposés au slider : pas de dégradé pendant le chargement */
body.home #home-hero .elementor-element-f4c36ce,
body.home #home-hero .elementor-element-a76af8f,
body.home #home-hero .elementor-element-c280887 {
  background: transparent !important;
  background-image: none !important;
}

/* 2. Smart Slider accueil : image de la 1re diapo en attendant le JS
   ⚠️ Mettre à jour l'URL si vous changez la 1re slide du slider "Mon projet" */
body.home #n2-ss-7:not(.n2-ss-loaded) .n2-ss-slider-2 {
  background-color: #1a1a1a !important;
  background-image: url('https://ongcav.org/wp-content/uploads/2026/02/ESSAI-DE-POMPAGE-A-NIGBAOUDE-II-EN-PRESENCE-DU-DIRECTEUR-REGIONAL-DE-LHYDRAULIQUE-1.jpeg') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

/* 3. Flash gris des animations de transition Smart Slider */
body.home #n2-ss-7 .n2-bganim-side,
body.home #n2-ss-7 .n2-bganim-tile-overlay-colored {
  background: transparent !important;
}

/* 4. Conteneur full-width : visible sans saut de position */
body.home #home-hero ss3-force-full-width {
  opacity: 1 !important;
  transform: none !important;
}

/* 5. Loader spinner (optionnel — masque le cercle pendant 2 s) */
body.home #home-hero ss3-loader {
  display: none !important;
}

/* 6. Ancien correctif sur mauvais ID Elementor — neutralisé, cible #home-hero */
body.home .elementor-element-8d8ab5b,
body.home .elementor-element-8d8ab5b .elementor-background-overlay,
body.home .elementor-element-8d8ab5b .elementor-background-slideshow,
body.home .elementor-element-8d8ab5b .elementor-background-slideshow__slide {
  background: transparent !important;
  background-image: none !important;
}

/* ONG CAV — Sous-menus header en horizontal (desktop)
 * Menu HFE : header Elementor #591, widget 9f35492
 * Mobile (< 980px) : reste vertical
 *
 * À coller dans : Apparence → Personnaliser → CSS additionnel
 * Puis : purger Super Cache
 */

/* Desktop uniquement */
@media (min-width: 980px) {

  /* Conteneur du sous-menu de 1er niveau : rangée horizontale */
  .elementor-591 .elementor-element.elementor-element-9f35492 .hfe-nav-menu > .menu-item > .sub-menu,
  header .hfe-nav-menu > .menu-item > .sub-menu {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    min-width: max-content !important;
    width: auto !important;
    max-width: min(96vw, 1100px) !important;
    padding: 8px 10px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
    z-index: 9999 !important;
  }

  /* Chaque entrée côte à côte */
  .elementor-591 .elementor-element.elementor-element-9f35492 .hfe-nav-menu > .menu-item > .sub-menu > li,
  header .hfe-nav-menu > .menu-item > .sub-menu > li {
    display: block !important;
    float: none !important;
    width: auto !important;
    border-bottom: none !important;
    border-right: 1px solid rgba(0, 0, 0, 0.08) !important;
    white-space: nowrap !important;
  }

  .elementor-591 .elementor-element.elementor-element-9f35492 .hfe-nav-menu > .menu-item > .sub-menu > li:last-child,
  header .hfe-nav-menu > .menu-item > .sub-menu > li:last-child {
    border-right: none !important;
  }

  /* Liens : padding horizontal confortable */
  .elementor-591 .elementor-element.elementor-element-9f35492 .hfe-nav-menu > .menu-item > .sub-menu > li > a.hfe-sub-menu-item,
  .elementor-591 .elementor-element.elementor-element-9f35492 .hfe-nav-menu > .menu-item > .sub-menu > li > .hfe-has-submenu-container > a.hfe-sub-menu-item,
  header .hfe-nav-menu > .menu-item > .sub-menu > li > a.hfe-sub-menu-item,
  header .hfe-nav-menu > .menu-item > .sub-menu > li > .hfe-has-submenu-container > a.hfe-sub-menu-item {
    display: block !important;
    padding: 10px 16px !important;
    white-space: nowrap !important;
  }

  /* Sous-menu de 2e niveau (ex. Membres → Administration…) :
     reste vertical sous le parent, pas en bandeau */
  .elementor-591 .elementor-element.elementor-element-9f35492 .hfe-nav-menu > .menu-item > .sub-menu .sub-menu,
  header .hfe-nav-menu > .menu-item > .sub-menu .sub-menu {
    display: block !important;
    flex-direction: column !important;
    min-width: 220px !important;
    max-width: 320px !important;
    padding: 6px 0 !important;
    white-space: normal !important;
  }

  .elementor-591 .elementor-element.elementor-element-9f35492 .hfe-nav-menu > .menu-item > .sub-menu .sub-menu > li,
  header .hfe-nav-menu > .menu-item > .sub-menu .sub-menu > li {
    border-right: none !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
    white-space: normal !important;
  }

  .elementor-591 .elementor-element.elementor-element-9f35492 .hfe-nav-menu > .menu-item > .sub-menu .sub-menu > li:last-child,
  header .hfe-nav-menu > .menu-item > .sub-menu .sub-menu > li:last-child {
    border-bottom: none !important;
  }
}

/* Mobile : garder le déroulant vertical habituel */
@media (max-width: 979px) {
  .elementor-591 .elementor-element.elementor-element-9f35492 .hfe-nav-menu .sub-menu,
  header .hfe-nav-menu .sub-menu {
    display: block !important;
    flex-direction: column !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  .elementor-591 .elementor-element.elementor-element-9f35492 .hfe-nav-menu .sub-menu > li,
  header .hfe-nav-menu .sub-menu > li {
    border-right: none !important;
    white-space: normal !important;
  }
}

/* ONG CAV — Dernières actualités : grille + citations tendres VISIBLES
 * Fond section Elementor = #F6F6C5 — pastels assez marqués pour ne pas se fondre.
 */

/* Afficher TOUTES les cartes */
.oc-news-ekit .row.post-items > *,
.oc-news-ekit .post-items > *,
.oc-news-ekit .ekit-post-grid .ekit-post-col:nth-child(n+4),
.oc-news-ekit .ekit-post-grid .ekit-post-item:nth-child(n+4),
.oc-news .elementor-grid > *:nth-child(n+4),
.oc-news .ekit-post-grid .ekit-post-col:nth-child(n+4) {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

.oc-news-ekit .row.post-items,
.oc-news-ekit .post-items {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
  align-items: stretch !important;
}

.oc-news-ekit .row.post-items > [class*="col-"],
.oc-news-ekit .post-items > [class*="col-"] {
  width: 100% !important;
  max-width: none !important;
  flex: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  float: none !important;
  display: flex !important;
}

.oc-news-ekit .elementskit-post-image-card,
.oc-news-ekit .elementskit-post-card {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08) !important;
  width: 100% !important;
}

/* Citations — texte foncé forcé */
.oc-news-quote__text,
.oc-news-quote__author,
.oc-news-quote__mark {
  color: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.oc-news-quote--peach {
  background: linear-gradient(155deg, #f5dcc8 0%, #ebc4a8 100%) !important;
  color: #5a3424 !important;
  border: 1px solid #d9a882 !important;
}

.oc-news-quote--sage {
  background: linear-gradient(155deg, #d9e8d8 0%, #c2d6c1 100%) !important;
  color: #243d28 !important;
  border: 1px solid #9fbf9d !important;
}

.oc-news-quote--mist {
  background: linear-gradient(155deg, #dde2ec 0%, #c5cede 100%) !important;
  color: #243040 !important;
  border: 1px solid #a8b3c9 !important;
}

/* Anciennes classes vives → même rendu tendre */
.oc-news-quote--orange,
.oc-news-quote--dark,
.oc-news-quote--green {
  background: linear-gradient(155deg, #f5dcc8 0%, #ebc4a8 100%) !important;
  color: #5a3424 !important;
  border: 1px solid #d9a882 !important;
}

@media (max-width: 1024px) {
  .oc-news-ekit .row.post-items,
  .oc-news-ekit .post-items {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 767px) {
  .oc-news-ekit .row.post-items,
  .oc-news-ekit .post-items {
    grid-template-columns: 1fr !important;
  }
}