/* ============================================
   DIGWEG – Design Tokens / Variables CSS
   ============================================ */

:root {
  /* ── Colores ── */
  --color-bg:          #0a0a0f;
  --color-bg-alt:      #0f0f1a;
  --color-bg-card:     #12121e;
  --color-surface:     #1a1a2e;

  --color-primary:     #00d4ff;
  --color-primary-rgb: 0, 212, 255;
  --color-primary-dim: #0099cc;
  --color-primary-glow:#00d4ff40;

  --color-accent:      #00aaff;
  --color-accent2:     #7b61ff;

  --color-text:        #e8eaf0;
  --color-text-muted:  #8a8fa8;
  --color-text-bright: #ffffff;

  --color-border:      #1e2035;
  --color-border-glow: rgba(0, 212, 255, 0.15);

  /* ── Tipografía ── */
  --font-main:    'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-display: 'Space Grotesk', 'Inter', sans-serif;

  --fs-xs:   0.75rem;   /* 12px */
  --fs-sm:   0.875rem;  /* 14px */
  --fs-base: 1rem;      /* 16px */
  --fs-md:   1.125rem;  /* 18px */
  --fs-lg:   1.25rem;   /* 20px */
  --fs-xl:   1.5rem;    /* 24px */
  --fs-2xl:  2rem;      /* 32px */
  --fs-3xl:  2.5rem;    /* 40px */
  --fs-4xl:  3.25rem;   /* 52px */
  --fs-5xl:  4rem;      /* 64px */

  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  --lh-tight:  1.2;
  --lh-normal: 1.6;

  /* ── Espaciado ── */
  --space-xs:  0.25rem;
  --space-sm:  0.5rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;
  --space-5xl: 8rem;

  /* ── Bordes y radios ── */
  --radius-sm:  6px;
  --radius-md:  12px;
  --radius-lg:  20px;
  --radius-xl:  30px;
  --radius-full:9999px;

  /* ── Sombras ── */
  --shadow-glow:    0 0 20px rgba(0, 212, 255, 0.15);
  --shadow-glow-md: 0 0 40px rgba(0, 212, 255, 0.2);
  --shadow-glow-lg: 0 0 80px rgba(0, 212, 255, 0.25);
  --shadow-card:    0 4px 24px rgba(0, 0, 0, 0.4);

  /* ── Transiciones ── */
  --transition-fast:   150ms ease;
  --transition-base:   300ms ease;
  --transition-slow:   500ms ease;
  --transition-spring: 500ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ── Layout ── */
  --container-max: 1200px;
  --nav-height:    72px;
}