/*
Theme Name: Twenty Twenty‑Five Child
Template:    twentytwentyfive
*/

/* ==========================================================================
   1.  HEADER
   ========================================================================== */

/* Bande dégradée */
header{
  background:linear-gradient(90deg,#41D7C1 0%,#A1ABF2 100%) !important;
}

/* Menu principal */
header .wp-block-navigation a{
  color:#fff !important;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.12em;    /* tracking léger */
 
}

/* Espacement horizontal fluide entre les items */
header .wp-block-navigation__container{
  display:flex;
  justify-content:center;
  gap:clamp(1rem,4vw,4rem);
}
/* Fallback anciens navigateurs sans gap */
@supports not (gap:1rem){
  header .wp-block-navigation__container > .wp-block-navigation-item{
    margin-inline:clamp(.5rem,3vw,2rem);
  }
}

/* Icônes sociales (images) */
header .wp-block-image img{
  
  width:auto;
}
header .wp-block-image{
  margin-inline-start:clamp(.5rem,2vw,1rem);
}

/* Légère opacité au survol */
header .wp-block-navigation a:hover,
header .wp-block-navigation a:focus{opacity:.8;}



/*largeur menu pour prendre à cahque fois toutes la largeur de l'ecran */

header .menu-largeur{
  max-width: 100% !important;
}

/*cacher les icones du menus sur mobile */ 

@media(max-width:600px) {
  header .icone-menu{
  display : none !important;
}

header .wp-block-navigation__responsive-container-open{
  color : #fff !important;
}

.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
    color: #a1abf2 !important;
    font-weight : 600;
}

.wp-block-navigation__responsive-container-close{
    color: #a1abf2 !important;
    font-weight : 600;
}
  
}




/* ==========================================================================
   2.  BANNIÈRE D’ACCUEIL (ACF)
   ========================================================================== */

.banner{
  position:relative;
  min-height:60vh;                       /* hauteur 60 % viewport             */
  background-size:cover;
  background-position:center;
  display:flex;
  align-items:center;                    /* centre verticalement              */
  justify-content:flex-start;            /* bloc collé à gauche               */
  text-align:left;                       /* texte non centré                  */
  color:#fff;
  padding-left:clamp(2rem,6vw,4rem);     /* marge gauche fluide               */
  padding-right:clamp(1rem,4vw,2rem);    /* un peu d’air à droite             */
}

.banner::before{                         /* voile sombre 25 % */
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.25);
  z-index:1;
}

.banner__inner{
  max-width:min(90%,60rem);              /* jamais > 960 px                   */
  position:relative;
  z-index:2;                             /* devant le voile                   */
}

.banner h1{
  font-size:clamp(2.25rem,5vw,2.5rem);     /* 36 → 64 px selon largeur écran    */
  line-height:1.1;
  margin:0 0 0 0;                     /* marge basse seulement             */
}

.banner__sub{
  font-size:clamp(1.125rem,2.5vw,1.75rem); /* 18 → 28 px                      */
  margin:0 0 1.5em 0;
}

/* BOUTON */
.banner__btn{
  display:inline-block;
  padding:clamp(.3rem, 1.5vw, .2rem) clamp(1.5rem, 4vw, 2rem);
  border:3px solid #fff;
  border-radius:25px;
  color:inherit;
  text-decoration:none;
  font-weight:600;
  transition:background .2s,transform .2s;
  margin-top: 25px;                          /* déjà géré avec la marge sub‑titre */
}

.banner__btn:hover{
  transform:translateY(-2px);
}

/*coulur titre bannière */
.banner__inner h1 {
  color : #fff !important;
}



/* ==========================================================================
   3.  FOOTER
   ========================================================================== */

