/* ===========================================================================
   Capa de marca FYN sobre la calculadora de Santiago Muñoz (MIT).

   Va DESPUÉS de styles.css y solo redefine tokens y superficies de acento.
   Se mantiene como capa aparte a propósito: si el repo original publica
   cambios, se puede volver a mergear sin pelear con el diff.

   Paleta: manual de identidad FYN.
     azul profundo #0C6489 — principal, es el que manda en fondos y botones
     cyan          #44CACB — acento pop, solo para subrayar y estados activos
   Tipografía: el manual pide Avenir Next, pero es una fuente licenciada de
   Apple/Linotype y servirla desde la web sería violar su licencia. Nunito Sans
   es la sustituta geométrico-humanista más cercana y es libre.
   =========================================================================== */

:root {
  --fyn-blue: #0C6489;
  --fyn-blue-deep: #084A66;
  --fyn-cyan: #44CACB;
  --fyn-cyan-soft: #E8F8F8;

  --ink: #10262F;
  --text: #26383F;
  --gray: #5F7078;
  --meta: #82969C;
  --line: #DDE7EA;
  --soft: #F3F8F9;

  --sans: 'Nunito Sans', 'Avenir Next', 'Helvetica Neue', Arial, sans-serif;
}

/* ── Botón principal: azul FYN en vez del casi-negro ───────────────────── */
.btn {
  background: var(--fyn-blue);
  border-color: var(--fyn-blue);
  color: #fff;
}
.btn:hover { background: var(--fyn-blue-deep); border-color: var(--fyn-blue-deep); }
.btn.ghost { background: transparent; color: var(--fyn-blue); border-color: var(--line); }
.btn.ghost:hover { border-color: var(--fyn-cyan); color: var(--fyn-blue-deep); }

/* ── Estados activos: el cyan es acento, nunca fondo de texto largo ────── */
.chip.done { border-color: var(--fyn-cyan); background: var(--fyn-cyan-soft); color: var(--fyn-blue-deep); }
.chip:hover { border-color: var(--fyn-cyan); }
.stepper:focus-within { border-color: var(--fyn-cyan); }
a:hover { color: var(--fyn-blue); }
::selection { background: var(--fyn-cyan); color: #0A1A20; }

/* ── Marca en el nav. El nav original usa mix-blend-mode: difference para
      sobrevivir a fondos claros y oscuros; el isotipo se invierte igual. ── */
.nav .brand { display: inline-flex; align-items: center; gap: 9px; pointer-events: auto; }
.nav .brand img { height: 17px; width: auto; display: block; }

/* ── Crédito al autor original, destacado del resto del pie ────────────── */
footer .fyn-credito {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}