/*
 * Barreau du Gabon : bibliothèque de composants (UI Kit, lot 1)
 * Fondée exclusivement sur tokens.css (design system v1.5) : aucune couleur, taille ni espacement en dur,
 * hormis les dimensions propres aux composants (hauteurs de 40, 44, 48, 56 px) et les valeurs signalées en commentaire.
 *
 * Nommage : BEM préfixé « bdg- » (bloc bdg-card, élément bdg-card__title, modificateur bdg-card--news).
 * États réels : pseudo-classes (:hover, :focus-visible, :active, :disabled), attributs ARIA (aria-expanded, aria-current,
 * aria-invalid, aria-busy) et classes d'état « is- » posées par le script (is-open, is-compact, is-loading).
 * États simulés : les classes « is-hover », « is-focus » et « is-active » reproduisent les pseudo-classes pour les captures
 * de l'UI Kit. Elles sont regroupées avec les pseudo-classes correspondantes et peuvent être retirées du thème.
 *
 * Points de rupture : 768 px (tablette) et 1024 px (ordinateur), comme tokens.css.
 */

/* ==========================================================================
   0. Base
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 72px; /* hauteur de l'en-tête compact + marge (WCAG 2.4.11) */ }
body {
  margin: 0;
  font-family: var(--bdg-font-family-base);
  font-size: var(--bdg-font-size-body);
  line-height: var(--bdg-font-line-height-body);
  color: var(--bdg-color-text-primary);
  background: var(--bdg-color-background-page);
}
img { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; color: inherit; border-radius: var(--bdg-radius-none); }
button { background: none; border: 0; padding: 0; cursor: pointer; }

.bdg-container { max-width: calc(var(--bdg-layout-container-max) + 2 * var(--bdg-layout-margin)); margin-inline: auto; padding-inline: var(--bdg-layout-margin); }
.bdg-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.bdg-icon { width: var(--bdg-icon-size-lg); height: var(--bdg-icon-size-lg); flex: none; fill: none; stroke: currentColor;
  stroke-width: var(--bdg-icon-stroke); stroke-linecap: square; stroke-linejoin: miter; }
.bdg-icon--sm { width: var(--bdg-icon-size-sm); height: var(--bdg-icon-size-sm); }
.bdg-icon--md { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); }
.bdg-icon--xl { width: var(--bdg-icon-size-xl); height: var(--bdg-icon-size-xl); }

/* Typographie (échelle du design system §3.3) */
.bdg-h1 { font-size: var(--bdg-font-size-h1); line-height: var(--bdg-font-line-height-h1); letter-spacing: var(--bdg-font-letter-spacing-h1); font-weight: var(--bdg-font-weight-bold); margin: 0; }
.bdg-h2 { font-size: var(--bdg-font-size-h2); line-height: var(--bdg-font-line-height-h2); font-weight: var(--bdg-font-weight-bold); margin: 0; }
.bdg-h3 { font-size: var(--bdg-font-size-h3); line-height: var(--bdg-font-line-height-h3); font-weight: var(--bdg-font-weight-bold); margin: 0; }
.bdg-h4 { font-size: var(--bdg-font-size-h4); line-height: var(--bdg-font-line-height-h4); font-weight: var(--bdg-font-weight-bold); margin: 0; }
.bdg-lead { font-size: var(--bdg-font-size-lead); line-height: var(--bdg-font-line-height-lead); margin: 0; }
.bdg-small { font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }
.bdg-caption { font-size: var(--bdg-font-size-caption); line-height: var(--bdg-font-line-height-caption); }
.bdg-overline { font-size: var(--bdg-font-size-overline); line-height: var(--bdg-font-line-height-overline); font-weight: var(--bdg-font-weight-bold);
  text-transform: uppercase; letter-spacing: var(--bdg-font-letter-spacing-overline); margin: 0; }
.bdg-muted { color: var(--bdg-color-text-secondary); }
.bdg-surface-dark .bdg-muted, .bdg-footer .bdg-muted, .bdg-cookie-banner .bdg-muted { color: var(--bdg-color-text-inverse-secondary); }
.bdg-rule::after { content: ""; display: block; width: 48px; height: var(--bdg-border-width-accent); background: var(--bdg-color-border-accent); margin-top: var(--bdg-space-4); }

/* États simulés des liens (UI Kit) : mêmes règles que :hover et :focus-visible de tokens.css */
a.is-hover { color: var(--bdg-interactive-hover-color); }
.bdg-prose a.is-hover { color: var(--bdg-link-hover-color); background-color: var(--bdg-link-hover-bg); }
a.is-focus, .bdg-prose a.is-focus { color: var(--bdg-focus-block-color); background-color: var(--bdg-focus-block-bg); }

/* ==========================================================================
   1. Structure
   ========================================================================== */

/* 1.1 Lien d'évitement : premier élément de la page, visible au focus clavier seulement */
.bdg-skip-link { position: absolute; left: var(--bdg-space-4); top: -100px; z-index: 100; margin: 0; padding: var(--bdg-space-3) var(--bdg-space-4);
  font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); }
.bdg-skip-link:focus-visible, .bdg-skip-link.is-focus { top: var(--bdg-space-4); }

/* 1.2 En-tête : mobile d'abord (barre + panneau), deux niveaux à partir de 1024 px */
.bdg-header { position: relative; z-index: 50; background: var(--bdg-color-background-page); border-bottom: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle); }
.bdg-header__bar { display: flex; align-items: center; justify-content: space-between; gap: var(--bdg-space-6); padding-block: var(--bdg-space-3); }
.bdg-header__logo { display: block; flex: none; margin: 0; padding: 0; }
.bdg-header__logo img { width: 180px; height: auto; } /* taille minimale du logo (design system §10.4) */
.bdg-header__tools { display: none; align-items: center; gap: var(--bdg-space-4); }
.bdg-header__mobile-actions { display: flex; gap: var(--bdg-space-1); }
.bdg-header__menu-toggle { width: 44px; height: 44px; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  font-size: 10px; font-weight: var(--bdg-font-weight-bold); line-height: 1; text-transform: uppercase; letter-spacing: .04em; color: var(--bdg-interactive-color); }
.bdg-header__menu-toggle:hover, .bdg-header__menu-toggle.is-hover { color: var(--bdg-interactive-hover-color); }
.bdg-header__menu-toggle:focus-visible, .bdg-header__menu-toggle.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); }

/* Recherche (en-tête et panneau mobile) */
.bdg-search { display: flex; align-items: stretch; width: 100%; height: 48px; border: var(--bdg-border-width-hairline) solid var(--bdg-color-border-control); background: var(--bdg-color-background-page); }
.bdg-search__input { flex: 1; min-width: 0; border: 0; padding: 0 var(--bdg-space-3); font-size: var(--bdg-font-size-body); background: transparent; color: var(--bdg-color-text-primary); -webkit-appearance: none; appearance: none; }
.bdg-search__input::placeholder { color: var(--bdg-color-text-secondary); opacity: 1; }
.bdg-search__input::-webkit-search-cancel-button { -webkit-appearance: none; }
.bdg-search__input:focus-visible, .bdg-search__input.is-focus { outline: var(--bdg-border-width-control-focus) solid var(--bdg-control-focus-color); outline-offset: -2px; }
.bdg-search__submit { width: 46px; display: inline-flex; align-items: center; justify-content: center; color: var(--bdg-interactive-color); }
.bdg-search__submit:hover, .bdg-search__submit.is-hover { color: var(--bdg-interactive-hover-color); }
.bdg-search__submit:focus-visible, .bdg-search__submit.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); }

/* Menu principal : panneau mobile, fermé par défaut */
.bdg-nav { display: none; border-top: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle); }
.bdg-header.is-open .bdg-nav { display: block; }
.bdg-nav__inner { padding-block: var(--bdg-space-4) var(--bdg-space-8); }
.bdg-nav__mobile-search { margin-bottom: var(--bdg-space-4); }
.bdg-nav__list { margin: 0; padding: 0; list-style: none; }
.bdg-nav__item { border-bottom: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle); }
.bdg-nav__link, .bdg-nav__toggle { display: flex; align-items: center; justify-content: space-between; gap: var(--bdg-space-2); width: 100%; min-height: 52px; margin: 0;
  padding: 0 var(--bdg-space-1); font-size: var(--bdg-font-size-h4); font-weight: var(--bdg-font-weight-bold); line-height: 1.3; text-align: left; color: var(--bdg-interactive-color); }
/* Rubrique courante (décision 42) : rubrique contenant la page courante, en or bronze (couleur seule, sans filet, comme la page courante),
   aria-current="true" ; placée avant le focus, qui garde le bloc inversé */
.bdg-nav__toggle[aria-current="true"] { color: var(--bdg-interactive-hover-color); }
.bdg-nav__toggle:hover, .bdg-nav__toggle.is-hover { color: var(--bdg-interactive-hover-color); }
.bdg-nav__toggle:focus-visible, .bdg-nav__toggle.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); }
.bdg-nav__toggle[aria-expanded="true"] { color: var(--bdg-interactive-hover-color); }
.bdg-nav__toggle .bdg-icon { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); transition: transform var(--bdg-motion-duration-fast) var(--bdg-motion-easing-standard); }
.bdg-nav__toggle[aria-expanded="true"] .bdg-icon { transform: rotate(180deg); }
.bdg-nav__link.is-focus, .bdg-nav__link:focus-visible { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); }
.bdg-nav__sub { display: none; margin: 0 0 var(--bdg-space-3); padding: 0 0 0 var(--bdg-space-4); list-style: none; border-left: var(--bdg-border-width-accent) solid var(--bdg-color-border-accent); }
.bdg-nav__toggle[aria-expanded="true"] + .bdg-nav__sub { display: block; }
.bdg-nav__sub a { display: block; margin: 0; padding: var(--bdg-space-2) var(--bdg-space-3); font-size: var(--bdg-font-size-body); }
.bdg-nav__mobile-cta { margin-top: var(--bdg-space-6); }
.bdg-nav__mobile-cta .bdg-btn { width: 100%; }
.bdg-nav .bdg-nav__compact-search { display: none; }

@media (min-width: 1024px) {
  .bdg-header__bar { padding-block: var(--bdg-space-4); }
  .bdg-header__logo img { width: 200px; }
  .bdg-header__tools { display: flex; }
  .bdg-header__tools .bdg-search { width: 320px; }
  .bdg-header__mobile-actions, .bdg-nav__mobile-search, .bdg-nav__mobile-cta { display: none; }
  .bdg-nav, .bdg-header.is-open .bdg-nav { display: block; }
  .bdg-nav__inner { display: flex; align-items: center; gap: var(--bdg-space-6); padding-block: 0; }
  .bdg-nav__list { flex: 1; display: flex; justify-content: space-between; }
  .bdg-nav__item { position: relative; border: 0; }
  .bdg-nav__link, .bdg-nav__toggle { display: inline-flex; width: auto; min-height: 56px; gap: var(--bdg-space-1); padding: 0 .15em; margin: 0 -.15em; font-size: 15px; white-space: nowrap; }
  .bdg-nav__toggle .bdg-icon { width: var(--bdg-icon-size-sm); height: var(--bdg-icon-size-sm); }
  .bdg-nav__sub { position: absolute; top: 100%; left: calc(-1 * var(--bdg-space-6)); z-index: 5; min-width: 280px; margin: 0; padding: var(--bdg-space-3) 0;
    background: var(--bdg-color-background-page); box-shadow: var(--bdg-shadow-overlay); border-left: 0; border-top: var(--bdg-border-width-accent) solid var(--bdg-color-border-accent); }
  .bdg-nav__item:nth-last-child(-n+2) .bdg-nav__sub { left: auto; right: calc(-1 * var(--bdg-space-6)); }
  .bdg-nav__sub a { padding: var(--bdg-space-3) var(--bdg-space-6); font-size: var(--bdg-font-size-small); }
  /* En-tête compact (proposition) : après défilement, seule la ligne des rubriques reste fixée en haut, avec un bouton de recherche */
  .bdg-header--compact { position: sticky; top: 0; border-bottom: 0; box-shadow: var(--bdg-shadow-overlay); }
  .bdg-header--compact .bdg-header__bar { display: none; }
  .bdg-header--compact .bdg-nav { border-top: 0; }
  .bdg-header--compact .bdg-nav .bdg-nav__compact-search { display: inline-flex; }
}

/* 1.3 Sous-navigation de rubrique (gabarit Page standard) : liste latérale sur ordinateur, dépliant sur mobile */
.bdg-subnav { background: var(--bdg-color-background-alt); }
.bdg-subnav__summary { display: flex; align-items: center; justify-content: space-between; gap: var(--bdg-space-3); min-height: 52px; padding: 0 var(--bdg-space-4);
  font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); cursor: pointer; list-style: none; color: var(--bdg-interactive-color); }
.bdg-subnav__summary::-webkit-details-marker { display: none; }
.bdg-subnav__summary:hover, .bdg-subnav__summary.is-hover { color: var(--bdg-interactive-hover-color); }
.bdg-subnav__summary:focus-visible, .bdg-subnav__summary.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); }
.bdg-subnav__summary .bdg-icon { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); transition: transform var(--bdg-motion-duration-fast) var(--bdg-motion-easing-standard); }
.bdg-subnav[open] .bdg-subnav__summary .bdg-icon { transform: rotate(180deg); }
.bdg-subnav__title { display: none; }
.bdg-subnav__list { margin: 0; padding: 0 0 var(--bdg-space-3); list-style: none; }
.bdg-subnav__link { display: block; margin: 0; padding: var(--bdg-space-3) var(--bdg-space-4) var(--bdg-space-3) calc(var(--bdg-space-4) - var(--bdg-border-width-accent));
  border-left: var(--bdg-border-width-accent) solid transparent; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }
/* Page courante : filet or de 3 px comme marqueur (exception admise, design system v1.6), gras, or bronze et aria-current */
.bdg-subnav__link[aria-current="page"] { font-weight: var(--bdg-font-weight-bold); border-left-color: var(--bdg-color-border-accent); }
@media (min-width: 1024px) {
  .bdg-subnav { padding: var(--bdg-space-6) 0; }
  .bdg-subnav__summary { display: none; }
  .bdg-subnav__title { display: block; }
  .bdg-subnav__link { padding-inline: calc(var(--bdg-space-6) - var(--bdg-border-width-accent)) var(--bdg-space-6); }
  .bdg-subnav__list { padding: 0; }
}