/* Bande lavande de 4 rem collée en bas + contenu centré */
footer{
  position:relative;
  text-align:center;
  color:#fff;
  /* dégradé : blanc → lavande sur 4 rem */
  background:linear-gradient(to bottom,
            transparent calc(100% - 4rem),
            #A1ABF2 calc(100% - 4rem));
  padding:2rem 1rem 6rem;      /* 6 rem = 4 rem bande + 2 rem air */
  box-sizing:border-box;
}

/* Groupe logo + copyright (le div .is-nowrap.is-layout-flex) */
footer > div.is-nowrap.is-layout-flex{
  position:absolute;
  inset-block-end:0;
  inset-inline:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.75rem;
  padding:.75rem 1rem;
  z-index:2;
}

/* Logo */
footer .wp-image-98{
  flex-shrink:0;
  max-height:2.5rem; /* ≈40 px */
  width:auto;
}

/* Copyright centré */
footer > div.is-nowrap.is-layout-flex p{
  margin:0 auto;
  text-align:center;
}

/* Retire marges WP sur <figure> */
footer > div.is-nowrap.is-layout-flex figure{margin:0 !important;}

/* ==========================================================================
   4.  TAGLINE SOUS LOGO (couleur turquoise)
   ========================================================================== */
.wp-block-site-tagline.has-text-align-center{
  color:#41D7C1 !important;
}

/* ==========================================================================
   5.  PETIT BREAKPOINT (≤ 34 rem ≈ 544 px)
   ========================================================================== */
@media(max-width:34rem){
  header .wp-block-navigation__container{gap:1.5rem;}
  .banner h1{line-height:1.25;}
}

/* Page d'accueil = page-id-19 (et classe home) : supprime l'espace blanc avant la bannière */
.page-id-19 #wp--skip-link--target{
  margin-top:0 !important;
  padding-top:0 !important;
}

/* Par sécurité, annule aussi l'espacement du 1er groupe interne */
.page-id-19 #wp--skip-link--target > .wp-block-group{
  margin-top:0 !important;
  padding-top:0 !important;
}

/* (optionnel) masquer le titre "Accueil" si tu ne le veux pas visible */
body.page-id-19 .wp-block-post-title {
  display:none;
}

/* ======================================================================
   PAGE d’accueil (id 19) : bannière .banner alignfull collée au header
   ====================================================================== */

/* 1. AUCUNE marge au‑dessus de la bannière            */
body.page-id-19 .wp-site-blocks > section.banner.alignfull{
  margin-block-start:0 !important;
}

/* 2. AUCUN padding/marge interne résiduel              */
body.page-id-19 section.banner.alignfull{
  padding-block-start:0 !important;
  padding-top:0 !important;
}

/* 3. (sécurité) largeur full‑width garantie            */
body.page-id-19 section.banner.alignfull{
  max-width:none !important;
  width:100% !important;
}


/* ------------------------------------------------------------------
   Page d’accueil : enlève complètement le padding / marge
   ------------------------------------------------------------------ */
body.page-id-19
.entry-content.alignfull.wp-block-post-content.has-global-padding{
    /* largeur – pleine fenêtre */
    max-width:none !important;
    width:100%    !important;

    /* plus aucun retrait */
    padding:0 !important;
    margin:0 0 0 0 !important;   /* top right bottom left */
}

body.page-id-19 main[role="main"]{
    margin-top:0 !important;     /* fallback */
    margin-block-start:0 !important;
    padding-top:0 !important;    /* au cas où */
}


/* ------------------------------------------------------------------
   Aligne parfaitement la bannière avec le contenu du header
   ------------------------------------------------------------------ */
body.page-id-19 .banner{
  /* image toujours full‑width, mais on remet le padding interne
     identique au header */
  padding-left : var(--wp--style--root--padding-left);
  padding-right: var(--wp--style--root--padding-right);
}


/*bloc savoir + florence*/

.bloc_savoir_plus {
  
   max-width: 60%;
    display: flex !important;
  align-items: center !important; /* Centrage vertical */
  gap: 4rem; /* Optionnel : espace entre l’image et le texte */
 
}
.texte_savoir_plus {
  flex: 1; /* ou largeur fixe si souhaité */
}



/*GENERAL CSS*/
/* Supprime l’outline sur tous les liens quand ils reçoivent le focus */
a:focus-visible,
a:focus{
  outline:none !important;
  box-shadow:none !important;   /* Safari / Firefox                           */
}

