/* TermoCalc — versión clara. Se carga después de estilos.css y solo cambia colores. */
:root {
  --fondo: #f6f9fc;
  --fondo-2: #edf3f9;
  --tarjeta: #ffffff;
  --tarjeta-2: #f1f5fa;
  --borde: #d9e3ee;
  --texto: #0b1730;
  --texto-2: #46566f;
  --texto-3: #64748b;
  --cian: #0284c7;
  --cian-2: #0369a1;
  --cian-suave: rgba(2, 132, 199, .09);
  --violeta: #7c3aed;
  --violeta-suave: rgba(124, 58, 237, .09);
  --sombra: 0 18px 40px -22px rgba(15, 35, 70, .35);
  color-scheme: light;
}

.boton-primario { color: #fff; }
.boton-primario:hover { background: var(--cian-2); }
.boton-secundario { background: var(--tarjeta); }

.barra { background: rgba(255, 255, 255, .86); border-bottom-color: var(--borde); }
.menu a:hover { color: var(--cian); }

.portada::before {
  background:
    radial-gradient(600px 380px at 18% 30%, rgba(2, 132, 199, .12), transparent 70%),
    radial-gradient(520px 340px at 85% 10%, rgba(124, 58, 237, .10), transparent 70%);
}
.etiqueta { border-color: rgba(2, 132, 199, .25); }
.etiqueta.violeta { color: #6d28d9; border-color: rgba(124, 58, 237, .28); }
.portada h1 span { background-image: linear-gradient(90deg, #0284c7, #7c3aed); }
.portada-imagen {
  background: linear-gradient(180deg, rgba(2, 132, 199, .35), rgba(124, 58, 237, .12) 60%, transparent);
  box-shadow: 0 40px 100px -40px rgba(2, 132, 199, .45);
}
.cifra, .instalacion, .video-info, .ia-pregunta, .salida, .motor { box-shadow: 0 1px 2px rgba(15, 35, 70, .05); }

.seccion.alterna { border-block-color: var(--borde); }
.paso + .paso { border-top-color: var(--borde); }

.i-rojo { background: rgba(225, 29, 72, .09); color: #e11d48; }
.i-naranja { background: rgba(234, 88, 12, .09); color: #ea580c; }
.i-violeta { color: #7c3aed; }
.i-verde { background: rgba(22, 163, 74, .09); color: #16a34a; }
.i-amarillo { background: rgba(202, 138, 4, .1); color: #b45309; }

.pestana[aria-selected="true"] { color: #fff; }
.capitulos button:hover { background: var(--cian-suave); }

.lista-chica li::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E");
}

.ia-pregunta .burbuja { background: rgba(2, 132, 199, .07); border-color: rgba(2, 132, 199, .25); }
.ia-pregunta h4 { color: #6d28d9; }

.llamado {
  background:
    radial-gradient(500px 260px at 20% 0%, rgba(2, 132, 199, .14), transparent 70%),
    radial-gradient(500px 260px at 80% 100%, rgba(124, 58, 237, .12), transparent 70%),
    var(--tarjeta);
}
.salida-icono { background: radial-gradient(260px 140px at 50% 50%, rgba(2, 132, 199, .12), transparent 70%), var(--tarjeta-2); }

/* El visor de capturas queda oscuro: las capturas de la app son oscuras. */
.visor p { color: #c9d4e5; }
.visor-cerrar { background: #0e1a33; border-color: #1f2f52; color: #e6edf8; }
