/* ==========================================================================
   TekyMag — Design tokens
   Source of truth: Kit Logo TekyMag / 08_WEB_EXPORTS / tekymag-tokens.css
   Palette and type ramp below are copied verbatim from the validated brand
   kit; only prototype-only additions (shadows, motion, z-index, wide
   container) are new and clearly marked.
   ========================================================================== */

:root {
  /* ---- Couleurs de marque (brand kit — ne pas modifier) ---- */
  --teky-navy: #0B1F33;
  --teky-cyan: #11B5E4;
  --teky-grey: #F3F5F7;
  --teky-charcoal: #111111;
  --teky-white: #FFFFFF;

  --teky-navy-900: #06131F;
  --teky-navy-700: #16324D;
  --teky-cyan-700: #0A8CB4;
  --teky-cyan-100: #E4F6FC;
  --teky-line: #DDE3E9;
  --teky-muted: #5B6B7A;

  /* ---- Typographie (brand kit) ---- */
  --teky-font-display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --teky-font-text: 'Source Serif 4', Georgia, serif;
  --teky-font-ui: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --teky-font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --teky-font-accent: 'Lobster Two', cursive; /* usage exclusif : logo & clins d'oeil ponctuels */

  --teky-h1: clamp(2rem, 4vw, 3.25rem);
  --teky-h2: clamp(1.5rem, 2.6vw, 2.125rem);
  --teky-h3: 1.375rem;
  --teky-lead: 1.1875rem;
  --teky-body: 1.0625rem;
  --teky-meta: 0.8125rem;

  --teky-lh-tight: 1.06;
  --teky-lh-title: 1.14;
  --teky-lh-body: 1.62;

  /* ---- Rythme & formes (brand kit) ---- */
  --teky-radius: 6px;
  --teky-radius-lg: 12px;
  --teky-radius-icon: 22%;
  --teky-space: 8px;
  --teky-container: 1200px;
  --teky-logo-ratio: 1.8567;
  --teky-logo-min: 96px;
  --teky-logo-clear: 0.25;

  /* ---- Extensions prototype (Phase 1 uniquement) ---- */
  --teky-container-wide: 1320px;
  --teky-container-narrow: 760px;   /* colonne de lecture article */
  --teky-container-mid: 980px;      /* pages statiques, formulaires */
  --teky-gutter: clamp(20px, 4vw, 40px);

  --teky-radius-sm: 4px;
  --teky-radius-pill: 999px;

  --teky-shadow-sm: 0 1px 2px rgba(11, 31, 51, 0.06), 0 1px 1px rgba(11, 31, 51, 0.04);
  --teky-shadow-md: 0 6px 16px rgba(11, 31, 51, 0.10);
  --teky-shadow-lg: 0 16px 40px rgba(11, 31, 51, 0.16);
  --teky-shadow-focus: 0 0 0 3px rgba(17, 181, 228, 0.35);

  --teky-ease: cubic-bezier(.4,0,.2,1);
  --teky-duration-fast: 140ms;
  --teky-duration: 220ms;
  --teky-duration-slow: 360ms;

  --teky-z-header: 500;
  --teky-z-overlay: 900;
  --teky-z-panel: 950;
  --teky-z-toast: 1000;

  /* ---- Couleurs fonctionnelles (etats, non-brand) ---- */
  --teky-success: #1C9A6C;
  --teky-success-bg: #E7F7F0;
  --teky-error: #D6404A;
  --teky-error-bg: #FCEBEC;
  --teky-warning: #B4740E;
  --teky-warning-bg: #FBF1DF;

  /* ---- Couleurs par verticale editoriale (usage : accent fin, jamais un badge plein) ---- */
  --teky-c-web: #0A8CB4;
  --teky-c-ia: #6B4FD8;
  --teky-c-marketing: #C4720A;
  --teky-c-social: #D23E77;
  --teky-c-tech: #11B5E4;
  --teky-c-outils: #1C9A6C;
}