.bloc_site {
   margin-top: 80px !important;
}

footer > div {
  padding-top: 0px !important;
}

/**mosaique page accueil */
/* conteneur : on densifie le remplissage */
.mosaique-accueil{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  grid-auto-rows:200px;
  grid-auto-flow:dense;          /* important : comble les trous */
  max-width: 60%;
}

/* vignettes carrées */
.mosaique-item{overflow:hidden;position:relative;}
.mosaique-item img{width:100%;height:100%;object-fit:cover;display:block;}

/* grandes vignettes */
.mosaique-item--lg{grid-column:span 2;grid-row:span 2;}

/* ---- RE‑ORDONNANCEMENT ---- */
/* on veut : 1‑2‑3‑4‑5‑6‑7‑10‑8‑9 (le grand bloc passe avant les deux derniers) */
.mosaique-accueil > .mosaique-item:nth-child(10){order:8;}
.mosaique-accueil > .mosaique-item:nth-child(8) {order:9;}
.mosaique-accueil > .mosaique-item:nth-child(9) {order:10;}


/* === Responsive « mobile » : 3 colonnes, image #10 masquée ============ */
/* === Responsive « mobile » : 3 colonnes, #10 masquée, #1 = 2×2 = carré === */
@media (max-width: 780px){

  /* 3 colonnes égales */
  .mosaique-accueil{
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: auto;
    grid-auto-flow: dense;        /* comble les trous */
  }

  /* toutes les vignettes carrées */
  .mosaique-item{
    aspect-ratio: 1 / 1;
  }

  /* grande vignette #1 : 2 colonnes × 2 lignes → carré */
  .mosaique-item--lg{
    grid-column: span 2;
    grid-row:    span 2;
  }

  /* on masque la 10ᵉ image */
  .mosaique-accueil > .mosaique-item:nth-child(10){
    display: none;
  }

  .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    max-width: 90% !important;
}
}


/** end mosaique page accueil */


/* =========================================================================
   CARTES COURS  –  grille + effet flip + style visuel final
   ========================================================================= */

/* ---------- Grille des cartes ------------------------------------------ */
.cours-cards{
  display:flex;                       /* rangée flexible                  */
  flex-wrap:wrap;                     /* passe à la ligne si besoin       */
  gap:clamp(1rem,4vw,2rem);           /* espace fluide entre les cartes   */
  justify-content:center;             /* centré dans la page              */
  margin-top:2rem;
}

/* ---------- Conteneur individuel --------------------------------------- */
.flip-card{
  perspective:1000px;                 /* profondeur 3D                    */
  flex:1 1 320px;                     /* min 320 px, grandit jusqu'à 500 px*/
 
  min-height:250px;                   /* garde un minimum, s’allonge si + */
  position:relative;                  /* pour le focus                    */
  outline:none;                       /* pas de contour navigateur        */    
}


/* ---------- Bloc interne pivotant -------------------------------------- */
.flip-card-inner{
  position:relative;
  width:100%;
  height:100%;
  transition:transform .8s;
  transform-style:preserve-3d;
}

/* Activation du flip : survol + focus clavier --------------------------- */
.flip-card:hover .flip-card-inner,
.flip-card:focus-within .flip-card-inner{
  transform:rotateY(180deg);
}

/* ---------- Faces communes --------------------------------------------- */
.flip-card-front,
.flip-card-back{
  position:absolute;
  inset:0;
  backface-visibility:hidden;
 /* display:flex;*/
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:1.75rem 1.5rem 2.75rem;     /* ↑ un peu + bas pour le bouton    */
  background:#A1ABF2;                 /* lavande                          */
  color:#ffffff;
  border-radius:.25rem;
  font-size:.9rem;                    /* ≈ 14‑15 px                       */
  line-height:1.45;
}


/* ---------- Face avant -------------------------------------------------- */
.flip-card-front h1{
  font-size:1.25rem;                  /* garde la police h1 mais + petit  */
  margin:0 0 .75rem;                  /* pas de débord haut               */
  font-weight:700;
  color: #fff !important;
}
.flip-card-front img{
  margin-bottom:.75rem;
}

