/* ==========================================================
   animations.css — Keyframes y estados de aparición
   ========================================================== */

/* --- Reveal al hacer scroll (activado por reveal.js) ------- */

[data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  transition: opacity 1s var(--ease), transform 1s var(--ease);
  transition-delay: var(--retraso, 0ms);
}

[data-reveal].visible {
  opacity: 1;
  transform: none;
}

[data-reveal="izq"]  { transform: translateX(-42px); }
[data-reveal="der"]  { transform: translateX(42px); }
[data-reveal="zoom"] { transform: scale(.94); }

/* --- Cortina de imagen ------------------------------------- */

[data-cortina] {
  position: relative;
  overflow: hidden;
}

[data-cortina]::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--crema-claro);
  transform: scaleY(1);
  transform-origin: bottom;
  transition: transform 1.1s var(--ease);
  z-index: 2;
}

[data-cortina].visible::after { transform: scaleY(0); }

/* --- Título por líneas ------------------------------------- */

.linea-mask {
  display: block;
  overflow: hidden;
}

.linea-mask > span {
  display: block;
  transform: translateY(105%);
  transition: transform 1.05s var(--ease);
  transition-delay: var(--retraso, 0ms);
}

.cargado .linea-mask > span,
.visible .linea-mask > span { transform: none; }

/* --- Menú móvil -------------------------------------------- */

.nav-principal {
  transition: opacity .4s var(--ease);
}

@media (max-width: 900px) {
  .nav-principal {
    position: fixed;
    inset: 0;
    background: var(--crema-claro);
    display: grid;
    place-items: center;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-12px);
    transition: opacity .5s var(--ease), transform .5s var(--ease), visibility .5s;
  }

  .nav-principal.abierto {
    opacity: 1;
    visibility: visible;
    transform: none;
  }

  .nav-principal ul {
    flex-direction: column;
    gap: 26px;
    text-align: center;
  }

  .nav-principal a { font-size: 1.05rem; letter-spacing: .22em; }
}

/* --- Keyframes --------------------------------------------- */

@keyframes pulso {
  0%   { transform: scale(1);   opacity: .8; }
  70%  { transform: scale(1.5); opacity: 0; }
  100% { transform: scale(1.5); opacity: 0; }
}

@keyframes desplazar {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@keyframes aparecer {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* --- Preloader --------------------------------------------- */

.preloader {
  position: fixed;
  inset: 0;
  z-index: 2000;
  background: var(--rosa);
  display: grid;
  place-items: center;
  transition: opacity .7s var(--ease), visibility .7s;
}

.preloader.fuera { opacity: 0; visibility: hidden; }

.preloader img {
  width: 110px;
  border-radius: 50%;
  animation: aparecer 1.1s var(--ease) both;
}

/* --- Accesibilidad: menos 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;
  }

  [data-reveal] { opacity: 1; transform: none; }
  [data-cortina]::after { display: none; }
  .linea-mask > span { transform: none; }
}