/* Florska V2 — tokens : polices locales (OFL), couleurs, typo, espaces, mouvement. */

@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url('../fonts/archivo-var-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/ibm-plex-mono-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/ibm-plex-mono-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* Couleurs */
  --fl-bg: #0B0B0C;
  --fl-surface: #151517;
  --fl-surface-2: #1F1F22;
  --fl-line: #34343A;
  --fl-line-soft: #1F1F22;
  --fl-line-strong: #6B6B72;
  --fl-text: #F2F0EB;
  --fl-text-2: #D6D4CF;
  --fl-muted: #A8A59E;
  --fl-muted-light: #55534E;
  --fl-accent: #E62F33;
  --fl-action: #C8262A;
  --fl-action-hover: #A91F23;
  --fl-ink-hover: #26262A;
  --fl-bone: #F2F0EB;
  --fl-ink: #0B0B0C;
  --fl-white: #FFFFFF;
  --fl-scrim: rgb(11 11 12 / .86);

  /* Typographie */
  --fl-font: 'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fl-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --fl-fs-body: 17px;
  --fl-fs-lead: clamp(17px, 1.3vw, 19px);
  --fl-fs-h1: clamp(40px, 6.2vw, 104px);
  --fl-fs-h2: clamp(30px, 3.4vw, 52px);
  --fl-fs-h3: clamp(20px, 1.6vw, 26px);
  --fl-fs-mono: 12px;

  /* Mise en page */
  --fl-max: 1440px;
  --fl-gutter: clamp(20px, 5vw, 64px);
  --fl-gap: 24px;
  --fl-sec: clamp(72px, 9vw, 128px);
  --fl-header-h: 88px;
  --fl-tap: 44px;

  /* Mouvement (MK-SPEC §2) : plafond 300 ms */
  --fl-ease-out: cubic-bezier(.19, 1, .22, 1);
  --fl-ease-inout: cubic-bezier(.7, 0, .2, 1);
  --fl-ease-in: cubic-bezier(.55, 0, .9, .4);
  --fl-t-xs: 120ms;
  --fl-t-s: 180ms;
  --fl-t-m: 240ms;
  --fl-t-l: 280ms;
  --fl-shift: 16px;
  --fl-par: 24px;
}

/* Très petits écrans (< 380 px) : titres en capitales étendues sans débordement. */
@media (max-width: 379px) {
  :root { --fl-fs-h2: 26px; }
}