/* ---------- Face arrière ------------------------------------------------ */
.flip-card-back{
  transform:rotateY(180deg);
}
.flip-card-back h1{                   /* même style que recto             */
  font-size:1.25rem;
  margin:0 0 1rem;
  font-weight:700;
  color: #fff !important;
}
.flip-card-back p{
  margin:.25rem 0;
}
.flip-card-back p strong{
  font-weight:600;
}

/* ---------- Bouton ------------------------------------------------------ */
.card-btn{
  display:inline-block;
  margin-top:1.25rem;
  padding:.55rem 1.9rem;
  background:#ffffff;                 /* fond blanc plein                 */
  color:#6b7cff;                      /* lavande plus foncé               */
  border:2px solid transparent;
  border-radius:9999px;               /* pill‑button                      */
  font-weight:600;
  text-decoration:none;
  transition:all .2s;
}
.card-btn:hover{
  background:transparent;
  color:#ffffff;
  border-color:#ffffff;
}

/* ---------- Première carte affichée retournée -------------------------- */
.cours-cards .flip-card:nth-child(1) .flip-card-inner{
  transform:rotateY(180deg);          /* affiche la face “back” par défaut*/
}
.cours-cards .flip-card:nth-child(1):hover .flip-card-inner,
.cours-cards .flip-card:nth-child(1):focus-within .flip-card-inner{
  transform:rotateY(0deg);            /* revient au recto au survol       */
}



.cours_accueil
{
  max-width: 60%;
  gap: 8px !important;
}

/* 1 ▸ les deux faces sont empilées dans le même « carré » de la grille  */
.flip-card-inner{
  display:grid;           /* ← au lieu de position:relative; height:100% */
  transition:transform .8s;
  transform-style:preserve-3d;
}

/* 2 ▸ chaque face occupe la même cellule 1 / 1 de la grille            */
.flip-card-front,
.flip-card-back{
  position:relative;      /* on retire position:absolute et inset:0      */
  grid-area:1 / 1;        /* les deux se superposent dans la grille      */
  backface-visibility:hidden;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:1.75rem 1.5rem 2.75rem;
  background:#A1ABF2;
  color:#fff;
  border-radius:.25rem;
}

/* 3 ▸ la face arrière est toujours pivotée                             */
.flip-card-back{
  transform:rotateY(180deg);
}

/* 4 ▸ le conteneur n’a plus besoin de min‑height fixe ; on peut l’enlever
       ou garder une valeur très petite si tu veux un minimum visuel    */
.flip-card{
  min-height:0;           /* (ou supprime carrément la propriété)        */
}
/* 1 ▸ La grille : colonnes auto‑fit min 320 px, lignes de même hauteur */
.cours-cards{
  display:grid;                                            /* ← grid !  */
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  grid-auto-rows:1fr;            /* chaque ligne fait la même hauteur   */
  gap:clamp(1rem,4vw,2rem);
  justify-items:center;          /* centre chaque carte dans sa cellule */
}

/* 2 ▸ La carte s’étire pour remplir la cellule */
.flip-card{
  height:100%;                   /* ← prend toute la hauteur du 1fr     */
  width:100%;                    /* laisse le width se caler sur la col */
  display:flex;                  /* pour que .flip-card-inner puisse 100% */
}

/* 3 ▸ Ton bloc pivotant continue de remplir la carte */
.flip-card-inner{
  flex:1;                        /* occupe tout l’espace de .flip-card  */
  display:grid;                  /* (comme précédemment)                */
}

/* ---------- Responsive : cartes empilées en colonne -------------------- */
@media(max-width:600px){
  .cours-cards{
    flex-direction:column;
    align-items:center;
  }
  .flip-card{
    max-width:380px;
  }
}


