/*
 * idesignweb Design System Tokens
 * Clean, elegant modern agency typography.
 * Strict Constraints: Flat surfaces, hairline borders, zero gradients,
 * zero emoji, zero icon fonts, two-weight hierarchy.
 */

:root {
  /* Color Palette - Clean Flat Surfaces */
  --bg-primary: #FFFFFF;
  --bg-surface: #F8F9FA;
  --bg-surface-alt: #F1F3F5;
  --bg-dark: #121212;
  --bg-dark-surface: #1E1E1E;
  
  --text-main: #1A1A1A;
  --text-muted: #595959;
  --text-dim: #8C8C8C;
  --text-inverse: #FFFFFF;
  --text-inverse-muted: #CCCCCC;
  
  /* Hairline Borders */
  --border-hairline: #E5E7EB;
  --border-hairline-strong: #111111;
  --border-hairline-dark: #2E2E2E;
  
  /* Primary CTA Accent - Single Accent for Action */
  --accent-cta: #0047FF;
  --accent-cta-hover: #0036CC;
  --accent-cta-text: #FFFFFF;
  
  /* Focus States */
  --focus-ring: #0047FF;
  
  /* Clean Sans-Serif Typography (No Monospace/Robotic Fonts for UI) */
  --font-sans: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", Roboto, sans-serif;
  
  /* Two-Weight System */
  --weight-regular: 400;
  --weight-bold: 600;
  --weight-black: 700;
  
  /* Type Scale */
  --text-display: clamp(2.25rem, 4.5vw, 3.75rem);
  --text-h1: clamp(1.85rem, 3vw, 2.75rem);
  --text-h2: clamp(1.4rem, 2.2vw, 2rem);
  --text-h3: 1.25rem;
  --text-h4: 1.05rem;
  --text-body: 1rem;
  --text-small: 0.875rem;
  --text-tiny: 0.75rem;
  
  /* Layout Spacing */
  --container-max: 1200px;
  --header-height: 68px;
  --space-unit: 8px;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 36px;
  --space-2xl: 56px;
  --space-3xl: 80px;
}