/*
Theme Name: Sydney Child
Description: Thème enfant Sydney - Etoile
Author: Gimbet
Author URI: etoile-du-matin.fr
Template: sydney
Version: 1.0
*/

/*couleurs*/
:root {
    --tonique : #fef4e6;
    --entete  : #000022;
    --entete2 : #323E65;
    --actu : #fef4e6;
    --text-color : #333;
    --color-text-light: #ffffff;
    --spacing: 1rem;
}

/* Largeur du conteneur principal */
.container {
    max-width: 1200px;
}

/* Largeur du conteneur étroit */
.container.narrow {
    max-width: 800px;
}

/* Padding haut et bas de l’enrobeur de page */
.page-wrap {
    padding-top: 80px;
    padding-bottom: 60px;
}

/* ======================================================================
   ======================================================================
   HABILLAGE « ÉTOILE » — ajouté en 2026
   S'applique uniquement aux pages utilisant le gabarit
   « Page Étoile (pleine largeur) ». Le reste du site est inchangé.
   ====================================================================== */

/* ----------------------------------------------------------------------
   1. JETONS — reprennent les variables du site (avec valeurs de secours)
   ---------------------------------------------------------------------- */
:root{
  --edm-navy-900: var(--entete,  #000022);
  --edm-navy-700: var(--entete2, #323E65);
  --edm-cream:    var(--actu,    #fef4e6);
  /* Surtout PAS var(--tonique) : sur ce site --tonique vaut #fef4e6,
     soit exactement --actu. Un bouton doré deviendrait crème sur crème. */
  --edm-gold-lt:  #FFEDC4;

  /* Or franc, pour les filets et surtitres posés sur fond crème
     (le --tonique est trop clair pour être lisible sur crème) */
  --edm-gold:     #B08A2E;
  --edm-cream-2:  #F6E9D2;
  --edm-red:      #B23A34;
  --edm-ink:      #22252E;
  --edm-ink-soft: #4A4F63;
  --edm-radius:   14px;

  /* Polices actuelles du site — inchangées */
  --edm-display: "Josefin Sans", "Montserrat", sans-serif;
  --edm-body:    "Montserrat", sans-serif;
  --edm-script:  "Kaushan Script", cursive;

  /* Étoile à cinq branches, pointe en haut, comme sur le blason */
  --edm-star-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 L14.25 8.91 L21.51 8.91 L15.63 13.18 L17.88 20.09 L12 15.82 L6.12 20.09 L8.37 13.18 L2.49 8.91 L9.75 8.91 Z'/%3E%3C/svg%3E");
}

/* ----------------------------------------------------------------------
   2. NEUTRALISATION DES RÈGLES GLOBALES DU SITE
   Le site justifie et indente tous les paragraphes, met les liens en
   Josefin Sans 800 bleu, et transforme les figure en table.
   On rend la main sur les blocs de l'habillage Étoile.
   ---------------------------------------------------------------------- */
.edm-page p{text-indent:0;text-align:left}
.edm-page .has-text-align-center{text-align:center}
.edm-page figure{display:block;font-style:normal;font-size:inherit;text-indent:0}
.edm-page figcaption{
  font-style:italic;font-size:.93rem;color:var(--edm-ink-soft);
  margin-top:.7rem;text-align:center;
}
.edm-page a{font-family:inherit !important;font-weight:inherit !important}

/* ----------------------------------------------------------------------
   3. BASE
   ---------------------------------------------------------------------- */
.edm-page{
  background:var(--edm-cream);
  color:var(--edm-ink);
  font-family:var(--edm-body);
  font-size:18px;line-height:1.65;
  width:100%;
  -webkit-font-smoothing:antialiased;
}
.edm-page img{max-width:100%;height:auto}
.edm-page h1,.edm-page h2,.edm-page h3{
  font-family:var(--edm-display);
  font-weight:700;line-height:1.14;letter-spacing:-.005em;
  color:var(--edm-navy-900);
}
.edm-page h1{font-size:clamp(2.1rem,5.8vw,3.8rem)}
.edm-page h2{font-size:clamp(1.7rem,3.4vw,2.5rem)}
.edm-page h3{font-size:1.28rem}
.edm-page section,
.edm-page .edm-section{padding-block:clamp(3.5rem,8vw,6rem)}

/* Surtitre doré */
.edm-page .edm-eyebrow{
  font-family:var(--edm-display);font-weight:700;font-size:.76rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--edm-gold);
  display:flex;align-items:center;gap:.7rem;margin-bottom:1rem;text-indent:0;
}
.edm-page .edm-eyebrow::before{content:"";width:26px;height:1px;background:var(--edm-gold);flex:none}

/* Devise latine, dans la calligraphie du nom de l'école */
.edm-page .edm-motto{
  font-family:var(--edm-script);font-size:1.35rem;letter-spacing:.06em;
  color:var(--edm-gold-lt);text-align:center;margin:0;text-indent:0;
}
.edm-page .edm-motto::before,
.edm-page .edm-motto::after{
  content:"";display:inline-block;vertical-align:middle;
  width:1em;height:1em;margin:0 .6em;background:var(--edm-gold-lt);
  -webkit-mask:var(--edm-star-mask) center/contain no-repeat;
          mask:var(--edm-star-mask) center/contain no-repeat;
}

/* ----------------------------------------------------------------------
   4. SÉPARATEUR ÉTOILE (style de bloc « Séparateur »)
   ---------------------------------------------------------------------- */
.edm-page .wp-block-separator.is-style-edm-etoile{
  border:0;height:auto;max-width:100%;background:none;
  margin:3.5rem auto;display:flex;align-items:center;gap:1rem;overflow:visible;
}
.edm-page .wp-block-separator.is-style-edm-etoile::before,
.edm-page .wp-block-separator.is-style-edm-etoile::after{
  content:"";height:1px;flex:1;
  background:linear-gradient(90deg,transparent,rgba(176,138,46,.55),transparent);
}
.edm-star{
  display:block;width:18px;height:18px;flex:none;margin:0 auto;
  background:var(--edm-gold);
  -webkit-mask:var(--edm-star-mask) center/contain no-repeat;
          mask:var(--edm-star-mask) center/contain no-repeat;
}

/* ----------------------------------------------------------------------
   5. BOUTONS — le !important contre la règle « #content a » du site
   ---------------------------------------------------------------------- */
.edm-page .wp-block-button__link{
  font-family:var(--edm-display) !important;font-weight:700 !important;
  font-size:.92rem;letter-spacing:.03em;
  padding:.75rem 1.5rem;border-radius:100px;transition:.2s;text-decoration:none !important;
}
.edm-page .edm-btn-gold  .wp-block-button__link{background:var(--edm-gold-lt) !important;color:var(--edm-navy-900) !important}
.edm-page .edm-btn-gold  .wp-block-button__link:hover{background:#fff !important;color:var(--edm-navy-900) !important}
.edm-page .edm-btn-navy  .wp-block-button__link{background:var(--edm-navy-900) !important;color:#fff !important}
.edm-page .edm-btn-navy  .wp-block-button__link:hover{background:var(--edm-navy-700) !important;color:#fff !important}
.edm-page .edm-btn-red   .wp-block-button__link{background:var(--edm-red) !important;color:#fff !important}
.edm-page .edm-btn-red   .wp-block-button__link:hover{background:#9C2F2A !important;color:#fff !important}
.edm-page .edm-btn-ghost .wp-block-button__link{
  background:transparent !important;color:var(--edm-gold-lt) !important;
  border:1.5px solid rgba(255,237,196,.6);
}
.edm-page .edm-btn-ghost .wp-block-button__link:hover{background:rgba(255,237,196,.16) !important;color:#fff !important}

/* ----------------------------------------------------------------------
   6. HERO — le lever du jour
   ---------------------------------------------------------------------- */
.edm-page .edm-hero{min-height:74vh;padding:clamp(4rem,11vw,7rem) 1.2rem;display:flex}
.edm-page .edm-hero .wp-block-cover__background{
  background:linear-gradient(180deg,
    rgba(0,0,34,.88) 0%,
    rgba(50,62,101,.55) 45%,
    rgba(254,244,230,.10) 78%,
    var(--edm-cream) 100%) !important;
  opacity:1 !important;
}
.edm-page .edm-hero h1{color:#fff !important;text-shadow:0 2px 30px rgba(0,0,0,.4);max-width:16ch;margin-inline:auto}
.edm-page .edm-hero .edm-hero-sub{color:#E4E2EE;font-size:1.12rem;max-width:52ch;margin-inline:auto}
.edm-page .edm-hero .edm-caption{
  font-style:italic;color:#EFE9DE;font-size:1rem;margin-top:clamp(2.5rem,7vw,5rem);
}

/* ----------------------------------------------------------------------
   7. BANDEAU DE CHIFFRES
   ---------------------------------------------------------------------- */
.edm-page .edm-facts{background:var(--edm-navy-900);padding:0;margin:0;gap:1px !important}
.edm-page .edm-facts .wp-block-column{
  background:var(--edm-navy-900);box-shadow:0 0 0 1px rgba(255,237,196,.2);
  padding:1.9rem 1rem;text-align:center;
}
.edm-page .edm-facts .edm-fact-num{
  font-family:var(--edm-display);font-size:1.85rem;font-weight:700;
  color:var(--edm-gold-lt);margin:0;line-height:1.1;text-align:center;
}
.edm-page .edm-facts p:not(.edm-fact-num){
  font-family:var(--edm-display);font-size:.78rem;letter-spacing:.13em;
  text-transform:uppercase;color:#C6C9DC;margin:.4rem 0 0;text-align:center;
}

/* ----------------------------------------------------------------------
   8. SECTIONS TEXTE + IMAGE
   ---------------------------------------------------------------------- */
.edm-page .edm-media img{
  border-radius:var(--edm-radius);
  box-shadow:0 18px 45px -22px rgba(0,0,34,.55);
}
.edm-page .edm-section p{margin:1.1rem 0 0}

/* ----------------------------------------------------------------------
   9. ENCART DES ANCIENS
   ---------------------------------------------------------------------- */
.edm-page .edm-anciens{
  background:var(--edm-cream-2);border-left:4px solid var(--edm-red);
  border-radius:var(--edm-radius);padding:clamp(1.6rem,4vw,2.4rem);
}
.edm-page .edm-anciens h3{color:var(--edm-red);font-size:1.45rem;margin:0}
.edm-page .edm-anciens p{margin:.7rem 0 0;font-size:1rem;color:var(--edm-ink-soft)}

/* ----------------------------------------------------------------------
   10. FRISE HISTORIQUE
   ---------------------------------------------------------------------- */
.edm-page .edm-timeline{margin-top:2.5rem}
.edm-page .edm-tl{position:relative;padding:0 0 2.1rem 2.4rem;margin:0}
.edm-page .edm-tl::before{
  content:"";position:absolute;left:0;top:.4rem;width:14px;height:14px;
  background:var(--edm-gold);
  -webkit-mask:var(--edm-star-mask) center/contain no-repeat;
          mask:var(--edm-star-mask) center/contain no-repeat;
}
.edm-page .edm-tl::after{
  content:"";position:absolute;left:6px;top:1.6rem;bottom:0;width:1px;
  background:rgba(176,138,46,.45);
}
.edm-page .edm-tl:last-child{padding-bottom:0}
.edm-page .edm-tl:last-child::after{display:none}
.edm-page .edm-tl h3{
  font-family:var(--edm-display);font-weight:700;color:var(--edm-navy-700);
  font-size:1.08rem;letter-spacing:.04em;margin:0;
}
.edm-page .edm-tl p{margin:.25rem 0 0;color:var(--edm-ink-soft);font-size:1rem}

/* ----------------------------------------------------------------------
   11. BANDE CITATION
   ---------------------------------------------------------------------- */
.edm-page .edm-quote{
  background:linear-gradient(180deg,var(--edm-navy-900) 0%,var(--edm-navy-700) 100%);
  color:#fff;text-align:center;padding-block:clamp(3.5rem,8vw,6rem);
}
.edm-page .edm-quote p{
  font-family:var(--edm-display);font-size:clamp(1.6rem,3.8vw,2.4rem);
  line-height:1.25;font-weight:400;max-width:24ch;margin:0 auto;
  color:#fff;text-align:center;
}
.edm-page .edm-quote .edm-quote-src{
  font-family:var(--edm-body);font-size:.78rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--edm-gold-lt);margin-top:1.4rem;
}

/* ----------------------------------------------------------------------
   12. ACCESSIBILITÉ ET ANIMATION
   ---------------------------------------------------------------------- */
.edm-page a:focus-visible,
.edm-page button:focus-visible{
  outline:2px solid var(--edm-gold-lt);outline-offset:3px;border-radius:4px;
}
.edm-reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.edm-reveal.edm-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .edm-page *{animation:none !important;transition:none !important}
  .edm-reveal{opacity:1;transform:none}
}

/* ----------------------------------------------------------------------
   13. INTÉGRATION DANS VOTRE header.php
   Votre header.php ouvre : #content.page-wrap > .container.content-wrapper > .row
   Sur le gabarit Étoile, on neutralise ces largeurs pour laisser passer
   les sections pleine largeur. Les autres pages ne sont pas touchées.
   ---------------------------------------------------------------------- */
.edm-has-template #content.page-wrap{padding-top:0;padding-bottom:0}
.edm-has-template .container.content-wrapper{
  width:100%;max-width:100%;padding-left:0;padding-right:0;
}
.edm-has-template .content-wrapper .row{display:block !important;margin-left:0;margin-right:0}
.edm-has-template #primary,
.edm-has-template .content-area{width:100%;max-width:100%;float:none;padding:0}
.edm-has-template .page-header,
.edm-has-template .title-post{display:none}

/* Largeur de lecture par défaut */
.edm-page > *{
  max-width:1160px;margin-left:auto;margin-right:auto;
  padding-left:22px;padding-right:22px;
}
/* Les blocs pleine largeur reprennent toute la fenêtre */
.edm-page .alignfull{
  width:100vw;max-width:100vw;
  margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  padding-left:0;padding-right:0;
}
.edm-page .alignfull > .wp-block-group__inner-container,
.edm-page .alignfull > .wp-block-cover__inner-container{
  max-width:1160px;margin-left:auto;margin-right:auto;
  padding-left:22px;padding-right:22px;
}
.edm-page .edm-facts.alignfull > .wp-block-column,
.edm-page .edm-facts{padding-left:0;padding-right:0}
.edm-page .wp-block-columns{margin-left:0;margin-right:0}



/* ======================================================================
   14. PRIORITÉ SUR LE CSS DU PERSONNALISATEUR
   Le CSS additionnel du Personnalisateur est imprimé en dernier dans le
   <head> et contient des règles à identifiant (#content) marquées
   !important. En CSS, un !important sur un identifiant bat un !important
   sur des classes : il faut donc repasser par #content pour gagner.
   Ces sélecteurs ne s'appliquent qu'à l'intérieur de .edm-page.
   ====================================================================== */

/* -- Conteneurs : #content.page-wrap est en width:90%, #content .container
      en padding 5%. Sur le gabarit Étoile, on remet tout à plat. -------- */
body.edm-has-template #content.page-wrap{
  width:100%;margin:0;padding:0;
}
body.edm-has-template #content .container,
body.edm-has-template #content .container.content-wrapper{
  width:100%;max-width:100%;
  padding:0;margin:0 auto;border-radius:0;height:auto;
}
body.edm-has-template #content .content-wrapper .row{
  display:block !important;margin:0;
}

/* -- Liens et boutons : contre #content a { ... !important } ------------ */
#content .edm-page a{
  font-family:inherit !important;
  font-weight:inherit !important;
  color:inherit !important;
  background-color:transparent;
}
#content .edm-page .wp-block-button__link{
  font-family:var(--edm-display) !important;
  font-weight:700 !important;
  text-decoration:none !important;
}
#content .edm-page .edm-btn-gold  .wp-block-button__link{background-color:var(--edm-gold-lt) !important;color:var(--edm-navy-900) !important}
#content .edm-page .edm-btn-gold  .wp-block-button__link:hover{background-color:#fff !important;color:var(--edm-navy-900) !important;text-decoration:none !important}
#content .edm-page .edm-btn-navy  .wp-block-button__link{background-color:var(--edm-navy-900) !important;color:#fff !important}
#content .edm-page .edm-btn-navy  .wp-block-button__link:hover{background-color:var(--edm-navy-700) !important;color:#fff !important;text-decoration:none !important}
#content .edm-page .edm-btn-red   .wp-block-button__link{background-color:var(--edm-red) !important;color:#fff !important}
#content .edm-page .edm-btn-red   .wp-block-button__link:hover{background-color:#9C2F2A !important;color:#fff !important;text-decoration:none !important}
#content .edm-page .edm-btn-ghost .wp-block-button__link{
  background-color:transparent !important;color:var(--edm-gold-lt) !important;
  border:1.5px solid rgba(239,207,122,.6);
}
#content .edm-page .edm-btn-ghost .wp-block-button__link:hover{
  background-color:rgba(239,207,122,.18) !important;color:#fff !important;text-decoration:none !important;
}

/* -- Paragraphes : contre p { text-align:justify; color:var(--text-color) } */
#content .edm-page p{text-align:left;text-indent:0;color:var(--edm-ink)}
#content .edm-page .has-text-align-center{text-align:center}
#content .edm-page .edm-hero p{color:#E4E2EE}
#content .edm-page .edm-hero h1{color:#fff}
#content .edm-page .edm-quote p{color:#fff}
#content .edm-page .edm-facts p{color:#C6C9DC}
#content .edm-page .edm-facts .edm-fact-num{color:var(--edm-gold-lt)}
#content .edm-page .edm-motto{color:var(--edm-gold-lt)}

/* -- Tablette et mobile : contre li, p { font-size:14px !important } ----- */
@media (max-width:1024px){
  #content .edm-page p{font-size:1rem !important}
  #content .edm-page .edm-hero .edm-hero-sub{font-size:1.02rem !important}
  #content .edm-page .edm-motto{font-size:1.2rem !important}
  #content .edm-page .edm-facts .edm-fact-num{font-size:1.5rem !important}
  #content .edm-page .edm-facts p:not(.edm-fact-num){font-size:.72rem !important}
  #content .edm-page .edm-quote p{font-size:1.5rem !important}
  #content .edm-page li{font-size:1rem !important}
}

/* -- L'en-tête du site est en position absolue et chevauche le contenu :
      on réserve la hauteur pour que le bandeau ne passe pas dessous. ----- */
body.edm-has-template .edm-page .edm-hero{padding-top:clamp(5rem,12vw,8rem)}


/* ======================================================================
   15. CORRECTIFS D'INTÉGRATION
   ====================================================================== */

/* -- A. Débordement horizontal ------------------------------------------
   Le contournement en 100vw incluait la largeur de la barre de défilement
   et faisait déborder la page, ce qui décalait .entete et l'en-tête.
   Sur le gabarit Étoile le conteneur est déjà à 100 %, donc les blocs
   pleine largeur n'ont plus besoin de s'en échapper.                      */
body.edm-has-template .edm-page .alignfull{
  width:100%;max-width:100%;margin-left:0;margin-right:0;
}
body.edm-has-template{overflow-x:hidden}

/* -- B. Espace vide entre l'en-tête et le bandeau -----------------------
   Sydney réserve la hauteur de l'en-tête avec .header-clone et garde une
   zone .sydney-hero-area vide quand le carrousel est sur « Nothing ».     */
body.edm-has-template .header-clone{display:none}
body.edm-has-template .sydney-hero-area,
body.edm-has-template .sydney-hero-area .header-image{
  min-height:0;height:auto;
}
body.edm-has-template #content.page-wrap{padding-top:0;margin-top:0}
body.edm-has-template .edm-page > *:first-child{margin-top:0}

/* L'en-tête n'étant plus en recouvrement, la réserve de hauteur
   ajoutée en section 14 n'a plus lieu d'être. */
body.edm-has-template .edm-page .edm-hero{padding-top:clamp(3rem,7vw,5rem)}

/* -- C. Pied de page ----------------------------------------------------
   Le pied restait sur une bande crème isolée après la bande bleue.
   On le raccorde au fond de la page.                                      */
body.edm-has-template #colophon,
body.edm-has-template .site-footer{
  background:var(--edm-navy-900);
  padding-top:2rem;padding-bottom:1.5rem;margin-top:0;
}
body.edm-has-template #copyright,
body.edm-has-template #colophon p{color:#AEB6D6}
body.edm-has-template #content .site-footer a,
body.edm-has-template #colophon a{color:var(--edm-gold-lt) !important}


/* ======================================================================
   16. EN-TÊTE COMPACT, FAÇON MAQUETTE
   Restyle le header.php existant : blason à gauche, nom de l'école,
   navigation à droite, dernier élément en pastille dorée.
   Uniquement sur le gabarit Étoile — les autres pages sont intactes.
   ====================================================================== */

/* La barre de coordonnées n'existe pas dans la maquette */
body.edm-header .entete{display:none}

/* Barre fine, collante, fond bleu entête */
body.edm-header .site-header{
  position:sticky;top:0;z-index:500;
  background:var(--edm-navy-700);
  border-bottom:1px solid rgba(255,237,196,.22);
  box-shadow:0 2px 20px rgba(0,0,34,.35);
  padding:0;
}
body.edm-header .site-header .header-wrap{padding:0}
body.edm-header .site-header .container{
  max-width:1160px;width:100%;padding:0 22px;margin:0 auto;
}

@media (min-width:1025px){

  body.edm-header .row.site-entete{
    display:flex;align-items:center;gap:.9rem;
    height:76px;margin:0;padding:0;flex-wrap:nowrap;width:100%;
  }

  /* Blason à gauche, format compact */
  body.edm-header .col-logo{
    order:1;width:auto;flex:none;margin:0;padding:0;float:none;
  }
  body.edm-header .col-logo .wp-image-19{
    width:auto;height:46px;margin:0;
  }

  /* Nom de l'école et devise */
  body.edm-header .col-title{
    order:2;width:auto;flex:1 1 auto;margin:0;padding:0;text-align:left;
  }
  body.edm-header .site-title{
    font-family:var(--edm-script);font-size:1.2rem;line-height:1.25;margin:0;
  }
  body.edm-header .site-title a{color:#fff !important}
  body.edm-header .site-description{
    font-family:var(--edm-script);font-size:.95rem;line-height:1.2;
    color:var(--edm-gold-lt);margin:0;
  }

  /* Navigation à droite */
  body.edm-header .col-menu{
    order:3;width:auto;flex:none;margin:0 0 0 auto;padding:0;display:block;
  }
  body.edm-header #mainnav ul{
    display:flex;align-items:center;gap:1.6rem;margin:0;padding:0;list-style:none;
  }
  body.edm-header #mainnav ul li{margin:0;padding:0;float:none}
  body.edm-header #mainnav ul li a{
    font-family:var(--edm-display);font-weight:600;font-size:.94rem;
    color:#E8E9F2 !important;text-decoration:none;padding:.3rem 0;
    border-bottom:1.5px solid transparent;transition:.2s;background:none;
  }
  body.edm-header #mainnav ul li a:hover{
    color:#fff !important;border-bottom-color:var(--edm-gold);
    background:none;text-decoration:none;
  }

  /* Dernier élément du menu en pastille dorée.
     Pour choisir un autre élément : Apparence → Menus → Options de l'écran
     → Classes CSS, puis ajoutez « edm-cta » à l'élément voulu. */
  body.edm-header #mainnav ul.menu > li:last-child > a,
  body.edm-header #mainnav ul > li.edm-cta > a{
    background:var(--edm-gold);color:var(--edm-navy-900) !important;
    border-radius:100px;padding:.62rem 1.3rem;border-bottom:0;
  }
  body.edm-header #mainnav ul.menu > li:last-child > a:hover,
  body.edm-header #mainnav ul > li.edm-cta > a:hover{
    background:var(--edm-gold-lt);color:var(--edm-navy-900) !important;border-bottom:0;
  }

  body.edm-header .btn-menu{display:none}
}