/* ------------------------------------------------------------------
   HERO / SECTION plein écran avec l’image de fond
------------------------------------------------------------------- */
.bloc_image{
  position:relative;
  /* si l’image est définie en HTML, supprime la ligne suivante */
  /* background:url('URL-DE-TON-IMAGE.jpg') center/cover no-repeat; */
  padding:60px 20px;            /* haut‑bas / côtés */
}

/* léger voile pour que le blanc des champs ressorte */
.bloc_image::before{
  content:"";
  position:absolute; inset:0;
  background:rgba(0,0,0,.35);   /* assombrit l’image (ajuste l’opacité) */
}

/* ------------------------------------------------------------------
   WRAPPER titre + formulaire – au‑dessus du voile
------------------------------------------------------------------- */
.titre_et_formulaire{
  position:relative;
  z-index:1;                    /* passe devant le ::before */
  max-width: 80% !important;
  margin:0 auto;
  text-align:left;
}

/* titre “Contactez‑moi” */
.titre_et_formulaire h2,
.titre_et_formulaire h1{
  color:#fff;
  margin-bottom:45px;
}

/* ------------------------------------------------------------------
   LE FORMULAIRE
------------------------------------------------------------------- */
.form-container {
  display: flex;
  flex-direction: column;
  gap: 25px;
  max-width: 100%;     /* permet d'aller jusqu'à 100% du parent */
  width: 100%;         /* occuper toute la largeur */
  padding: 0 10px;     /* petit padding à gauche/droite */
  box-sizing: border-box;
}


/* champs texte et textarea */
/* champs texte et textarea */
.wide-field {
  width: 100%; /* avant c'était 100% */
  background: #fff;
  border: 0;
  border-radius: 10px;
  padding: 14px 24px;
  font-size: 1.05rem;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
  margin: 0 auto; /* centrer le champ dans le conteneur */
  display: block;
  box-sizing: border-box;
}


/* textarea un peu plus haut */
textarea.wide-field{
  min-height:100px;
  resize:vertical;              /* autorise l’utilisateur à l’agrandir */
}

/* couleur du placeholder */
.wide-field::placeholder{
  color:#8d8d8d;
  opacity:1;                    /* Safari */
}

/* Masquer les <label> puisque les placeholders suffisent.
   Si tu veux quand même garder les libellés, commente ces lignes */
.form-container label{
  display:none;
}

/* ------------------------------------------------------------------
   BOUTON ENVOYER
------------------------------------------------------------------- */
.submit-btn{
  display: inline-block;
    padding: clamp(.3rem, 1.5vw, .2rem) clamp(1.5rem, 4vw, 2rem);
    border: 3px solid #fff;
    border-radius: 25px;
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    transition: background .2s, transform .2s;
    margin-top: 25px;
    background-color: transparent;
}

.submit-btn:hover,
.submit-btn:focus{
  background:#fff;
  color:#333;
}

/* ------------------------------------------------------------------
   RESPONSIVE – petits écrans
------------------------------------------------------------------- */
@media (max-width:768px){
  .titre_et_formulaire h2{font-size:2rem;}
  .submit-btn{
    width:100%;
    text-align:center;
  }
}

/*page detail retraite*/
/* Masquer le titre H1, l’image mise en avant et la bande couleur
   uniquement sur les fiches “Retraite Yoga” */
.single-retraite_yoga{

	/* H1 “wp‑block‑post‑title” */
	.wp-block-post-title {
		display: none !important;
	}

	/* Figure “wp‑block‑post‑featured‑image” */
	figure.wp-block-post-featured-image {
		display: none !important;
	}

	/* Bloc bandeau couleur (classe générée par le thème) */
	.wp-block-group.has-accent-4-color {
		display: none !important;
	}

  .wp-block-post-content{
    margin-top: 0 !important;
  }
}

.single-formations {

	

	/* Figure “wp‑block‑post‑featured‑image” */
	figure.wp-block-post-featured-image {
		display: none !important;
	}

	/* Bloc bandeau couleur (classe générée par le thème) */
	.wp-block-group.has-accent-4-color {
		display: none !important;
	}

  .wp-block-post-content{
    margin-top: 0 !important;
  }
}

	main.wp-block-group.is-layout-constrained {
		margin-top: 0 !important;
	}

