/* Interactivo «Así produce energía el agua del lago de Yojoa» · prefijo yq7k-
   Todas las reglas cuelgan de .yq7k-root o usan clases yq7k-*; no hay selectores globales. */
/* Todo vive bajo .yq7k-root. --yq7k-top = alto de un header fijo del sitio anfitrión (si existe). */
/* Tokens tomados del Sistema Gráfico de La Prensa (paleta Premium oscura), copiados con prefijo propio para no depender del kit ni chocar con él. */
.yq7k-root{--yq7k-bg:#202020;--yq7k-ink:#FFFFFF;--yq7k-mut:#AFAFAF;--yq7k-rj:#C60018;--yq7k-rv:#FF2323;--yq7k-aq:#35c8ff;--yq7k-vo:#FFE306;--yq7k-ln:rgba(255,255,255,.12);
  --yq7k-ti:"Source Serif 4",Georgia,"Times New Roman",serif;--yq7k-ui:Archivo,Arial,sans-serif;--yq7k-top:0px;--yq7k-h:calc(100vh - var(--yq7k-top));
  position:relative;width:100%;background:var(--yq7k-bg);color:var(--yq7k-ink);font:400 16px/1.55 var(--yq7k-ui);overflow-x:clip;text-align:left;-webkit-font-smoothing:antialiased}
@supports (height:100svh){.yq7k-root{--yq7k-h:calc(100svh - var(--yq7k-top))}}
.yq7k-root,.yq7k-root *,.yq7k-root *::before,.yq7k-root *::after{box-sizing:border-box}
.yq7k-root div,.yq7k-root span{margin:0;padding:0;border:0;letter-spacing:normal}
.yq7k-root svg{display:block;max-width:none}
.yq7k-root video{display:block}

