@font-face { font-family: "Oswald"; font-weight: 500; font-display: swap; src: url("../fonts/oswald-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Oswald"; font-weight: 700; font-display: swap; src: url("../fonts/oswald-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 400; font-display: swap; src: url("../fonts/source-sans-3-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 600; font-display: swap; src: url("../fonts/source-sans-3-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 700; font-display: swap; src: url("../fonts/source-sans-3-latin-700-normal.woff2") format("woff2"); }

:root {
  --gris: #EFEEEE;
  --gris-fonce: #D9D7D7;
  --rouge: #C5140D;
  --rouge-fonce: #9A0F0A;
  --noir: #000;
  --blanc: #fff;
  --texte: #1A1A1A;
  --texte-doux: #5A5A5A;
  --titre: "Oswald", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --corps: "Source Sans 3", "Segoe UI", Roboto, Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--gris); color: var(--texte); font-family: var(--corps); font-size: 1.0625rem; line-height: 1.55; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--noir); outline-offset: 3px; }
.wrap { width: min(100% - 2.5rem, 72rem); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- En-tête rouge ---------- */
.entete { background: var(--rouge); color: var(--blanc); padding: 1.25rem 0 2.25rem; }
.entete :focus-visible { outline-color: var(--blanc); }
.retour { display: inline-block; font-size: .95rem; font-weight: 600; text-decoration: none; opacity: .9; margin-bottom: 1.25rem; }
.retour:hover { opacity: 1; text-decoration: underline; }
.entete h1 {
  font-family: var(--titre); font-weight: 700; text-transform: uppercase;
  font-size: clamp(2rem, 5.5vw, 3.6rem); line-height: 1.05; margin: 0 0 .6rem; max-width: 20ch;
}
.entete .sous { margin: 0; font-size: 1.05rem; opacity: .92; }

/* Lien de téléchargement PDF */
.entete .haut { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
.entete .haut .retour { margin-bottom: 0; }
.lien-pdf {
  display: inline-flex; align-items: center; gap: .45rem; font-family: var(--titre); font-weight: 500; text-transform: uppercase;
  font-size: .85rem; letter-spacing: .03em; text-decoration: none; color: var(--blanc); border: 1px solid rgba(255,255,255,.75); padding: .4rem .8rem;
  transition: background-color .15s, color .15s;
}
.lien-pdf:hover { background: var(--blanc); color: var(--rouge); }
.lien-pdf svg { width: 1rem; height: 1rem; }
.pied .lien-pdf { color: var(--texte); border-color: var(--texte); }
.pied .lien-pdf:hover { background: var(--noir); color: var(--blanc); }

/* ---------- Titres de section ---------- */
.titre-section {
  font-family: var(--titre); font-weight: 700; text-transform: uppercase;
  font-size: clamp(1.35rem, 3vw, 1.8rem); line-height: 1.1; margin: 0 0 1.1rem;
}
.titre-section .bandeau {
  display: inline-block; background: var(--rouge); color: var(--blanc); padding: .3em .8em .35em;
  transform: rotate(-2deg);
  clip-path: polygon(1% 8%, 22% 0, 58% 5%, 100% 0, 98% 52%, 100% 100%, 64% 94%, 30% 100%, 0 95%, 2% 48%);
}

/* ---------- Recherche ---------- */
.recherche { position: relative; max-width: 30rem; }
.recherche input {
  width: 100%; font: inherit; padding: .7rem .9rem .7rem 2.5rem; border: 2px solid var(--noir); background: var(--blanc); border-radius: 0;
}
.recherche svg { position: absolute; left: .8rem; top: 50%; transform: translateY(-50%); width: 1.1rem; height: 1.1rem; }

/* ---------- Pied de page ---------- */
.pied { padding: 2.5rem 0 3rem; display: flex; flex-wrap: wrap; gap: 1rem 2rem; align-items: center; }
.btn-noir {
  display: inline-block; background: var(--noir); color: var(--blanc); font-family: var(--titre); font-weight: 700;
  text-transform: uppercase; text-decoration: none; font-size: 1.05rem; padding: .55em 1.1em .6em; transform: rotate(-2deg);
  clip-path: polygon(1% 8%, 22% 0, 58% 5%, 100% 0, 98% 52%, 100% 100%, 64% 94%, 30% 100%, 0 95%, 2% 48%);
}
.btn-noir:hover { background: var(--rouge); }
.lien-retour { font-weight: 600; color: var(--rouge); }

.maj { font-size: .9rem; color: var(--texte-doux); }
.vide { background: var(--blanc); padding: 1.25rem; border-left: 4px solid var(--gris-fonce); color: var(--texte-doux); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
}

/* ---------- Thème noir (réglé dans le back office) ---------- */
.theme-noir .entete { background: var(--noir); border-bottom: 4px solid var(--rouge); }
.theme-noir .titre-section .bandeau { background: var(--noir); }
.theme-noir .lien-pdf:hover { color: var(--noir); }

.entete .haut .actions-entete { margin-left: auto; display: flex; gap: .6rem; }
.entete .haut .actions-entete + .lien-pdf { margin-left: 0; }
@media (max-width: 640px) { .entete .haut { flex-wrap: wrap; } .entete .haut .actions-entete { order: 3; margin-left: 0; } }