/* Van Trotter — Color tokens
   Source: Guide de l'identité visuelle (uploads/guide-identite-visuelle.pdf)
   Two dominant brand colors (Bleu-vert, Orange brûlé) + a reserved accent (Beige).
   Neutrals are derived in oklch from the blue-green hue so grays read warm, not clinical. */

:root {
  /* ---- Brand hues (exact values from the brand guide) ---- */
  --brand-blue-green: #5c8381;
  --brand-orange: #b96a3b;
  --brand-beige: #caac8b;
  --brand-black: #000000;
  --brand-white: #ffffff;

  /* ---- Blue-green ramp (primary) ---- */
  --blue-green-10: oklch(96% 0.014 185);
  --blue-green-20: oklch(90% 0.03 185);
  --blue-green-40: oklch(75% 0.055 185);
  --blue-green-60: oklch(58% 0.06 185);   /* ≈ brand-blue-green */
  --blue-green-70: oklch(50% 0.06 185);
  --blue-green-90: oklch(28% 0.04 185);

  /* ---- Orange brûlé ramp (primary) ---- */
  --orange-10: oklch(96% 0.02 55);
  --orange-20: oklch(90% 0.05 55);
  --orange-40: oklch(76% 0.1 50);
  --orange-60: oklch(60% 0.13 45);   /* ≈ brand-orange */
  --orange-70: oklch(52% 0.13 42);
  --orange-90: oklch(30% 0.09 40);

  /* ---- Beige ramp (reserved accent — use sparingly, per brand guide) ---- */
  --beige-10: oklch(97% 0.012 80);
  --beige-20: oklch(92% 0.025 80);
  --beige-40: oklch(82% 0.045 75);
  --beige-60: oklch(73% 0.06 70);   /* ≈ brand-beige */
  --beige-80: oklch(55% 0.05 65);

  /* ---- Neutrals (warm-tinted grays, hue borrowed from blue-green) ---- */
  --neutral-0: #ffffff;
  --neutral-10: oklch(98% 0.003 185);
  --neutral-20: oklch(94% 0.004 185);
  --neutral-30: oklch(88% 0.005 185);
  --neutral-40: oklch(78% 0.006 185);
  --neutral-50: oklch(64% 0.007 185);
  --neutral-60: oklch(50% 0.007 185);
  --neutral-70: oklch(38% 0.006 185);
  --neutral-80: oklch(26% 0.005 185);
  --neutral-90: oklch(16% 0.004 185);
  --neutral-100: #000000;

  /* ---- Semantic surfaces ---- */
  --surface-page: var(--neutral-10);
  --surface-card: var(--neutral-0);
  --surface-sunken: var(--neutral-20);
  --surface-inverse: var(--neutral-90);
  --surface-brand: var(--blue-green-60);
  --surface-brand-subtle: var(--blue-green-10);
  --surface-accent-subtle: var(--beige-10);

  /* ---- Semantic text ---- */
  --text-primary: var(--neutral-90);
  --text-secondary: var(--neutral-60);
  --text-tertiary: var(--neutral-50);
  --text-inverse: var(--neutral-0);
  --text-brand: var(--blue-green-70);
  --text-link: var(--blue-green-70);
  --text-link-hover: var(--blue-green-90);

  /* ---- Semantic borders ---- */
  --border-subtle: var(--neutral-30);
  --border-default: var(--neutral-40);
  --border-strong: var(--neutral-60);
  --border-brand: var(--blue-green-60);
  --focus-ring: var(--orange-60);

  /* ---- Semantic states ---- */
  --state-success: oklch(55% 0.09 155);
  --state-success-subtle: oklch(94% 0.03 155);
  --state-warning: var(--orange-60);
  --state-warning-subtle: var(--orange-10);
  --state-error: oklch(52% 0.14 25);
  --state-error-subtle: oklch(95% 0.03 25);
  --state-info: var(--blue-green-60);
  --state-info-subtle: var(--blue-green-10);
}