/* =========================================================================
   AELE · Capa de movimiento (v4)
   Todo efecto está aquí. Sin JavaScript o con "reducir movimiento", el sitio
   se muestra completo y estático.
   ========================================================================= */

/* ---------- Transición entre páginas (navegadores que la soportan) ---------- */
@view-transition { navigation: auto; }
.header { view-transition-name: cabecera; }
::view-transition-old(root) { animation: 220ms cubic-bezier(.4,0,1,1) both vt-salir; }
::view-transition-new(root) { animation: 380ms cubic-bezier(0,0,.2,1) 60ms both vt-entrar; }
@keyframes vt-salir { to { opacity: 0; transform: translateY(-8px); } }
@keyframes vt-entrar { from { opacity: 0; transform: translateY(14px); } }

/* ---------- Barra de lectura ---------- */
.fx-progreso { position: fixed; left: 0; top: 0; height: 3px; width: 100%; background: var(--dorado); transform-origin: 0 50%; transform: scaleX(0); z-index: 200; pointer-events: none; }

/* ---------- Cabecera que se compacta ---------- */
.header { transition: box-shadow .3s, background-color .3s; }
.header__inner { transition: min-height .3s cubic-bezier(.2,.8,.2,1); }
.header__logo img { transition: width .3s cubic-bezier(.2,.8,.2,1); }
.header.is-compacta { box-shadow: 0 8px 30px rgba(1,53,110,.1); }
.header.is-compacta .header__inner { min-height: 64px; }
.header.is-compacta .header__logo img { width: 118px; }

/* ---------- Aparición al hacer scroll ---------- */
html.fx [data-fx] { opacity: 0; transform: translateY(26px); transition: opacity .8s cubic-bezier(.2,.8,.2,1), transform .8s cubic-bezier(.2,.8,.2,1); transition-delay: calc(var(--i, 0) * 90ms); }
html.fx [data-fx="izq"] { transform: translateX(-30px); }
html.fx [data-fx="escala"] { transform: scale(.94); }
html.fx [data-fx].is-in { opacity: 1; transform: none; }

/* Los títulos se descubren con una cortina */
html.fx [data-fx="titulo"] { opacity: 1; transform: none; clip-path: inset(0 100% 0 0); transition: clip-path 1s cubic-bezier(.7,0,.2,1); }
html.fx [data-fx="titulo"].is-in { clip-path: inset(0 0 0 0); }

/* Estantería: cada edición "se coloca" en la tabla */
html.fx .hem-fila .hem-item { opacity: 0; transform: translateY(-34px) rotate(-4deg); transition: opacity .6s ease, transform .7s cubic-bezier(.3,1.4,.5,1); transition-delay: calc(var(--i, 0) * 55ms); }
html.fx .hem-anio.is-in .hem-item { opacity: 1; transform: none; }
html.fx .hem-tabla { transform: scaleX(0); transform-origin: 0 50%; transition: transform 1s cubic-bezier(.7,0,.2,1); }
html.fx .hem-anio.is-in .hem-tabla { transform: scaleX(1); }

/* ---------- Portadas que responden al cursor ---------- */
.fx-tilt .portada { transition: transform .5s cubic-bezier(.2,.8,.2,1), filter .5s; will-change: transform; }
.fx-tilt.is-tilt .portada { transition: transform .08s linear, filter .3s; filter: drop-shadow(0 26px 30px rgba(0,0,0,.35)); }
.portada__brillo { background: radial-gradient(420px circle at var(--bx, 30%) var(--by, 20%), rgba(255,255,255,.28), rgba(255,255,255,0) 45%), linear-gradient(115deg, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 35%); transition: background-position .2s; }

/* Revistas del hero: flotan en reposo */
@media (prefers-reduced-motion: no-preference) {
  .hero2__item .portada { animation: flotar 6s ease-in-out infinite alternate; }
  .hero2__item--0 .portada { animation-delay: -2s; }
  .hero2__item--2 .portada { animation-delay: -4s; animation-duration: 7s; }
  @keyframes flotar { from { translate: 0 0; } to { translate: 0 -10px; } }
}

/* ---------- Luz que sigue al cursor ---------- */
.herr__item, .ficha2, .triptico__col, .cierre { --mx: 50%; --my: 50%; }
.herr__item { background-image: radial-gradient(360px circle at var(--mx) var(--my), rgba(214,174,118,.20), transparent 45%); }
.triptico__col::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: 0; transition: opacity .4s; background: radial-gradient(520px circle at var(--mx) var(--my), rgba(255,255,255,.16), transparent 50%); }
.triptico__col:hover::before { opacity: 1; }
.triptico__col .triptico__logo img { transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.triptico__col:hover .triptico__logo img { transform: translateY(-4px) scale(1.04); }
.triptico__corte { transition: transform .7s cubic-bezier(.2,.8,.2,1); }
.triptico__col:hover .triptico__corte { transform: rotate(18deg) translateX(-18px); }
.ficha2 { transition: transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s; }
.ficha2:hover { transform: translateY(-4px); box-shadow: 0 2px 0 var(--gris-linea), 0 24px 50px rgba(1,53,110,.16); }
.ficha2__fecha strong { transition: transform .5s cubic-bezier(.3,1.5,.5,1); }
.ficha2:hover .ficha2__fecha strong { transform: scale(1.12); }

/* ---------- Botones: brillo al pasar ---------- */
.btn--gold, .btn--primary, .btn--rojo { position: relative; overflow: hidden; isolation: isolate; }
.btn--gold::after, .btn--primary::after, .btn--rojo::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.45), transparent); transform: skewX(-20deg); z-index: -1; transition: left .7s cubic-bezier(.2,.8,.2,1); }
.btn--gold:hover::after, .btn--primary:hover::after, .btn--rojo:hover::after { left: 120%; }
.hero2__link, .triptico__cta, .news__more { background: linear-gradient(var(--dorado), var(--dorado)) 0 100% / 0 2px no-repeat; border-bottom-color: rgba(214,174,118,.45) !important; transition: background-size .4s cubic-bezier(.2,.8,.2,1), color .2s; }
.hero2__link:hover, .triptico__cta:hover, .triptico__col:hover .triptico__cta, .news__more:hover { background-size: 100% 2px; }