/* Mobile : on laisse le menu responsive faire son travail */
@media (max-width:1024px){
  body.edm-header .site-header{padding:0}
  body.edm-header .row.site-entete{padding:.6rem 0}
}


/* ======================================================================
   17. BANDEAU PLEINE HAUTEUR, COMME DANS LA MAQUETTE
   ====================================================================== */
body.edm-has-template .edm-page .edm-hero{
  min-height:calc(100vh - 76px);
  padding-top:clamp(4.5rem,12vw,8rem);
  padding-bottom:clamp(3rem,7vw,5rem);
  align-items:center;
}
body.edm-has-template .edm-page .edm-hero h1{
  max-width:15ch;font-size:clamp(2.2rem,5.6vw,4rem);
}
/* Un mot en doré dans le titre : sélectionnez-le dans l'éditeur et
   appliquez la couleur « Tonique » de la palette, ou mettez-le en
   italique — les deux donnent le même rendu ici. */
body.edm-has-template .edm-page .edm-hero h1 em,
body.edm-has-template .edm-page .edm-hero h1 i{
  font-style:normal;color:var(--edm-gold-lt);
}

/* Les boutons dorés reprennent l'or soutenu de la maquette */
#content .edm-page .edm-btn-gold .wp-block-button__link{
  background-color:var(--edm-gold) !important;color:var(--edm-navy-900) !important;
}
#content .edm-page .edm-btn-gold .wp-block-button__link:hover{
  background-color:var(--edm-gold-lt) !important;color:var(--edm-navy-900) !important;
}


