/* Peau « Le Bureau de Référence »,  stepyouthcenter.org
   Règle négative : le laiton n'est jamais un aplat de section ; il vit en filet, en cote,
   ou en texte sur fond craie ou papier. Aucun dégradé de laiton.
   Matière : craie grasse, papier de carnet, cuir de fauteuil, buvard. */

/* ---------------------------- Fontes ----------------------------
   Budget : 3 fichiers locaux, 59 008 octets.
   playfair-display-v22-latin-700.woff2 (display, préchargé)
   crimson-text-v11-latin-regular.woff2 + crimson-text-v11-latin-700.woff2 (lecture) */
@font-face {
  font-family: "Playfair Display";
  src: url("/playfair-display-v22-latin-700.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Crimson Text";
  src: url("/crimson-text-v11-latin-regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Crimson Text";
  src: url("/crimson-text-v11-latin-700.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}

/* ---------------------------- Jetons ---------------------------- */
:root {
  --rd-craie: #D4CDC1;
  --rd-papier: #E6E0D3;
  --rd-papier-fonce: #DCD4C4;
  --rd-ardoise: #221F1B;
  --rd-encre-douce: #4A443C;
  --rd-cuir: #3F4A3D;
  --rd-cuir-fonce: #2E362C;
  --rd-buvard: #6E5230;
  --rd-laiton: #8C5E15;
  --rd-laiton-clair: #B58A2B;
  --rd-accent-sature: #B8651C;
  --rd-filet: #A89B87;
  --rd-filet-doux: #C9BFAE;
  --rd-encre-claire: #F3EFE7;
  --rd-focus: #0F5C8A;

  --rd-display: "Playfair Display", "Baskerville", Georgia, "Times New Roman", serif;
  --rd-texte: "Crimson Text", "Verdana", "Segoe UI", sans-serif;
  --rd-mono: "Consolas", "DejaVu Sans Mono", "Andale Mono", monospace;

  --rd-halle: 72rem;
  --rd-halle-large: 82rem;
  --rd-mesure: 68ch;
  --rd-interligne: 1.62;
  --rd-corps: clamp(1.03rem, 0.98rem + 0.28vw, 1.12rem);
  --rd-rayon-s: 12px;
  --rd-rayon-m: 16px;
  --rd-rayon-l: 20px;

  --rd-ombre-1: 0 4px 14px rgba(63, 74, 61, 0.15), 0 1px 2px rgba(34, 31, 27, 0.08);
  --rd-ombre-2: 0 12px 28px rgba(110, 82, 48, 0.20), 0 2px 6px rgba(34, 31, 27, 0.10);
  --rd-ombre-3: 0 22px 46px rgba(184, 101, 28, 0.18), 0 4px 10px rgba(34, 31, 27, 0.10);
}

/* ---------------------------- Base ---------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--rd-texte);
  font-size: var(--rd-corps);
  line-height: var(--rd-interligne);
  color: var(--rd-ardoise);
  background: var(--rd-craie);
  overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }
a { color: var(--rd-cuir-fonce); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--rd-laiton); }
h1, h2, h3, h4 { font-family: var(--rd-display); font-weight: 700; color: var(--rd-ardoise); }
h1 { font-size: clamp(2rem, 1.4rem + 2.4vw, 3.4rem); line-height: 1.08; letter-spacing: -0.005em; margin: 0 0 0.6rem; }
h2 { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.2rem); line-height: 1.15; letter-spacing: -0.004em; margin: 0 0 0.5rem; }
h3 { font-size: clamp(1.15rem, 1rem + 0.5vw, 1.35rem); line-height: 1.25; letter-spacing: 0.005em; margin: 0 0 0.4rem; }
p { margin: 0 0 0.9rem; }
:focus-visible {
  outline: 3px solid var(--rd-focus);
  outline-offset: 3px;
  border-radius: 4px;
}

.rd-acces-direct {
  position: absolute; left: -9999px; top: 0;
  background: var(--rd-cuir); color: var(--rd-encre-claire);
  padding: 0.6rem 1rem; border-radius: 0 0 var(--rd-rayon-s) 0;
  z-index: 100;
}
.rd-acces-direct:focus { left: 0; }

.rd-halle {
  max-width: var(--rd-halle);
  margin: 0 auto;
  padding: 0 1.25rem;
  min-width: 0;
}
.rd-halle--large { max-width: var(--rd-halle-large); }
.rd-halle--etroite { max-width: 46rem; }

/* ---------------------------- Fronton ---------------------------- */
.rd-fronton {
  background: var(--rd-craie);
  border-bottom: 1px solid var(--rd-filet);
}
.rd-fronton__interieur {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas: "enseigne baseline" "nav nav";
  align-items: center;
  gap: 0.4rem 1.25rem;
  padding-top: 1rem;
  padding-bottom: 0.75rem;
}
.rd-enseigne {
  display: inline-flex; align-items: center; gap: 0.6rem;
  color: var(--rd-ardoise); text-decoration: none;
  font-family: var(--rd-display); font-weight: 700;
  font-size: clamp(1.1rem, 1rem + 0.4vw, 1.35rem);
  letter-spacing: -0.004em;
  grid-area: enseigne;
  min-width: 0;
}
.rd-enseigne__marque { flex: 0 0 auto; }
.rd-baseline {
  grid-area: baseline;
  margin: 0;
  font-family: var(--rd-mono);
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rd-encre-douce);
  justify-self: end;
  text-align: right;
  min-width: 0;
}
.rd-parcours { grid-area: nav; min-width: 0; }
.rd-parcours ul {
  display: flex; flex-wrap: wrap; gap: 0.25rem 0.1rem;
  list-style: none; margin: 0; padding: 0;
  border-top: 1px solid var(--rd-filet-doux);
  padding-top: 0.6rem;
}
.rd-parcours__lien {
  display: inline-block; padding: 0.35rem 0.8rem;
  color: var(--rd-ardoise); text-decoration: none;
  font-family: var(--rd-mono); font-size: 0.78rem;
  letter-spacing: 0.06em; text-transform: uppercase;
  border-radius: var(--rd-rayon-s);
}
.rd-parcours__lien:hover, .rd-parcours__lien[aria-current="page"] {
  background: var(--rd-cuir); color: var(--rd-encre-claire);
}

/* ---------------------------- Pied ---------------------------- */
.rd-pied {
  background: var(--rd-cuir-fonce);
  color: var(--rd-encre-claire);
  margin-top: 3rem;
  padding: 2.5rem 0 1.5rem;
}
.rd-pied a { color: var(--rd-encre-claire); text-decoration-color: rgba(243, 239, 231, 0.5); }
.rd-pied a:hover { color: #F0C169; }
.rd-pied__colonnes {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: 2rem;
  min-width: 0;
}
.rd-pied__colonne { min-width: 0; }
.rd-pied__colonne h2 {
  font-family: var(--rd-display);
  font-size: 1.05rem;
  color: var(--rd-encre-claire);
  margin: 0 0 0.5rem;
  letter-spacing: 0.01em;
}
.rd-pied__colonne ul { list-style: none; padding: 0; margin: 0; }
.rd-pied__colonne li { margin: 0.25rem 0; font-size: 0.95rem; }
.rd-pied__note-tete {
  font-family: var(--rd-mono);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #E4C786;
  margin: 0 0 0.5rem;
}
.rd-pied__brouillon {
  margin-top: 2rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(243, 239, 231, 0.18);
  font-size: 0.92rem;
}
.rd-pied__brouillon p { margin: 0 0 0.5rem; max-width: 68ch; }
.rd-pied__ligne {
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(243, 239, 231, 0.18);
  font-family: var(--rd-mono);
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #E4C786;
}
.rd-cote-mini {
  font-family: var(--rd-mono);
  font-size: 0.7rem;
  color: #E4C786;
  margin-left: 0.4rem;
}

/* ---------------------------- Bande réglée (ouverture) ---------------------------- */
.rd-bande-reglee {
  background-color: var(--rd-papier);
  background-image: repeating-linear-gradient(0deg,
    transparent 0, transparent 27px,
    var(--rd-filet-doux) 27px, var(--rd-filet-doux) 28px);
  padding-top: 2.75rem;
  padding-bottom: 2.75rem;
  border-bottom: 1px solid var(--rd-filet);
}
.rd-ouverture { max-width: 56rem; min-width: 0; }
.rd-surtitre {
  font-family: var(--rd-mono);
  font-size: 0.72rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #7A4F0E;
  margin: 0 0 0.9rem;
}
.rd-display { text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4), 0 2px 6px rgba(34, 31, 27, 0.08); }
.rd-chapeau {
  font-size: clamp(1.08rem, 1rem + 0.5vw, 1.25rem);
  line-height: 1.55;
  max-width: 64ch;
  color: var(--rd-encre-douce);
  margin: 0.8rem 0 1.2rem;
}
.rd-reperes {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1.6rem;
  font-family: var(--rd-mono);
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rd-ardoise);
}
.rd-reperes__n { color: #7A4F0E; font-weight: 700; }

/* ---------------------------- Une ---------------------------- */
.rd-une {
  padding-top: 3rem;
  padding-bottom: 2rem;
}
.rd-une__tete {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  border-bottom: 2px solid var(--rd-cuir);
  padding-bottom: 0.6rem;
  margin-bottom: 1.5rem;
}
.rd-une__etiquette {
  font-family: var(--rd-mono);
  font-size: 0.78rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  margin: 0;
  color: var(--rd-cuir-fonce);
}
.rd-une__date {
  margin: 0;
  font-family: var(--rd-mono);
  font-size: 0.78rem;
  letter-spacing: 0.07em;
  color: var(--rd-encre-douce);
}
.rd-une__carte {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 2rem;
  align-items: start;
  background: var(--rd-papier);
  border-radius: var(--rd-rayon-l);
  box-shadow: var(--rd-ombre-2);
  padding: 1.25rem;
  min-width: 0;
}
.rd-une__visuel {
  margin: 0;
  position: relative;
  border-radius: var(--rd-rayon-m);
  overflow: hidden;
  background: var(--rd-papier-fonce);
}
.rd-une__visuel img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--rd-rayon-m);
}
.rd-une__legende {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 1.4rem 1rem 0.7rem;
  margin: 0;
  font-family: var(--rd-mono);
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  color: var(--rd-encre-claire);
  background: linear-gradient(180deg, transparent 40%, rgba(34, 31, 27, 0.74) 100%);
  text-shadow: 0 1px 2px rgba(34, 31, 27, 0.9);
  border-radius: 0 0 var(--rd-rayon-m) var(--rd-rayon-m);
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
.rd-une__texte { min-width: 0; padding: 0.4rem 0.4rem 0.4rem 0; }
.rd-une__titre { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem); margin: 0.4rem 0 0.6rem; }
.rd-une__titre a { color: var(--rd-ardoise); text-decoration: none; }
.rd-une__titre a:hover { color: var(--rd-cuir-fonce); text-decoration: underline; text-decoration-thickness: 2px; }
.rd-une__abrege { font-size: 1.08rem; max-width: 56ch; color: var(--rd-encre-douce); }

.rd-cote-ligne { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; margin: 0 0 0.4rem; }
.rd-cote {
  font-family: var(--rd-mono);
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #7A4F0E;
  font-weight: 700;
}
.rd-cote--onglet {
  position: relative;
  display: inline-block;
  padding: 0.18rem 0.5rem;
  background: var(--rd-accent-sature);
  color: var(--rd-encre-claire);
  border-top: 1px solid var(--rd-laiton);
  border-right: 1px solid var(--rd-laiton);
  border-radius: 0 6px 6px 0;
  transform: translate(6px, -6px);
}
.rd-mention {
  font-family: var(--rd-mono);
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rd-encre-douce);
  text-decoration: none;
}
.rd-mention:hover { color: #7A4F0E; }

.rd-ligne-question {
  display: flex;
  gap: 0.5rem;
  align-items: baseline;
  border-top: 1px solid var(--rd-filet);
  border-bottom: 1px solid var(--rd-filet);
  padding: 0.55rem 0;
  margin: 0.4rem 0 0.9rem;
  font-family: var(--rd-texte);
  font-style: italic;
  font-size: 1.05rem;
  color: var(--rd-encre-douce);
  max-width: 68ch;
}
.rd-q-mark {
  font-family: var(--rd-mono);
  font-style: normal;
  color: var(--rd-encre-claire);
  background: var(--rd-accent-sature);
  border-radius: 999px;
  padding: 0.05rem 0.38rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}

.rd-acces {
  display: inline-block;
  font-family: var(--rd-mono);
  font-size: 0.75rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 0.6rem 1rem;
  border-radius: var(--rd-rayon-s);
  text-decoration: none;
  border: 1px solid transparent;
}
.rd-acces--plein {
  background: var(--rd-cuir);
  color: var(--rd-encre-claire);
  box-shadow: var(--rd-ombre-1);
}
.rd-acces--plein:hover { background: var(--rd-cuir-fonce); color: #F0C169; }

/* ---------------------------- Jetées (deux densités) ---------------------------- */
.rd-jetees { padding-top: 3rem; padding-bottom: 2rem; }
.rd-jetees__grille {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 2rem;
  min-width: 0;
}
.rd-jetees__principale {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.rd-jetees__dense {
  background: var(--rd-papier);
  border-radius: var(--rd-rayon-m);
  box-shadow: var(--rd-ombre-1);
  padding: 1.1rem 1rem;
  min-width: 0;
  align-self: start;
}
.rd-jetees__dense ul { list-style: none; padding: 0; margin: 0; }
.rd-dense__item { border-top: 1px solid var(--rd-filet-doux); }
.rd-dense__item:first-child { border-top: 0; }
.rd-dense__item a {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  gap: 0.55rem;
  padding: 0.5rem 0;
  align-items: baseline;
  text-decoration: none;
  color: var(--rd-ardoise);
  min-width: 0;
}
.rd-dense__item a:hover .rd-dense__titre { color: var(--rd-cuir-fonce); text-decoration: underline; }
.rd-dense__item time {
  font-family: var(--rd-mono);
  font-size: 0.68rem;
  letter-spacing: 0.06em;
  color: var(--rd-encre-douce);
  white-space: nowrap;
}
.rd-dense__cote {
  font-family: var(--rd-mono);
  font-size: 0.66rem;
  letter-spacing: 0.12em;
  color: #7A4F0E;
}
.rd-dense__titre { min-width: 0; font-size: 0.98rem; line-height: 1.3; }

/* ---------------------------- Étagères ---------------------------- */
.rd-etageres {
  padding-top: 3rem;
  padding-bottom: 2rem;
}
.rd-etageres__grille {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr));
  gap: 1.5rem;
  margin-top: 1.5rem;
  min-width: 0;
}
.rd-etagere {
  background: var(--rd-papier);
  border-radius: var(--rd-rayon-m);
  box-shadow: var(--rd-ombre-1);
  padding: 1.4rem 1.25rem 1.1rem;
  min-width: 0;
  border-top: 3px solid var(--rd-laiton);
}
.rd-etagere--2 { border-top-color: var(--rd-accent-sature); }
.rd-etagere--3 { border-top-color: var(--rd-cuir); }
.rd-etagere__tete {
  display: flex; gap: 0.6rem; align-items: baseline;
  margin: 0 0 0.4rem;
}
.rd-etagere__indice {
  font-family: var(--rd-mono);
  font-size: 1.4rem;
  font-weight: 700;
  color: #7A4F0E;
  letter-spacing: 0.08em;
  line-height: 1;
}
.rd-etagere__titre { margin: 0; font-size: 1.2rem; }
.rd-etagere__titre a { color: var(--rd-ardoise); text-decoration: none; }
.rd-etagere__titre a:hover { color: var(--rd-cuir-fonce); text-decoration: underline; }
.rd-etagere__intro {
  font-size: 0.95rem;
  color: var(--rd-encre-douce);
  margin: 0 0 0.8rem;
  max-width: 44ch;
}
.rd-etagere__liste { list-style: none; padding: 0; margin: 0; }
.rd-etagere__item { border-top: 1px solid var(--rd-filet-doux); }
.rd-etagere__item:first-child { border-top: 0; }
.rd-etagere__lien {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.6rem;
  padding: 0.55rem 0;
  text-decoration: none;
  color: var(--rd-ardoise);
  align-items: baseline;
  min-width: 0;
}
.rd-etagere__lien:hover .rd-etagere__h { color: var(--rd-cuir-fonce); text-decoration: underline; }
.rd-etagere__cote {
  font-family: var(--rd-mono);
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  color: #7A4F0E;
}
.rd-etagere__h { min-width: 0; font-size: 0.98rem; line-height: 1.3; }
.rd-etagere__lien time {
  font-family: var(--rd-mono);
  font-size: 0.7rem;
  letter-spacing: 0.06em;
  color: var(--rd-encre-douce);
  white-space: nowrap;
}
.rd-etagere__renvoi {
  margin: 0.8rem 0 0;
  font-family: var(--rd-mono);
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.rd-etagere__renvoi a { color: var(--rd-cuir-fonce); text-decoration: none; }
.rd-etagere__renvoi a:hover { color: #7A4F0E; }

/* ---------------------------- Rayons ---------------------------- */
.rd-rayon { padding-top: 2.5rem; padding-bottom: 1.5rem; }
.rd-rayon__tete {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  border-bottom: 2px solid var(--rd-cuir);
  padding-bottom: 0.6rem;
  margin-bottom: 1.5rem;
  min-width: 0;
}
.rd-rayon__tete h2 { margin: 0; }
.rd-rayon__phrase {
  margin: 0;
  font-size: 0.98rem;
  color: var(--rd-encre-douce);
  max-width: 56ch;
}
.rd-rayon__etiquette {
  font-family: var(--rd-mono);
  font-size: 0.72rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #7A4F0E;
  margin: 0 0 0.6rem;
}
.rd-compteur {
  font-family: var(--rd-mono);
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  color: var(--rd-encre-douce);
}
.rd-rayon__fiches {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
  gap: 1.5rem;
  min-width: 0;
}

/* ---------------------------- Entrées (cartes) ---------------------------- */
.rd-entree {
  display: grid;
  grid-template-columns: minmax(0, 12rem) minmax(0, 1fr);
  gap: 1rem;
  background: var(--rd-papier);
  border-radius: var(--rd-rayon-m);
  box-shadow: var(--rd-ombre-1);
  padding: 0.9rem;
  min-width: 0;
  transition: box-shadow 0.2s ease;
}
.rd-entree:hover { box-shadow: var(--rd-ombre-2); }
.rd-vignette {
  margin: 0;
  position: relative;
  border-radius: var(--rd-rayon-s);
  overflow: hidden;
  background: var(--rd-papier-fonce);
}
.rd-vignette img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--rd-rayon-s);
}
.rd-entree__texte { min-width: 0; }
.rd-entree__intitule { margin: 0.3rem 0 0.4rem; }
.rd-entree__intitule a { color: var(--rd-ardoise); text-decoration: none; }
.rd-entree__intitule a:hover { color: var(--rd-cuir-fonce); text-decoration: underline; text-decoration-thickness: 2px; }
.rd-entree__abrege {
  font-size: 0.98rem;
  color: var(--rd-encre-douce);
  margin: 0 0 0.5rem;
  max-width: 56ch;
}
.rd-entree__datation {
  font-family: var(--rd-mono);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  color: var(--rd-encre-douce);
  margin: 0;
}

.rd-sceau-ia {
  display: inline-block;
  font-family: var(--rd-mono);
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #7A4F0E;
  padding: 0.15rem 0.4rem;
  border: 1px solid var(--rd-filet);
  border-radius: 6px;
  background: var(--rd-craie);
  margin: 0.4rem 0 0;
}
.rd-vignette .rd-sceau-ia {
  position: absolute;
  right: 0.4rem; bottom: 0.4rem;
  margin: 0;
  background: rgba(243, 239, 231, 0.94);
}
.rd-une__legende .rd-sceau-ia {
  background: rgba(243, 239, 231, 0.94);
}
.rd-sceau-ia--pied {
  color: #E4C786;
  border-color: rgba(243, 239, 231, 0.35);
  background: transparent;
}

/* ---------------------------- Sous-main (buvard) ---------------------------- */
.rd-sous-main {
  background: var(--rd-buvard);
  color: var(--rd-encre-claire);
  margin: 2.5rem 0;
  padding: 2.5rem 0;
  box-shadow: var(--rd-ombre-2);
}
.rd-sous-main__marque {
  font-family: var(--rd-mono);
  font-size: 0.72rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #F7DEA9;
  margin: 0 0 0.6rem;
}
.rd-sous-main h2 {
  color: var(--rd-encre-claire);
  text-shadow: 0 2px 5px rgba(20, 15, 8, 0.55);
  margin: 0 0 0.8rem;
}
.rd-sous-main__phrase {
  font-family: var(--rd-texte);
  font-weight: 700;
  font-size: 1.1rem;
  line-height: 1.5;
  max-width: 68ch;
  margin: 0;
  color: var(--rd-encre-claire);
}

/* ---------------------------- Consignes ---------------------------- */
.rd-consignes { padding-top: 2.5rem; padding-bottom: 1.5rem; }
.rd-consignes__liste {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
  gap: 1rem;
  margin: 0;
  min-width: 0;
}
.rd-consigne {
  background: var(--rd-papier);
  border-radius: var(--rd-rayon-m);
  box-shadow: var(--rd-ombre-1);
  padding: 1.1rem 1rem;
  border-left: 4px solid var(--rd-laiton);
  min-width: 0;
}
.rd-consigne dt {
  font-family: var(--rd-mono);
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #7A4F0E;
  margin-bottom: 0.4rem;
}
.rd-consigne dd { margin: 0; font-size: 0.98rem; color: var(--rd-ardoise); }

/* ---------------------------- Passage (renvois) ---------------------------- */
.rd-passage { padding-top: 2.5rem; padding-bottom: 2rem; }
.rd-passage__liste { list-style: none; padding: 0; margin: 0; }
.rd-passage__item {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  gap: 0.7rem;
  align-items: baseline;
  padding: 0.7rem 0;
  border-top: 1px solid var(--rd-filet);
  min-width: 0;
}
.rd-passage__item:last-child { border-bottom: 1px solid var(--rd-filet); }
.rd-passage__cote {
  font-family: var(--rd-mono);
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  color: #7A4F0E;
}
.rd-passage__item a { font-weight: 700; color: var(--rd-ardoise); text-decoration: none; }
.rd-passage__item a:hover { color: var(--rd-cuir-fonce); text-decoration: underline; }
.rd-passage__extrait { font-size: 0.92rem; color: var(--rd-encre-douce); }

/* ---------------------------- Ailleurs (réseau) ---------------------------- */
.rd-ailleurs { padding-top: 2.5rem; padding-bottom: 2.5rem; }
.rd-ailleurs__liste {
  list-style: none;
  padding: 0;
  margin: 1rem 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr));
  gap: 0.6rem 1.5rem;
  min-width: 0;
}
.rd-ailleurs__item {
  padding: 0.7rem 0;
  border-top: 1px solid var(--rd-filet);
  font-size: 0.98rem;
  min-width: 0;
}
.rd-ailleurs__item p { margin: 0; }

