/*
 * Tú en línea — variables del tema.
 * La paleta viene de Readdy en OKLCH (luminosidad, croma, tono) y las
 * utilidades de css/tema.css la usan como oklch(var(--primary-500)).
 * Para cambiar un color basta con cambiar su terna aquí.
 */
:root {
  --font-heading: 'Outfit', ui-sans-serif, system-ui, sans-serif;
  --font-body: 'DM Sans', ui-sans-serif, system-ui, sans-serif;

  --background-50: 0.992 0.004 85;  --background-100: 0.972 0.008 82; --background-200: 0.944 0.012 80;
  --background-300: 0.902 0.014 78; --background-400: 0.84 0.016 76;  --background-500: 0.752 0.018 74;
  --background-600: 0.65 0.018 72;  --background-700: 0.54 0.016 68;  --background-800: 0.42 0.014 62;
  --background-900: 0.3 0.012 56;   --background-950: 0.18 0.01 50;

  --primary-50: 0.978 0.02 78;   --primary-100: 0.952 0.048 77; --primary-200: 0.906 0.09 75;
  --primary-300: 0.855 0.132 71; --primary-400: 0.79 0.165 64;  --primary-500: 0.722 0.176 55;
  --primary-600: 0.645 0.165 50; --primary-700: 0.55 0.144 47;  --primary-800: 0.452 0.118 44;
  --primary-900: 0.362 0.09 42;  --primary-950: 0.245 0.058 40;

  --accent-50: 0.975 0.018 168;  --accent-100: 0.94 0.038 168; --accent-200: 0.878 0.066 168;
  --accent-300: 0.8 0.088 168;   --accent-400: 0.678 0.1 168;  --accent-500: 0.518 0.1 170;
  --accent-600: 0.44 0.088 170;  --accent-700: 0.368 0.074 170; --accent-800: 0.3 0.06 170;
  --accent-900: 0.24 0.048 170;  --accent-950: 0.165 0.03 170;

  --secondary-50: 0.982 0.008 72;  --secondary-100: 0.955 0.016 72; --secondary-200: 0.912 0.026 70;
  --secondary-300: 0.845 0.032 68; --secondary-400: 0.752 0.038 66; --secondary-500: 0.645 0.042 62;
  --secondary-600: 0.552 0.04 58;  --secondary-700: 0.46 0.036 56;  --secondary-800: 0.37 0.03 54;
  --secondary-900: 0.282 0.026 52; --secondary-950: 0.185 0.02 48;

  --foreground-50: 0.985 0.004 72;  --foreground-100: 0.965 0.006 72; --foreground-200: 0.922 0.008 72;
  --foreground-300: 0.858 0.01 70;  --foreground-400: 0.72 0.012 62;  --foreground-500: 0.6 0.012 56;
  --foreground-600: 0.5 0.012 52;   --foreground-700: 0.408 0.012 50; --foreground-800: 0.3 0.012 47;
  --foreground-900: 0.222 0.012 45; --foreground-950: 0.152 0.01 43;

  /* Alto de la cabecera fija (barra superior + barra principal) para lo que vaya pegado arriba. */
  --alto-cabecera: 64px;

  /* Nombres que usan los plugins del sistema (contacto, testimonios, blog). */
  --color-principal: oklch(var(--primary-600));
  --color-acento: oklch(var(--primary-500));
  --color-borde: oklch(var(--background-300));
  --color-fondo-suave: oklch(var(--background-100));
  --color-texto: oklch(var(--foreground-950));
  --color-texto-suave: oklch(var(--foreground-600));
  --color-etiqueta-blog: oklch(var(--accent-600));
  --radio: 10px;
}
@media (min-width: 768px) { :root { --alto-cabecera: 112px; } }