/* ══════════════════════════════════════════════════════════
   CASCADAS DE QUETZALAPAN — "Quetzalapan, 100 años de historia"
   Página propia (26-sep-2026). Usa las bases de estilos.css y
   comun.css (menú, pie, idiomas); aquí solo va lo suyo.

   Identidad de la página: AGUA (turquesa), ROCA (caliza cálida),
   BOSQUE (verde muy oscuro) y el PATRIMONIO HIDROELÉCTRICO de
   1927–1930 (cobre y la luz ámbar de un foco). Todo el contenido
   se ve al cargar: las animaciones (el agua de la regla, la turbina,
   la corriente de los cables, la franja del 360 y los dibujos de las
   actividades) son adorno y se apagan con "reducir movimiento".
   ══════════════════════════════════════════════════════════ */

.qz-pag{
  --qz-bosque:#0B2520;
  --qz-bosque-2:#113129;
  --qz-agua:#00A6C8;
  --qz-agua-cl:#8FDDEE;
  --qz-agua-txt:#006B82;
  --qz-espuma:#EDF5F2;
  --qz-roca:#F1ECE3;
  --qz-roca-2:#D9CFBE;
  --qz-roca-txt:#6A6154;
  --qz-cobre:#C8773A;
  --qz-cobre-cl:#EBAA70;
  --qz-luz:#FFC94A;
  --qz-tinta:#13241F;
  --qz-gris:#4B5752;
  background:#FFFDF8;
  color:var(--qz-tinta);
}
.qz-pag main{display:block;overflow-x:clip}

.qz-wrap{max-width:1180px;margin:0 auto;padding:0 28px}

/* ── piezas comunes ─────────────────────────────────────── */
.qz-ey{
  font-family:'Oswald',sans-serif;font-weight:500;letter-spacing:.24em;
  text-transform:uppercase;font-size:12.5px;line-height:1.3;
  color:var(--qz-agua-txt);display:flex;align-items:center;gap:12px;margin:0 0 16px;
}
.qz-ey::before{content:"";flex:none;width:34px;height:2px;background:currentColor}
.qz-oscuro .qz-ey{color:var(--qz-agua-cl)}

.qz-h2{
  font-family:'Fraunces',Georgia,serif;font-weight:900;
  font-size:clamp(32px,4.4vw,58px);line-height:1.03;letter-spacing:-.015em;
  color:var(--qz-tinta);margin:0;text-wrap:balance;
  word-break:auto-phrase;   /* japonés: no parte las palabras a la mitad */
}
.qz-h2 em{font-style:italic;font-weight:600;color:var(--qz-agua-txt)}
.qz-oscuro .qz-h2{color:#fff}
.qz-oscuro .qz-h2 em{color:var(--qz-cobre-cl)}

.qz-p{font-size:17px;line-height:1.7;color:var(--qz-gris);max-width:60ch;margin:18px 0 0;text-wrap:pretty}
.qz-oscuro .qz-p{color:rgba(255,255,255,.8)}

.qz-centro{text-align:center;max-width:780px;margin:0 auto}
.qz-centro .qz-p{margin-left:auto;margin-right:auto}
.qz-ey-c{justify-content:center}
.qz-ey-c::after{content:"";flex:none;width:34px;height:2px;background:currentColor}
.qz-vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.qz-foto{margin:0;position:relative;border-radius:20px;overflow:hidden;background:var(--qz-roca-2)}
.qz-foto img{width:100%;height:100%;object-fit:cover}
.qz-foto figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:48px 18px 14px;
  font-size:13.5px;line-height:1.4;color:#fff;
  background:linear-gradient(0deg,rgba(6,20,16,.72),rgba(6,20,16,0));
}

