/* Caso Yasuni (inc/caso-yasuni.php), 29/10/26. Prefijo ya-. Motor común: ma-caso.css. */

.ya-hero-k{margin:0 0 10px;font-family:var(--f-label);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--cx-fg3)}
.ya-hero .cx-hero-f img{object-position:50% 62%}
/* El título se retira mientras la imagen se abre: los pilotos no quedan tapados. */
html.cx-js .ya-hero .cx-hero-top{opacity:clamp(0,calc(1 - var(--q,0) * 2.2),1)}

/* Capítulos */
.ya-ch{padding:clamp(120px,18svh,210px) 0 clamp(60px,8vw,110px)}
.ya-ch[id]{scroll-margin-top:70px}
.ya-h2{font-size:clamp(34px,3.9vw,64px)}
.ya-sub{margin-top:clamp(100px,12vw,170px)}
.ya-c6{grid-column:span 6}

/* Escena de los cuatro capítulos: la lista sigue a la pieza encendida (caso-yasuni.js). */
.ya-sm .cx-sm-x .cx-p{margin-top:clamp(16px,2vw,24px)}
.ya-tl{list-style:none;margin:clamp(26px,3vw,40px) 0 0;padding:0;border-top:1px solid var(--cx-line)}
.ya-tl li{border-bottom:1px solid var(--cx-line);opacity:.38;transition:opacity .5s ease}
.ya-tl li.on{opacity:1}
.ya-tl li>a{display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:clamp(14px,1.4vw,22px);align-items:baseline;padding:12px 0;color:inherit;text-decoration:none}
.ya-tl b{font-family:'nh-ultralight',var(--f-text);font-weight:200;font-size:clamp(20px,1.8vw,28px);line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;min-width:4.6em}
.ya-tl span{font-family:var(--f-light);font-weight:300;font-size:clamp(17px,1.35vw,21px);line-height:1.35;color:var(--cx-fg)}
.ya-tl i{display:block;font-style:normal;font-family:var(--f-label);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--cx-fg3);max-height:0;overflow:hidden;transition:max-height .5s ease,margin .5s ease}
.ya-tl li.on i{max-height:3em;margin-top:6px}
html:not(.cx-js) .ya-tl li{opacity:1}
html:not(.cx-js) .ya-tl i{max-height:none;margin-top:6px}
@media (hover:hover){.ya-tl a:hover span{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}}
.ya-tl a:focus-visible{outline:1px solid currentColor;outline-offset:4px;border-radius:4px}
.ya-sm .cx-sm-f img{display:block;width:100%;height:100%;object-fit:cover}
.ya-sm .cx-sm-f.ya-sm-c{background:#000}
.ya-sm .cx-sm-f.ya-sm-c img{object-fit:contain}

/* Películas de Vimeo: fachada con póster y botón; el reproductor, al pulsar. */
.ya-film{background:#000}
.ya-film>.ya-film-p{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ya-film iframe{position:absolute;inset:0;z-index:3;width:100%;height:100%;border:0;background:#000}
.ya-film-b{position:absolute;z-index:4;left:clamp(14px,2vw,28px);bottom:clamp(14px,2vw,28px);display:inline-flex;align-items:center;gap:12px;padding:12px 20px 12px 14px;border-radius:999px;background:rgba(244,241,236,.94);color:#151515;font-family:var(--f-label);font-size:12px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:transform .4s cubic-bezier(.2,.7,.2,1),opacity .3s ease}
.ya-film-b:hover{transform:scale(1.04)}
.ya-film-b:focus-visible{outline:2px solid #E63C2F;outline-offset:3px}
.ya-film-i{position:relative;flex:none;width:28px;height:28px;border-radius:50%;background:#E63C2F}
.ya-film-i::after{content:"";position:absolute;left:11px;top:8px;border-left:9px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent}
.ya-film.play .ya-film-b{opacity:0;pointer-events:none}
.ya-film-k{margin:clamp(12px,1.4vw,18px) 0 0;font-family:var(--f-label);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--cx-fg3)}
.ya-rev-g{margin-top:clamp(70px,9vw,120px);align-items:end}

/* Copa Yasuni */
.ya-tv-g{align-items:center}
.ya-tv-l{background:#E63C2F}
.ya-tv-l img{object-fit:contain;padding:7% 9%;box-sizing:border-box}
.ya-yt-g,.ya-do-g,.ya-bn-g{margin-top:clamp(40px,5vw,70px)}
.ya-st{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.6vw,22px);margin-top:clamp(40px,5vw,70px)}
.ya-do{margin-top:clamp(40px,5vw,70px)}
.ya-do-g{margin-top:clamp(12px,1.6vw,22px)}

/* Tiras: cada pieza con su proporción (la de los stories, el cuadrado de los posts o la lámina 16:9). */
.ya-band .ya-band-f{width:auto;height:clamp(300px,34vw,520px);aspect-ratio:var(--ar,9/16)}
.ya-band .ya-band-f img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.ya-band--cp .ya-band-f{height:clamp(240px,27vw,420px)}
.ya-camp .ya-band{margin-top:clamp(70px,9vw,120px)}
.ya-bn-g{margin-top:clamp(70px,9vw,120px)}

/* La web */
.ya-web{padding-bottom:0}
.ya-web .cx-f--bleed{margin-bottom:0}
.ya-m{display:none}
@media (max-width:760px) and (orientation:portrait){.ya-d{display:none}.ya-m{display:block}}
.ya-web2{padding-top:clamp(110px,15svh,180px)}
.ya-w-g{margin-top:clamp(40px,5vw,70px);align-items:center}
.ya-o-partes{object-position:50% 0}
.ya-w-dist{margin-top:clamp(12px,1.6vw,22px)}
.ya-w-v{margin-top:clamp(40px,5vw,70px)}
.ya-w-v+.ya-w-v{margin-top:clamp(12px,1.6vw,22px)}
.ya-w-r3{margin-top:clamp(40px,5vw,70px)}
.ya-w-mov{margin-top:clamp(12px,1.6vw,22px)}

/* Company profile */
.ya-cp .ya-band{margin-top:clamp(70px,9vw,120px)}
.ya-cp-imp{margin-top:clamp(70px,9vw,120px)}

/* Cierre */
.ya-fin{padding:clamp(110px,15svh,180px) 0}
.ya-fin .cx-reg{margin:0}

@media (max-width:900px){
  .ya-tl li>a{padding:8px 0}
  .ya-tl span{font-size:15px}
  .ya-tl i{display:none}
  .ya-tl b{min-width:0}
  .ya-film-b{padding:10px 16px 10px 12px;font-size:11px}
}
@media (max-width:900px) and (max-height:820px){
  .ya-sm .ya-tl{display:none}
}
@media (max-width:760px){
  .ya-c6{grid-column:1/-1}
  .ya-st{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ya-band .ya-band-f{height:clamp(260px,62vw,380px)}
  .ya-band--cp .ya-band-f{height:clamp(190px,48vw,280px)}
  .ya-hero .cx-hero-f img{object-position:50% 50%}
}
@media (prefers-reduced-motion:reduce){
  .ya-tl li,.ya-tl i{transition:none}
}
