/*
Theme Name: Orbite
Theme URI: https://dernieresnouvellesducosmos.com/
Author: Dernières Nouvelles du Cosmos
Author URI: https://dernieresnouvellesducosmos.com/redaction/
Description: Thème éditorial écrit à la main pour Dernières Nouvelles du Cosmos, média francophone d'actualité spatiale et d'astronomie. Ivoire lunaire, indigo profond, Sora et Public Sans auto-hébergées.
Version: 1.0.0
Requires at least: 6.2
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: orbite
Tags: news, one-column, custom-menu
*/

/* ==========================================================================
   1. Fontes auto-hébergées (subsets latin, fichiers variables) — P-086
   ========================================================================== */
@font-face {
  font-family: "Sora";
  font-style: normal;
  font-weight: 600 700;
  font-display: swap;
  src: url("assets/fonts/sora-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("assets/fonts/public-sans-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Public Sans";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/public-sans-italique-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ==========================================================================
   2. Jetons de design — P-116 : 1 fond neutre (ivoire lunaire) + 1 accent (indigo profond)
      P-110 : paires de contraste EXPLICITES pour fonds clairs ET fonds sombres.
   ========================================================================== */
:root {
  /* Fond neutre travaillé */
  --dnc-fond: #f6f3ea;            /* ivoire lunaire */
  --dnc-surface: #fffdf7;         /* cartes */
  --dnc-voile: #ece7d8;           /* aplats secondaires */
  --dnc-trait: #d8d1bd;           /* filets, bordures */

  /* Accent unique */
  --dnc-accent: #33368f;          /* indigo profond — 9,2:1 sur l'ivoire */
  --dnc-accent-fonce: #262a6b;    /* hover, fonds pleins */
  --dnc-nuit: #1b1d3a;            /* indigo nuit : éphéméride, pied de page */

  /* Paires de contraste (chk_contrast, P-110) : la couleur de texte se pose
     sur le MÊME élément que le fond, jamais héritée. */
  --dnc-texte-sur-clair: #23252e;        /* encre sur ivoire/surface — ≥ 12:1 */
  --dnc-texte-secondaire-sur-clair: #575345; /* encre douce sur ivoire — ≥ 6:1 */
  --dnc-texte-sur-sombre: #f6f3ea;       /* ivoire sur indigo/nuit — ≥ 9:1 */
  --dnc-texte-secondaire-sur-sombre: #c9c5e6; /* sur nuit — ≥ 7:1 */

  /* Typographie */
  --dnc-fonte-titres: "Sora", "Avenir Next", "Segoe UI", sans-serif;
  --dnc-fonte-texte: "Public Sans", "Helvetica Neue", Arial, sans-serif;

  /* Rythme */
  --dnc-gabarit: 71.25rem;   /* 1140px */
  --dnc-marge: 1rem;
  --dnc-rayon: 6px;
  --dnc-ombre: 0 1px 2px rgba(27, 29, 58, 0.08), 0 6px 18px -8px rgba(27, 29, 58, 0.14);
}

/* ==========================================================================
   3. Base
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
body {
  margin: 0;
  background: var(--dnc-fond);
  color: var(--dnc-texte-sur-clair);
  font-family: var(--dnc-fonte-texte);
  font-size: 1rem;
  line-height: 1.65;
}
img, svg, video { max-width: 100%; height: auto; }
h1, h2, h3, h4 {
  font-family: var(--dnc-fonte-titres);
  font-weight: 700;
  line-height: 1.18;
  color: var(--dnc-texte-sur-clair);
  margin: 0 0 0.6em;
  overflow-wrap: break-word;
}
h1 { font-size: clamp(1.7rem, 4.5vw, 2.5rem); letter-spacing: -0.015em; }
h2 { font-size: clamp(1.3rem, 3vw, 1.7rem); }
h3 { font-size: 1.15rem; }
p { margin: 0 0 1.1em; }
a { color: var(--dnc-accent); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--dnc-accent-fonce); }
:focus-visible {
  outline: 3px solid var(--dnc-accent);
  outline-offset: 2px;
  border-radius: 2px;
}
::selection { background: var(--dnc-accent); color: var(--dnc-texte-sur-sombre); }

.gabarit {
  max-width: var(--dnc-gabarit);
  margin-inline: auto;
  padding-inline: var(--dnc-marge);
}
.lien-evitement {
  position: absolute;
  left: -999px;
  top: 0;
  z-index: 100;
  background: var(--dnc-accent);
  color: var(--dnc-texte-sur-sombre);
  padding: 0.7rem 1.2rem;
  border-radius: 0 0 var(--dnc-rayon) var(--dnc-rayon);
}
.lien-evitement:focus { left: 1rem; color: var(--dnc-texte-sur-sombre); }
.lecteur-ecran {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

/* ==========================================================================
   4. Barre éphéméride (au-dessus de la nav) — signature DNC
   ========================================================================== */
.barre-ephemeride {
  background: var(--dnc-nuit);
  color: var(--dnc-texte-sur-sombre);
  font-size: 0.8125rem;
  border-bottom: 3px solid var(--dnc-accent);
}
.barre-ephemeride .gabarit {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  min-height: 2.25rem;
  overflow-x: auto;
  scrollbar-width: none;
}
.barre-ephemeride .gabarit::-webkit-scrollbar { display: none; }
.slot-ephemeride {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  white-space: nowrap;
  color: var(--dnc-texte-sur-sombre);
}
.slot-ephemeride .puce-orbitale {
  flex: none;
  width: 14px; height: 14px;
}
.slot-ephemeride .libelle {
  color: var(--dnc-texte-secondaire-sur-sombre);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.6875rem;
  font-weight: 600;
}
.slot-ephemeride a { color: var(--dnc-texte-sur-sombre); }
.slot-ephemeride a:hover { color: #ffffff; }
.date-ephemeride { margin-left: auto; color: var(--dnc-texte-secondaire-sur-sombre); white-space: nowrap; }

/* ==========================================================================
   5. En-tête : logo + navigation des rubriques — P-004 : flex, zéro puce
   ========================================================================== */
.entete-site {
  background: var(--dnc-surface);
  border-bottom: 1px solid var(--dnc-trait);
  position: relative;
}
.entete-site .gabarit {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 4.25rem;
}
.logo-dnc { display: inline-flex; align-items: center; }
.logo-dnc svg { display: block; width: 178px; height: auto; }

.bouton-menu {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 44px; min-height: 44px;
  padding: 0.5rem 0.8rem;
  border: 1px solid var(--dnc-trait);
  border-radius: var(--dnc-rayon);
  background: var(--dnc-surface);
  color: var(--dnc-texte-sur-clair);
  font: 600 0.85rem var(--dnc-fonte-titres);
  cursor: pointer;
}
.bouton-menu .trait-burger {
  display: block;
  width: 18px; height: 2px;
  background: var(--dnc-texte-sur-clair);
  box-shadow: 0 -5px 0 var(--dnc-texte-sur-clair), 0 5px 0 var(--dnc-texte-sur-clair);
}

.nav-rubriques { display: none; }
.nav-rubriques.est-ouverte {
  display: block;
  position: absolute;
  top: 100%; left: 0; right: 0;
  background: var(--dnc-surface);
  border-bottom: 2px solid var(--dnc-accent);
  box-shadow: var(--dnc-ombre);
  z-index: 40;
}
.nav-rubriques ul {
  list-style: none;          /* P-004 */
  margin: 0;
  padding: 0.5rem var(--dnc-marge) 0.9rem;
  display: flex;
  flex-direction: column;
}
.nav-rubriques li { margin: 0; }
.nav-rubriques a {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0.35rem 0.5rem;
  color: var(--dnc-texte-sur-clair);
  text-decoration: none;
  font: 600 0.95rem var(--dnc-fonte-titres);
  border-radius: var(--dnc-rayon);
}
.nav-rubriques a:hover { color: var(--dnc-accent); background: var(--dnc-voile); }
.nav-rubriques .current-menu-item > a,
.nav-rubriques .current-cat > a {
  color: var(--dnc-accent);
  box-shadow: inset 3px 0 0 var(--dnc-accent);
}

@media (min-width: 64rem) {
  .bouton-menu { display: none; }
  .nav-rubriques { display: block; position: static; }
  .nav-rubriques.est-ouverte { position: static; border: 0; box-shadow: none; }
  .nav-rubriques ul { flex-direction: row; gap: 0.25rem; padding: 0; }
  .nav-rubriques a { padding: 0.4rem 0.75rem; }
  .nav-rubriques .current-menu-item > a,
  .nav-rubriques .current-cat > a {
    box-shadow: inset 0 -3px 0 var(--dnc-accent);
  }
}

/* ==========================================================================
   6. Fil d'Ariane — P-010
   ========================================================================== */
.fil-ariane {
  font-size: 0.8125rem;
  color: var(--dnc-texte-secondaire-sur-clair);
  padding: 0.8rem 0 0.2rem;
}
.fil-ariane ol {
  list-style: none;
  margin: 0; padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.fil-ariane li { display: inline-flex; align-items: center; gap: 0.35rem; }
.fil-ariane li + li::before {
  content: "›";
  color: var(--dnc-texte-secondaire-sur-clair);
}
.fil-ariane a { color: var(--dnc-texte-secondaire-sur-clair); }
.fil-ariane a:hover { color: var(--dnc-accent); }
.fil-ariane [aria-current="page"] { color: var(--dnc-texte-sur-clair); font-weight: 600; }

/* ==========================================================================
   7. Titres de tranche (sections de la une)
   ========================================================================== */
.titre-tranche {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  font-size: 1.25rem;
  margin: 0 0 1.1rem;
}
.titre-tranche::before {
  content: "";
  flex: none;
  width: 22px; height: 10px;
  border: 2px solid var(--dnc-accent);
  border-radius: 50%;
  transform: rotate(-16deg);
}
.titre-tranche a { color: inherit; text-decoration: none; }
.titre-tranche a:hover { color: var(--dnc-accent); }
.sous-tranche {
  margin: -0.7rem 0 1.1rem;
  color: var(--dnc-texte-secondaire-sur-clair);
  font-size: 0.9rem;
}

/* ==========================================================================
   8. Accueil — la une
   ========================================================================== */
.tranche { padding: 1.8rem 0; }
.tranche + .tranche { border-top: 1px solid var(--dnc-trait); }

.une-du-jour { display: grid; gap: 1.4rem; }
.une-principale { position: relative; }
.une-principale .cadre-image {
  margin: 0 0 0.8rem;
  border-radius: var(--dnc-rayon);
  overflow: hidden;
  background: var(--dnc-voile);
}
.une-principale img { display: block; width: 100%; height: auto; }
.une-principale .titre-une { font-size: clamp(1.45rem, 3.6vw, 2.1rem); margin-bottom: 0.4em; }
.une-principale .titre-une a { color: var(--dnc-texte-sur-clair); text-decoration: none; }
.une-principale .titre-une a:hover { color: var(--dnc-accent); }
.une-principale .chapo-une { color: var(--dnc-texte-secondaire-sur-clair); margin-bottom: 0.6em; }

.etiquette-rubrique {
  display: inline-block;
  font: 600 0.7rem var(--dnc-fonte-titres);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--dnc-accent);
  text-decoration: none;
  margin-bottom: 0.45rem;
}
a.etiquette-rubrique:hover { color: var(--dnc-accent-fonce); text-decoration: underline; }

.unes-secondaires {
  display: grid;
  gap: 1rem;
  align-content: start;
}
.une-secondaire {
  display: grid;
  grid-template-columns: 6.5rem 1fr;
  gap: 0.8rem;
  align-items: start;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--dnc-trait);
}
.une-secondaire:last-child { border-bottom: 0; padding-bottom: 0; }
.une-secondaire .cadre-image {
  margin: 0;
  border-radius: var(--dnc-rayon);
  overflow: hidden;
  background: var(--dnc-voile);
}
.une-secondaire img { display: block; width: 100%; height: auto; }
.une-secondaire h3 { font-size: 0.98rem; margin: 0.1rem 0 0.3rem; }
.une-secondaire h3 a { color: var(--dnc-texte-sur-clair); text-decoration: none; }
.une-secondaire h3 a:hover { color: var(--dnc-accent); }

@media (min-width: 64rem) {
  .une-du-jour { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 2.2rem; }
}

/* ==========================================================================
   9. Bandeau « prochains lancements »
   ========================================================================== */
.bandeau-lancements {
  background: var(--dnc-nuit);
  color: var(--dnc-texte-sur-sombre);
  background-image:
    radial-gradient(1.5px 1.5px at 12% 30%, rgba(246, 243, 234, 0.7) 0, transparent 100%),
    radial-gradient(1px 1px at 38% 68%, rgba(246, 243, 234, 0.5) 0, transparent 100%),
    radial-gradient(1.5px 1.5px at 61% 22%, rgba(246, 243, 234, 0.6) 0, transparent 100%),
    radial-gradient(1px 1px at 84% 58%, rgba(246, 243, 234, 0.5) 0, transparent 100%);
}
.bandeau-lancements .titre-tranche { color: var(--dnc-texte-sur-sombre); }
.bandeau-lancements .titre-tranche::before { border-color: var(--dnc-texte-secondaire-sur-sombre); }
.rail-lancements {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(15rem, 1fr);
  gap: 0.9rem;
  overflow-x: auto;
  padding-bottom: 0.4rem;
  scroll-snap-type: x proximity;
}
.fiche-lancement {
  scroll-snap-align: start;
  background: rgba(246, 243, 234, 0.07);
  border: 1px solid rgba(246, 243, 234, 0.18);
  border-radius: var(--dnc-rayon);
  padding: 0.85rem 1rem;
  color: var(--dnc-texte-sur-sombre);
}
.fiche-lancement .moment-lancement {
  display: block;
  font: 600 0.72rem var(--dnc-fonte-titres);
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--dnc-texte-secondaire-sur-sombre);
  margin-bottom: 0.3rem;
}
.fiche-lancement .nom-mission {
  font: 700 1rem var(--dnc-fonte-titres);
  margin: 0 0 0.2rem;
  color: var(--dnc-texte-sur-sombre);
}
.fiche-lancement .detail-mission {
  margin: 0;
  font-size: 0.85rem;
  color: var(--dnc-texte-secondaire-sur-sombre);
}
.repli-ephemeride {
  margin: 0;
  color: var(--dnc-texte-secondaire-sur-sombre);
}
.repli-ephemeride a { color: var(--dnc-texte-sur-sombre); }

/* ==========================================================================
   10. Trois rubriques en colonnes
   ========================================================================== */
.colonnes-rubriques { display: grid; gap: 2rem; }
.colonne-rubrique .titre-tranche { font-size: 1.1rem; }
.colonne-rubrique .liste-articles {
  list-style: none;
  margin: 0; padding: 0;
  display: grid;
  gap: 0.75rem;
}
.colonne-rubrique .liste-articles li {
  padding-bottom: 0.75rem;
  border-bottom: 1px dotted var(--dnc-trait);
}
.colonne-rubrique .liste-articles li:last-child { border-bottom: 0; padding-bottom: 0; }
.colonne-rubrique .liste-articles a {
  color: var(--dnc-texte-sur-clair);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.95rem;
}
.colonne-rubrique .liste-articles a:hover { color: var(--dnc-accent); }
.colonne-rubrique .liste-articles time {
  display: block;
  font-size: 0.75rem;
  color: var(--dnc-texte-secondaire-sur-clair);
  margin-top: 0.15rem;
}
.tout-voir {
  display: inline-block;
  margin-top: 0.9rem;
  font: 600 0.85rem var(--dnc-fonte-titres);
}
@media (min-width: 45rem) {
  .colonnes-rubriques { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ==========================================================================
   11. Le ciel ce mois-ci
   ========================================================================== */
.ciel-du-mois {
  background: var(--dnc-accent-fonce);
  color: var(--dnc-texte-sur-sombre);
  border-radius: var(--dnc-rayon);
  padding: 1.6rem 1.4rem;
  background-image:
    radial-gradient(2px 2px at 82% 22%, rgba(246, 243, 234, 0.8) 0, transparent 100%),
    radial-gradient(1px 1px at 68% 70%, rgba(246, 243, 234, 0.5) 0, transparent 100%),
    radial-gradient(1.5px 1.5px at 92% 60%, rgba(246, 243, 234, 0.6) 0, transparent 100%);
}
.ciel-du-mois .titre-tranche { color: var(--dnc-texte-sur-sombre); }
.ciel-du-mois .titre-tranche::before { border-color: var(--dnc-texte-secondaire-sur-sombre); }
.ciel-du-mois p { color: var(--dnc-texte-sur-sombre); max-width: 62ch; }
.ciel-du-mois a { color: var(--dnc-texte-sur-sombre); text-decoration-color: var(--dnc-texte-secondaire-sur-sombre); }
.ciel-du-mois a:hover { color: #ffffff; }
.ciel-du-mois ul { margin: 0 0 1rem; padding-left: 1.2rem; }
.ciel-du-mois li { margin-bottom: 0.35rem; }

/* ==========================================================================
   12. Cartes (dossiers, grilles d'archives, articles liés, matériel)
   ========================================================================== */
.cartes-dossiers,
.grille-articles,
.articles-lies .rangee-liee,
.selection-materiel .rangee-materiel {
  display: grid;
  gap: 1.2rem;
}
.carte-article {
  background: var(--dnc-surface);
  border: 1px solid var(--dnc-trait);
  border-radius: var(--dnc-rayon);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow 0.15s ease;
}
.carte-article:hover { box-shadow: var(--dnc-ombre); }
.carte-article .cadre-image { margin: 0; background: var(--dnc-voile); }
.carte-article img { display: block; width: 100%; height: auto; }
.carte-article .corps-carte { padding: 0.9rem 1rem 1.1rem; display: flex; flex-direction: column; gap: 0.3rem; }
.carte-article h3 { font-size: 1.02rem; margin: 0; }
.carte-article h3 a { color: var(--dnc-texte-sur-clair); text-decoration: none; }
.carte-article h3 a:hover { color: var(--dnc-accent); }
.carte-article .extrait-carte {
  margin: 0.2rem 0 0;
  font-size: 0.88rem;
  color: var(--dnc-texte-secondaire-sur-clair);
}
.carte-article time { font-size: 0.75rem; color: var(--dnc-texte-secondaire-sur-clair); }
@media (min-width: 45rem) {
  .cartes-dossiers,
  .grille-articles,
  .articles-lies .rangee-liee,
  .selection-materiel .rangee-materiel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 64rem) {
  .cartes-dossiers { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .grille-articles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .articles-lies .rangee-liee { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .selection-materiel .rangee-materiel { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.mention-affiliation {
  font-size: 0.78rem;
  color: var(--dnc-texte-secondaire-sur-clair);
  margin-top: 0.8rem;
}

/* ==========================================================================
   13. Article (single)
   ========================================================================== */
.article-seul { padding: 0.4rem 0 2.5rem; }
.colonne-lecture { max-width: 46rem; margin-inline: auto; }
.entete-article .etiquette-rubrique { margin-bottom: 0.6rem; }
.entete-article h1 { margin-bottom: 0.5em; }

.signature-auteur {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0.7rem 0;
  border-block: 1px solid var(--dnc-trait);
  margin-bottom: 1.4rem;
}
.signature-auteur .portrait-persona {
  flex: none;
  width: 48px; height: 48px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--dnc-voile);
}
.signature-auteur .portrait-persona img { display: block; width: 100%; height: 100%; }
.signature-auteur .qui-ecrit { font-size: 0.9rem; line-height: 1.4; }
.signature-auteur .qui-ecrit a { font-weight: 600; text-decoration: none; color: var(--dnc-texte-sur-clair); }
.signature-auteur .qui-ecrit a:hover { color: var(--dnc-accent); }
.signature-auteur .role-persona { color: var(--dnc-texte-secondaire-sur-clair); }
.signature-auteur .dates-article {
  margin-left: auto;
  text-align: right;
  font-size: 0.8rem;
  color: var(--dnc-texte-secondaire-sur-clair);
  line-height: 1.5;
}
.signature-auteur .date-maj { display: block; font-weight: 600; color: var(--dnc-texte-sur-clair); }
@media (max-width: 44.99rem) {
  .signature-auteur { flex-wrap: wrap; }
  .signature-auteur .dates-article { margin-left: 0; text-align: left; width: 100%; }
}

.image-en-tete { margin: 0 0 1.4rem; border-radius: var(--dnc-rayon); overflow: hidden; background: var(--dnc-voile); }
.image-en-tete img { display: block; width: 100%; height: auto; }
.image-en-tete figcaption { font-size: 0.78rem; color: var(--dnc-texte-secondaire-sur-clair); padding: 0.4rem 0.2rem 0; }

.texte-article { font-size: 1.05rem; }
.texte-article > * + * { margin-top: 1.05em; }
.texte-article h2 { margin-top: 1.6em; }
.texte-article h3 { margin-top: 1.3em; }
.texte-article img { border-radius: var(--dnc-rayon); }
.texte-article ul, .texte-article ol { padding-left: 1.4rem; }
.texte-article li { margin-bottom: 0.4em; }
.texte-article table { border-collapse: collapse; width: 100%; font-size: 0.92rem; }
.texte-article th, .texte-article td { border: 1px solid var(--dnc-trait); padding: 0.5rem 0.7rem; text-align: left; }
.texte-article th { background: var(--dnc-voile); font-family: var(--dnc-fonte-titres); font-weight: 600; }
.texte-article figure { margin: 1.4em 0; }
.texte-article figcaption { font-size: 0.8rem; color: var(--dnc-texte-secondaire-sur-clair); }

/* Bloc « selon nos sources » : toute citation d'article passe par lui */
.texte-article blockquote,
.selon-nos-sources {
  margin: 1.5em 0;
  padding: 0.9rem 1.1rem 0.9rem 1.3rem;
  background: var(--dnc-voile);
  color: var(--dnc-texte-sur-clair);
  border-left: 4px solid var(--dnc-accent);
  border-radius: 0 var(--dnc-rayon) var(--dnc-rayon) 0;
  font-style: italic;
}
.texte-article blockquote::before,
.selon-nos-sources::before {
  content: "Selon nos sources";
  display: block;
  font: 600 0.7rem var(--dnc-fonte-titres);
  font-style: normal;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--dnc-accent);
  margin-bottom: 0.35rem;
}
.texte-article blockquote p:last-child { margin-bottom: 0; }
.texte-article blockquote cite,
.selon-nos-sources cite {
  display: block;
  margin-top: 0.4rem;
  font-style: normal;
  font-size: 0.85rem;
  color: var(--dnc-texte-secondaire-sur-clair);
}

/* Bloc citable (GEO/LLM) : l'à-retenir prêt à être repris */
.bloc-citable {
  margin: 1.8em 0;
  padding: 1.1rem 1.2rem;
  background: var(--dnc-surface);
  border: 1px solid var(--dnc-accent);
  border-radius: var(--dnc-rayon);
}
.bloc-citable .entame-citable {
  display: block;
  font: 600 0.7rem var(--dnc-fonte-titres);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--dnc-accent);
  margin-bottom: 0.4rem;
}
.bloc-citable p { margin: 0; font-size: 1rem; }

.articles-lies { margin-top: 2.4rem; padding-top: 1.4rem; border-top: 1px solid var(--dnc-trait); }

/* ==========================================================================
   14. Hub de rubrique, page auteur, archives
   ========================================================================== */
.entete-rubrique { padding: 1.2rem 0 0.4rem; max-width: 50rem; }
.entete-rubrique .intro-silo { color: var(--dnc-texte-secondaire-sur-clair); font-size: 1.05rem; }
.corps-archive { padding: 1.4rem 0 2.5rem; }

.carte-persona {
  display: grid;
  gap: 1.2rem;
  padding: 1.6rem 0 0.6rem;
  align-items: center;
}
.carte-persona .portrait-persona {
  width: 132px; height: 132px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid var(--dnc-accent);
  background: var(--dnc-voile);
}
.carte-persona .portrait-persona img { display: block; width: 100%; height: 100%; }
.carte-persona .role-persona {
  font: 600 0.8rem var(--dnc-fonte-titres);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--dnc-accent);
}
.carte-persona .bio-persona { color: var(--dnc-texte-secondaire-sur-clair); max-width: 58ch; }
@media (min-width: 45rem) {
  .carte-persona { grid-template-columns: auto 1fr; }
}

.pagination-dnc { margin-top: 2rem; }
.pagination-dnc .nav-links { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.pagination-dnc .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px; min-height: 44px;
  padding: 0.3rem 0.7rem;
  border: 1px solid var(--dnc-trait);
  border-radius: var(--dnc-rayon);
  background: var(--dnc-surface);
  color: var(--dnc-texte-sur-clair);
  text-decoration: none;
  font: 600 0.9rem var(--dnc-fonte-titres);
}
.pagination-dnc a.page-numbers:hover { border-color: var(--dnc-accent); color: var(--dnc-accent); }
.pagination-dnc .page-numbers.current {
  background: var(--dnc-accent);
  border-color: var(--dnc-accent);
  color: var(--dnc-texte-sur-sombre);
}

/* ==========================================================================
   15. Recherche, 404, formulaires
   ========================================================================== */
.formulaire-recherche { display: flex; gap: 0.5rem; max-width: 34rem; }
.formulaire-recherche label { flex: 1; }
.champ-recherche {
  width: 100%;
  min-height: 44px;
  padding: 0.5rem 0.9rem;
  border: 1px solid var(--dnc-trait);
  border-radius: var(--dnc-rayon);
  background: var(--dnc-surface);
  color: var(--dnc-texte-sur-clair);
  font: 1rem var(--dnc-fonte-texte);
}
.champ-recherche:focus-visible { border-color: var(--dnc-accent); }
.bouton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.5rem 1.2rem;
  background: var(--dnc-accent);
  color: var(--dnc-texte-sur-sombre);
  border: 0;
  border-radius: var(--dnc-rayon);
  font: 600 0.95rem var(--dnc-fonte-titres);
  text-decoration: none;
  cursor: pointer;
}
.bouton:hover { background: var(--dnc-accent-fonce); color: var(--dnc-texte-sur-sombre); }

.page-perdue { padding: 3rem 0 4rem; max-width: 40rem; }
.page-perdue .code-perdu {
  font: 700 4.5rem var(--dnc-fonte-titres);
  color: var(--dnc-accent);
  line-height: 1;
  margin-bottom: 0.5rem;
}
.pistes-perdues { list-style: none; margin: 1.2rem 0 0; padding: 0; display: grid; gap: 0.4rem; }
.pistes-perdues a { font-weight: 600; }

/* ==========================================================================
   16. Pied de site — entité média, zéro spam de liens
   ========================================================================== */
.pied-site {
  margin-top: 3rem;
  background: var(--dnc-nuit);
  color: var(--dnc-texte-secondaire-sur-sombre);
  border-top: 3px solid var(--dnc-accent);
  font-size: 0.88rem;
}
.pied-site .gabarit { padding-block: 2.2rem 1.6rem; display: grid; gap: 1.8rem; }
.pied-site .logo-dnc svg { width: 190px; }
.pied-site h2 {
  font-size: 0.8rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--dnc-texte-sur-sombre);
  margin-bottom: 0.7rem;
}
.pied-site p { color: var(--dnc-texte-secondaire-sur-sombre); max-width: 46ch; }
.pied-site a { color: var(--dnc-texte-sur-sombre); text-decoration-color: rgba(246, 243, 234, 0.4); }
.pied-site a:hover { color: #ffffff; }
.pied-site ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.45rem; }
.ligne-legale {
  border-top: 1px solid rgba(246, 243, 234, 0.16);
  padding: 1rem 0 1.4rem;
  font-size: 0.8rem;
  color: var(--dnc-texte-secondaire-sur-sombre);
}
.ligne-legale .gabarit { display: flex; flex-wrap: wrap; gap: 0.4rem 1.4rem; padding-block: 0; }
@media (min-width: 45rem) {
  .pied-site .gabarit { grid-template-columns: 1.4fr 1fr 1fr; }
}

/* ── Frontispice (hero home) + Notre méthode ─────────────────────── */
.frontispice {
  background: linear-gradient(180deg, var(--dnc-nuit) 0%, var(--dnc-accent-fonce) 100%);
  color: var(--dnc-texte-sur-sombre);
  padding: 4.5rem 0 4rem;
  text-align: center;
}
.titre-frontispice {
  font-family: var(--dnc-fonte-titres);
  font-size: clamp(2rem, 5vw, 3.25rem);
  line-height: 1.1;
  margin: 0 0 0.5rem;
}
.tagline-frontispice {
  font-family: var(--dnc-fonte-titres);
  font-size: clamp(1.05rem, 2.2vw, 1.4rem);
  color: var(--dnc-texte-secondaire-sur-sombre);
  margin: 0 0 1rem;
}
.promesse-frontispice {
  max-width: 42rem;
  margin: 0 auto 1.25rem;
  font-size: 1.02rem;
}
.fact-frontispice {
  display: inline-block;
  background: rgba(246, 243, 234, 0.08);
  border: 1px solid rgba(246, 243, 234, 0.25);
  border-radius: 0.5rem;
  padding: 0.6rem 1rem;
  font-size: 0.95rem;
  margin: 0 auto 1.5rem;
}
.fact-frontispice a { color: var(--dnc-texte-sur-sombre); text-decoration: underline; }
.fact-frontispice strong { font-family: var(--dnc-fonte-titres); font-size: 1.15em; }
.rangee-cta { display: flex; gap: 0.75rem; justify-content: center; flex-wrap: wrap; }
.cta-principal,
.cta-secondaire {
  display: inline-flex;
  align-items: center;
  min-height: 44px;           /* tap target [STD] */
  padding: 0.65rem 1.4rem;
  border-radius: 0.5rem;
  font-family: var(--dnc-fonte-titres);
  font-weight: 600;
  text-decoration: none;
}
.cta-principal { background: var(--dnc-fond); color: var(--dnc-accent-fonce); }
.cta-principal:hover { background: var(--dnc-surface); }
.cta-secondaire { border: 1.5px solid rgba(246, 243, 234, 0.6); color: var(--dnc-texte-sur-sombre); }
.cta-secondaire:hover { border-color: var(--dnc-fond); }
.notre-methode { border-top: 1px solid var(--dnc-trait); text-align: center; }
.notre-methode p { max-width: 38rem; margin-left: auto; margin-right: auto; }