/* A v3 mantém a estrutura. As interações trabalham sobre superfícies internas. */
body:before{content:"";position:fixed;top:0;left:0;width:100%;height:2px;z-index:60;background:var(--red);transform-origin:left;transform:scaleX(var(--read-progress,0));pointer-events:none}
.opening{padding-block:68px 54px}
.opening h1{position:relative}
.opening-aside .text-link{border-color:var(--wine)}
.wordmark-dot{display:inline-block;transform-origin:center;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.wordmark:hover .wordmark-dot{transform:translateY(-7px) rotate(-15deg)}
.site-header .nav-contact{position:relative;border-left:0;padding:10px 16px;margin-left:0;border:1px solid #593042;border-radius:50px;background:#2c122021;isolation:isolate}
.nav-contact:before{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--wine);z-index:-1;transform:scaleX(0);transform-origin:right;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.nav-contact:hover:before,.nav-contact:focus-visible:before{transform:scaleX(1);transform-origin:left}
.site-header nav .nav-contact:hover{color:#fff}
.nav-contact span{display:inline-block;font-family:Arial,'DejaVu Sans',sans-serif;transform:translate(var(--mag-x,0px),var(--mag-y,0px));transition:color .3s}
.nav-contact:hover span{color:#fff}
.motion-flow{width:min(1440px,100%);height:108px;margin:0 auto 12px;overflow:hidden;position:relative;mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent)}
.flow-plane{display:block;width:100%;height:100%;transform:translate3d(var(--layer-x),var(--py),0);pointer-events:none}
.flow-plane path{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round}
.flow-guide{stroke:#665574;stroke-width:1;opacity:.42}
.flow-echo{stroke:#65576e;stroke-width:1;opacity:.16;transform:translateY(13px)}
.flow-trail{stroke-dasharray:100 900;stroke-dashoffset:-350;animation:flow-travel 12s linear infinite;animation-delay:-4.2s}
.flow-glow{stroke:var(--lemon);stroke-width:9;opacity:.24;filter:blur(5px)}
.flow-core{stroke:var(--lemon);stroke-width:1.7}
.work-divider{border-top:0}
@keyframes flow-travel{from{stroke-dashoffset:0}to{stroke-dashoffset:-1000}}
[data-reactive]{--rx:0deg;--ry:0deg;--px:0px;--py:0px;--layer-x:0px;--layer-y:0px;--pointer-x:50%;--pointer-y:50%}
.featured-visual{isolation:isolate;perspective:1100px;min-height:530px;background:#152238}
.featured-visual .loop-hero{position:relative;z-index:2;transform:rotateX(var(--rx)) rotateY(var(--ry)) translate3d(var(--px),var(--py),18px);box-shadow:0 24px 65px #03081150;border:1px solid #e4eaf0;animation:stage-breathe 7s ease-in-out infinite}
@keyframes stage-breathe{0%,100%{translate:0 4px}50%{translate:0 -5px}}
.stage-orbit{position:absolute;pointer-events:none;border:1px solid #60708b4f;border-radius:50%;z-index:0;width:90%;height:54%;left:5%;top:23%;transform:translate3d(var(--layer-x),var(--layer-y),0) rotate(-26deg)}
.orbit-two{width:83%;height:40%;left:8%;top:30%;border-color:#a14e6d55;transform:translate3d(calc(0px - var(--layer-x)),calc(0px - var(--layer-y)),0) rotate(29deg)}
.stage-dot{position:absolute;left:11%;top:29%;height:14px;width:14px;background:#ad3856;border-radius:50%;transform:translate3d(var(--layer-x),var(--layer-y),0);z-index:1}
.featured-visual .visual-link>span{font-family:Arial,'DejaVu Sans',sans-serif;transition:transform .3s;color:#d18c9e}
.featured-visual.is-hovering .visual-link>span{transform:translate(4px,-4px)}
.work-art{perspective:1100px;isolation:isolate}
.art-plane{transform-origin:center;transform:rotateX(var(--rx)) rotateY(var(--ry)) scale(1.015);transition:scale .4s;transform-style:preserve-3d}
.work-art.is-hovering .art-plane{scale:1.025}
.work-art .rev-cover{gap:24px}
.work-art .rev-cover img{transition:none}
.work-art .rev-cover img:first-child{transform:translate3d(var(--layer-x),calc(var(--layer-y) - 20px),25px) rotate(-3deg)}
.work-art .rev-cover img:nth-child(2){transform:translate3d(calc(0px - var(--layer-x)),calc(20px - var(--layer-y)),40px) rotate(3deg)}
.work-art .uni-cover img{transition:none}
.work-art .uni-cover img:first-child{transform:translate3d(calc(0px - var(--layer-x)),calc(20px - var(--layer-y)),20px)}
.work-art .uni-cover img:nth-child(2){transform:translate3d(var(--px),var(--py),35px)}
.work-art .uni-cover img:nth-child(3){transform:translate3d(var(--layer-x),calc(var(--layer-y) - 20px),50px)}
.art-arrow{font-family:Arial,'DejaVu Sans',sans-serif;z-index:2;transition:opacity .2s}

.work-art:focus-visible .art-arrow{opacity:1}
.contact-link{position:relative}
.contact-link:after{content:"";position:absolute;left:0;bottom:-1px;width:100%;height:2px;background:var(--red);transform:scaleX(0);transform-origin:right;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.contact-link:hover:after,.contact-link:focus-visible:after{transform:scaleX(1);transform-origin:left}
.contact-link .contact-arrow{font-family:Arial,'DejaVu Sans',sans-serif;transform:translate(var(--mag-x,0px),var(--mag-y,0px));transition:color .3s}
.contact-link:hover .contact-arrow{transform:translate(var(--mag-x,4px),var(--mag-y,-4px));color:#f3c6d1}
.loop-toggle{font-size:0}
.loop-toggle>span{display:block;width:7px;height:9px;border-left:2px solid currentColor;border-right:2px solid currentColor;box-sizing:border-box}
.loop-toggle[aria-pressed=true]>span{width:0;height:0;border-right:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid currentColor;margin-left:2px}
.font-source-sample{position:relative;width:min(300px,100%);aspect-ratio:300/160;overflow:hidden;margin-block:24px 18px;background:#071324}
.font-source-sample img{position:absolute;left:0;top:0;width:100%;height:auto;transform:translateY(-69%)}
.font-pair-roles{display:flex;gap:32px;flex-wrap:wrap;margin-bottom:22px;font-size:11px;color:var(--muted)}
.font-pair-roles strong{display:block;font-size:14px;font-weight:500;margin-bottom:5px;color:var(--text)}
.tab-hidden .flow-trail,.tab-hidden .loop-hero{animation-play-state:paused}
.motion-paused .work-art.is-hovering .art-arrow{opacity:1}
@media(max-width:1100px){.featured-visual{min-height:460px}}
@media(max-width:720px){
 .opening{padding-block:38px 30px}
 .site-header nav .nav-contact{padding:8px 10px;font-size:11px}
 .motion-flow{height:78px;margin-bottom:8px}
 .featured-visual{min-height:0;padding:24px 18px}
 .stage-orbit{width:96%;left:2%;height:60%;top:20%}
 .orbit-two{height:45%;top:28%}
 .stage-dot{left:4%;width:10px;height:10px}
 .featured-visual .loop-hero{width:min(100%,320px)}
 .art-plane{transform:none;scale:1}
 .work-art .rev-cover img:first-child{transform:translateY(-20px)}
 .work-art .rev-cover img:nth-child(2){transform:translateY(20px)}
 .work-art .uni-cover img:first-child{transform:translateY(20px)}
 .work-art .uni-cover img:nth-child(2){transform:none}
 .work-art .uni-cover img:nth-child(3){transform:translateY(-20px)}
 .kit-label{flex-wrap:wrap;gap:8px 16px}
 .kit-label>span{font-size:11px}
}
@media(max-width:370px){.site-header nav{gap:12px}.site-header nav .nav-contact{padding-inline:9px}}
@media(prefers-reduced-motion:reduce){
 .flow-trail,.featured-visual .loop-hero{animation:none}
 .flow-plane{transform:none}
 .art-plane,.featured-visual .loop-hero{transform:none;scale:1}
 .work-art.is-hovering .art-arrow{opacity:1}
}

.motion-paused .wordmark:hover .wordmark-dot{transform:none}
@media(prefers-reduced-motion:reduce){.wordmark:hover .wordmark-dot{transform:none}}