/* 1.4 Fil d'Ariane : complet sur ordinateur ; sur mobile, seul le lien vers la page parente */
.bdg-breadcrumb { font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }
.bdg-breadcrumb__list { display: none; margin: 0; padding: 0; list-style: none; }
.bdg-breadcrumb__item { display: inline-flex; align-items: center; gap: var(--bdg-space-2); }
.bdg-breadcrumb__item + .bdg-breadcrumb__item::before { content: ""; width: 12px; height: 12px; flex: none;
  border-top: 1.5px solid var(--bdg-color-gray-500); border-right: 1.5px solid var(--bdg-color-gray-500); transform: rotate(45deg) scale(.7); margin-right: var(--bdg-space-1); }
.bdg-breadcrumb__current { color: var(--bdg-color-text-secondary); }
.bdg-breadcrumb__back { display: inline-flex; align-items: center; gap: var(--bdg-space-2); min-height: 44px; font-weight: var(--bdg-font-weight-bold); }
@media (min-width: 768px) {
  .bdg-breadcrumb__list { display: flex; flex-wrap: wrap; gap: var(--bdg-space-2) var(--bdg-space-2); }
  .bdg-breadcrumb__back { display: none; }
}

/* 1.5 Pied de page (surface .bdg-footer de tokens.css) */
.bdg-footer__inner { padding-block: var(--bdg-space-16) var(--bdg-space-8); }
.bdg-footer__grid { display: grid; gap: var(--bdg-space-10); grid-template-columns: 1fr; }
@media (min-width: 768px) { .bdg-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .bdg-footer__grid { grid-template-columns: 1.3fr 1fr 1fr 1fr; } }
.bdg-footer__logo img { width: 200px; }
.bdg-footer__intro { margin-top: var(--bdg-space-6); max-width: 34ch; }
.bdg-footer__heading { margin: 0 0 var(--bdg-space-5); font-size: var(--bdg-font-size-overline); line-height: var(--bdg-font-line-height-overline); font-weight: var(--bdg-font-weight-bold);
  text-transform: uppercase; letter-spacing: var(--bdg-font-letter-spacing-overline); color: var(--bdg-color-text-heading-on-dark); }
.bdg-footer__list { display: grid; gap: var(--bdg-space-3); margin: 0; padding: 0; list-style: none; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }
.bdg-footer__list li { display: flex; gap: var(--bdg-space-3); align-items: flex-start; }
.bdg-footer__list .bdg-icon { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); color: var(--bdg-color-icon-accent-secondary-on-dark); margin-top: 1px; }
.bdg-footer__bottom { margin-top: var(--bdg-space-12); padding-top: var(--bdg-space-5); border-top: var(--bdg-border-width-hairline) solid var(--bdg-color-border-accent-secondary-on-dark);
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--bdg-space-2) var(--bdg-space-6); font-size: var(--bdg-font-size-small); }
.bdg-footer__identity { color: var(--bdg-color-text-accent-secondary-on-dark); font-weight: var(--bdg-font-weight-bold); }

/* 1.6 Bandeau cookies (surface .bdg-cookie-banner de tokens.css) : fixé en bas de l'écran, filet or en tête */
.bdg-cookie-banner { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; box-shadow: var(--bdg-shadow-overlay);
  border-top: var(--bdg-border-width-accent) solid var(--bdg-color-border-accent-on-dark); }
.bdg-cookie-banner__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--bdg-space-4) var(--bdg-space-8);
  padding-block: var(--bdg-space-5); font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }
.bdg-cookie-banner__text { margin: 0; max-width: 80ch; }
.bdg-cookie-banner[hidden] { display: none; }
@media (max-width: 767px) { .bdg-cookie-banner__inner .bdg-btn { width: 100%; } }

/* ==========================================================================
   2. Boutons
   ========================================================================== */
/* Variables de bouton selon la surface : noir sur fond clair, or sur fond sombre */
.bdg-btn {
  --bdg-btn-bg: var(--bdg-color-black);
  --bdg-btn-fg: var(--bdg-color-white);
  --bdg-btn-hover-bg: var(--bdg-color-gold-800);
  --bdg-btn-hover-fg: var(--bdg-color-white);
  --bdg-btn-line: var(--bdg-color-black);
  --bdg-btn-line-hover: var(--bdg-color-gold-800);
  display: inline-flex; align-items: center; justify-content: center; gap: var(--bdg-space-2);
  min-height: 48px; margin: 0; padding: var(--bdg-space-3) var(--bdg-space-6);
  font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); line-height: 1.2; text-align: center; text-decoration: none;
  border: 0; border-radius: var(--bdg-radius-none); cursor: pointer; -webkit-user-select: none; user-select: none;
  transition: color var(--bdg-motion-duration-fast) var(--bdg-motion-easing-standard), background-color var(--bdg-motion-duration-fast) var(--bdg-motion-easing-standard),
              box-shadow var(--bdg-motion-duration-fast) var(--bdg-motion-easing-standard);
}
.bdg-surface-dark .bdg-btn, .bdg-footer .bdg-btn, .bdg-cookie-banner .bdg-btn, .bdg-btn--on-dark {
  --bdg-btn-bg: var(--bdg-color-gold-500);
  --bdg-btn-fg: var(--bdg-color-black);
  --bdg-btn-hover-bg: var(--bdg-color-white);
  --bdg-btn-hover-fg: var(--bdg-color-black);
  --bdg-btn-line: var(--bdg-color-white);
  --bdg-btn-line-hover: var(--bdg-color-gold-500);
}
.bdg-btn .bdg-icon { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); }

/* Primaire : aplat. Survol, pressé et focus clavier : aplat or bronze à texte blanc (fond clair), blanc à texte noir (fond sombre) */
.bdg-btn--primary { background: var(--bdg-btn-bg); color: var(--bdg-btn-fg); }
.bdg-btn--primary:hover, .bdg-btn--primary.is-hover,
.bdg-btn--primary:active, .bdg-btn--primary.is-active,
.bdg-btn--primary:focus-visible, .bdg-btn--primary.is-focus { background: var(--bdg-btn-hover-bg); color: var(--bdg-btn-hover-fg); outline: none; }

/* Secondaire : contour de 1 px (ombre intérieure, sans décalage). Survol : texte et contour en or bronze (or sur fond sombre).
   Focus clavier : bloc inversé (aplat or bronze à texte blanc ; or à texte noir sur fond sombre). */
.bdg-btn--secondary { background: transparent; color: var(--bdg-btn-line); box-shadow: inset 0 0 0 var(--bdg-border-width-hairline) var(--bdg-btn-line); }
.bdg-btn--secondary:hover, .bdg-btn--secondary.is-hover,
.bdg-btn--secondary:active, .bdg-btn--secondary.is-active { color: var(--bdg-btn-line-hover); box-shadow: inset 0 0 0 var(--bdg-border-width-hairline) var(--bdg-btn-line-hover); }
.bdg-btn--secondary:focus-visible, .bdg-btn--secondary.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); box-shadow: none; outline: none; }

/* Tailles : 40 px (listes denses, filtres), 48 px (par défaut), 56 px (appels principaux) */
.bdg-btn--sm { min-height: 40px; padding: var(--bdg-space-2) var(--bdg-space-4); }
.bdg-btn--lg { min-height: 56px; padding: var(--bdg-space-4) var(--bdg-space-8); font-size: var(--bdg-font-size-body); }
.bdg-btn--block { display: flex; width: 100%; }

/* Désactivé : non atteignable au clavier (attribut disabled) ; texte gris 400 sur gris 100 (design system §7.2 et §7.4) */
.bdg-btn:disabled, .bdg-btn[aria-disabled="true"]:not(.is-loading) {
  background: var(--bdg-color-background-disabled); color: var(--bdg-color-text-disabled); box-shadow: none; cursor: not-allowed; }
.bdg-surface-dark .bdg-btn:disabled, .bdg-btn--on-dark:disabled { background: var(--bdg-color-gray-800); color: var(--bdg-color-gray-400); }

/* Chargement : libellé « Envoi en cours », carré animé, aria-busy ; le bouton garde sa couleur et reste focalisable (aria-disabled) */
.bdg-btn.is-loading { cursor: progress; }
.bdg-btn__spinner { width: 12px; height: 12px; flex: none; border: 2px solid currentColor; animation: bdg-spin 900ms linear infinite; }
@keyframes bdg-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .bdg-btn__spinner { animation: none; } }

/* Lien fléché : lien isolé (« Toutes les actualités ») ; la flèche suit la couleur du texte */
.bdg-link-arrow { display: inline-flex; align-items: center; gap: var(--bdg-space-2); font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); line-height: 1.3; }
.bdg-link-arrow .bdg-icon { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); }
.bdg-link-arrow--back { flex-direction: row-reverse; }

/* Bouton icône : 44 × 44 px minimum, nom accessible obligatoire (aria-label) */
.bdg-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: none; margin: 0; padding: 0;
  color: var(--bdg-interactive-color); background: transparent; }
.bdg-icon-btn .bdg-icon { width: var(--bdg-icon-size-lg); height: var(--bdg-icon-size-lg); }
.bdg-icon-btn:hover, .bdg-icon-btn.is-hover, .bdg-icon-btn:active, .bdg-icon-btn.is-active { color: var(--bdg-interactive-hover-color); }
.bdg-icon-btn:focus-visible, .bdg-icon-btn.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); outline: none; }
.bdg-icon-btn:disabled { color: var(--bdg-color-text-disabled); cursor: not-allowed; }
.bdg-icon-btn--outline { box-shadow: inset 0 0 0 var(--bdg-border-width-hairline) var(--bdg-color-border-control); }
.bdg-icon-btn--outline .bdg-icon { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); }
.bdg-icon-btn--outline:hover, .bdg-icon-btn--outline.is-hover { box-shadow: inset 0 0 0 var(--bdg-border-width-hairline) var(--bdg-interactive-hover-color); }
.bdg-icon-btn--outline:focus-visible, .bdg-icon-btn--outline.is-focus { box-shadow: none; }
.bdg-icon-btn--outline:disabled { box-shadow: inset 0 0 0 var(--bdg-border-width-hairline) var(--bdg-color-border-subtle); }

/* ==========================================================================
   3. Formulaires
   ========================================================================== */
.bdg-form { display: grid; gap: var(--bdg-space-6); max-width: 720px; }
.bdg-form__row { display: grid; gap: var(--bdg-space-6); align-items: end; } /* champs alignés sur leur bas quand une aide ou une erreur n'existe que d'un côté */
@media (min-width: 768px) { .bdg-form__row { grid-template-columns: 1fr 1fr; } }
.bdg-form__intro { margin: 0; font-size: var(--bdg-font-size-small); color: var(--bdg-color-text-secondary); }
.bdg-form__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--bdg-space-4); }
.bdg-form__legal { margin: 0; font-size: var(--bdg-font-size-caption); line-height: var(--bdg-font-line-height-caption); color: var(--bdg-color-text-secondary); }
.bdg-form__honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.bdg-field { display: grid; gap: var(--bdg-space-2); min-width: 0; }
.bdg-field__label, .bdg-fieldset__legend { margin: 0; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); font-weight: var(--bdg-font-weight-bold); color: var(--bdg-color-text-primary); }
.bdg-field__req { font-weight: var(--bdg-font-weight-regular); color: var(--bdg-color-text-secondary); }
.bdg-field__hint { margin: 0; font-size: var(--bdg-font-size-caption); line-height: var(--bdg-font-line-height-caption); color: var(--bdg-color-text-secondary); }
.bdg-field__error { display: flex; gap: var(--bdg-space-2); align-items: flex-start; margin: 0; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small);
  font-weight: var(--bdg-font-weight-bold); color: var(--bdg-color-text-error); }
.bdg-field__error .bdg-icon { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); margin-top: 1px; }

/* Champs texte, e-mail, téléphone, liste, zone de texte */
.bdg-input, .bdg-select__control, .bdg-textarea {
  display: block; width: 100%; min-height: 48px; margin: 0; padding: var(--bdg-space-3);
  font-size: var(--bdg-font-size-body); line-height: 1.4; color: var(--bdg-color-text-primary);
  background: var(--bdg-color-background-page); border: var(--bdg-border-width-hairline) solid var(--bdg-color-border-control); border-radius: var(--bdg-radius-none);
  -webkit-appearance: none; appearance: none; }
.bdg-textarea { min-height: 160px; resize: vertical; }
.bdg-input::placeholder, .bdg-textarea::placeholder { color: var(--bdg-color-text-secondary); opacity: 1; }
.bdg-input:focus-visible, .bdg-select__control:focus-visible, .bdg-textarea:focus-visible,
.bdg-input.is-focus, .bdg-select__control.is-focus, .bdg-textarea.is-focus { outline: var(--bdg-border-width-control-focus) solid var(--bdg-control-focus-color); outline-offset: -1px; }
.bdg-input[aria-invalid="true"], .bdg-select__control[aria-invalid="true"], .bdg-textarea[aria-invalid="true"] { border-color: var(--bdg-color-border-error); }
.bdg-input:disabled, .bdg-select__control:disabled, .bdg-textarea:disabled, .bdg-input[readonly].bdg-input--locked {
  color: var(--bdg-color-text-disabled); background: var(--bdg-color-background-disabled); border-color: var(--bdg-color-border-subtle); cursor: not-allowed; }
.bdg-select { position: relative; }
.bdg-select__control { padding-right: var(--bdg-space-12); cursor: pointer; }
.bdg-select .bdg-icon { position: absolute; right: var(--bdg-space-3); top: 50%; width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); transform: translateY(-50%); pointer-events: none; }
.bdg-select:has(.bdg-select__control:disabled) .bdg-icon { color: var(--bdg-color-text-disabled); }

/* Groupes (fieldset) */
.bdg-fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.bdg-fieldset__legend { padding: 0; margin-bottom: var(--bdg-space-2); }
.bdg-fieldset__options { display: grid; gap: var(--bdg-space-1); margin-top: var(--bdg-space-2); }
.bdg-fieldset--inline .bdg-fieldset__options { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }

/* Case à cocher (carrée) et bouton radio (rond) de 20 px, zone cliquable étendue au libellé (hauteur minimale 44 px) */
.bdg-choice { display: flex; align-items: flex-start; gap: var(--bdg-space-3); min-height: 44px; padding-block: var(--bdg-space-2); cursor: pointer;
  font-size: var(--bdg-font-size-body); line-height: 1.45; }
