/* ================================================================
   WWTEC - Design Tokens 2024
   Palette : Teal, Slate, Amber (sans rouge ni violet)
   ================================================================ */

:root {
  /* Couleurs principales - Teal professionnel */
  --wwtec-primary: #0d9488;
  --wwtec-primary-rgb: 13, 148, 136;
  --wwtec-primary-dark: #0f766e;
  --wwtec-primary-light: #2dd4bf;
  --wwtec-primary-soft: rgba(13, 148, 136, 0.1);
  
  /* Secondaire - Slate neutre */
  --wwtec-secondary: #1e293b;
  --wwtec-secondary-rgb: 30, 41, 59;
  --wwtec-secondary-light: #334155;
  
  /* Accent - Teal clair (complémentaire au primaire) */
  --wwtec-accent: #14b8a6;
  --wwtec-accent-rgb: 20, 184, 166;
  --wwtec-accent-soft: rgba(20, 184, 166, 0.12);
  
  /* Orange réservé au chatbot uniquement */
  --wwtec-chatbot: #fe9603;
  
  /* Neutres */
  --wwtec-text: #0f172a;
  --wwtec-text-muted: #64748b;
  --wwtec-text-light: #94a3b8;
  --wwtec-bg: #ffffff;
  --wwtec-bg-alt: #f8fafc;
  --wwtec-bg-subtle: #f1f5f9;
  --wwtec-border: #e2e8f0;
  --wwtec-border-light: #f1f5f9;
  
  /* Ombres */
  --wwtec-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --wwtec-shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.06);
  --wwtec-shadow-md: 0 4px 20px rgba(15, 23, 42, 0.08);
  --wwtec-shadow-lg: 0 12px 40px rgba(15, 23, 42, 0.1);
  --wwtec-shadow-xl: 0 24px 60px rgba(15, 23, 42, 0.12);
  --wwtec-shadow-glow: 0 0 40px rgba(13, 148, 136, 0.15);
  
  /* Transitions */
  --wwtec-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --wwtec-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --wwtec-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --wwtec-transition-fast: 0.2s var(--wwtec-ease);
  --wwtec-transition: 0.35s var(--wwtec-ease);
  --wwtec-transition-slow: 0.5s var(--wwtec-ease-out);
  
  /* Typographie */
  --wwtec-font-heading: 'Plus Jakarta Sans', -apple-system, sans-serif;
  --wwtec-font: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --wwtec-font-mono: 'JetBrains Mono', 'Fira Code', monospace;
  
  /* Espacement */
  --wwtec-space-xs: 0.25rem;
  --wwtec-space-sm: 0.5rem;
  --wwtec-space: 1rem;
  --wwtec-space-lg: 1.5rem;
  --wwtec-space-xl: 2rem;
  --wwtec-space-2xl: 3rem;
  --wwtec-space-3xl: 4rem;
  --wwtec-section-padding: 6rem;
  
  /* Rayons */
  --wwtec-radius-xs: 6px;
  --wwtec-radius-sm: 10px;
  --wwtec-radius: 14px;
  --wwtec-radius-lg: 20px;
  --wwtec-radius-xl: 28px;
  --wwtec-radius-full: 9999px;
}