/* ======================================================================
   18. LISIBILITÉ DU BANDEAU
   Le voile était trop transparent au centre : le texte blanc se perdait
   dans les bâtiments éclairés. On assombrit la zone médiane sans perdre
   le fondu vers le crème en bas.
   ====================================================================== */
body.edm-has-template .edm-page .edm-hero .wp-block-cover__background{
  background:linear-gradient(180deg,
    rgba(0,0,34,.90)  0%,
    rgba(0,0,34,.72) 28%,
    rgba(0,0,34,.66) 52%,
    rgba(0,0,34,.58) 70%,
    rgba(50,62,101,.35) 84%,
    rgba(254,244,230,.25) 93%,
    var(--edm-cream) 100%) !important;
  opacity:1 !important;
}
#content .edm-page .edm-hero h1{
  text-shadow:0 2px 24px rgba(0,0,34,.85), 0 1px 3px rgba(0,0,34,.6);
}
#content .edm-page .edm-hero .edm-hero-sub{
  color:#F0EEF6 !important;
  text-shadow:0 1px 12px rgba(0,0,34,.9), 0 1px 2px rgba(0,0,34,.7);
}
#content .edm-page .edm-motto{
  text-shadow:0 1px 10px rgba(0,0,34,.85);
}
#content .edm-page .edm-hero .edm-caption{
  color:#EFE9DE !important;text-shadow:0 1px 10px rgba(0,0,34,.8);
}

/* Hauteur un peu réduite : moins d'agrandissement de la photo */
body.edm-has-template .edm-page .edm-hero{
  min-height:min(88vh, 820px);
}


/* ======================================================================
   19. MENU AUTONOME — l'extension de menu responsive devient inutile
   Le bouton .btn-menu du header.php pilote désormais le menu, via
   assets/reveal.js. L'extension peut être désactivée sans rien casser.
   ====================================================================== */

/* On neutralise l'extension sur ce gabarit, quel que soit son identifiant */
body.edm-header [id^="rmp_menu_trigger"],
body.edm-header [id^="rmp-container"],
body.edm-header [id^="rmp-overlay"],
body.edm-header .rmp-menu-trigger{
  display:none !important;
}

