/*
 * Design tokens — frozen snapshot, copied from:
 *   webui/frontend/src/lib/styles.css
 *   webui/frontend/src/lib/home/home-tokens.css
 * (as of 2026-08-30). This file is a COPY, not an import: this folder is
 * standalone and must not depend on any file from the Svelte frontend at
 * build or runtime. If the main app's visual identity evolves, port the
 * changes here manually.
 *
 * Self-hosted fonts (see below) instead of the Google Fonts CDN import used
 * by the main app — avoids a third-party request for fonts specifically (the
 * page separately loads Google Analytics behind its own consent banner, see
 * js/consent.js and privacy.html#cookies).
 */

@font-face {
  font-family: "Big Shoulders Display";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/big-shoulders-display-variable.woff2") format("woff2");
}
@font-face {
  font-family: "Big Shoulders Display";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../assets/fonts/big-shoulders-display-variable.woff2") format("woff2");
}
@font-face {
  font-family: "Big Shoulders Display";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../assets/fonts/big-shoulders-display-variable.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/ibm-plex-sans-variable.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/ibm-plex-sans-variable.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../assets/fonts/ibm-plex-sans-variable.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../assets/fonts/ibm-plex-sans-variable.woff2") format("woff2");
}
@font-face {
  font-family: "Fragment Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/fragment-mono-400.woff2") format("woff2");
}

:root {
  --bg: #e7eef1;
  --surface: #f3f7f8;
  --border: #c3d0d6;
  --text: #14202b;
  --text-muted: #445264;
  --primary: #2a4a78;
  --primary-contrast: #ffffff;
  --focus-ring: #2a4a78;
  --error: #a83a32;

  /* Confiance moyenne/haute (glyphe "borne") — jamais utilisées comme accent décoratif */
  --confiance-high: #2f6e51;
  --confiance-high-bg: #e1ede6;
  --confiance-mid: #b8863c;
  --confiance-mid-bg: #f3e9d8;

  --font-display: "Big Shoulders Display", "Arial Narrow", sans-serif;
  --font-body: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "Fragment Mono", ui-monospace, "SF Mono", Consolas, monospace;

  --rayon: 3px;
  --grille-pas: 8px;
  --grille-opacite: 0.07;
  --ombre: 0 1px 2px rgba(20, 32, 43, 0.06), 0 6px 16px rgba(20, 32, 43, 0.06);

  --landing-primary-ink: #16283f;
  --landing-primary-tint: #dce6ee;
  --landing-ink-text: #f3f7f8;
  --accent-cuivre: #a8672c;
  --accent-cuivre-clair: #f1e2d0;
  --accent-cuivre-hover: #8f5825;

  --landing-grille-pas: 24px;
  --landing-rayon-lg: 2px;
  --landing-max-width: 1180px;
  --landing-space-section: clamp(44px, 6vw, 80px);

  --landing-h1: clamp(2.75rem, 4vw + 1.5rem, 6rem);
  --landing-h2: clamp(1.75rem, 1.6vw + 1.2rem, 2.5rem);
  --landing-lead: clamp(1.05rem, 0.4vw + 1rem, 1.25rem);
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0d1319;
    --surface: #1b2530;
    --border: #32404d;
    --text: #e7eef1;
    --text-muted: #93a3b3;
    --primary: #7ea3d6;
    --primary-contrast: #0d1319;
    --focus-ring: #7ea3d6;
    --error: #e2685c;

    --confiance-high: #6fbf9a;
    --confiance-high-bg: #16281f;
    --confiance-mid: #d9ab5f;
    --confiance-mid-bg: #2c2416;

    --landing-primary-ink: #0a1420;
    --landing-primary-tint: #1c2c40;
    --accent-cuivre: #d9a066;
    --accent-cuivre-clair: #2c2416;
    --accent-cuivre-hover: #b88857;
  }
}