.bdg-choice__input { flex: none; width: 20px; height: 20px; margin: 1px 0 0; background: var(--bdg-color-background-page) center / 16px 16px no-repeat;
  border: var(--bdg-border-width-hairline) solid var(--bdg-color-border-control); border-radius: var(--bdg-radius-none); -webkit-appearance: none; appearance: none; cursor: pointer; }
.bdg-choice__input:focus-visible, .bdg-choice__input.is-focus { outline: var(--bdg-border-width-control-focus) solid var(--bdg-control-focus-color); outline-offset: 2px; }
/* Coche : tracé de l'icône « check » de Lucide, blanc sur aplat noir */
.bdg-choice__input[type="checkbox"]:checked { background-color: var(--bdg-color-black); border-color: var(--bdg-color-black);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E"); }
/* Radio rond : exception admise aux angles droits (design system v1.6, §6) ; point plein de 10 px */
.bdg-choice__input[type="radio"] { border-radius: 50%; }
.bdg-choice__input[type="radio"]:checked { border-color: var(--bdg-color-black); box-shadow: inset 0 0 0 4px var(--bdg-color-background-page), inset 0 0 0 10px var(--bdg-color-black); }
.bdg-choice__input[aria-invalid="true"] { border-color: var(--bdg-color-border-error); }
.bdg-choice__input:disabled { background-color: var(--bdg-color-background-disabled); border-color: var(--bdg-color-border-subtle); cursor: not-allowed; }
.bdg-choice:has(.bdg-choice__input:disabled) { color: var(--bdg-color-text-disabled); cursor: not-allowed; }
.bdg-choice__input[type="checkbox"]:disabled:checked { background-color: var(--bdg-color-gray-300); border-color: var(--bdg-color-gray-300); }
.bdg-choice__input[type="radio"]:disabled:checked { box-shadow: inset 0 0 0 4px var(--bdg-color-background-disabled), inset 0 0 0 10px var(--bdg-color-gray-300); }

/* Consentement : case à cocher sur fond gris 50, texte petit, lien vers la politique de confidentialité */
.bdg-consent { padding: var(--bdg-space-4); background: var(--bdg-color-background-alt); }
.bdg-consent .bdg-choice { font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }
.bdg-consent__retention { margin: var(--bdg-space-2) 0 0 calc(20px + var(--bdg-space-3)); font-size: var(--bdg-font-size-caption); line-height: var(--bdg-font-line-height-caption); color: var(--bdg-color-text-secondary); }

/* Pièce jointe : champ natif masqué visuellement mais focalisable ; son libellé est stylé en bouton secondaire */
.bdg-file { display: grid; gap: var(--bdg-space-3); }
.bdg-file__label { margin: 0; }
.bdg-file__control { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: var(--bdg-space-2) var(--bdg-space-4); }
.bdg-file__input { position: absolute; left: 0; top: 0; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.bdg-file__button { display: inline-flex; align-items: center; gap: var(--bdg-space-2); min-height: 48px; padding: var(--bdg-space-3) var(--bdg-space-5);
  font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); line-height: 1.2; color: var(--bdg-color-black); cursor: pointer;
  box-shadow: inset 0 0 0 var(--bdg-border-width-hairline) var(--bdg-color-black); }
.bdg-file__button .bdg-icon { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); }
.bdg-file__button:hover, .bdg-file__button.is-hover { color: var(--bdg-color-gold-800); box-shadow: inset 0 0 0 var(--bdg-border-width-hairline) var(--bdg-color-gold-800); }
.bdg-file__input:focus-visible + .bdg-file__button, .bdg-file__button.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); box-shadow: none; }
.bdg-file__status { font-size: var(--bdg-font-size-small); color: var(--bdg-color-text-secondary); }
.bdg-file__item { display: flex; align-items: center; gap: var(--bdg-space-3); padding: var(--bdg-space-1) var(--bdg-space-1) var(--bdg-space-1) var(--bdg-space-4); background: var(--bdg-color-background-alt);
  font-size: var(--bdg-font-size-small); }
.bdg-file__name { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.bdg-file__size { color: var(--bdg-color-text-secondary); white-space: nowrap; }
.bdg-file--invalid .bdg-file__item { box-shadow: inset 0 0 0 1px var(--bdg-color-border-error); background: var(--bdg-color-background-error); }

/* Emplacement du captcha (Forminator, choisi au prototype) */
.bdg-captcha { display: flex; align-items: center; justify-content: center; min-height: 78px; max-width: 304px; padding: var(--bdg-space-3);
  border: var(--bdg-border-width-hairline) dashed var(--bdg-color-gray-400); font-size: var(--bdg-font-size-caption); line-height: var(--bdg-font-line-height-caption);
  color: var(--bdg-color-text-secondary); text-align: center; }

/* Messages d'état (design system §2.3) : fond clair, contour et icône de la teinte forte, préfixe textuel */
.bdg-alert { display: flex; gap: var(--bdg-space-3); align-items: flex-start; padding: var(--bdg-space-4) var(--bdg-space-5);
  font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); } /* sans contour (décision 37) : fond teinté 50, icône et titre en teinte 700 */
.bdg-alert > .bdg-icon { margin-top: -1px; }
.bdg-alert__body { flex: 1; min-width: 0; color: var(--bdg-color-text-primary); }
.bdg-alert__title { margin: 0 0 var(--bdg-space-1); font-size: var(--bdg-font-size-body); line-height: 1.4; font-weight: var(--bdg-font-weight-bold); }
.bdg-alert__body p { margin: 0; }
.bdg-alert__body p + p { margin-top: var(--bdg-space-2); }
.bdg-alert--success { color: var(--bdg-color-text-success); background: var(--bdg-color-background-success); }
.bdg-alert--error { color: var(--bdg-color-text-error); background: var(--bdg-color-background-error); }
.bdg-alert--warning { color: var(--bdg-color-text-warning); background: var(--bdg-color-background-warning); }
.bdg-alert--info { color: var(--bdg-color-text-info); background: var(--bdg-color-background-info); }
.bdg-alert--success .bdg-alert__title { color: var(--bdg-color-text-success); }
.bdg-alert--error .bdg-alert__title { color: var(--bdg-color-text-error); }
.bdg-alert--info .bdg-alert__title { color: var(--bdg-color-text-info); }
.bdg-alert--warning .bdg-alert__title { color: var(--bdg-color-text-warning); }

/* Récapitulatif des erreurs : en tête du formulaire, reçoit le focus après l'envoi */
.bdg-error-summary:focus { outline: none; }
.bdg-error-summary:focus-visible, .bdg-error-summary.is-focus { outline: var(--bdg-border-width-control-focus) solid var(--bdg-color-border-error); outline-offset: 2px; }
.bdg-error-summary__list { margin: var(--bdg-space-2) 0 0; padding: 0; list-style: none; display: grid; gap: var(--bdg-space-1); }
.bdg-error-summary__list a { font-weight: var(--bdg-font-weight-bold); }
/* Or bronze sur fond erreur 50 : 4,46:1, sous le seuil. Survol en bloc inversé (blanc sur or bronze, 5,12:1) au lieu du changement de couleur */
.bdg-error-summary__list a:hover, .bdg-error-summary__list a.is-hover { color: var(--bdg-focus-block-color); background-color: var(--bdg-focus-block-bg); }

/* Rappel de la fiche concernée (signalement prérempli) */
.bdg-form-context { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--bdg-space-1) var(--bdg-space-4); padding: var(--bdg-space-4) var(--bdg-space-5);
  background: var(--bdg-color-background-alt); font-size: var(--bdg-font-size-small); }

/* ==========================================================================
   4. Cartes de contenu (design system §6) : ombre au repos, ombre accentuée au survol et au focus, sans bordure
   ========================================================================== */
.bdg-card { position: relative; display: flex; flex-direction: column; min-width: 0; background: var(--bdg-color-background-page); box-shadow: var(--bdg-shadow-card);
  transition: box-shadow var(--bdg-motion-duration-base) var(--bdg-motion-easing-standard); }
.bdg-card:hover, .bdg-card.is-hover, .bdg-card:has(.bdg-card__link:focus-visible), .bdg-card.is-focus { box-shadow: var(--bdg-shadow-card-hover); }
.bdg-card__media { position: relative; margin: 0; aspect-ratio: var(--bdg-aspect-ratio-landscape); background: var(--bdg-color-background-disabled); overflow: hidden; }
.bdg-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bdg-card__placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: var(--bdg-font-size-small); color: var(--bdg-color-text-secondary); }
.bdg-card__body { flex: 1; display: flex; flex-direction: column; gap: var(--bdg-space-3); padding: var(--bdg-space-6); }
.bdg-card__meta { display: flex; flex-wrap: wrap; gap: var(--bdg-space-1) var(--bdg-space-3); margin: 0; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); color: var(--bdg-color-text-secondary); }
.bdg-card__category { font-weight: var(--bdg-font-weight-bold); color: var(--bdg-color-text-primary); }
.bdg-card__title { margin: 0; font-size: var(--bdg-font-size-h4); line-height: var(--bdg-font-line-height-h4); font-weight: var(--bdg-font-weight-bold); }
/* Lien étiré sur toute la carte ; débord de 0,15 em neutralisé (note de clôture du design system v1.4) */
.bdg-card__link { margin: 0; padding: 0; }
.bdg-card__link::after { content: ""; position: absolute; inset: 0; z-index: 0; }
.bdg-card:hover .bdg-card__link, .bdg-card.is-hover .bdg-card__link { color: var(--bdg-interactive-hover-color); }
.bdg-card.is-focus .bdg-card__link { color: var(--bdg-focus-block-color); background-color: var(--bdg-focus-block-bg); }
.bdg-card__excerpt { margin: 0; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); color: var(--bdg-color-text-secondary); }
.bdg-card__footer { margin-top: auto; padding-top: var(--bdg-space-2); display: flex; flex-wrap: wrap; align-items: center; gap: var(--bdg-space-3); }
/* Action secondaire posée au-dessus du lien étiré */
.bdg-card__action { position: relative; z-index: 1; }
.bdg-card__hint { display: inline-flex; align-items: center; gap: var(--bdg-space-2); font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); }
.bdg-card__hint .bdg-icon { width: var(--bdg-icon-size-sm); height: var(--bdg-icon-size-sm); }

/* Carte sans image : réservée aux résultats de recherche (décision 35) ; aucun filet décoratif */

/* Revue de presse : média et date en tête, lien externe */
.bdg-card--press .bdg-card__source { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--bdg-space-1) var(--bdg-space-3); font-size: var(--bdg-font-size-small); }
.bdg-card--press .bdg-card__source b { font-weight: var(--bdg-font-weight-bold); }
.bdg-card--press .bdg-card__link .bdg-icon { width: var(--bdg-icon-size-sm); height: var(--bdg-icon-size-sm); margin-left: var(--bdg-space-1); vertical-align: -1px; }

/* Événement : pavé de date noir, jour en or */
.bdg-card--event { flex-direction: row; }
.bdg-card__date { flex: none; width: 96px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--bdg-space-2); padding: var(--bdg-space-4) var(--bdg-space-2);
  background: var(--bdg-color-background-dark); color: var(--bdg-color-text-inverse); text-align: center; }
.bdg-card__day { font-size: 40px; line-height: 1; font-weight: var(--bdg-font-weight-bold); color: var(--bdg-color-text-accent-on-dark); }
.bdg-card__month { font-size: var(--bdg-font-size-caption); line-height: 1.2; font-weight: var(--bdg-font-weight-bold); text-transform: uppercase; letter-spacing: var(--bdg-font-letter-spacing-overline); }
@media (min-width: 768px) { .bdg-card__date { width: 112px; } .bdg-card__day { font-size: 44px; } }
.bdg-info-line { display: flex; align-items: flex-start; gap: var(--bdg-space-2); margin: 0; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }
.bdg-info-line .bdg-icon { width: var(--bdg-icon-size-sm); height: var(--bdg-icon-size-sm); margin-top: 3px; }
/* Événement annulé : date barrée (pavé et ligne de date), le badge « Annulé » portant l'information */
.bdg-card--cancelled .bdg-card__day, .bdg-card--cancelled .bdg-card__month { color: var(--bdg-color-gray-400); text-decoration: line-through; text-decoration-thickness: 2px; }
.bdg-card--cancelled .bdg-info-line--date span { text-decoration: line-through; }

/* Badges (design system v1.6, §6) : pleins, sans contour, texte en capitales ; jamais la couleur seule.
   Neutre gris 100 à texte noir (17,94:1) ; or à texte noir (9,99:1) ; noir à texte blanc (21:1) ; noir à texte or (9,99:1). */
.bdg-badge { display: inline-flex; align-items: center; gap: var(--bdg-space-1); align-self: flex-start; justify-self: start; padding: 6px 8px;
  font-size: 12px; line-height: 1; font-weight: var(--bdg-font-weight-bold); text-transform: uppercase; letter-spacing: .06em;
  color: var(--bdg-color-text-primary); background: var(--bdg-color-background-disabled); }
.bdg-badge .bdg-icon { width: 14px; height: 14px; }
.bdg-badge--gold { color: var(--bdg-color-text-on-gold); background: var(--bdg-color-background-accent); }
.bdg-badge--dark { color: var(--bdg-color-text-inverse); background: var(--bdg-color-background-dark); }
.bdg-badge--dark-gold { color: var(--bdg-color-text-accent-on-dark); background: var(--bdg-color-background-dark); }
/* Or foncé à texte noir (7,31:1) : « Conseil de l'Ordre », membres de la mandature en cours (décision 45).
   Seule exception à la règle « l'or foncé n'est jamais une couleur de fond » : jeton dédié du design system v1.10. */
.bdg-badge--gold-secondary { color: var(--bdg-color-text-on-gold); background: var(--bdg-color-background-badge-secondary); }
.bdg-badges { display: flex; flex-wrap: wrap; gap: var(--bdg-space-2); }

