/* Escenas animadas, fondos y microanimaciones. Se carga después de style.css. */
.hero0{padding:clamp(28px,5vw,60px) 0 clamp(20px,3vw,34px)}
.hero0 h1{font-size:clamp(2.6rem,6.2vw,5.2rem);line-height:.9;max-width:22ch}
.hero0 h1 em{font-style:normal;color:var(--y)}
.hero0 .lead{margin-top:22px}
.escena{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#070605;margin-top:8px}
.esc-stage{position:relative;height:clamp(400px,46vw,560px);overflow:hidden;contain:layout paint}
.esc-svg{display:block;width:100%;height:100%}
.nt,.nt *{transition:none!important}
.dusk{opacity:1;transition:opacity 3s ease .5s}.off .dusk{opacity:0}
.stars{opacity:0;transition:opacity 3s ease 1s}.off .stars{opacity:.9}
.tw{animation:tw 4s ease-in-out infinite}@keyframes tw{50%{opacity:.2}}
.wb{opacity:1;transition:opacity .4s ease var(--r,0s)}.off .wb{opacity:.04;transition-delay:var(--d,0s)}
.fk{animation:fk 5s infinite}@keyframes fk{0%,38%,52%,100%{opacity:1}43%{opacity:.15}47%{opacity:.8}}
.lp .halo,.lp .bulb{opacity:1;transition:opacity .4s ease var(--r,0s)}.off .lp .halo,.off .lp .bulb{opacity:0;transition-delay:var(--d,0s)}
.beacon{animation:bk 2.2s infinite}@keyframes bk{0%,60%,100%{opacity:1}70%{opacity:.1}}
.gl{stroke:#8a7a4a;transition:stroke .4s}.off .gl{stroke:var(--warn);stroke-dasharray:4 7}
.casa .hl{stroke:var(--y);stroke-width:1.6;stroke-linejoin:round}
.glow-i{opacity:0;transition:opacity .5s}.luz-on .glow-i{opacity:.1}
.cone{opacity:0;transition:opacity .5s}.luz-on .cone{opacity:1}
.gab{fill:#1b1710;stroke:var(--y);stroke-width:1.4;transition:fill .5s}.luz-on .gab{fill:#ffe27a}
.dip .casa{animation:dip .95s}@keyframes dip{0%,100%{opacity:1}15%,65%{opacity:.28}40%{opacity:.7}}
.ap{cursor:pointer;outline:none}.ap .hit{fill:transparent}
.ap .body,.est .body2{fill:#171410;stroke:var(--y);stroke-width:1.6;stroke-linejoin:round;transition:fill .4s,stroke .2s}
.ap .dt,.est .dt{fill:none;stroke:var(--mute);stroke-width:1.2;stroke-linecap:round}
.ap .cab{fill:none;stroke:#4a4332;stroke-width:2;stroke-linecap:round}
.ap.on .cab{stroke:var(--y);stroke-dasharray:6 8;animation:flow .8s linear infinite}
@keyframes flow{to{stroke-dashoffset:-14}}
.ap .led{fill:#3d3729}.ap.on .led{fill:var(--ok)}
.ap.on .body{fill:#33290e}
.ap .scr{fill:#1b1710;stroke:var(--y);stroke-width:1.2;transition:fill .4s}.ap.on .scr{fill:#ffe27a}
.ap .bulbi{fill:#2a251c;stroke:var(--y);stroke-width:1.4;transition:fill .4s}.ap.on .bulbi{fill:#ffe27a}
.ap.on .l1{animation:bk 1.3s infinite}.ap.on .l2{animation:bk 1.7s infinite}.ap.on .l3{animation:bk 2.1s infinite}
.ap:hover .body{stroke:#ffd54a}
.ap:focus-visible .hit{stroke:var(--y);stroke-width:2;stroke-dasharray:5 4}
.esc-svg .lb{font:500 10.5px var(--f-m);fill:#a8a08c;letter-spacing:.06em;pointer-events:none}
.est .body2{stroke-width:1.9}.est .pn{fill:#0b0907;stroke:var(--y);stroke-width:1.2}
.est .sg{fill:#2d2819}.est .sg.on{fill:var(--y)}.est .pct{font:500 11px var(--f-m);fill:var(--y)}.est .hd2{stroke:var(--y)}
.off .est .body2{animation:pulse 2.4s ease-in-out infinite}@keyframes pulse{50%{stroke:#ffe27a}}
.pausa,.pausa *{animation-play-state:paused!important}
.hud{position:absolute;left:var(--gut);top:14px;z-index:2;font-size:11.5px;letter-spacing:.08em;color:var(--y);background:rgba(7,6,5,.78);padding:7px 11px;border:1px solid var(--line);display:flex;gap:9px;align-items:center;max-width:calc(100% - 2*var(--gut))}
.hud .dot{width:8px;height:8px;background:var(--ok);flex:none}.esc-stage.out .dot{background:var(--warn)}.esc-stage.out .hud{color:#ffb089}
.esc-bar{display:grid;gap:18px 34px;padding:20px 0 26px;grid-template-columns:minmax(0,1fr)}
@media (min-width:980px){.esc-bar{grid-template-columns:minmax(0,1.1fr) auto minmax(0,.9fr);align-items:center}}
.esc-t{font:800 clamp(1.7rem,3.6vw,2.5rem)/.98 var(--f-d);text-transform:uppercase;margin:0 0 8px}
.esc-btns{display:flex;flex-wrap:wrap;gap:12px}
.esc-rd{display:grid;gap:8px;border-left:3px solid var(--y);padding-left:16px}
.esc-rd .k{display:block;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--mute)}
.esc-rd b{font:500 1.55rem/1.2 var(--f-m);color:var(--y)}
.esc-rd p{margin:0}

/* Cómo se conecta */
.conecta .cn-top{display:flex;flex-wrap:wrap;gap:10px 16px;justify-content:space-between;align-items:center;margin:0 4px 12px}
.cn-bt{display:flex;gap:10px;flex-wrap:wrap}
.cn-svg{display:block;width:100%;height:auto}
.cn-svg .ln{fill:none;stroke:var(--y);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.cn-svg .fl2{fill:#12100c}.cn-svg .dm{fill:none;stroke:var(--mute);stroke-width:1;stroke-dasharray:3 3}
.cn-svg .lb{font:500 12.5px var(--f-m);fill:#d9d2bf;letter-spacing:.05em}.cn-svg .lb.ac{fill:var(--y)}.cn-svg .lb.mu{fill:var(--mute)}
.cn-svg .sg{fill:#2d2819;transition:fill .15s}.cn-svg .sg.on{fill:var(--y)}
.cn-svg .fl{fill:none;stroke:#4a4332;stroke-width:2.4;stroke-dasharray:5 6}
.cn-svg.carga .fl-c,.cn-svg.desc .fl-d{stroke:var(--y);animation:flow2 .8s linear infinite}
@keyframes flow2{to{stroke-dashoffset:-11}}
.cn-svg .vent{fill:#1b1710;stroke:var(--y);stroke-width:1.4;transition:fill .5s}.cn-svg.desc .vent{fill:#ffe27a}
.cn-svg .scr2{fill:#1b1710;transition:fill .5s}.cn-svg.desc .scr2{fill:#ffe27a}
.cn-svg.pausa,.cn-svg.pausa *{animation-play-state:paused!important}

/* Fondos y detalles */
.ft-city{height:clamp(70px,11vw,150px);background:url(../img/skyline.svg) repeat-x left bottom/auto 100%;margin-top:60px}
.ft-city+.ft{margin-top:0}
.wires{position:absolute;left:0;right:0;top:0;height:90px;background:url(../img/tendido.svg) repeat-x center top/auto 90px;opacity:.55;pointer-events:none;z-index:0}
.hd-art{position:relative}.hd-art>*:not(.wires){position:relative;z-index:1}
.ah{position:relative}
.ah::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(circle at 8% 22%,rgba(255,196,0,.8) 0 1.6px,transparent 2.4px),radial-gradient(circle at 38% 74%,rgba(255,196,0,.6) 0 1.4px,transparent 2.2px),radial-gradient(circle at 58% 16%,rgba(255,196,0,.7) 0 1.5px,transparent 2.3px),radial-gradient(circle at 91% 62%,rgba(255,196,0,.7) 0 1.6px,transparent 2.4px),radial-gradient(circle at 74% 88%,rgba(255,196,0,.5) 0 1.3px,transparent 2px);animation:twk 6s ease-in-out infinite}
@keyframes twk{0%,100%{opacity:.25}50%{opacity:.9}}
.ah>*{position:relative;z-index:1}
.placa{transition:transform .2s,box-shadow .2s}.placa:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 rgba(255,196,0,.22)}
.idx a{transition:padding .2s,background .2s}.idx a:hover{padding-left:14px}
.capbar{display:flex;align-items:center;gap:10px;margin:0 0 14px;font:400 11px var(--f-m);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.capbar .cs{display:flex;gap:3px}.capbar i{display:block;width:9px;height:16px;background:#2d2819}.capbar i.on{background:var(--y)}
html:not(.nojs) .capbar:not(.vis) i.on{opacity:.12}
.capbar.vis i.on{animation:segon .45s both;animation-delay:calc(var(--i)*45ms)}
@keyframes segon{from{opacity:.1;transform:scaleY(.4)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.ah::after{animation:none;opacity:.5}.capbar.vis i.on{animation:none}}

.cn-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}.cn-wrap .cn-svg{min-width:680px}
.cn-hint{display:none;margin:6px 4px 0}@media (max-width:760px){.cn-hint{display:block}}

/* Aviso de cookies: identidad negro cálido + amarillo señal */
:root{--cb-bg:#1a1712;--cb-fg:#f2ecdc;--cb-borde:#ffc400;--cb-btn-bg:transparent;--cb-btn-fg:#ffc400;--cb-btn-borde:#ffc400;--cb-acento:#ffc400;--cb-fuente:"IBM Plex Sans",system-ui,sans-serif;--cb-radio:2px}
.cb{box-shadow:5px 5px 0 rgba(255,196,0,.28);border-width:1px 1px 1px 5px;max-width:700px;font-size:13.5px}
.cb-btn:hover{background:rgba(255,196,0,.14);filter:none}
@media (max-width:759px){.cb{bottom:78px}}