/* ---------------------------- Rubrique / Pancarte ---------------------------- */
.rd-pancarte {
  background: var(--rd-cuir);
  color: var(--rd-encre-claire);
  border-radius: 0 0 var(--rd-rayon-l) var(--rd-rayon-l);
  padding: 3rem 1.25rem;
  max-width: none;
  width: 100%;
  box-shadow: var(--rd-ombre-3);
}
.rd-pancarte h1 {
  color: var(--rd-encre-claire);
  text-shadow: 0 2px 5px rgba(20, 15, 8, 0.6);
  max-width: 68ch;
}
.rd-pancarte .rd-surtitre { color: #F0C169; }
.rd-pancarte .rd-chapeau { color: #EBE4D6; max-width: 68ch; }

.rd-onglets {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding: 1rem 0 0;
  margin: 0;
}
.rd-onglet {
  display: inline-block;
  font-family: var(--rd-mono);
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.5rem 0.9rem;
  border-radius: var(--rd-rayon-s);
  text-decoration: none;
  color: var(--rd-ardoise);
  background: var(--rd-papier);
  border: 1px solid var(--rd-filet-doux);
  box-shadow: var(--rd-ombre-1);
}
.rd-onglet:hover { background: var(--rd-craie); color: var(--rd-cuir-fonce); }
.rd-onglet--courant { background: var(--rd-cuir); color: var(--rd-encre-claire); border-color: var(--rd-cuir-fonce); }

/* ---------------------------- Article ---------------------------- */
.rd-fiche { padding-top: 1.5rem; }
.rd-entete-fiche { max-width: 68ch; }
.rd-datation {
  font-family: var(--rd-mono);
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rd-encre-douce);
}

.rd-planche-image {
  margin: 2rem auto 2.5rem;
  max-width: 68rem;
}
.rd-planche-image img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: var(--rd-rayon-l);
  box-shadow: var(--rd-ombre-2);
}
.rd-planche__legende {
  margin-top: 0.6rem;
  font-size: 0.88rem;
  color: var(--rd-encre-douce);
  max-width: 68ch;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.rd-duo {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 2.5rem;
  align-items: start;
  min-width: 0;
}
.rd-rail {
  position: sticky;
  top: 1rem;
  background: var(--rd-papier);
  border-radius: var(--rd-rayon-m);
  box-shadow: var(--rd-ombre-1);
  padding: 1rem 0.9rem;
  min-width: 0;
  font-size: 0.88rem;
}
.rd-rail__etiquette {
  font-family: var(--rd-mono);
  font-size: 0.66rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #7A4F0E;
  margin: 0.8rem 0 0.2rem;
}
.rd-rail__etiquette:first-child { margin-top: 0; }
.rd-rail__cote {
  font-family: var(--rd-mono);
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--rd-ardoise);
  margin: 0;
}
.rd-rail__sources, .rd-rail__sommaire { list-style: none; padding: 0; margin: 0.2rem 0 0; }
.rd-rail__sources li, .rd-rail__sommaire li { margin: 0.2rem 0; }
.rd-rail__sources a, .rd-rail__sommaire a {
  color: var(--rd-cuir-fonce);
  text-decoration: none;
  font-size: 0.84rem;
  word-break: break-word;
}
.rd-rail__sources a:hover, .rd-rail__sommaire a:hover { color: #7A4F0E; text-decoration: underline; }
.rd-rail__retour { color: var(--rd-ardoise); font-weight: 700; text-decoration: none; }
.rd-rail__retour:hover { color: var(--rd-cuir-fonce); text-decoration: underline; }

.rd-corps {
  max-width: 68ch;
  min-width: 0;
  font-size: 1.06rem;
  line-height: 1.68;
}
.rd-corps > p:first-of-type::first-letter {
  font-family: var(--rd-display);
  font-weight: 700;
  float: left;
  font-size: 3.8rem;
  line-height: 0.85;
  padding: 0.25rem 0.6rem 0 0;
  color: var(--rd-cuir-fonce);
}
.rd-corps h2 { margin-top: 2rem; }
.rd-corps h3 { margin-top: 1.5rem; }
.rd-corps p { margin: 0 0 1rem; }
.rd-corps ul, .rd-corps ol { padding-left: 1.4rem; }
.rd-corps li { margin: 0.3rem 0; }
.rd-corps a { color: var(--rd-cuir-fonce); }
.rd-corps a:hover { color: #7A4F0E; }
.rd-corps blockquote {
  border-left: 3px solid var(--rd-laiton);
  margin: 1.5rem 0;
  padding: 0.4rem 0 0.4rem 1rem;
  font-style: italic;
  color: var(--rd-encre-douce);
}
.rd-corps table {
  border-collapse: collapse;
  width: 100%;
  margin: 1rem 0;
}
.rd-corps th, .rd-corps td {
  border: 1px solid var(--rd-filet);
  padding: 0.5rem 0.7rem;
  text-align: left;
}
.rd-corps th { background: var(--rd-papier); font-family: var(--rd-mono); font-size: 0.82rem; }

/* Conteneur à défilement local obligatoire autour des tableaux larges. */
.rd-tableau {
  overflow-x: auto;
  max-width: 100%;
  margin: 1rem 0;
  border-radius: var(--rd-rayon-s);
  box-shadow: var(--rd-ombre-1);
}
.rd-tableau table { min-width: 32rem; margin: 0; }

/* ---------------------------- Service / 404 ---------------------------- */
.rd-fiche--service .rd-corps { margin-top: 1.5rem; }

/* ---------------------------- Remontée ---------------------------- */
.rd-remontee { padding-top: 1.25rem; padding-bottom: 0.25rem; }
.rd-remontee ol {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem 0.7rem;
  font-family: var(--rd-mono);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rd-encre-douce);
}
.rd-remontee li + li::before { content: "›"; margin-right: 0.5rem; color: #7A4F0E; }
.rd-remontee a { color: var(--rd-encre-douce); text-decoration: none; }
.rd-remontee a:hover { color: var(--rd-cuir-fonce); }

/* ---------------------------- Voisinage ---------------------------- */
.rd-voisinage { padding-top: 3rem; padding-bottom: 3rem; }

/* ---------------------------- Responsive ---------------------------- */
@media (max-width: 62rem) {
  .rd-une__carte { grid-template-columns: minmax(0, 1fr); }
  .rd-duo { grid-template-columns: minmax(0, 1fr); }
  .rd-rail { position: static; }
  .rd-jetees__grille { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 46rem) {
  .rd-fronton__interieur {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "enseigne" "baseline" "nav";
  }
  .rd-baseline { justify-self: start; text-align: left; }
  .rd-pied__colonnes { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
  .rd-entree { grid-template-columns: minmax(0, 1fr); }
  .rd-entree .rd-vignette img { aspect-ratio: 16 / 9; }
  .rd-passage__item { grid-template-columns: auto minmax(0, 1fr); }
  .rd-passage__extrait { grid-column: 2 / 3; }
  .rd-dense__item a { grid-template-columns: minmax(0, 1fr); }
  .rd-dense__item time, .rd-dense__cote { white-space: normal; }
  .rd-cote--onglet { transform: translate(0, 0); }
  .rd-planche-image img { aspect-ratio: 4 / 3; }
  .rd-corps { font-size: 1.04rem; }
}
@media (max-width: 26rem) {
  .rd-parcours__lien { padding: 0.35rem 0.55rem; font-size: 0.72rem; }
  .rd-ouverture h1 { font-size: 1.9rem; }
  .rd-etagere__lien { grid-template-columns: minmax(0, 1fr); }
}

/* Très grands écrans : on élargit sans allonger la ligne de lecture. */
@media (min-width: 120rem) {
  :root { --rd-halle-large: 96rem; }
}