/* ==========================================================================
   PADC — base : remise à zéro, typographie, liens, focus, utilitaires
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: var(--e-5);
}

body {
  margin: 0;
  min-height: 100vh;
  background: var(--fond);
  color: var(--encre);
  font-family: var(--police-texte);
  font-size: var(--taille-m);
  line-height: var(--interligne);
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-wrap: break-word;
}

img, svg, video { display: block; max-width: 100%; }
img { height: auto; }
svg { flex-shrink: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
table { border-collapse: collapse; }
[hidden] { display: none !important; }

h1, h2, h3, h4 {
  margin: 0 0 var(--e-4);
  font-family: var(--police-titre);
  font-weight: 650;
  line-height: var(--interligne-serre);
  letter-spacing: -0.012em;
  color: var(--encre);
  text-wrap: balance;
}
h1 { font-size: var(--taille-3xl); letter-spacing: -0.02em; }
h2 { font-size: var(--taille-2xl); }
h3 { font-size: var(--taille-l); }
h4 { font-size: var(--taille-m); }
p, ul, ol, dl, blockquote, figure { margin: 0 0 var(--e-4); }
p { text-wrap: pretty; }
ul, ol { padding-inline-start: 1.25em; }
li + li { margin-top: var(--e-1); }
strong, b { font-weight: 650; }
small { font-size: var(--taille-s); }
hr { border: 0; border-top: 1px solid var(--trait); margin: var(--e-6) 0; }
abbr[title] { text-decoration: underline dotted; text-underline-offset: 2px; cursor: help; }
code, kbd, samp { font-family: var(--police-code); font-size: 0.92em; }
mark {
  background: #fff0a8;
  color: inherit;
  border-radius: 2px;
  padding: 0 0.1em;
  box-shadow: inset 0 -2px 0 #e2b53b;
}

/* --- Liens ---------------------------------------------------------------- */
a {
  color: var(--vert-700);
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}
a:hover { color: var(--vert-900); text-decoration-thickness: 2px; }

/* --- Focus visible (WCAG 2.4.7 / 2.4.11) ----------------------------------- */
:focus { outline: none; }
:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 2px;
  border-radius: 2px;
}
[tabindex="-1"]:focus-visible, [tabindex="-1"]:focus { outline: none; }
.fond-sombre :focus-visible, .pied :focus-visible { outline-color: var(--focus-inverse); }

/* --- Lien d'évitement ---------------------------------------------------- */
.evitement {
  position: absolute;
  inset-inline-start: var(--e-3);
  top: -100px;
  z-index: 1000;
  padding: var(--e-3) var(--e-4);
  background: var(--encre);
  color: #fff !important;
  font-weight: 650;
  border-radius: var(--r-2);
  text-decoration: none;
}
.evitement:focus, .evitement:focus-visible {
  top: var(--e-3);
  outline: 3px solid var(--focus-inverse);
  outline-offset: 2px;
}

/* --- Utilitaires ----------------------------------------------------------- */
.visuellement-masque {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.conteneur {
  width: 100%;
  max-width: var(--largeur-max);
  margin-inline: auto;
  padding-inline: var(--gouttiere);
}
.conteneur--etroit { max-width: calc(var(--largeur-lecture) + 2 * var(--gouttiere)); }
.pile > * + * { margin-top: var(--e-4); }
.pile-l > * + * { margin-top: var(--e-6); }
.texte-discret { color: var(--encre-3); }
.texte-s { font-size: var(--taille-s); }
.texte-xs { font-size: var(--taille-xs); }
.nowrap { white-space: nowrap; }
.chiffres { font-variant-numeric: tabular-nums; }
.surtitre {
  display: block;
  margin-bottom: var(--e-2);
  font-size: var(--taille-xs);
  font-weight: 650;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--vert-700);
}
.chapo { font-size: var(--taille-l); color: var(--encre-2); max-width: 44em; }
.prose { max-width: var(--largeur-lecture); }
.prose h2 { margin-top: var(--e-7); }
.prose h3 { margin-top: var(--e-6); }
.prose > :first-child { margin-top: 0; }
.document-texte { font-family: var(--police-document); }

/* --- Icônes ---------------------------------------------------------------- */
.icone {
  width: 1.25em;
  height: 1.25em;
  display: inline-block;
  vertical-align: -0.25em;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.icone--s { width: 1em; height: 1em; vertical-align: -0.14em; }
.icone--l { width: 1.6em; height: 1.6em; }

/* --- Réduction des mouvements --------------------------------------------- */
/* Préférence système (classe posée par preferences.js). */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-delay: 0s !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0s !important;
    scroll-behavior: auto !important;
  }
}
.mouvement-reduit *, .mouvement-reduit *::before, .mouvement-reduit *::after {
  animation-duration: 0.01ms !important;
  animation-delay: 0s !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.01ms !important;
  transition-delay: 0s !important;
  scroll-behavior: auto !important;
}
