/* Les Décanteurs — feuille unique du design system.
   Les tokens sont concaténés ici : une chaîne de @import sérialise les
   requêtes et retarde le premier rendu. */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,700;0,9..40,800;0,9..40,900;1,9..40,400&family=DM+Serif+Display:ital@0;1&family=Inter:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

/* ===== tokens/fonts.css ===== */
/* Les Décanteurs — Webfonts
   DM Sans (display/titres), Inter (body), DM Serif Display (editorial accent).
   All three are Google Fonts. Loaded via the Google Fonts CSS API so consumers
   who link styles.css get the full family closure with no local binaries. */

/* ===== tokens/colors.css ===== */
/* Les Décanteurs — Colour system
   Source of truth: brand board "Palette 2 — Premium & Contemporaine".
   Couleur de marque = Rouge corail. */
:root{
  /* ---- Base palette (brand board) ---- */
  --decant-bleu-nuit:#172A3A;   /* Bleu nuit — primary dark / default ink */
  --decant-vert-menthe:#8FE3CF; /* Vert menthe — soft accent */
  --decant-corail:#FF5A45;      /* Rouge corail — couleur de marque */
  --decant-ivoire:#FAF7F0;      /* Ivoire — page background */
  --decant-noir-doux:#202020;   /* Noir doux — deep neutral */
  --decant-blanc:#FFFFFF;

  /* ---- Derived / supporting shades ---- */
  --decant-bleu-nuit-deep:#0E1C28; /* deeper navy for footers / overlays */
  --decant-bleu-nuit-2:#29434E;    /* muted navy for secondary nav text */
  --decant-corail-dark:#E64B38;    /* corail hover / pressed */
  --decant-vert-menthe-soft:#DDF8F1;/* mint tint — badges, hovers */
  --decant-vert-menthe-ink:#21665D; /* readable text on mint */
  --decant-muted:#5F6C73;          /* muted body text */

  /* ---- Semantic aliases ---- */
  --color-bg:var(--decant-ivoire);
  --surface-page:var(--decant-ivoire);
  --surface-card:var(--decant-blanc);
  --surface-dark:var(--decant-bleu-nuit);
  --surface-dark-deep:var(--decant-bleu-nuit-deep);
  --surface-mint:var(--decant-vert-menthe);
  --surface-mint-soft:var(--decant-vert-menthe-soft);

  --text-body:var(--decant-bleu-nuit);
  --text-muted:var(--decant-muted);
  --text-on-dark:var(--decant-blanc);
  --text-on-dark-muted:#AFC0C6;

  --brand:var(--decant-corail);
  --brand-hover:var(--decant-corail-dark);
  --brand-contrast:var(--decant-blanc);
  --accent-mint:var(--decant-vert-menthe);

  --line:rgba(23,42,58,.12);
  --line-strong:rgba(23,42,58,.22);
  --line-on-dark:rgba(255,255,255,.10);

  /* Link colours (consumers add links later) */
  --link:var(--decant-corail);
  --link-hover:var(--decant-corail-dark);
}

/* ===== tokens/typography.css ===== */
/* Les Décanteurs — Typography
   DM Sans = titres & UI (bold, tight, often UPPERCASE).
   Inter = texte courant (readable, digital).
   DM Serif Display = accent éditorial (italic: citations, appellations). */
:root{
  --font-display:'DM Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --font-body:'Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --font-editorial:'DM Serif Display',Georgia,'Times New Roman',serif;

  /* Weights */
  --fw-regular:400; /* @kind font */
  --fw-medium:500; /* @kind font */
  --fw-semibold:600; /* @kind font */
  --fw-bold:700; /* @kind font */
  --fw-extrabold:800; /* @kind font */
  --fw-black:900; /* @kind font */

  /* Display / heading scale (fluid) */
  --fs-display:clamp(3.4rem,8.5vw,8.4rem); /* @kind font */
  --fs-h1:clamp(2.6rem,5.4vw,5.8rem); /* @kind font */
  --fs-h2:clamp(2rem,3.4vw,3.4rem); /* @kind font */
  --fs-h3:clamp(1.5rem,2.4vw,2.5rem); /* @kind font */
  --fs-title:1.45rem; /* @kind font */
  --fs-lead:1.14rem; /* @kind font */
  --fs-body:1rem; /* @kind font */
  --fs-small:.88rem; /* @kind font */
  --fs-kicker:.72rem; /* @kind font */

  /* Line heights */
  --lh-tight:.92; /* @kind font */
  --lh-snug:1.05; /* @kind font */
  --lh-normal:1.5; /* @kind font */
  --lh-relaxed:1.75; /* @kind font */

  /* Letter spacing */
  --ls-display:-.065em; /* @kind font */
  --ls-tight:-.04em; /* @kind font */
  --ls-normal:0; /* @kind font */
  --ls-kicker:.14em; /* @kind font */
}

/* ===== tokens/spacing.css ===== */
/* Les Décanteurs — Spacing, radius, layout */
:root{
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-8:32px;
  --space-10:40px;
  --space-12:48px;
  --space-16:64px;
  --space-20:80px;
  --space-28:118px;   /* section vertical rhythm */

  --radius-sm:12px;   /* buttons, inputs, small chips */
  --radius-md:16px;   /* controls, small cards */
  --radius-lg:24px;   /* cards, panels */
  --radius-xl:34px;   /* hero stage, feature blocks */
  --radius-pill:999px;/* badges, chips, round buttons */

  --container:1240px; /* @kind other */
  --container-gutter:20px; /* @kind spacing */
}

/* ===== tokens/effects.css ===== */
/* Les Décanteurs — Shadows, motion, transitions */
:root{
  /* Elevation — soft, wide, cool-navy tinted (never pure black) */
  --shadow-sm:0 8px 20px rgba(23,42,58,.06);
  --shadow-md:0 22px 55px rgba(23,42,58,.14);
  --shadow-card:0 28px 90px rgba(14,28,40,.16);
  --shadow-brand:0 14px 36px rgba(255,90,69,.28); /* on coral CTAs */

  /* Motion — quick, confident ease-out; playful lift + slight rotate on hover */
  --ease:cubic-bezier(.22,.61,.36,1); /* @kind other */
  --dur-fast:.2s; /* @kind other */
  --dur:.25s; /* @kind other */
  --dur-slow:.5s; /* @kind other */
  --lift:translateY(-3px); /* @kind other */
  --lift-card:translateY(-8px); /* @kind other */
}