/* Pages « Retraite Yoga » uniquement */
.single-retraite_yoga, .page-id-338, .page-id-732  {

	/* 1️⃣ Supprimer la marge‑top du <main> */
	main.wp-block-group.is-layout-constrained {
		margin-top: 0 !important;
	}

	/* 2️⃣ Supprimer le padding‑top du bloc alignfull qui suit */
	.wp-block-group.alignfull.has-global-padding.is-layout-constrained.wp-block-group-is-layout-constrained {
		padding-top: 0 !important;
	}

  .has-global-padding{
		margin-top: 0 !important;
	}
}

.page-id-338 .wp-block-post-title {
  display:none;
}


.justify-paraph {
  text-align: justify;
  max-width: 60%;
}


.wpupg-filter-isotope-all {
  display: none !important;
}

.wpupg-grid-filters {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;       /* Pour que les boutons passent à la ligne si besoin */
  gap: 10px;             /* Optionnel : espace entre les boutons */
  margin-bottom: 20px;   /* Optionnel : espace sous les filtres */
}

/**/
/* ====================== 1. Carré de référence ====================== */
.wpupg-grid-container .wpupg-item{
    width: 240px !important;          /* largeur fixe, on ajustera plus tard */
    position: relative;               /* nécessaire pour placer l’image      */
    overflow: hidden;
    border: none;                 /* rien ne dépasse du carré            */
}

/* On crée la hauteur avec un ::before → 100 % de la largeur = carré */
.wpupg-grid-container .wpupg-item::before{
    content:'';
    display:block;
    padding-top:100%;                 /* 300 px aussi → carré parfait        */
}

/* ====================== 2. Image plein cadre ======================= */
.wpupg-grid-container .wpupg-item img{
    position:absolute;
    inset:0;                          /* top:0 right:0 bottom:0 left:0       */
    width:100%;
    height:100%;
    object-fit:cover;                 /* recadre sans déformer               */
    object-position:center;           /* centre le recadrage                 */
}

/* ====================== 3. On masque le cartouche gris = titre ===== */
.wpupg-grid-container .wpupg-bottom,
.wpupg-grid-container .wpupg-caption{
    display:none !important;
}


/* largeur maxi = 3 colonnes → 3 × 300 px + ~20 px de marge interne */
.wpupg-grid-container{
    max-width: 960px;   /* ajuste si tu veux plus ou moins d’espace */
    margin: 0 auto;     /* centre la grille dans la page            */
}

/* ------------------------------------------------------------------ */
/* OVERLAY permanent : vert transparent → opaque                      */
/* ------------------------------------------------------------------ */
.wpupg-template-overlay.wpupg-item-has-image
.wpupg-template-overlay-container{
    /* occupe toute la vignette (le plugin met déjà position:absolute) */
    position: absolute !important;
    inset: 0 !important;
    z-index: 2;

    /* centrage du titre */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center;
    padding: 0 !important;            /* supprime le padding 5 px inline */

    /* texte */
    color: #fff !important;
    font-weight: 600;
    line-height: 1.25;

    /* supprime le fond noir ajouté inline par le plugin */
    background-color: transparent !important;

    /* ton dégradé vert, visible en permanence */
    background-image: linear-gradient(
        180deg,
        rgba(0,0,0,0) 0%,              /* transparent en haut            */
        rgba(65,215,193,255) 100%       /* vert #00BE8C en bas            */
    ) !important;

    /* toujours visible, pas d’animation hover                 */
    opacity: 1 !important;
    transition: none !important;
}

/* ------------------------------------------------------------------ */
/* On masque l’ancien cartouche « bottom » si présent                  */
/* ------------------------------------------------------------------ */
.wpupg-bottom,
.wpupg-caption{
    display: none !important;
}


