/* Triclic — jetons du site. Polices : Montserrat (titres et libellés), Lato (texte), hébergées dans ../fonts/ */
:root {
  --orange: #f78e1e;
  --black: #000000;
  --ink: #0e0e0e;
  --ink-raised: #171717;
  --line-dark: #2a2a2a;
  --line-dark-strong: #3a3a3a;
  --white: #ffffff;
  --text-on-dark: #d0d0d0;
  --muted-on-dark: #b0b0b0;
  --paper: #f4f2ee;
  --ink-on-light: #141414;
  --text-on-light: #3d3d39;
  --muted-on-light: #4a4a45;
  --line-light: #d8d5ce;
  --line-light-strong: #c9c5bc;
  --visual-light: #cfccc5;
  --danger: #b3261e;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;
  --space-7: 64px;
  --space-8: 112px;
  --radius-0: 0px;
  /* Rayons : source unique (angles arrondis partout, sauf sections pleine largeur et header) */
  --radius-card: 12px;                  /* cartes, panneaux, images encadrées, vignette du logo */
  --radius-btn: 8px;                    /* tous les boutons */
  --radius-input: 8px;                  /* champs, listes et zones de texte des formulaires */
  --radius-pill: 999px;                 /* étiquettes de catégorie */
  --radius-nav-btn: var(--radius-btn);  /* bouton Contact du menu : identique aux autres boutons */
  --radius-menu: var(--radius-btn);     /* ancien nom : sous-menu déroulant */
  --radius-media: var(--radius-card);   /* ancien nom : images encadrées */
  --border-1: 1px;
  --border-3: 3px;
  --container-max: 1216px;
  --header-height: 88px;
  --font-display: "Montserrat", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --font-sans: "Lato", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --font-mono: var(--font-display);   /* ancien alias : les libellés techniques sont désormais en Montserrat */
}

.tc-display { font-family: var(--font-display); font-size: 80px; line-height: 1.05; font-weight: 800; letter-spacing: -0.01em; }
.tc-h1 { font-family: var(--font-display); font-size: 56px; line-height: 1.05; font-weight: 800; letter-spacing: -0.01em; }
.tc-h1-sub { font-family: var(--font-display); font-size: 30px; line-height: 1.2; font-weight: 600; letter-spacing: 0; }
.tc-h2-xl { font-family: var(--font-display); font-size: 60px; line-height: 1.05; font-weight: 800; letter-spacing: -0.01em; }
.tc-h2 { font-family: var(--font-display); font-size: 40px; line-height: 1.1; font-weight: 800; letter-spacing: -0.01em; }
.tc-h2-sm { font-family: var(--font-display); font-size: 34px; line-height: 1.1; font-weight: 800; letter-spacing: -0.01em; }
.tc-numeral { font-family: var(--font-display); font-size: 56px; line-height: 1; font-weight: 700; letter-spacing: 0; }
.tc-h3-xl { font-family: var(--font-display); font-size: 40px; line-height: 1.15; font-weight: 600; letter-spacing: -0.01em; }
.tc-h3 { font-family: var(--font-display); font-size: 24px; line-height: 1.25; font-weight: 600; letter-spacing: 0; }
.tc-h4 { font-family: var(--font-display); font-size: 20px; line-height: 1.35; font-weight: 600; letter-spacing: 0; }
.tc-lead { font-family: var(--font-sans); font-size: 20px; line-height: 1.6; font-weight: 400; letter-spacing: normal; }
.tc-body { font-family: var(--font-sans); font-size: 18px; line-height: 1.6; font-weight: 400; letter-spacing: normal; }
.tc-ui { font-family: var(--font-sans); font-size: 18px; line-height: 1.25; font-weight: 600; letter-spacing: normal; }
.tc-caption { font-family: var(--font-display); font-size: 13px; line-height: 1.6; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.tc-label { font-family: var(--font-display); font-size: 13px; line-height: 1.4; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }

@font-face { font-family: "Montserrat"; src: url("../fonts/montserrat-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../fonts/montserrat-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../fonts/montserrat-latin-800-normal.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Lato"; src: url("../fonts/lato-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Lato"; src: url("../fonts/lato-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }