/* ==========================================================================
   MIERR — Feuille de style principale
   Mission Internationale Évangélique de Réveil et de Restauration
   --------------------------------------------------------------------------
   Sommaire :
   1. Variables & fondations (palette, typographie, ombres, rayons)
   2. Réinitialisation & éléments de base
   3. Utilitaires (conteneurs, grilles, texte, espacement)
   4. Composants réutilisables (boutons, cartes, badges, formulaires…)
   5. En-tête & navigation
   6. Pied de page
   7. Section héros & sections génériques
   8. Fil du temps (timeline interactive)
   9. Onglets / accordéon
   10. Agenda & calendrier
   11. Galerie & lightbox
   12. Formulaires & recherche globale
   13. Composants spécifiques (organigramme, statistiques, institut biblique…)
   14. Animations & accessibilité
   15. Media queries globales
   ========================================================================== */

/* ---------- 1. VARIABLES & FONDATIONS ---------- */
:root{
  /* Palette MIERR — strictement 3 couleurs de marque :
     1) Dégradé Signal (rouge/orange) — couleur principale, fond de toutes
        les pages ;
     2) Golden Yellow #FFDD00 — couleur secondaire (accents, boutons) ;
     3) Bleu du logo #190B46 — couleur secondaire (fonds sombres, titres).
     Les variables --bleu-* et --or-* conservent leurs noms historiques
     et pointent désormais vers le bleu du logo officiel et le jaune doré.
     Seuls des neutres (blanc/crème/gris) et les couleurs sémantiques
     (succès/erreur) complètent la charte. */

  /* Bleu du logo — déclinaisons pour fonds, titres, texte */
  --bleu-nuit:#190B46;
  --bleu-profond:#10082B;
  --bleu-moyen:#2C147B;
  --bleu-clair:#7459CF;
  --bleu-glace:#EFEBF9;
  --bleu-logo:#4B16FC;

  /* Golden Yellow — déclinaisons pour accents et texte lisible */
  --or:#FFDD00;
  --or-clair:#FFE74D;
  --or-pale:#FFF6B8;
  --or-fonce:#7A6200;

  /* Boutons — Golden Yellow (couleur dédiée aux boutons du site) */
  --bouton-or:#FFDD00;
  --bouton-or-survol:#FFE74D;
  --ombre-bouton-or:0 14px 34px -14px rgba(255,221,0,.55);

  --creme:#FAF7F0;
  --blanc:#FFFFFF;
  --encre:#190B46;

  /* Fond de page — dégradé Signal (couleur principale) */
  --signal-1:#FF6B35;
  --signal-2:#FF1840;
  --degrade-signal:linear-gradient(90deg, var(--signal-1) 0%, var(--signal-2) 100%);
  --cadre-v:14px;
  --cadre-h:14px;

  /* Palette secondaire (badges/étiquettes) — repliée sur les 3 couleurs de
     marque : bleu (logo) et jaune (Golden Yellow), plus un neutre pâle
     pour les fonds discrets. */
  --azur-brant:#190B46;
  --sol-de-minas:#FFDD00;
  --horizon-clair:#7459CF;
  --horizon-pale:#EFEBF9;
  --nuage:#F3F0F0;

  --texte:#241220;
  --texte-clair:#6B5568;
  --texte-inverse:#F3EFE4;

  --bordure:#E7DCE5;
  --bordure-sombre:rgba(255,255,255,.14);

  --succes:#2E7D4F;
  --erreur:#B3432B;

  --ombre:0 24px 60px -24px rgba(25,11,70,.28);
  --ombre-douce:0 12px 30px -16px rgba(25,11,70,.18);
  --ombre-or:0 14px 34px -14px rgba(255,221,0,.45);

  --rayon:6px;
  --rayon-lg:16px;

  --police-titre:'Playfair Display', Georgia, 'Times New Roman', serif;
  --police-texte:'Work Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --largeur-max:1240px;
  --largeur-etroite:760px;

  --transition:.35s cubic-bezier(.4,0,.2,1);
  --entete-hauteur:84px;
}

/* ---------- 2. RÉINITIALISATION & BASE ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top:calc(var(--entete-hauteur) + 16px); background:var(--degrade-signal);}
body{
  margin:0;
  font-family:var(--police-texte);
  color:var(--texte);
  background:var(--degrade-signal);
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
  /* Le dégradé signal devient le fond de toutes les pages : il encadre le
     contenu (blanc/crème) comme une bordure vivante, visible en continu du
     haut au bas de chaque page. */
  padding:var(--cadre-v) var(--cadre-h);
}
@media(min-width:640px){ body{ --cadre-v:20px; --cadre-h:20px; } }
@media(min-width:1080px){ body{ --cadre-v:28px; --cadre-h:40px; } }
img{max-width:100%; display:block; height:auto;}
a{color:inherit; text-decoration:none;}
ul{margin:0; padding:0; list-style:none;}
button{font:inherit; cursor:pointer; background:none; border:none; color:inherit;}
input,textarea,select{font:inherit; color:inherit;}
h1,h2,h3,h4,h5{font-family:var(--police-titre); font-weight:600; line-height:1.15; margin:0 0 .5em; color:var(--bleu-nuit);}
h1{font-size:clamp(2.2rem,4.5vw,3.7rem); font-weight:700; letter-spacing:-.01em;}
h2{font-size:clamp(1.8rem,3.2vw,2.6rem);}
h3{font-size:clamp(1.25rem,2vw,1.5rem);}
h4{font-size:1.05rem;}
p{line-height:1.75; margin:0 0 1em; color:var(--texte-clair);}
.lead{font-size:1.14rem; line-height:1.7; color:var(--texte-clair);}
strong{color:var(--bleu-nuit);}
hr{border:none; border-top:1px solid var(--bordure); margin:2.5rem 0;}
:focus-visible{outline:3px solid var(--or); outline-offset:3px;}
::selection{background:var(--or-clair); color:var(--bleu-nuit);}