/* ---------- Fotografías con paralaje ---------- */
.page-hero--foto::before, .cierre::before { transform: translate3d(0, var(--py, 0px), 0) scale(1.12); will-change: transform; }
.tv2__fondo { transform: translate3d(0, var(--py, 0px), 0) scale(1.12); }
.pilares2__fotowrap { overflow: hidden; border-radius: 12px; }
.pilares2__foto { transform: translate3d(0, var(--py, 0px), 0) scale(1.15); transition: filter .6s; }
.pilares2__fotowrap:hover .pilares2__foto { filter: grayscale(0) contrast(1.05); }

/* ---------- Franja dorada que se dibuja ---------- */
html.fx .hero2__franja, html.fx .herr::after, html.fx .hem-hero::after { animation: franja 1.2s cubic-bezier(.7,0,.2,1) .2s both; }
@keyframes franja { from { clip-path: inset(100% 0 0 0); } to { clip-path: inset(0 0 0 0); } }

/* ---------- Estantería: controles y arrastre ---------- */
.hem-anio { position: relative; }
.hem-fila { scroll-behavior: smooth; cursor: grab; scrollbar-width: none; }
.hem-fila::-webkit-scrollbar { display: none; }
.hem-fila.is-arrastrando { cursor: grabbing; scroll-behavior: auto; }
.hem-fila.is-arrastrando .hem-item { pointer-events: none; }
.hem-flecha { position: absolute; top: 50%; z-index: 3; width: 44px; height: 44px; border-radius: 50%; border: 0; background: #fff; color: var(--azul); box-shadow: 0 8px 22px rgba(1,53,110,.22); cursor: pointer; display: grid; place-items: center; transition: opacity .3s, transform .2s; }
.hem-flecha:hover { transform: scale(1.08); }
.hem-flecha--izq { left: -14px; } .hem-flecha--der { right: -14px; }
.hem-flecha[disabled] { opacity: 0; pointer-events: none; }
.hem-anio::after { content: ""; position: absolute; right: 0; top: 70px; bottom: 30px; width: 70px; background: linear-gradient(90deg, transparent, var(--crema)); pointer-events: none; opacity: var(--fade, 1); transition: opacity .3s; }

/* Visor de la hemeroteca: entra desde la portada */
.hem-visor:not([hidden]) .hem-visor__fondo { animation: fondoIn .35s ease both; }
.hem-visor:not([hidden]) .hem-visor__caja { animation: cajaIn .55s cubic-bezier(.2,.9,.2,1.1) both; }
.hem-visor:not([hidden]) .hem-visor__img img { animation: tapaIn .8s cubic-bezier(.2,.8,.2,1) .1s both; }
.hem-visor:not([hidden]) .hem-visor__txt > * { animation: fx-subir .5s cubic-bezier(.2,.8,.2,1) both; }
.hem-visor:not([hidden]) .hem-visor__txt > :nth-child(2) { animation-delay: .1s } .hem-visor:not([hidden]) .hem-visor__txt > :nth-child(3) { animation-delay: .18s } .hem-visor:not([hidden]) .hem-visor__txt > :nth-child(4) { animation-delay: .26s }
@keyframes fondoIn { from { opacity: 0; } }
@keyframes cajaIn { from { opacity: 0; transform: scale(.9) translateY(20px); } }
@keyframes tapaIn { from { opacity: 0; transform: perspective(900px) rotateY(-40deg) translateX(-30px); } }
@keyframes fx-subir { from { opacity: 0; transform: translateY(12px); } }

/* ---------- Cifras ---------- */
.fx-cifra { font-variant-numeric: tabular-nums; }

/* ---------- Respeto por "reducir movimiento" ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  html.fx [data-fx], html.fx .hem-fila .hem-item, html.fx .hem-tabla { opacity: 1 !important; transform: none !important; clip-path: none !important; }
  .page-hero--foto::before, .cierre::before, .tv2__fondo, .pilares2__foto { transform: scale(1.12) !important; }
  @view-transition { navigation: none; }
}
.hem-nav { transition: top .3s cubic-bezier(.2,.8,.2,1); }
body:has(.header.is-compacta) .hem-nav { top: 64px; }