/* Vidéo : vignette Vimeo 16:9, indicateur de lecture carré or à icône noire */
.bdg-card--video .bdg-card__media { background: var(--bdg-color-background-dark-alt); }
.bdg-card--video .bdg-card__placeholder { color: var(--bdg-color-text-inverse-secondary); align-items: flex-end; justify-content: flex-start; padding: var(--bdg-space-3); font-size: var(--bdg-font-size-caption); }
.bdg-play { position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center;
  background: var(--bdg-color-gold-500); color: var(--bdg-color-black);
  transition: background-color var(--bdg-motion-duration-fast) var(--bdg-motion-easing-standard); }
.bdg-play .bdg-icon { width: var(--bdg-icon-size-xl); height: var(--bdg-icon-size-xl); fill: currentColor; margin-left: 3px; }
.bdg-card--video:hover .bdg-play, .bdg-card--video.is-hover .bdg-play, .bdg-card--video.is-focus .bdg-play, .bdg-card--video:has(.bdg-card__link:focus-visible) .bdg-play { background: var(--bdg-color-white); }

/* Ressource : icône de format à gauche, métadonnées en liste de définitions */
.bdg-card--resource { flex-direction: row; }
.bdg-card__format { flex: none; width: 72px; display: flex; justify-content: center; padding-top: var(--bdg-space-6); color: var(--bdg-color-icon-default); }
.bdg-card--resource .bdg-card__body { padding-left: 0; }
@media (min-width: 768px) { .bdg-card__format { width: 88px; } }
.bdg-card__facts { display: grid; grid-template-columns: auto 1fr; gap: var(--bdg-space-1) var(--bdg-space-4); margin: 0; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }
.bdg-card__facts dt { color: var(--bdg-color-text-secondary); }
.bdg-card__facts dd { margin: 0; }
.bdg-card__note { display: flex; gap: var(--bdg-space-2); align-items: flex-start; margin: 0; font-size: var(--bdg-font-size-caption); line-height: var(--bdg-font-line-height-caption); color: var(--bdg-color-text-secondary); }
.bdg-card__note .bdg-icon { width: var(--bdg-icon-size-sm); height: var(--bdg-icon-size-sm); flex: none; margin-top: 1px; }

/* Grilles de cartes */
.bdg-grid { display: grid; gap: var(--bdg-layout-gutter); grid-template-columns: 1fr; }
@media (min-width: 768px) { .bdg-grid--2, .bdg-grid--3 { grid-template-columns: repeat(2, 1fr); } .bdg-grid--4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .bdg-grid--3 { grid-template-columns: repeat(3, 1fr); } .bdg-grid--4 { grid-template-columns: repeat(4, 1fr); } }

/* ==========================================================================
   5. Portraits et fiches
   ========================================================================== */
/* 5.1 Membre du Conseil : portrait 4:5, filet or de 3 px en pied (marqueur, exception admise), sans ombre */
.bdg-member { display: flex; flex-direction: column; gap: var(--bdg-space-2); padding-bottom: var(--bdg-space-4); border-bottom: var(--bdg-border-width-accent) solid var(--bdg-color-border-accent); }
.bdg-member__photo { margin: 0 0 var(--bdg-space-2); aspect-ratio: var(--bdg-aspect-ratio-portrait); background: var(--bdg-color-background-disabled); overflow: hidden; position: relative; }
.bdg-member__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }
.bdg-member__name { margin: 0; }
.bdg-member__role { margin: 0; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); color: var(--bdg-color-text-secondary); }
.bdg-member .bdg-link-arrow { margin-top: var(--bdg-space-1); align-self: flex-start; }
.bdg-portrait-placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: var(--bdg-font-size-small); color: var(--bdg-color-text-secondary); }

/* 5.2 Anciens Bâtonniers : liste chronologique à fonds alternés (traitement « liste » du design system §6) */
.bdg-batonniers { margin: 0; padding: 0; list-style: none; }
.bdg-batonnier { display: grid; grid-template-columns: 1fr; gap: var(--bdg-space-3) var(--bdg-space-6); padding: var(--bdg-space-6) var(--bdg-space-4); background: var(--bdg-color-background-page); }
.bdg-batonniers > .bdg-batonnier:nth-child(odd) { background: var(--bdg-color-background-alt); }
.bdg-batonnier--with-portrait { grid-template-columns: 96px 1fr; }
.bdg-batonnier__photo { margin: 0; width: 96px; aspect-ratio: var(--bdg-aspect-ratio-portrait); background: var(--bdg-color-background-disabled); position: relative; overflow: hidden; }
.bdg-batonnier__photo img { width: 100%; height: 100%; object-fit: cover; }
.bdg-batonnier__period { margin: 0; font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); color: var(--bdg-color-text-secondary); }
.bdg-batonnier__name { margin: var(--bdg-space-1) 0 0; font-size: var(--bdg-font-size-h4); line-height: var(--bdg-font-line-height-h4); font-weight: var(--bdg-font-weight-bold); }
.bdg-batonnier__notice { margin: var(--bdg-space-2) 0 0; max-width: var(--bdg-layout-measure); font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }
.bdg-batonnier .bdg-link-arrow { margin-top: var(--bdg-space-3); }
@media (min-width: 768px) {
  .bdg-batonnier { grid-template-columns: 160px 1fr; padding: var(--bdg-space-8) var(--bdg-space-6); }
  .bdg-batonnier--with-portrait { grid-template-columns: 160px 120px 1fr; }
  .bdg-batonnier__photo { width: 120px; }
  .bdg-batonnier__period { font-size: var(--bdg-font-size-h4); line-height: var(--bdg-font-line-height-h4); color: var(--bdg-color-text-primary); }
}
@media (max-width: 767px) {
  .bdg-batonnier--with-portrait .bdg-batonnier__period { grid-column: 1 / -1; }
}

/* 5.3 Fiche de structure d'exercice : en-tête, membres liés, coordonnées */
.bdg-record { display: grid; gap: var(--bdg-space-8); }
.bdg-record__head { display: grid; gap: var(--bdg-space-3); }
.bdg-record__cols { display: grid; gap: var(--bdg-space-8); }
@media (min-width: 1024px) { .bdg-record__cols { grid-template-columns: 1fr 1fr; gap: var(--bdg-layout-gutter); } }
.bdg-record__section-title { margin: 0 0 var(--bdg-space-4); font-size: var(--bdg-font-size-overline); line-height: var(--bdg-font-line-height-overline); font-weight: var(--bdg-font-weight-bold);
  text-transform: uppercase; letter-spacing: var(--bdg-font-letter-spacing-overline); color: var(--bdg-color-text-secondary); }
.bdg-members { margin: 0; padding: 0; list-style: none; }
.bdg-members__item { display: flex; align-items: baseline; justify-content: space-between; gap: var(--bdg-space-4); padding: var(--bdg-space-4); background: var(--bdg-color-background-page); }
.bdg-members > .bdg-members__item:nth-child(odd) { background: var(--bdg-color-background-alt); }
.bdg-members__name { font-weight: var(--bdg-font-weight-bold); }
.bdg-members__number { flex: none; font-size: var(--bdg-font-size-small); color: var(--bdg-color-text-secondary); }
.bdg-members__item--unlisted .bdg-members__name { font-weight: var(--bdg-font-weight-regular); }
.bdg-contact-list { display: grid; gap: var(--bdg-space-3); margin: 0; padding: 0; list-style: none; font-size: var(--bdg-font-size-body); }
.bdg-contact-list li { display: flex; gap: var(--bdg-space-3); align-items: flex-start; }
.bdg-contact-list .bdg-icon { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); margin-top: 2px; }
.bdg-contact-list a { font-weight: var(--bdg-font-weight-bold); }

/* ==========================================================================
   LOT 2
   ==========================================================================
   6. Annuaire
   ========================================================================== */
/* 6.1 Onglets (annuaire, agenda) : liens, une adresse par onglet, sans script (décision 38).
   Onglet courant : aria-current, texte noir et filet or de 3 px (marqueur, exception admise, design system v1.7) */
.bdg-tabs { border-bottom: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle); }
.bdg-tabs__list { display: grid; grid-template-columns: 1fr 1fr; margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .bdg-tabs__list { display: flex; flex-wrap: wrap; } }
.bdg-tabs__tab { display: flex; align-items: center; gap: var(--bdg-space-2); height: 100%; min-height: 52px; margin: 0 0 -1px; padding: 0 var(--bdg-space-5);
  font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); line-height: 1.3; color: var(--bdg-interactive-color);
  border-bottom: var(--bdg-border-width-accent) solid transparent; }
@media (max-width: 767px) { .bdg-tabs__tab { padding: 0 var(--bdg-space-3); } }
.bdg-tabs__tab:hover, .bdg-tabs__tab.is-hover { color: var(--bdg-interactive-hover-color); }
.bdg-tabs__tab[aria-current="page"] { color: var(--bdg-color-text-primary); border-bottom-color: var(--bdg-color-border-accent); }
.bdg-tabs__tab:focus-visible, .bdg-tabs__tab.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); outline: none; }
.bdg-tabs__count { font-weight: var(--bdg-font-weight-regular); color: var(--bdg-color-text-secondary); }
.bdg-tabs__tab:focus-visible .bdg-tabs__count, .bdg-tabs__tab.is-focus .bdg-tabs__count { color: inherit; }

/* 6.2 Barre de recherche d'une liste (annuaire, documentation) */
.bdg-filterbar { display: grid; gap: var(--bdg-space-4); grid-template-columns: 1fr; align-items: end; }
@media (min-width: 768px) { .bdg-filterbar { grid-template-columns: 2fr 1fr auto; } }
/* Documentation (v5.2) : la recherche occupe sa propre ligne, les deux listes gardent la largeur de leur plus long libellé (plus de liste tronquée) */
@media (min-width: 768px) { .bdg-filterbar--4 { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr) auto; } .bdg-filterbar--4 > :first-child { grid-column: 1 / -1; } }
@media (min-width: 1024px) { .bdg-layout--single .bdg-filterbar--4 { grid-template-columns: minmax(0, 1fr) 320px 220px auto; } .bdg-layout--single .bdg-filterbar--4 > :first-child { grid-column: auto; } }
.bdg-list-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--bdg-space-2) var(--bdg-space-4); margin: var(--bdg-space-6) 0 var(--bdg-space-4);
  font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); color: var(--bdg-color-text-secondary); }
.bdg-list-meta b { color: var(--bdg-color-text-primary); }
/* Filtres actifs : puces retirables (bouton, nom accessible « Retirer le filtre … ») */
.bdg-active-filters { display: flex; flex-wrap: wrap; align-items: center; gap: var(--bdg-space-2); margin: 0; padding: 0; list-style: none; }
.bdg-chip { display: inline-flex; align-items: center; gap: var(--bdg-space-1); min-height: 32px; padding: 0 var(--bdg-space-1) 0 var(--bdg-space-3);
  font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); color: var(--bdg-color-text-primary); background: var(--bdg-color-background-disabled); }
.bdg-chip__remove { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; color: var(--bdg-interactive-color); }
.bdg-chip__remove .bdg-icon { width: var(--bdg-icon-size-sm); height: var(--bdg-icon-size-sm); }
.bdg-chip__remove:hover, .bdg-chip__remove.is-hover { color: var(--bdg-color-gold-800); }
.bdg-chip__remove:focus-visible, .bdg-chip__remove.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); }

/* 6.3 Ligne d'avocat : liste à fonds alternés (design system §6), nom en lien étiré, téléphone et e-mail au-dessus du lien */
.bdg-lawyers { margin: 0; padding: 0; list-style: none; }
.bdg-lawyer { position: relative; display: grid; grid-template-columns: 76px 1fr; gap: var(--bdg-space-2) var(--bdg-space-4); padding: var(--bdg-space-5) var(--bdg-space-4); background: var(--bdg-color-background-page); }
.bdg-lawyers > .bdg-lawyer:nth-child(odd) { background: var(--bdg-color-background-alt); }
@media (min-width: 1024px) { .bdg-lawyer { grid-template-columns: 88px minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1.4fr); align-items: start; padding: var(--bdg-space-5) var(--bdg-space-6); } }
.bdg-lawyer__number { margin: 0; font-size: var(--bdg-font-size-h3); line-height: 1.1; font-weight: var(--bdg-font-weight-bold); }
.bdg-lawyer__number small { display: block; margin-bottom: 2px; font-size: 11px; line-height: 1.2; font-weight: var(--bdg-font-weight-bold); text-transform: uppercase; letter-spacing: .06em; color: var(--bdg-color-text-secondary); }
.bdg-lawyer__name { margin: 0; font-size: var(--bdg-font-size-h4); line-height: var(--bdg-font-line-height-h4); font-weight: var(--bdg-font-weight-bold); }
.bdg-lawyer__name a { margin: 0; padding: 0; }
.bdg-lawyer__name a::after { content: ""; position: absolute; inset: 0; }
.bdg-lawyer:hover .bdg-lawyer__name a, .bdg-lawyer.is-hover .bdg-lawyer__name a { color: var(--bdg-interactive-hover-color); }
.bdg-lawyer.is-focus .bdg-lawyer__name a { color: var(--bdg-focus-block-color); background-color: var(--bdg-focus-block-bg); }
.bdg-lawyer__status { margin: var(--bdg-space-1) 0 0; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); color: var(--bdg-color-text-secondary); }
.bdg-lawyer .bdg-badges { margin-top: var(--bdg-space-2); }
.bdg-lawyer__col { grid-column: 2; display: grid; gap: var(--bdg-space-1); font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); min-width: 0; }
@media (min-width: 1024px) { .bdg-lawyer__col { grid-column: auto; } }
.bdg-lawyer__col a { position: relative; z-index: 1; overflow-wrap: anywhere; }
.bdg-lawyer__col .bdg-info-line .bdg-icon { margin-top: 2px; }

/* 6.3 bis Photo de l'avocat (UI Kit v5, décision 43) : format 4:5, vignette 64 × 80 (liste), portrait 160 × 200 (fiche).
   Sans photo : même emplacement, fond gris 100, initiales noires (aria-hidden). Photos de transition servies à leur taille d'affichage. */
