/* Portada «Tierra y felino»: titular de documental, recorrido 3D y taquilla. */

/* --- Portada --------------------------------------------------------------- */
.home-hero-film .hero-photo:after{background:linear-gradient(90deg,rgba(20,32,24,.82) 0%,rgba(20,32,24,.55) 34%,rgba(20,32,24,.08) 70%,transparent),linear-gradient(0deg,rgba(20,32,24,.55),transparent 34%)}
.home-hero-film .hero-copy{width:62%;max-width:820px}
.home-hero-film .hero-copy .hero-eyebrow{color:var(--verde-claro);margin-bottom:18px;font-size:14px}
.home-hero-film .hero-copy h1{font-family:var(--display);font-weight:500;font-size:clamp(48px,6.2vw,104px);line-height:.98;letter-spacing:-.03em;margin-bottom:22px}
.home-hero-film .hero-copy h1 span{display:block}
.home-hero-film .hero-copy>p{font-size:clamp(16px,1.2vw,20px);max-width:470px}
.home-hero-film .hero-copy .button{min-width:0;min-height:56px;font-size:14px}
.home-hero-film .hero-copy .button-whatsapp{background:var(--tierra);border-color:var(--tierra);color:#fff}
.home-hero-film .hero-copy .hero-secundario{background:transparent;color:#fff;border-color:#ffffffa6}
.home-hero-film .hero-copy .hero-secundario svg{display:none}
.hero-datos{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:0;margin:34px 0 0;border-top:1px solid #ffffff40}
.hero-datos div{padding:14px 28px 0 0;margin-right:28px;border-right:1px solid #ffffff2e}
.hero-datos div:last-child{border-right:0;margin-right:0}
.hero-datos dt{font-family:var(--etiqueta);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--verde-claro)}
.hero-datos dd{margin:2px 0 0;font-size:14px;font-weight:700;color:#fff;white-space:nowrap}
.hero-datos dd.is-abierto:before{content:"";display:inline-block;width:8px;height:8px;margin-right:8px;background:#8fd18a;vertical-align:1px;box-shadow:0 0 0 4px #8fd18a33}
@media(hover:hover) and (pointer:fine){
  .home-hero-film .hero-copy .button-whatsapp:hover{background:var(--tierra-2);border-color:var(--tierra-2);color:#fff}
  .home-hero-film .hero-copy .hero-secundario:hover{background:#fff;color:var(--bosque);border-color:#fff}
}
/* Entrada escalonada: cada línea sube desde su propia máscara. */
@media(prefers-reduced-motion:no-preference){
  .hero-listo .home-hero-film [data-entrada]{animation:entrada .9s var(--ease-out) both}
  .hero-listo .home-hero-film h1[data-entrada]{animation:none}
  .hero-listo .home-hero-film h1 span{overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
  .hero-listo .home-hero-film h1 span>*,.hero-listo .home-hero-film h1 span{animation:linea 1s var(--ease-out) both}
  .hero-listo .home-hero-film h1 span:nth-child(1){animation-delay:.08s}
  .hero-listo .home-hero-film h1 span:nth-child(2){animation-delay:.18s}
  .hero-listo .home-hero-film h1 span:nth-child(3){animation-delay:.28s}
  .hero-listo .home-hero-film .hero-eyebrow{animation-delay:0s}
  .hero-listo .home-hero-film .hero-copy>p[data-entrada]{animation-delay:.42s}
  .hero-listo .home-hero-film .hero-actions{animation-delay:.52s}
  .hero-listo .home-hero-film .hero-datos{animation:entrada .9s var(--ease-out) .64s both}
}
@keyframes entrada{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes linea{from{opacity:0;transform:translateY(60%)}to{opacity:1;transform:none}}

/* --- Recorrido 3D sobre el plano del parque --------------------------------- */
.montana{position:relative;background:var(--arena)}
.montana-saltar{position:absolute;top:96px;left:16px;z-index:6;padding:12px 18px;background:var(--papel);color:var(--bosque);font-weight:700;font-size:14px}
.montana-saltar:not(:focus){width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.montana-escena{position:relative;overflow:hidden;isolation:isolate}
.montana-cielo{position:absolute;inset:0;z-index:-3;background:linear-gradient(180deg,#f5ead3 0%,#f2dcad 44%,#eed5a6 66%,#ead1a3 100%)}
.montana-sol{position:absolute;left:16%;top:16%;width:clamp(90px,10vw,160px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#ffe6ad 0 44%,#f8c76a 60%,transparent 71%);opacity:.92}
.montana-lienzo{position:absolute;inset:0;z-index:-1}
.montana-lienzo canvas{display:block;width:100%;height:100%}
.montana-vineta,.montana-pines,.montana-carga,.montana-indice,.montana-pie{display:none}

/* Sin 3D: título, el plano ilustrado y los capítulos en una grilla. */
.montana:not(.is-recorrido) .montana-escena{display:flex;flex-direction:column;padding-block:80px 88px}
.montana:not(.is-recorrido) .montana-texto{display:contents}
.montana:not(.is-recorrido) .montana-texto>*{width:min(var(--max),calc(100% - 96px));margin-inline:auto}
.montana:not(.is-recorrido) .montana-texto>.eyebrow{order:1}
.montana:not(.is-recorrido) .montana-texto>h2{order:2}
.montana:not(.is-recorrido) .montana-respaldo{order:3;margin-bottom:56px}
.montana:not(.is-recorrido) .montana-capitulos{order:4}
.montana-respaldo{width:min(var(--max),calc(100% - 96px));margin:0 auto}
.montana-respaldo img{width:100%;height:auto;border:1px solid var(--linea);box-shadow:0 30px 60px -40px rgba(30,59,44,.55)}
.montana-texto h2{font-size:clamp(46px,6vw,96px);margin-bottom:28px}
.montana-capitulos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:32px 40px}
.montana-etiqueta{font-family:var(--etiqueta);font-weight:600;font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:var(--tierra);margin:0 0 8px}
.montana-capitulos h3{font-family:var(--display);font-weight:500;font-size:clamp(24px,2.1vw,32px);line-height:1.08;margin-bottom:10px}
.montana-capitulos h3 em{font-style:italic;color:var(--tierra);font-weight:400}
.montana-capitulos p{color:var(--muted);margin:0 0 14px}
.montana-capitulos .text-link{font-size:13px}
.montana-final{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:6px}

/* Con 3D: la sección mide siete pantallas y la escena queda fija mientras se avanza. */
.montana.is-recorrido{height:700svh}
.montana.is-recorrido .montana-escena{position:sticky;top:0;height:100svh}
.montana.is-recorrido .montana-respaldo{position:absolute;inset:0;z-index:-2;width:auto;padding:0;transition:opacity .9s ease}
.montana.is-recorrido .montana-respaldo img{height:100%;object-fit:cover;border:0;box-shadow:none;filter:saturate(.75) blur(5px);transform:scale(1.04)}
.montana.is-3d .montana-respaldo{opacity:0;pointer-events:none}
.montana.is-recorrido .montana-vineta{display:block;position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(120% 90% at 55% 45%,transparent 58%,rgba(70,48,22,.22) 100%)}
.montana.is-cargando .montana-carga{display:flex;position:absolute;left:50%;bottom:64px;translate:-50% 0;z-index:2;flex-direction:column;align-items:center;gap:10px;padding:14px 20px;background:#fffcf5e6;font-family:var(--etiqueta);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--bosque);white-space:nowrap}
.montana-carga i{display:block;width:160px;height:2px;background:#1e3b2c26;overflow:hidden}
.montana-carga b{display:block;width:40%;height:100%;background:var(--tierra);animation:carga 1.1s var(--ease-in-out) infinite}
@keyframes carga{from{transform:translateX(-100%)}to{transform:translateX(250%)}}

.montana.is-recorrido .montana-texto{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding-block:120px 120px;pointer-events:none;z-index:3}
.montana.is-recorrido .montana-texto .eyebrow,.montana.is-recorrido .montana-texto h2{max-width:560px;transition:opacity .5s ease,transform .6s var(--ease-out)}
.montana.is-recorrido.is-avanzado .montana-texto .eyebrow,.montana.is-recorrido.is-avanzado .montana-texto h2{opacity:0;transform:translateY(-14px)}
.montana.is-recorrido .montana-texto h2{font-size:clamp(44px,5vw,84px);margin-bottom:22px;color:var(--bosque)}
.montana.is-recorrido .montana-capitulos{display:grid;grid-template-columns:1fr;max-width:430px;gap:0}
.montana.is-recorrido .montana-capitulos li{grid-area:1/1;align-self:start;opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .4s ease,transform .6s var(--ease-out);padding:22px 26px 24px;background:#fffcf5ed;border-left:3px solid var(--ocre);box-shadow:0 24px 50px -36px rgba(30,59,44,.6)}
.montana.is-recorrido .montana-capitulos li.is-activo{opacity:1;transform:none;pointer-events:auto;transition-delay:.08s}
.montana.is-recorrido .montana-capitulos p{color:var(--ink)}
.montana.is-recorrido .montana-capitulos li>p:last-of-type{margin-bottom:12px}
.montana.is-recorrido .montana-capitulos li>p:only-of-type{margin-bottom:0}

/* Etiquetas ancladas al plano: número del mapa, nombre y línea guía hasta el punto. */
.montana.is-3d .montana-pines{display:block;position:absolute;inset:0;z-index:1;pointer-events:none}
.montana-pin{--alto:26px;--mover-x:-50%;--guia-x:50%;position:absolute;left:0;top:0;display:none;align-items:stretch;padding-bottom:calc(var(--alto) + 6px);translate:var(--mover-x) -100%;transform-origin:var(--guia-x) 100%;will-change:transform;color:var(--ink);pointer-events:auto}
.montana-pin[data-lado=derecha]{--mover-x:-14px;--guia-x:14px}
.montana-pin[data-lado=izquierda]{--mover-x:calc(-100% + 14px);--guia-x:calc(100% - 14px)}
.montana-pin:after{content:"";position:absolute;left:var(--guia-x);bottom:5px;width:1px;height:var(--alto);background:var(--bosque)}
.montana-pin:before{content:"";position:absolute;left:var(--guia-x);bottom:-5px;width:10px;height:10px;translate:-50% 0;background:var(--tierra);border:2px solid var(--papel)}
.montana-pin.abajo{translate:var(--mover-x) 0;padding-bottom:0;padding-top:calc(var(--alto) + 6px);transform-origin:var(--guia-x) 0}
.montana-pin.abajo:after{bottom:auto;top:5px}
.montana-pin.abajo:before{bottom:auto;top:-5px}
.montana-pin b{display:flex;align-items:center;justify-content:center;min-width:30px;padding:0 7px;background:var(--bosque);color:#fff;font-family:var(--etiqueta);font-weight:600;font-size:14px;letter-spacing:.04em}
.montana-pin span{padding:5px 10px 5px 9px;background:var(--papel);font-size:13px;font-weight:700;white-space:nowrap}
.montana-area span{padding:7px 12px;background:var(--papel);border-left:3px solid var(--ocre);font-family:var(--etiqueta);font-weight:600;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--bosque)}
.montana-pin.is-fuera{visibility:hidden}
[data-capitulo-activo=mapa] [data-capitulo-pin=mapa],[data-capitulo-activo=exotica] [data-capitulo-pin=exotica],[data-capitulo-activo=aventura] [data-capitulo-pin=aventura],[data-capitulo-activo=jurasica] [data-capitulo-pin=jurasica],[data-capitulo-activo=salvaje] [data-capitulo-pin=salvaje]{display:flex;animation:pin-entra .55s var(--ease-out) both}
.montana-pines>:nth-child(5n+2){animation-delay:.06s}.montana-pines>:nth-child(5n+3){animation-delay:.12s}.montana-pines>:nth-child(5n+4){animation-delay:.18s}.montana-pines>:nth-child(5n){animation-delay:.24s}
@keyframes pin-entra{from{opacity:0;scale:.92}to{opacity:1;scale:1}}
@media(hover:hover) and (pointer:fine){.montana-pin:hover span{background:var(--bosque);color:#fff}.montana-pin:hover b{background:var(--tierra)}}

/* Línea de tiempo inferior: capítulos, avance y nota del plano. */
.montana.is-recorrido .montana-pie{position:absolute;left:0;right:0;bottom:20px;z-index:3;display:grid;grid-template-columns:1fr auto;align-items:end;gap:6px 24px;width:min(var(--max),calc(100% - 96px));margin-inline:auto}
.montana-indice:not([hidden]){display:grid;grid-template-columns:repeat(7,1fr);grid-column:1/-1}
.montana-indice button{min-height:34px;padding:6px 0 8px;border:0;background:none;font-family:var(--etiqueta);font-weight:600;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#1e3b2ca6;text-align:left;transition:color .2s ease}
.montana-indice button[aria-current]{color:var(--tierra)}
@media(hover:hover) and (pointer:fine){.montana-indice button:hover{color:var(--bosque)}}
.montana-barra{display:block;grid-column:1/-1;height:2px;background:#1e3b2c2e;overflow:hidden}
.montana-barra span{display:block;height:100%;background:var(--tierra);transform-origin:0 50%;transform:scaleX(0)}
.montana-nota{grid-column:2;font-family:var(--etiqueta);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#1e3b2c99}
.montana.is-recorrido .montana-lienzo{opacity:0;transition:opacity 1s ease}
.montana.is-recorrido .montana-escena:after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;z-index:2;pointer-events:none;background:linear-gradient(0deg,rgba(246,241,231,.94) 20%,rgba(246,241,231,0))}
.montana.is-3d .montana-lienzo{opacity:1}

@media(max-width:1000px){.montana-indice:not([hidden]){display:none}.montana-nota{grid-column:1/-1}}
@media(max-width:760px){
  .montana-respaldo,.montana:not(.is-recorrido) .montana-texto>*{width:calc(100% - 32px)}
  .montana:not(.is-recorrido) .montana-escena{padding-block:56px 64px}
  .montana.is-recorrido{height:720svh}
  .montana.is-recorrido .montana-texto{justify-content:flex-end;padding-block:90px calc(104px + env(safe-area-inset-bottom));width:calc(100% - 32px)}
  .montana.is-recorrido .montana-texto .eyebrow{position:absolute;top:100px;left:0;margin:0}
  .montana.is-recorrido .montana-texto h2{position:absolute;top:122px;left:0;font-size:40px;margin:0}
  .montana.is-recorrido .montana-capitulos li{padding:16px 18px}
  .montana.is-recorrido .montana-capitulos h3{font-size:23px;margin-bottom:6px}
  .montana.is-recorrido .montana-capitulos p{font-size:14px;line-height:1.55}
  .montana.is-recorrido .montana-pie{width:calc(100% - 32px);bottom:calc(78px + env(safe-area-inset-bottom))}
  .montana-nota{font-size:10px}
  .montana-pin[data-lado=derecha]{--mover-x:-10px;--guia-x:10px}
  .montana-pin[data-lado=izquierda]{--mover-x:calc(-100% + 10px);--guia-x:calc(100% - 10px)}
  .montana-pin b{min-width:24px;font-size:12px;padding:0 5px}
  .montana-pin span{font-size:11px;padding:3px 7px}
  .montana-area span{font-size:11px;padding:5px 8px}
  .montana-sol{left:auto;right:12%;top:10%}
  .montana.is-cargando .montana-carga{bottom:auto;top:96px}
}
@media(prefers-reduced-motion:reduce){.montana-capitulos li,.montana-pin,.montana-respaldo{transition:none!important;animation:none!important}}

/* --- Taquilla ----------------------------------------------------------------- */
.taquilla{padding-block:96px;background:var(--papel);border-block:1px solid var(--linea)}
.taquilla-grid{display:grid;grid-template-columns:1.15fr 1fr .9fr;gap:56px;align-items:start}
.taquilla-cabeza h2{font-size:clamp(40px,4.4vw,72px)}
.taquilla-cabeza .lede{margin-bottom:28px}
.taquilla-tabla{margin:0;border-top:3px solid var(--bosque)}
.taquilla-tabla div{display:flex;align-items:baseline;gap:12px;padding:15px 0;border-bottom:1px solid var(--linea)}
.taquilla-tabla dt{font-weight:700;font-size:15px}
.taquilla-tabla div:after{content:"";order:1;flex:1;border-bottom:1px dotted #b9a98a;translate:0 -4px}
.taquilla-tabla dd{order:2;margin:0;font-family:var(--display);font-weight:500;font-size:34px;line-height:1;color:var(--tierra);font-variant-numeric:lining-nums}
.taquilla-extras{padding:26px 26px 22px;background:var(--arena);border-top:3px solid var(--ocre)}
.taquilla-extras h3{font-family:var(--etiqueta);font-weight:600;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--bosque);margin-bottom:12px}
.taquilla-extras ul{list-style:none;margin:0 0 18px;padding:0}
.taquilla-extras li{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--linea);font-size:14px}
.taquilla-extras li span:last-child{font-weight:700;color:var(--tierra);white-space:nowrap}
.taquilla-extras .field-help{margin:0;font-size:13px}
@media(max-width:1100px){.taquilla-grid{grid-template-columns:1fr 1fr}.taquilla-cabeza{grid-column:1/-1}}
@media(max-width:700px){.taquilla{padding-block:64px}.taquilla-grid{grid-template-columns:1fr;gap:36px}.taquilla-tabla dd{font-size:28px}}

/* --- Ajustes de portada en celular ------------------------------------------- */
@media(max-width:1000px){.home-hero-film .hero-copy{width:86%}}
@media(max-width:600px){
  .home-hero-film .hero-inner{padding-block:200px 96px}
  .home-hero-film .hero-copy h1{font-size:clamp(40px,11.5vw,58px)}
  .home-hero-film .hero-copy .button{min-height:50px;font-size:13px;padding:12px 16px;gap:14px}
  .home-hero-film .hero-actions{gap:10px 14px}
  .hero-datos{grid-template-columns:1fr;margin-top:24px}
  .hero-datos div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;margin:0;border-right:0;border-bottom:1px solid #ffffff26}
  .hero-datos dd{font-size:13px;white-space:normal;text-align:right}
}
@media print{.montana.is-recorrido{height:auto}.montana-lienzo,.montana-pines,.montana-pie,.montana-indice{display:none}}

/* --- Muro de fotos con profundidad ------------------------------------------------- */
.muro{padding-block:112px 24px;overflow:clip}
.muro-cabeza{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:52px}
.muro-cabeza h2{font-size:clamp(40px,4.6vw,76px);margin:0}
.muro-columnas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding-inline:18px;align-items:start;max-height:min(1180px,118vw);overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 78%,transparent);mask-image:linear-gradient(180deg,#000 78%,transparent)}
.muro-columna{display:flex;flex-direction:column;gap:18px;will-change:transform}
.muro-columna:nth-child(2){margin-top:96px}
.muro-columna:nth-child(4){margin-top:44px}
.muro-foto{position:relative;display:block;overflow:hidden;background:var(--arena-2)}
.muro-foto img{width:100%;height:auto;transition:transform .8s var(--ease-out)}
.muro-foto span{position:absolute;left:0;right:0;bottom:0;padding:34px 14px 12px;background:linear-gradient(0deg,rgba(20,32,24,.72),transparent);color:#fff;font-size:13px;font-weight:700;line-height:1.4;opacity:0;transform:translateY(8px);transition:opacity .3s ease,transform .4s var(--ease-out)}
@media(hover:hover) and (pointer:fine){.muro-foto:hover img{transform:scale(1.04)}.muro-foto:hover span{opacity:1;transform:none}}
.muro-foto:focus-visible span{opacity:1;transform:none}
@media(max-width:760px){
  .muro{padding-block:72px 16px}
  .muro-cabeza{flex-direction:column;align-items:start;gap:16px;margin-bottom:32px}
  .muro-columnas{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding-inline:10px;max-height:none;-webkit-mask-image:none;mask-image:none}
  .muro-columna{gap:10px}
  .muro-columna:nth-child(n+3){display:none}
  .muro-columna:nth-child(2){margin-top:48px}
  .muro-foto span{opacity:1;transform:none;font-size:11px;padding:24px 8px 8px}
}

/* --- Taquilla con calculadora ------------------------------------------------------ */
.taquilla-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.02fr)}
.taquilla-cabeza .actions{margin-bottom:22px}
.taquilla.con-calculadora .taquilla-sin-js{display:none}
.taquilla-precios .taquilla-extras{margin-top:26px}
@media(max-width:1100px){.taquilla-grid{grid-template-columns:1fr 1fr}.taquilla-cabeza{grid-column:1/-1}}
@media(max-width:700px){.taquilla-grid{grid-template-columns:1fr}.calculadora{order:2}.taquilla-precios{order:3}.calculadora{padding:22px 18px 18px}}