.yq7k-tk{position:relative}
.yq7k-st{position:sticky;top:var(--yq7k-top);height:var(--yq7k-h);overflow:hidden;will-change:transform}
.yq7k-fill{position:absolute;inset:0;width:100%;height:100%}
.yq7k-vd{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.yq7k-ey{font:700 12px/1 var(--yq7k-ui);letter-spacing:1px!important;text-transform:uppercase;color:var(--yq7k-rv)}
.yq7k-hd{font-family:var(--yq7k-ti);font-weight:900;line-height:1.08;letter-spacing:-.01em!important;text-wrap:balance}
.yq7k-vo{color:var(--yq7k-vo)}
.yq7k-aq{color:var(--yq7k-aq)}

/* ── A: portada ── */
.yq7k-a{height:calc(var(--yq7k-h) * 1.6)}
.yq7k-a .yq7k-st{background:var(--yq7k-bg)}
.yq7k-a0{position:absolute;inset:0;background:radial-gradient(60% 55% at 50% 48%,rgba(0,0,0,.42) 0%,rgba(0,0,0,.22) 70%,rgba(0,0,0,.16) 100%),linear-gradient(180deg,rgba(0,0,0,.18) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,.6) 100%)}
.yq7k-a [data-yq7k-ah]{object-position:50% 50%;transform-origin:50% 55%}
.yq7k-cl{position:absolute;inset:-6%;pointer-events:none;will-change:transform,opacity}
.yq7k-cl i{position:absolute;left:0;top:0;height:100%;width:calc(100% + 1200px);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='700' height='450'%3E%3Cfilter id='c' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.008 .012' numOctaves='5' seed='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 3.4 0 0 0 -1.95'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)'/%3E%3C/svg%3E") 0 0/1200px 771px repeat;opacity:.9;animation:yq7k-c1 100s linear infinite paused}
.yq7k-cl i+i{width:calc(100% + 1800px);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='700' height='450'%3E%3Cfilter id='c' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.008 .012' numOctaves='5' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 3.4 0 0 0 -2.02'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)'/%3E%3C/svg%3E") 0 0/1800px 1157px repeat;opacity:.7;animation:yq7k-c2 160s linear infinite paused}
.yq7k-hv .yq7k-cl i{animation-play-state:running}
.yq7k-a1{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 clamp(20px,6vw,96px)!important;will-change:transform,opacity}
.yq7k-kk{display:flex;align-items:center;gap:12px;font:700 12px/1 var(--yq7k-ui);letter-spacing:.8px!important;text-transform:uppercase}
.yq7k-kk span:first-child{background:var(--yq7k-rj);color:#fff;padding:5px 9px!important;border-radius:1px}
.yq7k-kk span+span{color:var(--yq7k-ink)}
.yq7k-a1 .yq7k-hd{font-size:clamp(38px,5vw,76px);font-weight:900;line-height:1.04;max-width:16ch;margin:clamp(16px,2.4vh,26px) 0 clamp(16px,2.4vh,26px);text-wrap:balance;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.yq7k-a2{max-width:56ch;font-size:clamp(16px,1.3vw,20px);font-style:italic;line-height:1.5;color:#E0E0E0;text-wrap:balance;text-shadow:0 1px 6px rgba(0,0,0,.7)}
.yq7k-a4{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 0;margin-top:clamp(18px,3vh,30px)!important;padding-top:14px!important;border-top:1px solid rgba(255,255,255,.28)!important;font:500 12.5px/1.3 var(--yq7k-ui);letter-spacing:.06em!important;text-transform:uppercase;color:#E0E0E0}
.yq7k-a4 span+span::before{content:"→";margin:0 10px;color:var(--yq7k-rv)}
.yq7k-a3{position:absolute;left:0;right:0;bottom:22px;font-size:12px;letter-spacing:.16em!important;text-transform:uppercase;color:#E0E0E0;display:flex;flex-direction:column;align-items:center;gap:10px}
.yq7k-a3::after{content:"";width:1px;height:38px;background:linear-gradient(var(--yq7k-rv),transparent);animation:yq7k-dn 1.8s ease-in-out infinite;transform-origin:top}

/* ── B: recorrido ── */
.yq7k-b{height:calc(var(--yq7k-h) * 8.6)}
.yq7k-b .yq7k-st{background:var(--yq7k-bg)}
.yq7k-sv{position:absolute;inset:0}
/* doble clase a propósito: la hoja de MapLibre (.maplibregl-map{position:relative}) se carga después y no debe ganar */
.yq7k-root .yq7k-mp.yq7k-mp{position:absolute;inset:0;opacity:0;transition:opacity .6s}
.yq7k-root.yq7k-mok .yq7k-mp[data-yq7k-mp],.yq7k-root.yq7k-mok2 .yq7k-mp[data-yq7k-mp2]{opacity:1}
.yq7k-ph{position:absolute;inset:0;overflow:hidden;opacity:0;visibility:hidden;will-change:opacity}
.yq7k-ph .yq7k-d4{color:rgba(255,255,255,.85);text-shadow:0 1px 6px rgba(0,0,0,.9)}
.yq7k-hp{width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 0 5px rgba(53,200,255,.35),0 0 18px 8px rgba(53,200,255,.45);visibility:hidden;pointer-events:none}
.yq7k-mk{display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none;will-change:opacity}
.yq7k-mk span{font:700 12.5px/1.2 var(--yq7k-ui);color:#ffffff;background:rgba(32,32,32,.86);border:1px solid rgba(255,255,255,.3)!important;border-radius:2px;padding:5px 9px!important;white-space:nowrap;transition:color .4s,border-color .4s}
.yq7k-mk i{width:12px;height:12px;border-radius:50%;background:#ffffff;border:3px solid #202020;box-shadow:0 0 0 2px #ffffff;transition:background .4s,box-shadow .4s}
.yq7k-mk2 span{font-weight:500;font-size:11.5px;color:#E0E0E0}
.yq7k-mk2 i{width:8px;height:8px;border-width:2px;box-shadow:0 0 0 1.5px #E0E0E0;background:#E0E0E0}
.yq7k-g1 .yq7k-mg1 span,.yq7k-g2 .yq7k-mg2 span{color:var(--yq7k-vo);border-color:var(--yq7k-vo)!important}
.yq7k-g1 .yq7k-mg1 i,.yq7k-g2 .yq7k-mg2 i{background:var(--yq7k-vo);box-shadow:0 0 0 2px var(--yq7k-vo),0 0 18px 6px rgba(255,227,6,.55)}
.yq7k-mp .maplibregl-ctrl-attrib{font:10px/1.3 var(--yq7k-ui)}
.yq7k-sc{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(32,32,32,.92) 0%,rgba(32,32,32,.7) 28%,rgba(32,32,32,0) 56%)}
.yq7k-pg{position:absolute;left:0;top:0;height:3px;width:100%;background:var(--yq7k-rj);transform-origin:left;transform:scaleX(0)}
.yq7k-c{position:absolute;left:clamp(20px,5vw,84px);top:0;bottom:0;width:min(430px,38vw)}
.yq7k-cd{position:absolute;left:0;right:0;top:50%;opacity:0;visibility:hidden;will-change:transform,opacity}
.yq7k-cd .yq7k-hd{font-size:clamp(26px,3.1vw,44px);margin:12px 0 14px}
.yq7k-tx{color:#E0E0E0;font-size:clamp(15px,1.15vw,17.5px)}
.yq7k-tx b{color:var(--yq7k-ink);font-weight:700}
.yq7k-ch{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 16px!important;font:700 14px/1.2 var(--yq7k-ui)}
.yq7k-ch span{padding:7px 12px!important;border:1px solid var(--yq7k-ln)!important;border-radius:99px;background:rgba(0,0,0,.45);white-space:nowrap}
.yq7k-ch i{font-style:normal;color:var(--yq7k-rv)}
.yq7k-dt{position:absolute;right:clamp(12px,2.4vw,34px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:10px}
.yq7k-dt span{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.3);transition:background .3s,transform .3s}
.yq7k-dt span.yq7k-on{background:var(--yq7k-rv);transform:scale(1.7)}

/* ── velo de fundido entre bloques y transición con foto ── */
.yq7k-fd{position:absolute;inset:0;background:var(--yq7k-bg);opacity:0;pointer-events:none;z-index:5;will-change:opacity}
.yq7k-g{position:absolute;inset:0;z-index:4;overflow:hidden;background:var(--yq7k-bg);display:flex;align-items:center;justify-content:center;padding:0 clamp(20px,6vw,96px)!important;will-change:opacity}
.yq7k-gb{position:absolute;inset:0;background:linear-gradient(180deg,var(--yq7k-bg) 0%,rgba(32,32,32,.45) 30%,rgba(32,32,32,.5) 100%)}
.yq7k-gt{position:relative;display:flex;flex-direction:column;align-items:center;gap:clamp(14px,2.4vh,24px);text-align:center;will-change:transform,opacity}
.yq7k-gt .yq7k-hd{max-width:16ch;font-size:clamp(32px,5.4vw,80px);text-shadow:0 2px 30px rgba(0,0,0,.7)}
/* ── C: datos adicionales (segundo mapa) ── */
.yq7k-d{height:calc(var(--yq7k-h) * 4.6)}
.yq7k-d .yq7k-st{background:var(--yq7k-bg)}
.yq7k-tx2{font-size:clamp(18px,1.9vw,27px);line-height:1.34;font-weight:500;color:#ffffff;margin-top:12px!important}
.yq7k-tx2 b{color:var(--yq7k-vo)}
.yq7k-im{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;will-change:transform,opacity}
.yq7k-d4{position:absolute;right:14px;bottom:10px;font-size:10.5px;color:rgba(255,255,255,.55);text-align:right;max-width:60%}
.yq7k-d5{right:auto;left:clamp(20px,5vw,84px);bottom:14px;text-align:left}

/* ── E: antes / después ── */
.yq7k-e{height:calc(var(--yq7k-h) * 3.2)}
.yq7k-e .yq7k-st{background:radial-gradient(90% 70% at 50% 0%,#333 0%,var(--yq7k-bg) 70%);display:flex;align-items:center;justify-content:center;padding:20px clamp(20px,5vw,84px)}
.yq7k-sh{display:flex;align-items:center;gap:12px}
.yq7k-sh i{width:4px;height:20px;background:var(--yq7k-rj);border-radius:1px;flex:none}
.yq7k-sh span{font:700 16px/1.2 var(--yq7k-ui);text-transform:uppercase;letter-spacing:.2px!important;color:var(--yq7k-ink)}
.yq7k-sh b{flex:1;height:1px;background:var(--yq7k-ln)}
.yq7k-e1{width:min(1040px,100%)}
.yq7k-e2{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:10px}
.yq7k-sw{position:relative;font-family:var(--yq7k-ui);font-weight:700;letter-spacing:.2px!important;font-size:clamp(20px,2.4vw,30px);height:1.3em;min-width:8em}
.yq7k-sw span{position:absolute;left:0;top:0;white-space:nowrap}
.yq7k-nm{font-family:var(--yq7k-ti);font-weight:900;font-size:clamp(84px,17vw,230px);line-height:.86;letter-spacing:-.045em!important;font-variant-numeric:tabular-nums}
.yq7k-nm small{font-size:.28em;letter-spacing:0;margin-left:.2em;color:var(--yq7k-mut);font-weight:700}
.yq7k-br{display:flex;height:clamp(40px,6vh,64px);margin:clamp(16px,3vh,30px) 0 clamp(14px,2.4vh,24px)!important;border-radius:4px;overflow:hidden;background:rgba(255,255,255,.08);font:700 13px/1.1 var(--yq7k-ui)}
.yq7k-br span{display:flex;align-items:center;padding:0 12px!important;white-space:nowrap;overflow:hidden}
.yq7k-s1{width:24.167%;background:#1489d6}
.yq7k-s2{width:66.667%;background:#0b5f9e;border-left:2px solid var(--yq7k-bg)!important}
.yq7k-s3{width:9.166%;background:repeating-linear-gradient(135deg,#FFE306 0 8px,#CCB800 8px 16px);color:#000;justify-content:center;padding:0!important;transform-origin:left;transform:scaleX(0);font-weight:700!important}
.yq7k-pn{display:grid}
.yq7k-pn>div{grid-area:1/1;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;will-change:opacity,transform}
.yq7k-bx{border:1px solid var(--yq7k-ln)!important;border-radius:4px;padding:clamp(12px,1.6vw,20px)!important;background:rgba(255,255,255,.04);font-size:clamp(13px,1.05vw,15.5px);color:#E0E0E0}
.yq7k-bx b{display:block;font:900 clamp(18px,1.7vw,24px)/1.17 var(--yq7k-ti);color:var(--yq7k-ink);margin-bottom:6px}
.yq7k-rg{display:flex;align-items:center;gap:14px}
.yq7k-rg svg{width:74px;height:74px;flex:none;transform:rotate(-90deg)}

.yq7k-f{padding:clamp(40px,7vw,72px) clamp(20px,6vw,96px) clamp(48px,8vw,80px)!important;border-top:1px solid var(--yq7k-ln)!important;font-size:13px;color:var(--yq7k-mut)}
.yq7k-f1{display:flex;flex-wrap:wrap;gap:22px clamp(28px,6vw,72px);max-width:1040px;margin:0 auto!important}
.yq7k-f1 span{display:block;font:700 12px/1 var(--yq7k-ui);letter-spacing:1px!important;text-transform:uppercase;color:var(--yq7k-rv);margin-bottom:8px!important}
.yq7k-f1 b{font:700 16px/1.35 var(--yq7k-ui);color:var(--yq7k-ink)}
.yq7k-f3{max-width:1040px;margin:10px auto 0!important;font-size:12px}
.yq7k-f2{max-width:1040px;margin:26px auto 0!important;padding-top:18px!important;border-top:1px solid var(--yq7k-ln)!important;font-size:12px}

@keyframes yq7k-c1{to{transform:translate3d(-1200px,0,0)}}
@keyframes yq7k-c2{to{transform:translate3d(-1800px,0,0)}}
@keyframes yq7k-dn{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

@media (max-width:899px){
  .yq7k-sv{bottom:42%}
  .yq7k-sc{background:linear-gradient(180deg,rgba(32,32,32,0) 40%,rgba(32,32,32,.94) 60%)}
  .yq7k-c{left:18px;right:18px;width:auto;top:58%;bottom:0}
  .yq7k-cd{top:6px}
  .yq7k-cd .yq7k-hd{font-size:23px;margin:8px 0 8px}
  .yq7k-tx2{font-size:17px}
  .yq7k-d5{display:none}
  .yq7k-tx{font-size:14.5px;line-height:1.45}
  .yq7k-ch{font-size:12px;gap:5px;margin-bottom:10px!important}
  .yq7k-ch span{padding:5px 9px!important}
  .yq7k-dt{top:29%}
  .yq7k-pn>div{grid-template-columns:1fr 1fr;gap:10px}
  .yq7k-w2,.yq7k-rg{grid-column:span 2}
  .yq7k-br{font-size:11px}
  .yq7k-br span{padding:0 7px!important}
}
@media (prefers-reduced-motion:reduce){
  .yq7k-root *{animation:none!important}
}