.bdg-avatar { position: relative; display: block; flex: none; width: 64px; height: 80px; margin: 0; overflow: hidden; background: var(--bdg-color-gray-100); }
.bdg-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bdg-avatar__initials { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-size: 22px; line-height: 1; font-weight: var(--bdg-font-weight-bold); letter-spacing: .04em; color: var(--bdg-color-text-primary); }
.bdg-avatar--portrait { width: 160px; height: 200px; }
.bdg-avatar--portrait .bdg-avatar__initials { font-size: 52px; }
/* Ligne avec photo. Mobile : vignette à gauche, numéro sur une ligne au-dessus du nom. Ordinateur : numéro, vignette, nom, colonnes. */
.bdg-lawyer--photo { grid-template-columns: 64px 1fr; }
.bdg-lawyer--photo > .bdg-avatar { grid-column: 1; grid-row: 1 / span 4; }
.bdg-lawyer--photo > :not(.bdg-avatar) { grid-column: 2; }
.bdg-lawyer--photo .bdg-lawyer__number { font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }
.bdg-lawyer--photo .bdg-lawyer__number small { display: inline; margin: 0 var(--bdg-space-2) 0 0; }
@media (min-width: 1024px) {
  .bdg-lawyer--photo { grid-template-columns: 88px 64px minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1.4fr); }
  .bdg-lawyer--photo > .bdg-avatar, .bdg-lawyer--photo > :not(.bdg-avatar) { grid-column: auto; grid-row: auto; }
  .bdg-lawyer--photo .bdg-lawyer__number { font-size: var(--bdg-font-size-h3); line-height: 1.1; }
  .bdg-lawyer--photo .bdg-lawyer__number small { display: block; margin: 0 0 2px; }
}

/* 6.4 Ligne de structure d'exercice : même traitement que la ligne d'avocat */
.bdg-lawyer--structure { grid-template-columns: 1fr; }
@media (min-width: 1024px) { .bdg-lawyer--structure { grid-template-columns: minmax(0, 2.4fr) minmax(0, 2fr) minmax(0, 1.4fr); } }
.bdg-lawyer--structure .bdg-lawyer__col { grid-column: auto; }

/* 6.5 État vide d'une liste */
.bdg-empty { display: grid; gap: var(--bdg-space-3); padding: var(--bdg-space-8) var(--bdg-space-6); background: var(--bdg-color-background-alt); }
.bdg-empty__title { margin: 0; font-size: var(--bdg-font-size-h4); line-height: var(--bdg-font-line-height-h4); font-weight: var(--bdg-font-weight-bold); }
.bdg-empty ul { margin: 0; padding-left: var(--bdg-space-5); font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }
.bdg-empty .bdg-link-arrow { margin-top: var(--bdg-space-2); }

/* 6.6 Fiche d'avocat */
.bdg-profile { display: grid; gap: var(--bdg-space-8); }
.bdg-profile__head { display: grid; gap: var(--bdg-space-3); grid-template-columns: 1fr; align-items: start; }
@media (min-width: 768px) { .bdg-profile__head { grid-template-columns: 1fr auto; column-gap: var(--bdg-space-8); } }
.bdg-profile__number { display: grid; justify-items: start; gap: 2px; padding: var(--bdg-space-4) var(--bdg-space-5); background: var(--bdg-color-background-dark); color: var(--bdg-color-text-inverse); }
@media (min-width: 768px) { .bdg-profile__number { justify-items: center; grid-row: 1 / span 3; grid-column: 2; min-width: 136px; } }
.bdg-profile__number small { font-size: 11px; line-height: 1.2; font-weight: var(--bdg-font-weight-bold); text-transform: uppercase; letter-spacing: .06em; color: var(--bdg-color-text-inverse-secondary); }
.bdg-profile__number b { font-size: 44px; line-height: 1; color: var(--bdg-color-text-accent-on-dark); }
.bdg-profile__status { margin: 0; font-size: var(--bdg-font-size-lead); line-height: var(--bdg-font-line-height-lead); color: var(--bdg-color-text-secondary); }
.bdg-profile__cols { display: grid; gap: var(--bdg-space-8); }
@media (min-width: 1024px) { .bdg-profile__cols { grid-template-columns: 1fr 1fr; gap: var(--bdg-layout-gutter); } }
.bdg-facts { display: grid; grid-template-columns: minmax(0, 11em) 1fr; gap: 0; margin: 0; font-size: var(--bdg-font-size-body); }
.bdg-facts dt, .bdg-facts dd { margin: 0; padding: var(--bdg-space-3) 0; border-bottom: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle); }
.bdg-facts dt { padding-right: var(--bdg-space-4); font-size: var(--bdg-font-size-small); line-height: 1.6; color: var(--bdg-color-text-secondary); }
@media (max-width: 767px) { .bdg-facts { grid-template-columns: 1fr; } .bdg-facts dt { border-bottom: 0; padding-bottom: 0; } .bdg-facts dd { padding-top: var(--bdg-space-1); } }
/* Fiche avec portrait (UI Kit v5) : portrait à gauche du nom à partir de 768 px, au-dessus sur mobile */
@media (min-width: 768px) {
  .bdg-profile__head--photo { grid-template-columns: 160px 1fr auto; align-content: start; }
  .bdg-profile__head--photo > .bdg-avatar { grid-column: 1; grid-row: 1 / span 4; }
  .bdg-profile__head--photo > :not(.bdg-avatar):not(.bdg-profile__number) { grid-column: 2; }
  .bdg-profile__head--photo .bdg-profile__number { grid-column: 3; }
}
.bdg-profile__main { display: grid; gap: var(--bdg-space-8); align-content: start; }
/* Fonctions au sein de l'Ordre : générées depuis les fiches « Membre du Conseil » et « Ancien Bâtonnier », de la plus récente à la plus ancienne */
.bdg-functions { margin: 0; padding: 0; list-style: none; font-size: var(--bdg-font-size-body); }
.bdg-functions li { padding: var(--bdg-space-3) 0; border-bottom: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle); }
.bdg-profile__report { display: flex; flex-wrap: wrap; align-items: center; gap: var(--bdg-space-3) var(--bdg-space-6); padding-top: var(--bdg-space-6); border-top: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle);
  font-size: var(--bdg-font-size-small); color: var(--bdg-color-text-secondary); }

/* 6.7 Chiffres de l'annuaire (accueil) : nombres calculés, jamais saisis */
.bdg-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--bdg-space-2); margin: 0; padding: 0; list-style: none; }
@media (min-width: 1024px) { .bdg-stats { grid-template-columns: repeat(4, 1fr); gap: var(--bdg-layout-gutter); } }
.bdg-stat { display: grid; gap: var(--bdg-space-2); padding: var(--bdg-space-6); background: var(--bdg-color-background-dark); color: var(--bdg-color-text-inverse); }
.bdg-stat__value { font-size: clamp(2.5rem, 2rem + 2vw, 3.5rem); line-height: 1; font-weight: var(--bdg-font-weight-bold); color: var(--bdg-color-text-accent-on-dark); }
.bdg-stat__label { font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }

/* ==========================================================================
   7. Navigation et filtres
   ========================================================================== */
/* 7.1 Pagination : 12 éléments par page (spécifications §9) ; cibles de 44 × 44 px */
.bdg-pagination { display: flex; justify-content: center; }
.bdg-pagination__list { display: flex; flex-wrap: wrap; align-items: center; gap: var(--bdg-space-1); margin: 0; padding: 0; list-style: none; }
.bdg-pagination__link { display: inline-flex; align-items: center; justify-content: center; gap: var(--bdg-space-2); min-width: 44px; height: 44px; margin: 0; padding: 0 var(--bdg-space-3);
  font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); }
.bdg-pagination__link .bdg-icon { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); }
.bdg-pagination__link[aria-current="page"] { color: var(--bdg-color-text-inverse); background: var(--bdg-color-background-dark); }
.bdg-pagination__link.is-disabled { color: var(--bdg-color-text-disabled); pointer-events: none; }
.bdg-pagination__gap { min-width: 24px; text-align: center; color: var(--bdg-color-text-secondary); }
.bdg-pagination__status { display: none; font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); padding: 0 var(--bdg-space-3); }
@media (max-width: 767px) {
  .bdg-pagination__item--page { display: none; }
  .bdg-pagination__status { display: inline-flex; align-items: center; height: 44px; }
  .bdg-pagination__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* 7.2 Filtre par catégorie : boutons à bascule (aria-pressed), une seule catégorie active */
.bdg-filter-buttons { display: flex; flex-wrap: wrap; gap: var(--bdg-space-2); margin: 0; padding: 0; list-style: none; }
.bdg-filter-button { display: inline-flex; text-decoration: none; align-items: center; min-height: 44px; padding: 0 var(--bdg-space-4); font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold);
  color: var(--bdg-color-text-primary); background: var(--bdg-color-background-alt); }
.bdg-filter-button:hover, .bdg-filter-button.is-hover { color: var(--bdg-interactive-hover-color); }
.bdg-filter-button[aria-pressed="true"], .bdg-filter-button[aria-current="page"] { color: var(--bdg-color-text-inverse); background: var(--bdg-color-background-dark); }
.bdg-filter-button:focus-visible, .bdg-filter-button.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); outline: none; }

/* 7.3 Tuiles de navigation (accès rapides, types documentaires) : fond gris 50 plein, bloc inversé au survol et au focus (design system §6) */
.bdg-tiles { display: grid; grid-template-columns: 1fr; gap: var(--bdg-space-2); margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .bdg-tiles { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .bdg-tiles { grid-template-columns: repeat(4, 1fr); gap: var(--bdg-layout-gutter); } .bdg-tiles--3 { grid-template-columns: repeat(3, 1fr); } }
.bdg-tile { display: flex; flex-direction: column; gap: var(--bdg-space-4); height: 100%; margin: 0; padding: var(--bdg-space-8) var(--bdg-space-6); background: var(--bdg-color-background-alt); }
.bdg-tile:hover, .bdg-tile.is-hover, .bdg-tile:focus-visible, .bdg-tile.is-focus { color: var(--bdg-focus-block-color); background-color: var(--bdg-focus-block-bg); }
.bdg-tile__title { display: flex; align-items: center; justify-content: space-between; gap: var(--bdg-space-2); font-size: var(--bdg-font-size-h4); line-height: var(--bdg-font-line-height-h4); font-weight: var(--bdg-font-weight-bold); }
.bdg-tile__title .bdg-icon { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); }
.bdg-tile__desc { font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); color: var(--bdg-color-text-secondary); }
.bdg-tile:hover .bdg-tile__desc, .bdg-tile.is-hover .bdg-tile__desc, .bdg-tile:focus-visible .bdg-tile__desc, .bdg-tile.is-focus .bdg-tile__desc { color: inherit; }
.bdg-tile--compact { padding: var(--bdg-space-5) var(--bdg-space-6); }
/* Tuiles empilées (v5.2, page de rubrique « Contact & FAQ ») : une tuile par ligne, icône à gauche */
.bdg-tiles--stack { grid-template-columns: 1fr; gap: var(--bdg-space-4); }
.bdg-tiles--stack .bdg-tile { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--bdg-space-6); row-gap: var(--bdg-space-1); align-items: center; }
.bdg-tiles--stack .bdg-tile > .bdg-icon { grid-row: 1 / span 2; }

/* 7.4 Résultats de recherche : groupés par type (spécifications §8) */
.bdg-results { display: grid; gap: var(--bdg-space-12); }
.bdg-results__group { display: grid; gap: var(--bdg-space-4); }
.bdg-results__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--bdg-space-2) var(--bdg-space-4);
  padding-bottom: var(--bdg-space-3); border-bottom: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle); }
.bdg-results__count { font-weight: var(--bdg-font-weight-regular); color: var(--bdg-color-text-secondary); }
.bdg-results__list { display: grid; gap: var(--bdg-space-4); margin: 0; padding: 0; list-style: none; }
mark, .bdg-mark { color: var(--bdg-color-text-on-gold); background: var(--bdg-color-background-accent); padding: 0 .1em; }

/* 7.5 Plan du site : arborescence en listes imbriquées */
.bdg-sitemap { display: grid; gap: var(--bdg-space-8); margin: 0; padding: 0; list-style: none; }
@media (min-width: 1024px) { .bdg-sitemap { grid-template-columns: repeat(3, 1fr); gap: var(--bdg-space-10) var(--bdg-layout-gutter); } }
.bdg-sitemap > li > a { font-size: var(--bdg-font-size-h4); line-height: var(--bdg-font-line-height-h4); font-weight: var(--bdg-font-weight-bold); }
.bdg-sitemap > li > span { font-size: var(--bdg-font-size-h4); line-height: var(--bdg-font-line-height-h4); font-weight: var(--bdg-font-weight-bold); }
.bdg-sitemap ul { display: grid; gap: var(--bdg-space-2); margin: var(--bdg-space-3) 0 0; padding: 0; list-style: none; font-size: var(--bdg-font-size-small); }

/* ==========================================================================
   8. Contenus éditoriaux
   ========================================================================== */
/* 8.1 En-tête de page : titre, chapô, image 21:9 facultative */
.bdg-page-head { display: grid; gap: var(--bdg-space-5); padding-block: var(--bdg-space-8) var(--bdg-space-10); }
.bdg-page-head .bdg-lead { max-width: 60ch; color: var(--bdg-color-text-secondary); }
.bdg-page-head__image { margin: 0; aspect-ratio: var(--bdg-aspect-ratio-banner); background: var(--bdg-color-background-disabled); overflow: hidden; }
.bdg-page-head__image img { width: 100%; height: 100%; object-fit: cover; }

/* 8.2 Bandeau d'accueil (variante B retenue) */
.bdg-hero { display: grid; grid-template-columns: 1fr; }
.bdg-hero__text { padding: var(--bdg-space-16) var(--bdg-layout-margin); }
.bdg-hero__overline { color: var(--bdg-color-text-accent-on-dark); }
.bdg-hero__title { margin-top: var(--bdg-space-4); font-size: clamp(2.25rem, 1.8rem + 2vw, 3.5rem); line-height: var(--bdg-font-line-height-h1); letter-spacing: var(--bdg-font-letter-spacing-h1); font-weight: var(--bdg-font-weight-bold); }
.bdg-hero__lead { margin-top: var(--bdg-space-6); max-width: 60ch; color: var(--bdg-color-text-inverse-secondary); }
.bdg-hero__actions { display: flex; flex-wrap: wrap; gap: var(--bdg-space-4); margin-top: var(--bdg-space-10); }
.bdg-hero__photo { position: relative; margin: 0; aspect-ratio: 4 / 3; overflow: hidden; background: var(--bdg-color-gray-800); }
.bdg-hero__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 46% 63%; }
@media (min-width: 1024px) {
  .bdg-hero { grid-template-columns: 7fr 5fr; min-height: 560px; }
  .bdg-hero__text { display: flex; flex-direction: column; justify-content: center; padding: var(--bdg-space-20) var(--bdg-space-16) var(--bdg-space-20) max(var(--bdg-layout-margin), calc((100% * 12 / 7 - var(--bdg-layout-container-max)) / 2)); }
  .bdg-hero__photo { aspect-ratio: auto; }
}

