/* ============================================
   VARIABLES.CSS
   Design tokens: colores, tipografía, spacing
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,600;0,700;0,900;1,300&display=swap');

:root {
  /* Colores */
  --bg-primary: #202127;
  --bg-dark: #1c1d23;
  --bg-footer: #191a1f;
  --accent: #544c9a;
  --accent-hover: #6358b0;
  --border: #2e2c3e;
  --border-deep: #1a1928;
  --text-primary: #ffffff;
  --text-secondary: rgba(255,255,255,0.52);
  --text-muted: rgba(255,255,255,0.22);
  --text-ghost: #1a1928;

  /* Tipografía */
  --font: 'Poppins', sans-serif;

  /* Layout */
  --max-width: 1240px;
  --pad-h: 56px;

  /* Transiciones */
  --t-fast: 0.2s ease;
  --t-smooth: 0.35s cubic-bezier(0.16,1,0.3,1);
}