/* ========================================
   EASTGATE DIGITAL — CSS VARIABLES
   Premium Brutalism Design System
   ======================================== */

:root {
  /* Primary & Secondary Colors */
  --color-color-1: #ff6b00;
  --color-color-2: #6c757d;
  --color-color-3: #1c1c1c;
  --color-color-4: #ffffff;
  --color-color-5: #bcbcbc;
  --color-color-6: #0e0e0e;
  --color-color-7: #f4f1de;
  --color-color-8: #1b263b;
  --color-color-9: #e2e8f0;
  --color-color-10: #fafaf5;

  /* Brutalism Accent Colors */
  --brutal-purple: #8b5cf6;
  --brutal-purple-light: #c4b5fd;
  --brutal-yellow: #fbbf24;
  --brutal-pink: #ec4899;
  --brutal-green: #10b981;
  --brutal-blue: #3b82f6;

  /* Typography */
  --font-type-1-family: 'Inter', sans-serif;
  --font-type-1-size: 16px;
  --font-type-1-weight: 400;
  --font-type-1-line-height: 25.6px;

  --font-type-2-family: 'Inter', sans-serif;
  --font-type-2-size: 11.52px;
  --font-type-2-weight: 400;
  --font-type-2-line-height: 18.432px;

  --font-type-3-family: 'Inter', sans-serif;
  --font-type-3-size: 14.08px;
  --font-type-3-weight: 500;
  --font-type-3-line-height: normal;

  --font-type-4-family: 'Inter', sans-serif;
  --font-type-4-size: 14px;
  --font-type-4-weight: 600;
  --font-type-4-line-height: 22.4px;

  --font-type-5-family: 'Inter', sans-serif;
  --font-type-5-size: 10.4px;
  --font-type-5-weight: 700;
  --font-type-5-line-height: 16.64px;

  /* Spacing */
  --spacing-space-1: 12px;
  --spacing-space-2: 6px;
  --spacing-space-3: 20px;
  --spacing-space-4: 18px;
  --spacing-space-5: 14px;
  --spacing-space-6: 8px;
  --spacing-space-7: 32px;
  --spacing-space-8: 22px;
  --spacing-space-9: 7px;
  --spacing-space-10: 4px;

  /* Border Radius */
  --radius-radius-1: 100px;
  --radius-radius-2: 50px;
  --radius-radius-3: 8px;
  --radius-radius-4: 20px;

  /* Brutalism Borders & Shadows */
  --brutal-border: 2.5px solid var(--color-color-3);
  --brutal-border-thick: 3px solid var(--color-color-3);
  --brutal-shadow: 5px 5px 0px var(--color-color-3);
  --brutal-shadow-sm: 3px 3px 0px var(--color-color-3);
  --brutal-shadow-lg: 8px 8px 0px var(--color-color-3);
  --brutal-shadow-accent: 5px 5px 0px var(--color-color-1);
  --brutal-shadow-purple: 5px 5px 0px var(--brutal-purple);
  --brutal-shadow-hover: 7px 7px 0px var(--color-color-3);

  /* Extended Design Tokens */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);
  --shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.15);

  --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-spring: 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --transition-bounce: 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);

  --container-max: 1320px;
  --container-sm: 960px;
  --container-xs: 720px;
  --navbar-height: 76px;

  --border-thin: 1px solid var(--color-color-9);
  --border-medium: 2px solid var(--color-color-3);
  --border-accent: 2px solid var(--color-color-1);
}