/* 8.3 Corps de texte : blocs autorisés dans l'éditeur (spécifications P-5) */
.bdg-prose { max-width: var(--bdg-layout-measure); }
.bdg-prose > * + * { margin-top: var(--bdg-space-5); }
.bdg-prose h2 { margin-top: var(--bdg-space-12); font-size: var(--bdg-font-size-h2); line-height: var(--bdg-font-line-height-h2); }
.bdg-prose h3 { margin-top: var(--bdg-space-8); font-size: var(--bdg-font-size-h3); line-height: var(--bdg-font-line-height-h3); }
.bdg-prose h2 + *, .bdg-prose h3 + * { margin-top: var(--bdg-space-3); }
.bdg-prose p, .bdg-prose ul, .bdg-prose ol { margin-bottom: 0; }
.bdg-prose ul, .bdg-prose ol { padding-left: var(--bdg-space-6); }
.bdg-prose li + li { margin-top: var(--bdg-space-2); }
.bdg-prose ul > li::marker { color: var(--bdg-color-gold-800); }
.bdg-prose ol > li::marker { font-weight: var(--bdg-font-weight-bold); }
/* Citation (décision 38) : fond gris 50 plein, sans filet ; texte en chapô, auteur en petit texte gris 600 (6,48:1 sur gris 50) */
.bdg-prose blockquote { margin-inline: 0; padding: var(--bdg-space-6); background: var(--bdg-color-background-alt);
  font-size: var(--bdg-font-size-lead); line-height: var(--bdg-font-line-height-lead); }
.bdg-prose blockquote p { margin: 0; }
.bdg-prose blockquote cite { display: block; margin-top: var(--bdg-space-3); font-size: var(--bdg-font-size-small); font-style: normal; color: var(--bdg-color-text-secondary); }
.bdg-prose figure { margin-inline: 0; }
.bdg-prose figcaption, .bdg-figure__caption { margin-top: var(--bdg-space-2); font-size: var(--bdg-font-size-caption); line-height: var(--bdg-font-line-height-caption); color: var(--bdg-color-text-secondary); }
.bdg-prose hr { height: 0; margin-block: var(--bdg-space-10); border: 0; border-top: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle); }
/* Bloc « fichier » de l'éditeur : lien de téléchargement isolé, pas un lien de phrase */
.bdg-file-block { display: flex; flex-wrap: wrap; align-items: center; gap: var(--bdg-space-3) var(--bdg-space-4); padding: var(--bdg-space-4) var(--bdg-space-5); background: var(--bdg-color-background-alt); }
.bdg-file-block__name { flex: 1 1 240px; display: flex; align-items: flex-start; gap: var(--bdg-space-3); font-weight: var(--bdg-font-weight-bold); }
.bdg-file-block__name small { display: block; font-weight: var(--bdg-font-weight-regular); color: var(--bdg-color-text-secondary); font-size: var(--bdg-font-size-small); }
.bdg-prose .bdg-file-block a.bdg-btn { color: var(--bdg-btn-line); }

/* 8.4 En-tête d'article */
.bdg-article-head { display: grid; gap: var(--bdg-space-4); max-width: 880px; }
.bdg-article-head__meta { display: flex; flex-wrap: wrap; gap: var(--bdg-space-1) var(--bdg-space-4); margin: 0; font-size: var(--bdg-font-size-small); }
.bdg-article-head__meta b { font-weight: var(--bdg-font-weight-bold); }
.bdg-article-head__meta time { color: var(--bdg-color-text-secondary); }
.bdg-article-figure { margin: var(--bdg-space-4) 0 0; }
.bdg-article-figure__img { aspect-ratio: var(--bdg-aspect-ratio-landscape); overflow: hidden; background: var(--bdg-color-background-disabled); }
.bdg-article-figure__img img { width: 100%; height: 100%; object-fit: cover; }

/* 8.5 Façade Vimeo : vignette et bouton de lecture ; le lecteur (iframe, dnt=1) n'est chargé qu'au clic */
.bdg-video { position: relative; margin: 0; aspect-ratio: var(--bdg-aspect-ratio-landscape); background: var(--bdg-color-background-dark-alt); overflow: hidden; }
.bdg-video__thumb { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bdg-video__placeholder { position: absolute; left: var(--bdg-space-4); bottom: var(--bdg-space-4); font-size: var(--bdg-font-size-caption); color: var(--bdg-color-text-inverse-secondary); }
.bdg-video__play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; width: 100%; color: var(--bdg-color-black); }
.bdg-video__play .bdg-play { position: static; transform: none; width: 80px; height: 80px; }
.bdg-video__play .bdg-play .bdg-icon { width: 40px; height: 40px; }
.bdg-video__play:hover .bdg-play, .bdg-video__play.is-hover .bdg-play { background: var(--bdg-color-white); }
.bdg-video__play:focus-visible, .bdg-video__play.is-focus { outline: none; }
/* Focus clavier : même rendu que le survol (carré blanc), comme le bouton primaire (décision 35) */
.bdg-video__play:focus-visible .bdg-play, .bdg-video__play.is-focus .bdg-play { background: var(--bdg-color-white); }
.bdg-video__player { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: var(--bdg-space-6); text-align: center; font-size: var(--bdg-font-size-small); color: var(--bdg-color-text-inverse-secondary); }
.bdg-video__player iframe { width: 100%; height: 100%; border: 0; }
.bdg-video__player--loaded { padding: 0; } /* v5.4 : lecteur chargé au lancement de la lecture, sur toute la surface */
.bdg-video__notice { margin: var(--bdg-space-2) 0 0; font-size: var(--bdg-font-size-caption); line-height: var(--bdg-font-line-height-caption); color: var(--bdg-color-text-secondary); }

/* 8.6 Boutons de partage (design system §9.2 bis) */
.bdg-share { display: flex; flex-wrap: wrap; align-items: center; gap: var(--bdg-space-3) var(--bdg-space-4); padding-top: var(--bdg-space-6); border-top: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle); }
.bdg-share__label { font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); }
.bdg-share__list { display: flex; flex-wrap: wrap; gap: var(--bdg-space-2); margin: 0; padding: 0; list-style: none; }
.bdg-share__native { display: none; }
@media (max-width: 767px) { .bdg-share__native.is-supported { display: block; } }
.bdg-share__status { font-size: var(--bdg-font-size-small); font-weight: var(--bdg-font-weight-bold); color: var(--bdg-color-text-success); display: inline-flex; align-items: center; gap: var(--bdg-space-1); }
.bdg-share__status .bdg-icon { width: var(--bdg-icon-size-sm); height: var(--bdg-icon-size-sm); }

/* 8.7 Accordéon (FAQ) : details natifs, un titre de rubrique par groupe */
.bdg-accordion { margin: 0; border-top: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle); }
.bdg-accordion__item { border-bottom: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle); }
.bdg-accordion__question { display: flex; align-items: center; justify-content: space-between; gap: var(--bdg-space-4); min-height: 56px; padding: var(--bdg-space-4) var(--bdg-space-2);
  font-size: var(--bdg-font-size-body); line-height: 1.45; font-weight: var(--bdg-font-weight-bold); cursor: pointer; list-style: none; color: var(--bdg-interactive-color); }
.bdg-accordion__question::-webkit-details-marker { display: none; }
.bdg-accordion__question .bdg-icon { width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); transition: transform var(--bdg-motion-duration-fast) var(--bdg-motion-easing-standard); }
.bdg-accordion__question:hover, .bdg-accordion__question.is-hover { color: var(--bdg-interactive-hover-color); }
.bdg-accordion__question:focus-visible, .bdg-accordion__question.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); }
.bdg-accordion__item[open] > .bdg-accordion__question .bdg-icon { transform: rotate(180deg); }
.bdg-accordion__answer { padding: 0 var(--bdg-space-2) var(--bdg-space-6); }
.bdg-faq-group + .bdg-faq-group { margin-top: var(--bdg-space-12); }
.bdg-faq-group__title { margin: 0 0 var(--bdg-space-4); }

/* 8.8 Titre de section avec lien */
.bdg-section-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--bdg-space-4); margin-bottom: var(--bdg-space-8); }

/* 8.9 Biographie du Bâtonnier : portrait et texte */
.bdg-bio { display: grid; gap: var(--bdg-space-8); }
@media (min-width: 1024px) { .bdg-bio { grid-template-columns: 360px minmax(0, 1fr); gap: var(--bdg-layout-gutter); align-items: start; } }
.bdg-bio__photo { position: relative; margin: 0; aspect-ratio: var(--bdg-aspect-ratio-portrait); background: var(--bdg-color-background-disabled); overflow: hidden; }
@media (max-width: 1023px) { .bdg-bio__photo { max-width: 280px; } }
/* Bloc du Bâtonnier en tête de la page du Conseil (v5.2, décision 50) : variante compacte, à part de la grille des membres */
.bdg-bio--lead { padding: var(--bdg-space-6); background: var(--bdg-color-background-alt); border-bottom: var(--bdg-border-width-accent) solid var(--bdg-color-border-accent); }
.bdg-bio--lead .bdg-bio__photo { max-width: 240px; }
.bdg-bio__body { display: grid; gap: var(--bdg-space-2); align-content: center; }
.bdg-bio__name, .bdg-bio__role { margin: 0; }
.bdg-bio__links { display: grid; gap: var(--bdg-space-3); margin: var(--bdg-space-4) 0 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .bdg-bio--lead { grid-template-columns: 240px minmax(0, 1fr); gap: var(--bdg-layout-gutter); align-items: stretch; padding: var(--bdg-space-8); } }

/* ==========================================================================
   9. Coordonnées
   ========================================================================== */
.bdg-contact { display: grid; gap: var(--bdg-space-6); }
.bdg-contact__list { display: grid; gap: var(--bdg-space-4); margin: 0; padding: 0; list-style: none; }
.bdg-contact__list li { display: grid; grid-template-columns: 24px 1fr; gap: var(--bdg-space-3); align-items: start; }
.bdg-contact__list .bdg-icon { margin-top: 1px; }
.bdg-contact__label { display: block; font-size: var(--bdg-font-size-caption); line-height: var(--bdg-font-line-height-caption); font-weight: var(--bdg-font-weight-bold);
  text-transform: uppercase; letter-spacing: .06em; color: var(--bdg-color-text-secondary); }
.bdg-contact__list a { font-weight: var(--bdg-font-weight-bold); }
.bdg-contact--band { display: block; padding: var(--bdg-space-10) 0; background: var(--bdg-color-background-alt); } /* bloc : le conteneur interne garde l'alignement de la grille (correction du brief 04) */
@media (min-width: 1024px) { .bdg-contact--band .bdg-contact__list { grid-template-columns: repeat(4, 1fr); gap: var(--bdg-layout-gutter); } }
.bdg-map-link__note { margin: var(--bdg-space-2) 0 0; font-size: var(--bdg-font-size-caption); line-height: var(--bdg-font-line-height-caption); color: var(--bdg-color-text-secondary); }

/* ==========================================================================
   10. Page d'erreur 404
   ========================================================================== */
.bdg-error-page { display: grid; gap: var(--bdg-space-8); padding-block: var(--bdg-space-16) var(--bdg-space-20); }
.bdg-error-page__intro { display: grid; gap: var(--bdg-space-4); max-width: 720px; }
.bdg-error-page__code { color: var(--bdg-color-gold-800); }
.bdg-error-page__search { max-width: 560px; }
.bdg-error-page__search .bdg-search { height: 56px; }
/* Ligne d'avocat compacte (résultats de recherche) : numéro et nom seulement */
.bdg-lawyer--compact, .bdg-lawyer.bdg-lawyer--compact { grid-template-columns: 88px 1fr; }

/* ==========================================================================
   11. Colonne latérale (décision 39, spécifications §5.1)
   ==========================================================================
   Grille de 12 colonnes : contenu principal sur 8 colonnes, colonne latérale sur 4, gouttière de la grille (32 px).
   À 1 440 px (conteneur de 1 280 px) : 842 px et 405 px.
   Ordre du code : module « Dans cette rubrique », contenu principal, autres modules. Sur mobile, cet ordre place la rubrique
   en haut (dépliant) et les autres modules sous le contenu ; sur ordinateur, rubrique et modules occupent la colonne de droite. */
.bdg-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--bdg-space-8); }
.bdg-layout__main { min-width: 0; }
/* Une colonne (v5.2, décision 49) : contenu sur les 12 colonnes, aucun module ; les textes gardent la mesure */
.bdg-layout.bdg-layout--single { display: block; }
.bdg-layout--single .bdg-lead { max-width: var(--bdg-layout-measure); }
.bdg-layout__aside { display: grid; gap: var(--bdg-space-10); align-content: start; min-width: 0; } /* 40 px entre modules : blocs distincts */
@media (min-width: 1024px) {
  .bdg-layout { grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: auto 1fr; column-gap: var(--bdg-layout-gutter); row-gap: var(--bdg-space-10); align-items: start; }
  .bdg-layout__main { grid-column: 1 / 9; grid-row: 1 / span 2; }
  .bdg-layout__rubric { grid-column: 9 / 13; grid-row: 1; }
  .bdg-layout__aside { grid-column: 9 / 13; grid-row: 2; }
  .bdg-layout--no-rubric .bdg-layout__aside { grid-row: 1 / span 2; }
}

/* Modules (brief 03-quater) : chaque module prend l'apparence de son rôle.
   Navigation (Dans cette rubrique, Catégories) : fond gris 50, discret. Action (Vos démarches) : fond noir, icônes or.
   Contenu (Derniers articles) : fond blanc, miniatures, sans ombre. */
.bdg-aside-module { padding: var(--bdg-space-6) 0; background: var(--bdg-color-background-alt); }
/* Titre de module : vrai titre h2, 18 à 20 px gras, suivi du filet or court (48 × 3 px) des titres de section */
.bdg-aside-module__title { margin: 0 0 var(--bdg-space-4); padding: 0 var(--bdg-space-6); font-size: var(--bdg-font-size-h4); line-height: var(--bdg-font-line-height-h4);
  font-weight: var(--bdg-font-weight-bold); color: var(--bdg-color-text-primary); }
