/* Enquadramento da abertura sem depender da altura do texto. */
#inicio .character-hero{min-height:0;height:calc(100svh - var(--header-height))}
#inicio .jph-copy{top:48%;transform:translateY(-50%);width:52%;max-width:800px}
#inicio .hero-title{max-width:none;font-size:clamp(34px,4.05vw,66px);text-wrap:initial;line-height:1.13}
#inicio .jph-description{margin:24px 0;max-width:390px}
#inicio .actor{width:min(46vw,calc((100svh - var(--header-height) - 28px)*.75));right:6%;bottom:0}
#inicio .hero-caption{top:22%;font-size:8px}
#inicio .hero-footer{bottom:22px}
#inicio .hero-wordmark{font-size:clamp(100px,17vw,260px);bottom:70px;opacity:.55;mask-image:none}
#inicio .hover-instruction{margin-top:16px}
/* Névoa contínua sob o conteúdo e os cubos, sem painéis opacos. */
body{background-color:#070b14;background-image:radial-gradient(ellipse 65% 58% at 72% 45%,rgba(29,77,91,.29),transparent 74%),radial-gradient(ellipse 50% 62% at 10% 85%,rgba(30,62,91,.22),transparent 76%);background-attachment:fixed}
#main>.flow-section:not(#inicio){background-color:transparent;background-image:radial-gradient(ellipse 80% 55% at 60% 50%,rgba(32,83,96,.08),transparent 78%)}
@media(min-width:701px) and (max-height:650px){
 #inicio .hero-title{font-size:clamp(30px,3.6vw,48px)}
 #inicio .hero-kicker{margin-bottom:14px}
 #inicio .jph-description{margin:16px 0;font-size:12px}
 #inicio .hover-instruction{margin-top:10px}
 #inicio .hero-wordmark{font-size:15vw;bottom:55px;opacity:.26}
}
/* Respiração da armadura; a cena lê a posição animada da mão. */
#inicio .actor{animation:jp-breathe 7s ease-in-out infinite}
#inicio .chest-mark{left:61.4%;top:60.8%}
@keyframes jp-breathe{0%,100%{translate:0 0}50%{translate:0 -10px}}
.motion-paused #inicio .actor{animation-play-state:paused}
.tech-aura{position:absolute;inset:-3%;width:106%;height:106%;pointer-events:none;opacity:0;transition:opacity .3s;overflow:visible;filter:drop-shadow(0 0 5px #22d3ee)}
.actor.is-tech .tech-aura{opacity:.85}
.tech-aura .tech-stream{stroke-dasharray:10 22;animation:jp-data-stream 3s linear infinite}
.tech-aura .tech-node{transform-box:fill-box;transform-origin:center;animation:jp-node 2.8s ease-in-out infinite alternate}
@keyframes jp-data-stream{to{stroke-dashoffset:-128}}
@keyframes jp-node{to{opacity:.3;transform:translateY(-10px) rotate(90deg)}}
.motion-paused .tech-aura *{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){#inicio .actor,.tech-aura *{animation:none}}
@media(max-width:1000px) and (min-width:701px){
 #inicio .jph-copy{width:49%}
 #inicio .hero-title{font-size:clamp(30px,3.85vw,39px)}
 #inicio .actor{right:1%;width:min(49vw,calc((100svh - var(--header-height) - 50px)*.75))}
 #inicio .hero-caption{display:none}
}
@media(max-width:700px){
 #inicio .character-hero{min-height:710px;height:calc(100svh - var(--header-height))}
 #inicio .jph-copy{top:28px;transform:none;width:calc(100% - 48px);max-width:none}
 #inicio .hero-title{font-size:clamp(27px,7.8vw,39px)}
 #inicio .hero-kicker{font-size:8px;margin-bottom:15px}
 #inicio .jph-description{font-size:12px;line-height:1.65;margin:16px 0}
 #inicio .actor{width:min(94vw,calc((100svh - var(--header-height) - 260px)*.75));right:0;bottom:12px}
 #inicio .hero-caption{top:auto;bottom:240px;left:24px;right:auto;font-size:7px}
 #inicio .hero-footer{bottom:16px;font-size:7px;gap:14px}
 #inicio .hero-wordmark{font-size:21vw;bottom:100px;opacity:.4}
}
@media(max-width:700px) and (max-height:780px){
 #inicio.hero-scroll{height:auto}
 #inicio .character-hero{position:relative;top:0;height:730px;min-height:0}
 #inicio .actor{width:min(94vw,350px);bottom:12px}
}

#inicio .actor.logo-integrada .chest-mark{display:none}
