/* ──────────────────────────────────────────────────────────────────
   CMS Source — Design tokens
   Palette client : white + #35858E + #7DA78C + #C2D099 + #E6EEC9
   ────────────────────────────────────────────────────────────────── */

/* TAN Whistling — police calligraphique du logo CMS·Source.
   Une seule graisse Regular fournie ; les `font-weight: 500/900`
   sont synthétisés par le navigateur pour épaissir le trait. */
@font-face {
  font-family: 'TAN Whistling';
  font-style: normal;
  font-weight: 100 900;             /* declarable range — synthetic boldening */
  font-display: swap;
  src: url('/assets/fonts/TANWHISTLING-Regular.woff2') format('woff2'),
       url('/assets/fonts/TANWHISTLING-Regular.ttf')   format('truetype');
}

:root {
  /* Couleurs primaires */
  --color-primary:        #35858E;
  --color-primary-rgb:    53, 133, 142;
  --color-primary-hover:  #2a6e75;
  --color-primary-pressed:#1f5359;
  --color-primary-soft:   #e8f3f4;
  --color-primary-foam:   #f4f9fa;

  --color-secondary:      #7DA78C;
  --color-secondary-rgb:  125, 167, 140;
  --color-secondary-hover:#65937a;
  --color-secondary-soft: #ecf2ee;

  --color-accent:         #C2D099;
  --color-accent-rgb:     194, 208, 153;
  --color-accent-soft:    #eef2dd;

  --color-surface:        #E6EEC9;
  --color-surface-soft:   #f4f8e2;
  --color-bg:             #FFFFFF;
  --color-bg-alt:         #fbfcf6;

  /* Encres typographiques */
  --color-ink:            #0F2122;
  --color-ink-strong:     #050d0e;
  --color-ink-soft:       #455657;
  --color-ink-muted:      #8b9999;
  --color-stone:          #c1c8c8;
  --color-hairline:       #DCE5E1;
  --color-hairline-strong:#bcc8c1;

  /* Statuts */
  --color-success:        #5C8266;
  --color-success-soft:   #e7efe9;
  --color-warning:        #C9963A;
  --color-warning-soft:   #f7eed5;
  --color-danger:         #C24545;
  --color-danger-soft:    #f6e0e0;
  --color-info:           var(--color-primary);
  --color-info-soft:      var(--color-primary-soft);

  /* Alias rétro-compatibles (utilisés dans le code historique avant unification du naming) */
  --color-primary-strong: var(--color-primary-pressed);  /* btn-link:hover, etc. */
  --color-warn:           var(--color-warning);          /* alias court */
  --color-warn-soft:      var(--color-warning-soft);     /* alias court */

  /* Typographie */
  --font-display: 'Cormorant Garamond', 'Garamond', 'Georgia', serif;
  --font-body:    'Fraunces', 'Iowan Old Style', 'Georgia', serif;
  --font-sans:    'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    'JetBrains Mono', 'Menlo', 'Consolas', monospace;
  --font-brand:   'TAN Whistling', 'Cormorant Garamond', 'Garamond', serif;
  --font-serif:   var(--font-display);  /* alias : utilisé sur titres élégants */

  --text-xs:    0.75rem;     /* 12 */
  --text-sm:    0.875rem;    /* 14 */
  --text-base:  1rem;        /* 16 */
  --text-md:    1.125rem;    /* 18 */
  --text-lg:    1.25rem;     /* 20 */
  --text-xl:    1.5rem;      /* 24 */
  --text-2xl:   1.875rem;    /* 30 */
  --text-3xl:   2.25rem;     /* 36 */
  --text-4xl:   3rem;        /* 48 */
  --text-hero:  clamp(2.5rem, 6vw, 4.75rem);

  --leading-tight:  1.15;
  --leading-snug:   1.3;
  --leading-normal: 1.55;
  --leading-relaxed:1.7;

  --tracking-tight:  -0.015em;
  --tracking-normal: 0;
  --tracking-wide:   0.04em;
  --tracking-caps:   0.16em;

  /* Espacements (4 px base) */
  --space-1:  0.25rem;   /*  4 px */
  --space-2:  0.5rem;    /*  8 px */
  --space-3:  0.75rem;   /* 12 px */
  --space-4:  1rem;      /* 16 px */
  --space-5:  1.25rem;   /* 20 px */
  --space-6:  1.5rem;    /* 24 px */
  --space-7:  1.875rem;  /* 30 px — utilisé sur les .card padding (~20 occurrences) */
  --space-8:  2rem;      /* 32 px */
  --space-10: 2.5rem;    /* 40 px */
  --space-12: 3rem;      /* 48 px */
  --space-16: 4rem;      /* 64 px */
  --space-20: 5rem;      /* 80 px */
  --space-24: 6rem;      /* 96 px */

  /* Rayons */
  --radius-xs:  4px;
  --radius-sm:  8px;
  --radius-md:  14px;
  --radius-lg:  22px;
  --radius-xl:  32px;
  --radius-pill:999px;

  /* Élévations sobres */
  --shadow-sm:  0 1px 2px rgba(15, 33, 34, 0.05),
                0 1px 1px rgba(15, 33, 34, 0.04);
  --shadow-md:  0 4px 12px rgba(15, 33, 34, 0.06),
                0 2px 4px rgba(15, 33, 34, 0.04);
  --shadow-lg:  0 12px 28px rgba(15, 33, 34, 0.08),
                0 4px 8px rgba(15, 33, 34, 0.04);
  --shadow-xl:  0 24px 56px rgba(15, 33, 34, 0.10),
                0 8px 16px rgba(15, 33, 34, 0.06);
  --shadow-focus: 0 0 0 3px rgba(var(--color-primary-rgb), 0.18);

  /* Transitions */
  --easing-standard: cubic-bezier(0.32, 0.72, 0.32, 1);
  --duration-fast:   140ms;
  --duration-base:   220ms;
  --duration-slow:   320ms;

  /* Layout */
  --container:      1200px;
  --container-wide: 1360px;
  --container-narrow: 720px;
  --header-h:       72px;
}