.bdg-aside-module__title::after { content: ""; display: block; width: 48px; height: var(--bdg-border-width-accent); margin-top: var(--bdg-space-3); background: var(--bdg-color-border-accent); }
.bdg-aside-module__list { margin: 0; padding: 0; list-style: none; }

/* Action : Vos démarches, surface sombre (texte blanc 21:1, description gris 300 11,18:1, icônes et flèches or 9,99:1) */
.bdg-aside-module--action { padding: var(--bdg-space-8) 0; background: var(--bdg-color-background-dark); color: var(--bdg-color-text-inverse); }
.bdg-aside-module--action .bdg-aside-module__title { color: var(--bdg-color-text-inverse); margin-bottom: var(--bdg-space-5); }
.bdg-aside-module--action .bdg-aside-module__list { display: grid; gap: var(--bdg-space-2); }
.bdg-aside-link { display: grid; grid-template-columns: 24px minmax(0, 1fr) 20px; align-items: start; gap: var(--bdg-space-1) var(--bdg-space-4); margin: 0; padding: var(--bdg-space-4) var(--bdg-space-6); }
.bdg-aside-link__icon { grid-row: 1 / span 2; width: var(--bdg-icon-size-lg); height: var(--bdg-icon-size-lg); color: var(--bdg-color-icon-on-dark); }
.bdg-aside-link__label { font-size: var(--bdg-font-size-body); line-height: 1.4; font-weight: var(--bdg-font-weight-bold); }
.bdg-aside-link__arrow { grid-row: 1; grid-column: 3; width: var(--bdg-icon-size-md); height: var(--bdg-icon-size-md); margin-top: 2px; color: var(--bdg-color-icon-on-dark); }
.bdg-aside-link__desc { grid-column: 2 / span 2; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); color: var(--bdg-color-text-inverse-secondary); }
.bdg-aside-link:hover .bdg-aside-link__label, .bdg-aside-link.is-hover .bdg-aside-link__label { color: var(--bdg-color-text-interactive-hover-on-dark); }
.bdg-aside-link:hover, .bdg-aside-link.is-hover { color: var(--bdg-color-text-inverse); }
/* Focus clavier : démarche entière en bloc inversé, noir sur or (9,99:1) */
.bdg-aside-link:focus-visible, .bdg-aside-link.is-focus { color: var(--bdg-color-text-focus-block-on-dark); background: var(--bdg-color-background-focus-block-on-dark); }
.bdg-aside-link:focus-visible .bdg-aside-link__desc, .bdg-aside-link.is-focus .bdg-aside-link__desc,
.bdg-aside-link:focus-visible .bdg-aside-link__icon, .bdg-aside-link.is-focus .bdg-aside-link__icon,
.bdg-aside-link:focus-visible .bdg-aside-link__arrow, .bdg-aside-link.is-focus .bdg-aside-link__arrow { color: inherit; }
/* Mobile : bloc noir pleine largeur qui clôt la page (déborde des marges du conteneur) */
@media (max-width: 1023px) {
  .bdg-layout__aside .bdg-aside-module--action { margin-inline: calc(-1 * var(--bdg-layout-margin)); }
  .bdg-layout__aside .bdg-aside-module--action .bdg-aside-module__title, .bdg-layout__aside .bdg-aside-module--action .bdg-aside-link { padding-inline: var(--bdg-layout-margin); }
}

/* Navigation : Catégories, même rendu que « Dans cette rubrique » ; nombre d'articles en badge plein gris 100 à texte noir (17,94:1) */
.bdg-aside-nav__link { display: flex; align-items: center; justify-content: space-between; gap: var(--bdg-space-3); margin: 0;
  padding: var(--bdg-space-3) var(--bdg-space-6) var(--bdg-space-3) calc(var(--bdg-space-6) - var(--bdg-border-width-accent));
  border-left: var(--bdg-border-width-accent) solid transparent; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); }
.bdg-aside-nav__link[aria-current="page"] { font-weight: var(--bdg-font-weight-bold); border-left-color: var(--bdg-color-border-accent); }
.bdg-aside-nav__count { flex: none; min-width: 32px; justify-content: center; font-size: 12px; letter-spacing: 0; text-transform: none; }
.bdg-aside-nav__link:focus-visible .bdg-aside-nav__count, .bdg-aside-nav__link.is-focus .bdg-aside-nav__count { color: var(--bdg-color-text-primary); }

/* Contenu : Derniers articles, fond blanc, miniature 16:9 de 96 px à gauche, titre et date à droite ; ni ombre ni bordure */
.bdg-aside-module--content { padding: 0; background: var(--bdg-color-background-page); }
.bdg-aside-module--content .bdg-aside-module__title { padding: 0; }
.bdg-aside-module--content .bdg-aside-module__list { display: grid; gap: var(--bdg-space-5); }
.bdg-aside-post { position: relative; display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: var(--bdg-space-1) var(--bdg-space-4); align-items: start; }
.bdg-aside-post__thumb { grid-row: 1 / span 2; margin: 0; width: 96px; aspect-ratio: var(--bdg-aspect-ratio-landscape); overflow: hidden; background: var(--bdg-color-background-disabled); }
.bdg-aside-post__thumb img { width: 100%; height: 100%; object-fit: cover; }
.bdg-aside-post a { justify-self: start; margin: 0; padding: 0; font-size: var(--bdg-font-size-small); line-height: var(--bdg-font-line-height-small); font-weight: var(--bdg-font-weight-bold); }
.bdg-aside-post a::after { content: ""; position: absolute; inset: 0; }
.bdg-aside-post:hover a, .bdg-aside-post.is-hover a { color: var(--bdg-interactive-hover-color); }
.bdg-aside-post.is-focus a { color: var(--bdg-focus-block-color); background-color: var(--bdg-focus-block-bg); }
.bdg-aside-post time { font-size: var(--bdg-font-size-caption); line-height: var(--bdg-font-line-height-caption); color: var(--bdg-color-text-secondary); }

/* Liste des actualités à côté de la colonne : deux cartes par ligne */
.bdg-grid--main { display: grid; gap: var(--bdg-layout-gutter); grid-template-columns: 1fr; }
@media (min-width: 768px) { .bdg-grid--main { grid-template-columns: repeat(2, 1fr); } }
.bdg-list-stack { display: grid; gap: var(--bdg-space-6); }
@media (min-width: 1024px) { .bdg-list-stack--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--bdg-layout-gutter); } } /* une colonne (décision 49) : 2 cartes de ressource par ligne */

/* Affichage selon la largeur (ex. filtre à boutons des actualités, remplacé sur ordinateur par le module Catégories) */
@media (min-width: 1024px) { .bdg-hide-desktop { display: none !important; } }

/* Liens dans un message d'état : l'or bronze n'atteint pas 4,5:1 sur les fonds 50 (4,49:1 sur information 50, 4,46:1 sur erreur 50).
   Lien noir et gras (indice autre que la couleur), bloc inversé au survol et au focus. */
.bdg-alert .bdg-prose a, .bdg-alert__body a { color: var(--bdg-color-text-primary); font-weight: var(--bdg-font-weight-bold); }
.bdg-alert .bdg-prose a:hover, .bdg-alert .bdg-prose a.is-hover, .bdg-alert__body a:hover, .bdg-alert__body a.is-hover,
.bdg-alert .bdg-prose a:focus-visible, .bdg-alert__body a:focus-visible, .bdg-alert__body a.is-focus { color: var(--bdg-focus-block-color); background-color: var(--bdg-focus-block-bg); }

/* « À lire aussi » (décision 40) : bas de la page Actualité, après le partage ; trois cartes d'actualité (famille 4)
   sur la largeur du contenu principal ; empilées sur mobile. */
.bdg-related { margin-top: var(--bdg-space-16); }
.bdg-related__title { margin-bottom: var(--bdg-space-8); }
.bdg-related__grid { display: grid; gap: var(--bdg-layout-gutter); grid-template-columns: 1fr; }
@media (min-width: 768px) { .bdg-related__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.bdg-related .bdg-card__body { padding: var(--bdg-space-5); }

/* v5.2, revu en v5.5 et v5.6 (décisions 53 et 70) : sept rubriques sur huit sont des menus déroulants (décision 51).
   Grille des libellés du menu, pour tenir sur une ligne : 13 px de 1 024 à 1 119 px, 14 px de 1 120 à 1 399 px, 15 px au-delà. */
@media (min-width: 1024px) and (max-width: 1399px) {
  .bdg-nav__link, .bdg-nav__toggle { font-size: 14px; }
}
@media (min-width: 1024px) and (max-width: 1119px) {
  .bdg-nav__link, .bdg-nav__toggle { font-size: 13px; }
}
@media (min-width: 1024px) and (max-width: 1199px) {
  .bdg-nav__link, .bdg-nav__toggle { gap: 2px; letter-spacing: -0.01em; }
  .bdg-nav__toggle .bdg-icon { width: 12px; height: 12px; }
}

/* ==========================================================================
   17. Page (v5.3, décision 60) : sur une page courte, le pied de page reste collé au bas de l'écran.
   Classe posée sur l'élément body ; le contenu principal (main) occupe la hauteur disponible.
   ========================================================================== */
.bdg-site { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
.bdg-site > main { flex: 1 0 auto; }
.bdg-site > .bdg-footer { flex-shrink: 0; }

/* ==========================================================================
   18. Menu principal en relief (v5.5, décision 70)
   Le bandeau supérieur (logo, recherche, bouton) reste sur fond blanc. La barre du menu passe sur fond sombre :
   filet or sous l'en-tête, rubriques en cellules, panneau mobile noir. Ces règles complètent celles du §1
   (en-tête et menu) sans changer le balisage ni le script.
   Exceptions limitées à cette barre : focus clavier en contour intérieur (au lieu du bloc inversé de la
   décision 32, qui se confondrait avec la rubrique courante) ; rubrique courante en cellule or à texte noir
   (au lieu de l'or bronze de la décision 42).
   ========================================================================== */

/* Filet or sous l'en-tête, à toutes les largeurs : il remplace le filet gris */
.bdg-header { border-bottom: var(--bdg-border-width-accent) solid var(--bdg-color-border-accent-on-dark); }

/* Couleurs de contexte des surfaces sombres (texte blanc, survol or) pour la barre et le panneau mobile */
.bdg-nav {
  --bdg-interactive-color: var(--bdg-color-text-interactive-on-dark);
  --bdg-interactive-hover-color: var(--bdg-color-text-interactive-hover-on-dark);
  --bdg-focus-block-color: var(--bdg-color-text-focus-block-on-dark);
  --bdg-focus-block-bg: var(--bdg-color-background-focus-block-on-dark);
  --bdg-control-focus-color: var(--bdg-color-border-control-focus-on-dark);
  background: var(--bdg-color-background-dark);
  color: var(--bdg-color-text-inverse);
  border-top: 0;
}
.bdg-nav .bdg-nav__toggle .bdg-icon { color: inherit; } /* le chevron a toujours la couleur de son libellé */

/* --- Menu mobile (moins de 1 024 px) : panneau noir, focus en bloc inversé or (règle générale des fonds sombres) --- */
@media (max-width: 1023.98px) {
  .bdg-nav .bdg-nav__item { border-bottom-color: var(--bdg-color-border-on-dark); }
  .bdg-nav .bdg-nav__link { color: var(--bdg-interactive-color); background: transparent; }
  .bdg-nav .bdg-nav__link:hover, .bdg-nav .bdg-nav__link.is-hover { color: var(--bdg-interactive-hover-color); background: transparent; }
  .bdg-nav .bdg-nav__link:focus-visible, .bdg-nav .bdg-nav__link.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); outline: none; }
  /* Rubrique courante : libellé or et filet or à gauche (pas la couleur seule) */
  .bdg-nav .bdg-nav__link[aria-current="page"], .bdg-nav .bdg-nav__toggle[aria-current="true"] {
    color: var(--bdg-interactive-hover-color); padding-left: var(--bdg-space-4);
    box-shadow: inset var(--bdg-border-width-accent) 0 0 var(--bdg-color-border-accent-on-dark); }
  .bdg-nav .bdg-nav__link[aria-current="page"]:focus-visible, .bdg-nav .bdg-nav__toggle[aria-current="true"]:focus-visible { color: var(--bdg-focus-block-color); box-shadow: none; }
  .bdg-nav .bdg-nav__sub a { color: var(--bdg-color-text-inverse); background: transparent; text-decoration: none; }
  .bdg-nav .bdg-nav__sub a:hover, .bdg-nav .bdg-nav__sub a.is-hover { color: var(--bdg-interactive-hover-color); background: transparent; }
  .bdg-nav .bdg-nav__sub a:focus-visible, .bdg-nav .bdg-nav__sub a.is-focus { color: var(--bdg-focus-block-color); background: var(--bdg-focus-block-bg); outline: none; }
  .bdg-nav .bdg-nav__sub a[aria-current="page"] { color: var(--bdg-interactive-hover-color); font-weight: var(--bdg-font-weight-bold); }
  .bdg-nav .bdg-nav__sub a[aria-current="page"]:focus-visible { color: var(--bdg-focus-block-color); }
  /* Bouton « Trouver un avocat » du panneau : variante des fonds sombres (aplat or, texte noir) */
  .bdg-nav .bdg-nav__mobile-cta .bdg-btn {
    --bdg-btn-bg: var(--bdg-color-gold-500); --bdg-btn-fg: var(--bdg-color-black);
    --bdg-btn-hover-bg: var(--bdg-color-white); --bdg-btn-hover-fg: var(--bdg-color-black); }
  .bdg-nav .bdg-nav__mobile-search .bdg-search { border-color: var(--bdg-color-white); }
}