.qz-btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  font-size:14px;line-height:1;padding:15px 24px;border-radius:999px;border:2px solid transparent;
  transition:transform .18s,background-color .18s,filter .18s;
}
.qz-btn svg{width:18px;height:18px;flex:none}
.qz-btn-agua{background:var(--qz-agua);border-color:var(--qz-agua);color:#03211D}
.qz-btn-agua:hover{filter:brightness(1.08);transform:translateY(-2px)}
.qz-btn-claro{border-color:rgba(255,255,255,.78);color:#fff;background:rgba(255,255,255,.08);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.qz-btn-claro:hover{background:rgba(255,255,255,.18);transform:translateY(-2px)}

.qz-link{
  display:inline-flex;align-items:center;gap:8px;margin-top:22px;
  font-weight:700;font-size:16px;color:var(--qz-agua-txt);
  border-bottom:2px solid currentColor;padding-bottom:3px;
}
.qz-link svg{width:18px;height:18px;transition:transform .18s}
.qz-link:hover svg{transform:translateX(4px)}
.qz-link-claro{color:#fff}

.qz-pag a:focus-visible,.qz-pag button:focus-visible{outline:3px solid var(--qz-agua);outline-offset:3px;border-radius:6px}

/* La línea de los 7 colores de Pueblos Mágicos, en bloques planos */
.qz-colores{
  display:block;height:7px;
  background:linear-gradient(90deg,#EC0A82 0 14.2857%,#F0183A 0 28.5714%,#F7941D 0 42.8571%,#FBB200 0 57.1429%,#5FB924 0 71.4286%,#00A6C8 0 85.7143%,#7C2D8E 0);
}

/* ══ PORTADA ═══════════════════════════════════════════════ */
.qz-hero{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:min(calc(100svh - 62px),980px);
  display:flex;align-items:flex-end;
  background:var(--qz-bosque);color:#fff;
}
.qz-hero-foto,.qz-hero-foto img{position:absolute;inset:0;width:100%;height:100%}
.qz-hero-foto{z-index:-2}
.qz-hero-foto img{object-fit:cover;object-position:50% 45%}
.qz-hero::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(6,20,16,.84) 0%,rgba(6,20,16,.6) 30%,rgba(6,20,16,.12) 58%,rgba(6,20,16,0) 75%),
    linear-gradient(0deg,rgba(6,20,16,.7) 0%,rgba(6,20,16,0) 40%);
}
.qz-hero-in{width:100%;padding-top:48px;padding-bottom:clamp(44px,7svh,88px)}
.qz-crumb{font-family:'Oswald',sans-serif;letter-spacing:.16em;text-transform:uppercase;font-size:11px;color:rgba(255,255,255,.8);margin-bottom:22px;text-shadow:0 1px 10px rgba(0,0,0,.55)}
.qz-crumb a:hover{color:#fff}
.qz-kicker{font-family:'Oswald',sans-serif;font-weight:500;letter-spacing:.24em;text-transform:uppercase;font-size:13px;line-height:1.4;color:var(--qz-agua-cl);margin:0 0 12px;max-width:560px;text-shadow:0 1px 12px rgba(0,0,0,.6)}
.qz-h1{margin:0;font-family:'Fraunces',Georgia,serif;font-weight:900;line-height:.92;max-width:780px}
.qz-h1-nombre{display:block;font-size:clamp(42px,min(6.2vw,9.4svh),88px);letter-spacing:-.02em;text-shadow:0 2px 24px rgba(0,0,0,.25)}
.qz-h1-cien{display:flex;align-items:flex-end;gap:clamp(12px,1.6vw,22px);margin-top:2px}
.qz-cien{
  font-size:clamp(120px,min(19vw,30svh),268px);line-height:.8;letter-spacing:-.05em;
  font-variant-numeric:lining-nums;padding-right:.03em;
  background:linear-gradient(180deg,#fff 0%,#fff 52%,#A8E8F4 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 8px 30px rgba(0,0,0,.35));
}
.qz-h1-anos{
  font-style:italic;font-weight:500;font-size:clamp(26px,min(3.3vw,5.2svh),46px);line-height:1.02;
  padding-bottom:.28em;letter-spacing:-.005em;text-shadow:0 2px 18px rgba(0,0,0,.3);
}
.qz-sello{
  display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:24px 0 0;
  font-family:'Oswald',sans-serif;font-weight:500;letter-spacing:.2em;text-transform:uppercase;font-size:12.5px;line-height:1.3;
  padding:8px 18px 8px 16px;border-radius:999px;color:#fff;
  border:1px solid rgba(235,170,112,.7);background:rgba(200,119,58,.22);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
}
.qz-sello-anios{display:inline-flex;align-items:center;gap:8px;color:var(--qz-cobre-cl);font-weight:600;letter-spacing:.1em;font-size:16px;white-space:nowrap}
/* el guion va en el texto (lo leen los lectores de pantalla) y se dibuja como un hilo */
.qz-guion{display:inline-block;width:22px;height:1.5px;overflow:hidden;color:transparent;background:currentColor;background:var(--qz-cobre-cl);vertical-align:middle}
.qz-hero-lead{font-size:clamp(16.5px,1.35vw,19px);line-height:1.6;max-width:42ch;color:rgba(255,255,255,.92);margin:18px 0 0;text-shadow:0 1px 14px rgba(0,0,0,.35)}
.qz-acciones{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.qz-hero .qz-colores{position:absolute;left:0;right:0;bottom:0}

/* ══ CIFRAS ════════════════════════════════════════════════ */
.qz-datos{background:var(--qz-bosque);color:#fff;padding:34px 0 36px}
.qz-datos-lista{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
/* cada cifra centrada en su columna: la banda queda pareja de lado a lado */
.qz-datos-lista li{padding:4px 16px;border-left:1px solid rgba(255,255,255,.14);text-align:center}
.qz-datos-lista li:first-child{border-left:0}
.qz-dato-n{display:block;font-family:'Fraunces',Georgia,serif;font-weight:900;font-size:clamp(32px,3.6vw,50px);line-height:1;letter-spacing:-.02em;color:var(--qz-agua-cl);white-space:nowrap}
.qz-dato-t{display:block;margin-top:9px;font-size:14.5px;line-height:1.35;color:rgba(255,255,255,.78)}

/* ══ EL SALTO ══════════════════════════════════════════════ */
.qz-salto{padding:clamp(76px,9vw,124px) 0}
.qz-salto-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(32px,5vw,72px);align-items:center}
/* La foto ya viene en 4:5 con la cascada completa al centro: no se recorta en ninguna pantalla */
.qz-foto-caida{aspect-ratio:4/5}
.qz-foto-caida img{object-position:50% 50%}

/* La regla: la altura de la caída dibujada con agua que corre */
.qz-regla{position:relative;height:84px;margin-top:40px;max-width:520px}
.qz-regla-agua,.qz-regla-marcas{position:absolute;left:0;right:0}
.qz-regla-agua{
  top:30px;height:12px;border-radius:8px;overflow:hidden;
  background:linear-gradient(90deg,#CFF3FA,var(--qz-agua) 55%,#05606B);
}
/* 28-sep-2026 (rendimiento): las rayitas del agua eran un background-position
   animado (se repintaba cada cuadro). Ahora son una capa 300 px más ancha que
   se desliza con transform: 10 rayas (30 px) por vuelta de 14 s, la misma
   velocidad de antes (30 px cada 1.4 s). */
.qz-regla-agua::before{
  content:"";position:absolute;top:0;bottom:0;left:-300px;right:0;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.6) 0 10px,rgba(255,255,255,0) 10px 30px);
  animation:qz-corre 14s linear infinite;
}
.qz-regla-marcas{
  top:48px;height:12px;
  background:
    linear-gradient(90deg,var(--qz-roca-txt) 0 2px,transparent 2px) 0 0/10% 100% repeat-x,
    linear-gradient(90deg,transparent calc(100% - 2px),var(--qz-roca-txt) 0);
  opacity:.55;
}
.qz-r{position:absolute;top:0;font-family:'Oswald',sans-serif;font-weight:500;font-size:13px;letter-spacing:.08em;color:var(--qz-roca-txt);line-height:1;white-space:nowrap}
.qz-r0{left:0}
.qz-r50{left:50%;transform:translateX(-50%)}
.qz-r100{right:0;color:var(--qz-agua-txt);font-weight:600;font-size:15px}
@keyframes qz-corre{to{transform:translateX(300px)}}

/* ══ HISTORIA ══════════════════════════════════════════════ */
.qz-historia{
  position:relative;overflow:hidden;overflow:clip;color:#fff;padding:clamp(84px,10vw,136px) 0;
  background:
    radial-gradient(900px 520px at 88% 6%,rgba(200,119,58,.2),rgba(200,119,58,0) 62%),
    radial-gradient(700px 500px at 0% 100%,rgba(0,166,200,.12),rgba(0,166,200,0) 60%),
    var(--qz-bosque);
}
.qz-historia::before{
  content:"1927";position:absolute;right:-1.5vw;top:28px;pointer-events:none;
  font-family:'Fraunces',Georgia,serif;font-weight:900;line-height:1;letter-spacing:-.04em;
  font-size:clamp(150px,24vw,360px);color:rgba(255,255,255,.04);
}
.qz-hist-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(36px,5vw,76px);align-items:start}
/* 29-sep-2026 (ronda 3, Uriel): se quitó la foto de los dos brazos que ocupaba la
   columna derecha. En escritorio la historia se reparte sola en dos columnas: la
   entrada (antetítulo, título y párrafo, fija al bajar) a la izquierda y la línea
   del tiempo a la derecha, para no dejar media sección vacía. En celular sigue en
   una columna. */
@media (min-width:861px){
  .qz-hist-tx{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);column-gap:clamp(36px,5vw,76px);align-items:start}
  .qz-hist-cab{position:sticky;top:110px}
  .qz-hist-tx>.qz-linea{margin-top:6px}
}
/* 29-sep-2026 (ronda 4, Uriel: "dejaste un hueco en Quetzalapan"): la postal
   antigua del campamento de la planta llena la columna izquierda en escritorio.
   Va dentro de la entrada fija, así acompaña a la línea del tiempo al bajar. El
   pie va debajo de la foto (no encima, como en .qz-foto) para no tapar la
   leyenda escrita a mano. En celular no se muestra: la sección queda igual. */
.qz-foto-archivo{display:none}
@media (min-width:861px){
  .qz-foto-archivo{display:block;margin:30px 0 0;background:none;border-radius:0;overflow:visible}
  .qz-foto-archivo img{display:block;height:auto;aspect-ratio:3/2;border-radius:14px;background:#2B2A22;box-shadow:0 18px 40px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.12)}
  .qz-foto-archivo figcaption{position:static;padding:12px 2px 0;background:none;font-size:13.5px;line-height:1.45;color:rgba(255,255,255,.74)}
  .qz-foto-archivo figcaption small{display:block;margin-top:3px;font-size:12px;line-height:1.4;color:rgba(255,255,255,.5)}
}
/* ventanas bajas (la entrada con la postal mide ~655 px y la barra 67 px): se
   fija más arriba y, si ni así cabe, se queda en su lugar */
@media (min-width:861px) and (max-height:779px){
  .qz-hist-cab{top:80px}
}
@media (min-width:861px) and (max-height:739px){
  .qz-hist-cab{position:static}
}
.qz-linea{list-style:none;margin:44px 0 0;padding:0;position:relative}
.qz-hito{position:relative;padding:0 0 38px 58px;--seg:linear-gradient(180deg,var(--qz-cobre-cl),var(--qz-luz))}
.qz-hito:last-child{padding-bottom:0}
/* el tramo que baja de cada hito al siguiente */
.qz-hito:not(:last-child)::after{content:"";position:absolute;left:11px;top:40px;bottom:-6px;width:2px;background:var(--seg);border-radius:2px}
.qz-hito::before{
  content:"";position:absolute;left:0;top:9px;width:24px;height:24px;border-radius:50%;box-sizing:border-box;
  background:var(--qz-bosque);border:2px solid var(--qz-cobre-cl);box-shadow:0 0 0 6px rgba(200,119,58,.14);
}
.qz-hito-luz{--seg:var(--qz-luz)}
.qz-hito-luz2{--seg:linear-gradient(180deg,var(--qz-luz),rgba(255,255,255,.28))}
.qz-hito-luz::before{background:var(--qz-luz);border-color:var(--qz-luz);box-shadow:0 0 0 6px rgba(255,201,74,.2),0 0 30px rgba(255,201,74,.6)}
/* los años sin funcionar: tramo punteado y foco apagado */
.qz-hito-apagada{--seg:repeating-linear-gradient(180deg,rgba(255,255,255,.34) 0 5px,transparent 5px 12px)}
.qz-hito-apagada::before{background:#1B3A32;border:2px dashed rgba(255,255,255,.45);box-shadow:none}
.qz-hito-agua{--seg:linear-gradient(180deg,var(--qz-agua-cl),rgba(255,255,255,.5))}
.qz-hito-agua::before{background:var(--qz-agua);border-color:var(--qz-agua-cl);box-shadow:0 0 0 6px rgba(0,166,200,.22),0 0 30px rgba(0,166,200,.65)}
.qz-hito-hoy::before{border-color:rgba(255,255,255,.7);box-shadow:0 0 0 6px rgba(255,255,255,.07)}
.qz-hito .qz-fecha{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0;max-width:none}
.qz-anio{display:block;font-family:'Oswald',sans-serif;font-weight:600;font-size:clamp(40px,4.4vw,60px);line-height:1;letter-spacing:.02em;color:var(--qz-cobre-cl);white-space:nowrap}
.qz-dia{font-family:'Oswald',sans-serif;font-weight:500;font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.66);white-space:nowrap}
.qz-hito-luz .qz-anio{color:var(--qz-luz)}
.qz-hito-apagada .qz-anio{color:rgba(255,255,255,.5)}
.qz-hito-agua .qz-anio{color:var(--qz-agua-cl)}
.qz-hito-hoy .qz-anio{color:#fff}
.qz-hito h3{font-family:'Fraunces',Georgia,serif;font-weight:800;font-size:clamp(21px,2vw,26px);line-height:1.2;margin:10px 0 8px;color:#fff;text-wrap:balance}
.qz-hito p:not(.qz-fecha){text-wrap:pretty;margin:0;font-size:16.5px;line-height:1.65;color:rgba(255,255,255,.8);max-width:54ch}
.qz-hito-apagada h3{color:rgba(255,255,255,.86)}

/* La red de 1930: del río a tres pueblos (esquema, no mapa) */
.qz-red{
  position:relative;isolation:isolate;overflow:hidden;margin-top:clamp(52px,6vw,84px);padding:clamp(22px,3vw,34px);
  border:1px solid rgba(255,255,255,.14);border-radius:24px;background:#081C17;
}
/* la cascada, muy desenfocada y oscura, detrás del esquema; el velo asegura el contraste */
.qz-red-fondo{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.qz-red::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,rgba(5,18,14,.62),rgba(5,18,14,.3) 50%,rgba(5,18,14,.62)),linear-gradient(180deg,rgba(5,18,14,.35),rgba(5,18,14,0) 40%);
}
.qz-red-cab{justify-content:center;text-align:center}
.qz-red-cab{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 20px}
.qz-red-cab h3{margin:0;font-family:'Fraunces',Georgia,serif;font-weight:800;font-size:clamp(22px,2.4vw,30px);color:#fff}
.qz-red-cab p{margin:0;font-size:15px;color:rgba(255,255,255,.7)}
.qz-red-diag{display:grid;grid-template-columns:minmax(0,1fr) minmax(70px,1.4fr) minmax(0,1fr);align-items:center;margin-top:24px}
.qz-red-fuente{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;color:var(--qz-agua-cl)}
.qz-red-fuente b{font-family:'Oswald',sans-serif;font-weight:500;letter-spacing:.08em;text-transform:uppercase;font-size:13px;line-height:1.35;color:#fff;max-width:17ch}
/* 28-sep-2026 (rendimiento): las aspas son su propio svg encima del aro y
   giran como caja (compositor), no como grupo dentro del svg; el eje (el
   círculo del centro) va con ellas porque girarlo no lo cambia. 10 vueltas
   por iteración: misma velocidad (una vuelta cada 9 s). */
.qz-turbina{position:relative;display:block;width:clamp(56px,7vw,86px);aspect-ratio:1}
.qz-turbina svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.qz-turbina-aspas{animation:qz-gira 90s linear infinite}
@keyframes qz-gira{to{transform:rotate(3600deg)}}
.qz-red-cables{width:100%;height:150px;display:block;overflow:visible}
/* 28-sep-2026 (rendimiento): el guion que corre por el cable es un
   stroke-dashoffset (se repinta cada cuadro) sobre un svg estirado con trazo
   que no escala: no se puede pasar a transform sin cambiar el dibujo. Da
   3 vueltas al llegar a la vista y se queda quieto (-24 es dos periodos:
   termina igual que empieza). */
.qz-cable{stroke:var(--qz-luz);stroke-dasharray:3 9;animation:qz-luz 1.2s linear 3;opacity:.95}
@keyframes qz-luz{to{stroke-dashoffset:-24}}
.qz-red-pueblos{list-style:none;margin:0;padding:0;display:grid;grid-template-rows:repeat(3,50px)}
.qz-red-pueblos li{display:flex;align-items:center;gap:12px;font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:clamp(17px,2vw,24px);color:#fff}
.qz-red-pueblos li::before{content:"";flex:none;width:14px;height:14px;border-radius:50%;background:var(--qz-luz);box-shadow:0 0 0 5px rgba(255,201,74,.18),0 0 22px rgba(255,201,74,.75)}

/* ══ 365 ESCALONES ═════════════════════════════════════════ */
.qz-365{background:var(--qz-roca);padding:clamp(84px,10vw,136px) 0}
.qz-365-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(36px,5vw,72px);align-items:center}
.qz-365-h{display:flex;flex-direction:column}
.qz-365-n{
  display:block;font-size:clamp(128px,17vw,232px);line-height:.8;letter-spacing:-.05em;
  color:var(--qz-bosque);margin-bottom:14px;font-variant-numeric:lining-nums;
}
.qz-365-sub{font-size:clamp(28px,3.4vw,44px);line-height:1.08}
.qz-p-fuerte{color:var(--qz-tinta);font-weight:600}

/* La escalera del año: 12 tramos (uno por mes) que bajan hasta el agua. Cada
   tramo mide lo que su mes y lleva una marca por escalón (365 en total). */
.qz-escalera{margin:0}
.qz-esc-zona{position:relative;padding-top:54px}
.qz-esc{
  list-style:none;margin:0;padding:0;display:grid;align-items:end;
  grid-template-columns:31fr 28fr 31fr 30fr 31fr 30fr 31fr 31fr 30fr 31fr 30fr 31fr 40fr;
  height:clamp(200px,24vw,300px);border-bottom:3px solid var(--qz-roca-2);
}
.qz-esc li{position:relative;height:var(--h);background:var(--c);background:linear-gradient(180deg,var(--c),color-mix(in srgb,var(--c) 72%,#0B2520));box-shadow:inset 2px 0 0 rgba(0,0,0,.13)}
.qz-esc li:first-child{border-radius:4px 0 0 0}
/* la huella de cada tramo: una marca por día = un escalón */
.qz-esc li:not(.qz-esc-poza)::before{
  content:"";position:absolute;left:0;right:0;top:0;height:10px;
  border-top:2px solid rgba(255,255,255,.6);
  background:linear-gradient(90deg,rgba(255,255,255,.5) 0 1px,transparent 1px) 0 0/calc(100% / var(--d)) 100% repeat-x,rgba(255,255,255,.14);
}
.qz-esc li > span{
  position:absolute;left:50%;top:17px;transform:translateX(-50%);
  font-family:'Oswald',sans-serif;font-weight:500;font-size:clamp(9.5px,.95vw,12.5px);letter-spacing:.05em;
  text-transform:uppercase;line-height:1;color:#fff;white-space:nowrap;
}
.qz-esc .d31{--d:31}.qz-esc .d30{--d:30}.qz-esc .d28{--d:28}
.qz-esc li:nth-child(1){--h:100%;--c:#2C5A37}
.qz-esc li:nth-child(2){--h:92.3%;--c:#31633B}
.qz-esc li:nth-child(3){--h:84.6%;--c:#366D41}
.qz-esc li:nth-child(4){--h:76.9%;--c:#3A7748}
.qz-esc li:nth-child(5){--h:69.2%;--c:#3C8150}
.qz-esc li:nth-child(6){--h:61.5%;--c:#3B8A5B}
.qz-esc li:nth-child(7){--h:53.8%;--c:#379268}
.qz-esc li:nth-child(8){--h:46.2%;--c:#2F9A77}
.qz-esc li:nth-child(9){--h:38.5%;--c:#239F87}
.qz-esc li:nth-child(10){--h:30.8%;--c:#14A298}
.qz-esc li:nth-child(11){--h:23.1%;--c:#07A4AD}
.qz-esc li:nth-child(12){--h:15.4%;--c:#00A6C8}
/* al pie de la escalera, la cascada cae a su poza */
.qz-esc li.qz-esc-poza{height:100%;background:none;box-shadow:none}
/* 28-sep-2026 (rendimiento): antes el chorro era un ::before con
   background-position animado (repintado cada cuadro). Ahora el chorro es un
   <i> que recorta y adentro baja una capa de franjas con transform: 10
   franjas (20 px) por vuelta de 10 s, la misma velocidad de antes. */
.qz-esc-chorro{
  position:absolute;left:50%;top:6px;bottom:9%;width:9px;margin-left:-4.5px;border-radius:5px 5px 0 0;overflow:hidden;
}
.qz-esc-chorro::before{
  content:"";position:absolute;left:0;right:0;top:-200px;bottom:0;
  background:repeating-linear-gradient(180deg,rgba(255,255,255,.95) 0 9px,#8FDDEE 9px 20px);
  animation:qz-cae 10s linear infinite;
}
.qz-esc-poza::after{
  content:"";position:absolute;left:-8px;right:0;bottom:0;height:11%;
  border-radius:50% 50% 0 0/70% 70% 0 0;background:linear-gradient(180deg,#8FDDEE,var(--qz-agua) 45%,#05606B);
}
@keyframes qz-cae{to{transform:translateY(200px)}}
.qz-esc-caminante{position:absolute;left:.6%;top:14px;width:25px;height:38px;color:var(--qz-bosque)}
.qz-esc-cima,.qz-esc-fin,.qz-esc-mitad{font-family:'Oswald',sans-serif;font-weight:500;letter-spacing:.12em;text-transform:uppercase;line-height:1.3}
.qz-esc-cima{position:absolute;left:44px;top:18px;margin:0;font-size:12.5px;color:var(--qz-bosque);white-space:nowrap}
.qz-esc-jul .qz-esc-mitad{
  position:absolute;left:0;bottom:calc(100% + 10px);width:max-content;max-width:160px;
  padding:2px 0 2px 10px;border-left:2px solid var(--qz-cobre);
  font-style:normal;font-size:11.5px;color:#8A4A1C;
}
.qz-esc-fin{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:2px 14px;margin:12px 0 0;font-size:12.5px;color:var(--qz-roca-txt);text-align:right}
.qz-esc-fin b{font-weight:600;color:var(--qz-agua-txt)}
.qz-escalera figcaption{margin-top:20px;font-size:14px;line-height:1.5;color:var(--qz-roca-txt);max-width:48ch}
.qz-foto-escalones{margin-top:clamp(44px,6vw,72px);aspect-ratio:2/1}
/* 28-sep-2026 (Q1): la caída lateral (foto 5 de Uriel). En 2:1 se ve la cima
   del agua con la pared de roca y solo se recorta la poza; en 3:2 y 4:3 cabe completa. */
.qz-foto-escalones img{object-position:50% 18%}

/* ══ VER EN 360 ════════════════════════════════════════════ */
.qz-v360{padding:clamp(84px,10vw,136px) 0;background:#FFFDF8}
.qz-v360-marco{
  position:relative;isolation:isolate;overflow:hidden;margin-top:clamp(32px,4vw,44px);
  border-radius:28px;aspect-ratio:5/2;container-type:inline-size;background:var(--qz-bosque);
  box-shadow:0 30px 70px rgba(11,37,32,.2);
}
/* la franja mide 4:1: a lo alto de la tarjeta queda 1.6 veces más ancha (3 en
   el celular). 28-sep-2026 (Q1, pedido de Uriel): la vista ARRANCA con la
   cascada al centro (está al 49.6 % de la franja) y se queda ahí unos
   segundos; luego gira despacio hacia la sierra, cruza al otro extremo y
   vuelve a la cascada. Misma velocidad de antes (un extremo al otro en ~50 s).
   Fuera de la pantalla, .anim-fuera (comun.js) la deja en pausa: al llegar a
   la sección se ve la cascada primero. */
.qz-v360-tira{position:absolute;top:0;left:0;height:100%;width:auto;max-width:none;aspect-ratio:4/1;transform:translateX(calc(-49.6% + 50cqw));animation:qz-pano 120s ease-in-out infinite;will-change:transform}
@keyframes qz-pano{
  0%,5%{transform:translateX(calc(-49.6% + 50cqw))}
  27%,29%{transform:translateX(0)}
  71%,73%{transform:translateX(calc(-100% + 100cqw))}
  95%,100%{transform:translateX(calc(-49.6% + 50cqw))}
}
.qz-v360-marco::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(0deg,rgba(6,20,16,.62),rgba(6,20,16,0) 40%),linear-gradient(180deg,rgba(6,20,16,.3),rgba(6,20,16,0) 26%);
}
.qz-v360-sello{
  position:absolute;z-index:2;left:22px;top:20px;display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px 8px 11px;border-radius:999px;background:rgba(8,26,21,.55);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  font-family:'Oswald',sans-serif;font-weight:600;font-size:15px;letter-spacing:.08em;color:#fff;
}
.qz-v360-sello svg{width:22px;height:22px;color:var(--qz-agua-cl)}
.qz-v360-pie{position:absolute;z-index:2;left:0;right:0;bottom:clamp(18px,3vw,30px);display:flex;justify-content:center;padding:0 16px}
.qz-v360-btn{position:relative;box-shadow:0 10px 30px rgba(0,0,0,.3)}
/* toda la tarjeta lleva al recorrido (el marco recorta el área) */
.qz-v360-btn::after{content:"";position:absolute;inset:-1200px}

/* ══ LOS CINCO EJES ════════════════════════════════════════ */
.qz-ejes{position:relative;isolation:isolate;overflow:hidden;color:#fff;padding:clamp(96px,12vw,168px) 0;background:var(--qz-bosque-2)}
.qz-ejes-foto,.qz-explora-foto{position:absolute;inset:0;z-index:-2}
.qz-ejes-foto img,.qz-explora-foto img{width:100%;height:100%;object-fit:cover}
.qz-ejes::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,26,21,.5),rgba(8,26,21,.72))}
.qz-ejes-lista{
  list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 0;
  font-family:'Fraunces',Georgia,serif;font-weight:800;font-size:clamp(30px,5.2vw,70px);line-height:1.12;letter-spacing:-.015em;
}
.qz-ejes-lista li{text-shadow:0 2px 26px rgba(0,0,0,.35)}
.qz-ejes .qz-wrap{text-align:center}
.qz-ejes .qz-ey{justify-content:center}
.qz-ejes .qz-ey::after{content:"";flex:none;width:34px;height:2px;background:currentColor}
.qz-ejes-lista{justify-content:center}
.qz-ejes-lista li:nth-child(even){font-style:italic;font-weight:500;color:var(--qz-agua-cl)}
.qz-ejes-lista li:not(:last-child)::after{content:"·";margin:0 .32em;color:var(--qz-cobre-cl);font-style:normal}

/* ══ AVENTURA ══════════════════════════════════════════════ */
.qz-aventura{padding:clamp(84px,10vw,136px) 0}
.qz-cab{margin-bottom:clamp(32px,4vw,44px)}
.qz-nota{display:flex;align-items:flex-start;justify-content:center;text-align:left;gap:10px;margin:18px auto 0;max-width:640px;font-size:15px;line-height:1.5;color:var(--qz-gris)}
.qz-nota svg{flex:none;width:20px;height:20px;margin-top:1px;color:var(--qz-agua-txt)}


/* La tarjeta que rota: una actividad a la vez, todas apiladas en la misma
   celda (la más alta fija la altura: no brinca al cambiar) */
.qz-rota{position:relative}
.qz-rota-lista{list-style:none;margin:0;padding:0;display:grid}
.qz-rs{
  grid-area:1/1;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:clamp(20px,4vw,56px);
  padding:clamp(24px,3.4vw,44px) clamp(22px,3.6vw,52px);border-radius:24px;color:#fff;
  background:
    radial-gradient(520px 300px at 18% 110%,rgba(0,166,200,.32),rgba(0,166,200,0) 70%),
    radial-gradient(420px 260px at 100% 0%,rgba(200,119,58,.22),rgba(200,119,58,0) 70%),
    var(--qz-bosque);
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .6s ease,transform .6s ease,visibility 0s linear .6s;
}
.qz-rs-on{opacity:1;visibility:visible;transform:none;transition:opacity .6s ease,transform .6s ease,visibility 0s}
/* !important: las capas de los dibujos llevan su propio animation (que
   devuelve play-state a running); fuera de la tarjeta activa todo descansa */
.qz-rs:not(.qz-rs-on) *{animation-play-state:paused!important}
.qz-rs-ilu{position:relative}
.qz-rs-ilu svg{display:block;width:100%;height:auto;overflow:visible}
/* 28-sep-2026 (rendimiento en gama baja): lo que se mueve en cada dibujo va
   en su propia capa (.qz-capa: svg o span del tamaño del dibujo, mismo
   viewBox 560×262) y anima transform/opacity como caja: corre en el
   compositor. Antes eran grupos dentro del svg y el teléfono recalculaba
   estilo, layout y pintura en cada cuadro. Las medidas van en % de la capa
   (= unidades del viewBox) y cada iteración junta varias vueltas: en la
   página completa, cada fin de iteración le costaba una ráfaga de cuadros al
   hilo principal. Se ve igual. */
.qz-rs-ilu .qz-capa{position:absolute;left:0;top:0;display:block;width:100%;height:100%;overflow:visible}
.qz-marcha svg{position:absolute;display:block;overflow:visible;transform:var(--i)}
.qz-rs-k{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0 0 10px;font-family:'Oswald',sans-serif;font-weight:500;letter-spacing:.22em;text-transform:uppercase;font-size:12.5px;color:var(--qz-cobre-cl)}
.qz-rs-num{letter-spacing:.14em;color:rgba(255,255,255,.5)}
.qz-rs-tx h3{text-spacing-trim:trim-start;margin:0;font-family:'Fraunces',Georgia,serif;font-weight:900;font-size:clamp(30px,3.4vw,46px);line-height:1.02;letter-spacing:-.01em;text-wrap:balance;word-break:auto-phrase}
.qz-rs-tx > p:not(.qz-rs-k){text-wrap:pretty;margin:14px 0 0;font-size:17.5px;line-height:1.6;color:rgba(255,255,255,.86);max-width:44ch}
.qz-rs-tx .qz-rs-ojo{display:flex;align-items:flex-start;gap:10px;margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.16);font-size:15px;color:var(--qz-agua-cl)}
.qz-rs-ojo svg{flex:none;width:20px;height:20px;margin-top:2px}
/* controles: pausa y un punto por actividad (el activo se alarga y se llena) */
.qz-rota-ctrl{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:16px}
.qz-rota-pausa{
  flex:none;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;padding:0;
  border-radius:50%;border:1.5px solid var(--qz-bosque);background:#fff;color:var(--qz-bosque);cursor:pointer;
  transition:background-color .18s,color .18s;
}
.qz-rota-pausa:hover{background:var(--qz-bosque);color:#fff}
.qz-rota-pausa svg{width:18px;height:18px}
.qz-rota-pausa .qz-ico-seguir,.qz-rota-pausa .qz-txt-seguir{display:none}
.qz-rota-pausa[aria-pressed="true"] .qz-ico-pausa,.qz-rota-pausa[aria-pressed="true"] .qz-txt-pausa{display:none}
.qz-rota-pausa[aria-pressed="true"] .qz-ico-seguir{display:block}
.qz-rota-pausa[aria-pressed="true"] .qz-txt-seguir{display:inline}
.qz-rota-puntos{display:flex;flex-wrap:wrap;justify-content:center}
.qz-punto{position:relative;width:34px;height:44px;padding:0;border:0;background:none;cursor:pointer}
/* 28-sep-2026 (rendimiento): el relleno del punto activo animaba width
   (un layout por cuadro durante 6.5 s). Ahora la barra (<i>) recorta y el
   relleno, de 28 px, entra deslizándose con transform. */
.qz-punto-barra{
  position:absolute;left:50%;top:50%;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:5px;overflow:hidden;
  background:rgba(11,37,32,.24);transition:width .3s,margin .3s,background-color .3s;
}
.qz-punto:hover .qz-punto-barra{background:rgba(11,37,32,.45)}
.qz-punto[aria-current="true"] .qz-punto-barra{width:28px;margin-left:-14px;background:rgba(0,107,130,.28)}
.qz-punto-barra::after{content:"";position:absolute;left:0;top:0;width:28px;height:100%;border-radius:5px;background:var(--qz-agua-txt);transform:translateX(-100%)}
.qz-punto[aria-current="true"] .qz-punto-barra::after{animation:qz-avance 6.5s linear forwards}
.qz-rota-quieta .qz-punto[aria-current="true"] .qz-punto-barra::after{animation:none;transform:none}
@keyframes qz-avance{to{transform:none}}

/* los dibujos: misma paleta que el cable (roca, pinos, agua, cobre y una figura blanca) */
.qz-ci-roca{fill:#1C4639}
.qz-ci-pino path{fill:#25584A}
.qz-ci-agua{fill:var(--qz-agua);opacity:.9}
.qz-ci-ola{fill:none;stroke:#CFF3FA;stroke-width:2.2;stroke-linecap:round;opacity:.7}
.qz-ci-poste{fill:none;stroke:var(--qz-roca-2);stroke-width:5;stroke-linecap:round}
.qz-ci-cable{fill:none;stroke:var(--qz-cobre-cl);stroke-width:3;stroke-linecap:round}
.qz-ci-cota path{fill:none;stroke:rgba(255,255,255,.62);stroke-width:1.6;stroke-dasharray:4 4}
.qz-ci-cota path:first-child{stroke-dasharray:4 5}
.qz-ci-cota text{font-family:'Oswald',sans-serif;font-weight:600;font-size:20px;letter-spacing:.04em;fill:var(--qz-agua-cl);text-anchor:end}
/* el equilibrista se mece sobre el cable */
.qz-equilibrista{transform-origin:49.7321% 25.3%;animation:qz-vaiven 18s ease-in-out infinite}
@keyframes qz-vaiven{0%{transform:rotate(-3deg)}10%{transform:rotate(3deg)}20%{transform:rotate(-3deg)}30%{transform:rotate(3deg)}40%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}60%{transform:rotate(-3deg)}70%{transform:rotate(3deg)}80%{transform:rotate(-3deg)}90%{transform:rotate(3deg)}100%{transform:rotate(-3deg)}}
.qz-ci-lejos{fill:#173F34}
.qz-ci-grieta{fill:none;stroke:#123328;stroke-width:2.2;stroke-linecap:round}
.qz-polea{fill:var(--qz-cobre-cl)}
.qz-cuerda{fill:none;stroke:var(--qz-luz);stroke-width:2;stroke-linecap:round}
.qz-pu-tirante{fill:none;stroke:rgba(235,170,112,.7);stroke-width:1.6}
.qz-pu-tablas{fill:none;stroke:#C9A57A;stroke-width:7;stroke-dasharray:7 3}
.qz-presas circle:nth-child(odd){fill:var(--qz-cobre-cl)}
.qz-presas circle:nth-child(even){fill:var(--qz-agua-cl)}
.qz-arco{fill:none;stroke:var(--qz-cobre-cl);stroke-width:4;stroke-linecap:round}
.qz-arco-cuerda{fill:none;stroke:rgba(255,255,255,.8);stroke-width:1.4}
.qz-diana-pata{fill:none;stroke:var(--qz-roca-2);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.qz-d1{fill:#fff}.qz-d2{fill:var(--qz-agua)}.qz-d3{fill:var(--qz-cobre-cl)}.qz-d4{fill:var(--qz-luz)}
.qz-flecha{fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;transform:translateX(-2.93%)}
.qz-flecha-punta{fill:#fff;stroke:none}
.qz-ruta-m path{fill:none;stroke:var(--qz-cobre-cl);stroke-width:4;stroke-linecap:round}
.qz-bandera{fill:var(--qz-luz)}
.qz-sol{fill:var(--qz-luz);opacity:.85}
.qz-baranda{fill:none;stroke:var(--qz-roca-2);stroke-width:2.6;stroke-linecap:round}
.qz-binocular{fill:var(--qz-cobre-cl)}
.qz-mirada{fill:none;stroke:rgba(255,255,255,.4);stroke-width:1.6;stroke-dasharray:3 7}
.qz-agua-m1 path,.qz-agua-m2 path{fill:none;stroke:#CFF3FA;stroke-width:6;stroke-linecap:round}
.qz-poza-onda{fill:none;stroke:#CFF3FA;stroke-width:2}
/* animaciones sencillas, una por dibujo (ver .qz-capa arriba) */
.qz-tiro-viaje{animation:qz-tiro 20.8s ease-in infinite}
@keyframes qz-tiro{0%{transform:translate(0,0);opacity:0}2%{opacity:1}19.5%{transform:translate(60.7143%,25.1145%);opacity:1}22.5%{transform:translate(60.7143%,25.1145%);opacity:0}24.99%{transform:translate(60.7143%,25.1145%);opacity:0}25%{transform:translate(0,0);opacity:0}27%{opacity:1}44.5%{transform:translate(60.7143%,25.1145%);opacity:1}47.5%{transform:translate(60.7143%,25.1145%);opacity:0}49.99%{transform:translate(60.7143%,25.1145%);opacity:0}50%{transform:translate(0,0);opacity:0}52%{opacity:1}69.5%{transform:translate(60.7143%,25.1145%);opacity:1}72.5%{transform:translate(60.7143%,25.1145%);opacity:0}74.99%{transform:translate(60.7143%,25.1145%);opacity:0}75%{transform:translate(0,0);opacity:0}77%{opacity:1}94.5%{transform:translate(60.7143%,25.1145%);opacity:1}97.5%{transform:translate(60.7143%,25.1145%);opacity:0}100%{transform:translate(60.7143%,25.1145%);opacity:0}}
.qz-pu-viaje{animation:qz-puente 21s linear infinite}
@keyframes qz-puente{0%{transform:translate(0,0);opacity:0}2%{opacity:1}16.667%{transform:translate(28.9286%,2.2901%)}30.667%{opacity:1}33.323%{transform:translate(53.5714%,0.5725%);opacity:0}33.333%{transform:translate(0,0);opacity:0}35.333%{opacity:1}50%{transform:translate(28.9286%,2.2901%)}64%{opacity:1}66.657%{transform:translate(53.5714%,0.5725%);opacity:0}66.667%{transform:translate(0,0);opacity:0}68.667%{opacity:1}83.333%{transform:translate(28.9286%,2.2901%)}97.333%{opacity:1}100%{transform:translate(53.5714%,0.5725%);opacity:0}}
.qz-ra-viaje{animation:qz-rappel 24s ease-in-out infinite}
@keyframes qz-rappel{0%{transform:translate(0,0);opacity:0}1.25%{opacity:1}3.75%{transform:translate(-2.1429%,7.6336%)}6.25%{transform:translate(0,14.5038%)}10%{transform:translate(-2.1429%,22.1374%)}12.5%{transform:translate(0,29.0076%)}16.25%{transform:translate(-2.1429%,36.6412%)}18.75%{transform:translate(0,43.5115%)}22.5%{opacity:1;transform:translate(0,49.6183%)}24.99%{opacity:0;transform:translate(0,49.6183%)}25%{transform:translate(0,0);opacity:0}26.25%{opacity:1}28.75%{transform:translate(-2.1429%,7.6336%)}31.25%{transform:translate(0,14.5038%)}35%{transform:translate(-2.1429%,22.1374%)}37.5%{transform:translate(0,29.0076%)}41.25%{transform:translate(-2.1429%,36.6412%)}43.75%{transform:translate(0,43.5115%)}47.5%{opacity:1;transform:translate(0,49.6183%)}49.99%{opacity:0;transform:translate(0,49.6183%)}50%{transform:translate(0,0);opacity:0}51.25%{opacity:1}53.75%{transform:translate(-2.1429%,7.6336%)}56.25%{transform:translate(0,14.5038%)}60%{transform:translate(-2.1429%,22.1374%)}62.5%{transform:translate(0,29.0076%)}66.25%{transform:translate(-2.1429%,36.6412%)}68.75%{transform:translate(0,43.5115%)}72.5%{opacity:1;transform:translate(0,49.6183%)}74.99%{opacity:0;transform:translate(0,49.6183%)}75%{transform:translate(0,0);opacity:0}76.25%{opacity:1}78.75%{transform:translate(-2.1429%,7.6336%)}81.25%{transform:translate(0,14.5038%)}85%{transform:translate(-2.1429%,22.1374%)}87.5%{transform:translate(0,29.0076%)}91.25%{transform:translate(-2.1429%,36.6412%)}93.75%{transform:translate(0,43.5115%)}97.5%{opacity:1;transform:translate(0,49.6183%)}100%{opacity:0;transform:translate(0,49.6183%)}}
.qz-es-viaje{animation:qz-escala 21s ease-in-out infinite}
@keyframes qz-escala{0%{transform:translateY(0);opacity:0}2%{opacity:1}6.667%{transform:translateY(-12.9771%)}9.333%{transform:translateY(-12.9771%)}14.667%{transform:translateY(-26.7176%)}17.333%{transform:translateY(-26.7176%)}22.667%{transform:translateY(-40.458%)}25.333%{transform:translateY(-40.458%)}30%{opacity:1;transform:translateY(-51.9084%)}33.323%{opacity:0;transform:translateY(-51.9084%)}33.333%{transform:translateY(0);opacity:0}35.333%{opacity:1}40%{transform:translateY(-12.9771%)}42.667%{transform:translateY(-12.9771%)}48%{transform:translateY(-26.7176%)}50.667%{transform:translateY(-26.7176%)}56%{transform:translateY(-40.458%)}58.667%{transform:translateY(-40.458%)}63.333%{opacity:1;transform:translateY(-51.9084%)}66.657%{opacity:0;transform:translateY(-51.9084%)}66.667%{transform:translateY(0);opacity:0}68.667%{opacity:1}73.333%{transform:translateY(-12.9771%)}76%{transform:translateY(-12.9771%)}81.333%{transform:translateY(-26.7176%)}84%{transform:translateY(-26.7176%)}89.333%{transform:translateY(-40.458%)}92%{transform:translateY(-40.458%)}96.667%{opacity:1;transform:translateY(-51.9084%)}100%{opacity:0;transform:translateY(-51.9084%)}}
.qz-flecha{animation:qz-flecha 18s cubic-bezier(.3,.1,.3,1) infinite}
.qz-diana{transform-origin:82.1429% 78.626%;animation:qz-diana 18s ease-out infinite}
.qz-marcha{position:absolute}
.qz-ruta-m{clip-path:polygon(3.628% 96.937%,6.64% 95.805%,9.634% 94.464%,12.605% 92.903%,15.548% 91.119%,18.461% 89.131%,21.346% 86.984%,27.076% 82.579%,28.515% 81.546%,29.961% 80.575%,31.416% 79.68%,32.881% 78.873%,34.356% 78.162%,35.841% 77.554%,37.334% 77.049%,38.835% 76.646%,41.863% 76.067%,44.903% 75.397%,47.935% 74.544%,50.953% 73.471%,52.456% 72.839%,53.952% 72.133%,55.44% 71.346%,56.918% 70.467%,58.384% 69.485%,59.833% 68.385%,61.261% 67.153%,62.661% 65.767%,64.023% 64.206%,64.687% 63.351%,65.335% 62.443%,65.967% 61.477%,66.58% 60.451%,67.17% 59.361%,67.733% 58.204%,68.265% 56.978%,68.763% 55.684%,69.225% 54.43%,69.718% 53.253%,70.245% 52.137%,70.801% 51.081%,71.381% 50.081%,71.982% 49.133%,73.236% 47.38%,74.543% 45.793%,75.89% 44.349%,77.267% 43.025%,78.667% 41.804%,80.084% 40.67%,81.517% 39.611%,82.96% 38.616%,85.872% 36.782%,88.809% 35.107%,91.762% 33.54%,94.724% 32.041%,94.828% 31.951%,94.913% 31.797%,94.972% 31.594%,94.999% 31.362%,94.991% 31.124%,94.949% 30.903%,94.877% 30.72%,94.782% 30.594%,94.673% 30.537%,94.562% 30.554%,91.594% 32.056%,88.632% 33.628%,85.68% 35.312%,82.747% 37.159%,81.291% 38.163%,79.843% 39.233%,78.407% 40.381%,76.986% 41.621%,75.584% 42.969%,74.208% 44.445%,72.865% 46.075%,71.57% 47.886%,70.945% 48.871%,70.339% 49.916%,69.757% 51.023%,69.201% 52.2%,68.678% 53.448%,68.197% 54.752%,67.728% 55.973%,67.224% 57.132%,66.689% 58.232%,66.126% 59.272%,65.54% 60.255%,64.932% 61.182%,64.307% 62.058%,63.665% 62.884%,62.343% 64.4%,60.978% 65.751%,59.581% 66.957%,58.158% 68.036%,56.716% 69.003%,55.259% 69.869%,53.79% 70.647%,52.31% 71.344%,50.823% 71.97%,47.83% 73.034%,44.82% 73.881%,41.798% 74.546%,38.757% 75.128%,37.234% 75.537%,35.718% 76.05%,34.21% 76.668%,32.713% 77.389%,31.227% 78.207%,29.754% 79.113%,28.293% 80.095%,26.843% 81.136%,21.105% 85.547%,18.234% 87.684%,15.342% 89.658%,12.422% 91.427%,9.475% 92.976%,6.505% 94.306%,3.515% 95.429%,3.409% 95.504%,3.318% 95.644%,3.253% 95.838%,3.219% 96.065%,3.219% 96.304%,3.253% 96.531%,3.319% 96.724%,3.41% 96.864%,3.516% 96.937%)}
.qz-ruta-m svg{width:1.7857%;height:3.8168%;animation:qz-marcha 14s linear infinite}
.qz-ruta-m svg:nth-child(1){left:0.5626%;top:94.9984%;--i:translate(0%,0%) rotate(-9.09deg);--m:translate(64.18%,-10.27%) rotate(-9.09deg);--e:translate(128.37%,-20.55%) rotate(-9.19deg);opacity:0;animation:qz-marcha 14s linear infinite,qz-marcha-o1 14s linear infinite}
.qz-ruta-m svg:nth-child(2){left:2.8549%;top:94.2142%;--i:translate(0%,0%) rotate(-9.19deg);--m:translate(64.1%,-10.75%) rotate(-9.86deg);--e:translate(128.08%,-22.26%) rotate(-10.55deg)}
.qz-ruta-m svg:nth-child(3){left:5.142%;top:93.3645%;--i:translate(0%,0%) rotate(-10.55deg);--m:translate(63.83%,-12.29%) rotate(-11.26deg);--e:translate(127.49%,-25.38%) rotate(-11.99deg)}
.qz-ruta-m svg:nth-child(4){left:7.4186%;top:92.3957%;--i:translate(0%,0%) rotate(-11.99deg);--m:translate(63.49%,-13.91%) rotate(-12.74deg);--e:translate(126.8%,-28.66%) rotate(-13.5deg)}
.qz-ruta-m svg:nth-child(5){left:9.6829%;top:91.3017%;--i:translate(0%,0%) rotate(-13.5deg);--m:translate(63.1%,-15.6%) rotate(-14.27deg);--e:translate(125.99%,-32.04%) rotate(-15.04deg)}
.qz-ruta-m svg:nth-child(6){left:11.9326%;top:90.0787%;--i:translate(0%,0%) rotate(-15.04deg);--m:translate(62.66%,-17.29%) rotate(-15.81deg);--e:translate(125.08%,-35.41%) rotate(-16.56deg)}
.qz-ruta-m svg:nth-child(7){left:14.1662%;top:88.7273%;--i:translate(0%,0%) rotate(-16.56deg);--m:translate(62.19%,-18.92%) rotate(-17.28deg);--e:translate(124.14%,-38.59%) rotate(-17.95deg)}
.qz-ruta-m svg:nth-child(8){left:16.3829%;top:87.2544%;--i:translate(0%,0%) rotate(-17.95deg);--m:translate(61.73%,-20.37%) rotate(-18.56deg);--e:translate(123.24%,-41.36%) rotate(-19.1deg)}
.qz-ruta-m svg:nth-child(9){left:18.5837%;top:85.6759%;--i:translate(0%,0%) rotate(-19.1deg);--m:translate(61.34%,-21.51%) rotate(-19.53deg);--e:translate(122.54%,-43.41%) rotate(-19.84deg)}
.qz-ruta-m svg:nth-child(10){left:20.7719%;top:84.019%;--i:translate(0%,0%) rotate(-19.84deg);--m:translate(61.11%,-22.16%) rotate(-20deg);--e:translate(122.18%,-44.41%) rotate(-20.01deg)}
.qz-ruta-m svg:nth-child(11){left:22.9537%;top:82.324%;--i:translate(0%,0%) rotate(-20.01deg);--m:translate(61.1%,-22.16%) rotate(-19.84deg);--e:translate(122.31%,-44.04%) rotate(-19.48deg)}
.qz-ruta-m svg:nth-child(12){left:25.1378%;top:80.6429%;--i:translate(0%,0%) rotate(-19.48deg);--m:translate(61.38%,-21.4%) rotate(-18.93deg);--e:translate(122.99%,-42.1%) rotate(-18.19deg)}
.qz-ruta-m svg:nth-child(13){left:27.334%;top:79.036%;--i:translate(0%,0%) rotate(-18.19deg);--m:translate(61.9%,-19.82%) rotate(-17.28deg);--e:translate(124.14%,-38.56%) rotate(-16.22deg)}
.qz-ruta-m svg:nth-child(14){left:29.5509%;top:77.5641%;--i:translate(0%,0%) rotate(-16.22deg);--m:translate(62.6%,-17.51%) rotate(-15.02deg);--e:translate(125.56%,-33.65%) rotate(-13.72deg)}
.qz-ruta-m svg:nth-child(15){left:31.793%;top:76.2798%;--i:translate(0%,0%) rotate(-13.72deg);--m:translate(63.32%,-14.67%) rotate(-12.35deg);--e:translate(126.98%,-27.8%) rotate(-10.95deg)}
.qz-ruta-m svg:nth-child(16){left:34.0605%;top:75.2188%;--i:translate(0%,0%) rotate(-10.95deg);--m:translate(63.96%,-11.55%) rotate(-9.53deg);--e:translate(128.19%,-21.52%) rotate(-8.12deg)}
.qz-ruta-m svg:nth-child(17){left:36.3497%;top:74.3975%;--i:translate(0%,0%) rotate(-8.12deg);--m:translate(64.45%,-8.4%) rotate(-6.74deg);--e:translate(129.09%,-15.28%) rotate(-5.41deg)}
.qz-ruta-m svg:nth-child(18){left:38.6548%;top:73.8143%;--i:translate(0%,0%) rotate(-5.41deg);--m:translate(64.77%,-5.49%) rotate(-4.66deg);--e:translate(129.53%,-11.06%) rotate(-5.17deg)}
.qz-ruta-m svg:nth-child(19){left:40.9678%;top:73.3921%;--i:translate(0%,0%) rotate(-5.17deg);--m:translate(64.71%,-6.16%) rotate(-5.71deg);--e:translate(129.35%,-12.95%) rotate(-6.28deg)}
.qz-ruta-m svg:nth-child(20){left:43.2776%;top:72.8979%;--i:translate(0%,0%) rotate(-6.28deg);--m:translate(64.57%,-7.46%) rotate(-6.9deg);--e:translate(129.06%,-15.62%) rotate(-7.55deg)}
.qz-ruta-m svg:nth-child(21){left:45.5822%;top:72.3016%;--i:translate(0%,0%) rotate(-7.55deg);--m:translate(64.38%,-8.93%) rotate(-8.25deg);--e:translate(128.65%,-18.66%) rotate(-8.99deg)}
.qz-ruta-m svg:nth-child(22){left:47.8795%;top:71.5893%;--i:translate(0%,0%) rotate(-8.99deg);--m:translate(64.13%,-10.61%) rotate(-9.8deg);--e:translate(128.09%,-22.15%) rotate(-10.67deg)}
.qz-ruta-m svg:nth-child(23){left:50.1669%;top:70.7438%;--i:translate(0%,0%) rotate(-10.67deg);--m:translate(63.78%,-12.55%) rotate(-11.61deg);--e:translate(127.33%,-26.19%) rotate(-12.63deg)}
.qz-ruta-m svg:nth-child(24){left:52.4406%;top:69.7443%;--i:translate(0%,0%) rotate(-12.63deg);--m:translate(63.29%,-14.82%) rotate(-13.74deg);--e:translate(126.26%,-30.92%) rotate(-14.96deg)}
.qz-ruta-m svg:nth-child(25){left:54.6953%;top:68.5642%;--i:translate(0%,0%) rotate(-14.96deg);--m:translate(62.6%,-17.5%) rotate(-16.3deg);--e:translate(124.75%,-36.52%) rotate(-17.77deg)}
.qz-ruta-m svg:nth-child(26){left:56.9229%;top:67.1701%;--i:translate(0%,0%) rotate(-17.77deg);--m:translate(61.61%,-20.7%) rotate(-19.41deg);--e:translate(122.57%,-43.26%) rotate(-21.23deg)}
.qz-ruta-m svg:nth-child(27){left:59.1117%;top:65.5191%;--i:translate(0%,0%) rotate(-21.23deg);--m:translate(60.17%,-24.59%) rotate(-23.27deg);--e:translate(119.36%,-51.43%) rotate(-25.56deg)}
.qz-ruta-m svg:nth-child(28){left:61.2432%;top:63.5562%;--i:translate(0%,0%) rotate(-25.56deg);--m:translate(58%,-29.34%) rotate(-28.15deg);--e:translate(114.51%,-61.43%) rotate(-31.1deg)}
.qz-ruta-m svg:nth-child(29){left:63.288%;top:61.2114%;--i:translate(0%,0%) rotate(-31.1deg);--m:translate(54.67%,-35.14%) rotate(-34.44deg);--e:translate(107.04%,-73.62%) rotate(-38.25deg)}
.qz-ruta-m svg:nth-child(30){left:65.1995%;top:58.4015%;--i:translate(0%,0%) rotate(-38.25deg);--m:translate(49.51%,-42.09%) rotate(-42.58deg);--e:translate(95.48%,-88.01%) rotate(-47.46deg)}
.qz-ruta-m svg:nth-child(31){left:66.9046%;top:55.0422%;--i:translate(0%,0%) rotate(-47.46deg);--m:translate(41.66%,-49.87%) rotate(-52.88deg);--e:translate(83.07%,-99.93%) rotate(-47.58deg)}
.qz-ruta-m svg:nth-child(32){left:68.3879%;top:51.228%;--i:translate(0%,0%) rotate(-47.58deg);--m:translate(45.93%,-45.96%) rotate(-42.59deg);--e:translate(95.41%,-88.09%) rotate(-38.36deg)}
.qz-ruta-m svg:nth-child(33){left:70.0916%;top:47.8656%;--i:translate(0%,0%) rotate(-38.36deg);--m:translate(52.23%,-38.67%) rotate(-34.77deg);--e:translate(106.61%,-74.26%) rotate(-31.72deg)}
.qz-ruta-m svg:nth-child(34){left:71.9954%;top:45.0312%;--i:translate(0%,0%) rotate(-31.72deg);--m:translate(56.06%,-32.88%) rotate(-29.12deg);--e:translate(113.46%,-63.38%) rotate(-26.9deg)}
.qz-ruta-m svg:nth-child(35){left:74.0215%;top:42.6123%;--i:translate(0%,0%) rotate(-26.9deg);--m:translate(58.46%,-28.4%) rotate(-24.98deg);--e:translate(117.78%,-54.97%) rotate(-23.31deg)}
.qz-ruta-m svg:nth-child(36){left:76.1248%;top:40.5143%;--i:translate(0%,0%) rotate(-23.31deg);--m:translate(60.02%,-24.94%) rotate(-21.86deg);--e:translate(120.62%,-48.45%) rotate(-20.58deg)}
.qz-ruta-m svg:nth-child(37){left:78.2788%;top:38.6649%;--i:translate(0%,0%) rotate(-20.58deg);--m:translate(61.07%,-22.24%) rotate(-19.47deg);--e:translate(122.55%,-43.37%) rotate(-18.48deg)}
.qz-ruta-m svg:nth-child(38){left:80.4671%;top:37.0097%;--i:translate(0%,0%) rotate(-18.48deg);--m:translate(61.8%,-20.13%) rotate(-17.61deg);--e:translate(123.89%,-39.38%) rotate(-16.85deg)}
.qz-ruta-m svg:nth-child(39){left:82.6794%;top:35.5068%;--i:translate(0%,0%) rotate(-16.85deg);--m:translate(62.32%,-18.47%) rotate(-16.18deg);--e:translate(124.84%,-36.24%) rotate(-15.58deg)}
.qz-ruta-m svg:nth-child(40){left:84.9087%;top:34.1234%;--i:translate(0%,0%) rotate(-15.58deg);--m:translate(62.69%,-17.17%) rotate(-15.06deg);--e:translate(125.52%,-33.81%) rotate(-14.61deg)}
.qz-ruta-m svg:nth-child(41){left:87.1502%;top:32.8329%;--i:translate(0%,0%) rotate(-14.61deg);--m:translate(62.95%,-16.18%) rotate(-14.23deg);--e:translate(126.01%,-31.97%) rotate(-13.9deg)}
.qz-ruta-m svg:nth-child(42){left:89.4003%;top:31.6128%;--i:translate(0%,0%) rotate(-13.9deg);--m:translate(63.14%,-15.46%) rotate(-13.62deg);--e:translate(126.34%,-30.64%) rotate(-13.4deg)}
.qz-ruta-m svg:nth-child(43){left:91.6564%;top:30.4434%;--i:translate(0%,0%) rotate(-13.4deg);--m:translate(63.25%,-14.97%) rotate(-13.24deg);--e:translate(126.54%,-29.79%) rotate(-13.13deg)}
.qz-ruta-m svg:nth-child(44){left:93.916%;top:29.3065%;--i:translate(0%,0%) rotate(-13.13deg);--m:translate(63.3%,-14.77%) rotate(-13.13deg);--e:translate(126.6%,-29.54%) rotate(-13.13deg);animation:qz-marcha 14s linear infinite,qz-marcha-o44 14s linear infinite}
@keyframes qz-marcha-o1{0%{opacity:0}4.231%{opacity:0}4.236%{opacity:1}4.99%{opacity:1}5%{opacity:0}9.231%{opacity:0}9.236%{opacity:1}9.99%{opacity:1}10%{opacity:0}14.231%{opacity:0}14.236%{opacity:1}14.99%{opacity:1}15%{opacity:0}19.231%{opacity:0}19.236%{opacity:1}19.99%{opacity:1}20%{opacity:0}24.231%{opacity:0}24.236%{opacity:1}24.99%{opacity:1}25%{opacity:0}29.231%{opacity:0}29.236%{opacity:1}29.99%{opacity:1}30%{opacity:0}34.231%{opacity:0}34.236%{opacity:1}34.99%{opacity:1}35%{opacity:0}39.231%{opacity:0}39.236%{opacity:1}39.99%{opacity:1}40%{opacity:0}44.231%{opacity:0}44.236%{opacity:1}44.99%{opacity:1}45%{opacity:0}49.231%{opacity:0}49.236%{opacity:1}49.99%{opacity:1}50%{opacity:0}54.231%{opacity:0}54.236%{opacity:1}54.99%{opacity:1}55%{opacity:0}59.231%{opacity:0}59.236%{opacity:1}59.99%{opacity:1}60%{opacity:0}64.231%{opacity:0}64.236%{opacity:1}64.99%{opacity:1}65%{opacity:0}69.231%{opacity:0}69.236%{opacity:1}69.99%{opacity:1}70%{opacity:0}74.231%{opacity:0}74.236%{opacity:1}74.99%{opacity:1}75%{opacity:0}79.231%{opacity:0}79.236%{opacity:1}79.99%{opacity:1}80%{opacity:0}84.231%{opacity:0}84.236%{opacity:1}84.99%{opacity:1}85%{opacity:0}89.231%{opacity:0}89.236%{opacity:1}89.99%{opacity:1}90%{opacity:0}94.231%{opacity:0}94.236%{opacity:1}94.99%{opacity:1}95%{opacity:0}99.231%{opacity:0}99.236%{opacity:1}100%{opacity:1}}
@keyframes qz-marcha-o44{0%{opacity:1}0.017%{opacity:1}0.022%{opacity:0}4.99%{opacity:0}5%{opacity:1}5.017%{opacity:1}5.022%{opacity:0}9.99%{opacity:0}10%{opacity:1}10.017%{opacity:1}10.022%{opacity:0}14.99%{opacity:0}15%{opacity:1}15.017%{opacity:1}15.022%{opacity:0}19.99%{opacity:0}20%{opacity:1}20.017%{opacity:1}20.022%{opacity:0}24.99%{opacity:0}25%{opacity:1}25.017%{opacity:1}25.022%{opacity:0}29.99%{opacity:0}30%{opacity:1}30.017%{opacity:1}30.022%{opacity:0}34.99%{opacity:0}35%{opacity:1}35.017%{opacity:1}35.022%{opacity:0}39.99%{opacity:0}40%{opacity:1}40.017%{opacity:1}40.022%{opacity:0}44.99%{opacity:0}45%{opacity:1}45.017%{opacity:1}45.022%{opacity:0}49.99%{opacity:0}50%{opacity:1}50.017%{opacity:1}50.022%{opacity:0}54.99%{opacity:0}55%{opacity:1}55.017%{opacity:1}55.022%{opacity:0}59.99%{opacity:0}60%{opacity:1}60.017%{opacity:1}60.022%{opacity:0}64.99%{opacity:0}65%{opacity:1}65.017%{opacity:1}65.022%{opacity:0}69.99%{opacity:0}70%{opacity:1}70.017%{opacity:1}70.022%{opacity:0}74.99%{opacity:0}75%{opacity:1}75.017%{opacity:1}75.022%{opacity:0}79.99%{opacity:0}80%{opacity:1}80.017%{opacity:1}80.022%{opacity:0}84.99%{opacity:0}85%{opacity:1}85.017%{opacity:1}85.022%{opacity:0}89.99%{opacity:0}90%{opacity:1}90.017%{opacity:1}90.022%{opacity:0}94.99%{opacity:0}95%{opacity:1}95.017%{opacity:1}95.022%{opacity:0}100%{opacity:0}}
@keyframes qz-marcha{0%{transform:var(--i)}2.5%{transform:var(--m)}4.99%{transform:var(--e)}5%{transform:var(--i)}7.5%{transform:var(--m)}9.99%{transform:var(--e)}10%{transform:var(--i)}12.5%{transform:var(--m)}14.99%{transform:var(--e)}15%{transform:var(--i)}17.5%{transform:var(--m)}19.99%{transform:var(--e)}20%{transform:var(--i)}22.5%{transform:var(--m)}24.99%{transform:var(--e)}25%{transform:var(--i)}27.5%{transform:var(--m)}29.99%{transform:var(--e)}30%{transform:var(--i)}32.5%{transform:var(--m)}34.99%{transform:var(--e)}35%{transform:var(--i)}37.5%{transform:var(--m)}39.99%{transform:var(--e)}40%{transform:var(--i)}42.5%{transform:var(--m)}44.99%{transform:var(--e)}45%{transform:var(--i)}47.5%{transform:var(--m)}49.99%{transform:var(--e)}50%{transform:var(--i)}52.5%{transform:var(--m)}54.99%{transform:var(--e)}55%{transform:var(--i)}57.5%{transform:var(--m)}59.99%{transform:var(--e)}60%{transform:var(--i)}62.5%{transform:var(--m)}64.99%{transform:var(--e)}65%{transform:var(--i)}67.5%{transform:var(--m)}69.99%{transform:var(--e)}70%{transform:var(--i)}72.5%{transform:var(--m)}74.99%{transform:var(--e)}75%{transform:var(--i)}77.5%{transform:var(--m)}79.99%{transform:var(--e)}80%{transform:var(--i)}82.5%{transform:var(--m)}84.99%{transform:var(--e)}85%{transform:var(--i)}87.5%{transform:var(--m)}89.99%{transform:var(--e)}90%{transform:var(--i)}92.5%{transform:var(--m)}94.99%{transform:var(--e)}95%{transform:var(--i)}97.5%{transform:var(--m)}100%{transform:var(--e)}}
.qz-bandera{transform-origin:95% 16.7939%;animation:qz-ondea 9.6s ease-in-out infinite}
@keyframes qz-ondea{0%{transform:none}16.667%{transform:skewY(6deg) scaleX(.9)}33.333%{transform:none}50%{transform:skewY(6deg) scaleX(.9)}66.667%{transform:none}83.333%{transform:skewY(6deg) scaleX(.9)}100%{transform:none}}
.qz-agua-m1{clip-path:polygon(76.251% 21.289%,76.133% 25.37%,76.057% 29.453%,76.02% 33.536%,76.018% 37.617%,76.103% 45.77%,76.281% 53.907%,77.323% 86.333%,77.359% 86.683%,77.445% 86.991%,77.571% 87.227%,77.725% 87.369%,77.892% 87.402%,78.055% 87.323%,78.199% 87.141%,78.31% 86.872%,78.376% 86.543%,78.392% 86.186%,77.351% 53.779%,77.174% 45.688%,77.089% 37.6%,77.091% 33.558%,77.128% 29.52%,77.203% 25.486%,77.32% 21.459%,77.306% 21.102%,77.241% 20.771%,77.132% 20.5%,76.988% 20.314%,76.825% 20.232%,76.658% 20.262%,76.504% 20.401%,76.377% 20.634%,76.29% 20.941%)}
.qz-agua-m2{clip-path:polygon(78.393% 22.097%,78.342% 26.126%,78.322% 30.155%,78.363% 38.209%,78.494% 46.249%,78.684% 54.276%,79.122% 70.295%,79.316% 78.296%,79.465% 86.296%,79.496% 86.648%,79.577% 86.962%,79.699% 87.207%,79.851% 87.359%,80.017% 87.404%,80.182% 87.337%,80.329% 87.164%,80.443% 86.902%,80.515% 86.578%,80.535% 86.223%,80.386% 78.19%,80.192% 70.166%,79.754% 54.148%,79.564% 46.149%,79.434% 38.153%,79.393% 30.162%,79.413% 26.169%,79.464% 22.178%,79.444% 21.823%,79.373% 21.498%,79.259% 21.236%,79.112% 21.062%,78.948% 20.993%,78.781% 21.036%,78.629% 21.188%,78.507% 21.432%,78.425% 21.745%)}
.qz-agua-m1 svg,.qz-agua-m2 svg{width:4.2857%;height:9.1603%;animation:qz-cae-svg 18s linear infinite}
.qz-agua-m1 svg:nth-child(1){left:74.8671%;top:10.3231%;--i:translate(0%,0%) rotate(94.24deg);--m:translate(-3.85%,51.94%) rotate(94.24deg);--e:translate(-7.4%,103.9%) rotate(93.22deg);opacity:0;animation:qz-cae-svg 18s linear infinite,qz-cae1-o1 18s linear infinite}
.qz-agua-m1 svg:nth-child(2){left:74.55%;top:19.8408%;--i:translate(0%,0%) rotate(93.22deg);--m:translate(-2.25%,52.03%) rotate(91.76deg);--e:translate(-3.25%,104.11%) rotate(90.46deg)}
.qz-agua-m1 svg:nth-child(3){left:74.4107%;top:29.3772%;--i:translate(0%,0%) rotate(90.46deg);--m:translate(0.12%,52.08%) rotate(89.31deg);--e:translate(1.2%,104.15%) rotate(88.34deg)}
.qz-agua-m1 svg:nth-child(4){left:74.4619%;top:38.9181%;--i:translate(0%,0%) rotate(88.34deg);--m:translate(1.89%,52.05%) rotate(87.53deg);--e:translate(4.43%,104.07%) rotate(86.89deg)}
.qz-agua-m1 svg:nth-child(5){left:74.6519%;top:48.4511%;--i:translate(0%,0%) rotate(86.89deg);--m:translate(3.06%,51.99%) rotate(86.41deg);--e:translate(6.48%,103.96%) rotate(86.07deg)}
.qz-agua-m1 svg:nth-child(6){left:74.9298%;top:57.9745%;--i:translate(0%,0%) rotate(86.07deg);--m:translate(3.66%,51.95%) rotate(85.88deg);--e:translate(7.44%,103.9%) rotate(85.82deg)}
.qz-agua-m1 svg:nth-child(7){left:75.2487%;top:67.4921%;--i:translate(0%,0%) rotate(85.82deg);--m:translate(3.78%,51.95%) rotate(85.88deg);--e:translate(7.45%,103.9%) rotate(86.05deg)}
.qz-agua-m1 svg:nth-child(8){left:75.5681%;top:77.0097%;--i:translate(0%,0%) rotate(86.05deg);--m:translate(3.48%,51.97%) rotate(86.31deg);--e:translate(6.83%,103.94%) rotate(86.31deg);animation:qz-cae-svg 18s linear infinite,qz-cae1-o8 18s linear infinite}
@keyframes qz-cae1-o1{0%{opacity:0}1.8%{opacity:0}1.805%{opacity:1}4.99%{opacity:1}5%{opacity:0}6.8%{opacity:0}6.805%{opacity:1}9.99%{opacity:1}10%{opacity:0}11.8%{opacity:0}11.805%{opacity:1}14.99%{opacity:1}15%{opacity:0}16.8%{opacity:0}16.805%{opacity:1}19.99%{opacity:1}20%{opacity:0}21.8%{opacity:0}21.805%{opacity:1}24.99%{opacity:1}25%{opacity:0}26.8%{opacity:0}26.805%{opacity:1}29.99%{opacity:1}30%{opacity:0}31.8%{opacity:0}31.805%{opacity:1}34.99%{opacity:1}35%{opacity:0}36.8%{opacity:0}36.805%{opacity:1}39.99%{opacity:1}40%{opacity:0}41.8%{opacity:0}41.805%{opacity:1}44.99%{opacity:1}45%{opacity:0}46.8%{opacity:0}46.805%{opacity:1}49.99%{opacity:1}50%{opacity:0}51.8%{opacity:0}51.805%{opacity:1}54.99%{opacity:1}55%{opacity:0}56.8%{opacity:0}56.805%{opacity:1}59.99%{opacity:1}60%{opacity:0}61.8%{opacity:0}61.805%{opacity:1}64.99%{opacity:1}65%{opacity:0}66.8%{opacity:0}66.805%{opacity:1}69.99%{opacity:1}70%{opacity:0}71.8%{opacity:0}71.805%{opacity:1}74.99%{opacity:1}75%{opacity:0}76.8%{opacity:0}76.805%{opacity:1}79.99%{opacity:1}80%{opacity:0}81.8%{opacity:0}81.805%{opacity:1}84.99%{opacity:1}85%{opacity:0}86.8%{opacity:0}86.805%{opacity:1}89.99%{opacity:1}90%{opacity:0}91.8%{opacity:0}91.805%{opacity:1}94.99%{opacity:1}95%{opacity:0}96.8%{opacity:0}96.805%{opacity:1}100%{opacity:1}}
@keyframes qz-cae1-o8{0%{opacity:1}4.052%{opacity:1}4.057%{opacity:0}4.99%{opacity:0}5%{opacity:1}9.052%{opacity:1}9.057%{opacity:0}9.99%{opacity:0}10%{opacity:1}14.052%{opacity:1}14.057%{opacity:0}14.99%{opacity:0}15%{opacity:1}19.052%{opacity:1}19.057%{opacity:0}19.99%{opacity:0}20%{opacity:1}24.052%{opacity:1}24.057%{opacity:0}24.99%{opacity:0}25%{opacity:1}29.052%{opacity:1}29.057%{opacity:0}29.99%{opacity:0}30%{opacity:1}34.052%{opacity:1}34.057%{opacity:0}34.99%{opacity:0}35%{opacity:1}39.052%{opacity:1}39.057%{opacity:0}39.99%{opacity:0}40%{opacity:1}44.052%{opacity:1}44.057%{opacity:0}44.99%{opacity:0}45%{opacity:1}49.052%{opacity:1}49.057%{opacity:0}49.99%{opacity:0}50%{opacity:1}54.052%{opacity:1}54.057%{opacity:0}54.99%{opacity:0}55%{opacity:1}59.052%{opacity:1}59.057%{opacity:0}59.99%{opacity:0}60%{opacity:1}64.052%{opacity:1}64.057%{opacity:0}64.99%{opacity:0}65%{opacity:1}69.052%{opacity:1}69.057%{opacity:0}69.99%{opacity:0}70%{opacity:1}74.052%{opacity:1}74.057%{opacity:0}74.99%{opacity:0}75%{opacity:1}79.052%{opacity:1}79.057%{opacity:0}79.99%{opacity:0}80%{opacity:1}84.052%{opacity:1}84.057%{opacity:0}84.99%{opacity:0}85%{opacity:1}89.052%{opacity:1}89.057%{opacity:0}89.99%{opacity:0}90%{opacity:1}94.052%{opacity:1}94.057%{opacity:0}94.99%{opacity:0}95%{opacity:1}99.052%{opacity:1}99.057%{opacity:0}100%{opacity:0}}
.qz-agua-m2 svg:nth-child(1){left:76.8941%;top:11.0728%;--i:translate(0%,0%) rotate(92.05deg);--m:translate(-1.86%,52.05%) rotate(92.05deg);--e:translate(-3.5%,104.11%) rotate(91.3deg);opacity:0;animation:qz-cae-svg 18s linear infinite,qz-cae2-o1 18s linear infinite}
.qz-agua-m2 svg:nth-child(2){left:76.744%;top:20.6094%;--i:translate(0%,0%) rotate(91.3deg);--m:translate(-0.68%,52.08%) rotate(90.22deg);--e:translate(-0.43%,104.16%) rotate(89.24deg)}
.qz-agua-m2 svg:nth-child(3){left:76.7256%;top:30.1508%;--i:translate(0%,0%) rotate(89.24deg);--m:translate(1.08%,52.07%) rotate(88.4deg);--e:translate(2.86%,104.12%) rotate(87.71deg)}
.qz-agua-m2 svg:nth-child(4){left:76.8482%;top:39.6889%;--i:translate(0%,0%) rotate(87.71deg);--m:translate(2.33%,52.03%) rotate(87.18deg);--e:translate(5.07%,104.04%) rotate(86.82deg)}
.qz-agua-m2 svg:nth-child(5){left:77.0655%;top:49.2194%;--i:translate(0%,0%) rotate(86.82deg);--m:translate(2.99%,52%) rotate(86.63deg);--e:translate(6.08%,103.99%) rotate(86.59deg)}
.qz-agua-m2 svg:nth-child(6){left:77.3262%;top:58.7451%;--i:translate(0%,0%) rotate(86.59deg);--m:translate(3.06%,51.99%) rotate(86.7deg);--e:translate(5.96%,104%) rotate(86.93deg)}
.qz-agua-m2 svg:nth-child(7){left:77.5817%;top:68.2715%;--i:translate(0%,0%) rotate(86.93deg);--m:translate(2.63%,52.02%) rotate(87.29deg);--e:translate(4.9%,104.05%) rotate(87.73deg)}
.qz-agua-m2 svg:nth-child(8){left:77.7919%;top:77.8028%;--i:translate(0%,0%) rotate(87.73deg);--m:translate(1.84%,52.05%) rotate(88.15deg);--e:translate(3.52%,104.11%) rotate(88.15deg);animation:qz-cae-svg 18s linear infinite,qz-cae2-o8 18s linear infinite}
@keyframes qz-cae2-o1{0%{opacity:0}1.8%{opacity:0}1.805%{opacity:1}4.99%{opacity:1}5%{opacity:0}6.8%{opacity:0}6.805%{opacity:1}9.99%{opacity:1}10%{opacity:0}11.8%{opacity:0}11.805%{opacity:1}14.99%{opacity:1}15%{opacity:0}16.8%{opacity:0}16.805%{opacity:1}19.99%{opacity:1}20%{opacity:0}21.8%{opacity:0}21.805%{opacity:1}24.99%{opacity:1}25%{opacity:0}26.8%{opacity:0}26.805%{opacity:1}29.99%{opacity:1}30%{opacity:0}31.8%{opacity:0}31.805%{opacity:1}34.99%{opacity:1}35%{opacity:0}36.8%{opacity:0}36.805%{opacity:1}39.99%{opacity:1}40%{opacity:0}41.8%{opacity:0}41.805%{opacity:1}44.99%{opacity:1}45%{opacity:0}46.8%{opacity:0}46.805%{opacity:1}49.99%{opacity:1}50%{opacity:0}51.8%{opacity:0}51.805%{opacity:1}54.99%{opacity:1}55%{opacity:0}56.8%{opacity:0}56.805%{opacity:1}59.99%{opacity:1}60%{opacity:0}61.8%{opacity:0}61.805%{opacity:1}64.99%{opacity:1}65%{opacity:0}66.8%{opacity:0}66.805%{opacity:1}69.99%{opacity:1}70%{opacity:0}71.8%{opacity:0}71.805%{opacity:1}74.99%{opacity:1}75%{opacity:0}76.8%{opacity:0}76.805%{opacity:1}79.99%{opacity:1}80%{opacity:0}81.8%{opacity:0}81.805%{opacity:1}84.99%{opacity:1}85%{opacity:0}86.8%{opacity:0}86.805%{opacity:1}89.99%{opacity:1}90%{opacity:0}91.8%{opacity:0}91.805%{opacity:1}94.99%{opacity:1}95%{opacity:0}96.8%{opacity:0}96.805%{opacity:1}100%{opacity:1}}
@keyframes qz-cae2-o8{0%{opacity:1}3.633%{opacity:1}3.638%{opacity:0}4.99%{opacity:0}5%{opacity:1}8.633%{opacity:1}8.638%{opacity:0}9.99%{opacity:0}10%{opacity:1}13.633%{opacity:1}13.638%{opacity:0}14.99%{opacity:0}15%{opacity:1}18.633%{opacity:1}18.638%{opacity:0}19.99%{opacity:0}20%{opacity:1}23.633%{opacity:1}23.638%{opacity:0}24.99%{opacity:0}25%{opacity:1}28.633%{opacity:1}28.638%{opacity:0}29.99%{opacity:0}30%{opacity:1}33.633%{opacity:1}33.638%{opacity:0}34.99%{opacity:0}35%{opacity:1}38.633%{opacity:1}38.638%{opacity:0}39.99%{opacity:0}40%{opacity:1}43.633%{opacity:1}43.638%{opacity:0}44.99%{opacity:0}45%{opacity:1}48.633%{opacity:1}48.638%{opacity:0}49.99%{opacity:0}50%{opacity:1}53.633%{opacity:1}53.638%{opacity:0}54.99%{opacity:0}55%{opacity:1}58.633%{opacity:1}58.638%{opacity:0}59.99%{opacity:0}60%{opacity:1}63.633%{opacity:1}63.638%{opacity:0}64.99%{opacity:0}65%{opacity:1}68.633%{opacity:1}68.638%{opacity:0}69.99%{opacity:0}70%{opacity:1}73.633%{opacity:1}73.638%{opacity:0}74.99%{opacity:0}75%{opacity:1}78.633%{opacity:1}78.638%{opacity:0}79.99%{opacity:0}80%{opacity:1}83.633%{opacity:1}83.638%{opacity:0}84.99%{opacity:0}85%{opacity:1}88.633%{opacity:1}88.638%{opacity:0}89.99%{opacity:0}90%{opacity:1}93.633%{opacity:1}93.638%{opacity:0}94.99%{opacity:0}95%{opacity:1}98.633%{opacity:1}98.638%{opacity:0}100%{opacity:0}}
@keyframes qz-cae-svg{0%{transform:var(--i)}2.5%{transform:var(--m)}4.99%{transform:var(--e)}5%{transform:var(--i)}7.5%{transform:var(--m)}9.99%{transform:var(--e)}10%{transform:var(--i)}12.5%{transform:var(--m)}14.99%{transform:var(--e)}15%{transform:var(--i)}17.5%{transform:var(--m)}19.99%{transform:var(--e)}20%{transform:var(--i)}22.5%{transform:var(--m)}24.99%{transform:var(--e)}25%{transform:var(--i)}27.5%{transform:var(--m)}29.99%{transform:var(--e)}30%{transform:var(--i)}32.5%{transform:var(--m)}34.99%{transform:var(--e)}35%{transform:var(--i)}37.5%{transform:var(--m)}39.99%{transform:var(--e)}40%{transform:var(--i)}42.5%{transform:var(--m)}44.99%{transform:var(--e)}45%{transform:var(--i)}47.5%{transform:var(--m)}49.99%{transform:var(--e)}50%{transform:var(--i)}52.5%{transform:var(--m)}54.99%{transform:var(--e)}55%{transform:var(--i)}57.5%{transform:var(--m)}59.99%{transform:var(--e)}60%{transform:var(--i)}62.5%{transform:var(--m)}64.99%{transform:var(--e)}65%{transform:var(--i)}67.5%{transform:var(--m)}69.99%{transform:var(--e)}70%{transform:var(--i)}72.5%{transform:var(--m)}74.99%{transform:var(--e)}75%{transform:var(--i)}77.5%{transform:var(--m)}79.99%{transform:var(--e)}80%{transform:var(--i)}82.5%{transform:var(--m)}84.99%{transform:var(--e)}85%{transform:var(--i)}87.5%{transform:var(--m)}89.99%{transform:var(--e)}90%{transform:var(--i)}92.5%{transform:var(--m)}94.99%{transform:var(--e)}95%{transform:var(--i)}97.5%{transform:var(--m)}100%{transform:var(--e)}}
.qz-poza-onda{transform-origin:78.9286% 87.0229%;animation:qz-onda 24s ease-out infinite}
@keyframes qz-onda{0%{transform:scale(.6);opacity:.9}9.99%{transform:scale(1.25);opacity:0}10%{transform:scale(.6);opacity:.9}19.99%{transform:scale(1.25);opacity:0}20%{transform:scale(.6);opacity:.9}29.99%{transform:scale(1.25);opacity:0}30%{transform:scale(.6);opacity:.9}39.99%{transform:scale(1.25);opacity:0}40%{transform:scale(.6);opacity:.9}49.99%{transform:scale(1.25);opacity:0}50%{transform:scale(.6);opacity:.9}59.99%{transform:scale(1.25);opacity:0}60%{transform:scale(.6);opacity:.9}69.99%{transform:scale(1.25);opacity:0}70%{transform:scale(.6);opacity:.9}79.99%{transform:scale(1.25);opacity:0}80%{transform:scale(.6);opacity:.9}89.99%{transform:scale(1.25);opacity:0}90%{transform:scale(.6);opacity:.9}100%{transform:scale(1.25);opacity:0}}

/* ══ MUÑEQUITOS ══ */
/* 28-sep-2026 (Q1, pedido de Uriel: "que el muñequito se vea más real y natural").
   Cada figura tiene proporciones humanas (cabeza ~1/6.5 de la altura, piernas
   la mitad), cuello, torso con volumen, y brazos y piernas con codo, rodilla y
   tobillo. La pose base va en el SVG (rotate de cada articulación) y la
   animación solo AÑADE un giro alrededor de la articulación: un paso de marcha
   completo en el puente y el sendero, las rodillas que amortiguan en el rappel,
   brazo y pierna contrarios al escalar, el arquero que tensa, suelta y vuelve a
   cargar, el péndulo de la tirolesa y los brazos que equilibran en el cable.
   Lo genera herramientas-dev/munecos-quetzalapan.py (cinemática inversa). Solo se mueve la
   tarjeta visible y en pantalla (.qz-rs:not(.qz-rs-on) y .anim-fuera las
   pausan) y con "reducir movimiento" todo se queda en la pose base. Medido con
   la CPU 4 veces más lenta: el hilo principal pasa de 0.3-0.7 % a 0.7-0.8 %. */
.qz-m path{fill:none;stroke:#fff;stroke-linecap:round;stroke-linejoin:round}
.qz-m .qz-m-cuerpo{fill:#fff;stroke:#fff;stroke-width:.8}
.qz-m .qz-m-mu{stroke-width:5}
.qz-m .qz-m-pi{stroke-width:4}
.qz-m .qz-m-pie{stroke-width:2.8}
.qz-m .qz-m-br{stroke-width:3.5}
.qz-m .qz-m-an{stroke-width:3}
.qz-m .qz-m-cuello{stroke-width:3}
/* el brazo y la pierna del lado lejano, un tono más apagados: se lee el volumen */
.qz-m .qz-m-lejos path{stroke:#BCD2CA}
.qz-m .qz-m-casco{fill:var(--qz-cobre-cl);stroke:none}
.qz-m .qz-m-arnes{stroke:var(--qz-cobre-cl);stroke-width:1.8}
.qz-m .qz-m-mochila{fill:var(--qz-cobre);stroke:none}
.qz-m .qz-m-correa{stroke:var(--qz-cobre);stroke-width:1.5}
.qz-m .qz-m-baston{stroke:var(--qz-roca-2);stroke-width:1.4}
.qz-m .qz-binocular{fill:var(--qz-cobre-cl);stroke:none}
.qz-m-cinta{fill:none;stroke:var(--qz-roca-2);stroke-width:1.6;stroke-linecap:round}
.qz-m1-br1,.qz-m1-br2{animation:qz-m1-brazos 18s ease-in-out infinite}
@keyframes qz-m1-brazos{0%{transform:rotate(4.5deg)}10%{transform:rotate(-4.5deg)}20%{transform:rotate(4.5deg)}30%{transform:rotate(-4.5deg)}40%{transform:rotate(4.5deg)}50%{transform:rotate(-4.5deg)}60%{transform:rotate(4.5deg)}70%{transform:rotate(-4.5deg)}80%{transform:rotate(4.5deg)}90%{transform:rotate(-4.5deg)}100%{transform:rotate(4.5deg)}}
.qz-m2-pendulo{transform-origin:100px 31.8px;animation:qz-m2-pendulo 2.6s ease-in-out infinite}
@keyframes qz-m2-pendulo{0%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}100%{transform:rotate(-3deg)}}
.qz-m2-mu1,.qz-m2-mu2{animation:qz-m2-piernas 2.6s ease-in-out infinite}.qz-m2-mu2{animation-delay:-.35s}
@keyframes qz-m2-piernas{0%{transform:rotate(5deg)}50%{transform:rotate(-7deg)}100%{transform:rotate(5deg)}}
@keyframes qz-m3-mu1{0%{transform:rotate(-2deg)}12%{transform:rotate(3deg)}25%{transform:rotate(17deg)}40%{transform:rotate(32deg)}50%{transform:rotate(38deg)}62%{transform:rotate(26deg)}75%{transform:rotate(8deg)}88%{transform:rotate(-2deg)}100%{transform:rotate(-2deg)}}
@keyframes qz-m3-ro1{0%{transform:rotate(-2deg)}12%{transform:rotate(9deg)}25%{transform:rotate(1deg)}40%{transform:rotate(3deg)}50%{transform:rotate(24deg)}62%{transform:rotate(50deg)}75%{transform:rotate(30deg)}88%{transform:rotate(2deg)}100%{transform:rotate(-2deg)}}
@keyframes qz-m3-pie1{0%{transform:rotate(-12deg)}12%{transform:rotate(0deg)}25%{transform:rotate(0deg)}40%{transform:rotate(6deg)}50%{transform:rotate(26deg)}62%{transform:rotate(10deg)}75%{transform:rotate(-6deg)}88%{transform:rotate(-12deg)}100%{transform:rotate(-12deg)}}
@keyframes qz-m3-br1{0%{transform:rotate(0deg)}25%{transform:rotate(-16deg)}50%{transform:rotate(-35deg)}75%{transform:rotate(-18deg)}100%{transform:rotate(0deg)}}
@keyframes qz-m3-co1{0%{transform:rotate(2deg)}50%{transform:rotate(-16deg)}100%{transform:rotate(2deg)}}
.qz-m3-mu1{animation:qz-m3-mu1 0.88s linear infinite}
.qz-m3-ro1{animation:qz-m3-ro1 0.88s linear infinite}
.qz-m3-pie1{animation:qz-m3-pie1 0.88s linear infinite}
.qz-m3-br1{animation:qz-m3-br1 0.88s linear infinite}
.qz-m3-co1{animation:qz-m3-co1 0.88s linear infinite}
@keyframes qz-m3-mu2{0%{transform:rotate(-38deg)}12%{transform:rotate(-33deg)}25%{transform:rotate(-19deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(2deg)}62%{transform:rotate(-10deg)}75%{transform:rotate(-28deg)}88%{transform:rotate(-38deg)}100%{transform:rotate(-38deg)}}
@keyframes qz-m3-ro2{0%{transform:rotate(-18deg)}12%{transform:rotate(-7deg)}25%{transform:rotate(-15deg)}40%{transform:rotate(-13deg)}50%{transform:rotate(8deg)}62%{transform:rotate(34deg)}75%{transform:rotate(14deg)}88%{transform:rotate(-14deg)}100%{transform:rotate(-18deg)}}
@keyframes qz-m3-pie2{0%{transform:rotate(-32deg)}12%{transform:rotate(-20deg)}25%{transform:rotate(-20deg)}40%{transform:rotate(-14deg)}50%{transform:rotate(6deg)}62%{transform:rotate(-10deg)}75%{transform:rotate(-26deg)}88%{transform:rotate(-32deg)}100%{transform:rotate(-32deg)}}
@keyframes qz-m3-br2{0%{transform:rotate(34deg)}25%{transform:rotate(18deg)}50%{transform:rotate(-1deg)}75%{transform:rotate(16deg)}100%{transform:rotate(34deg)}}
@keyframes qz-m3-co2{0%{transform:rotate(16deg)}50%{transform:rotate(-2deg)}100%{transform:rotate(16deg)}}
.qz-m3-mu2{animation:qz-m3-mu2 0.88s linear infinite;animation-delay:-0.44s}
.qz-m3-ro2{animation:qz-m3-ro2 0.88s linear infinite;animation-delay:-0.44s}
.qz-m3-pie2{animation:qz-m3-pie2 0.88s linear infinite;animation-delay:-0.44s}
.qz-m3-br2{animation:qz-m3-br2 0.88s linear infinite;animation-delay:-0.44s}
.qz-m3-co2{animation:qz-m3-co2 0.88s linear infinite;animation-delay:-0.44s}
.qz-m3{animation:qz-m3-bota 0.88s linear infinite}
@keyframes qz-m3-bota{0%{transform:translateY(0.5px)}25%{transform:translateY(-0.8px)}50%{transform:translateY(0.5px)}75%{transform:translateY(-0.8px)}100%{transform:translateY(0.5px)}}
@keyframes qz-m4-mu1{0%{transform:rotate(-18.48deg)}6.4%{transform:rotate(33.37deg)}15%{transform:rotate(33.37deg)}25%{transform:rotate(-18.48deg)}30.4%{transform:rotate(33.37deg)}40%{transform:rotate(33.37deg)}50%{transform:rotate(-18.48deg)}55.6%{transform:rotate(33.37deg)}65%{transform:rotate(33.37deg)}75%{transform:rotate(-18.48deg)}90%{transform:rotate(0deg)}99.96%{transform:rotate(0deg)}100%{transform:rotate(-18.48deg)}}
.qz-m4-mu1{animation:qz-m4-mu1 6s ease-in-out infinite}
@keyframes qz-m4-ro1{0%{transform:rotate(31.27deg)}6.4%{transform:rotate(-63.4deg)}15%{transform:rotate(-63.4deg)}25%{transform:rotate(31.27deg)}30.4%{transform:rotate(-63.4deg)}40%{transform:rotate(-63.4deg)}50%{transform:rotate(31.27deg)}55.6%{transform:rotate(-63.4deg)}65%{transform:rotate(-63.4deg)}75%{transform:rotate(31.27deg)}90%{transform:rotate(0deg)}99.96%{transform:rotate(0deg)}100%{transform:rotate(31.27deg)}}
.qz-m4-ro1{animation:qz-m4-ro1 6s ease-in-out infinite}
@keyframes qz-m4-mu2{0%{transform:rotate(-14.45deg)}6.4%{transform:rotate(29.61deg)}15%{transform:rotate(29.61deg)}25%{transform:rotate(-14.45deg)}30.4%{transform:rotate(29.61deg)}40%{transform:rotate(29.61deg)}50%{transform:rotate(-14.45deg)}55.6%{transform:rotate(29.61deg)}65%{transform:rotate(29.61deg)}75%{transform:rotate(-14.45deg)}90%{transform:rotate(0deg)}99.96%{transform:rotate(0deg)}100%{transform:rotate(-14.45deg)}}
.qz-m4-mu2{animation:qz-m4-mu2 6s ease-in-out infinite}
@keyframes qz-m4-ro2{0%{transform:rotate(32.16deg)}6.4%{transform:rotate(-62.08deg)}15%{transform:rotate(-62.08deg)}25%{transform:rotate(32.16deg)}30.4%{transform:rotate(-62.08deg)}40%{transform:rotate(-62.08deg)}50%{transform:rotate(32.16deg)}55.6%{transform:rotate(-62.08deg)}65%{transform:rotate(-62.08deg)}75%{transform:rotate(32.16deg)}90%{transform:rotate(0deg)}99.96%{transform:rotate(0deg)}100%{transform:rotate(32.16deg)}}
.qz-m4-ro2{animation:qz-m4-ro2 6s ease-in-out infinite}
@keyframes qz-m5-br1{0%{transform:rotate(0deg)}20%{transform:rotate(-19.24deg)}28%{transform:rotate(-19.24deg)}44%{transform:rotate(0deg)}52%{transform:rotate(0deg)}68%{transform:rotate(-19.24deg)}76%{transform:rotate(-19.24deg)}90%{transform:rotate(0deg)}99.97%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m5-br1{animation:qz-m5-br1 7s ease-in-out infinite}
@keyframes qz-m5-co1{0%{transform:rotate(0deg)}20%{transform:rotate(93.48deg)}28%{transform:rotate(93.48deg)}44%{transform:rotate(0deg)}52%{transform:rotate(0deg)}68%{transform:rotate(93.48deg)}76%{transform:rotate(93.48deg)}90%{transform:rotate(0deg)}99.97%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m5-co1{animation:qz-m5-co1 7s ease-in-out infinite}
@keyframes qz-m5-br2{0%{transform:rotate(0deg)}20%{transform:rotate(-19.24deg)}28%{transform:rotate(-19.24deg)}44%{transform:rotate(0deg)}52%{transform:rotate(0deg)}68%{transform:rotate(-19.24deg)}76%{transform:rotate(-19.24deg)}90%{transform:rotate(0deg)}99.97%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m5-br2{animation:qz-m5-br2 7s ease-in-out infinite}
@keyframes qz-m5-co2{0%{transform:rotate(0deg)}20%{transform:rotate(93.48deg)}28%{transform:rotate(93.48deg)}44%{transform:rotate(0deg)}52%{transform:rotate(0deg)}68%{transform:rotate(93.48deg)}76%{transform:rotate(93.48deg)}90%{transform:rotate(0deg)}99.97%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m5-co2{animation:qz-m5-co2 7s ease-in-out infinite}
@keyframes qz-m5-mu1{0%{transform:rotate(0deg)}20%{transform:rotate(-41.55deg)}28%{transform:rotate(-41.55deg)}44%{transform:rotate(0deg)}52%{transform:rotate(0deg)}68%{transform:rotate(-41.55deg)}76%{transform:rotate(-41.55deg)}90%{transform:rotate(0deg)}99.97%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m5-mu1{animation:qz-m5-mu1 7s ease-in-out infinite}
@keyframes qz-m5-ro1{0%{transform:rotate(0deg)}20%{transform:rotate(67.32deg)}28%{transform:rotate(67.32deg)}44%{transform:rotate(0deg)}52%{transform:rotate(0deg)}68%{transform:rotate(67.32deg)}76%{transform:rotate(67.32deg)}90%{transform:rotate(0deg)}99.97%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m5-ro1{animation:qz-m5-ro1 7s ease-in-out infinite}
@keyframes qz-m5-mu2{0%{transform:rotate(0deg)}20%{transform:rotate(-41.55deg)}28%{transform:rotate(-41.55deg)}44%{transform:rotate(0deg)}52%{transform:rotate(0deg)}68%{transform:rotate(-41.55deg)}76%{transform:rotate(-41.55deg)}90%{transform:rotate(0deg)}99.97%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m5-mu2{animation:qz-m5-mu2 7s ease-in-out infinite}
@keyframes qz-m5-ro2{0%{transform:rotate(0deg)}20%{transform:rotate(67.32deg)}28%{transform:rotate(67.32deg)}44%{transform:rotate(0deg)}52%{transform:rotate(0deg)}68%{transform:rotate(67.32deg)}76%{transform:rotate(67.32deg)}90%{transform:rotate(0deg)}99.97%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m5-ro2{animation:qz-m5-ro2 7s ease-in-out infinite}
@keyframes qz-m6-br2{0%{transform:rotate(0deg)}18%{transform:rotate(0deg)}21%{transform:rotate(-27.2deg)}34%{transform:rotate(-27.2deg)}46%{transform:rotate(90.79deg)}58%{transform:rotate(-41.28deg)}66%{transform:rotate(-41.28deg)}77%{transform:rotate(-8.86deg)}88%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m6-br2{animation:qz-m6-br2 3.6s ease-in-out infinite}
@keyframes qz-m6-co2{0%{transform:rotate(0deg)}18%{transform:rotate(0deg)}21%{transform:rotate(-4.13deg)}34%{transform:rotate(-4.13deg)}46%{transform:rotate(20.26deg)}58%{transform:rotate(131.9deg)}66%{transform:rotate(131.9deg)}77%{transform:rotate(53.48deg)}88%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m6-co2{animation:qz-m6-co2 3.6s ease-in-out infinite}
@keyframes qz-m6-c1{0%{transform:rotate(0deg) scaleY(1)}18%{transform:rotate(0deg) scaleY(1)}21%{transform:rotate(-46.54deg) scaleY(0.68)}34%{transform:rotate(-46.54deg) scaleY(0.68)}46%{transform:rotate(-46.54deg) scaleY(0.68)}58%{transform:rotate(-46.54deg) scaleY(0.68)}66%{transform:rotate(-24.16deg) scaleY(0.79)}77%{transform:rotate(-13.01deg) scaleY(0.84)}88%{transform:rotate(0deg) scaleY(1)}100%{transform:rotate(0deg) scaleY(1)}}
.qz-m6-c1{animation:qz-m6-c1 3.6s ease-in-out infinite}
@keyframes qz-m6-c2{0%{transform:rotate(0deg) scaleY(1)}18%{transform:rotate(0deg) scaleY(1)}21%{transform:rotate(47.61deg) scaleY(0.69)}34%{transform:rotate(47.61deg) scaleY(0.69)}46%{transform:rotate(47.61deg) scaleY(0.69)}58%{transform:rotate(47.61deg) scaleY(0.69)}66%{transform:rotate(21.88deg) scaleY(0.7)}77%{transform:rotate(12.07deg) scaleY(0.81)}88%{transform:rotate(0deg) scaleY(1)}100%{transform:rotate(0deg) scaleY(1)}}
.qz-m6-c2{animation:qz-m6-c2 3.6s ease-in-out infinite}
@keyframes qz-flecha{0%{transform:translateX(-2.93%);opacity:1}3.6%{transform:translateX(-2.93%);opacity:1}6.4%{transform:translateX(49.64%);opacity:1}10.4%{transform:translateX(49.64%);opacity:1}11.2%{transform:translateX(49.64%);opacity:0}11.4%{transform:translateX(0.68%);opacity:0}12%{transform:translateX(0.68%);opacity:1}13.2%{transform:translateX(0.68%);opacity:1}15.4%{transform:translateX(-0.71%);opacity:1}17.6%{transform:translateX(-2.93%);opacity:1}20%{transform:translateX(-2.93%);opacity:1}23.6%{transform:translateX(-2.93%);opacity:1}26.4%{transform:translateX(49.64%);opacity:1}30.4%{transform:translateX(49.64%);opacity:1}31.2%{transform:translateX(49.64%);opacity:0}31.4%{transform:translateX(0.68%);opacity:0}32%{transform:translateX(0.68%);opacity:1}33.2%{transform:translateX(0.68%);opacity:1}35.4%{transform:translateX(-0.71%);opacity:1}37.6%{transform:translateX(-2.93%);opacity:1}40%{transform:translateX(-2.93%);opacity:1}43.6%{transform:translateX(-2.93%);opacity:1}46.4%{transform:translateX(49.64%);opacity:1}50.4%{transform:translateX(49.64%);opacity:1}51.2%{transform:translateX(49.64%);opacity:0}51.4%{transform:translateX(0.68%);opacity:0}52%{transform:translateX(0.68%);opacity:1}53.2%{transform:translateX(0.68%);opacity:1}55.4%{transform:translateX(-0.71%);opacity:1}57.6%{transform:translateX(-2.93%);opacity:1}60%{transform:translateX(-2.93%);opacity:1}63.6%{transform:translateX(-2.93%);opacity:1}66.4%{transform:translateX(49.64%);opacity:1}70.4%{transform:translateX(49.64%);opacity:1}71.2%{transform:translateX(49.64%);opacity:0}71.4%{transform:translateX(0.68%);opacity:0}72%{transform:translateX(0.68%);opacity:1}73.2%{transform:translateX(0.68%);opacity:1}75.4%{transform:translateX(-0.71%);opacity:1}77.6%{transform:translateX(-2.93%);opacity:1}80%{transform:translateX(-2.93%);opacity:1}83.6%{transform:translateX(-2.93%);opacity:1}86.4%{transform:translateX(49.64%);opacity:1}90.4%{transform:translateX(49.64%);opacity:1}91.2%{transform:translateX(49.64%);opacity:0}91.4%{transform:translateX(0.68%);opacity:0}92%{transform:translateX(0.68%);opacity:1}93.2%{transform:translateX(0.68%);opacity:1}95.4%{transform:translateX(-0.71%);opacity:1}97.6%{transform:translateX(-2.93%);opacity:1}100%{transform:translateX(-2.93%);opacity:1}}
@keyframes qz-diana{0%{transform:rotate(0deg)}6.4%{transform:rotate(0deg)}7%{transform:rotate(2.5deg)}7.8%{transform:rotate(-1.5deg)}8.8%{transform:rotate(0deg)}20%{transform:rotate(0deg)}26.4%{transform:rotate(0deg)}27%{transform:rotate(2.5deg)}27.8%{transform:rotate(-1.5deg)}28.8%{transform:rotate(0deg)}40%{transform:rotate(0deg)}46.4%{transform:rotate(0deg)}47%{transform:rotate(2.5deg)}47.8%{transform:rotate(-1.5deg)}48.8%{transform:rotate(0deg)}60%{transform:rotate(0deg)}66.4%{transform:rotate(0deg)}67%{transform:rotate(2.5deg)}67.8%{transform:rotate(-1.5deg)}68.8%{transform:rotate(0deg)}80%{transform:rotate(0deg)}86.4%{transform:rotate(0deg)}87%{transform:rotate(2.5deg)}87.8%{transform:rotate(-1.5deg)}88.8%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
@keyframes qz-m7-mu1{0%{transform:rotate(0deg)}12%{transform:rotate(4deg)}25%{transform:rotate(18deg)}40%{transform:rotate(32deg)}50%{transform:rotate(37deg)}62%{transform:rotate(26deg)}75%{transform:rotate(10deg)}88%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
@keyframes qz-m7-ro1{0%{transform:rotate(-2deg)}12%{transform:rotate(6deg)}25%{transform:rotate(-1deg)}40%{transform:rotate(2deg)}50%{transform:rotate(22deg)}62%{transform:rotate(48deg)}75%{transform:rotate(30deg)}88%{transform:rotate(2deg)}100%{transform:rotate(-2deg)}}
@keyframes qz-m7-pie1{0%{transform:rotate(-8deg)}12%{transform:rotate(0deg)}25%{transform:rotate(2deg)}40%{transform:rotate(8deg)}50%{transform:rotate(30deg)}62%{transform:rotate(16deg)}75%{transform:rotate(-2deg)}88%{transform:rotate(-8deg)}100%{transform:rotate(-8deg)}}
.qz-m7-mu1{animation:qz-m7-mu1 1s linear infinite}
.qz-m7-ro1{animation:qz-m7-ro1 1s linear infinite}
.qz-m7-pie1{animation:qz-m7-pie1 1s linear infinite}
@keyframes qz-m7-mu2{0%{transform:rotate(-36deg)}12%{transform:rotate(-32deg)}25%{transform:rotate(-18deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(1deg)}62%{transform:rotate(-10deg)}75%{transform:rotate(-26deg)}88%{transform:rotate(-36deg)}100%{transform:rotate(-36deg)}}
@keyframes qz-m7-ro2{0%{transform:rotate(-18deg)}12%{transform:rotate(-10deg)}25%{transform:rotate(-17deg)}40%{transform:rotate(-14deg)}50%{transform:rotate(6deg)}62%{transform:rotate(32deg)}75%{transform:rotate(14deg)}88%{transform:rotate(-14deg)}100%{transform:rotate(-18deg)}}
@keyframes qz-m7-pie2{0%{transform:rotate(-34deg)}12%{transform:rotate(-26deg)}25%{transform:rotate(-24deg)}40%{transform:rotate(-18deg)}50%{transform:rotate(4deg)}62%{transform:rotate(-10deg)}75%{transform:rotate(-28deg)}88%{transform:rotate(-34deg)}100%{transform:rotate(-34deg)}}
.qz-m7-mu2{animation:qz-m7-mu2 1s linear infinite;animation-delay:-0.5s}
.qz-m7-ro2{animation:qz-m7-ro2 1s linear infinite;animation-delay:-0.5s}
.qz-m7-pie2{animation:qz-m7-pie2 1s linear infinite;animation-delay:-0.5s}
@keyframes qz-m7-br1{0%{transform:rotate(0deg)}50%{transform:rotate(-26deg)}100%{transform:rotate(0deg)}}
@keyframes qz-m7-co1{0%{transform:rotate(0deg)}50%{transform:rotate(-16deg)}100%{transform:rotate(0deg)}}
@keyframes qz-m7-br2{0%{transform:rotate(0deg)}50%{transform:rotate(26deg)}100%{transform:rotate(0deg)}}
@keyframes qz-m7-co2{0%{transform:rotate(0deg)}50%{transform:rotate(14deg)}100%{transform:rotate(0deg)}}
.qz-m7-br1{animation:qz-m7-br1 1s linear infinite}
.qz-m7-co1{animation:qz-m7-co1 1s linear infinite}
.qz-m7-br2{animation:qz-m7-br2 1s linear infinite}
.qz-m7-co2{animation:qz-m7-co2 1s linear infinite}
.qz-m7{animation:qz-m7-bota 1s linear infinite}
@keyframes qz-m7-bota{0%{transform:translateY(0.5px)}25%{transform:translateY(-0.7px)}50%{transform:translateY(0.5px)}75%{transform:translateY(-0.7px)}100%{transform:translateY(0.5px)}}
@keyframes qz-m8-br1{0%{transform:rotate(0deg)}46%{transform:rotate(0deg)}54%{transform:rotate(59.33deg)}80%{transform:rotate(59.33deg)}88%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m8-br1{animation:qz-m8-br1 12s ease-in-out infinite}
@keyframes qz-m8-co1{0%{transform:rotate(0deg)}46%{transform:rotate(0deg)}54%{transform:rotate(97.85deg)}80%{transform:rotate(97.85deg)}88%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m8-co1{animation:qz-m8-co1 12s ease-in-out infinite}
@keyframes qz-m8-br2{0%{transform:rotate(0deg)}46%{transform:rotate(0deg)}54%{transform:rotate(68.01deg)}80%{transform:rotate(68.01deg)}88%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m8-br2{animation:qz-m8-br2 12s ease-in-out infinite}
@keyframes qz-m8-co2{0%{transform:rotate(0deg)}46%{transform:rotate(0deg)}54%{transform:rotate(97.76deg)}80%{transform:rotate(97.76deg)}88%{transform:rotate(0deg)}100%{transform:rotate(0deg)}}
.qz-m8-co2{animation:qz-m8-co2 12s ease-in-out infinite}
/* ══ FIN MUÑEQUITOS ══ */

/* ══ CONVIVENCIA FAMILIAR ══════════════════════════════════ */
.qz-familia{background:var(--qz-espuma);padding:clamp(84px,10vw,136px) 0}
.qz-familia-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(36px,5vw,72px);align-items:center}
.qz-foto-rio{aspect-ratio:1/1}
.qz-foto-rio img{object-position:32% 50%}
.qz-listas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 32px;margin-top:34px}
.qz-lista h3{margin:0 0 10px;font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:.16em;text-transform:uppercase;font-size:13px;color:var(--qz-agua-txt)}
.qz-lista ul{list-style:none;margin:0;padding:0}
.qz-lista li{position:relative;padding:12px 0 12px 30px;border-top:1px solid rgba(19,36,31,.11);font-size:16px;line-height:1.4;color:var(--qz-tinta)}
.qz-lista li::before{
  content:"";position:absolute;left:0;top:14px;width:17px;height:17px;border-radius:50%;
  background:radial-gradient(circle,var(--qz-agua) 0 32%,rgba(0,166,200,.16) 36%);
}

/* ══ CÓMO LLEGAR ═══════════════════════════════════════════ */
.qz-llegar{padding:clamp(84px,10vw,136px) 0}
.qz-llegar-grid{
  display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  grid-template-areas:"cab foto" "accion ficha";
  column-gap:clamp(36px,5vw,72px);row-gap:12px;align-items:start;
}
.qz-ll-cab{grid-area:cab}
.qz-foto-letras{grid-area:foto;aspect-ratio:1200/760;margin-top:6px}
.qz-llegar .qz-ficha{grid-area:ficha}
.qz-ll-accion{grid-area:accion}
.qz-ll-accion .qz-tip{margin-top:10px}

/* la ruta: Chignahuapan → (~8 km por la 119) → las cascadas → hacia Zacatlán */
.qz-ruta{position:relative;height:118px;margin:34px 0 6px}
.qz-ruta::before,.qz-ruta::after{content:"";position:absolute}
.qz-ruta::before{top:40px;left:4px;width:calc(62% - 4px);height:6px;border-radius:3px;background:var(--qz-bosque)}
.qz-ruta::after{top:42px;left:62%;right:0;height:2px;background:repeating-linear-gradient(90deg,var(--qz-roca-txt) 0 8px,transparent 8px 15px);opacity:.7}
.qz-rp{position:absolute;border-radius:50%;transform:translate(-50%,-50%);top:43px}
.qz-rp-a{left:9px;width:18px;height:18px;background:#fff;border:4px solid var(--qz-bosque)}
.qz-rp-b{left:62%;width:28px;height:28px;background:var(--qz-agua);border:5px solid #fff;box-shadow:0 0 0 2px var(--qz-agua),0 0 0 10px rgba(0,166,200,.16)}
.qz-escudo{
  position:absolute;left:31%;top:43px;transform:translate(-50%,-50%);
  min-width:44px;padding:6px 6px 8px;text-align:center;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;line-height:1;color:var(--qz-bosque);
  background:#fff;border:2px solid var(--qz-bosque);border-radius:6px 6px 50% 50%/6px 6px 38% 38%;
}
.qz-rl{position:absolute;font-size:14px;line-height:1.25}
.qz-rl-a{left:0;top:66px;font-weight:700;color:var(--qz-tinta)}
.qz-rl-km{left:31%;top:0;transform:translateX(-50%);font-family:'Oswald',sans-serif;font-weight:600;font-size:16px;letter-spacing:.04em;color:var(--qz-bosque);white-space:nowrap}
.qz-rl-b{left:62%;top:66px;transform:translateX(-50%);width:max-content;max-width:150px;text-align:center;font-weight:800;color:var(--qz-agua-txt)}
.qz-rl-c{right:0;top:6px;font-style:italic;color:var(--qz-roca-txt);text-align:right;white-space:nowrap}

/* 28-sep-2026 (Q1): las letras monumentales aún no se inauguran: sello
   "Próximamente" sobre la foto, a la izquierda y bajo las letras (sobre la
   pared de roca), para no tapar ni las letras ni la caída. */
.qz-proximamente{
  position:absolute;z-index:2;left:6%;top:46%;transform:rotate(-6deg);
  padding:10px 12px 9px 17px;border:2.5px solid var(--qz-luz);border-radius:7px;
  outline:1px solid rgba(255,201,74,.6);outline-offset:3px;
  background:rgba(8,26,21,.66);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  font-family:'Oswald',sans-serif;font-weight:600;font-size:clamp(15px,1.7vw,19px);line-height:1;
  letter-spacing:.24em;text-transform:uppercase;color:var(--qz-luz);white-space:nowrap;
  box-shadow:0 8px 22px rgba(0,0,0,.35);pointer-events:none;
}
:lang(ja) .qz-proximamente,:lang(zh) .qz-proximamente{letter-spacing:.1em;padding-left:14px}

.qz-ficha{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px;margin:24px 0 0}
.qz-ficha div{padding:16px 0;border-top:1px solid rgba(19,36,31,.12)}
.qz-ficha dt{font-family:'Oswald',sans-serif;font-weight:500;letter-spacing:.16em;text-transform:uppercase;font-size:12px;color:var(--qz-agua-txt)}
.qz-ficha dd{margin:6px 0 0;font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:19px;line-height:1.3;color:var(--qz-tinta)}
.qz-tip{display:flex;gap:14px;align-items:flex-start;margin-top:22px;padding:18px 20px;border-radius:16px;background:#FFF3E0;border:1px solid #F1CF9E;color:#4E3413}
.qz-tip svg{flex:none;width:30px;height:30px;color:var(--qz-cobre)}
.qz-tip p{margin:0;font-size:16px;line-height:1.55}
.qz-tip b{display:block;font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:.16em;text-transform:uppercase;font-size:12.5px;color:#9A5522;margin-bottom:2px}
.qz-apps-t{margin:28px 0 10px;font-family:'Oswald',sans-serif;font-weight:500;letter-spacing:.14em;text-transform:uppercase;font-size:12.5px;color:var(--qz-roca-txt)}
.qz-apps{display:flex;flex-wrap:wrap;gap:10px}
.qz-app{
  display:inline-flex;align-items:center;gap:9px;padding:12px 18px;border-radius:14px;
  background:#fff;border:1.5px solid var(--qz-bosque);color:var(--qz-bosque);font-weight:700;font-size:15.5px;
  transition:background-color .18s,color .18s,transform .18s;
}
.qz-app svg{width:20px;height:20px;flex:none}
.qz-app:hover{background:var(--qz-bosque);color:#fff;transform:translateY(-2px)}

/* ══ SIGUE EXPLORANDO ══════════════════════════════════════ */
.qz-explora{position:relative;isolation:isolate;overflow:hidden;color:#fff;padding:clamp(88px,10vw,128px) 0 clamp(72px,9vw,112px);background:var(--qz-bosque)}
.qz-explora-foto img{object-position:50% 40%}
.qz-explora::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(6,20,16,.38) 0%,rgba(6,20,16,.72) 55%,rgba(6,20,16,.9) 100%)}
.qz-ir-lista{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.qz-ir-lista li{display:flex}
.qz-ir{
  flex:1;display:flex;flex-direction:column;gap:8px;padding:22px 20px 20px;border-radius:18px;min-height:200px;
  background:rgba(8,26,21,.55);border:1px solid rgba(255,255,255,.2);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:transform .2s,background-color .2s,border-color .2s;
}
.qz-ir:hover{transform:translateY(-4px);background:rgba(8,26,21,.74);border-color:rgba(143,221,238,.6)}
.qz-ir-k{font-family:'Oswald',sans-serif;font-weight:500;letter-spacing:.16em;text-transform:uppercase;font-size:12px;color:var(--qz-agua-cl)}
.qz-ir-t{font-family:'Fraunces',Georgia,serif;font-weight:800;font-size:22px;line-height:1.15}
.qz-ir-p{font-size:14.5px;line-height:1.45;color:rgba(255,255,255,.8)}
.qz-ir-fl{width:22px;height:22px;margin-top:auto;color:var(--qz-agua-cl);transition:transform .18s}
.qz-ir:hover .qz-ir-fl{transform:translateX(5px)}
.qz-explora .qz-link{margin-top:28px}

/* ══ RESPONSIVO ════════════════════════════════════════════ */
/* 29-sep-2026 (Uriel, R8): la cascada va SIEMPRE al centro de la pantalla.
   Antes, en escritorio ancho, la foto se ampliaba 1.26x y se corría a la
   derecha (la cascada quedaba al ~63 %). El recorte nuevo (img/r29) ya trae
   la cascada al 50 % del archivo, así que la foto va sin ampliar ni correr.
   Para que el título no la tape, en horizontal el texto se pega al borde
   izquierdo (4 % del ancho) y el 100 y "años de historia" se miden contra el
   ancho: el renglón termina antes del 44 % de la pantalla y la cascada ocupa
   del 46 al 54 % (en 16:9; en 4:3 igual, porque la foto se amplía a lo alto).
   Desde 700 px, para que también el iPhone acostado (852x393) la deje libre.
   El velo oscuro de la izquierda se apaga antes de llegar al agua. */
@media (orientation:landscape) and (min-width:700px){
  .qz-hero-in{max-width:none;padding-left:max(28px,4vw);padding-right:max(28px,4vw)}
  .qz-cien{font-size:clamp(120px,min(15.5vw,30svh),240px)}
  .qz-h1-anos{font-size:clamp(26px,min(2.6vw,5.2svh),42px)}
  .qz-hero-lead{max-width:min(42ch,38vw)}
  .qz-hero::before{
    background:
      linear-gradient(90deg,rgba(6,20,16,.84) 0%,rgba(6,20,16,.6) 26%,rgba(6,20,16,.16) 41%,rgba(6,20,16,0) 47%),
      linear-gradient(0deg,rgba(6,20,16,.7) 0%,rgba(6,20,16,0) 40%);
  }
}
@media (orientation:portrait){
  /* se recorta el cielo gris de arriba para que la caída se vea más grande */
  .qz-hero-foto img{object-position:50% 30%;transform:scale(1.14);transform-origin:50% 92%}
  .qz-hero::before{
    background:linear-gradient(180deg,rgba(6,20,16,.2) 0%,rgba(6,20,16,0) 12%,rgba(6,20,16,.1) 24%,rgba(6,20,16,.6) 40%,rgba(6,20,16,.88) 60%,rgba(6,20,16,.95) 100%);
  }
}
/* tabletas en vertical: el botón de regresar y el chat flotan abajo */
@media (orientation:portrait) and (max-width:1100px){
  .qz-hero-in{padding-bottom:max(104px,9svh)}
}
@media (max-width:1100px){
  .qz-ir-lista{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .qz-salto-grid,.qz-hist-grid,.qz-365-grid,.qz-familia-grid,.qz-llegar-grid,.qz-cab{grid-template-columns:minmax(0,1fr)}
  .qz-foto-caida{aspect-ratio:4/5;max-width:520px}
  .qz-rs{grid-template-columns:minmax(0,1fr);align-content:start}
  .qz-rs-ilu{max-width:520px;width:100%;margin:0 auto}
  .qz-v360-marco{aspect-ratio:2/1}
  .qz-foto-rio{aspect-ratio:4/3;order:2}
  .qz-llegar-grid{grid-template-areas:"cab" "ficha" "accion" "foto";row-gap:0}
  .qz-llegar .qz-ficha{margin-top:8px}
  .qz-ll-accion .qz-tip{margin-top:22px}
  .qz-foto-letras{margin-top:36px}
  .qz-foto-escalones{aspect-ratio:3/2}
  .qz-esc{height:clamp(190px,44vw,260px)}
  .qz-datos-lista{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:22px}
  .qz-datos-lista li:nth-child(3){border-left:0}
}
@media (max-width:640px){
  .qz-wrap{padding:0 16px}
  /* abajo quedan libres el botón de regresar y el chat, que flotan en las esquinas */
  .qz-hero-in{padding-top:max(36px,24svh);padding-bottom:98px}
  .qz-crumb{display:none}
  .qz-kicker{font-size:11px;letter-spacing:.13em}
  /* el sello cabe en una línea; si un idioma no cabe, baja en dos y deja de ser píldora */
  .qz-sello{margin-top:18px;gap:4px 12px;padding:8px 14px;font-size:11px;letter-spacing:.12em;border-radius:14px}
  .qz-sello-anios{font-size:15px;gap:6px}
  .qz-guion{width:16px}
  .qz-acciones{margin-top:22px}
  .qz-btn{padding:14px 20px;font-size:13.5px}
  .qz-datos-lista li{padding:2px 10px}
  .qz-rs{padding:22px 20px 26px;gap:14px}
  .qz-rs-tx > p:not(.qz-rs-k){font-size:16.5px}
  .qz-rs-tx h3{font-size:30px}
  .qz-rota-ctrl{gap:4px;margin-top:12px}
  .qz-punto{width:30px}
  .qz-v360-marco{aspect-ratio:4/3;border-radius:22px}
  .qz-v360-sello{left:14px;top:14px;font-size:13.5px;padding:6px 12px 6px 9px}
  .qz-v360-btn{padding:14px 18px;font-size:13px}
  .qz-esc-zona{padding-top:50px}
  .qz-esc-cima{left:34px;font-size:11px;letter-spacing:.08em}
  .qz-esc-caminante{width:22px;height:34px;top:16px}
  .qz-esc li > span{top:15px;letter-spacing:0}
  .qz-esc-jul .qz-esc-mitad{font-size:10.5px;letter-spacing:.06em;max-width:128px}
  .qz-esc-fin{font-size:11px;letter-spacing:.08em}
  .qz-foto-escalones{aspect-ratio:4/3}
  .qz-listas,.qz-ficha{grid-template-columns:minmax(0,1fr)}
  .qz-ir-lista{grid-template-columns:minmax(0,1fr)}
  .qz-ir{min-height:0}
  .qz-red-diag{grid-template-columns:minmax(0,.9fr) minmax(40px,.7fr) minmax(0,1.1fr)}
  .qz-red-fuente b{font-size:11.5px;letter-spacing:.05em}
  .qz-red-cables{height:120px}
  .qz-red-pueblos{grid-template-rows:repeat(3,40px)}
  .qz-red-pueblos li{gap:9px}
  .qz-red-pueblos li::before{width:11px;height:11px}
  .qz-p{font-size:16.5px}
  .qz-historia::before{top:12px}
}

/* Teléfonos bajitos (375×667): sin el aire de arriba, los botones caían
   debajo del chat y del botón de regresar, que flotan en las esquinas. */
@media (max-width:640px) and (max-height:740px){
  .qz-hero-in{padding-top:24px}
  .qz-cien{font-size:108px}
  .qz-hero-lead{font-size:15.5px;margin-top:14px}
  .qz-sello{margin-top:14px}
  .qz-acciones{margin-top:18px}
}

@media (prefers-reduced-motion:reduce){
  .qz-regla-agua::before,.qz-turbina-aspas,.qz-cable,.qz-equilibrista,.qz-esc-chorro::before{animation:none}
  .qz-btn,.qz-ir,.qz-app,.qz-link svg,.qz-ir-fl,.qz-punto-barra,.qz-rota-pausa{transition:none}
  /* la tarjeta no rota (lo decide el JS) ni se anima; la franja del 360 se queda con la cascada al centro */
  .qz-rs,.qz-rs *{animation:none!important;transition:none!important}
  .qz-rs{transform:none}
  .qz-punto[aria-current="true"] .qz-punto-barra::after{animation:none;transform:none}
  .qz-v360-tira{animation:none;transform:translateX(calc(-49.6% + 50cqw))}
}