/* ═══════════════════════════════════════════════════════════
   LAYOUT COMMUN
═══════════════════════════════════════════════════════════ */
.page-body {
  min-width: 0;
  background: #fff;
  border-radius: 20px;
  padding: 40px;
  box-shadow: 0 34px 70px -26px rgba(0,0,3,.2);
}

/* ─── Légende photo ─── */
.page-hero-caption {
  padding: 9px 14px;
  font-size: 12px;
  font-weight: 500;
  color: #fff;
  font-style: normal;
  letter-spacing: .02em;
  background: rgba(11,61,46,.82);
  text-align: center;
  line-height: 1.4;
}

/* ─── Image flottante gauche (styles classique + institutionnel) ─── */
.page-hero-img {
  float: left;
  width: 45%;
  margin: 4px 44px 28px 0;
  padding: 0;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid #DCE9E3;
  box-shadow: 0 8px 32px -8px rgba(11,61,46,.18);
  shape-outside: margin-box;
}
.page-hero-photo {
  display: block;
  width: 100%;
  height: 420px;
  object-fit: cover;
  object-position: center top;
  transition: transform .6s cubic-bezier(.2,.7,.2,1);
}
.page-hero-img:hover .page-hero-photo {
  transform: scale(1.04);
}
/* ═══════════════════════════════════════════════════════════
   BLOCS DE L'ÉDITEUR — styles séparés (modifiables ici)
   Chaque bloc rendu par le builder utilise ces classes.
   Les couleurs choisies dans l'éditeur passent par var(--c).
═══════════════════════════════════════════════════════════ */

/* Espacement entre les blocs */
.cms-bloc { margin-bottom: 22px; }