/* ---------- 3. UTILITAIRES ---------- */
.conteneur{max-width:var(--largeur-max); margin:0 auto; padding:0 24px;}
.conteneur-etroit{max-width:var(--largeur-etroite); margin:0 auto; padding:0 24px;}
.texte-centre{text-align:center;}
.texte-or{color:var(--or-fonce) !important;}
.sr-seulement{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}
.lien-evitement{position:absolute; left:-999px; top:0; background:var(--bleu-nuit); color:#fff; padding:12px 20px; z-index:999; border-radius:0 0 8px 0;}
.lien-evitement:focus{left:0;}

.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--police-texte); font-size:.78rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--or-fonce);
  margin-bottom:14px;
}
.eyebrow::before{content:''; width:28px; height:2px; background:var(--or);}

.section{padding:96px 0; background:var(--blanc);}
.section--compact{padding:64px 0;}
.section--alt{background:var(--creme);}
.section--bleu{background:linear-gradient(135deg,var(--bleu-nuit),var(--bleu-profond)); color:var(--texte-inverse);}
.section--bleu h2,.section--bleu h3,.section--bleu strong{color:var(--blanc);}
.section--bleu p{color:rgba(243,239,228,.82);}
.section--bleu .eyebrow{color:var(--or-clair);}
.section--bleu .eyebrow::before{background:var(--or-clair);}
.section-tete{max-width:720px; margin-bottom:52px;}

.grille{display:grid; gap:32px;}
.grille--2{grid-template-columns:1fr;}
.grille--3{grid-template-columns:1fr;}
.grille--4{grid-template-columns:1fr;}
@media(min-width:640px){
  .grille--2{grid-template-columns:repeat(2,1fr);}
  .grille--4{grid-template-columns:repeat(2,1fr);}
}
@media(min-width:900px){
  .grille--3{grid-template-columns:repeat(3,1fr);}
  .grille--4{grid-template-columns:repeat(4,1fr);}
}

.bouton-groupe{display:flex; flex-wrap:wrap; gap:16px; margin-top:32px;}

.avis-provisoire{
  background:var(--bleu-glace); border:1px dashed var(--bleu-clair); color:var(--bleu-moyen);
  padding:16px 20px; border-radius:var(--rayon); font-size:.92rem; margin-bottom:40px; line-height:1.6;
}
.avis-provisoire strong{color:var(--bleu-nuit);}

