/* ============================================================
   DESIGN TOKENS — EduAdmission
   Warm premium education consultancy design system
   ============================================================ */

:root {
  /* --- Primary warm brown --- */
  --primary:         #92400e;
  --primary-dark:    #78350f;
  --primary-light:   #b45309;
  --primary-50:      #fffbeb;
  --primary-100:     #fef3c7;
  --primary-700:     #78350f;

  /* --- Accent colors --- */
  --accent-purple:   #7c3aed;
  --accent-amber:    #d97706;
  --accent-amber-dark: #b45309;
  --accent-green:    #059669;
  --accent-violet:   #8b5cf6;
  --accent-orange:   #ea580c;

  /* --- Dark surfaces (hero, footer, CTA banner) — warm dark --- */
  --bg-dark:         #1c1210;
  --bg-dark-alt:     #292018;
  --bg-dark-accent:  #3d2b1f;

  /* --- Light surfaces — warm parchment --- */
  --bg-white:        #fefcf7;
  --bg-light:        #fefcf7;
  --bg-gray:         #faf5ed;
  --bg-light-alt:    #f5efe4;

  /* --- Text on light backgrounds --- */
  --text-dark:           #27180e;
  --text-dark-secondary: #6b5744;
  --text-dark-tertiary:  #9c8b78;

  /* --- Text on dark backgrounds --- */
  --text-primary:   #faf5ed;
  --text-secondary: #c4b5a1;
  --text-tertiary:  #8a7a68;

  /* --- Gradients --- */
  --gradient-hero:    linear-gradient(135deg, #1c1210 0%, #292018 50%, #3d2b1f 100%);
  --gradient-primary: linear-gradient(135deg, #92400e 0%, #b45309 100%);
  --gradient-text:    linear-gradient(135deg, #92400e, #d97706);

  /* --- Borders --- */
  --border-color:   #e8dfd2;
  --border-light:   #f0e9de;

  /* --- Shadows — warm tinted --- */
  --shadow-sm:         0 1px 2px rgba(39, 24, 14, 0.05);
  --shadow-card:       0 1px 3px rgba(39, 24, 14, 0.06), 0 1px 2px rgba(39, 24, 14, 0.04);
  --shadow-card-hover: 0 10px 25px rgba(39, 24, 14, 0.1), 0 4px 10px rgba(39, 24, 14, 0.05);
  --shadow-md:         0 4px 6px -1px rgba(39, 24, 14, 0.07), 0 2px 4px -2px rgba(39, 24, 14, 0.05);
  --shadow-lg:         0 10px 15px -3px rgba(39, 24, 14, 0.08), 0 4px 6px -4px rgba(39, 24, 14, 0.04);
  --shadow-xl:         0 20px 25px -5px rgba(39, 24, 14, 0.1), 0 8px 10px -6px rgba(39, 24, 14, 0.05);
  --shadow-2xl:        0 25px 50px -12px rgba(39, 24, 14, 0.2);
  --shadow-blue:       0 4px 14px rgba(146, 64, 14, 0.25);

  /* --- Border radius --- */
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-xl:   20px;
  --radius-2xl:  24px;
  --radius-full: 9999px;

  /* --- Typography --- */
  --font-display: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body:    'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:    'JetBrains Mono', 'Fira Code', monospace;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;
  --text-4xl:  2.25rem;
  --text-5xl:  3rem;
  --text-6xl:  3.75rem;
  --text-7xl:  4.5rem;

  /* --- Spacing --- */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;

  --section-y:    80px;
  --section-y-md: 56px;
  --section-y-sm: 40px;

  /* --- Transitions --- */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.2, 0.64, 1);
  --duration-fast:   150ms;
  --duration-normal: 250ms;
  --duration-slow:   400ms;

  /* --- Z-index layers --- */
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-overlay:  300;
  --z-modal:    400;
  --z-popup:    500;
  --z-toast:    600;
}