/* FAVINCA · logo animado v1.0 (aprobado por Gustavo el 09-10-2026). Va con assets/js/logo.js.
   A · firma (Encaje): carga de la home, una vez por navegador.
   F · barra (Ajuste al pasar): logo de la barra fija y del pie.
   E · carga (Ensamble en bucle): indicador de espera, solo si pasa de 400 ms.
   B, C y D (plano, encendido, tres líneas) son para video y redes; viven solo en la guía.
   Las unidades px de transform dentro del SVG son unidades del viewBox (logo de 2940 × 840). */

.fv-logo { display: inline-block; line-height: 0; }
.fv-logo > svg, .fv-logo > img { display: block; width: 100%; height: auto; overflow: visible; }
.fv-logo g { transform-box: fill-box; transform-origin: center; }
.fv-logo .l-nombre path { fill: var(--azul-900); }
[data-tema="noche"] .fv-logo .l-nombre path, .fv-logo--blanco .l-nombre path { fill: #fff; }
.fv-logo--blanco .l-iso path { fill: #fff; }

/* Tamaño en la barra fija y en el pie: 36 px de alto = 126 px de ancho (proporción 3,5). */
.fv-barra__logo .fv-logo, .fv-pie__marca .fv-logo { width: 126px; }
.fv-pie__marca .fv-logo { display: block; margin-bottom: var(--e-4); }
.fv-pie__marca .fv-logo img { margin-bottom: 0; }

/* A · Firma: cada pieza entra desde su esquina, se pasa 14 unidades hacia el centro y asienta; luego el nombre. 1,2 s. */
.fv-logo.is-esperando > * { opacity: 0; }
.fv-logo.is-firma .l-pieza { animation: fv-logo-encaje 760ms var(--ease-salida) both; animation-delay: calc(var(--i) * 90ms); }
.fv-logo.is-firma .l-letra { animation: fv-logo-letra 420ms var(--ease-salida) both; animation-delay: calc(720ms + var(--i) * 35ms); }
@keyframes fv-logo-encaje {
  0%   { transform: translate(calc(var(--dx) * 420px), calc(var(--dy) * 420px)); opacity: 0; }
  30%  { opacity: 1; }
  78%  { transform: translate(calc(var(--dx) * -14px), calc(var(--dy) * -14px)); }
  100% { transform: none; }
}
@keyframes fv-logo-letra { from { opacity: 0; transform: translateY(110px); } }

/* F · Barra: al pasar el mouse o llegar con el teclado, las piezas se abren apenas y vuelven a encajar. 380 ms. */
a:is(:hover, :focus-visible) > .fv-logo--barra .l-pieza,
a.fv-logo--barra:is(:hover, :focus-visible) .l-pieza,
.fv-logo--barra.is-ajuste .l-pieza { animation: fv-logo-ajuste 380ms var(--ease-salida); }
@keyframes fv-logo-ajuste { 40% { transform: translate(calc(var(--dx) * 55px), calc(var(--dy) * 55px)); } }

/* E · Carga: isotipo solo; cada pieza se abre y vuelve en sentido horario. 1,6 s en bucle. */
.fv-carga { display: inline-grid; justify-items: center; gap: var(--e-3); }
.fv-carga[hidden] { display: none; }
.fv-carga__texto { font: 500 var(--t-xs)/1 var(--f-dato); color: var(--texto-3); text-transform: uppercase; letter-spacing: 0.1em; }
.fv-logo--carga { width: 48px; }
.fv-logo--carga .l-pieza { animation: fv-logo-respira 1600ms var(--ease-salida) infinite; animation-delay: calc(var(--i) * 200ms); }
@keyframes fv-logo-respira { 0%, 50%, 100% { transform: none; } 22% { transform: translate(calc(var(--dx) * 90px), calc(var(--dy) * 90px)); } }

/* Movimiento reducido: logo quieto; la carga queda como isotipo fijo más la palabra «Cargando». */
@media (prefers-reduced-motion: reduce) {
  .fv-logo .l-pieza, .fv-logo .l-letra { animation: none !important; }
  .fv-logo.is-esperando > * { opacity: 1; }
}
