/* Renaflow : jetons de design. Une seule palette, clair par défaut, sombre selon le système. */

@font-face {
  font-family: "Bricolage Grotesque";
  src: url("../fonts/bricolage-grotesque.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Figtree";
  src: url("../fonts/figtree.woff2") format("woff2");
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Marque */
  --prune: #43042c;
  --plum: #6e1a4f;
  --petal: #d8a3ae;
  /* Accent chaud, réservé aux fonds prune (8,6:1 de contraste) : boutons, puces, petits titres. Jamais sur fond clair. */
  --apricot: #f5ab97;

  /* Surfaces et texte : fond ivoire chaud, un seul thème clair */
  color-scheme: light;
  --bg: #fbf6f2;
  --bg-soft: #f3e8e4;
  --surface: #fffdfb;
  --ink: #43042c;
  --ink-soft: #6b5058;
  --em: #6e1a4f;
  --line: rgba(67, 4, 44, 0.16);

  /* Bouton principal */
  --btn-bg: var(--prune);
  --btn-ink: #fbf6f2;

  /* Bloc de couleur (cures, pied de page) */
  --block-bg: var(--prune);
  --block-ink: #fbf6f2;
  --block-soft: #ecd6d8;

  --focus: #6e1a4f;
  --shadow: 0 28px 60px -28px rgba(67, 4, 44, 0.4);

  --font-display: "Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body: "Figtree", "Segoe UI", system-ui, sans-serif;

  /* Formes : boutons et pastilles en pilule, cartes et photos à 28px */
  --r-card: 28px;
  --r-pill: 999px;

  --wrap: 1280px;
  --gutter: clamp(16px, 4vw, 48px);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);

  /* Échelle des couches : nav, panneau collant mobile */
  --z-nav: 40;
  --z-sheet: 30;
}