/**
 * HAS Design System Tokens & Color Palette
 * Brand: HAS (HEX Automation Services)
 * Visual Identity: Onyx (#080912), Midnight Indigo (#181036), Royal Amethyst (#6B30D9), Signature Gold (#F2C14E), Pearl White (#F7F7F7), Energy Amber (#F68A00)
 * Tagline: AUTOMATE • OPTIMIZE • GROW
 */

@import url('https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,300..900;1,300..900&family=Sora:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root {
  /* -------------------------------------------------------------------------
   * Brand Color Palette (HAS Canonical Visual Identity)
   * ------------------------------------------------------------------------- */
  /* Onyx Foundation */
  --has-onyx: #080912;
  --has-onyx-surface: #0e0f1d;
  --has-onyx-card: #14132b;
  --has-onyx-elevated: #1a1738;
  --has-onyx-border: rgba(107, 48, 217, 0.2);
  
  /* Midnight Indigo */
  --has-indigo: #3730a3;
  --has-indigo-midnight: #181036;
  --has-indigo-light: #6366f1;
  --has-indigo-glow: rgba(99, 102, 241, 0.25);

  /* Royal Amethyst Purple */
  --has-purple: #6b30d9;
  --has-purple-amethyst: #6b30d9;
  --has-purple-light: #905cf6;
  --has-purple-glow: rgba(107, 48, 217, 0.35);
  --has-purple-muted: rgba(107, 48, 217, 0.14);

  /* Signature Gold */
  --has-gold: #f2c14e;
  --has-gold-signature: #f2c14e;
  --has-gold-light: #fbe089;
  --has-gold-glow: rgba(242, 193, 78, 0.32);
  --has-gold-muted: rgba(242, 193, 78, 0.14);

  /* Pearl White */
  --has-white: #f7f7f7;
  --has-white-pearl: #f7f7f7;
  --has-white-pure: #ffffff;

  /* Energy Amber */
  --has-amber: #f68a00;
  --has-amber-energy: #f68a00;
  --has-amber-glow: rgba(246, 138, 0, 0.28);

  /* Cyan Accent (Technical Highlights) */
  --has-cyan: #00e5ff;
  --has-cyan-glow: rgba(0, 229, 255, 0.2);
  --has-emerald: #10b981;
  --has-rose: #f43f5e;

  /* Semantic Background Aliases */
  --has-bg-base: var(--has-onyx);
  --has-bg-surface: var(--has-onyx-surface);
  --has-bg-card: var(--has-onyx-card);
  --has-bg-elevated: var(--has-onyx-elevated);
  --has-bg-glass: rgba(8, 9, 18, 0.88);

  /* Typography Colors */
  --has-text-primary: var(--has-white);
  --has-text-secondary: #9aa5b8;
  --has-text-muted: #6b778c;
  --has-text-accent: var(--has-purple-light);
  --has-text-gold: var(--has-gold-signature);
  --has-text-inverted: var(--has-onyx);

  /* Borders & Dividers */
  --has-border-subtle: rgba(255, 255, 255, 0.08);
  --has-border-medium: rgba(107, 48, 217, 0.25);
  --has-border-accent: rgba(107, 48, 217, 0.5);
  --has-border-gold: rgba(242, 193, 78, 0.45);
  --has-border-focus: var(--has-purple-light);

  /* Typography Families */
  --has-font-display: 'Exo 2', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --has-font-sans: 'Sora', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --has-font-mono: 'JetBrains Mono', 'Fira Code', 'Roboto Mono', Menlo, Consolas, monospace;

  /* Type Scale */
  --has-text-xs: 0.75rem;    /* 12px */
  --has-text-sm: 0.875rem;   /* 14px */
  --has-text-base: 1rem;     /* 16px */
  --has-text-lg: 1.125rem;   /* 18px */
  --has-text-xl: 1.25rem;    /* 20px */
  --has-text-2xl: 1.5rem;    /* 24px */
  --has-text-3xl: 1.875rem;  /* 30px */
  --has-text-4xl: 2.25rem;   /* 36px */
  --has-text-5xl: 3rem;      /* 48px */
  --has-text-6xl: 3.75rem;   /* 60px */

  /* Spacing Scale */
  --has-space-1: 0.25rem;
  --has-space-2: 0.5rem;
  --has-space-3: 0.75rem;
  --has-space-4: 1rem;
  --has-space-6: 1.5rem;
  --has-space-8: 2rem;
  --has-space-10: 2.5rem;
  --has-space-12: 3rem;
  --has-space-16: 4rem;
  --has-space-20: 5rem;
  --has-space-24: 6rem;

  /* Radii */
  --has-radius-sm: 6px;
  --has-radius-md: 12px;
  --has-radius-lg: 18px;
  --has-radius-xl: 26px;
  --has-radius-full: 9999px;

  /* Elevation / Shadows */
  --has-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.4);
  --has-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.5);
  --has-shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.65);
  --has-shadow-glow: 0 0 35px var(--has-purple-glow);
  --has-shadow-gold: 0 0 35px var(--has-gold-glow);

  /* Layout */
  --has-max-width: 1240px;
  --has-header-height: 80px;

  /* Transitions */
  --has-transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  --has-transition-base: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --has-transition-slow: 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}