@font-face {
  font-family: "Barlow Condensed";
  src: url("../fonts/barlow-condensed-800.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Barlow Condensed";
  src: url("../fonts/barlow-condensed-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Barlow";
  src: url("../fonts/barlow-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Barlow";
  src: url("../fonts/barlow-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root {
  --c-anthracite: #1c1d1f;
  --c-anthracite-2: #2a2c2f;
  --c-anthracite-3: #3a3d41;
  --c-beton: #9a9a95;
  --c-beton-fonce: #5c5c58;
  --c-beton-clair: #d6d3cc;
  --c-blanc: #f4f1ec;
  --c-blanc-2: #e9e5de;
  --c-orange: #ff6a13;
  --c-orange-texte: #a84300;
  --c-erreur: #b3261e;
  --c-erreur-clair: #ff8a80;

  --f-titre: "Barlow Condensed", "Arial Narrow", "Roboto Condensed", sans-serif;
  --f-texte: "Barlow", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --fs-xs: 0.8125rem;
  --fs-s: 0.9375rem;
  --fs-m: 1.0625rem;
  --fs-l: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);
  --fs-h3: clamp(1.5rem, 1.25rem + 1vw, 2rem);
  --fs-h2: clamp(2.25rem, 1.6rem + 2.8vw, 4rem);
  --fs-h1: clamp(3rem, 1.8rem + 6vw, 7.5rem);
  --fs-chiffre: clamp(3.5rem, 2.5rem + 4vw, 6rem);

  --lh-titre: 0.92;
  --lh-texte: 1.6;
  --ls-titre: 0.01em;
  --ls-label: 0.14em;

  --s-1: 0.5rem;
  --s-2: 1rem;
  --s-3: 1.5rem;
  --s-4: 2rem;
  --s-5: 3rem;
  --s-6: 4rem;
  --s-section: clamp(4rem, 3rem + 5vw, 8rem);
  --gutter: clamp(1rem, 0.5rem + 2.5vw, 2.5rem);
  --w-max: 76rem;
  --w-texte: 40rem;

  --radius: 0;
  --bordure: 2px solid currentColor;
  --ombre-dure: 6px 6px 0 var(--c-orange);
  --ombre-dure-sombre: 6px 6px 0 var(--c-anthracite);

  --ease-lourd: cubic-bezier(0.2, 0.7, 0.1, 1);
  --t-rapide: 150ms;
  --t-moyen: 300ms;
  --t-lent: 700ms;

  --h-bandeau-demo: 2.25rem;
  --h-header: 4.25rem;
  --h-barre-mobile: 4rem;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --t-rapide: 0ms;
    --t-moyen: 0ms;
    --t-lent: 0ms;
  }
}