/* São Paulo em toda a capa; textos, categorias e conexões são camadas independentes. */
.capa{background:#031328}
.capa__fixa{isolation:isolate;min-height:100svh;padding-bottom:0}
.capa .capa__arte{position:absolute;inset:0;z-index:0;width:100%;height:100%;max-width:none;margin:0;justify-self:auto}
.capa__cena{position:relative;width:100%;height:100%;aspect-ratio:auto;border-radius:0;overflow:hidden;background:#031328}
.capa__panorama{position:absolute;inset:0;display:block}
.capa__foto{width:100%;height:100%;object-fit:cover;object-position:68% center}
.capa__cena::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#031025F5 0%,#031025DB 27%,#0310258C 43%,#03102518 64%),linear-gradient(0deg,#0310259C,transparent 24%,transparent 80%,#03102550);pointer-events:none}
.capa__grade{z-index:3;display:flex;align-items:center;min-height:100svh;padding-block:130px 100px;pointer-events:none}
.capa__grade>div:first-child{width:min(45%,510px);max-width:none;margin:0;pointer-events:auto}
.capa h1{font-size:clamp(2.8rem,4.3vw,4.25rem);max-width:12ch;text-shadow:0 3px 30px #0005}
.capa .capa__texto{font-size:20px;line-height:1.5;color:#F2F6FD;max-width:30ch}
.capa .caminho{background:#061A32CC;backdrop-filter:blur(8px);border-color:#B8DDFF44}
.capa .caminho:hover{background:#12304BDF;border-color:#FF7590}
.capa .caminho span{color:#DFE8F2}
.capa .caminho em{color:#FF9CB0}
.capa__dica{z-index:4;color:#E2EDFC;bottom:24px;text-shadow:0 2px 8px #000}
.cena__ligacoes{z-index:2;opacity:1;overflow:visible}
.cena__ligacoes path{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;animation:none}
.cena__ligacoes .cena__traco{stroke:#75E7FF;stroke-width:.8;opacity:.35;filter:drop-shadow(0 0 3px #55DBFF)}
.capa .cena__ligacoes .cena__fluxo{stroke:#8FEEFF;stroke-width:1.8;stroke-dasharray:10 120;opacity:.9;filter:drop-shadow(0 0 4px #26C8FF);animation:circuito-flui 5s linear infinite}
.capa .cena__ligacoes .cena__fluxo:nth-child(4n){stroke:#FF80AE;animation-direction:reverse;animation-duration:7s}
.cena__pontos{fill:#B6F5FF;filter:drop-shadow(0 0 5px #37DBFF)}
.cena__particulas{fill:#EEFCFF;filter:drop-shadow(0 0 6px #6BE5FF)}
.cena__pin{z-index:3;left:var(--x);top:var(--y);flex-direction:row;justify-content:center;gap:7px;width:max-content;max-width:160px;min-width:100px;min-height:48px;padding:10px 13px;border-radius:12px;background:#041B32E8;border:1px solid #8EDEFF99;box-shadow:0 0 0 4px #65DEFF08,0 6px 28px #0006;font-size:clamp(11px,.95vw,14px);line-height:1.2;backdrop-filter:blur(8px)}
.cena__pin>svg{width:20px;height:24px;flex:none}
.cena__pin--ativo,.cena__pin:hover{background:#74233FEF;border-color:#FFB3C5;box-shadow:0 0 0 4px #FF304C12,0 0 32px #FF587650}
.cena__pin:focus-visible{outline:3px solid #fff;outline-offset:5px}
@keyframes circuito-flui{to{stroke-dashoffset:-260}}
@media(min-width:961px) and (max-height:760px){.capa__grade{padding-block:110px 70px}.capa h1{font-size:48px}}
@media(max-width:960px){
 .capa__fixa{display:block;min-height:0}
 .capa__grade{display:block;min-height:0;padding-top:110px;padding-bottom:650px}
 .capa__grade>div:first-child{width:min(100%,620px);margin-inline:auto}
 .capa__cena::before{content:"";position:absolute;inset:-20px;background:url('assets/capa_sao_paulo_marcos_v2.png') 80% center/cover;filter:blur(15px);opacity:.65}
 .capa__panorama{top:auto;bottom:0;height:700px;mask-image:linear-gradient(transparent,#000 12%);-webkit-mask-image:linear-gradient(transparent,#000 12%)}
 .capa__foto{object-fit:cover;object-position:80% center}
 .capa__cena::after{background:linear-gradient(#031025ED 0%,#031025C9 32%,#03102555 48%,#0310250D 64%,#03102538 88%,#031025BD)}
 .cena__pin{left:var(--mx);top:calc(100% - 540px + var(--fila)*145px);font-size:13px;min-width:110px;max-width:175px}
 .capa__dica{display:block}
}
@media(max-width:620px){
 .capa__grade{padding-top:94px;padding-bottom:590px}
 .capa__grade>div:first-child{width:100%;max-width:440px}
 .capa h1{font-size:clamp(2.4rem,10.6vw,3.1rem)}
 .capa .capa__texto{font-size:18px;max-width:30ch}
 .capa .caminhos{gap:7px}
 .capa .caminho{padding:11px 8px}
 .capa__panorama{height:630px}
 .cena__pin{top:calc(100% - 490px + var(--fila)*135px);font-size:11px;line-height:1.25;min-width:0;max-width:26%;width:26%;padding:9px 5px;gap:4px;flex-direction:column;border-radius:11px}
 .cena__pin>svg{width:19px;height:22px}
 .capa__dica{font-size:11px;bottom:24px}
}
@media(prefers-reduced-motion:reduce){.capa .cena__ligacoes .cena__fluxo{animation:none;stroke-dasharray:none;opacity:.45}.cena__particulas{display:none}.cena__pin{transition:none}}