@media (max-width:1024px){

  body.edm-header .row.site-entete{
    display:flex;align-items:center;gap:.8rem;
    width:100%;margin:0;padding:.6rem 0;flex-wrap:nowrap;
  }
  body.edm-header .col-logo{
    order:1;width:auto;flex:none;float:none;margin:0;padding:0;
  }
  body.edm-header .col-logo .wp-image-19{width:auto;height:40px}
  body.edm-header .col-title{
    order:2;width:auto;flex:1 1 auto;float:none;
    text-align:left !important;margin:0;padding:0;
  }
  body.edm-header .site-title{font-family:var(--edm-script);font-size:1.02rem;margin:0}
  body.edm-header .site-title a{color:#fff !important}
  body.edm-header .site-description{
    font-family:var(--edm-script);font-size:.82rem;color:var(--edm-gold-lt);margin:0;
  }

  /* Le bouton burger, repris de Sydney */
  body.edm-header .col-menu{
    display:block !important;order:3;width:auto;flex:none;margin-left:auto;padding:0;
  }
  body.edm-header .btn-menu{
    display:flex;align-items:center;justify-content:center;
    width:44px;height:44px;border-radius:10px;cursor:pointer;
    background:var(--edm-navy-700);color:var(--edm-gold-lt);
    transition:.2s;
  }
  body.edm-header .btn-menu:hover,
  body.edm-header.edm-nav-open .btn-menu{
    background:var(--edm-gold);color:var(--edm-navy-900);
  }
  body.edm-header .btn-menu .sydney-svg-icon svg{width:24px;height:24px;fill:currentColor}

  /* Le panneau déroulant */
  body.edm-header #mainnav{
    position:absolute;top:100%;left:0;right:0;
    background:linear-gradient(180deg,var(--edm-navy-900) 0%,var(--edm-navy-700) 100%);
    border-top:1px solid rgba(255,237,196,.22);
    box-shadow:0 18px 40px rgba(0,0,34,.45);
    max-height:0;overflow:hidden;transition:max-height .35s ease;
  }
  body.edm-header.edm-nav-open #mainnav{max-height:80vh;overflow:auto}
  body.edm-header #mainnav ul{list-style:none;margin:0;padding:.6rem 1rem 1.2rem}
  body.edm-header #mainnav ul li{margin:.35rem 0;float:none;width:100%}
  body.edm-header #mainnav ul li a{
    display:block;padding:.85rem 1rem;border-radius:8px;
    background:rgba(255,255,255,.05);
    color:var(--edm-gold-lt) !important;
    font-family:var(--edm-display);font-weight:600;font-size:1rem;
    text-decoration:none;transition:.2s;
  }
  body.edm-header #mainnav ul li a:hover{
    background:rgba(255,255,255,.12);color:#fff !important;transform:translateX(5px);
  }
  body.edm-header #mainnav ul.menu > li:last-child > a,
  body.edm-header #mainnav ul > li.edm-cta > a{
    background:var(--edm-gold);color:var(--edm-navy-900) !important;text-align:center;
  }

  body.edm-header .site-header{position:sticky;top:0}
}

@media (prefers-reduced-motion:reduce){
  body.edm-header #mainnav{transition:none}
}


/* ======================================================================
   20. PIED DE PAGE COMPACT
   Plusieurs sélecteurs pour couvrir les variantes de balisage de Sydney.
   ====================================================================== */
body.edm-has-template .site-footer,
body.edm-has-template #colophon,
body.edm-has-template footer[role="contentinfo"],
body.edm-has-template #page > footer{
  background:var(--edm-navy-900) !important;
  padding:.9rem 0 !important;
  margin:0 !important;
  border-top:1px solid rgba(255,237,196,.18);
}
body.edm-has-template .site-footer .container,
body.edm-has-template #colophon .container{
  padding-top:0 !important;padding-bottom:0 !important;
}
body.edm-has-template #copyright,
body.edm-has-template #colophon p{
  margin:0 !important;padding:0 !important;
  font-size:.86rem;line-height:1.5;color:#AEB6D6 !important;
}
body.edm-has-template #copyright a,
body.edm-has-template #colophon a,
body.edm-has-template .mentions-legales{
  color:var(--edm-gold-lt) !important;
}
body.edm-has-template #copyright a:hover,
body.edm-has-template #colophon a:hover{
  color:#fff !important;background:none !important;text-decoration:underline !important;
}
/* Zones de widgets du pied : compactées, masquées si vides */
body.edm-has-template .footer-widgets,
body.edm-has-template .footer-widgets-grid{
  padding:0 !important;margin:0 !important;
}
body.edm-has-template .footer-widgets:empty{display:none}

/* Bande citation un peu moins haute, pour équilibrer la fin de page */
body.edm-has-template .edm-page .edm-quote{
  padding-block:clamp(2.5rem,5.5vw,4rem);
}


/* ======================================================================
   21. CARTES — actualités et galeries photos
   ====================================================================== */
.edm-page .edm-cards{gap:1.5rem;margin-top:2.5rem}
.edm-page .edm-cards .edm-card{
  background:#fff;border-radius:var(--edm-radius);overflow:hidden;
  border:1px solid rgba(0,0,34,.10);
  box-shadow:0 10px 30px -22px rgba(0,0,34,.5);
  transition:transform .25s ease, box-shadow .25s ease;
  display:flex;flex-direction:column;padding:0;
}
.edm-page .edm-cards .edm-card:hover{
  transform:translateY(-5px);box-shadow:0 24px 45px -25px rgba(0,0,34,.55);
}
.edm-page .edm-card .edm-card-media{margin:0;overflow:hidden}
.edm-page .edm-card .edm-card-media img{
  width:100%;height:190px;object-fit:cover;display:block;
  border-radius:0;transition:transform .5s ease;
}
.edm-page .edm-card:hover .edm-card-media img{transform:scale(1.05)}
.edm-page .edm-card .edm-card-body{padding:1.25rem 1.4rem 1.5rem;flex:1}
.edm-page .edm-card .edm-tag{
  font-family:var(--edm-display);font-size:.7rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--edm-gold);margin:0;
}
.edm-page .edm-card h3{
  margin:.45rem 0 .4rem;font-size:1.14rem;color:var(--edm-navy-700);
}
.edm-page .edm-card p{margin:0;font-size:.97rem;color:var(--edm-ink-soft)}
#content .edm-page .edm-card .edm-card-link{margin-top:.9rem}
#content .edm-page .edm-card .edm-card-link a{
  font-family:var(--edm-display) !important;font-weight:700 !important;
  font-size:.88rem;letter-spacing:.04em;text-transform:uppercase;
  color:var(--edm-gold) !important;text-decoration:none !important;
  border-bottom:1.5px solid rgba(176,138,46,.4);padding-bottom:2px;
}
#content .edm-page .edm-card .edm-card-link a:hover{
  color:var(--edm-navy-900) !important;border-bottom-color:var(--edm-navy-900);
  background:none !important;
}

/* Galeries : la vignette entière est cliquable */
.edm-page .edm-galeries .edm-card-media a{display:block;position:relative}
.edm-page .edm-galeries .edm-card-media a::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(0,0,34,.55) 100%);
  opacity:0;transition:opacity .3s ease;
}
.edm-page .edm-galeries .edm-card:hover .edm-card-media a::after{opacity:1}

@media (max-width:781px){
  .edm-page .edm-cards{gap:1.2rem}
  .edm-page .edm-card .edm-card-media img{height:210px}
}


/* ======================================================================
   22. NOUS REJOINDRE / CONTACT
   ====================================================================== */
.edm-page .edm-contact{
  background:var(--edm-cream-2);
  padding-block:clamp(3rem,7vw,5rem);
}
.edm-page .edm-contact .edm-lead{
  font-size:1.15rem;color:var(--edm-ink-soft);margin-top:1rem;
}
.edm-page .edm-info{
  list-style:none;padding:0;margin:1.7rem 0 1.9rem;display:grid;gap:.9rem;
}
.edm-page .edm-info li{
  position:relative;padding-left:1.9rem;font-size:1.02rem;color:var(--edm-ink);
}
.edm-page .edm-info li::before{
  content:"";position:absolute;left:0;top:.45em;width:12px;height:12px;
  background:var(--edm-gold);
  -webkit-mask:var(--edm-star-mask) center/contain no-repeat;
          mask:var(--edm-star-mask) center/contain no-repeat;
}
#content .edm-page .edm-info li a{
  color:var(--edm-navy-700) !important;text-decoration:none !important;
  border-bottom:1px solid rgba(50,62,101,.35);
}
#content .edm-page .edm-info li a:hover{
  color:var(--edm-navy-900) !important;border-bottom-color:var(--edm-navy-900);
  background:none !important;
}
.edm-page .edm-contact .edm-media img{
  border-radius:var(--edm-radius);
  box-shadow:0 18px 45px -22px rgba(0,0,34,.55);
}


/* ======================================================================
   23. LA BANDE VIDE AVANT LE PIED DE PAGE
   Sydney et le CSS du site empilent plusieurs marges basses.
   On les remet toutes à zéro sur le gabarit Étoile.
   ====================================================================== */
body.edm-has-template #content.page-wrap,
body.edm-has-template #content .container.content-wrapper,
body.edm-has-template #primary,
body.edm-has-template #main,
body.edm-has-template #main.post-wrap{
  padding-bottom:0 !important;
  margin-bottom:0 !important;
  height:auto !important;
  min-height:0 !important;
}
body.edm-has-template .edm-page{margin-bottom:0}
body.edm-has-template .edm-page > *:last-child{margin-bottom:0;padding-bottom:0}
body.edm-has-template .edm-page > .edm-contact:last-child{
  padding-bottom:clamp(3rem,7vw,5rem);
}

/* Zone de widgets du pied : compactée (masquée si aucun widget) */
body.edm-has-template .footer-widgets,
body.edm-has-template .footer-widgets-grid,
body.edm-has-template .footer-widgets .container{
  padding-top:0 !important;padding-bottom:0 !important;
  margin-top:0 !important;margin-bottom:0 !important;
}

/* Tout le texte du pied doit rester lisible sur le bleu marine */
body.edm-has-template #colophon,
body.edm-has-template #colophon *,
body.edm-has-template .site-footer,
body.edm-has-template .site-footer *{
  color:#C3CADF;
}
body.edm-has-template #colophon a,
body.edm-has-template .site-footer a,
body.edm-has-template #copyright a,
body.edm-has-template .mentions-legales{
  color:var(--edm-gold-lt) !important;
}
body.edm-has-template #colophon a:hover,
body.edm-has-template .site-footer a:hover{
  color:#fff !important;background:none !important;
}

/* Le bouton « retour en haut » ne doit pas flotter sur le vide */
body.edm-has-template .go-top{
  background-color:var(--edm-navy-700);color:var(--edm-gold-lt);
}
body.edm-has-template .go-top:hover{
  background-color:var(--edm-gold);color:var(--edm-navy-900);
}


