:root {
  /* Backgrounds */
  --bg-base:      #111111;
  --bg-dark:      #0D0D0D;
  --bg-card:      #161616;
  --bg-card-alt:  #1A1A1A;

  /* Borders */
  --border:       rgba(255,255,255,0.06);
  --border-mid:   #2A2A2A;
  --border-hover: #3A3A3A;

  /* Accent */
  --accent-red:       #9B111E;
  --accent-red-hover: #b01425;

  /* Text */
  --text-1: #F5F5F5;
  --text-2: #9CA3AF;
  --text-3: #6B7280; /* WCAG AA en small text sobre #0D0D0D (~6.6:1) */

  /* Kept for compatibility */
  --bg-primary:    #111111;
  --bg-secondary:  #0D0D0D;
  --text-primary:  #F5F5F5;
  --text-secondary:#9CA3AF;
  --text-muted:    #6B7280;
  --border-subtle: rgba(255,255,255,0.06);

  /* 8-pt spacing grid */
  --sp-1:  8px;
  --sp-2:  16px;
  --sp-3:  24px;
  --sp-4:  32px;
  --sp-5:  40px;
  --sp-6:  48px;
  --sp-8:  64px;
  --sp-10: 80px;
  --sp-12: 96px;
  --sp-16: 128px;

  /* Typography */
  --font-display: 'Montserrat', system-ui, sans-serif;
  --font-body:    'Inter', system-ui, sans-serif;

  /* Radius */
  --radius-btn:  6px;
  --radius-card: 12px;

  /* Legacy compat */
  --radius-line: 2px;

  /* Transitions */
  --t-fast: 150ms ease;
  --t-base: 200ms ease;
  --t-slow: 500ms ease;
}