/* =====================================================================
   base.css — Paleta, tipografía y reglas globales (tema industrial oscuro)
   ===================================================================== */
:root {
  /* Paleta del diseño */
  --azul: #0D6EFD;
  --azul-claro: #3B8BFF;
  --azul-osc: #0A2540;
  --azul-bg: rgba(13, 110, 253, .14);
  --azul-glow: rgba(13, 110, 253, .38);

  --fondo-prof: #070D1A;
  --fondo: #0F172A;
  --panel: #101A2E;
  --panel-2: #15213A;
  --panel-3: #1E293B;
  --borde: #1C2A44;
  --borde-2: #2A3C5E;

  --texto: #E5ECF6;
  --texto-2: #94A3B8;
  --texto-3: #64748B;

  --verde: #22C55E;
  --verde-bg: rgba(34, 197, 94, .13);
  --amarillo: #FACC15;
  --amarillo-bg: rgba(250, 204, 21, .13);
  --rojo: #EF4444;
  --rojo-bg: rgba(239, 68, 68, .14);

  --radio: 14px;
  --radio-s: 9px;
  --sombra: 0 14px 40px rgba(0, 0, 0, .45);

  --f-texto: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  --f-titulo: "Poppins", "Inter", "Segoe UI", sans-serif;
  --f-mono: "JetBrains Mono", "Cascadia Mono", ui-monospace, Consolas, monospace;

  color-scheme: dark;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { min-height: 100%; }
body {
  margin: 0;
  background:
    radial-gradient(1200px 600px at 75% -10%, rgba(13, 110, 253, .10), transparent 60%),
    var(--fondo-prof);
  background-attachment: fixed;
  color: var(--texto);
  font: 14px/1.5 var(--f-texto);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { font-family: var(--f-titulo); font-weight: 600; margin: 0; letter-spacing: .005em; text-wrap: balance; }
p { margin: 0; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
:focus-visible { outline: 2px solid var(--azul-claro); outline-offset: 2px; }
img { max-width: 100%; display: block; }

.mono { font-family: var(--f-mono); font-variant-numeric: tabular-nums; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.texto-2 { color: var(--texto-2); }
.verde { color: var(--verde); }
.amarillo { color: var(--amarillo); }
.rojo { color: var(--rojo); }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--borde-2); border-radius: 10px; border: 2px solid var(--fondo-prof); }

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