/* ======================================================================
   24. EN-TÊTE EN --entete2
   Le fond passe au bleu moyen. Le burger mobile prend le bleu foncé
   pour rester détaché du fond, et le filet doré est renforcé.
   ====================================================================== */
body.edm-header .site-header{
  border-bottom:1px solid rgba(255,237,196,.3);
  box-shadow:0 2px 22px rgba(0,0,34,.4);
}
@media (max-width:1024px){
  body.edm-header .btn-menu{
    background:var(--edm-navy-900);color:var(--edm-gold-lt);
  }
  body.edm-header .btn-menu:hover,
  body.edm-header.edm-nav-open .btn-menu{
    background:var(--edm-gold);color:var(--edm-navy-900);
  }
  body.edm-header #mainnav{
    background:linear-gradient(180deg,var(--edm-navy-700) 0%,var(--edm-navy-900) 100%);
  }
}


/* ======================================================================
   24. AJUSTEMENTS
   ====================================================================== */

/* -- A. En-tête en --entete2 (bleu plus clair) -------------------------- */
body.edm-header .site-header{
  background:var(--edm-navy-700);
  border-bottom:1px solid rgba(255,237,196,.25);
}
@media (max-width:1024px){
  body.edm-header #mainnav{
    background:linear-gradient(180deg,var(--edm-navy-700) 0%,var(--edm-navy-900) 100%);
  }
  body.edm-header .btn-menu{background:var(--edm-navy-900)}
}

/* -- B. Pied de page : atteindre le texte quel que soit le balisage -----
   Le fond avait été pris par footer[role="contentinfo"], donc les règles
   visant #colophon et .site-footer ne touchaient aucun enfant.           */
body.edm-has-template footer,
body.edm-has-template footer *,
body.edm-has-template #page > footer *,
body.edm-has-template footer[role="contentinfo"] *{
  color:#C3CADF !important;
}
body.edm-has-template footer a,
body.edm-has-template footer .mentions-legales,
body.edm-has-template footer #copyright a{
  color:var(--edm-gold-lt) !important;
}
body.edm-has-template footer a:hover{
  color:#fff !important;background:none !important;text-decoration:underline !important;
}

/* Pied plus ramassé */
body.edm-has-template footer,
body.edm-has-template footer[role="contentinfo"],
body.edm-has-template #page > footer{
  padding:.75rem 0 !important;
}
body.edm-has-template footer .container,
body.edm-has-template footer .row,
body.edm-has-template footer .col-md-6,
body.edm-has-template footer .widget-area{
  padding-top:0 !important;padding-bottom:0 !important;
  margin-top:0 !important;margin-bottom:0 !important;
}
body.edm-has-template footer p,
body.edm-has-template footer #copyright{
  margin:0 !important;font-size:.86rem !important;line-height:1.6;
}

/* Le bouton « retour en haut » garde ses couleurs propres */
body.edm-has-template .go-top,
body.edm-has-template .go-top *{
  color:var(--edm-gold-lt) !important;
}


/* ======================================================================
   25. EN-TÊTE FONCÉ ET PIED DE PAGE SANS FOND
   ====================================================================== */

/* -- A. Retour au bleu --entete pour l'en-tête -------------------------- */
body.edm-header .site-header{
  background:var(--edm-navy-900);
  border-bottom:1px solid rgba(255,237,196,.22);
}
@media (max-width:1024px){
  body.edm-header #mainnav{
    background:linear-gradient(180deg,var(--edm-navy-900) 0%,var(--edm-navy-700) 100%);
  }
  body.edm-header .btn-menu{background:var(--edm-navy-700)}
  body.edm-header .btn-menu:hover,
  body.edm-header.edm-nav-open .btn-menu{background:var(--edm-gold);color:var(--edm-navy-900)}
}

/* -- B. Pied de page : aucun fond propre, deux lignes maximum ------------
   Il prend le fond de la page et disparaît en tant que bande.            */
body.edm-has-template footer,
body.edm-has-template footer[role="contentinfo"],
body.edm-has-template #colophon,
body.edm-has-template .site-footer,
body.edm-has-template #page > footer{
  background:transparent !important;
  background-color:transparent !important;
  border-top:0 !important;
  box-shadow:none !important;
  padding:.4rem 0 .7rem !important;
  margin:0 !important;
  min-height:0 !important;
}

/* Texte sobre sur le fond crème */
body.edm-has-template footer,
body.edm-has-template footer *,
body.edm-has-template #colophon *,
body.edm-has-template .site-footer *{
  color:var(--edm-ink-soft) !important;
  font-size:.8rem !important;
  line-height:1.5 !important;
}
body.edm-has-template footer a,
body.edm-has-template footer .mentions-legales,
body.edm-has-template #colophon a,
body.edm-has-template .site-footer a{
  color:var(--edm-navy-700) !important;
  text-decoration:none !important;
}
body.edm-has-template footer a:hover,
body.edm-has-template #colophon a:hover{
  color:var(--edm-gold) !important;
  background:none !important;
  text-decoration:underline !important;
}

/* Toutes les marges internes écrasées : rien ne doit gonfler la bande */
body.edm-has-template footer .container,
body.edm-has-template footer .row,
body.edm-has-template footer .col-md-6,
body.edm-has-template footer .widget-area,
body.edm-has-template footer .footer-widgets,
body.edm-has-template footer .footer-widgets-grid,
body.edm-has-template footer p,
body.edm-has-template footer #copyright{
  padding:0 !important;margin:0 !important;
  border:0 !important;min-height:0 !important;
}

/* Le bouton « retour en haut » garde son identité */
body.edm-has-template .go-top{
  background-color:var(--edm-navy-700) !important;
}
body.edm-has-template .go-top,
body.edm-has-template .go-top *{
  color:var(--edm-gold-lt) !important;font-size:inherit !important;
}
body.edm-has-template .go-top:hover{
  background-color:var(--edm-gold) !important;
}
body.edm-has-template .go-top:hover,
body.edm-has-template .go-top:hover *{
  color:var(--edm-navy-900) !important;
}


/* ======================================================================
   26. PIED DE PAGE — CONTRASTE ET HAUTEUR DÉFINITIFS
   Une seule ligne lisible, hauteur totale d'environ 40 px.
   ====================================================================== */
body.edm-has-template footer,
body.edm-has-template footer[role="contentinfo"],
body.edm-has-template #colophon,
body.edm-has-template .site-footer,
body.edm-has-template #page > footer{
  padding:.5rem 0 !important;
  min-height:0 !important;
  max-height:none;
  line-height:1.4 !important;
}

/* Texte nettement plus soutenu : l'encre du corps de page */
body.edm-has-template footer,
body.edm-has-template footer *,
body.edm-has-template footer #copyright,
body.edm-has-template footer #copyright *,
body.edm-has-template #colophon *,
body.edm-has-template .site-footer *{
  color:var(--edm-ink) !important;
  font-size:.82rem !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  letter-spacing:.01em;
}

/* Les liens ressortent en bleu du site */
body.edm-has-template footer a,
body.edm-has-template footer #copyright a,
body.edm-has-template footer .mentions-legales,
body.edm-has-template #colophon a,
body.edm-has-template .site-footer a{
  color:var(--edm-navy-700) !important;
  font-weight:600 !important;
  text-decoration:none !important;
}
body.edm-has-template footer a:hover,
body.edm-has-template #colophon a:hover,
body.edm-has-template .site-footer a:hover{
  color:var(--edm-gold) !important;
  text-decoration:underline !important;
  background:none !important;
}

/* Aucun espace parasite au-dessus ni à l'intérieur */
body.edm-has-template .edm-page > *:last-child{margin-bottom:0 !important}
body.edm-has-template footer > *,
body.edm-has-template footer .container,
body.edm-has-template footer .row,
body.edm-has-template footer .col-md-6,
body.edm-has-template footer .widget-area,
body.edm-has-template footer .footer-widgets,
body.edm-has-template footer .footer-widgets-grid,
body.edm-has-template footer p{
  padding:0 !important;margin:0 !important;
  border:0 !important;min-height:0 !important;line-height:1.4 !important;
}

/* Le bouton « retour en haut » ne doit pas imposer sa hauteur */
body.edm-has-template .go-top{
  width:38px;height:38px;line-height:38px !important;
}
body.edm-has-template .go-top,
body.edm-has-template .go-top *{
  color:var(--edm-gold-lt) !important;font-size:.9rem !important;
}


/* ======================================================================
   27. PIED DE PAGE — LEVER UNE ÉVENTUELLE OPACITÉ
   Si la couleur reste délavée malgré un color !important, la cause est
   ailleurs : opacité, filtre, ou fusion de calque héritée.
   ====================================================================== */
body.edm-has-template footer,
body.edm-has-template footer *,
body.edm-has-template #colophon,
body.edm-has-template #colophon *,
body.edm-has-template .site-footer,
body.edm-has-template .site-footer *,
body.edm-has-template #copyright,
body.edm-has-template #copyright *,
body.edm-has-template .site-info,
body.edm-has-template .site-info *{
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  -webkit-text-fill-color:currentColor !important;
}

/* Couleur reposée avec l'identifiant, priorité maximale */
body.edm-has-template #copyright,
body.edm-has-template #copyright *,
body.edm-has-template .site-info,
body.edm-has-template .site-info *{
  color:#22252E !important;
}
body.edm-has-template #copyright a,
body.edm-has-template .site-info a,
body.edm-has-template #copyright .mentions-legales{
  color:#323E65 !important;
}


/* ======================================================================
   28. LIGNE DE COPYRIGHT ADAPTATIVE
   Taille fluide entre 0,72 et 0,84 rem selon la largeur d'écran,
   sans media query. Le clamp() bat aussi la règle du site
   « li, p { font-size:14px !important } » sous 1024 px.
   ====================================================================== */
