*, *::before, *::after { box-sizing: border-box; }
html {
  background: var(--vide);
  color: var(--encre);
  color-scheme: dark;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  touch-action: manipulation;
}
body {
  margin: 0;
  min-height: 100vh;
  min-height: 100svh;
  font-family: var(--display);
  font-weight: 400;
  font-size: var(--t-4);
  line-height: 1.55;
  color: var(--encre);
  background: var(--vide);
  overflow-x: hidden;
  font-kerning: normal;
  font-variant-ligatures: common-ligatures contextual;
}
body { position: relative; }
.ciel { position: fixed; inset: 0; z-index: 0; width: 100vw; height: 100vh; height: 100lvh; display: block; max-width: none; pointer-events: none; }
.grain {
  position: fixed; inset: 0; z-index: 1; pointer-events: none; opacity: .5;
  background-image: radial-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px);
  background-size: 3px 3px;
  mix-blend-mode: overlay;
}
body > main, body > .pied { position: relative; z-index: 2; }
@media print { .ciel, .grain { display: none; } }
@media (pointer: coarse) { .grain { display: none; } }
body:not(.page-accueil) { --ecl-x: 86vw; --ecl-y: 26vh; --ecl-r: 10vh; }
@media (max-width: 900px), (max-height: 500px) and (pointer: coarse) { body:not(.page-accueil) { --ecl-x: 89vw; --ecl-y: 12.5vh; --ecl-r: 3.2vh; } }
html:not(.js) .ciel, html.sans-gl .ciel { display: none; }
html:not(.js) body::before, html.sans-gl body::before {
  content: "";
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(circle at var(--ecl-x) var(--ecl-y),
    var(--vide) var(--ecl-r),
    rgba(255, 59, 46, .45) calc(var(--ecl-r) + 1px),
    rgba(255, 59, 46, .1) calc(var(--ecl-r) + min(var(--ecl-r) * .17, 6vh)),
    transparent calc(var(--ecl-r) + min(var(--ecl-r) * .38, 14vh)));
}
h1, h2, h3, h4, p, figure, ul, ol, dl, dd, table, blockquote, pre { margin: 0; }
h1, h2, h3, h4 { font-weight: 400; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
button { font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
img, svg, canvas, video { display: block; max-width: 100%; }
img { height: auto; }
em { font-style: italic; color: var(--encre); }
::selection { background: var(--encre); color: var(--vide); }
sup { font-size: max(.72em, 12px); line-height: 0; vertical-align: super; }
@media (max-width: 600px), (max-height: 500px) and (pointer: coarse) { sup { font-size: max(.72em, 13px); } }
.nw { white-space: nowrap; }
h1, h2, h3 { text-wrap: balance; }
p, dd { text-wrap: pretty; }
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--signal); outline-offset: 3px; }
main:focus-visible { outline: none; }
[id] { scroll-margin-top: calc(var(--entete-h) + var(--sur-haut)); }
.mono { font-family: var(--mono); font-size: var(--t-date); letter-spacing: .02em; line-height: 1.5; font-variant-numeric: tabular-nums; }
.tele { font-family: var(--mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; line-height: 1.6; font-variant-numeric: tabular-nums; }
.tele-s { font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; line-height: 1.6; color: var(--encre-3); font-variant-numeric: tabular-nums; }
@media (max-width: 760px), (max-height: 500px) and (pointer: coarse) { .tele, .tele-s { font-size: 13px; letter-spacing: .08em; } }
.signal { color: var(--signal); }
.tele sup, .tele-s sup { text-transform: none; }
.visuellement-cache {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
[data-chiffre] { font-variant-numeric: tabular-nums; }
.evitement {
  position: fixed;
  top: -120px;
  left: max(var(--marge), var(--sur-g));
  z-index: 70;
  padding: 12px 16px;
  background: var(--vide);
  color: var(--encre);
  border: 1px solid var(--trait-2);
  font-size: var(--t-5);
}
.evitement:focus { top: calc(12px + var(--sur-haut)); }
body > main { min-height: 60vh; min-height: 60svh; }
body:not(.page-erreur) > main { padding-top: calc(var(--entete-h) + var(--sur-haut)); }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01s !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01s !important;
    scroll-behavior: auto !important;
  }
}
