/* Base, conteneur, typographie, boutons. */

.bs-redesign * { box-sizing: border-box; }
html { scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .bs-redesign *,
  .bs-redesign *::before,
  .bs-redesign *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

body.bs-redesign {
  margin: 0;
  color: var(--ink);
  background: var(--ivory);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.65;
}

.bs-redesign img { display: block; max-width: 100%; width: 100%; height: auto; object-fit: cover; }

/* Garde-fou : aucun contenu tiers (MU-plugins, blocs Spectra, embeds) ne doit
   pouvoir élargir la page. L'audit a relevé un débordement à 320 px provoqué
   par la carte auteur du MU-plugin empire-author-card. */
.bs-redesign { overflow-x: clip; }
.bs-redesign .container > *,
.bs-redesign .article-content > *,
.bs-redesign .hub-heading > * { min-width: 0; max-width: 100%; }
.bs-redesign .eac-ava,
.bs-redesign .eac-avimg { max-width: 100%; height: auto; flex-shrink: 1; }
.bs-redesign iframe,
.bs-redesign video,
.bs-redesign embed { max-width: 100%; }
.bs-redesign a { color: inherit; text-decoration: none; }
.bs-redesign button { color: inherit; font: inherit; }

.bs-redesign h1,
.bs-redesign h2,
.bs-redesign h3,
.bs-redesign h4 { font-family: var(--serif); font-weight: 500; }

.container { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link:focus {
  position: fixed;
  z-index: 100;
  top: 10px;
  left: 10px;
  width: auto;
  height: auto;
  padding: 12px 18px;
  clip: auto;
  color: #fff;
  background: var(--plum-dark);
  font-family: var(--latin);
  font-size: 13px;
}

.bs-redesign :focus-visible {
  outline: 2px solid var(--plum);
  outline-offset: 3px;
}

.eyebrow {
  margin: 0 0 14px;
  color: var(--plum);
  font-family: var(--latin);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .19em;
  line-height: 1.2;
  text-transform: uppercase;
}

.section-title {
  margin: 0;
  max-width: 780px;
  font-family: var(--serif);
  font-size: clamp(34px, 4.3vw, 56px);
  font-weight: 500;
  letter-spacing: -.035em;
  line-height: 1.18;
}

.section-copy { margin: 14px 0 0; max-width: 580px; color: var(--muted); }

.section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 48px;
}

.bs-redesign .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 13px 25px;
  border: 1px solid var(--plum);
  background: var(--plum);
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  transition: transform .2s ease, background .2s ease;
}
.bs-redesign .button:hover { transform: translateY(-2px); background: var(--plum-dark); color: #fff; }

.text-link {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  padding-bottom: 3px;
  border-bottom: 1px solid var(--ink);
  font-size: 13px;
  font-weight: 500;
}
.text-link::after { content: "↗"; font-family: var(--latin); font-size: 14px; }

/* Repli visuel quand un article n'a pas d'image à la une. */
.bs-image-fallback {
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  background:
    radial-gradient(circle at 30% 25%, rgba(234, 208, 213, .9), transparent 60%),
    linear-gradient(135deg, #efe7e2, #e3d7d6);
}

/* État vide éditorial. */
.bs-empty { max-width: 620px; padding: 40px 0 10px; }
.bs-empty h2 { margin: 0 0 14px; font-size: clamp(26px, 3.4vw, 38px); }
.bs-empty p { margin: 0 0 24px; color: var(--muted); }
.bs-empty-links { display: flex; flex-wrap: wrap; gap: 14px 26px; margin-bottom: 30px; }
.bs-empty-search { max-width: 380px; }

/* ------------------------------------------------------------------ *
 * Bouton « retour en haut » du thème parent.
 *
 * Astra le peint en ligne avec `background-color: var(--ast-global-color-0)`,
 * soit son bleu par défaut #046bd2, étranger à la palette. On le repeint avec
 * les jetons existants du design — aucune couleur nouvelle n'est introduite.
 *
 * Le sélecteur est préfixé `.bs-redesign` (1-1-0) pour primer sur la règle
 * d'Astra (1-0-0) quel que soit l'ordre d'insertion, sans !important.
 *
 * Le liseré champagne n'est pas décoratif : le bouton flotte au-dessus du pied
 * de page, dont le fond est --plum-dark. Un aplat --plum n'y offrirait que
 * 1,63:1. Il est posé en box-shadow interne pour ne décaler aucun pixel.
 * ------------------------------------------------------------------ */
.bs-redesign #ast-scroll-top {
  background-color: var(--plum);
  color: #fff;
  box-shadow: inset 0 0 0 1px var(--champagne);
  transition: background-color .2s ease;
}
.bs-redesign #ast-scroll-top:hover {
  background-color: var(--plum-dark);
  color: #fff;
}
/* Anneau bicolore : l'anneau clair porte sur fond sombre, l'anneau prune sur
   fond ivoire. Le focus reste donc visible partout où le bouton apparaît. */
.bs-redesign #ast-scroll-top:focus-visible {
  outline: none;
  box-shadow:
    inset 0 0 0 1px var(--champagne),
    0 0 0 2px var(--paper),
    0 0 0 4px var(--plum);
}