body.edm-has-template footer,
body.edm-has-template footer *,
body.edm-has-template #copyright,
body.edm-has-template #copyright *,
body.edm-has-template .site-info,
body.edm-has-template .site-info *{
  font-size:clamp(.72rem, .62rem + .45vw, .84rem) !important;
  line-height:1.5 !important;
}

/* La ligne doit pouvoir se couper proprement sur petit écran */
body.edm-has-template #copyright,
body.edm-has-template .site-info{
  text-align:center;
  padding:0 14px !important;
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:none;
}

/* Sur mobile, « Mentions légales » passe à la ligne au lieu de serrer */
@media (max-width:480px){
  body.edm-has-template #copyright .mentions-legales,
  body.edm-has-template .site-info .mentions-legales{
    display:block;margin-top:.15rem;
  }
  /* le tiret séparateur n'a plus de sens une fois le lien à la ligne */
  body.edm-has-template #copyright{font-size:clamp(.7rem,3vw,.78rem) !important}
}

/* Le survol du site donne un fond bleu aux .mentions-legales :
   sans effet ici, le pied n'étant pas dans #content. */
body.edm-has-template footer .mentions-legales:hover{
  background:none !important;
  color:var(--edm-gold) !important;
  text-decoration:underline !important;
}


/* ======================================================================
   29. PAGES INTÉRIEURES — ajouté en août 2026
   Quatre briques nouvelles, réutilisables sur toutes les pages :
     A. .edm-pagehead   — bandeau de titre bleu
     B. .edm-coord      — coordonnées, encart et carte
     C. .edm-steps      — étapes numérotées (page Inscription)
     D. .edm-appel      — bande d'appel de fin de page
   Rien ici ne touche aux blocs de l'accueil.
   ====================================================================== */

/* -- Utilitaires communs ------------------------------------------------ */

/* Surtitre centré : la variante de gauche garde son unique filet. */
.edm-page .edm-eyebrow-center{justify-content:center}
.edm-page .edm-eyebrow-center::after{
  content:"";width:26px;height:1px;background:var(--edm-gold);flex:none;
}

/* Chapô, disponible partout (la variante de .edm-contact reste prioritaire) */
.edm-page .edm-lead{font-size:1.12rem;color:var(--edm-ink-soft);margin-top:1rem}
#content .edm-page .edm-lead{color:var(--edm-ink-soft)}


/* -- A. BANDEAU DE TITRE DES PAGES INTÉRIEURES --------------------------
   L'équivalent sobre du grand bandeau de l'accueil : même bleu, même
   étoile, mais sans photo et sur un tiers de la hauteur.               */
.edm-page .edm-pagehead{
  background:
    radial-gradient(120% 150% at 50% -35%, rgba(50,62,101,.9) 0%, transparent 62%),
    linear-gradient(180deg, var(--edm-navy-900) 0%, #1a2246 100%);
  padding-block:clamp(3.2rem,7vw,5.2rem);
  position:relative;overflow:hidden;text-align:center;
}
/* Étoile du blason, en filigrane dans l'angle */
.edm-page .edm-pagehead::after{
  content:"";position:absolute;right:-50px;bottom:-70px;
  width:240px;height:240px;background:var(--edm-gold-lt);opacity:.06;
  -webkit-mask:var(--edm-star-mask) center/contain no-repeat;
          mask:var(--edm-star-mask) center/contain no-repeat;
  pointer-events:none;
}
/* Le contenu passe au-dessus du filigrane, que le conteneur interne du
   bloc Groupe soit présent ou non selon la version de WordPress.
   La variante photo est exclue : ses enfants sont l'image et le voile du
   bloc Couverture, que WordPress positionne en absolu — leur imposer
   position:relative les ferait basculer dans le flux. */
.edm-page .edm-pagehead:not(.edm-pagehead-photo) > .wp-block-group__inner-container,
.edm-page .edm-pagehead:not(.edm-pagehead-photo) > *{position:relative;z-index:1}

.edm-page .edm-pagehead .edm-eyebrow::before,
.edm-page .edm-pagehead .edm-eyebrow::after{background:var(--edm-gold-lt)}

/* Le titre du site est bleu marine par défaut : ici il passe au blanc. */
#content .edm-page .edm-pagehead h1{
  color:#fff !important;
  font-size:clamp(2rem,4.6vw,3.2rem);
  max-width:18ch;margin:0 auto;
}
#content .edm-page .edm-pagehead p{color:#D9DCEC}
#content .edm-page .edm-pagehead .edm-lead{
  color:#D9DCEC;max-width:56ch;margin:1.1rem auto 0;text-align:center;
}
/* Reposé APRÈS la règle sur p ci-dessus, qui sinon décolorerait le
   surtitre : elle porte un identifiant et gagnerait. */
#content .edm-page .edm-pagehead .edm-eyebrow{
  color:var(--edm-gold-lt);margin-bottom:.9rem;
}


/* -- B. COORDONNÉES, ENCART ET CARTE ------------------------------------ */

/* Fond volontairement identique à celui de la page.
   Une bande crème foncé se voyait s'arrêter net au-dessus du pied de page,
   qui lui garde le crème du site : la couture était visible. Le contraste
   est désormais porté par la fiche blanche et par l'encart, pas par une
   bande de fond. */
.edm-page .edm-coord{
  background:transparent;
  padding-block:clamp(3rem,7vw,4.8rem);
}
/* Ceinture et bretelles : le pied de page n'a pas de fond propre
   (section 25), il prend donc celui du document. */
body.edm-has-template{background:var(--edm-cream)}
/* Les deux colonnes s'étirent : la carte prend la hauteur de la fiche. */
.edm-page .edm-coord .wp-block-columns{align-items:stretch;gap:2.2rem}
.edm-page .edm-coord .wp-block-column{display:flex;flex-direction:column}

/* La fiche blanche */
.edm-page .edm-card-contact{
  background:#fff;border-radius:var(--edm-radius);
  border:1px solid rgba(0,0,34,.09);
  box-shadow:0 14px 40px -28px rgba(0,0,34,.55);
  padding:clamp(1.5rem,3.5vw,2.2rem);
}
.edm-page .edm-card-contact h2{font-size:clamp(1.4rem,2.6vw,1.75rem)}
.edm-page .edm-card-contact .wp-block-buttons{margin-top:1.7rem}

/* Libellés Adresse / Téléphone / Courriel, au-dessus de la donnée.
   Le !important passe outre la règle « li, p { font-size:14px } » du site. */
.edm-page .edm-coord .edm-info{margin:1.5rem 0 0}
#content .edm-page .edm-info li strong{
  display:block;font-family:var(--edm-display);font-weight:700;
  font-size:.72rem !important;letter-spacing:.18em;text-transform:uppercase;
  color:var(--edm-gold);margin-bottom:.1rem;
}

/* L'encart « Bon à savoir » : même famille que l'encart Anciens, en or.
   Il court sous les deux colonnes, ce qui libère la colonne de gauche —
   la carte peut alors s'aligner exactement sur la hauteur de la fiche. */
.edm-page .edm-encart{
  background:var(--edm-cream-2);border-left:4px solid var(--edm-gold);
  border-radius:var(--edm-radius);
  padding:clamp(1.2rem,3vw,1.7rem);margin-top:2.2rem;
}
.edm-page .edm-encart h3{
  color:var(--edm-navy-700);font-size:1.02rem;margin:0 0 .5rem;
}
/* Sur toute la largeur, une ligne de texte deviendrait illisible :
   on la ramène à une longueur de lecture correcte. */
#content .edm-page .edm-encart p{
  margin:0;font-size:.96rem;color:var(--edm-ink-soft);max-width:78ch;
}

/* La carte, dans un cadre arrondi qui suit la hauteur de la colonne.
   Volontairement pas un bloc « Intégration » : la règle du site
   .wp-block-embed__wrapper{padding-bottom:56.25%} imposerait un ratio. */
.edm-page .edm-map{
  flex:1;display:flex;
  border-radius:var(--edm-radius);overflow:hidden;
  border:1px solid rgba(0,0,34,.12);
  box-shadow:0 18px 45px -24px rgba(0,0,34,.5);
  background:var(--edm-cream);line-height:0;
}
/* Le plancher est volontairement bas : c'est l'étirement de la colonne,
   donc la hauteur de la fiche voisine, qui doit fixer la taille de la
   carte. Un plancher élevé la ferait dépasser sous la fiche. */
.edm-page .edm-map iframe{
  flex:1;display:block;width:100%;height:100%;min-height:320px;border:0;
}
@media (max-width:781px){
  /* Colonnes empilées : plus de voisine pour donner la hauteur. */
  .edm-page .edm-coord .wp-block-columns{gap:1.6rem}
  .edm-page .edm-map iframe{min-height:300px}
}

/* Sur la page « Nous rejoindre », cette section termine la page :
   elle doit garder sa respiration basse malgré la remise à zéro
   de la section 23.                                                      */
body.edm-has-template .edm-page > .edm-coord:last-child{
  padding-bottom:clamp(3rem,7vw,4.8rem) !important;
}


/* -- C. ÉTAPES NUMÉROTÉES (page Inscription) ---------------------------- */
.edm-page .edm-steps{gap:1.4rem;margin-top:2.6rem;align-items:stretch}
.edm-page .edm-steps .edm-step{
  background:#fff;border-radius:var(--edm-radius);
  border:1px solid rgba(0,0,34,.09);
  box-shadow:0 10px 30px -24px rgba(0,0,34,.55);
  padding:1.6rem 1.5rem 1.7rem;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.edm-page .edm-steps .edm-step:hover{
  transform:translateY(-4px);border-color:rgba(176,138,46,.45);
  box-shadow:0 22px 42px -26px rgba(0,0,34,.5);
}
#content .edm-page .edm-step .edm-step-num{
  font-family:var(--edm-display);font-weight:700;
  font-size:2.4rem !important;line-height:1;
  color:var(--edm-gold);opacity:.5;margin:0 0 .5rem;
}
.edm-page .edm-step h3{font-size:1.1rem;color:var(--edm-navy-700);margin:0 0 .45rem}
#content .edm-page .edm-step p:not(.edm-step-num){
  margin:0;font-size:.98rem;color:var(--edm-ink-soft);
}