.badge{display:inline-flex; align-items:center; gap:6px; padding:6px 14px; border-radius:99px; font-size:.78rem; font-weight:600; letter-spacing:.03em; background:var(--horizon-pale); color:var(--azur-brant);}
.badge--or{background:var(--or-pale); color:var(--or-fonce);}
.badge--secondaire{background:var(--horizon-pale); color:var(--azur-brant);}
.badge--azur{background:var(--azur-brant); color:#fff;}
.badge--sol{background:var(--sol-de-minas); color:var(--azur-brant);}
.badge--nuage{background:var(--nuage); color:var(--azur-brant); border:1px solid var(--bordure);}

/* ---------- 4. COMPOSANTS : BOUTONS ---------- */
.bouton{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:15px 30px; border-radius:2px; font-weight:600; font-size:.94rem;
  letter-spacing:.02em; transition:transform var(--transition), box-shadow var(--transition), background var(--transition), color var(--transition), border-color var(--transition);
  border:1.5px solid transparent; white-space:nowrap;
}
.bouton--or{background:var(--bouton-or); color:var(--bleu-nuit); box-shadow:var(--ombre-bouton-or);}
.bouton--or:hover{background:var(--bouton-or-survol); transform:translateY(-2px);}
.bouton--bleu{background:var(--bleu-nuit); color:#fff;}
.bouton--bleu:hover{background:var(--bleu-profond); transform:translateY(-2px);}
.bouton--contour{border-color:rgba(255,255,255,.6); color:#fff;}
.bouton--contour:hover{background:rgba(255,255,255,.12); border-color:#fff;}
.bouton--ligne{border-color:var(--bleu-nuit); color:var(--bleu-nuit);}
.bouton--ligne:hover{background:var(--bleu-nuit); color:#fff;}
.bouton--petit{padding:10px 20px; font-size:.84rem;}
.bouton--pleine-largeur{width:100%;}
.bouton[disabled]{opacity:.55; cursor:not-allowed; transform:none !important;}

/* ---------- 4b. CARTES ---------- */
.carte{
  background:#fff; border:1px solid var(--bordure); border-radius:var(--rayon-lg);
  overflow:hidden; transition:transform var(--transition), box-shadow var(--transition);
  display:flex; flex-direction:column;
}
.carte:hover{transform:translateY(-6px); box-shadow:var(--ombre);}
.carte-image{aspect-ratio:16/10; overflow:hidden; background:var(--bleu-glace);}
.carte-image img{width:100%; height:100%; object-fit:cover; transition:transform .6s ease;}
.carte:hover .carte-image img{transform:scale(1.06);}
.carte-corps{padding:26px 26px 30px;}
.carte-etiquette{display:inline-block; font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--or-fonce); background:var(--or-pale); padding:4px 10px; border-radius:3px; margin-bottom:12px;}
.carte-corps h3{font-size:1.18rem; margin-bottom:10px;}
.carte-corps p{font-size:.95rem; margin-bottom:14px;}
.carte-meta{display:flex; gap:14px; font-size:.82rem; color:var(--texte-clair); border-top:1px solid var(--bordure); padding-top:14px; margin-top:auto;}

.carte-dept{
  background:var(--blanc); border:1px solid var(--bordure); border-radius:var(--rayon-lg);
  padding:34px 30px; text-align:left; transition:transform var(--transition), box-shadow var(--transition), border-color var(--transition);
  position:relative;
}
.carte-dept:hover{transform:translateY(-6px); box-shadow:var(--ombre); border-color:var(--or);}
.carte-dept .sigle{display:block; font-family:var(--police-titre); font-size:1.9rem; font-weight:700; color:var(--or-fonce); margin-bottom:10px;}
.carte-dept h3{font-size:1.1rem; margin-bottom:10px;}
.carte-dept p{font-size:.93rem; margin-bottom:20px;}

/* Cartes membre/responsable */
.carte-membre{text-align:center;}
.carte-membre .carte-image{aspect-ratio:1/1; border-radius:50%; width:130px; margin:0 auto 18px; box-shadow:var(--ombre-douce);}
.carte-membre h4{margin-bottom:2px;}
.carte-membre .fonction{color:var(--or-fonce); font-size:.85rem; font-weight:600; letter-spacing:.02em;}

/* ---------- 5. EN-TÊTE & NAVIGATION ---------- */
.barre-progression{position:fixed; top:0; left:0; height:3px; width:0%; background:linear-gradient(90deg,var(--or-fonce),var(--or-clair)); z-index:1000; transition:width .1s linear;}

.entete{
  position:sticky; top:0; z-index:500; background:rgba(75,22,252,.96); backdrop-filter:blur(10px);
  border-bottom:1px solid transparent; transition:box-shadow var(--transition), border-color var(--transition), background var(--transition);
  height:var(--entete-hauteur);
  /* Ramène l'en-tête plein-bleed malgré le cadre de dégradé du <body> */
  margin:calc(-1 * var(--cadre-v)) calc(-1 * var(--cadre-h)) 0;
}
.entete.entete--flottant{box-shadow:var(--ombre-douce); border-color:rgba(255,255,255,.14);}
.entete .conteneur{display:flex; align-items:center; justify-content:space-between; height:100%; gap:24px;}
.logo img{height:60px; width:auto;}
.nav-principale{display:none; gap:30px; align-items:center;}
.nav-principale a{font-size:.92rem; font-weight:600; color:#fff; position:relative; padding:6px 2px;}
.nav-principale a::after{content:''; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:var(--or); transition:width var(--transition);}
.nav-principale a:hover::after,.nav-principale a[aria-current="page"]::after{width:100%;}
.nav-principale a[aria-current="page"]{color:var(--or-clair);}

.entete-actions{display:flex; align-items:center; gap:16px;}
.bouton-recherche{width:40px; height:40px; border-radius:50%; display:none; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.35); color:#fff; font-size:1.05rem;}
.bouton-recherche:hover{background:rgba(255,255,255,.14);}
.bouton-menu{width:40px; height:40px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;}
.bouton-menu span{display:block; width:22px; height:2px; background:#fff; transition:transform var(--transition), opacity var(--transition);}

.menu-mobile{
  position:fixed; inset:0; background:var(--bleu-nuit); z-index:1200; display:flex; flex-direction:column;
  padding:100px 32px 40px; transform:translateX(100%); transition:transform .45s cubic-bezier(.4,0,.2,1); overflow-y:auto;
}
.menu-mobile.ouvert{transform:translateX(0);}
.menu-mobile a{color:#fff; font-family:var(--police-titre); font-size:1.5rem; padding:14px 0; border-bottom:1px solid rgba(255,255,255,.12);}
.fermer-menu{position:absolute; top:28px; right:28px; font-size:2rem; color:#fff; width:44px; height:44px;}

@media(min-width:1080px){
  .nav-principale{display:flex;}
  .bouton-recherche{display:inline-flex;}
  .bouton-menu{display:none;}
}

/* Fil d'ariane */
.fil-ariane{padding:22px 0; font-size:.85rem; color:var(--texte-clair); border-bottom:1px solid var(--bordure);}
.fil-ariane a{color:var(--bleu-moyen); font-weight:600;}
.fil-ariane a:hover{text-decoration:underline;}
.fil-ariane span{margin:0 8px; opacity:.5;}

/* Bannière de page (sous-pages) */
.bandeau-page{
  position:relative; padding:150px 0 80px; background:linear-gradient(135deg,var(--bleu-moyen),var(--bleu-nuit) 55%,var(--bleu-profond)); color:#fff; overflow:hidden;
  border-radius:20px 20px 0 0;
}
.bandeau-page::before{content:''; position:absolute; inset:0; background:radial-gradient(circle at 85% 20%, rgba(255,221,0,.22), transparent 55%); pointer-events:none;}
.bandeau-page .eyebrow{color:var(--or-clair);}
.bandeau-page .eyebrow::before{background:var(--or-clair);}
.bandeau-page h1{color:#fff; max-width:820px;}
.bandeau-page p{color:rgba(243,239,228,.85); max-width:640px; font-size:1.08rem;}
.bandeau-page .fil-ariane{border:none; padding:0 0 26px; color:rgba(255,255,255,.65);}
.bandeau-page .fil-ariane a{color:var(--or-clair);}

/* ---------- 6. PIED DE PAGE ---------- */
.pied{background:var(--encre); color:rgba(243,239,228,.75); padding:80px 0 0; border-radius:0 0 20px 20px; overflow:hidden;}
.pied-grille{display:grid; gap:48px; grid-template-columns:1fr; padding-bottom:56px; border-bottom:1px solid rgba(255,255,255,.1);}
.pied-logo img{height:64px; margin-bottom:18px;}
.pied p{color:rgba(243,239,228,.65); font-size:.92rem;}
.pied h4{color:#fff; font-family:var(--police-texte); font-size:.85rem; letter-spacing:.08em; text-transform:uppercase; margin-bottom:20px;}
.pied ul li{margin-bottom:12px;}
.pied ul a{font-size:.92rem; color:rgba(243,239,228,.72); transition:color var(--transition), padding-left var(--transition);}
.pied ul a:hover{color:var(--or-clair); padding-left:4px;}
.pied-reseaux{display:flex; gap:10px; margin-top:22px;}
.pied-reseaux a{width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.2); display:flex; align-items:center; justify-content:center; font-size:.85rem; font-weight:700; transition:background var(--transition), border-color var(--transition), transform var(--transition);}
.pied-reseaux a:hover{background:var(--or); border-color:var(--or); color:var(--bleu-nuit); transform:translateY(-3px);}
.pied-bas{display:flex; flex-direction:column; gap:10px; align-items:flex-start; padding:26px 0; font-size:.82rem;}
.pied-bas a{color:rgba(243,239,228,.6);}
.pied-bas a:hover{color:var(--or-clair);}
@media(min-width:640px){.pied-grille{grid-template-columns:1.4fr 1fr 1fr 1fr;} .pied-bas{flex-direction:row; justify-content:space-between; align-items:center;}}

/* ---------- 7. HÉROS & SECTIONS ---------- */
.hero{position:relative; min-height:92vh; display:flex; align-items:center; color:#fff; overflow:hidden; background:var(--bleu-nuit); border-radius:20px 20px 0 0;}
.hero-fond{position:absolute; inset:0; z-index:0;}
.hero-fond img{width:100%; height:100%; object-fit:cover; opacity:.55;}
.hero-fond::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(25,11,70,.55) 0%, rgba(25,11,70,.78) 55%, rgba(25,11,70,.96) 100%);}
.hero-contenu{position:relative; z-index:1; max-width:780px; padding-top:var(--entete-hauteur);}
.hero-badge{display:inline-flex; align-items:center; gap:10px; padding:8px 18px; border:1px solid rgba(255,231,77,.5); border-radius:99px; font-size:.82rem; font-weight:600; color:var(--or-clair); margin-bottom:22px; background:rgba(25,11,70,.4); backdrop-filter:blur(4px);}
.hero .eyebrow{color:var(--or-clair);}
.hero .eyebrow::before{background:var(--or-clair);}
.hero h1{color:#fff; margin-bottom:22px;}
.hero .lead{color:rgba(243,239,228,.88); font-size:1.18rem; max-width:640px;}
.hero-defilement{position:absolute; bottom:34px; left:50%; transform:translateX(-50%); z-index:1; display:flex; flex-direction:column; align-items:center; gap:8px; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:rgba(243,239,228,.7);}
.hero-defilement::after{content:''; width:1px; height:34px; background:linear-gradient(var(--or-clair),transparent); animation:defilement 1.8s ease-in-out infinite;}
@keyframes defilement{0%{transform:scaleY(0); transform-origin:top;}50%{transform:scaleY(1); transform-origin:top;}50.01%{transform-origin:bottom;}100%{transform:scaleY(0); transform-origin:bottom;}}

/* Statistiques */
.statistiques{display:grid; grid-template-columns:repeat(2,1fr); gap:28px; text-align:center;}
@media(min-width:760px){.statistiques{grid-template-columns:repeat(4,1fr);}}
.stat b{display:block; font-family:var(--police-titre); font-size:clamp(2.1rem,4vw,2.9rem); color:var(--or); line-height:1;}
.stat span{display:block; margin-top:10px; font-size:.85rem; color:var(--texte-clair); letter-spacing:.02em;}
.section--bleu .stat span{color:rgba(243,239,228,.75);}

/* Verset du jour */
.verset{background:var(--bleu-nuit) url('../img/texture-etoiles.svg') repeat; padding:110px 0; text-align:center; position:relative;}
.verset::before{content:''; position:absolute; inset:0; background:radial-gradient(circle at 50% 0%, rgba(255,221,0,.18), transparent 60%);}
.verset > *{position:relative;}
.verset blockquote{font-family:var(--police-titre); font-size:clamp(1.35rem,2.6vw,2rem); color:#fff; font-style:italic; line-height:1.5; margin:0 0 22px;}
.verset cite{color:var(--or-clair); font-weight:600; letter-spacing:.04em; font-style:normal;}

/* Accès rapide */
.acces-rapide{display:grid; grid-template-columns:repeat(2,1fr); gap:18px;}
@media(min-width:760px){.acces-rapide{grid-template-columns:repeat(3,1fr);}}
@media(min-width:1080px){.acces-rapide{grid-template-columns:repeat(6,1fr);}}
.acces-item{display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center; background:#fff; border:1px solid var(--bordure); border-radius:var(--rayon-lg); padding:28px 14px; font-weight:600; font-size:.9rem; color:var(--bleu-nuit); transition:transform var(--transition), box-shadow var(--transition), border-color var(--transition);}
.acces-item:hover{transform:translateY(-6px); box-shadow:var(--ombre-douce); border-color:var(--or);}
.acces-item .icone{
  width:52px; height:52px; border-radius:50%; background:var(--or-pale); color:var(--or-fonce);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  transition:background var(--transition), color var(--transition);
}
.acces-item .icone svg{width:24px; height:24px;}
.acces-item:hover .icone{background:var(--bleu-nuit); color:var(--or-clair);}

/* Liste d'événements (accueil) */
.liste-evenements{display:flex; flex-direction:column; gap:14px;}
.evenement-ligne{display:grid; grid-template-columns:auto 1fr auto; gap:20px; align-items:center; background:#fff; border:1px solid var(--bordure); border-radius:var(--rayon); padding:18px 24px; transition:box-shadow var(--transition), border-color var(--transition);}
.evenement-ligne:hover{box-shadow:var(--ombre-douce); border-color:var(--or);}
.evenement-date{text-align:center; min-width:64px; background:var(--bleu-glace); border-radius:var(--rayon); padding:8px 4px; color:var(--bleu-nuit);}
.evenement-date .jour{font-family:var(--police-titre); font-size:1.5rem; font-weight:700; line-height:1;}
.evenement-date .mois{font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--texte-clair);}
.evenement-detail h4{margin-bottom:6px; font-size:1rem;}
.evenement-meta{display:flex; flex-wrap:wrap; gap:14px; font-size:.82rem; color:var(--texte-clair);}
@media(max-width:640px){.evenement-ligne{grid-template-columns:auto 1fr; row-gap:14px;} .evenement-ligne a{grid-column:1 / -1;}}

/* ---------- 8. FIL DU TEMPS INTERACTIF ---------- */
.timeline{position:relative; margin:60px 0; padding-left:0;}
.timeline::before{content:''; position:absolute; left:20px; top:0; bottom:0; width:2px; background:linear-gradient(var(--or-pale),var(--or),var(--or-pale));}
@media(min-width:900px){.timeline::before{left:50%; transform:translateX(-1px);}}
.timeline-etape{position:relative; padding:0 0 56px 56px;}
@media(min-width:900px){
  .timeline-etape{width:50%; padding:0 0 64px 0; margin-left:0;}
  .timeline-etape:nth-child(odd){padding-right:64px; text-align:right;}
  .timeline-etape:nth-child(even){margin-left:50%; padding-left:64px;}
}
.timeline-etape::before{content:''; position:absolute; left:12px; top:4px; width:18px; height:18px; border-radius:50%; background:var(--or); border:4px solid var(--creme); box-shadow:0 0 0 2px var(--or);}
@media(min-width:900px){
  .timeline-etape:nth-child(odd)::before{left:auto; right:-9px;}
  .timeline-etape:nth-child(even)::before{left:-9px;}
}
.timeline-annee{display:inline-block; font-family:var(--police-titre); font-size:1.7rem; font-weight:700; color:var(--bleu-nuit); margin-bottom:8px;}
.timeline-etape h4{margin-bottom:8px;}
.timeline-etape p{font-size:.94rem; margin-bottom:0;}

/* ---------- 9. ONGLETS / ACCORDÉON ---------- */
.onglets-nav{display:flex; flex-wrap:wrap; gap:10px; border-bottom:1px solid var(--bordure); margin-bottom:44px; position:sticky; top:var(--entete-hauteur); background:#fff; z-index:80; padding-top:20px;}
.onglets-nav button{padding:12px 20px; font-weight:600; font-size:.88rem; color:var(--texte-clair); border-bottom:3px solid transparent; margin-bottom:-1px; transition:color var(--transition), border-color var(--transition);}
.onglets-nav button:hover{color:var(--bleu-nuit);}
.onglets-nav button.actif{color:var(--bleu-nuit); border-color:var(--or);}
.onglets-nav a{padding:12px 16px; font-weight:600; font-size:.86rem; color:var(--texte-clair); border-bottom:3px solid transparent; margin-bottom:-1px; transition:color var(--transition), border-color var(--transition); white-space:nowrap;}
.onglets-nav a:hover{color:var(--bleu-nuit); border-color:var(--or-pale);}
.onglet-panneau{display:none; animation:apparition .5s ease;}
.onglet-panneau.actif{display:block;}
@keyframes apparition{from{opacity:0; transform:translateY(10px);}to{opacity:1; transform:translateY(0);}}

.accordeon-item{border-bottom:1px solid var(--bordure);}
.accordeon-entete{width:100%; display:flex; justify-content:space-between; align-items:center; padding:22px 4px; text-align:left; font-family:var(--police-titre); font-size:1.08rem; color:var(--bleu-nuit); font-weight:600;}
.accordeon-entete .plus{font-size:1.3rem; color:var(--or-fonce); transition:transform var(--transition); flex-shrink:0; margin-left:16px;}
.accordeon-item.ouvert .plus{transform:rotate(45deg);}
.accordeon-corps{max-height:0; overflow:hidden; transition:max-height .4s ease;}
.accordeon-corps-inner{padding:0 4px 26px; color:var(--texte-clair); font-size:.95rem; line-height:1.75;}

/* Département : bloc détaillé */
.bloc-departement{padding:70px 0; border-top:1px solid var(--bordure); scroll-margin-top:calc(var(--entete-hauteur) + 90px);}
.bloc-departement:first-of-type{border-top:none;}
.departement-entete{display:flex; flex-wrap:wrap; gap:24px; align-items:flex-end; justify-content:space-between; margin-bottom:36px;}
.departement-fiche{display:grid; gap:40px; grid-template-columns:1fr;}
@media(min-width:900px){.departement-fiche{grid-template-columns:1.2fr .8fr;}}
.liste-verifiee{display:flex; flex-direction:column; gap:12px; margin:20px 0;}
.liste-verifiee li{display:flex; gap:12px; font-size:.95rem; color:var(--texte-clair); align-items:flex-start;}
.liste-verifiee li::before{content:'✓'; color:var(--or-fonce); font-weight:700; flex-shrink:0;}

/* ---------- 10. AGENDA & CALENDRIER ---------- */
.agenda-barre{display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between; margin-bottom:40px;}
.agenda-filtres{display:flex; flex-wrap:wrap; gap:10px;}
.filtre-tag{padding:9px 18px; border:1.5px solid var(--bordure); border-radius:99px; font-size:.82rem; font-weight:600; color:var(--texte-clair); transition:all var(--transition);}
.filtre-tag:hover{border-color:var(--or);}
.filtre-tag.actif{background:var(--bleu-nuit); border-color:var(--bleu-nuit); color:#fff;}

.calendrier{background:#fff; border:1px solid var(--bordure); border-radius:var(--rayon-lg); padding:28px; box-shadow:var(--ombre-douce);}
.calendrier-entete{display:flex; align-items:center; justify-content:space-between; margin-bottom:22px;}
.calendrier-entete h3{margin:0; font-size:1.25rem;}
.calendrier-nav{display:flex; gap:8px;}
.calendrier-nav button{width:38px; height:38px; border:1px solid var(--bordure); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.1rem; transition:background var(--transition), border-color var(--transition);}
.calendrier-nav button:hover{background:var(--bleu-glace); border-color:var(--bleu-clair);}
.calendrier-grille{display:grid; grid-template-columns:repeat(7,1fr); gap:6px;}
.calendrier-jour-nom{text-align:center; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--texte-clair); padding-bottom:8px;}
.calendrier-case{aspect-ratio:1/1; display:flex; flex-direction:column; align-items:center; justify-content:center; border-radius:8px; font-size:.85rem; color:var(--texte); position:relative; background:var(--creme);}
.calendrier-case.vide{background:transparent;}
.calendrier-case.evenement{background:var(--bleu-nuit); color:#fff; font-weight:700; cursor:pointer;}
.calendrier-case.evenement:hover{background:var(--or); color:var(--bleu-nuit);}
.calendrier-case.aujourdhui{box-shadow:0 0 0 2px var(--or);}
.calendrier-case .point{width:5px; height:5px; border-radius:50%; background:var(--or); position:absolute; bottom:5px;}

.carte-evenement{display:grid; grid-template-columns:1fr; gap:0; background:#fff; border:1px solid var(--bordure); border-radius:var(--rayon-lg); overflow:hidden; margin-bottom:24px;}
@media(min-width:760px){.carte-evenement{grid-template-columns:280px 1fr;}}
.carte-evenement .carte-image{aspect-ratio:auto; height:100%; min-height:200px;}
.carte-evenement-corps{padding:30px;}
.carte-evenement-corps .evenement-meta{margin-bottom:16px;}
.programme-liste{margin-top:18px; border-top:1px solid var(--bordure); padding-top:18px;}
.programme-item{display:flex; gap:16px; padding:10px 0; font-size:.9rem;}
.programme-item .heure{font-weight:700; color:var(--bleu-nuit); min-width:70px;}

/* ---------- 11. GALERIE & LIGHTBOX ---------- */
.galerie-filtres{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:36px;}
.galerie-grille{display:grid; grid-template-columns:repeat(2,1fr); gap:14px;}
@media(min-width:640px){.galerie-grille{grid-template-columns:repeat(3,1fr);}}
@media(min-width:1080px){.galerie-grille{grid-template-columns:repeat(4,1fr);}}
.galerie-item{position:relative; aspect-ratio:4/3; overflow:hidden; border-radius:var(--rayon); cursor:pointer; background:var(--bleu-glace);}
.galerie-item img{width:100%; height:100%; object-fit:cover; transition:transform .6s ease;}
.galerie-item:hover img{transform:scale(1.08);}
.galerie-item::after{content:'⤢'; position:absolute; top:10px; right:10px; width:32px; height:32px; background:rgba(25,11,70,.6); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity var(--transition); font-size:.9rem;}
.galerie-item:hover::after{opacity:1;}
.video-tuile{position:relative; aspect-ratio:16/9; overflow:hidden; border-radius:var(--rayon); cursor:pointer;}
.video-tuile img{width:100%; height:100%; object-fit:cover; transition:transform .6s ease;}
.video-tuile:hover img{transform:scale(1.08);}
.icone-play{position:absolute; inset:0; margin:auto; width:56px; height:56px; background:rgba(255,255,255,.92); color:var(--bleu-nuit); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.15rem; box-shadow:var(--ombre-douce); transition:transform var(--transition), background var(--transition);}
.video-tuile:hover .icone-play{transform:scale(1.1); background:var(--or);}

.lightbox{position:fixed; inset:0; background:rgba(43,8,38,.94); z-index:2000; display:none; align-items:center; justify-content:center; padding:40px;}
.lightbox.ouvert{display:flex;}
.lightbox img{max-width:min(92vw,1100px); max-height:78vh; object-fit:contain; border-radius:4px; box-shadow:0 30px 80px rgba(0,0,0,.5);}
.lightbox-legende{position:absolute; bottom:36px; left:0; right:0; text-align:center; color:#fff; font-size:.9rem; opacity:.85;}
.lightbox-fermer{position:absolute; top:24px; right:28px; color:#fff; font-size:2.2rem; width:48px; height:48px;}
.lightbox-precedent,.lightbox-suivant{position:absolute; top:50%; transform:translateY(-50%); color:#fff; font-size:2.2rem; width:56px; height:56px; display:flex; align-items:center; justify-content:center; opacity:.8;}
.lightbox-precedent:hover,.lightbox-suivant:hover{opacity:1;}
.lightbox-precedent{left:16px;}
.lightbox-suivant{right:16px;}

/* Vidéo intégrée (modale) */
.modale-video{position:fixed; inset:0; background:rgba(43,8,38,.94); z-index:2000; display:none; align-items:center; justify-content:center; padding:24px;}
.modale-video.ouvert{display:flex;}
.modale-video-cadre{width:100%; max-width:960px; aspect-ratio:16/9; background:#000; position:relative;}
.modale-video-cadre iframe{width:100%; height:100%; border:0;}
.modale-video .lightbox-fermer{top:20px; right:20px;}

/* ---------- 12. FORMULAIRES & RECHERCHE ---------- */
.groupe-champ{margin-bottom:22px;}
.groupe-champ label{display:block; font-size:.85rem; font-weight:600; color:var(--bleu-nuit); margin-bottom:8px;}
.groupe-champ .obligatoire{color:var(--erreur);}
.groupe-champ input,.groupe-champ textarea,.groupe-champ select{
  width:100%; padding:14px 16px; border:1.5px solid var(--bordure); border-radius:var(--rayon); background:#fff;
  font-size:.95rem; transition:border-color var(--transition), box-shadow var(--transition);
}
.groupe-champ input:focus,.groupe-champ textarea:focus,.groupe-champ select:focus{border-color:var(--or); box-shadow:0 0 0 4px rgba(255,221,0,.15); outline:none;}
.groupe-champ textarea{min-height:150px; resize:vertical;}
.groupe-champ small{display:block; margin-top:6px; font-size:.78rem; color:var(--texte-clair);}
.champ-erreur{border-color:var(--erreur) !important;}
.message-erreur{color:var(--erreur); font-size:.8rem; margin-top:6px; display:none;}
.message-erreur.visible{display:block;}
.case-cocher{display:flex; align-items:flex-start; gap:10px; font-size:.85rem; color:var(--texte-clair);}
.case-cocher input{width:auto;}
.formulaire-statut{padding:16px 20px; border-radius:var(--rayon); font-size:.9rem; margin-top:20px; display:none;}
.formulaire-statut.visible{display:block;}
.formulaire-statut.succes{background:#EAF5EE; color:var(--succes); border:1px solid #C6E5D2;}
.formulaire-statut.erreur{background:#FBEAE5; color:var(--erreur); border:1px solid #F0C9BC;}

.recherche-superposition{position:fixed; inset:0; background:rgba(43,8,38,.7); backdrop-filter:blur(3px); z-index:1500; display:none; align-items:flex-start; justify-content:center; padding:10vh 20px;}
.recherche-superposition.ouvert{display:flex;}
.recherche-boite{background:#fff; width:100%; max-width:640px; border-radius:var(--rayon-lg); box-shadow:0 40px 90px rgba(0,0,0,.35); overflow:hidden;}
.recherche-champ{display:flex; align-items:center; gap:14px; padding:22px 26px; border-bottom:1px solid var(--bordure);}
.recherche-champ input{flex:1; border:none; font-size:1.1rem; outline:none;}
.recherche-champ .icone{font-size:1.2rem; color:var(--texte-clair);}
.recherche-resultats{max-height:52vh; overflow-y:auto; padding:10px;}
.recherche-resultat{display:block; padding:14px 16px; border-radius:var(--rayon); transition:background var(--transition);}
.recherche-resultat:hover{background:var(--bleu-glace);}
.recherche-resultat .categorie{font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--or-fonce); font-weight:700;}
.recherche-resultat h4{margin:4px 0 2px; font-size:.98rem;}
.recherche-resultat p{margin:0; font-size:.82rem; color:var(--texte-clair);}
.recherche-vide{padding:40px 20px; text-align:center; color:var(--texte-clair); font-size:.9rem;}

/* ---------- 13. COMPOSANTS SPÉCIFIQUES ---------- */
/* Organigramme */
.organigramme{display:flex; flex-direction:column; align-items:center; gap:0;}
.organigramme-niveau{display:flex; flex-direction:column; align-items:center; gap:20px; position:relative; padding:30px 0;}
.organigramme-noeud{background:#fff; border:1.5px solid var(--bordure); border-radius:var(--rayon); padding:16px 24px; text-align:center; font-size:.88rem; font-weight:600; color:var(--bleu-nuit); box-shadow:var(--ombre-douce); min-width:180px; max-width:420px;}
.organigramme-noeud.principal{background:var(--bleu-nuit); color:#fff; border-color:var(--bleu-nuit);}
.organigramme-noeud.organigramme-noeud--bleu{background:var(--bleu-logo); color:#fff; border-color:var(--bleu-logo);}
.organigramme-noeud.organigramme-noeud--orange{background:var(--signal-1); color:#fff; border-color:var(--signal-1);}
.organigramme-noeud span{display:block; font-weight:400; font-size:.78rem; color:var(--texte-clair); margin-top:4px;}
.organigramme-noeud.principal span,
.organigramme-noeud--bleu span,
.organigramme-noeud--orange span{color:rgba(255,255,255,.75);}
.organigramme-niveau:not(:first-child)::before{content:''; position:absolute; top:0; left:50%; width:1px; height:30px; background:var(--bordure);}
/* Niveau en grille rectangulaire (ex. tous les services sous le Secrétariat Général) */
.organigramme-niveau--grille{flex-direction:row; flex-wrap:wrap; justify-content:center; max-width:1000px;}
.organigramme-niveau--grille .organigramme-noeud{flex:1 1 220px;}

/* Institut biblique — formations */
.tableau-programme{width:100%; border-collapse:collapse; font-size:.92rem;}
.tableau-programme th,.tableau-programme td{padding:14px 16px; text-align:left; border-bottom:1px solid var(--bordure);}
.tableau-programme th{background:var(--bleu-glace); color:var(--bleu-nuit); font-weight:700; font-size:.8rem; text-transform:uppercase; letter-spacing:.03em;}
.tableau-scroll{overflow-x:auto; border-radius:var(--rayon); border:1px solid var(--bordure);}
.tableau-scroll table{margin:0; border:none;}
.tableau-scroll th,.tableau-scroll td{border-bottom:1px solid var(--bordure);}

.etape-numero{display:flex; gap:20px; margin-bottom:34px;}
.etape-numero .num{flex-shrink:0; width:46px; height:46px; border-radius:50%; background:var(--bleu-nuit); color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--police-titre); font-weight:700; font-size:1.1rem;}
.etape-numero h4{margin-bottom:6px;}
.etape-numero p{margin:0; font-size:.92rem;}

.carte-formation{background:#fff; border:1px solid var(--bordure); border-radius:var(--rayon-lg); padding:36px 30px; text-align:center; position:relative; transition:transform var(--transition), box-shadow var(--transition);}
.carte-formation.mise-avant{border-color:var(--or); box-shadow:var(--ombre-or);}
.carte-formation:hover{transform:translateY(-6px); box-shadow:var(--ombre);}
.carte-formation .niveau{display:inline-block; margin-bottom:16px; font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--or-fonce); background:var(--or-pale); padding:5px 12px; border-radius:3px;}
.carte-formation .duree{font-family:var(--police-titre); font-size:1.6rem; color:var(--bleu-nuit); margin-bottom:6px;}
.carte-formation ul{text-align:left; margin:20px 0; display:flex; flex-direction:column; gap:10px;}
.carte-formation ul li{font-size:.88rem; color:var(--texte-clair); display:flex; gap:10px;}
.carte-formation ul li::before{content:'✓'; color:var(--or-fonce); font-weight:700;}

/* Podcast / audio */
.carte-audio{display:flex; align-items:center; gap:18px; background:#fff; border:1px solid var(--bordure); border-radius:var(--rayon); padding:18px 22px; transition:box-shadow var(--transition), border-color var(--transition);}
.carte-audio:hover{box-shadow:var(--ombre-douce); border-color:var(--or);}
.carte-audio .icone-audio{flex-shrink:0; width:48px; height:48px; border-radius:50%; background:var(--bleu-nuit); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.1rem;}
.carte-audio-corps{flex:1; min-width:0;}
.carte-audio-corps h4{margin-bottom:4px; font-size:.95rem;}
.carte-audio-corps span{font-size:.78rem; color:var(--texte-clair);}

/* Publications / magazine */
.carte-publication{text-align:center;}
.carte-publication .carte-image{aspect-ratio:3/4; background:var(--bleu-glace);}

/* FAQ / accordéon secondaire déjà couvert plus haut */

/* Carte contact / infos pratiques */
.carte-info{display:flex; gap:16px; padding:20px 0; border-bottom:1px solid var(--bordure);}
.carte-info:last-child{border-bottom:none;}
.carte-info .icone{flex-shrink:0; width:44px; height:44px; border-radius:50%; background:var(--bleu-glace); color:var(--bleu-nuit); display:flex; align-items:center; justify-content:center; font-size:1.1rem;}
.carte-info h4{margin-bottom:4px; font-size:.95rem;}
.carte-info p{margin:0; font-size:.9rem;}
.carte-carte{border-radius:var(--rayon-lg); overflow:hidden; border:1px solid var(--bordure); box-shadow:var(--ombre-douce);}
.carte-carte iframe{width:100%; height:420px; border:0; display:block; filter:grayscale(.15) contrast(1.05);}

/* Pagination */
.pagination{display:flex; justify-content:center; gap:8px; margin-top:48px;}
.pagination a,.pagination span{width:42px; height:42px; display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:.88rem; font-weight:600; color:var(--texte-clair); transition:background var(--transition), color var(--transition);}
.pagination a:hover{background:var(--bleu-glace);}
.pagination .actif{background:var(--bleu-nuit); color:#fff;}

/* WhatsApp flottant */
.whatsapp-flottant{position:fixed; bottom:26px; right:26px; width:58px; height:58px; border-radius:50%; background:#25D366; color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.5rem; box-shadow:0 12px 30px rgba(37,211,102,.4); z-index:400; transition:transform var(--transition);}
.whatsapp-flottant:hover{transform:scale(1.08);}

/* Bouton retour en haut */
.retour-haut{position:fixed; bottom:26px; left:26px; width:48px; height:48px; border-radius:50%; background:var(--bleu-nuit); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.2rem; z-index:400; opacity:0; visibility:hidden; transform:translateY(10px); transition:all var(--transition);}
.retour-haut.visible{opacity:1; visibility:visible; transform:translateY(0);}

/* ---------- 14. ANIMATIONS & ACCESSIBILITÉ ---------- */
[data-anim]{opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.6,.2,1);}
[data-anim].visible{opacity:1; transform:translateY(0);}
[data-anim="stagger"] > *{transition-delay:calc(var(--delai, 0) * 90ms);}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  [data-anim]{opacity:1; transform:none; transition:none;}
  .hero-defilement::after{animation:none;}
  *{animation-duration:.001ms !important; transition-duration:.001ms !important;}
}

/* Etat "corps verrouillé" (menu / modales ouverts) */
body.verrouille{overflow:hidden;}

/* ---------- 15. MEDIA QUERIES GLOBALES ---------- */
@media(max-width:900px){
  .section{padding:72px 0;}
  .bandeau-page{padding:130px 0 60px;}
}
@media(max-width:640px){
  .section{padding:56px 0;}
  h1{font-size:2rem;}
  .bandeau-page{padding:118px 0 48px;}
  .onglets-nav{overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch;}
  .onglets-nav button{flex-shrink:0;}
}

/* Impression */
@media print{
  .entete,.pied,.whatsapp-flottant,.retour-haut,.barre-progression,.menu-mobile,.lightbox,.recherche-superposition{display:none !important;}
}