/* Jetons de la page de téléchargement : mêmes valeurs que l'application (src/styles/base.css). */

@font-face { font-family: "Satoshi"; src: url("/polices/satoshi-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Satoshi"; src: url("/polices/satoshi-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Satoshi"; src: url("/polices/satoshi-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Sentient"; src: url("/polices/sentient-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }

:root {
  --color-paper: oklch(0.975 0.004 80);
  --color-surface: oklch(0.995 0.002 80);
  --color-ink: oklch(0.24 0.012 60);
  --color-ink-2: oklch(0.5 0.012 60);
  --color-rule: oklch(0.92 0.005 80);
  --color-rule-strong: oklch(0.87 0.006 80);
  --color-accent: oklch(0.36 0.06 222);
  --color-accent-hover: oklch(0.43 0.06 222);
  --color-accent-ink: oklch(0.99 0.004 222);
  --color-accent-veil: oklch(0.955 0.018 222);
  --color-focus: oklch(0.36 0.06 222);
  --color-note: oklch(0.5 0.12 58);
  --color-note-veil: oklch(0.968 0.03 80);
  --color-muted-fill: oklch(0.94 0.004 80);
  /* Bande pétrole (la couleur de la carte « Prochaine action » de l'app) */
  --color-band: oklch(0.33 0.055 222);
  --color-band-ink: oklch(0.985 0.004 222);
  --color-band-ink-2: oklch(0.86 0.025 222);
  --color-band-rule: oklch(0.45 0.05 222);
  --color-nav: oklch(0.975 0.004 80 / 0.82);

  --font-display: "Sentient", Georgia, serif;
  --font-body: "Satoshi", system-ui, sans-serif;

  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 4.5rem;
  --space-3xl: 7rem;
  --space-4xl: 9.5rem;

  --text-sm: 0.875rem;
  --text-md: 1rem;
  --text-lg: 1.25rem;
  --text-xl: clamp(1.75rem, 1.4vw + 1.25rem, 2.375rem);
  --text-display: clamp(2.5rem, 3.6vw + 1.2rem, 4.25rem);

  --radius-card: 14px;
  --radius-pill: 999px;
  --radius-image: 12px;

  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --dur-short: 160ms;

  color-scheme: light;
}