/* -- D. BANDE D'APPEL DE FIN DE PAGE ------------------------------------ */
.edm-page .edm-appel{
  background:linear-gradient(180deg,var(--edm-navy-900) 0%,var(--edm-navy-700) 100%);
  padding-block:clamp(2.8rem,6vw,4.2rem);text-align:center;
}
.edm-page .edm-appel .edm-eyebrow::before,
.edm-page .edm-appel .edm-eyebrow::after{background:var(--edm-gold-lt)}
#content .edm-page .edm-appel h2{color:#fff !important;max-width:22ch;margin:0 auto}
#content .edm-page .edm-appel p{color:#D9DCEC;text-align:center}
#content .edm-page .edm-appel .edm-appel-sub{max-width:52ch;margin:1rem auto 0}
/* Même précaution que pour le bandeau de titre : le surtitre doit être
   reposé après la règle sur p, sinon il perd son doré. */
#content .edm-page .edm-appel .edm-eyebrow{color:var(--edm-gold-lt)}
.edm-page .edm-appel .wp-block-buttons{margin-top:1.8rem}
body.edm-has-template .edm-page > .edm-appel:last-child{
  padding-bottom:clamp(2.8rem,6vw,4.2rem) !important;
}


/* -- Tablette et mobile : la règle « p { font-size:14px !important } »
      du site reprend la main sous 1024 px. On repose nos tailles.       */
@media (max-width:1024px){
  #content .edm-page .edm-pagehead .edm-lead{font-size:1.02rem !important}
  #content .edm-page .edm-lead{font-size:1.02rem !important}
  #content .edm-page .edm-step .edm-step-num{font-size:2rem !important}
  #content .edm-page .edm-info li strong{font-size:.7rem !important}
}


/* ======================================================================
   30. FILET DE SÉCURITÉ — page portant des blocs Étoile sans le gabarit
   Le thème enfant enrobe alors le contenu dans .edm-page.edm-page-auto
   (voir edm_wrap_content() dans functions.php). Il reste à neutraliser
   les conteneurs que Sydney place autour du contenu dans ce cas.
   ====================================================================== */
body.edm-has-template .edm-page-auto{width:100%;max-width:100%;padding:0;margin:0}
body.edm-has-template .entry-content,
body.edm-has-template .post-content,
body.edm-has-template .entry-content-wrap,
body.edm-has-template article,
body.edm-has-template .hentry{
  width:100%;max-width:100%;padding:0 !important;margin:0 !important;
}

/* Le titre de la page est porté par le bandeau .edm-pagehead : le titre
   que Sydney imprime au-dessus ferait doublon. Plusieurs sélecteurs pour
   couvrir les variantes de balisage du thème parent. */
body.edm-has-template .page-header,
body.edm-has-template .title-post,
body.edm-has-template .entry-header,
body.edm-has-template .page-title,
body.edm-has-template h1.entry-title{display:none}

/* Le lien « Modifier » n'est visible que des administrateurs connectés ;
   on le décolle simplement du dernier bloc. */
body.edm-has-template .post-edit-link{
  display:inline-block;margin:1.2rem 22px;font-size:.8rem;
}


/* ======================================================================
   31. PAGE PAROISSE — ajouté en août 2026
     A. .edm-pagehead-photo — le bandeau de titre, variante photo
     B. .edm-intro          — bloc d'introduction centré
     C. .edm-horaires       — la grille des offices
     D. correctif carte seule
   ====================================================================== */

/* -- A. BANDEAU DE TITRE, VARIANTE PHOTO --------------------------------
   Construit sur un bloc Couverture, comme le bandeau de l'accueil, mais
   sur une demi-hauteur. Le voile reprend le dégradé bleu de la maison. */
.edm-page .edm-pagehead-photo{
  background:none;
  min-height:clamp(340px,52vh,520px);
  padding-block:clamp(3.5rem,8vw,5.5rem);
  display:flex;align-items:center;
}
/* Pas de filigrane sur une photo : il se perdrait dans l'image. */
.edm-page .edm-pagehead-photo::after{display:none}

/* Positionnement posé explicitement, sans compter sur la feuille du bloc
   Couverture de WordPress. Selon la version et les options d'optimisation
   du site, elle peut ne pas être chargée : l'image retombe alors dans le
   flux et vient se ranger À CÔTÉ du texte au lieu d'être derrière. Ces
   trois règles rendent le bandeau autonome. */
.edm-page .edm-pagehead-photo{position:relative;overflow:hidden}
.edm-page .edm-pagehead-photo > img.wp-block-cover__image-background{
  position:absolute;inset:0;margin:0;z-index:0;
  width:100%;height:100%;max-width:none;object-fit:cover;
}
.edm-page .edm-pagehead-photo > .wp-block-cover__background{
  position:absolute;inset:0;z-index:1;
}
.edm-page .edm-pagehead-photo > .wp-block-cover__inner-container{
  position:relative;z-index:2;width:100%;
}

body.edm-has-template .edm-page .edm-pagehead-photo .wp-block-cover__background{
  background:linear-gradient(180deg,
    rgba(0,0,34,.86)   0%,
    rgba(0,0,34,.62)  42%,
    rgba(0,0,34,.60)  66%,
    rgba(26,34,70,.72) 100%) !important;
  opacity:1 !important;
}
/* Sur photo, l'ombre portée fait la lisibilité. */
#content .edm-page .edm-pagehead-photo h1{
  text-shadow:0 2px 24px rgba(0,0,34,.75), 0 1px 3px rgba(0,0,34,.6);
  max-width:20ch;
}
#content .edm-page .edm-pagehead-photo .edm-lead{
  color:#E6E4EF;text-shadow:0 1px 12px rgba(0,0,34,.85);
}


/* -- B. INTRODUCTION CENTRÉE --------------------------------------------
   Bloc de lecture court, centré. La largeur en ch borne la ligne : au-delà
   de ~76 caractères l'œil perd le début de la ligne suivante. */
.edm-page .edm-intro{max-width:76ch;margin-inline:auto;text-align:center}
#content .edm-page .edm-intro p{
  text-align:center;font-size:1.1rem;color:var(--edm-ink-soft);margin:1.2rem 0 0;
}
#content .edm-page .edm-intro h2{margin-top:0}


/* -- C. HORAIRES DES OFFICES --------------------------------------------
   Deux fiches côte à côte. L'heure porte le poids typographique, l'office
   reste en texte courant : la grille se lit d'un coup d'œil. */
.edm-page .edm-horaires{gap:1.6rem;margin-top:2.6rem;align-items:stretch}
.edm-page .edm-horaires .edm-office{
  background:#fff;border-radius:var(--edm-radius);
  border:1px solid rgba(0,0,34,.09);
  box-shadow:0 14px 40px -28px rgba(0,0,34,.55);
  padding:clamp(1.4rem,3vw,2rem);
}
/* Le titre de fiche est traité en surtitre doré, étoile en tête. */
.edm-page .edm-office h3{
  font-family:var(--edm-display);font-weight:700;font-size:.8rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--edm-gold);
  display:flex;align-items:center;gap:.6rem;margin:0;
}
.edm-page .edm-office h3::before{
  content:"";width:14px;height:14px;flex:none;background:var(--edm-gold);
  -webkit-mask:var(--edm-star-mask) center/contain no-repeat;
          mask:var(--edm-star-mask) center/contain no-repeat;
}

/* Une ligne d'horaire = un paragraphe. L'heure est dans un <strong>,
   l'intitulé suit en texte simple : rien qui puisse être avalé par
   l'éditeur de blocs, contrairement à un <span> nu. */
.edm-page .edm-heure{
  display:flex;align-items:baseline;gap:1.2rem;
  padding:.85rem 0;margin:0;
  border-top:1px solid rgba(0,0,34,.08);
}
.edm-page .edm-office .edm-heure:first-of-type{border-top:0;padding-top:1.3rem}
.edm-page .edm-office .edm-heure:last-of-type{padding-bottom:0}
#content .edm-page .edm-heure{
  color:var(--edm-ink-soft);font-size:1.02rem !important;text-align:left;
}
#content .edm-page .edm-heure strong{
  font-family:var(--edm-display);font-weight:700;
  color:var(--edm-navy-900);font-size:1.32rem !important;
  letter-spacing:.01em;line-height:1.2;
  flex:0 0 5.4rem;
}
@media (max-width:781px){
  .edm-page .edm-horaires{gap:1.2rem}
  #content .edm-page .edm-heure strong{flex:0 0 4.8rem;font-size:1.2rem !important}
}

/* Deux paragraphes ou plus dans l'encart : on les sépare. */
#content .edm-page .edm-encart p + p{margin-top:.7rem}


/* -- D. UNE SEULE CARTE ------------------------------------------------
   Une carte seule dans une grille prévue pour trois s'étirait sur toute
   la largeur et perdait ses proportions. */
.edm-page .edm-cards .edm-card:only-child{max-width:420px}


/* ======================================================================
   32. LES PHOTOS — index des albums, album, visionneuse
     A. .edm-fil          — fil d'Ariane sur bandeau sombre
     B. .edm-albums       — la grille des albums
     C. .edm-album-meta   — la ligne d'informations d'un album
     D. .edm-galerie      — le bloc Galerie natif, en grille
     E. .edm-album-nav    — album précédent / suivant
     F. la visionneuse de l'extension, aux couleurs de l'école

   Aucune galerie n'est stockée dans une extension : les photos restent
   dans des blocs Galerie de WordPress. L'extension « Lightbox for Gallery
   & Image Block » n'ajoute que la fenêtre d'agrandissement ; la
   désactiver ne fait perdre que la popup.
   ====================================================================== */