/* ── Grilles & cartes (hors .cms-content) ── */
.cms-bloc .grid { display: grid; gap: 20px; }
.cms-bloc .g2 { grid-template-columns: 1fr 1fr; }
.cms-bloc .g3 { grid-template-columns: repeat(3,1fr); }
.cms-bloc .g4 { grid-template-columns: repeat(4,1fr); }
.cms-bloc .card { background:#fff; border:1px solid #EAE5DB; border-radius:16px; padding:24px; }
/* Icône des cartes : rond orange uni, icône blanche.
   Les icônes sont des émojis (couleurs fixes) : color transparent + text-shadow les redessine en blanc.
   :nth-child(n) renforce la priorité face à la règle « cartes paires en dégradé » de styles.css.
   Orange #D9730D (un peu plus soutenu que #E8871E) : contraste suffisant avec le blanc. */
.cms-bloc .ico,
.cms-bloc .grid .card:nth-child(n) .ico {
  display:flex; align-items:center; justify-content:center; flex:none;
  width:76px; height:76px; border-radius:50%; margin-bottom:16px;
  background:#D9730D; font-size:34px; line-height:1;
  color:transparent; text-shadow:0 0 0 #fff;
}
.cms-bloc .ico svg { color:#fff; width:36px; height:36px; } /* icônes vectorielles éventuelles */
.b-card-titre { font-size:17px; font-weight:700; color:#0B3D2E; margin-bottom:8px; }
/* Titres des cartes centrés (certains styles de page affichent les h3 en flex : justify-content en plus de text-align) */
.cms-bloc .card .b-card-titre { text-align:center; justify-content:center; width:100%; }
.b-card-txt   { color:#5A6560; font-size:14.5px; line-height:1.65; }
.b-card-lien  { text-decoration:none; }

/* ── Titre de section ── */
.b-titresec--centre { text-align:center; }
.b-titresec--droite { text-align:right; }
.b-titresec .kicker { color:#E8871E; font-weight:600; letter-spacing:.09em; text-transform:uppercase; font-size:13px; margin-bottom:8px; }
.b-titresec-h2  { font-size:32px; font-weight:700; color:#0B3D2E; margin:0 0 10px; }
.b-titresec-sub { font-size:17px; color:#5A6560; }

/* ── Citation ── */
.b-citation { border-left:5px solid #008774; padding:20px 24px; background:#F0FDF9; border-radius:0 12px 12px 0; margin:20px 0; }
.b-citation-quote  { font-size:56px; color:#C8E6E0; line-height:.4; font-weight:700; margin-bottom:10px; }
.b-citation-txt    { font-size:18px; color:#0B3D2E; font-style:italic; line-height:1.7; margin:0; }
.b-citation-auteur { margin-top:16px; font-weight:700; color:#0B3D2E; }
.b-citation-role   { color:#7A8A82; font-size:14px; }

/* ── Image + Texte ── */
.b-imgtxt { gap:28px; align-items:center; }
.b-imgtxt--centre { max-width:720px; margin:0 auto; }
.b-imgtxt--centre .b-imgtxt-txt { margin-top:20px; }
.b-imgtxt-img { border-radius:14px; overflow:hidden; border:1px solid #DCE9E3; }
.b-imgtxt-img img { width:100%; height:auto; display:block; }
.b-imgtxt-caption { background:rgba(11,61,46,.82); color:#fff; padding:8px 14px; font-size:12.5px; }
.b-imgtxt-ph { background:#E4EBE7; height:200px; display:flex; align-items:center; justify-content:center; color:#7A8A82; }

/* ── Documents ── */
.b-docs { background:#fff; border:1px solid #EAE5DB; border-radius:14px; overflow:hidden; }
.b-docs-titre { font-size:18px; font-weight:700; color:#0B3D2E; margin-bottom:14px; }
.cms-bloc .doc { display:flex; align-items:center; gap:14px; padding:15px 18px; border-bottom:1px solid #F0ECE2; color:#2B2F33; text-decoration:none; }
.cms-bloc .doc:hover { background:#FAF8F3; }
.cms-bloc .doc:last-child { border-bottom:none; }
.cms-bloc .di { display:flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:10px; background:#E8F5F1; color:#008774; flex-shrink:0; }
.b-doc-nom  { font-weight:600; color:#0B3D2E; }
.b-doc-meta { font-size:12.5px; color:#7A8A82; }

/* ── CTA ── */
.b-cta { border-radius:18px; padding:44px 40px; display:grid; grid-template-columns:1.3fr .7fr; gap:32px; align-items:center; }
.b-cta--fonce  { background:#0B3D2E; }
.b-cta--vert   { background:#008774; }
.b-cta--orange { background:#E8871E; }
.b-cta-titre { color:#fff; font-size:26px; font-weight:700; margin-bottom:10px; }
/* Le titre de la bannière ne prend pas le style des h2 de page (fond gris, barre verte, majuscules) :
   il serait illisible sur le fond foncé. !important : classique.css impose font-size:22px !important aux h2. */
.cms-bloc h2.b-cta-titre { color:#fff; font-size:24px !important; line-height:1.3; margin:0 0 8px; padding:0;
                           border:none; background:none; border-radius:0; text-transform:none; letter-spacing:-.01em; min-height:0; }
.cms-bloc h2.b-cta-titre::before { display:none; }
.b-cta .btn { white-space:nowrap; }
.b-cta-txt   { color:rgba(255,255,255,.85); }
.b-cta-btnwrap { display:flex; justify-content:flex-end; }

/* ── Statistiques ── */
.b-stats-titre { text-align:center; font-size:26px; font-weight:700; color:#0B3D2E; margin-bottom:32px; }
.b-stat { text-align:center; padding:28px 20px; background:#fff; border:1px solid #EAE5DB; border-radius:16px; }
.b-stat-ico { font-size:32px; margin-bottom:8px; }
.b-stat-num { font-size:36px; font-weight:800; color:#008774; line-height:1; }
.b-stat-lbl { font-size:14px; color:#5A6560; margin-top:6px; }

/* ── FAQ / Accordéon ── */
.b-faq-titre { font-size:24px; font-weight:700; color:#0B3D2E; margin-bottom:20px; }
.b-faq { display:flex; flex-direction:column; gap:8px; }
.b-faq-item { background:#fff; border:1px solid #EAE5DB; border-radius:12px; overflow:hidden; }
.b-faq-q { padding:14px 20px; font-weight:600; cursor:pointer; list-style:none; display:flex; align-items:center; gap:12px; color:var(--ct,#0B3D2E); background:var(--cf,#fff); }
.b-faq-ico { width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:17px; flex-shrink:0; background:var(--ci,#EAF5F1); }
.b-faq-plus { color:#008774; font-size:20px; flex-shrink:0; transition:transform .2s; }
.b-faq-q::-webkit-details-marker { display:none; }          /* triangle natif de Chrome/Safari */
.b-faq-q::marker { content:''; }
.b-faq-item[open] .b-faq-plus { transform:rotate(45deg); }  /* « + » devient « × » une fois ouvert */
.faq-rep p { margin:0 0 10px; }
.faq-rep p:last-child { margin-bottom:0; }
.faq-rep a { color:#008774; text-decoration:underline; }
.b-faq-item { transition:border-color .2s; }
.b-faq-item[open] { border-color:#BFD9D0; }
.b-faq-q { font-size:15.5px; line-height:1.4; }
.faq-rep { font-size:15px; }
/* Référence de texte (paragraphe entièrement en gras : « Article 23 de l'ordonnance… ») */
.faq-rep p > b:only-child, .faq-rep p > strong:only-child { display:block; color:#9A5B13; font-size:13.5px; letter-spacing:.01em; margin-top:16px; }
.faq-rep p:first-child > b:only-child, .faq-rep p:first-child > strong:only-child { margin-top:4px; }
.faq-rep { padding:6px 20px 18px 66px; color:#5A6560; line-height:1.7; }
.faq-rep ul { list-style:none; padding-left:6px; margin:10px 0; }
.faq-rep ul li { position:relative; padding-left:24px; margin:7px 0; }
.faq-rep ul li::before { content:'❯'; position:absolute; left:2px; top:0; color:#E8871E; font-weight:700; font-size:13px; }
.faq-rep ol { padding-left:22px; margin:10px 0; }
.faq-rep ol li { margin:7px 0; padding-left:4px; }
.faq-rep ol li::marker { color:#008774; font-weight:700; }

/* ── Séparateur ── */
.b-sep-espace { height:48px; }
.b-sep-decore { display:flex; align-items:center; gap:14px; margin:24px 0; }
.b-sep-decore > div { flex:1; height:1px; background:#E4EBE7; }
.b-sep-decore > span { color:#008774; font-size:18px; }
.b-sep-ligne { border:none; border-top:1.5px solid #E4EBE7; margin:24px 0; }

/* ── Encadré / Alerte ── */
.b-alert { border-radius:12px; padding:18px 20px; border:1.5px solid; }
.b-alert--info      { background:#EFF6FF; border-color:#BFDBFE; }
.b-alert--info      .b-alert-titre { color:#1D4ED8; }
.b-alert--attention { background:#FFFBEB; border-color:#FDE68A; }
.b-alert--attention .b-alert-titre { color:#92400E; }
.b-alert--important { background:#FFF1F2; border-color:#FECDD3; }
.b-alert--important .b-alert-titre { color:#BE123C; }
.b-alert--conseil   { background:#F0FDF9; border-color:#A7F3D0; }
.b-alert--conseil   .b-alert-titre { color:#065F46; }
.b-alert-inner { display:flex; align-items:flex-start; gap:12px; }
.b-alert-ico   { font-size:20px; flex-shrink:0; }
.b-alert-titre { font-weight:700; margin-bottom:4px; }
.b-alert-txt   { color:#374151; font-size:14.5px; line-height:1.65; }

/* ── Timeline ── */
/* Frise chronologique. Le titre de période (« A- De 1978 à 2013 ») n'hérite pas du style des h2
   de la page (barre verte à gauche, fond gris) : sélecteur plus précis + !important sur la taille,
   car classique.css impose font-size:22px !important aux h2. */
.cms-content h2.b-tl-titre,
.cms-bloc h2.b-tl-titre,
.b-tl-titre { font-size:22px !important; font-weight:700; color:#0B3D2E; margin:8px 0 22px; padding:0;
              border:none; background:none; border-radius:0; text-transform:none; letter-spacing:-.01em; }
.b-tl { position:relative; padding-left:36px; }
.b-tl-line { position:absolute; left:11px; top:10px; bottom:10px; width:2px; background:#D7E3DE; border-radius:1px; }
.b-tl-item { position:relative; margin-bottom:20px; }
.b-tl-item:last-child { margin-bottom:0; }
/* point centré sur la ligne : centre à 12px du bord de .b-tl (36px de retrait) */
.b-tl-dot { position:absolute; left:-31px; top:18px; width:14px; height:14px; border-radius:50%; border:3px solid #fff; background:var(--c,#008774); box-shadow:0 0 0 2px var(--c,#008774); }
.b-tl-card { background:#fff; border:1px solid #E4EBE7; border-radius:10px; padding:16px 20px; }
.b-tl-date { font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; margin-bottom:8px; color:var(--c,#008774); }
.b-tl-t    { font-weight:700; color:#0B3D2E; font-size:15px; margin-bottom:6px; }
.b-tl-desc { font-size:15px; color:#4A5550; line-height:1.7; }

/* ── Liste avec icônes ── */
.b-li { display:grid; grid-template-columns:1fr; gap:14px; }
.b-li--2col { grid-template-columns:1fr 1fr; }
.b-li--3col { grid-template-columns:repeat(3, 1fr); }
@media (max-width:1100px) { .b-li--3col { grid-template-columns:1fr 1fr; } }
.b-li--compact { gap:6px; }
.b-li-titre { font-size:22px; font-weight:700; color:#0B3D2E; margin-bottom:20px; }
.b-li-item { display:flex; align-items:flex-start; gap:14px; padding:12px 0; border-bottom:1px solid #F0F4F2; }
.b-li-item .b-li-ico { width:42px; height:42px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-size:20px; flex-shrink:0; background:color-mix(in srgb, var(--c,#008774) 14%, transparent); }
.b-li-t    { font-weight:700; color:#0B3D2E; font-size:15px; margin-bottom:3px; }
.b-li-desc { color:#5A6560; font-size:13.5px; line-height:1.6; }
.b-li-carte { background:#fff; border:1px solid #EAE5DB; border-radius:14px; padding:20px; border-top:4px solid var(--c,#008774); }
.b-li-carte .b-li-ico { font-size:26px; margin-bottom:8px; background:transparent; width:auto; height:auto; }
/* Liste avec icônes — style « cartes numérotées » */
.b-li--num { gap:18px; }
.b-li-num { position:relative; background:#fff; border:1px solid #E6E1D6; border-radius:12px; padding:26px 26px 24px;
            display:flex; flex-direction:column; gap:8px; transition:border-color .2s; }
.b-li-num:hover { border-color:var(--c,#008774); }
.b-li-num-n { position:absolute; top:18px; right:22px; font-size:40px; font-weight:800; line-height:1; color:#EEEAE1;
              font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
.b-li-num .b-li-ico { width:56px; height:56px; border-radius:50%; margin-bottom:10px; display:flex; align-items:center; justify-content:center;
                      background:color-mix(in srgb, var(--c,#008774) 88%, #000); font-size:25px; line-height:1;
                      color:transparent; text-shadow:0 0 0 #fff; }   /* émoji redessiné en blanc */
.b-li-num .b-li-t { font-size:16.5px; line-height:1.4; padding-right:44px; }
.b-li--3col .b-li-num { padding:24px 22px 22px; }
.b-li--3col .b-li-num .b-li-t { padding-right:36px; }
.b-li-num .b-li-desc { font-size:14px; }
.b-li-cpt { display:flex; align-items:center; gap:10px; padding:7px 0; border-bottom:1px solid #F0F4F2; }
.b-li-cpt span:first-child { font-size:15px; flex-shrink:0; }
.b-li-cpt span:last-child { font-weight:600; color:#0B3D2E; font-size:14px; }

/* ── Étapes ── */
.b-et-titre { font-size:22px; font-weight:700; color:#0B3D2E; margin-bottom:24px; text-align:center; }
.b-et-h { display:flex; align-items:flex-start; flex-wrap:wrap; }
.b-et-h-item { flex:1; min-width:130px; text-align:center; position:relative; }
.b-et-num { width:44px; height:44px; border-radius:50%; background:#008774; color:#fff; font-size:18px; font-weight:800; display:flex; align-items:center; justify-content:center; margin:0 auto 10px; }
.b-et-link { position:absolute; top:22px; left:calc(50% + 22px); right:0; height:2px; background:#E4EBE7; }
.b-et-v { display:flex; flex-direction:column; gap:14px; }
.b-et-v-item { display:flex; gap:18px; align-items:flex-start; }
.b-et-v-num { width:38px; height:38px; border-radius:50%; background:#008774; color:#fff; font-size:16px; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.b-et-body { flex:1; padding-top:6px; padding-bottom:12px; border-bottom:1px solid #F0F4F2; }
.b-et-t    { font-weight:700; color:#0B3D2E; font-size:15px; margin-bottom:3px; }
.b-et-desc { color:#5A6560; font-size:13.5px; line-height:1.6; }
.b-et-h-item .b-et-t { font-size:14.5px; margin-bottom:5px; }
.b-et-h-item .b-et-desc { font-size:13px; line-height:1.55; }

/* ── Témoignage ── */
.b-tm { border-radius:16px; padding:32px 24px; text-align:left; background:#F0FDF9; }
.b-tm--fond   { background:linear-gradient(135deg,#0B3D2E,#008774); }
.b-tm--centre { padding:32px 40px; text-align:center; }
.b-tm-quote { font-size:52px; line-height:.4; font-weight:900; margin-bottom:10px; color:#C8E6E0; }
.b-tm--fond .b-tm-quote { color:rgba(255,255,255,.25); }
.b-tm-txt { font-size:17px; font-style:italic; line-height:1.75; margin:0 0 18px; color:#0B3D2E; }
.b-tm--fond .b-tm-txt { color:#fff; }
.b-tm-foot { display:flex; align-items:center; gap:12px; }
.b-tm--centre .b-tm-foot { justify-content:center; }
.b-tm-av { width:40px; height:40px; border-radius:50%; background:#D6EDE6; display:flex; align-items:center; justify-content:center; font-size:18px; flex-shrink:0; }
.b-tm--fond .b-tm-av { background:rgba(255,255,255,.2); }
.b-tm-nom { font-weight:700; font-size:14.5px; color:#0B3D2E; }
.b-tm--fond .b-tm-nom { color:#fff; }
.b-tm-role { font-size:13px; color:#5A6560; }
.b-tm--fond .b-tm-role { color:rgba(255,255,255,.75); }

/* ── Responsive blocs ── */
@media (max-width: 900px) {
  .cms-bloc .g3, .cms-bloc .g4 { grid-template-columns: 1fr 1fr; }
  .b-cta { grid-template-columns: 1fr; padding: 30px 24px; }
  .b-cta-btnwrap { justify-content: flex-start; }
  .b-li--2col, .b-li--3col { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .cms-bloc .g2, .cms-bloc .g3, .cms-bloc .g4 { grid-template-columns: 1fr; }
  .b-imgtxt { grid-template-columns: 1fr !important; }
  .faq-rep { padding-left: 20px; }
}

/* ── Documents en grille ── */
.b-docgrid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.b-docgrid--3 { grid-template-columns:repeat(3,1fr); }
.b-docg-card { display:flex; flex-direction:column; align-items:center; text-align:center; gap:6px; background:#fff; border:1px solid #EAE5DB; border-radius:16px; padding:26px 18px 20px; text-decoration:none; transition:.18s; position:relative; overflow:hidden; }
.b-docg-card::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,#008774,#E8871E); opacity:0; transition:.18s; }
.b-docg-card:hover { box-shadow:0 10px 28px -8px rgba(11,61,46,.18); border-color:#008774; transform:translateY(-2px); }
.b-docg-card:hover::before { opacity:1; }
.b-docg-ico { font-size:40px; line-height:1; margin-bottom:4px; }
.b-docg-nom { font-weight:700; color:#0B3D2E; font-size:14.5px; line-height:1.4; }
.b-docg-meta { font-size:12px; color:#7A8A82; letter-spacing:.03em; }
.b-docg-btn { margin-top:10px; display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; color:#008774; border:1.5px solid #008774; border-radius:999px; padding:6px 16px; transition:.15s; }
.b-docg-card:hover .b-docg-btn { background:#008774; color:#fff; }

@media (max-width: 900px) {
  .b-docgrid--3 { grid-template-columns:1fr 1fr; }
}
@media (max-width: 600px) {
  .b-docgrid, .b-docgrid--3 { grid-template-columns:1fr; }
}

/* ── Documents : liste moderne ── */
.b-docs-mod { display:flex; flex-direction:column; gap:10px; }
.docm { display:flex; align-items:center; gap:16px; background:#fff; border:1px solid #E4E8E6; border-radius:10px; padding:14px 18px; text-decoration:none; transition:border-color .15s, background .15s; }
.docm:hover { border-color:#C9D3CF; background:#FAFBFA; }
.docm-ico { font-size:30px; line-height:1; flex-shrink:0; }
/* Icône fichier SVG (PDF, DOC…) : hauteur relative à la taille de police du conteneur */
.b-fico { display:block; height:1.25em; width:auto; }
/* Titre de section documents : pas de tiret orange ni de hauteur forcée */
.cms-content .b-docs-titre { min-height:0; display:block; line-height:1.45; }
.cms-content .b-docs-titre::before { display:none; }
.docm-body { flex:1; min-width:0; }
.docm-nom { font-weight:700; color:#0B3D2E; font-size:14.5px; }
.docm-meta { font-size:12px; color:#7A8A82; margin-top:2px; letter-spacing:.03em; }
.docm-btn { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; color:#008774; border:1.5px solid #008774; border-radius:999px; padding:6px 14px; white-space:nowrap; transition:.15s; flex-shrink:0; }
.docm:hover .docm-btn { background:#008774; color:#fff; }

/* ── Documents : grille bandeaux ── */
.b-docband { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.b-docband--3 { grid-template-columns:repeat(3,1fr); }
.b-docb-card { display:flex; align-items:center; gap:14px; background:linear-gradient(135deg,#F8FAF9,#fff); border:1px solid #EAE5DB; border-radius:14px; padding:16px 18px; text-decoration:none; transition:.18s; }
.b-docb-card:hover { border-color:#008774; box-shadow:0 8px 24px -8px rgba(11,61,46,.18); }
.b-docb-ico { width:48px; height:48px; border-radius:12px; background:#EAF5F1; display:flex; align-items:center; justify-content:center; font-size:24px; flex-shrink:0; }
.b-docb-body { flex:1; min-width:0; }
.b-docb-nom { font-weight:700; color:#0B3D2E; font-size:14px; line-height:1.35; }
.b-docb-meta { font-size:11.5px; color:#7A8A82; margin-top:2px; letter-spacing:.03em; }
.b-docb-dl { width:34px; height:34px; border-radius:50%; border:1.5px solid #008774; color:#008774; display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:700; flex-shrink:0; transition:.15s; }
.b-docb-card:hover .b-docb-dl { background:#008774; color:#fff; }

/* ── Icône emoji dans la liste classique ── */
.di--emoji { font-size:22px; background:#EAF5F1; }

@media (max-width: 900px) { .b-docband--3 { grid-template-columns:1fr 1fr; } }
@media (max-width: 600px) { .b-docband, .b-docband--3 { grid-template-columns:1fr; } .docm-btn { display:none; } }

/* ── Bloc Liste d'articles ── */
/* Titre de section : sélecteur doublé pour l'emporter sur « .cms-content h2 » des modèles de page */
/* (le modèle « classique » ajoute fond, bordure, padding et majuscules aux h2 : on les neutralise) */
.b-arts-titre.b-arts-titre { display:flex; align-items:center; gap:14px; margin:0 0 28px; padding:0; background:none; border:none; border-radius:0; font-size:26px !important; font-weight:800; letter-spacing:-.01em; color:#0B3D2E; text-transform:none; min-height:0; }
.b-arts-titre.b-arts-titre::before { content:""; display:block; width:6px; height:28px; margin:0; border-radius:0; background:#E8871E; flex-shrink:0; }
.b-arts-titre.b-arts-titre::after { content:""; flex:1; height:1px; background:#DCE6E1; }

/* Liste façon agenda (cartes, 1 colonne, sans image) */
.b-arts.b-arts--lignes { display:block; border-top:2px solid #0B3D2E; }
.b-art-agenda { display:grid; grid-template-columns:88px minmax(0,1fr) 44px; align-items:center; gap:28px; padding:22px 6px 22px 0; border-bottom:1px solid #E2E7E4; color:inherit; text-decoration:none !important; transition:background-color .2s; }
.b-art-agenda * { text-decoration:none !important; }
.b-art-agenda:hover { background:#F6F8F7; }
.b-art-agenda:focus-visible { outline:2px solid #E8871E; outline-offset:-2px; }
.b-art-agenda-date { display:flex; flex-direction:column; align-items:center; padding:2px 0; border-right:1px solid #E2E7E4; font-variant-numeric:tabular-nums; }
.b-art-agenda-date b { font-size:34px; font-weight:700; line-height:1; color:#0B3D2E; letter-spacing:-.03em; }
.b-art-agenda-date span { margin-top:6px; font-size:11.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:#6B7A74; }
.b-art-agenda-corps { display:flex; flex-direction:column; gap:8px; min-width:0; }
.b-art-agenda-t { font-size:17px; font-weight:600; line-height:1.45; color:#0B3D2E; transition:color .2s; }
.b-art-agenda:hover .b-art-agenda-t { color:#008774; }
.b-art-badge { display:inline-flex; align-items:center; gap:6px; align-self:flex-start; padding:3px 10px; border-radius:999px; background:#FCEFDF; color:#B5650F; font-size:11.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.b-art-badge svg { flex-shrink:0; }
.b-art-agenda-ex { font-size:14px; line-height:1.6; color:#55625D; }
.b-art-agenda-lieu { display:inline-flex; align-items:center; gap:6px; font-size:13px; color:#6B7A74; }
.b-art-agenda-lieu svg { color:#E8871E; }
.b-art-agenda-go { display:flex; align-items:center; justify-content:center; width:44px; height:44px; border:1px solid #CFD8D4; color:#0B3D2E; transition:background-color .2s, border-color .2s, color .2s; }
.b-art-agenda-go svg { width:16px; height:16px; }
.b-art-agenda:hover .b-art-agenda-go { background:#0B3D2E; border-color:#0B3D2E; color:#fff; }
/* Variante 2 par ligne */
.b-arts.b-arts--lignes2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:36px; }
.b-arts--lignes2 .b-art-agenda { grid-template-columns:72px minmax(0,1fr) 36px; gap:20px; padding:20px 0; }
.b-arts--lignes2 .b-art-agenda-date b { font-size:30px; }
.b-arts--lignes2 .b-art-agenda-t { font-size:15.5px; }
.b-arts--lignes2 .b-art-agenda-go { width:36px; height:36px; }
@media (max-width:900px) {
  .b-arts.b-arts--lignes2 { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .b-art-agenda, .b-arts--lignes2 .b-art-agenda { grid-template-columns:60px minmax(0,1fr); gap:16px; padding:18px 0; }
  .b-art-agenda-date b { font-size:26px; }
  .b-art-agenda-date span { font-size:10px; letter-spacing:.04em; }
  .b-art-agenda-t { font-size:15.5px; }
  .b-art-agenda-go { display:none; }
}
.b-arts { display:grid; gap:26px; }
.b-arts--c1 { grid-template-columns:1fr; }
.b-arts--c2 { grid-template-columns:repeat(2,1fr); }
.b-arts--c3 { grid-template-columns:repeat(3,1fr); }
.b-arts--c4 { grid-template-columns:repeat(4,1fr); }
.b-arts--c5 { grid-template-columns:repeat(5,1fr); gap:16px; }
.b-arts--c6 { grid-template-columns:repeat(6,1fr); gap:14px; }

/* Carte article */
.b-art-card { position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid #EDF1EF; border-radius:0; overflow:hidden; text-decoration:none !important; color:inherit; box-shadow:0 1px 2px rgba(11,61,46,.04),0 10px 30px -22px rgba(11,61,46,.35); transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,border-color .3s; }
.b-art-card::after { content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:linear-gradient(90deg,#008774,#E8871E); transform:scaleX(0); transform-origin:left; transition:transform .35s ease; }
.b-art-card:hover { transform:translateY(-6px); border-color:#D5E7E0; box-shadow:0 2px 4px rgba(11,61,46,.04),0 26px 48px -24px rgba(11,61,46,.45); }
.b-art-card:hover::after { transform:scaleX(1); }
.b-art-card:focus-visible { outline:3px solid #E8871E; outline-offset:3px; }
.b-art-card * { text-decoration:none !important; }
.b-art-img { position:relative; aspect-ratio:16/10; height:auto; background:linear-gradient(135deg,#E3F2EC 0%,#F6EADB 100%); overflow:hidden; display:flex; align-items:center; justify-content:center; color:#008774; }
.b-art-img::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(6,30,22,.35)); pointer-events:none; }
.b-art-card .b-art-img img { width:100%; height:100%; object-fit:cover; margin:0; border-radius:0; max-width:none; transition:transform .6s cubic-bezier(.2,.8,.2,1); }
.b-art-card:hover .b-art-img img { transform:scale(1.07); }
.b-art-img-ph { display:flex; opacity:.45; }
.b-arts-vide { padding:40px 20px; text-align:center; color:#8A9893; font-size:14.5px; background:#F6F9F7; border:1px dashed #DCE6E1; }
/* Vignette illustrée (communiqués, option « icône (sans photo) ») : styles .vig-comm dans styles.css */
.b-art-img--icone::after { display:none; }
/* Bloc Documents, affichage « cartes » : titres longs (intitulés officiels) sur 5 lignes, format en pastille */
.b-doccartes .b-art-t { font-size:14px; -webkit-line-clamp:5; }
.b-doc-format { position:absolute; left:14px; top:14px; z-index:1; padding:5px 10px; background:rgba(255,255,255,.94); color:#0B3D2E;
  font-size:11px; font-weight:800; letter-spacing:.08em; box-shadow:0 6px 16px -8px rgba(0,0,0,.35); }
.b-art-date { position:absolute; left:14px; top:14px; z-index:1; display:flex; flex-direction:column; align-items:center; min-width:58px; padding:7px 10px 6px; border-radius:0; background:rgba(255,255,255,.94); backdrop-filter:blur(6px); color:#5A6560; font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; line-height:1.2; box-shadow:0 6px 16px -8px rgba(0,0,0,.35); }
.b-art-date b { font-size:22px; font-weight:800; color:#0B3D2E; letter-spacing:-.02em; line-height:1; }
.b-art-body { padding:20px 22px 20px; display:flex; flex-direction:column; gap:10px; flex:1; }
.b-art-cats { display:flex; gap:6px; flex-wrap:wrap; }
.b-art-cats:empty { display:none; }
.b-art-cats span { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:#B8650C; background:#FDF1E3; padding:3px 10px; border-radius:0; }
.b-art-t { font-size:17px; font-weight:700; color:#0B3D2E; line-height:1.4; letter-spacing:-.005em; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; transition:color .2s; }
.b-art-card:hover .b-art-t { color:#008774; }
.b-arts--c4 .b-art-t { font-size:15.5px; }
.b-arts--c5 .b-art-t, .b-arts--c6 .b-art-t { font-size:13.5px; }
.b-art-ex { font-size:13.5px; color:#5A6560; line-height:1.6; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.b-art-meta { display:flex; align-items:center; flex-wrap:wrap; gap:6px 14px; margin-top:auto; padding-top:14px; border-top:1px dashed #E4EBE7; font-size:12px; color:#7D8B85; }
.b-art-meta span { display:inline-flex; align-items:center; gap:5px; }
.b-art-meta svg { flex-shrink:0; color:#008774; }
.b-art-lire { margin-left:auto; font-weight:700; color:#008774; font-size:12.5px; }
.b-art-lire svg { transition:transform .25s; }
.b-art-card:hover .b-art-lire svg { transform:translateX(4px); }
@media (prefers-reduced-motion: reduce) {
  .b-art-card, .b-art-card::after, .b-art-card .b-art-img img, .b-art-lire svg { transition:none; }
  .b-art-card:hover, .b-art-card:hover .b-art-img img { transform:none; }
}

/* Style compact (liste de lignes) */
.b-arts--compact { display:flex; flex-direction:column; gap:0; border:1px solid #EAE5DB; border-radius:14px; overflow:hidden; background:#fff; }
.b-art-ligne { display:flex; align-items:center; gap:16px; padding:13px 18px; text-decoration:none; border-bottom:1px solid #F0ECE2; transition:.15s; }
.b-art-ligne:last-child { border-bottom:none; }
.b-art-ligne:hover { background:#F8FAF9; padding-left:24px; }
.b-art-ligne-date { font-size:12px; color:#9AA49E; font-family:monospace; flex-shrink:0; }
.b-art-ligne-titre { flex:1; font-size:14px; font-weight:600; color:#0B3D2E; }
.b-art-ligne-fleche { color:#008774; font-weight:700; }

/* Bouton "Voir tous" */
.b-arts-plus { text-align:center; margin-top:22px; }
.b-arts-plus-btn { display:inline-block; padding:10px 26px; border:1.5px solid #008774; border-radius:999px; color:#008774; font-size:13.5px; font-weight:700; text-decoration:none; transition:.15s; }
.b-arts-plus-btn:hover { background:#008774; color:#fff; }

/* Responsive grilles articles */
@media (max-width: 1100px) {
  .b-arts--c5, .b-arts--c6 { grid-template-columns:repeat(4,1fr); }
  .b-arts--c4 { grid-template-columns:repeat(3,1fr); }
}
@media (max-width: 900px) {
  .b-arts--c3, .b-arts--c4, .b-arts--c5, .b-arts--c6 { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 600px) {
  .b-arts--c2, .b-arts--c3, .b-arts--c4, .b-arts--c5, .b-arts--c6 { grid-template-columns:1fr; }
  .b-art-ligne-date { display:none; }
}

/* ── Bloc Articles : style MAGAZINE (1er article en hero) ── */
.b-arts--mag .b-art-card:first-child { grid-column:1/-1; flex-direction:row; min-height:240px; }
.b-arts--mag .b-art-card:first-child .b-art-img { width:48%; height:auto; flex-shrink:0; }
.b-arts--mag .b-art-card:first-child .b-art-body { justify-content:center; padding:26px 30px; }
.b-arts--mag .b-art-card:first-child .b-art-t { font-size:22px; line-height:1.35; }
.b-arts--mag .b-art-card:first-child .b-art-ex { font-size:14px; -webkit-line-clamp:3; }
@media (max-width:700px) {
  .b-arts--mag .b-art-card:first-child { flex-direction:column; }
  .b-arts--mag .b-art-card:first-child .b-art-img { width:100%; height:180px; }
  .b-arts--mag .b-art-card:first-child .b-art-t { font-size:17px; }
}

/* ── Bloc Articles : style SUPERPOSITION (titre sur image) ── */
.b-art-ov { position:relative; display:flex; align-items:flex-end; min-height:230px; border-radius:16px; overflow:hidden; text-decoration:none; background-size:cover; background-position:center; transition:.25s; }
.b-art-ov:hover { transform:translateY(-3px); box-shadow:0 16px 38px -12px rgba(11,61,46,.35); }
.b-art-ov-grad { position:absolute; inset:0; background:linear-gradient(180deg,transparent 30%,rgba(6,30,22,.88) 100%); transition:.25s; }
.b-art-ov:hover .b-art-ov-grad { background:linear-gradient(180deg,rgba(6,30,22,.15) 0%,rgba(6,30,22,.94) 100%); }
.b-art-ov-body { position:relative; padding:18px 20px; width:100%; }
.b-art-cats--clair span { background:rgba(255,255,255,.18); color:#fff; backdrop-filter:blur(4px); }
.b-art-ov-t { font-size:16px; font-weight:800; color:#fff; line-height:1.35; margin-top:7px; text-shadow:0 1px 6px rgba(0,0,0,.3); }
.b-arts--c5 .b-art-ov-t, .b-arts--c6 .b-art-ov-t { font-size:13.5px; }
.b-art-ov-meta { font-size:11.5px; color:rgba(255,255,255,.85); margin-top:7px; }
.b-arts--ov.b-arts--c1 .b-art-ov { min-height:320px; }

/* ── Bloc Articles : style LISTE MODERNE (média horizontal) ── */
.b-arts--listemod { display:flex; flex-direction:column; gap:14px; }
.b-art-lm { display:flex; gap:18px; background:#fff; border:1px solid #EAE5DB; border-radius:14px; overflow:hidden; text-decoration:none; transition:.2s; }
.b-art-lm:hover { border-color:#008774; box-shadow:0 10px 26px -10px rgba(11,61,46,.18); }
.b-art-lm-img { width:210px; flex-shrink:0; background:#EAF5F1; display:flex; align-items:center; justify-content:center; }
.b-art-lm-img img { width:100%; height:100%; object-fit:cover; }
.b-art-lm-body { padding:16px 18px 16px 0; display:flex; flex-direction:column; gap:7px; flex:1; }
.b-art-lm:not(:has(.b-art-lm-img)) .b-art-lm-body { padding-left:18px; }
.b-art-lm-t { font-size:16px; font-weight:700; color:#0B3D2E; line-height:1.4; }
@media (max-width:640px) {
  .b-art-lm { flex-direction:column; }
  .b-art-lm-img { width:100%; height:160px; }
  .b-art-lm-body { padding:0 16px 16px; }
}

/* ── Bloc Articles : pagination ── */
.b-arts-pagin { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:40px; }
.b-arts-pg { padding:10px 20px; border:1px solid #DCE6E1; border-radius:0; background:#fff; color:#0B3D2E; font-size:13px; font-weight:700; text-decoration:none !important; transition:.2s; }
.b-arts-pg:hover { background:#0B3D2E; border-color:#0B3D2E; color:#fff; }
.b-arts-pg--off, .b-arts-pg--off:hover { background:transparent; border-color:#EDF1EF; color:#C0CCC5; cursor:default; }
.b-arts-nums { display:inline-flex; align-items:center; gap:0; }
.b-arts-num { display:inline-flex; align-items:center; justify-content:center; min-width:40px; height:40px; padding:0 6px; border:1px solid #DCE6E1; margin-left:-1px; border-radius:0; color:#0B3D2E; font-size:13.5px; font-weight:700; text-decoration:none !important; transition:.2s; }
a.b-arts-num:hover { background:#F6F8F7; color:#008774; }
.b-arts-num--on { position:relative; z-index:1; background:#0B3D2E; border-color:#0B3D2E; color:#fff; }
.b-arts-num--etc { min-width:20px; color:#9AA49E; }
.b-arts-pg-info { font-size:13px; color:#5A6560; font-weight:600; }
@media (max-width:600px) { .b-arts-pg { padding:9px 14px; } .b-arts-titre.b-arts-titre { font-size:21px; } }


/* =====================================================================
   Bloc « Galerie photo » (avec Fancybox)
   Une carte par article : image à la une comme vignette, clic → ouvre
   toutes les photos de la galerie de cet article dans Fancybox.
   ===================================================================== */
.b-gal-titre { font-size:24px; font-weight:700; color:#0B3D2E; margin-bottom:22px; }

.b-gal-card { position:relative; display:flex; flex-direction:column; }
.b-gal-hidden { display:none; }

.b-gal-cover { position:relative; display:block; overflow:hidden; border-radius:12px; background:#EAF5F1; text-decoration:none; flex:none; width:100%; }
.b-gal-cover img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease; }
.b-gal-cover:hover img { transform:scale(1.06); }
.b-gal-count { position:absolute; top:10px; right:10px; background:rgba(11,61,46,.78); color:#fff; font-size:11px; font-weight:700;
  padding:3px 10px; border-radius:999px; backdrop-filter:blur(2px); }
/* Filigrane : icône photo centrée sur la vignette */
.b-gal-filigrane { position:absolute; inset:0; z-index:1; display:flex; align-items:center; justify-content:center; color:#fff; opacity:.55;
  pointer-events:none; filter:drop-shadow(0 2px 6px rgba(0,0,0,.35)); transition:opacity .3s ease; }
.b-gal-filigrane svg { width:28%; max-width:72px; min-width:36px; height:auto; stroke-width:1.5; }
.b-gal-cover:hover .b-gal-filigrane, .b-art-card:hover .b-gal-filigrane { opacity:.85; }
.b-gal-count, .b-gal-cartes .b-art-date { z-index:2; }
.b-gal-titre-lien { display:block; margin-top:9px; font-size:13.5px; font-weight:700; color:#0B3D2E; text-decoration:none; line-height:1.35; }
.b-gal-titre-lien:hover { color:#008774; text-decoration:underline; }

/* Ratios (s'appliquent à la vignette de couverture) */
.b-gal-rcarre .b-gal-cover { aspect-ratio:1/1; }
.b-gal-r43 .b-gal-cover    { aspect-ratio:4/3; }
.b-gal-r169 .b-gal-cover   { aspect-ratio:16/9; }
.b-gal-rport .b-gal-cover  { aspect-ratio:3/4; }
.b-gal-rauto .b-gal-cover img { height:auto; }

/* Style : grilles régulières */
.b-gal--grille { display:grid; gap:20px; }
.b-gal--grille.b-gal--c2 { grid-template-columns:repeat(2,1fr); }
.b-gal--grille.b-gal--c3 { grid-template-columns:repeat(3,1fr); }
.b-gal--grille.b-gal--c4 { grid-template-columns:repeat(4,1fr); }

/* Style : mosaïque — grille plus dense (5 colonnes), toutes les vignettes à la même taille */
.b-gal--mosaique { display:grid; gap:14px; grid-template-columns:repeat(5,1fr); }

/* Style : carrousel horizontal défilant — toutes les vignettes à la même largeur */
.b-gal--carrousel { display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -ms-overflow-style:none; padding:4px 2px; }
.b-gal--carrousel::-webkit-scrollbar { display:none; }
.b-gal--carrousel .b-gal-card { flex:0 0 240px; scroll-snap-align:start; }

/* Style : mur (grille à colonnes égales, toutes les vignettes à la même taille) */
.b-gal--mur { display:grid; gap:12px; grid-template-columns:repeat(auto-fill, minmax(180px, 1fr)); }

@media (max-width:900px) {
  .b-gal--grille.b-gal--c3, .b-gal--grille.b-gal--c4 { grid-template-columns:repeat(2,1fr); }
  .b-gal--mosaique { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:560px) {
  .b-gal--grille.b-gal--c2, .b-gal--grille.b-gal--c3, .b-gal--grille.b-gal--c4 { grid-template-columns:repeat(2,1fr); }
  .b-gal--mosaique { grid-template-columns:repeat(2,1fr); }
  .b-gal--mur { grid-template-columns:repeat(2,1fr); }
}

/* Surcharges Fancybox pour rester dans la charte de l'institution */
.fancybox__caption { font-family:'Poppins',sans-serif; }
.carousel__button.is-close svg { color:#fff; }

/* =====================================================================
   Bloc « Vidéo » — même structure de carte que la Galerie photo
   (b-gal-card / b-gal-cover), avec un bouton lecture superposé.
   ===================================================================== */
.b-vid-cover { background:#0B3D2E; }
.b-vid-play {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:52px; height:52px; border-radius:50%; background:rgba(255,255,255,.92);
  color:#0B3D2E; font-size:18px; display:flex; align-items:center; justify-content:center;
  padding-left:3px; /* recentrer visuellement le triangle ▶ */
  transition:transform .2s ease, background .2s ease;
}
.b-vid-cover:hover .b-vid-play { transform:translate(-50%,-50%) scale(1.08); background:#fff; }

/* Vidéo sans vignette : logo de la Commission en image principale, sur fond clair */
a.b-vid-cover:has(img.b-vid-logo) { background:#F4F7F5; }
a.b-vid-cover img.b-vid-logo { width:100%; height:100%; object-fit:contain; padding:14% 18%; box-sizing:border-box; margin:0; border-radius:0; max-width:none; }
a.b-vid-cover:has(img.b-vid-logo)::after { display:none; }

/* Style : cartes — reprend la carte « Articles similaires » (front/article-detail), en grille de 4 */
.b-vsim { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.b-vsim-card { position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid #E4EBE7; border-radius:0; overflow:hidden;
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,border-color .3s; }
.b-vsim-card::after { content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:linear-gradient(90deg,#008774,#E8871E);
  transform:scaleX(0); transform-origin:left; transition:transform .35s ease; pointer-events:none; }
.b-vsim-card:hover { transform:translateY(-5px); border-color:#D5E7E0; box-shadow:0 22px 40px -24px rgba(11,61,46,.45); }
.b-vsim-card:hover::after { transform:scaleX(1); }
a.b-vsim-img { position:relative; display:flex; align-items:center; justify-content:center; aspect-ratio:16/10; overflow:hidden; border-radius:0;
  background:linear-gradient(135deg,#E3F2EC,#F6EADB); color:#008774; text-decoration:none; }
a.b-vsim-img img { width:100%; height:100%; object-fit:cover; display:block; margin:0; border-radius:0; max-width:none; transition:transform .6s cubic-bezier(.2,.8,.2,1); }
.b-vsim-card:hover a.b-vsim-img img { transform:scale(1.07); }
a.b-vsim-img img.b-vsim-ph { width:auto; height:auto; max-width:62%; max-height:52%; object-fit:contain; }
.b-vsim-card:hover a.b-vsim-img img.b-vsim-ph { transform:none; }
a.b-vsim-img:has(.b-vsim-ph) { background:#F4F7F5; }
.b-vsim-cat { position:absolute; top:0; left:0; z-index:2; background:#0B3D2E; color:#fff; font-size:10px; font-weight:700; text-transform:uppercase;
  letter-spacing:.08em; padding:6px 12px; border-radius:0; }
.b-vsim .b-vid-play { z-index:2; }
.b-vsim-card:hover .b-vid-play { transform:translate(-50%,-50%) scale(1.08); background:#fff; }
a.b-vsim-body { display:flex; flex-direction:column; gap:10px; flex:1; padding:16px 18px 18px; text-decoration:none !important; }
.b-vsim-t { font-size:15px; font-weight:700; color:#0B3D2E; line-height:1.4; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; transition:color .2s; }
.b-vsim-card:hover .b-vsim-t { color:#008774; }
.b-vsim-d { display:flex; flex-wrap:wrap; gap:6px 14px; font-size:12px; color:#7D8B85; }
.b-vsim-d span { display:inline-flex; align-items:center; gap:5px; }
.b-vsim-d svg { width:13px; height:13px; color:#008774; }
.b-vsim-lire { display:inline-flex; align-items:center; gap:6px; margin-top:auto; padding-top:12px; border-top:1px dashed #E4EBE7; font-size:12.5px; font-weight:700; color:#008774; }
.b-vsim-lire svg { width:14px; height:14px; transition:transform .25s; }
.b-vsim-card:hover .b-vsim-lire svg { transform:translateX(4px); }
@media (max-width:1100px) { .b-vsim { grid-template-columns:repeat(3,1fr); } }
@media (max-width:820px)  { .b-vsim { grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px)  { .b-vsim { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) {
  .b-vsim-card, .b-vsim-card::after, a.b-vsim-img img { transition:none; }
  .b-vsim-card:hover, .b-vsim-card:hover a.b-vsim-img img { transform:none; }
}

/* Style : liste (vignette 16:9 à gauche, titre à droite) */
.b-vid--liste { display:flex; flex-direction:column; gap:14px; }
.b-vid--liste .b-vid-card { display:grid; grid-template-columns:220px 1fr; gap:16px; align-items:center; }
.b-vid--liste .b-gal-cover { width:220px; }
.b-vid--liste .b-gal-titre-lien { margin-top:0; font-size:15px; }
@media (max-width:640px) {
  .b-vid--liste .b-vid-card { grid-template-columns:1fr; }
  .b-vid--liste .b-gal-cover { width:100%; }
}

/* =====================================================================
   Bloc « Formulaire » (Nous contacter, Formulaire de plainte, etc.)
   ===================================================================== */
.cf-formulaire { max-width:720px; margin:0 auto; }
.cf-description { font-size:14px; color:#5A6560; margin:0 0 20px; }
.cf-alerte { padding:14px 18px; border-radius:10px; font-size:13.5px; margin-bottom:20px; }
.cf-alerte--succes { background:#E8F5EE; color:#0B3D2E; border:1px solid #B7E0C8; }
.cf-alerte--erreur { background:#FDECEC; color:#8A1F1F; border:1px solid #F3B9B9; }

.cf-form { display:flex; flex-direction:column; gap:18px; }
.cf-champ { display:flex; flex-direction:column; gap:6px; }
.cf-champ label { font-size:13px; font-weight:700; color:#0B3D2E; }
.cf-requis { color:#C0392B; margin-left:2px; }
.cf-champ input[type=text], .cf-champ input[type=email], .cf-champ input[type=tel],
.cf-champ input[type=date], .cf-champ input[type=file], .cf-champ textarea, .cf-champ select {
  padding:11px 14px; border:1px solid #DCE3DE; border-radius:9px; font-size:14px; font-family:inherit;
  background:#fff; transition:.15s;
}
.cf-champ input:focus, .cf-champ textarea:focus, .cf-champ select:focus {
  outline:none; border-color:#016830; box-shadow:0 0 0 3px rgba(1,104,48,.1);
}
.cf-champ textarea { resize:vertical; }
.cf-options { display:flex; flex-direction:column; gap:8px; }
.cf-option { display:flex; align-items:center; gap:8px; font-size:13.5px; font-weight:400; color:#233029; }
.cf-option input { accent-color:#016830; }
.cf-erreur { font-size:12px; color:#C0392B; }
.cf-honeypot { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.cf-champ--captcha { margin-top:-4px; }
.cf-submit {
  align-self:flex-start; padding:13px 32px; background:#016830; color:#fff; border:none; border-radius:999px;
  font-size:14.5px; font-weight:700; cursor:pointer; transition:.2s;
}
.cf-submit:hover { background:#014D24; }
.cf-indisponible { font-size:13.5px; color:#9AA49E; font-style:italic; }
@media (max-width:640px) { .cf-submit { width:100%; text-align:center; } }


/* =====================================================================
   Formulaire — mise en ligne des champs (2 ou 3 par ligne) + 2 styles
   À COLLER À LA FIN DE commun.css (ces règles complètent/surchargent
   les règles .cf-* déjà existantes plus haut dans le fichier — l'ordre
   du CSS fait qu'elles prennent le dessus sans rien modifier ailleurs).
   ===================================================================== */

/* Le conteneur passe en ligne avec retour à la ligne : chaque champ
   déclare sa propre largeur (cf-w-*), ils se réalignent tout seuls. */
.cf-form { flex-direction: row; flex-wrap: wrap; }

.cf-w-pleine { flex: 1 1 100%; }
.cf-w-moitie { flex: 1 1 calc(50% - 9px); }   /* 9px = moitié du gap de 18px */
.cf-w-tiers  { flex: 1 1 calc(33.333% - 12px); } /* 12px ≈ 2/3 du gap de 18px */

@media (max-width: 640px) {
  /* Sur mobile, tous les champs repassent en pleine largeur, quel que soit leur réglage */
  .cf-w-moitie, .cf-w-tiers { flex: 1 1 100%; }
}

/* ── Style 2 : « Moderne » — champs soulignés, carte arrondie ── */
.cf-formulaire--moderne .cf-form {
  background:#fff; border:1px solid #EAEFEC; border-radius:20px; padding:28px;
  box-shadow:0 4px 24px rgba(1,104,48,.06);
}
.cf-formulaire--moderne .cf-champ label {
  font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:#5A6560; font-weight:700;
}
.cf-formulaire--moderne .cf-champ input[type=text],
.cf-formulaire--moderne .cf-champ input[type=email],
.cf-formulaire--moderne .cf-champ input[type=tel],
.cf-formulaire--moderne .cf-champ input[type=date],
.cf-formulaire--moderne .cf-champ textarea,
.cf-formulaire--moderne .cf-champ select {
  border:none; border-bottom:2px solid #E3E9E5; border-radius:0; padding:10px 2px;
  background:transparent;
}
.cf-formulaire--moderne .cf-champ input[type=file] {
  border:1px dashed #D8E2DC; border-radius:10px; background:#FAFCFB;
}
.cf-formulaire--moderne .cf-champ input:focus,
.cf-formulaire--moderne .cf-champ textarea:focus,
.cf-formulaire--moderne .cf-champ select:focus {
  border-bottom-color:#016830; box-shadow:none;
}
.cf-formulaire--moderne .cf-submit {
  border-radius:12px; padding:14px 40px;
  background:linear-gradient(135deg,#016830,#0B3D2E);
}
.cf-formulaire--moderne .cf-submit:hover { background:linear-gradient(135deg,#014D24,#08301F); }

/* =====================================================================
   Formulaires — assistant en étapes, conditions, fichiers, confirmation
   (resources/views/front/partials/formulaire*.blade.php)
   Préfixe .cf-formulaire partout : ces règles l'emportent sur les styles
   de page (.cms-content ol/li/h3/p…), qui déformaient l'indicateur d'étapes.
   ===================================================================== */
.cf-formulaire [hidden] { display:none !important; }   /* .cf-champ est en flex : sans ceci, hidden serait ignoré */
.cf-formulaire.cf-assistant { max-width:none; }
.cf-formulaire.cf-assistant .cf-form { background:#fff; border:1px solid #E6E1D6; border-radius:12px; padding:28px 30px 24px; gap:18px; }
.cf-formulaire .cf-label { font-size:13px; font-weight:700; color:#0B3D2E; }
.cf-formulaire .cf-aide { font-size:12.5px; color:#66716B; line-height:1.5; }
.cf-formulaire .cf-erreur { font-weight:500; }
.cf-formulaire .cf-invalide input[type=text], .cf-formulaire .cf-invalide input[type=email], .cf-formulaire .cf-invalide input[type=tel],
.cf-formulaire .cf-invalide input[type=date], .cf-formulaire .cf-invalide textarea, .cf-formulaire .cf-invalide select { border-color:#C0392B; }
.cf-formulaire .cf-alerte ul { margin:6px 0 0 18px; padding:0; }
.cf-formulaire .cf-alerte p { margin:0; }

/* Indicateur d'étapes : sur une seule ligne */
.cf-formulaire .cf-progression { flex:1 1 100%; display:flex; flex-direction:row; align-items:center; gap:10px; margin:0; padding:0; }
.cf-formulaire .cf-pas { flex:1 1 0; min-width:0; display:flex; flex-direction:row; align-items:center; gap:10px;
                         font-size:13.5px; font-weight:600; color:#66716B; margin:0; }
.cf-formulaire .cf-pas + .cf-pas::before { content:''; flex:0 0 18px; height:2px; background:#E3DED2; margin-right:2px; }
.cf-formulaire .cf-pas-num { flex:none; width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center;
                             border:2px solid #DDD8CC; background:#fff; font-size:13px; font-weight:700; color:#66716B; transition:.2s; }
.cf-formulaire .cf-pas-txt { min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cf-formulaire .cf-pas--actif { color:#0B3D2E; }
.cf-formulaire .cf-pas--actif .cf-pas-num { border-color:#008774; background:#008774; color:#fff; }
.cf-formulaire .cf-pas--fait { color:#008774; cursor:pointer; }
.cf-formulaire .cf-pas--fait .cf-pas-num { border-color:#008774; color:transparent; position:relative; }
.cf-formulaire .cf-pas--fait .cf-pas-num::after { content:'✓'; position:absolute; color:#008774; font-size:15px; }
.cf-formulaire .cf-barre { flex:1 1 100%; height:4px; background:#EEEAE1; border-radius:2px; overflow:hidden; margin:-4px 0 6px; }
.cf-formulaire .cf-barre span { display:block; height:100%; width:0; background:#008774; transition:width .3s ease; }
.cf-formulaire:not(.cf-js) .cf-progression, .cf-formulaire:not(.cf-js) .cf-barre { display:none; }

/* Étapes */
.cf-formulaire .cf-etape { flex:1 1 100%; min-width:0; display:flex; flex-direction:row; flex-wrap:wrap; gap:18px; border:none; margin:0; padding:0; }
.cf-formulaire.cf-js .cf-etape:not(.cf-active) { display:none; }
.cf-formulaire:not(.cf-js) .cf-etape + .cf-etape { margin-top:24px; padding-top:24px; border-top:1px solid #EEEAE1; }
.cf-formulaire .cf-etape-titre { flex:1 1 100%; font-size:19px !important; font-weight:700; color:#0B3D2E; margin:0 !important;
                                 padding:0 !important; border:none !important; background:none !important; text-transform:none !important; min-height:0 !important; display:block !important; }
.cf-formulaire .cf-etape-titre::before { display:none !important; }
.cf-formulaire .cf-etape-aide { flex:1 1 100%; font-size:13.5px; color:#66716B; margin:-10px 0 0 !important; text-align:left !important; }

/* Choix unique : pastilles côte à côte */
.cf-formulaire .cf-options--choix { flex-direction:row; flex-wrap:wrap; gap:10px; }
.cf-formulaire .cf-options--choix .cf-option { position:relative; }
.cf-formulaire .cf-options--choix .cf-option input { position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.cf-formulaire .cf-options--choix .cf-option span { display:flex; align-items:center; gap:10px; min-width:90px; padding:10px 16px; border:1px solid #DDD8CC;
                                                    border-radius:8px; background:#fff; font-size:14px; color:#2D3836; transition:.15s; cursor:pointer; }
.cf-formulaire .cf-options--choix .cf-option span::before { content:''; flex:none; width:16px; height:16px; border-radius:50%; border:2px solid #B7C0BB; background:#fff; }
.cf-formulaire .cf-options--choix .cf-option input:checked + span { border-color:#008774; background:#F1F8F5; color:#0B3D2E; }
.cf-formulaire .cf-options--choix .cf-option input:checked + span::before { border-color:#008774; background:#008774; box-shadow:inset 0 0 0 3px #fff; }
.cf-formulaire .cf-options--choix .cf-option input:focus-visible + span { outline:2px solid #008774; outline-offset:2px; }
.cf-formulaire .cf-invalide .cf-options--choix .cf-option span { border-color:#F3B4B4; }
.cf-formulaire .cf-champ--checkbox .cf-option { align-items:flex-start; line-height:1.5; }
.cf-formulaire .cf-champ--checkbox .cf-option input { width:17px; height:17px; margin-top:2px; flex:none; }

/* Fichiers : zone de dépôt + liste */
.cf-formulaire .cf-depot { position:relative; border:2px dashed #DDD8CC; border-radius:10px; background:#FBFAF7; padding:16px; transition:.15s; }
.cf-formulaire .cf-depot:hover, .cf-formulaire .cf-depot.cf-survol { border-color:#008774; background:#F4FAF8; }
.cf-formulaire .cf-depot input[type=file] { width:100%; border:none; background:transparent; padding:0; }
.cf-formulaire.cf-js .cf-depot input[type=file] { position:absolute; inset:0; opacity:0; cursor:pointer; }
.cf-formulaire .cf-depot-txt { text-align:center; font-size:14px; color:#4A5550; line-height:1.6; pointer-events:none; }
.cf-formulaire .cf-depot-txt b { color:#008774; }
.cf-formulaire .cf-depot-txt small { color:#66716B; font-size:12.5px; }
.cf-formulaire:not(.cf-js) .cf-depot-txt { display:none; }
.cf-formulaire .cf-fichiers { list-style:none !important; margin:0 !important; padding:0 !important; position:relative; z-index:2; }
.cf-formulaire .cf-fichiers:not(:empty) { margin-top:12px !important; display:flex; flex-direction:column; gap:6px; }
.cf-formulaire .cf-fichiers li { display:flex; align-items:center; gap:10px; background:#fff; border:1px solid #E6E1D6; border-radius:7px; padding:8px 10px; font-size:13.5px; margin:0; }
.cf-formulaire .cf-fichiers li::before { display:none; }
.cf-formulaire .cf-fnom { flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#0B3D2E; font-weight:500; }
.cf-formulaire .cf-ftaille { color:#66716B; font-size:12.5px; white-space:nowrap; }
.cf-formulaire .cf-fichiers button { border:none; background:none; color:#C0392B; font-size:18px; line-height:1; cursor:pointer; padding:0 4px; }

/* Navigation et envoi */
.cf-formulaire .cf-nav { display:flex; flex-direction:row; align-items:center; gap:12px; padding-top:18px; border-top:1px solid #EEEAE1; }
.cf-formulaire:not(.cf-assistant) .cf-nav { border-top:none; padding-top:0; }
.cf-formulaire .cf-nav-info { flex:1; font-size:13px; color:#66716B; text-align:center; }
.cf-formulaire .cf-btn { border:none; border-radius:999px; padding:12px 26px; font:inherit; font-size:14.5px; font-weight:700; cursor:pointer; background:#016830; color:#fff; transition:background .15s; }
.cf-formulaire .cf-btn:hover { background:#014D24; }
.cf-formulaire .cf-btn--sec { background:#fff; color:#0B3D2E; border:1px solid #DDD8CC; }
.cf-formulaire .cf-btn--sec:hover { background:#F6F4EE; }
.cf-formulaire.cf-assistant .cf-submit { background:#E8871E; }
.cf-formulaire.cf-assistant .cf-submit:hover { background:#CF7412; }
.cf-formulaire .cf-submit[disabled], .cf-formulaire .cf-btn[disabled] { opacity:.6; cursor:wait; }
.cf-formulaire .cf-envoi-barre { height:8px; background:#EEEAE1; border-radius:4px; overflow:hidden; }
.cf-formulaire .cf-envoi-barre span { display:block; height:100%; width:0; background:#008774; transition:width .2s; }
.cf-formulaire .cf-envoi-txt { font-size:13.5px; color:#66716B; margin:8px 0 0 !important; text-align:center !important; }
.cf-formulaire .cf-brouillon { flex:1 1 100%; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 16px;
                               background:#F1F8F5; border:1px solid #CFE5DD; color:#0B3D2E; border-radius:8px; padding:10px 14px; font-size:13.5px; }
.cf-formulaire .cf-lien { border:none; background:none; color:#008774; font:inherit; font-weight:600; text-decoration:underline; cursor:pointer; padding:0; }

/* Confirmation */
.cf-formulaire .cf-succes { background:#fff; border:1px solid #CFE5DD; border-radius:12px; padding:34px 28px; text-align:center; }
.cf-formulaire .cf-succes-ico { width:62px; height:62px; margin:0 auto 14px; border-radius:50%; background:#008774; color:#fff;
                                display:flex; align-items:center; justify-content:center; font-size:30px; font-weight:700; }
.cf-formulaire .cf-succes p { color:#4A5550; max-width:580px; margin:0 auto 10px !important; line-height:1.65; text-align:center !important; }
.cf-formulaire .cf-succes-msg { font-size:16px; color:#0B3D2E !important; font-weight:600; }
.cf-formulaire .cf-numero { font-size:19px; color:#008774; letter-spacing:.03em; }
.cf-formulaire .cf-succes .btn { margin-top:10px; }
.cf-formulaire .cf-succes-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:10px 22px; margin-top:6px; }
.cf-formulaire .cf-lien-suivi { color:#008774; font-weight:600; text-decoration:underline; margin-top:10px; }

@media (max-width:760px) {
  .cf-formulaire.cf-assistant .cf-form { padding:20px 16px; }
  .cf-formulaire .cf-pas-txt { display:none; }
  .cf-formulaire .cf-pas--actif .cf-pas-txt { display:inline; }
  .cf-formulaire .cf-pas + .cf-pas::before { flex-basis:10px; }
  .cf-formulaire .cf-nav-info { display:none; }
  .cf-formulaire .cf-btn, .cf-formulaire .cf-submit { padding:12px 18px; }
}
@media (prefers-reduced-motion:reduce) { .cf-formulaire * { transition:none !important; } }
