/* ==========================================================================
   MODE SOMBRE (ajout du 9 octobre 2026)
   Activé par assets/theme.js : classe « sombre » sur <html>.
   Les couleurs du site passent par des variables : on les redéfinit, puis on
   corrige les quelques classes qui servent à la fois de fond et de texte.
   (Ce fichier n'est pas dans une « couche » CSS : il passe devant Tailwind.)
   ========================================================================== */

/* ---- Bouton soleil/lune et petite bulle (les deux modes) ---------------- */
.rlgbs-theme-btn {
  display: none; align-items: center; justify-content: center;
  width: 2.75rem; height: 2.75rem; border-radius: .375rem; cursor: pointer;
  border: 1px solid var(--color-line); background: var(--color-paper); color: var(--color-royal-deep);
  transition: background-color .15s;
}
.rlgbs-theme-btn:hover { background: var(--color-royal-soft); }
@media (min-width: 768px) { .rlgbs-theme-btn { display: inline-flex; } }
.rlgbs-theme-btn .th-ic { display: inline-flex; }
html.sombre .rlgbs-theme-btn { color: #c4d5f8; }

.rlgbs-theme-choix {
  display: flex; flex-wrap: wrap; align-items: center; gap: .4rem;
  padding: .2rem .25rem 1rem; margin-bottom: .6rem; border-bottom: 1px solid var(--color-line);
}
.rlgbs-theme-choix .th-titre {
  width: 100%; font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
  color: var(--color-muted); padding: 0 .75rem .2rem;
}
.rlgbs-theme-choix button {
  flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  min-height: 44px; padding: 0 .6rem; border-radius: 8px; cursor: pointer;
  border: 1px solid var(--color-line); background: var(--color-paper); color: #0b1730;
  font: inherit; font-size: .9rem; font-weight: 600;
}
.rlgbs-theme-choix button[aria-pressed="true"] { background: #0033a0; border-color: #0033a0; color: #fff; }
.rlgbs-theme-choix small { width: 100%; padding: 0 .75rem; font-size: .78rem; color: var(--color-muted); }

#rlgbs-theme-bulle {
  position: fixed; left: 50%; bottom: 1.2rem; z-index: 9999; transform: translate(-50%, 1rem);
  max-width: min(92vw, 30rem); padding: .65rem 1rem; border-radius: 10px;
  background: #001f6b; color: #fff; font: 600 .88rem/1.4 "Manrope", system-ui, sans-serif;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .3); opacity: 0; pointer-events: none;
  transition: opacity .2s, transform .2s;
}
#rlgbs-theme-bulle.vue { opacity: 1; transform: translate(-50%, 0); }

/* Changement de mode en douceur (sauf au chargement) */
html.sombre body, html body { transition: background-color .25s ease; }

/* ==========================================================================
   PALETTE SOMBRE
   ========================================================================== */
html.sombre {
  color-scheme: dark;
  --color-bg: #0b1220;          /* fond de page */
  --color-paper: #131d31;       /* cartes, en-tête, champs */
  --color-cream: #18243b;       /* fonds légers */
  --color-line: #27364f;        /* traits */
  --color-muted: #a9b5ca;       /* texte secondaire */
  --color-faint: #7f8ca5;
  --color-royal-soft: #1a2c55;  /* survols, pastilles */
  --color-danger: #f08592;
  --shadow-border: 0 0 0 1px #27364f;
}

/* Textes : ces couleurs servent aussi de fond, on ne touche donc qu'aux classes de texte. */
html.sombre .text-ink, html.sombre body { color: #e8edf6; }
html.sombre [class~="hover:text-ink"]:hover { color: #fff; }
html.sombre .text-royal { color: #8fb1f6; }
html.sombre [class~="hover:text-royal"]:hover { color: #b3caf8; }
html.sombre .text-royal-deep { color: #c4d5f8; }
html.sombre [class~="hover:text-royal-deep"]:hover { color: #fff; }
html.sombre .border-royal { border-color: #5d84d6; }

/* « text-paper » = texte blanc sur fond bleu : il doit rester blanc. */
html.sombre .text-paper, html.sombre [class~="hover:text-paper"]:hover { color: #fff; }
html.sombre [class~="text-paper/90"] { color: rgba(255, 255, 255, .9); }
html.sombre [class~="text-paper/85"] { color: rgba(255, 255, 255, .85); }
html.sombre [class~="text-paper/80"] { color: rgba(255, 255, 255, .8); }
html.sombre [class~="text-paper/75"] { color: rgba(255, 255, 255, .75); }
html.sombre [class~="text-paper/70"] { color: rgba(255, 255, 255, .7); }
html.sombre [class~="text-paper/65"] { color: rgba(255, 255, 255, .65); }
html.sombre [class~="text-paper/60"] { color: rgba(255, 255, 255, .6); }
html.sombre [class~="text-paper/55"] { color: rgba(255, 255, 255, .55); }
html.sombre [class~="text-paper/50"] { color: rgba(255, 255, 255, .5); }
html.sombre [class~="border-paper/50"] { border-color: rgba(255, 255, 255, .5); }

/* Grands bandeaux bleus : un peu plus profonds la nuit */
html.sombre .bg-royal-deep { background-color: #071a4d; }
html.sombre footer.bg-royal-deep { background-color: #060f22; border-top-color: #1b2740; }

/* Images : un rien moins éblouissantes la nuit */
html.sombre main img:not([src$=".svg"]) { filter: brightness(.92); }

/* Champs de formulaire */
html.sombre input, html.sombre textarea, html.sombre select {
  background-color: var(--color-paper); color: #e8edf6; border-color: var(--color-line);
}
html.sombre ::placeholder { color: #7f8ca5; }

/* Menu du téléphone (créé par nav.js avec des couleurs écrites en dur) */
html.sombre #cpanel-mobile-nav { background: #131d31 !important; border-top-color: #27364f !important; }
html.sombre #cpanel-mobile-nav nav a { color: #e8edf6 !important; }
html.sombre #cpanel-mobile-nav nav a[style*="e7edf8"] { background: #1a2c55 !important; }
html.sombre .rlgbs-theme-choix button { color: #e8edf6; }
html.sombre .rlgbs-theme-choix button[aria-pressed="true"] { color: #fff; }

/* ---- Accueil : « Ce pour quoi je milite » (site-extra.css) ------------- */
html.sombre .lc { background: linear-gradient(180deg, #0d1628 0%, #0b1220 100%); }
html.sombre .lc-kicker { color: #8fb1f6; }
html.sombre .lc-h2, html.sombre .lc-titre { color: #eef2f9; }
html.sombre .lc-intro, html.sombre .lc-texte { color: #a9b5ca; }
html.sombre .lc-carte { background: #131d31; box-shadow: 0 0 0 1px #27364f, 0 6px 18px -12px rgba(0, 0, 0, .6); border-top-color: #3d6fd8; }
html.sombre .lc-carte:hover { box-shadow: 0 0 0 1px #3d5a94, 0 16px 30px -16px rgba(0, 0, 0, .7); }
html.sombre .lc-num { color: #3a4c6f; }
html.sombre .lc-fleur { fill: #8fb1f6; }
html.sombre .lc-une { box-shadow: 0 22px 50px -24px rgba(0, 0, 0, .8); }
html.sombre .rlgbs-cal .jour { background: #131d31; }
html.sombre .rlgbs-lightbox button, html.sombre .rlgbs-galerie button { background: #131d31; color: #e8edf6; }

/* ---- Chronologie, Documents, Revue de presse (ressources.css) ---------- */
html.sombre .rs {
  --rs-soft: #1a2c55; --rs-encre: #e8edf6; --rs-gris: #a9b5ca; --rs-trait: #27364f;
  --rs-papier: #131d31; --rs-fond: #0b1220;
}
html.sombre .rs a:not(.rs-bouton):not(.rs-filtre) { color: #8fb1f6; }
html.sombre .rs .rs-h3 a { color: #e8edf6; }
html.sombre .rs-date, html.sombre .rs-annee, html.sombre .rs-h3 a:hover { color: #8fb1f6; }
html.sombre .rs-ext { color: #c4d5f8; }
html.sombre .rs-com { background: #1d1a12; }
html.sombre .rs-hero { background: #071a4d; }

/* ---- Le monde aujourd'hui (monde.css) ---------------------------------- */
html.sombre .mo {
  --mo-soft: #1a2c55; --mo-encre: #e8edf6; --mo-gris: #a9b5ca; --mo-trait: #27364f;
  --mo-papier: #131d31; --mo-fond: #0b1220;
}
html.sombre .mo a, html.sombre .mo-num, html.sombre .mo-sommaire li::before,
html.sombre .mo-sommaire a:hover { color: #8fb1f6; }
html.sombre .mo-sommaire a, html.sombre .mo-h2 { color: #eef2f9; }
html.sombre .mo-resume { color: #c3cddd; }
html.sombre .mo-pas, html.sombre .mo-archives summary, html.sombre .mo-sources a, html.sombre .mo-region { color: #c4d5f8; }
html.sombre .mo-sommaire li { border-top-color: #1f2c44; }
html.sombre .mo-r-europe { background: #1a2c55; color: #b9cdf6; }
html.sombre .mo-r-moyen-orient { background: #3a2a0d; color: #f1cf8c; }
html.sombre .mo-r-ameriques { background: #0f3324; color: #8fe0b8; }
html.sombre .mo-r-asie { background: #3d1820; color: #f3a9b4; }
html.sombre .mo-r-afrique { background: #33240f; color: #e6c08c; }
html.sombre .mo-r-oceanie { background: #0e3039; color: #8ed6e6; }
html.sombre .mo-off { color: #5d6b84; }
html.sombre .mo-archives li a { color: #e8edf6; }
html.sombre .mo-archives li a[aria-current] { color: #fff; }

/* ---- Avis de recherche (avis.css) -------------------------------------- */
html.sombre .av {
  --av-encre: #e8edf6; --av-gris: #a9b5ca; --av-trait: #27364f;
  --av-papier: #131d31; --av-fond: #0b1220;
}
html.sombre .av-filtre:hover, html.sombre .av-btn-clair:hover { border-color: #5d84d6; }
html.sombre .av-tableau dt { background: #18243b; }
html.sombre .av-h2 { color: #c4d5f8; }
html.sombre .av-carte-crime { color: #f39aa5; }
html.sombre .av-danger { background: #3a1418; color: #f6b3bc; }

/* ==========================================================================
   PHOTO EN FOND, TEINTÉE BLEU ROYAL (accueil et biographie)
   Version du 9 octobre au soir : la teinte bleue est maintenant DANS l'image
   (fabriquée sur le serveur). Plus de filtres, de mix-blend-mode ni de
   mask-image : Brave sur iPhone affichait la photo en couleurs. Le fondu
   vers le bleu du bandeau se fait avec de simples dégradés.
   ========================================================================== */
.hero-photo { position: relative; isolation: isolate; --hp-bleu: #001f6b; --hp-rgb: 0, 31, 107; }
html.sombre .hero-photo { --hp-bleu: #071a4d; --hp-rgb: 7, 26, 77; }
.hero-photo .hp-fond { position: absolute; top: 0; bottom: 0; right: 0; width: min(64%, 58rem); z-index: -1; overflow: hidden; background: var(--hp-bleu); }
.hero-photo .hp-fond img { width: 100%; height: 100%; object-fit: cover; display: block; opacity: .96; animation: hp-entree 1.2s ease-out both, hp-respire 12s ease-in-out 1.2s infinite alternate; }
html.sombre .hero-photo .hp-fond img { opacity: .8; }
/* Secours : si le serveur n'a pas pu fabriquer l'image bleue (GD absent),
   le navigateur la teinte lui-même (fonctionne partout sauf Brave iOS). */
.hero-photo .hp-fond img.hp-brut { filter: grayscale(1) contrast(1.12) brightness(1.04); }
.hero-photo .hp-fond.hp-brut-fond::after { content: ""; position: absolute; inset: 0; background: #2f55a8; mix-blend-mode: color; }
.hero-photo .hp-voile { position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, var(--hp-bleu) 0, rgba(var(--hp-rgb), .55) 28%, rgba(var(--hp-rgb), 0) 60%),
              linear-gradient(0deg, rgba(var(--hp-rgb), .6), rgba(var(--hp-rgb), 0) 45%); }
.hero-photo .hp-in { position: relative; }
.hero-photo .hp-legende { position: absolute; right: 1.5rem; bottom: 1.2rem; text-align: right; max-width: 22rem; z-index: 2; }
@keyframes hp-entree { from { opacity: 0; transform: scale(1.04); } to { opacity: .96; transform: scale(1); } }
@keyframes hp-respire { from { transform: scale(1); } to { transform: scale(1.04); } }
@media (prefers-reduced-motion: reduce) { .hero-photo .hp-fond img { animation: none; } }
@media (min-width: 1024px) { .hero-bio { min-height: 34rem; display: flex; align-items: center; } .hero-bio .hp-in { width: 100%; } }
@media (max-width: 1023px) {
  .hero-photo .hp-fond { width: 100%; height: 26rem; bottom: auto; }
  .hero-photo .hp-voile { background: linear-gradient(180deg, rgba(var(--hp-rgb), .15) 0, rgba(var(--hp-rgb), 0) 30%, rgba(var(--hp-rgb), 0) 55%, var(--hp-bleu) 100%); }
  .hero-photo .hp-in { padding-top: 22rem !important; }
  /* V4 · légende visible sous la photo au téléphone */
  .hero-photo .hp-legende { display: block; position: absolute; left: 1rem; right: 1rem; top: 17.4rem; bottom: auto; text-align: left; max-width: none; }
  .hero-photo .hp-legende p:first-child { font-size: 1.15rem !important; line-height: 1.25; }
  .hero-photo .hp-legende p + p { font-size: .78rem !important; margin-top: .15rem; }
}

/* En-tête sur ordinateur : avec « Lois » et le bouton d'affichage, le menu
   serrait le nom. Le nom ne rétrécit plus ; les liens se resserrent. */
@media (min-width: 1280px) {
  header a.flex.min-w-0 { flex-shrink: 0; }
  header nav.site-nav { min-width: 0; }
}
/* Menu « Plus » de l'en-tête (assets/nav.js) */
.nav-plus { position: relative; }
.nav-plus summary { list-style: none; cursor: pointer; white-space: nowrap; display: inline-flex; gap: .2rem; align-items: center; }
.nav-plus summary::-webkit-details-marker { display: none; }
.nav-plus-panneau { position: absolute; right: 0; top: calc(100% + .4rem); z-index: 60; min-width: 13rem; padding: .4rem;
  display: grid; gap: .1rem; border-radius: 12px; background: var(--color-paper); box-shadow: 0 0 0 1px var(--color-line), 0 14px 34px rgba(11, 23, 48, .18); }
.nav-plus-panneau a { display: block; padding: .55rem .75rem !important; border-radius: 8px; font-size: .86rem !important; white-space: nowrap; }
.nav-plus-panneau a:hover { background: var(--color-royal-soft); }


/* ==========================================================================
   AMÉLIORATIONS DU 9 OCTOBRE AU SOIR (demandées : « applique tout ça »)
   ========================================================================== */

/* 1. Fondu clair ⇄ sombre (0,4 s) sur un changement manuel */
html.rlgbs-fondu, html.rlgbs-fondu * { transition: background-color .4s ease, color .4s ease, border-color .4s ease, fill .4s ease !important; }

/* 2. Apparition au défilement (theme.js ajoute .rv puis .rv-vu) */
.rv { opacity: 0; transform: translateY(18px); transition: opacity .6s ease-out, transform .6s cubic-bezier(.2, .7, .2, 1); }
.rv.rv-vu { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .rv { opacity: 1; transform: none; transition: none; } }

/* 3. Photos d'artistes : même grain « vieux papier » pour toutes ; couleur au survol */
img[src*="/media/heritage/musique/photos/"] { filter: sepia(.5) contrast(1.06) saturate(.72); transition: filter .5s ease, transform .6s cubic-bezier(.2, .7, .2, 1); }
article:hover > img[src*="/media/heritage/musique/photos/"], article:focus-within > img[src*="/media/heritage/musique/photos/"] { filter: none; transform: scale(1.03); }
article.ph-photo { position: relative; }
article.ph-photo::before { content: ""; position: absolute; left: 0; right: 0; top: 0; aspect-ratio: 16 / 10; pointer-events: none; z-index: 1;
  background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0) 58%, rgba(62, 42, 12, .32) 100%); transition: opacity .5s; }
article.ph-photo:hover::before { opacity: 0; }
html.sombre img[src*="/media/heritage/musique/photos/"] { filter: sepia(.4) contrast(1.02) saturate(.7) brightness(.9); }

/* 4. Pied de page : fleur-plume en filigrane */
footer.bg-royal-deep { position: relative; overflow: hidden; }
footer.bg-royal-deep::after { content: ""; position: absolute; right: -2rem; bottom: -4rem; width: 19rem; height: 25rem; pointer-events: none; opacity: .07;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 75 100'><path fill='%23ffffff' d='M37.3 2.8C37.0 2.9 37.2 2.6 36.4 3.5C35.7 4.3 33.7 6.7 32.8 7.9C31.9 9.1 31.5 9.7 30.9 10.6C30.4 11.5 29.9 12.3 29.4 13.3C28.9 14.3 28.4 15.3 27.9 16.4C27.5 17.5 27.0 18.9 26.6 20.1C26.3 21.2 26.1 22.3 25.9 23.4C25.7 24.4 25.6 25.2 25.5 26.4C25.5 27.5 25.5 29.0 25.6 30.2C25.7 31.4 25.1 30.3 26.1 33.5C27.2 36.7 30.5 45.6 31.7 49.3C33.0 53.0 33.1 54.2 33.5 55.6C33.8 57.0 33.8 56.9 33.9 57.9C34.1 58.9 34.2 60.3 34.3 61.6C34.4 62.9 34.5 64.9 34.5 65.8C34.5 66.7 34.5 66.8 34.4 67.0C34.2 67.3 34.2 67.4 33.7 67.4C33.2 67.5 31.6 67.4 31.1 67.3C30.6 67.3 30.8 67.2 30.7 67.0C30.6 66.8 30.6 67.4 30.5 66.4C30.4 65.4 30.2 62.6 30.0 61.1C29.8 59.7 29.7 58.9 29.4 57.7C29.1 56.6 28.7 55.2 28.3 54.0C27.8 52.8 27.3 51.6 26.7 50.6C26.2 49.5 25.5 48.5 24.9 47.6C24.2 46.7 23.6 46.0 22.8 45.3C22.0 44.6 21.1 43.9 20.3 43.4C19.5 42.8 18.7 42.5 17.9 42.2C17.0 41.9 16.1 41.6 15.3 41.5C14.4 41.4 13.4 41.5 12.5 41.7C11.6 41.8 10.9 42.0 10.1 42.5C9.2 42.9 8.1 43.6 7.3 44.2C6.5 44.9 5.8 45.5 5.2 46.3C4.6 47.1 4.1 48.0 3.7 48.9C3.3 49.8 3.0 50.7 2.8 51.7C2.6 52.7 2.5 53.9 2.5 54.8C2.5 55.7 2.6 56.3 2.7 57.0C2.8 57.7 3.0 58.3 3.2 59.0C3.4 59.6 3.7 60.2 4.0 60.8C4.3 61.3 4.7 61.9 5.1 62.4C5.5 62.9 6.1 63.5 6.6 63.9C7.1 64.3 7.5 64.6 8.1 65.0C8.6 65.3 9.3 65.7 10.0 66.0C10.8 66.3 11.9 66.7 12.4 66.8C12.9 67.0 13.0 66.9 13.2 66.8C13.4 66.8 13.5 66.9 13.5 66.4C13.5 65.9 13.1 64.5 13.1 63.8C13.0 63.1 13.1 62.9 13.1 62.4C13.2 62.0 13.3 61.5 13.4 61.0C13.6 60.5 13.9 59.9 14.3 59.5C14.6 59.1 14.8 58.7 15.4 58.4C15.9 58.1 16.6 57.8 17.4 57.6C18.1 57.5 19.0 57.5 19.8 57.6C20.5 57.7 21.0 58.0 21.6 58.3C22.2 58.7 22.8 59.3 23.3 59.8C23.7 60.3 24.0 60.7 24.3 61.3C24.6 61.8 24.8 62.5 25.0 63.1C25.3 63.7 25.4 64.3 25.5 64.9C25.6 65.5 25.7 66.4 25.7 66.8C25.7 67.2 25.5 67.1 25.4 67.2C25.3 67.3 25.8 67.4 24.9 67.4C24.0 67.5 21.1 67.4 20.1 67.4C19.2 67.5 19.4 67.6 19.2 67.8C19.0 67.9 19.0 67.4 19.0 68.5C19.0 69.6 19.0 73.4 19.0 74.5C19.1 75.5 19.2 74.8 19.3 74.9C19.5 75.0 17.7 75.0 19.9 75.0C22.1 75.1 30.3 75.1 32.5 75.2C34.7 75.2 32.8 75.3 32.9 75.4C33.0 75.6 33.1 75.7 33.1 76.0C33.1 76.3 32.9 76.9 32.8 77.3C32.7 77.7 32.6 78.1 32.4 78.5C32.2 79.0 32.1 79.4 31.7 79.9C31.3 80.5 30.7 81.3 30.0 81.9C29.3 82.6 27.9 83.3 27.4 83.7C27.0 84.2 27.1 84.2 27.2 84.5C27.3 84.9 27.6 85.4 27.9 85.9C28.3 86.3 28.9 86.9 29.4 87.3C29.8 87.7 30.2 88.0 30.8 88.2C31.3 88.5 32.2 88.6 32.6 88.8C32.9 88.9 32.8 88.5 33.1 89.1C33.3 89.8 33.8 91.7 34.1 92.6C34.4 93.4 34.4 93.4 34.7 94.0C35.1 94.7 36.1 96.0 36.4 96.5C36.8 97.0 36.8 96.9 36.9 97.0C37.1 97.1 37.1 97.2 37.4 97.1C37.6 97.0 37.8 97.0 38.2 96.5C38.7 96.0 39.5 94.7 39.9 94.0C40.3 93.4 40.3 93.4 40.6 92.6C40.8 91.7 41.4 89.8 41.6 89.1C41.9 88.5 41.7 88.9 42.1 88.8C42.5 88.6 43.4 88.5 43.9 88.2C44.4 88.0 44.8 87.7 45.3 87.3C45.8 86.9 46.4 86.3 46.7 85.9C47.1 85.4 47.4 84.9 47.5 84.5C47.5 84.2 47.7 84.2 47.2 83.7C46.8 83.3 45.4 82.6 44.6 81.9C43.9 81.3 43.4 80.5 43.0 79.9C42.6 79.4 42.4 79.0 42.2 78.5C42.0 78.1 41.9 77.7 41.8 77.3C41.7 76.9 41.6 76.3 41.6 76.0C41.6 75.7 41.7 75.6 41.8 75.4C41.9 75.3 40.0 75.2 42.2 75.2C44.3 75.1 52.6 75.1 54.8 75.0C57.0 75.0 55.2 75.0 55.3 74.9C55.5 74.8 55.6 75.5 55.6 74.5C55.7 73.4 55.7 69.6 55.7 68.5C55.7 67.4 55.7 67.9 55.5 67.8C55.3 67.6 55.5 67.5 54.5 67.4C53.6 67.4 50.7 67.5 49.8 67.4C48.9 67.4 49.4 67.3 49.3 67.2C49.1 67.1 49.0 67.2 49.0 66.8C49.0 66.4 49.0 65.5 49.1 64.9C49.2 64.3 49.4 63.7 49.6 63.1C49.8 62.5 50.1 61.8 50.4 61.3C50.7 60.7 51.0 60.3 51.4 59.8C51.9 59.3 52.5 58.7 53.1 58.3C53.6 58.0 54.2 57.7 54.9 57.6C55.6 57.5 56.6 57.5 57.3 57.6C58.0 57.8 58.8 58.1 59.3 58.4C59.8 58.7 60.1 59.1 60.4 59.5C60.7 59.9 61.0 60.5 61.2 61.0C61.4 61.5 61.5 62.0 61.5 62.4C61.6 62.9 61.7 63.1 61.6 63.8C61.5 64.5 61.2 65.9 61.2 66.4C61.2 66.9 61.3 66.8 61.5 66.8C61.7 66.9 61.7 67.0 62.2 66.8C62.8 66.7 63.9 66.3 64.6 66.0C65.3 65.7 66.0 65.3 66.6 65.0C67.2 64.6 67.6 64.3 68.1 63.9C68.6 63.5 69.1 62.9 69.6 62.4C70.0 61.9 70.4 61.3 70.7 60.8C71.0 60.2 71.3 59.6 71.5 59.0C71.7 58.3 71.9 57.7 72.0 57.0C72.1 56.3 72.2 55.7 72.2 54.8C72.2 53.9 72.1 52.7 71.8 51.7C71.6 50.7 71.3 49.8 70.9 48.9C70.5 48.0 70.0 47.1 69.4 46.3C68.9 45.5 68.2 44.9 67.4 44.2C66.6 43.6 65.5 42.9 64.6 42.5C63.7 42.0 63.0 41.8 62.2 41.7C61.3 41.5 60.3 41.4 59.4 41.5C58.5 41.6 57.6 41.9 56.8 42.2C56.0 42.5 55.2 42.8 54.4 43.4C53.6 43.9 52.6 44.6 51.9 45.3C51.1 46.0 50.4 46.7 49.8 47.6C49.1 48.5 48.5 49.5 47.9 50.6C47.4 51.6 46.9 52.8 46.4 54.0C46.0 55.2 45.6 56.6 45.3 57.7C45.0 58.9 44.8 59.7 44.6 61.1C44.5 62.6 44.3 65.4 44.2 66.4C44.1 67.4 44.1 66.8 44.0 67.0C43.9 67.2 44.1 67.3 43.6 67.3C43.1 67.4 41.5 67.5 41.0 67.4C40.4 67.4 40.4 67.3 40.3 67.0C40.2 66.8 40.1 66.7 40.1 65.8C40.1 64.9 40.2 62.9 40.3 61.6C40.4 60.3 40.6 58.9 40.7 57.9C40.9 56.9 40.8 57.0 41.2 55.6C41.6 54.2 41.7 53.0 42.9 49.3C44.2 45.6 47.5 36.7 48.5 33.5C49.5 30.3 49.0 31.4 49.1 30.2C49.2 29.0 49.2 27.5 49.2 26.4C49.1 25.2 49.0 24.4 48.8 23.4C48.6 22.3 48.4 21.2 48.0 20.1C47.7 18.9 47.2 17.5 46.7 16.4C46.3 15.3 45.8 14.3 45.3 13.3C44.8 12.3 44.3 11.5 43.7 10.6C43.2 9.7 42.8 9.1 41.9 7.9C40.9 6.7 38.9 4.2 38.2 3.4C37.4 2.5 37.6 2.8 37.3 2.8ZM18.97 67.49V75.04H55.73V67.49ZM38.45 4.5L38.45 24.13A3.5 3.5 0 1 1 36.55 24.13L36.55 4.5Z'/></svg>") no-repeat center / contain; }
footer.bg-royal-deep > * { position: relative; z-index: 1; }

/* 5. Biographie : frise chronologique */
.bio-frise { position: relative; padding-left: 2.1rem; margin-top: .5rem; }
.bio-frise::before { content: ""; position: absolute; left: .68rem; top: .4rem; bottom: .4rem; width: 2px; background: linear-gradient(var(--color-royal, #0033a0), var(--color-line, #dfe5f1)); }
.bio-frise .bf-e { position: relative; margin-bottom: 1.4rem; }
.bio-frise .bf-e::before { content: ""; position: absolute; left: -1.82rem; top: .3rem; width: .75rem; height: .75rem; border-radius: 50%; background: var(--color-royal, #0033a0); box-shadow: 0 0 0 4px var(--color-royal-soft, #e7edf9); }
.bio-frise .bf-e.bf-on::before { animation: bf-pulse 1.6s ease-in-out infinite; }
@keyframes bf-pulse { 50% { box-shadow: 0 0 0 10px rgba(0, 51, 160, .12); } }
@media (prefers-reduced-motion: reduce) { .bio-frise .bf-e.bf-on::before { animation: none; } }
.bio-frise .bf-d { font-size: .68rem; letter-spacing: .18em; text-transform: uppercase; color: var(--color-royal, #0033a0); font-weight: 700; }
.bio-frise .bf-t { font-family: var(--font-display, Georgia, serif); font-size: 1.25rem; margin: .15rem 0; color: var(--color-ink, #0b1730); }
.bio-frise .bf-x { font-size: .92rem; color: var(--color-muted, #5b6478); max-width: 36rem; line-height: 1.55; }
html.sombre .bio-frise .bf-e::before { box-shadow: 0 0 0 4px #1a2c55; }

/* 6. « Partager cette chronique » (nav.js) */
.rlgbs-partage { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; margin: 1rem 0 .4rem; }
.rlgbs-partage .rp-l { font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--color-muted, #5b6478); margin-right: .2rem; }
.rlgbs-partage .rp-b { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid var(--color-line, #dfe5f1); background: var(--color-paper, #fff); color: var(--color-ink, #0b1730);
  border-radius: 999px; padding: .4rem .8rem; font: 600 .8rem/1 "Manrope", system-ui, sans-serif; cursor: pointer; text-decoration: none; transition: background-color .2s, border-color .2s, transform .15s; }
.rlgbs-partage .rp-b:hover { background: var(--color-royal-soft, #e7edf9); border-color: var(--color-royal, #0033a0); }
.rlgbs-partage .rp-b:active { transform: scale(.96); }
.rlgbs-partage .rp-b.ok { background: var(--color-royal, #0033a0); color: #fff; border-color: var(--color-royal, #0033a0); }
.rlgbs-partage .rp-natif { background: var(--color-royal, #0033a0); color: #fff; border-color: var(--color-royal, #0033a0); }
@media (max-width: 640px) { .rlgbs-partage .rp-b:not(.rp-natif):not(.rp-copier) { display: none; } }
html.sombre .rlgbs-partage .rp-b { background: #121c33; color: #e6ecfa; border-color: #26324d; }

/* 7. Accueil : disposition des boutons (téléphone : principal seul, puis 2 × 2 ;
   ordinateur : une rangée, tous de la même hauteur) */
.hero-btns { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; max-width: 34rem; }
.hero-btns .hb-principal { grid-column: 1 / -1; }
.hero-btns .hb-sec { padding-left: .9rem !important; padding-right: .9rem !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .32); white-space: nowrap; font-size: .86rem !important; }
.hero-btns .hb-sec:hover { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7); }
.hero-btns .hb-sec svg { flex: none; opacity: .85; }
.hero-btns .hb-point { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #e0463d; box-shadow: 0 0 0 3px rgba(224, 70, 61, .25); flex: none; }
@media (max-width: 380px) { .hero-btns .hb-sec { font-size: .8rem !important; padding-left: .6rem !important; padding-right: .6rem !important; gap: .35rem !important; } }
@media (min-width: 640px) { .hero-btns { display: flex; flex-wrap: wrap; max-width: none; } .hero-btns .hb-principal { flex: none; } }


/* ==========================================================================
   LOT « TOUT TOUT » DU 9 OCTOBRE AU SOIR
   ========================================================================== */
/* B2 · très petits écrans : boutons de l'accueil sur une colonne */
@media (max-width: 360px) { .hero-btns { grid-template-columns: 1fr; } }

/* A2 · la grande carte arrive de la gauche */

/* A4 · rotation du bouton soleil/lune */
.rlgbs-theme-btn .th-ic { display: inline-flex; transition: transform .35s cubic-bezier(.2, .7, .2, 1); }
.rlgbs-theme-btn .th-ic.tourne { transform: rotate(180deg); }

/* A6 · menu du téléphone : glissement */
#cpanel-mobile-nav { opacity: 0; transform: translateY(-10px); transition: opacity .3s ease, transform .3s cubic-bezier(.2, .7, .2, 1); }
#cpanel-mobile-nav.ouvert { opacity: 1; transform: none; }
#cpanel-mobile-nav .rlgbs-theme-choix, #cpanel-mobile-nav nav > a { opacity: 0; transform: translateY(6px); transition: opacity .3s ease, transform .3s ease; }
#cpanel-mobile-nav.ouvert .rlgbs-theme-choix, #cpanel-mobile-nav.ouvert nav > a { opacity: 1; transform: none; }
#cpanel-mobile-nav.ouvert nav > a:nth-child(2) { transition-delay: 30ms; } #cpanel-mobile-nav.ouvert nav > a:nth-child(3) { transition-delay: 60ms; }
#cpanel-mobile-nav.ouvert nav > a:nth-child(4) { transition-delay: 90ms; } #cpanel-mobile-nav.ouvert nav > a:nth-child(5) { transition-delay: 120ms; }
#cpanel-mobile-nav.ouvert nav > a:nth-child(n+6) { transition-delay: 150ms; }
@media (prefers-reduced-motion: reduce) { #cpanel-mobile-nav, #cpanel-mobile-nav * { transition: none !important; opacity: 1; transform: none; } }

/* A7 · coche animée « Lien copié » */
.rlgbs-partage .rp-b.ok svg { display: none; }
.rlgbs-partage .rp-b.ok::before { content: "✓"; display: inline-block; font-weight: 800; animation: rp-coche .4s cubic-bezier(.2, .9, .3, 1.4); }
@keyframes rp-coche { from { transform: scale(0) rotate(-30deg); } to { transform: none; } }

/* V3 · mode sombre : photos adoucies (sauf le bandeau bleu) */
html.sombre main img:not(.teinte):not(.hp-brut) { filter: brightness(.84); transition: filter .4s; }
html.sombre main img:not(.teinte):not(.hp-brut):hover { filter: none; }
html.sombre .hero-photo .hp-fond img { filter: none; }

/* F1 · barre de progression de lecture */
.rlgbs-lecture { position: fixed; left: 0; top: 0; right: 0; height: 3px; z-index: 90; pointer-events: none; background: transparent; }
.rlgbs-lecture i { display: block; height: 100%; background: var(--color-royal, #0033a0); transform-origin: 0 50%; transform: scaleX(0); transition: transform .12s linear; }
html.sombre .rlgbs-lecture i { background: #7fa3ff; }

/* F3 · haut de page */
.rlgbs-haut { position: fixed; right: 1rem; bottom: 1.1rem; z-index: 80; width: 2.8rem; height: 2.8rem; border-radius: 50%; border: 0; cursor: pointer;
  background: var(--color-royal, #0033a0); color: #fff; display: grid; place-items: center; box-shadow: 0 10px 24px rgba(0, 51, 160, .35);
  opacity: 0; transform: translateY(12px) scale(.9); pointer-events: none; transition: opacity .3s, transform .3s; }
.rlgbs-haut.vu { opacity: 1; transform: none; pointer-events: auto; }
.rlgbs-haut:hover { background: var(--color-royal-deep, #001f6b); }
@media (min-width: 1024px) { .rlgbs-haut { right: 1.6rem; bottom: 1.6rem; } }

/* F6 · rappel d'abonnement */
.rlgbs-rappel { position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 85; display: flex; gap: .8rem; align-items: flex-start; padding: 1rem 1rem 1rem 1.1rem;
  border-radius: 14px; background: var(--color-royal-deep, #001f6b); color: #fff; box-shadow: 0 16px 40px rgba(0, 31, 107, .35);
  opacity: 0; transform: translateY(16px); transition: opacity .4s, transform .4s cubic-bezier(.2, .7, .2, 1); }
.rlgbs-rappel.vu { opacity: 1; transform: none; }
.rlgbs-rappel .rr-in { display: grid; gap: .3rem; flex: 1; }
.rlgbs-rappel strong { font-size: .95rem; } .rlgbs-rappel span { font-size: .8rem; color: #c4d5f8; }
.rlgbs-rappel .rr-b { justify-self: start; margin-top: .3rem; background: #fff; color: var(--color-royal-deep, #001f6b); border: 0; border-radius: 8px; padding: .5rem .9rem; font: 700 .82rem/1 "Manrope", system-ui, sans-serif; cursor: pointer; }
.rlgbs-rappel .rr-x { background: none; border: 0; color: #c4d5f8; cursor: pointer; font-size: .9rem; padding: .1rem .3rem; }
@media (min-width: 640px) { .rlgbs-rappel { left: auto; right: 4.6rem; max-width: 26rem; } }
body.page-chronique .rlgbs-haut { bottom: 1.1rem; }

/* F4 · impression d'une chronique : le texte, la signature, l'adresse */
@media print {
  header, footer, nav, .rlgbs-partage, .rlgbs-haut, .rlgbs-rappel, .rlgbs-lecture, #cpanel-mobile-nav, .rlgbs-theme-btn, form, button, video, audio,
  [data-rlgbs-compact], .hp-voile { display: none !important; }
  html, body { background: #fff !important; color: #000 !important; }
  main { max-width: none !important; }
  main a { color: #000 !important; text-decoration: none !important; }
  main img { max-width: 60% !important; filter: none !important; }
  body.page-chronique main::after { content: "— Emmanuelle Beauchamp, journaliste indépendante · ramenonslegrosbonsens.com"; display: block; margin-top: 2rem; font-style: italic; font-size: 11pt; }
  body.page-chronique section.border-t { display: none !important; }
  .rv { opacity: 1 !important; transform: none !important; }
}

/* V5 · fiche d'artiste en grand */
.rlgbs-modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 1rem; background: rgba(11, 23, 48, .66); opacity: 0; transition: opacity .3s; }
.rlgbs-modal.vu { opacity: 1; }
.rlgbs-modal .md-in { position: relative; width: min(56rem, 100%); max-height: 92vh; overflow: auto; display: grid; grid-template-columns: 1.15fr 1fr; border-radius: 16px; overflow: hidden;
  background: var(--color-paper, #fff); color: var(--color-ink, #0b1730); box-shadow: 0 30px 80px rgba(0, 0, 0, .45); transform: translateY(12px) scale(.98); transition: transform .35s cubic-bezier(.2, .7, .2, 1); }
.rlgbs-modal.vu .md-in { transform: none; }
.rlgbs-modal img { width: 100%; height: 100%; min-height: 18rem; object-fit: cover; display: block; filter: none !important; }
.rlgbs-modal .md-txt { padding: 1.6rem 1.6rem 1.8rem; }
.rlgbs-modal .md-k { font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; color: var(--color-royal, #0033a0); font-weight: 700; }
.rlgbs-modal h3 { font-family: var(--font-display, Georgia, serif); font-size: 1.9rem; margin: .2rem 0 .6rem; line-height: 1.1; }
.rlgbs-modal p { font-size: .95rem; line-height: 1.6; color: var(--color-muted, #5b6478); }
.rlgbs-modal .md-x, .rlgbs-modal .md-p, .rlgbs-modal .md-n { position: absolute; border: 0; cursor: pointer; border-radius: 50%; width: 2.4rem; height: 2.4rem; display: grid; place-items: center; background: rgba(255, 255, 255, .92); color: #0b1730; box-shadow: 0 4px 14px rgba(0, 0, 0, .2); }
.rlgbs-modal .md-x { right: .7rem; top: .7rem; }
.rlgbs-modal .md-p { left: .7rem; top: 50%; transform: translateY(-50%); } .rlgbs-modal .md-n { right: .7rem; top: 50%; transform: translateY(-50%); }
.rlgbs-modal .md-c { font-size: .72rem; color: var(--color-muted, #5b6478); margin-top: .8rem; }
@media (max-width: 700px) { .rlgbs-modal .md-in { grid-template-columns: 1fr; } .rlgbs-modal img { min-height: 0; aspect-ratio: 16 / 10; } .rlgbs-modal .md-p, .rlgbs-modal .md-n { top: 7rem; } }
article.ph-photo { cursor: zoom-in; }
html.sombre .rlgbs-modal .md-in { background: #121c33; color: #e6ecfa; }
html.sombre .rlgbs-modal p { color: #aab6d3; }
html.sombre .bio-frise .bf-t { color: #e6ecfa; }
html.sombre .bio-frise .bf-x { color: #aab6d3; }
html.sombre .bio-frise::before { background: linear-gradient(#7fa3ff, #26324d); }
html.sombre .rlgbs-partage .rp-l { color: #aab6d3; }
/* Biographie : carte combinée Repères + dates clés */
.bio-carte .bio-frise-titre { margin-top: 1.6rem; padding-top: 1.2rem; border-top: 1px solid var(--color-line, #dfe5f1); }
.bio-carte .bio-frise { margin-top: .9rem; padding-left: 1.9rem; }
.bio-carte .bio-frise .bf-t { font-size: 1.1rem; }
.bio-carte .bio-frise .bf-x { font-size: .86rem; }
.bio-carte .bio-frise .bf-e { margin-bottom: 1.1rem; }
html.sombre .bio-carte .bio-frise-titre { border-color: #26324d; }