/* -- A. FIL D'ARIANE ---------------------------------------------------- */
.edm-page .edm-fil{
  font-family:var(--edm-display);font-size:.8rem;letter-spacing:.1em;
  text-transform:uppercase;margin:0 0 1rem;
}
#content .edm-page .edm-pagehead .edm-fil{color:var(--edm-gold-lt);text-align:center}
#content .edm-page .edm-fil a{
  color:var(--edm-gold-lt) !important;text-decoration:none !important;
  border-bottom:1px solid rgba(255,237,196,.45);padding-bottom:1px;
}
#content .edm-page .edm-fil a:hover{
  color:#fff !important;border-bottom-color:#fff;background:none !important;
}


/* -- B. GRILLE DES ALBUMS ----------------------------------------------
   La grille est portée par le conteneur interne du bloc Groupe quand il
   existe (thème classique), sinon par le groupe lui-même (thème à
   theme.json). Les deux cas sont couverts, jamais les deux à la fois.  */
.edm-page .edm-albums > .wp-block-group__inner-container,
.edm-page .edm-albums:not(:has(> .wp-block-group__inner-container)){
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-top:2.4rem;
  align-items:stretch;
}
.edm-page .edm-album{
  background:#fff;border-radius:var(--edm-radius);overflow:hidden;
  border:1px solid rgba(0,0,34,.10);
  box-shadow:0 10px 30px -22px rgba(0,0,34,.5);
  display:flex;flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease;
}
.edm-page .edm-album:hover{
  transform:translateY(-5px);box-shadow:0 24px 45px -25px rgba(0,0,34,.55);
}
.edm-page .edm-album .edm-album-vignette{margin:0;overflow:hidden}
.edm-page .edm-album .edm-album-vignette img{
  width:100%;height:210px;object-fit:cover;display:block;border-radius:0;
  transition:transform .5s ease;
}
.edm-page .edm-album:hover .edm-album-vignette img{transform:scale(1.04)}
.edm-page .edm-album .edm-album-corps{padding:1.2rem 1.4rem 1.5rem;flex:1}
#content .edm-page .edm-album-annee{
  font-family:var(--edm-display);font-size:.7rem !important;letter-spacing:.18em;
  text-transform:uppercase;color:var(--edm-gold);margin:0;
}
.edm-page .edm-album h3{margin:.45rem 0 .35rem;font-size:1.14rem;color:var(--edm-navy-700)}
#content .edm-page .edm-album p:not(.edm-album-annee):not(.edm-card-link){
  margin:0;font-size:.95rem;color:var(--edm-ink-soft);
}
@media (max-width:900px){
  .edm-page .edm-albums > .wp-block-group__inner-container,
  .edm-page .edm-albums:not(:has(> .wp-block-group__inner-container)){
    grid-template-columns:repeat(2,1fr);gap:1.2rem;
  }
}
@media (max-width:560px){
  .edm-page .edm-albums > .wp-block-group__inner-container,
  .edm-page .edm-albums:not(:has(> .wp-block-group__inner-container)){
    grid-template-columns:1fr;
  }
}


/* -- C. LIGNE D'INFORMATIONS DE L'ALBUM --------------------------------- */
.edm-page .edm-album-meta > .wp-block-group__inner-container,
.edm-page .edm-album-meta:not(:has(> .wp-block-group__inner-container)){
  display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 2rem;
}
.edm-page .edm-album-meta{
  padding:1.1rem 0;border-bottom:1px solid rgba(0,0,34,.10);margin-bottom:2.2rem;
}
#content .edm-page .edm-album-meta p{margin:0;font-size:.95rem;color:var(--edm-ink-soft)}
#content .edm-page .edm-album-meta strong{
  font-family:var(--edm-display);color:var(--edm-navy-900);
  font-weight:700;margin-right:.45rem;
}
.edm-page .edm-album-meta .edm-album-retour{margin-left:auto !important}
#content .edm-page .edm-album-retour a{
  font-family:var(--edm-display) !important;font-weight:700 !important;
  font-size:.85rem;letter-spacing:.04em;
  background:var(--edm-navy-900) !important;color:#fff !important;
  padding:.55rem 1.2rem;border-radius:100px;text-decoration:none !important;
  display:inline-block;transition:.2s;
}
#content .edm-page .edm-album-retour a:hover{background:var(--edm-navy-700) !important}


/* -- D. LE BLOC GALERIE NATIF, EN GRILLE --------------------------------
   Le bloc Galerie de WordPress est un conteneur flex dont les vignettes
   portent une largeur calculée. On repasse en grille : les hauteurs
   s'alignent, ce que le flex ne sait pas faire proprement.             */
.edm-page .edm-galerie .wp-block-gallery.has-nested-images{
  display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem;
  grid-auto-flow:dense;margin:0;
}
.edm-page .edm-galerie .wp-block-gallery.has-nested-images > figure.wp-block-image{
  width:auto !important;flex:none !important;margin:0;
  aspect-ratio:4/3;overflow:hidden;border-radius:10px;position:relative;
  border:1px solid rgba(0,0,34,.08);
  transition:transform .3s ease, box-shadow .3s ease;
}
.edm-page .edm-galerie .wp-block-gallery figure.wp-block-image:hover{
  transform:translateY(-3px);box-shadow:0 18px 34px -22px rgba(0,0,34,.6);
}
.edm-page .edm-galerie .wp-block-gallery figure.wp-block-image img{
  width:100%;height:100%;object-fit:cover;display:block;border-radius:0;
}
.edm-page .edm-galerie .wp-block-gallery figure.wp-block-image a{
  display:block;width:100%;height:100%;cursor:zoom-in;
}
/* Les légendes du bloc Galerie sont reprises par la visionneuse :
   sur la grille elles alourdiraient la lecture. */
.edm-page .edm-galerie .wp-block-gallery figure.wp-block-image figcaption{display:none}

/* Rythme : une vignette large de temps en temps, pour casser le damier.
   grid-auto-flow:dense rebouche les trous que cela crée. */
.edm-page .edm-galerie .wp-block-gallery > figure:nth-child(12n+1),
.edm-page .edm-galerie .wp-block-gallery > figure:nth-child(12n+8){
  grid-column:span 2;aspect-ratio:8/3;
}
@media (max-width:1100px){
  .edm-page .edm-galerie .wp-block-gallery.has-nested-images{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:700px){
  .edm-page .edm-galerie .wp-block-gallery.has-nested-images{
    grid-template-columns:repeat(2,1fr);gap:.6rem;
  }
  .edm-page .edm-galerie .wp-block-gallery > figure:nth-child(12n+1),
  .edm-page .edm-galerie .wp-block-gallery > figure:nth-child(12n+8){
    grid-column:span 2;aspect-ratio:16/9;
  }
}


/* -- E. NAVIGATION ENTRE ALBUMS ----------------------------------------- */
.edm-page .edm-album-nav > .wp-block-group__inner-container,
.edm-page .edm-album-nav:not(:has(> .wp-block-group__inner-container)){
  display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;
}
.edm-page .edm-album-nav{
  margin-top:2.6rem;padding-top:1.6rem;border-top:1px solid rgba(0,0,34,.10);
}
#content .edm-page .edm-album-nav p{margin:0}
#content .edm-page .edm-album-nav a{
  font-family:var(--edm-display) !important;font-weight:700 !important;
  font-size:.88rem;letter-spacing:.04em;text-transform:uppercase;
  color:var(--edm-gold) !important;text-decoration:none !important;
  border-bottom:1.5px solid rgba(176,138,46,.4);padding-bottom:2px;
}
#content .edm-page .edm-album-nav a:hover{
  color:var(--edm-navy-900) !important;border-bottom-color:var(--edm-navy-900);
  background:none !important;
}
.edm-page .edm-album-nav .edm-nav-suiv{margin-left:auto !important}


/* -- F. LA VISIONNEUSE --------------------------------------------------
   Extension « Lightbox for Gallery & Image Block » (baguetteBox.js).
   Ses règles sont hors de .edm-page : on les vise directement, mais
   uniquement sur son propre identifiant, donc rien d'autre n'est touché.
   Les flèches et la croix sont des SVG dont la couleur est écrite en
   attribut de présentation — n'importe quelle règle CSS la bat.       */
#baguetteBox-overlay{
  background:rgba(0,0,34,.95) !important;
}
#baguetteBox-overlay .full-image figcaption{
  background:transparent;
  font-family:"Montserrat",sans-serif;font-size:.95rem;font-style:italic;
  color:#EFE9DE;text-shadow:0 1px 10px rgba(0,0,34,.9);
  padding-bottom:1.2rem;
}
#baguetteBox-overlay .full-image img{
  border-radius:8px;box-shadow:0 30px 80px -40px rgba(0,0,0,.9);
}
.baguetteBox-button{
  background:rgba(0,0,34,.55) !important;
  border:1.5px solid rgba(255,237,196,.35) !important;
  border-radius:50% !important;
  transition:background .2s ease, border-color .2s ease;
}
.baguetteBox-button:hover{
  background:#B08A2E !important;border-color:#B08A2E !important;
}
.baguetteBox-button svg polyline,
.baguetteBox-button svg line,
.baguetteBox-button svg path{
  stroke:#FFEDC4;stroke-width:3.5;
}
.baguetteBox-button:hover svg polyline,
.baguetteBox-button:hover svg line,
.baguetteBox-button:hover svg path{
  stroke:#000022;
}
#baguetteBox-overlay .baguetteBox-button#close-button{
  top:22px;right:26px;
}