/* 123Ribbon · jetons de design · ATLAS
   Direction : la bibliotheque des rubans. Ivoire, encre, un seul rouge d'action.
   Toute valeur visuelle du site doit venir d'ici. */
:root {
  /* surfaces & encre */
  --ink: #17130F;
  --ink-soft: #3A322A;
  --ink-muted: #6E6357;
  --ink-faint: #9A8F82;
  --paper: #FBF7F0;
  --paper-2: #F5EEE2;
  --paper-3: #EDE3D3;
  --paper-4: #E4D7C3;
  --line: #E3D7C5;
  --line-strong: #CDBDA6;
  --white: #FFFFFF;

  /* un seul rouge d'action + accents de matiere */
  --red: #B33A2B;
  --red-deep: #8E2C21;
  --red-wash: #F6E6E1;
  --gold: #B4863F;
  --gold-wash: #F3EAD8;
  --sage: #6D7A62;
  --blush: #E7C7BC;
  --success: #3E6B4A;
  --warning: #9A6B1F;
  --danger: #8E2C21;

  /* teintes de famille */
  --fam-satin: #C9A227;
  --fam-organza: #C8D3D6;
  --fam-linen: #A99874;
  --fam-jute: #B98F5B;
  --fam-sisal: #C7B48C;
  --fam-raffia: #93A06A;
  --fam-crispy: #D9B7A6;
  --fam-curling: #C4574A;
  --fam-paper: #DCD2BF;
  --fam-bunting: #B33A2B;
  --fam-bows: #E1B7AC;

  /* caractere */
  --font-serif: "Fraunces", "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  --font-sans: "Figtree", "Segoe UI", system-ui, -apple-system, "Noto Sans", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", "Cascadia Mono", "SFMono-Regular", ui-monospace, monospace;

  /* echelle typographique fluide 390 -> 1440+ */
  --step--2: clamp(0.7rem, 0.68rem + 0.1vw, 0.75rem);
  --step--1: clamp(0.78rem, 0.74rem + 0.2vw, 0.86rem);
  --step-0: clamp(0.94rem, 0.9rem + 0.25vw, 1.02rem);
  --step-1: clamp(1.06rem, 1rem + 0.4vw, 1.2rem);
  --step-2: clamp(1.3rem, 1.16rem + 0.75vw, 1.7rem);
  --step-3: clamp(1.62rem, 1.38rem + 1.25vw, 2.35rem);
  --step-4: clamp(2.05rem, 1.6rem + 2.4vw, 3.4rem);
  --step-5: clamp(2.6rem, 1.8rem + 4.2vw, 5.2rem);
  --step-6: clamp(3.2rem, 1.9rem + 6.6vw, 7.6rem);
  --tracking-tight: -0.02em;
  --tracking-display: -0.03em;
  --tracking-label: 0.16em;
  --leading-tight: 1.04;
  --leading-snug: 1.22;
  --leading-body: 1.62;

  /* grille & rythme */
  --wrap: 1440px;
  --wrap-narrow: 760px;
  --wrap-wide: 1680px;
  --gut: clamp(18px, 4vw, 64px);
  --col-gap: clamp(16px, 2.2vw, 32px);
  --section-y: clamp(56px, 8vw, 132px);
  --section-y-sm: clamp(34px, 4.6vw, 72px);
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px;
  --s6: 32px; --s7: 48px; --s8: 64px; --s9: 96px; --s10: 128px;
  --radius: 2px;
  --radius-lg: 4px;
  --radius-pill: 999px;
  --hair: 1px solid var(--line);
  --hair-strong: 1px solid var(--line-strong);
  --measure: 64ch;
  --measure-tight: 44ch;
  --tap: 44px;
  --header-h: 64px;

  /* mouvement */
  --ease-silk: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-fold: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 180ms;
  --dur: 320ms;
  --dur-slow: 720ms;

  /* ombres douces */
  --shadow-card: 0 1px 2px rgba(23,19,15,.04), 0 12px 32px -18px rgba(23,19,15,.24);
  --shadow-lift: 0 2px 4px rgba(23,19,15,.05), 0 28px 60px -30px rgba(23,19,15,.35);
  --shadow-sheet: 0 40px 80px -40px rgba(23,19,15,.45);
  --shadow-inset: inset 0 1px 0 rgba(255,255,255,.6);

  /* profondeur */
  --z-base: 1;
  --z-header: 100;
  --z-sticky: 150;
  --z-drawer: 200;
  --z-overlay: 300;
  --z-toast: 400;
}
@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur: 0ms; --dur-slow: 0ms; }
}