/* ═══════════════════════════════════════════════════════════════════════
   González Núñez — Animaciones del sitio
   Todo aplica solo cuando js/animaciones.js activa la clase "anim".
   Para quitarlas, edita js/animaciones.js (instrucciones al inicio).
   ═══════════════════════════════════════════════════════════════════════ */

/* Aparición al bajar con el scroll */
html.anim .revelar {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);
  transition-delay: var(--retraso, 0ms);
}
html.anim .revelar.visible { opacity: 1; transform: none; }

/* Portada: el texto entra en cascada y el documento se "deposita" */
@keyframes gnSubir { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes gnDocumento { from { opacity: 0; transform: translateY(26px) rotate(-1.2deg); } to { opacity: 1; transform: none; } }
@keyframes gnFila { from { opacity: 0; transform: translateX(-8px); } to { opacity: 1; transform: none; } }

html.anim .portada .ubicacion { animation: gnSubir .7s cubic-bezier(.2,.7,.2,1) both .05s; }
html.anim .portada h1        { animation: gnSubir .8s cubic-bezier(.2,.7,.2,1) both .15s; }
html.anim .portada .bajada   { animation: gnSubir .8s cubic-bezier(.2,.7,.2,1) both .3s; }
html.anim .portada .acciones { animation: gnSubir .8s cubic-bezier(.2,.7,.2,1) both .45s; }
html.anim .portada .garantias li { animation: gnSubir .6s cubic-bezier(.2,.7,.2,1) both; }
html.anim .portada .garantias li:nth-child(1) { animation-delay: .6s; }
html.anim .portada .garantias li:nth-child(2) { animation-delay: .7s; }
html.anim .portada .garantias li:nth-child(3) { animation-delay: .8s; }

html.anim .portada .documento { animation: gnDocumento 1s cubic-bezier(.2,.7,.2,1) both .35s; }
html.anim .portada .documento .fila { animation: gnFila .5s ease-out both; }
html.anim .portada .documento .fila:nth-child(1) { animation-delay: .9s; }
html.anim .portada .documento .fila:nth-child(2) { animation-delay: 1.02s; }
html.anim .portada .documento .fila:nth-child(3) { animation-delay: 1.14s; }
html.anim .portada .documento .fila:nth-child(4) { animation-delay: 1.26s; }
html.anim .portada .sello { animation-delay: 1.5s; }     /* el sello se estampa al final */

/* Encabezado de las páginas internas */
html.anim .cabecera h1      { animation: gnSubir .8s cubic-bezier(.2,.7,.2,1) both .05s; }
html.anim .cabecera .bajada { animation: gnSubir .8s cubic-bezier(.2,.7,.2,1) both .2s; }

/* Menú: sombra al bajar */
.menu { transition: box-shadow .25s; }
html.anim .menu.con-sombra { box-shadow: 0 6px 20px -12px rgba(30,34,34,.28); }

/* Botones flotantes: entran después de la portada */
@keyframes gnAparecer { from { opacity: 0; transform: scale(.6); } to { opacity: 1; transform: none; } }
html.anim .flotantes > * { animation: gnAparecer .45s cubic-bezier(.2,.9,.3,1.3) both; }
html.anim .flotantes > :nth-child(1) { animation-delay: 1.4s; }
html.anim .flotantes > :nth-child(2) { animation-delay: 1.5s; }
html.anim .flotantes > :nth-child(3) { animation-delay: 1.6s; }

/* Detalles al pasar el cursor */
html.anim .lista > li { transition: transform .2s ease; }
html.anim .lista > li:hover { transform: translateX(4px); }
html.anim .lista .icono { transition: background-color .2s, color .2s; }
html.anim .lista > li:hover .icono { background: var(--pizarra); color: #fff; }
html.anim .boton { transition: transform .15s ease, background-color .15s, border-color .15s, color .15s; }
html.anim .boton:hover { transform: translateY(-1px); }