/* --- Barre en cellules (à partir de 1 024 px) --- */
@media (min-width: 1024px) {
  /* Dégradé de l'anthracite vers le noir, liseré clair de 1 px en haut. Ni reflet, ni ombre sur le texte. */
  .bdg-nav {
    --bdg-nav-cell-padding: 2px; /* marge de départ ; la largeur restante se répartit entre les cellules */
    --bdg-nav-cell-gap: 2px; /* écart entre le libellé et son chevron */
    --bdg-nav-chevron: 12px; /* largeur de départ du chevron */
    background: linear-gradient(to bottom, var(--bdg-color-background-nav-start), var(--bdg-color-background-nav-end));
    box-shadow: inset 0 var(--bdg-border-width-hairline) 0 var(--bdg-color-border-nav-highlight);
  }
  .bdg-nav .bdg-nav__inner { gap: 0; }
  /* La série de cellules occupe toute la largeur du conteneur, d'un séparateur à l'autre */
  .bdg-nav .bdg-nav__list { flex: 1; justify-content: flex-start; border-right: var(--bdg-border-width-hairline) solid var(--bdg-color-border-nav-separator); }
  .bdg-nav .bdg-nav__item { flex: 1 1 auto; border-left: var(--bdg-border-width-hairline) solid var(--bdg-color-border-nav-separator); }
  /* La zone cliquable est la cellule entière */
  /* v5.7 (brief 18 bis) : la marge intérieure n'est plus un padding fixe mais deux cales souples, de part et d'autre
     du libellé. Tant que la barre tient, le rendu est le même ; si la police de repli est plus large qu'Arial ou
     Helvetica, les cales se resserrent jusqu'à zéro avant tout débordement. L'écart entre libellé et chevron
     passe sur le chevron (marge), pour ne pas s'ajouter autour des cales. */
  .bdg-nav .bdg-nav__link, .bdg-nav .bdg-nav__toggle {
    display: flex; justify-content: center; width: 100%; min-height: 56px; margin: 0; padding: 0; gap: 0;
    color: var(--bdg-color-text-inverse); background: transparent; }
  .bdg-nav .bdg-nav__link::before, .bdg-nav .bdg-nav__link::after,
  .bdg-nav .bdg-nav__toggle::before, .bdg-nav .bdg-nav__toggle::after {
    content: ""; flex: 0 100000 var(--bdg-nav-cell-padding); min-width: 0; }
  /* Si les marges à zéro ne suffisent pas, les chevrons rétrécissent à leur tour, jusqu'à disparaître (ils sont
     décoratifs : l'état du sous-menu est porté par aria-expanded). Le facteur de rétrécissement des cales, très
     supérieur, garantit l'ordre : les marges d'abord, les chevrons ensuite. Le corps du texte ne change jamais.
     La largeur maximale en pourcentage rend le chevron compressible : il compte pour sa largeur entière tant que
     la place existe, et pour zéro dans la largeur minimale de la cellule. */
  .bdg-nav .bdg-nav__toggle .bdg-icon { flex: 0 1 auto; width: var(--bdg-nav-chevron); max-width: 100%; min-width: 0; margin-left: var(--bdg-nav-cell-gap); }
  /* Survol et sous-menu ouvert : cellule plus claire, texte or */
  .bdg-nav .bdg-nav__link:hover, .bdg-nav .bdg-nav__link.is-hover,
  .bdg-nav .bdg-nav__toggle:hover, .bdg-nav .bdg-nav__toggle.is-hover,
  .bdg-nav .bdg-nav__toggle[aria-expanded="true"] {
    color: var(--bdg-color-text-accent-on-dark);
    background: linear-gradient(to bottom, var(--bdg-color-background-nav-cell-hover-start), var(--bdg-color-background-nav-cell-hover-end)); }
  /* Rubrique courante : cellule pleine or, texte et chevron noirs, y compris survolée ou ouverte */
  .bdg-nav .bdg-nav__link[aria-current="page"], .bdg-nav .bdg-nav__toggle[aria-current="true"],
  .bdg-nav .bdg-nav__link[aria-current="page"]:hover, .bdg-nav .bdg-nav__toggle[aria-current="true"]:hover,
  .bdg-nav .bdg-nav__toggle[aria-current="true"][aria-expanded="true"] { color: var(--bdg-color-text-on-gold); background: var(--bdg-color-background-nav-cell-current); }
  /* Focus clavier : contour à l'intérieur de la cellule, de la couleur de son texte ; la cellule garde son fond */
  .bdg-nav .bdg-nav__link:focus-visible, .bdg-nav .bdg-nav__link.is-focus,
  .bdg-nav .bdg-nav__toggle:focus-visible, .bdg-nav .bdg-nav__toggle.is-focus {
    color: var(--bdg-color-text-inverse); background: transparent;
    outline: var(--bdg-border-width-control-focus) solid currentColor; outline-offset: -6px; }
  .bdg-nav .bdg-nav__link:focus-visible:hover, .bdg-nav .bdg-nav__toggle:focus-visible:hover,
  .bdg-nav .bdg-nav__toggle[aria-expanded="true"]:focus-visible {
    color: var(--bdg-color-text-accent-on-dark);
    background: linear-gradient(to bottom, var(--bdg-color-background-nav-cell-hover-start), var(--bdg-color-background-nav-cell-hover-end)); }
  .bdg-nav .bdg-nav__link[aria-current="page"]:focus-visible, .bdg-nav .bdg-nav__link[aria-current="page"].is-focus,
  .bdg-nav .bdg-nav__toggle[aria-current="true"]:focus-visible, .bdg-nav .bdg-nav__toggle[aria-current="true"].is-focus { color: var(--bdg-color-text-on-gold); background: var(--bdg-color-background-nav-cell-current); }

  /* Sous-menu : panneau inchangé (fond blanc, ombre, bord supérieur or), aligné sur le bord gauche de sa cellule,
     sur le bord droit pour les deux dernières rubriques. Son bord or se superpose au filet de la barre.
     Ses couleurs de contexte redeviennent celles des fonds clairs. */
  .bdg-nav .bdg-nav__sub {
    --bdg-interactive-color: var(--bdg-color-text-interactive);
    --bdg-interactive-hover-color: var(--bdg-color-text-interactive-hover);
    --bdg-focus-block-color: var(--bdg-color-text-focus-block);
    --bdg-focus-block-bg: var(--bdg-color-background-focus-block);
    color: var(--bdg-color-text-primary);
    left: calc(-1 * var(--bdg-border-width-hairline)); right: auto; }
  .bdg-nav .bdg-nav__item:nth-last-child(-n+2) .bdg-nav__sub { left: auto; right: calc(-1 * var(--bdg-border-width-hairline)); }

  /* En-tête compact au défilement (décision 35) : même barre, même filet or ; le bouton de recherche forme la dernière cellule */
  .bdg-header--compact { border-bottom: var(--bdg-border-width-accent) solid var(--bdg-color-border-accent-on-dark); }
  .bdg-header--compact .bdg-nav .bdg-nav__inner { gap: 0; }
  /* v5.7 : en dernier recours (marges à zéro, chevrons disparus), le bouton de recherche se resserre de 56 à 40 px */
  .bdg-header--compact .bdg-nav .bdg-nav__compact-search { flex: 0 1 56px; width: auto; min-width: 40px; height: 56px; color: var(--bdg-color-text-inverse); }
  .bdg-header--compact .bdg-nav .bdg-nav__compact-search:hover { color: var(--bdg-color-text-accent-on-dark); }
  .bdg-header--compact .bdg-nav .bdg-nav__compact-search:focus-visible { color: var(--bdg-color-text-inverse); background: transparent;
    outline: var(--bdg-border-width-control-focus) solid currentColor; outline-offset: -6px; }
}
/* Marge intérieure des cellules selon la largeur disponible */
@media (min-width: 1120px) { .bdg-nav { --bdg-nav-cell-padding: var(--bdg-space-1); } }
@media (min-width: 1200px) { .bdg-nav { --bdg-nav-cell-padding: var(--bdg-space-2); --bdg-nav-cell-gap: var(--bdg-space-1); --bdg-nav-chevron: var(--bdg-icon-size-sm); } }
@media (min-width: 1400px) { .bdg-nav { --bdg-nav-cell-padding: var(--bdg-space-3); } }
/* En-tête compact de 1 024 à 1 199 px : libellés à 13 px, comme avant la v5.5, pour laisser sa place au bouton de recherche */
@media (min-width: 1024px) and (max-width: 1199px) {
  .bdg-header--compact .bdg-nav .bdg-nav__link, .bdg-header--compact .bdg-nav .bdg-nav__toggle { font-size: 13px; }
}

/* ==========================================================================
   19. Menu principal : repli sans script (v5.6)
   L'élément html porte la classe « sans-script », retirée par le script du thème quand il s'est exécuté.
   Avec le script, aucune de ces règles ne s'applique : l'ouverture au clic (décision 52) reste seule.
   ========================================================================== */

/* Mobile : deux liens de même apparence remplacent les boutons (loupe vers la recherche, « Menu » vers le plan du site).
   Un bouton n'est masqué que si son lien de repli le précède. */
.bdg-header__secours { display: none; }
.sans-script .bdg-header__secours { display: inline-flex; }
.sans-script .bdg-header__secours + button { display: none; }
a.bdg-header__menu-toggle, a.bdg-icon-btn { text-decoration: none; }

/* Ordinateur : les sous-menus s'ouvrent au survol et quand le focus clavier entre dans la rubrique */
@media (min-width: 1024px) {
  .sans-script .bdg-nav .bdg-nav__item:hover > .bdg-nav__sub,
  .sans-script .bdg-nav .bdg-nav__item:focus-within > .bdg-nav__sub { display: block; }
  .sans-script .bdg-nav .bdg-nav__item:hover > .bdg-nav__toggle:not([aria-current]),
  .sans-script .bdg-nav .bdg-nav__item:focus-within > .bdg-nav__toggle:not([aria-current]) {
    color: var(--bdg-color-text-accent-on-dark);
    background: linear-gradient(to bottom, var(--bdg-color-background-nav-cell-hover-start), var(--bdg-color-background-nav-cell-hover-end)); }
  .sans-script .bdg-nav .bdg-nav__item:hover > .bdg-nav__toggle .bdg-icon,
  .sans-script .bdg-nav .bdg-nav__item:focus-within > .bdg-nav__toggle .bdg-icon { transform: rotate(180deg); }
}

/* ==========================================================================
   20. Contenu rédactionnel en pleine colonne (v5.8 et v5.9, briefs 20 et 20 bis, hors maquettes)
   Gabarits rédactionnels (classe bdg-layout--text posée par le thème : page, actualité, biographie, événement,
   vidéo, questions fréquentes, pages de formulaire) : le chapô, le texte, les images et les formulaires ont le
   même bord gauche et le même bord droit que le titre et l'image principale, c'est-à-dire ceux de la colonne
   principale. Les pages de liste ne sont pas concernées.
   ========================================================================== */
.bdg-layout--text .bdg-layout__main div.bdg-prose,
.bdg-layout--text .bdg-layout__main .bdg-lead,
.bdg-layout--text .bdg-layout__main .bdg-article-head,
.bdg-layout--text .bdg-layout__main .bdgt-faq,
.bdg-layout--text .bdg-layout__main .bdg-form,
.bdgt-narrow .bdg-form { max-width: none; }
/* Adresses web et mots très longs : jamais de débordement (retour à la ligne forcé seulement dans ce cas) */
.bdg-layout--text .bdg-layout__main div.bdg-prose, .bdg-layout--text .bdg-layout__main .bdg-lead { overflow-wrap: break-word; }

@media (min-width: 768px) {
  /* La ligne étant plus longue, le texte courant grossit et l'interlignage s'ouvre ; le chapô suit en proportion */
  .bdg-layout--text .bdg-layout__main div.bdg-prose { font-size: var(--bdg-prose-font-size); line-height: var(--bdg-prose-line-height); }
  .bdg-layout--text .bdg-layout__main .bdg-page-head .bdg-lead,
  .bdg-layout--text .bdg-layout__main .bdg-lead.bdgt-block,
  .bdg-layout--text .bdg-layout__main div.bdg-prose > .bdg-lead { font-size: var(--bdg-prose-lead-font-size); line-height: var(--bdg-prose-lead-line-height); }
  /* v5.9 (brief 20 bis) : la justification et la césure automatique, essayées en v5.8, sont abandonnées.
     Tout le texte reste aligné à gauche, sans mot coupé en fin de ligne. */
}
@media (min-width: 1024px) {
  /* Disposition en une colonne : la colonne principale garde la largeur qu'elle a en deux colonnes (8 colonnes
     sur 12), centrée. Titre, image et texte partagent ainsi les mêmes bords et la longueur de ligne ne change pas
     d'une disposition à l'autre. La biographie, qui a son portrait à gauche, garde toute la largeur. */
  .bdg-layout--single.bdg-layout--text > .bdg-layout__main:not(:has(> .bdg-bio)) {
    max-width: calc((100% - 11 * var(--bdg-layout-gutter)) / 12 * 8 + 7 * var(--bdg-layout-gutter)); margin-inline: auto; }
}

/* ==========================================================================
   21. Tableau du contenu rédactionnel (v5.10, brief 23, hors maquettes)
   Bloc « Tableau » de l'éditeur (politique de confidentialité : durées de conservation). Filets fins, en-tête sur
   fond gris clair, texte aligné à gauche et en haut de cellule, angles droits. Le tableau occupe la largeur du
   texte ; s'il ne tient pas, il défile dans son propre cadre et jamais la page.
   ========================================================================== */
.bdg-prose .wp-block-table { margin-inline: 0; max-width: 100%; overflow-x: auto; }
.bdg-prose table { width: 100%; border-collapse: collapse; font-size: var(--bdg-font-size-body); line-height: var(--bdg-font-line-height-body); }
.bdg-prose th, .bdg-prose td { padding: var(--bdg-space-3) var(--bdg-space-4); text-align: left; vertical-align: top;
  border: var(--bdg-border-width-hairline) solid var(--bdg-color-border-subtle); }
.bdg-prose thead th { font-weight: var(--bdg-font-weight-bold); background: var(--bdg-color-background-alt);
  border-bottom: var(--bdg-border-width-strong) solid var(--bdg-color-border-strong); }
.bdg-prose tbody th { font-weight: var(--bdg-font-weight-bold); }
@media (min-width: 768px) {
  .bdg-prose .wp-block-table table.has-fixed-layout { table-layout: fixed; }
  .bdg-prose .wp-block-table table.has-fixed-layout th:first-child { width: 40%; }
}
@media (max-width: 767.98px) {
  .bdg-prose th, .bdg-prose td { padding: var(--bdg-space-2) var(--bdg-space-3); }
}