/* ============================================
   Design Tokens — Variables
   ============================================ */

:root {
  /* ---- Color Palette (Light) ---- */
  --color-bg:             #F7F7F4;
  --color-bg-hero:        #FFFFFF;
  --color-surface:        #FFFFFF;
  --color-border:         #E8E8E3;

  --color-text-primary:   #1A1A18;
  --color-text-secondary: #6B6B65;
  --color-text-muted:     #A8A8A2;

  /* Accent — IoT/embedded signal green */
  --color-accent:         #2DBA6E;
  --color-accent-hover:   #26A35F;
  --color-accent-dim:     #D4F4E4;

  /* Functional */
  --color-tag-bg:         #F3F3EE;
  --color-tag-text:       #3A3A35;
  --color-error:          #E05252;
  --color-error-bg:       #FDE8E8;
  --color-success:        #2DBA6E;
  --color-success-bg:     #D4F4E4;

  /* Nav */
  --color-nav-bg:         rgba(247, 247, 244, 0.65);

  /* Dark section (alternating) */
  --color-dark-bg:        #141413;
  --color-dark-surface:   #1E1E1C;
  --color-dark-border:    #2E2E2A;
  --color-dark-text:      #EAEAE5;
  --color-dark-text-sec:  #A0A09A;
  --color-dark-text-muted:#6B6B65;
  --color-dark-tag-bg:    #282824;
  --color-dark-tag-text:  #C8C8C2;

  /* ---- Typography ---- */
  --font-display: 'IBM Plex Mono', monospace;
  --font-body:    'DM Sans', sans-serif;

  --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:  2rem;
  --text-4xl:  2.5rem;

  --line-height-tight:  1.2;
  --line-height-normal: 1.6;
  --line-height-loose:  1.8;

  --font-weight-regular: 400;
  --font-weight-medium:  500;
  --font-weight-bold:    700;

  /* ---- Spacing ---- */
  --space-xs:  0.25rem;
  --space-sm:  0.5rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 5rem;

  /* ---- Layout ---- */
  --container-max: 1200px;
  --container-pad: 2rem;

  /* ---- Border Radius ---- */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* ---- Transitions ---- */
  --transition-fast:   150ms ease;
  --transition-base:   200ms ease;
  --transition-slow:   350ms ease;

  /* ---- Shadows ---- */
  --shadow-sm:  0 1px 3px rgba(26, 26, 24, 0.06);
  --shadow-md:  0 4px 12px rgba(26, 26, 24, 0.08);
  --shadow-lg:  0 8px 24px rgba(26, 26, 24, 0.10);

  /* ---- Z-Index ---- */
  --z-nav:     100;
  --z-overlay: 200;
}

/* Dark mode removed — light only for now */

/* ============================================
   Reduced Motion
   ============================================ */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}