/* Titre ancré en bas de l’image ----------------------------------- */
.wpupg-template-overlay.wpupg-item-has-image
.wpupg-item-title.wpupg-block-text-bold{
    position: absolute;   /* le fait flotter indépendamment du flex */
    left: 0;
    right: 0;
    bottom: 0;            /* colle le bloc titre en bas             */

    padding: 1rem;        /* marge intérieure ; ajuste si besoin    */
    text-align: center;   /* centré horizontalement                 */

    /* inutile de remettre la couleur : elle hérite déjà de #fff     */
}

/* marge au dessus des bouton retraites */
.wpupg-grid-filters.wpupg-grid-filters-display-block {
  margin-top: 60px;
}

@media (min-width: 780px){
.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    max-width: 70% !important;
  }}


  /**Page retraite seul**/
h2.dr-heading{
color : #41D7C1 !important;
font-family: var(--wp--preset--font-family--lato) !important;
}


/* ----------------------------------------------------
   Paramètres de couleur et d’arrondis (facile à changer)
---------------------------------------------------- */
:root{
	--acc-color : #8fa0ff;    /* bordures & titres bleus */
	--acc-radius: 6px;        /* arrondi du cadre       */
	--acc-pad   : 1rem;       /* padding interne        */
}

/* ----------------------------------------------------
   Cadre de l’accordéon
   (chaque bloc <details> a déjà les classes wp-block-details…)
---------------------------------------------------- */
.wp-block-details {
	border-left  : 2px solid var(--acc-color);
	border-right : 2px solid var(--acc-color);
	margin:0;                 /* on neutralise les marges WP */
}

/* première & dernière bordure + arrondis */
.wp-block-details:first-of-type {
	border-top    : 2px solid var(--acc-color);
	border-top-left-radius : var(--acc-radius);
	border-top-right-radius: var(--acc-radius);
}
.wp-block-details:last-of-type {
	border-bottom : 2px solid var(--acc-color);
	border-bottom-left-radius : var(--acc-radius);
	border-bottom-right-radius: var(--acc-radius);
}

/* trait séparateur entre les panneaux */
.wp-block-details:not(:first-of-type){
	border-top : 2px solid var(--acc-color);
}

/* ----------------------------------------------------
   TITRE du panneau  (<summary>)
---------------------------------------------------- */
.wp-block-details > summary{
	display:flex;
	justify-content:space-between;
	align-items:center;
	padding:var(--acc-pad);
	cursor:pointer;
	font-weight:700;
	font-size:1.25rem;
	color:var(--acc-color);
	list-style:none;           /* retire la flèche native FF */
      border-top-left-radius: var(--acc-radius);
    border-top-right-radius: var(--acc-radius);
}

/* flèche perso à droite */
.wp-block-details > summary::after{
	content:"v";
	font-weight:700;
	transition:transform .25s;
}
/* rotation quand le volet est ouvert */
.wp-block-details[open] > summary::after{
	transform:rotate(180deg);
}

/* retire le triangle WebKit par défaut */
.wp-block-details > summary::-webkit-details-marker{ display:none; }

/* ----------------------------------------------------
   CONTENU interne (UL, DIV, P…)
---------------------------------------------------- */
.wp-block-details > div,
.wp-block-details > ul,
.wp-block-details > p{
	padding:var(--acc-pad);
	margin:0;
}

/* facultatif : enlève les marges parasites du premier/dernier élément */
.wp-block-details > *:first-child{ margin-top:0; }
.wp-block-details > *:last-child { margin-bottom:0; }



div.wpcf7{
  max-width : 100% !important;
}


.text-formation{
  padding-top : 25px !important;
}

body.page-id-732  .wp-block-post-title {
  display: none !important;
}

.wpcf7-response-output {
  color : #fff !important;
}

.captcha-image{
  color: #fff;
    margin-top: 20px;
}

body.single-retraite_yoga > h1.wp-block-post-title{
  display: none !important;
} 

body.single-retraite_yoga .wp-block-post-featured-image {
  display: none !important;
} 

body.single-retraite_yoga .wp-container-core-group-is-layout-4efaea1e {
  display: none !important;
} 


h1.wp-block-post-title{
  font-size: 32px !important;
    margin-bottom: 30px !important;
}