/* PETO EDITS V5 — OFICINA CINEMATOGRÁFICA EM CSS 3D
   Sem bibliotecas externas: GPU, braços robóticos, montagem do logotipo e controles.
   A imagem aprovada é usada como textura para as peças das letras: sem trocar a marca. */
.hero-visual{isolation:isolate; perspective:1200px; transform-style:preserve-3d}
.hero-visual .studio-stage{z-index:0;opacity:.84;filter:contrast(1.12) saturate(1.15)}
.hero-visual .logo-scene{z-index:10;will-change:transform; transform-style:preserve-3d}
.assembly-workshop{position:absolute;inset:0 -12px 13px;pointer-events:none;z-index:3;perspective:950px;transform-style:preserve-3d;overflow:hidden;border-radius:22px}
.assembly-workshop:before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,transparent 44%,#03000a90 93%),radial-gradient(ellipse at 60% 52%,#642cc533,transparent 50%);pointer-events:none}
.assembly-surface{position:absolute;bottom:0;left:5%;width:90%;height:24%;background:repeating-linear-gradient(90deg,transparent 0 39px,#b990ff1c 40px 41px),linear-gradient(155deg,#3b244455,#0b0713);border-top:2px solid #c784ff88;transform:perspective(450px) rotateX(66deg);box-shadow:0 0 26px #7f27ea77}
.circuit-rails{position:absolute;inset:9% 5%}.circuit-rails i{display:block;position:absolute;border:1px solid #a35ce563;border-top:0;border-left:0;filter:drop-shadow(0 0 4px #aa42ff);width:47%;height:24%;right:2%;top:3%;transform:skew(16deg)}.circuit-rails i:nth-child(2){left:6%;top:49%;transform:rotate(180deg) skew(16deg);border-color:#ffcc5066}.circuit-rails i:nth-child(3){right:19%;top:70%;width:33%;height:12%;border-color:#ab49ff88}
.cpu-machine{position:absolute;width:26%;height:48%;right:2%;top:21%;transform:rotateY(-21deg) rotateX(3deg) translateZ(-25px);transform-style:preserve-3d;filter:drop-shadow(-15px 19px 17px #000c);animation:machineDeploy 2s cubic-bezier(.17,.7,.12,1) both}
.machine-face{position:absolute;inset:0;border:2px solid #9f7cc0;border-radius:8px;background:linear-gradient(110deg,#4a3068e9,#160d2a 45%,#2e1b43db);box-shadow:inset 0 0 22px #08020b,0 0 26px #aa46ff6b;overflow:hidden}
.machine-side{position:absolute;right:-17%;top:3%;width:20%;height:96%;background:linear-gradient(90deg,#402c55,#0a0713);border:2px solid #80569e;transform:rotateY(90deg) translateX(50%);transform-origin:left}
.machine-top{position:absolute;left:4%;top:-14%;width:94%;height:19%;background:linear-gradient(#54406c,#1c1027);border:2px solid #b48add;transform:rotateX(88deg);transform-origin:bottom}
.machine-screws{position:absolute;inset:5px}.machine-screws i{position:absolute;width:5px;height:5px;border-radius:50%;background:#d4a9ff}.machine-screws i:nth-child(1){left:0;top:0}.machine-screws i:nth-child(2){right:0;top:0}.machine-screws i:nth-child(3){bottom:0;left:0}.machine-screws i:nth-child(4){bottom:0;right:0}
.machine-vents{position:absolute;left:7%;top:9%;height:49%;width:42%;display:flex;flex-direction:column;justify-content:space-evenly;gap:3px}.machine-vents span{display:block;height:9%;background:linear-gradient(90deg,#0b0718,#bb6dff,#0c0814);border-radius:2px;box-shadow:0 0 8px #ac52fc5c}
.machine-processor{position:absolute;left:9%;bottom:26%;width:43%;aspect-ratio:1;border:5px ridge #9373b4;background:repeating-linear-gradient(90deg,#2d1c42 0px,#2d1c42 5px,#51346e 6px);box-shadow:0 0 20px #9e50fe66;display:grid;place-items:center}.cpu-core{font:900 clamp(8px,1.4vw,15px) Oxanium,sans-serif;color:#ffce49;letter-spacing:1px;text-shadow:0 0 7px #ffdd49}
.machine-fans{position:absolute;right:6%;top:8%;width:44%;height:81%;display:flex;flex-direction:column;justify-content:space-evenly}.turbine{aspect-ratio:1;width:100%;border:5px ridge #9b7bbe;border-radius:50%;background:radial-gradient(circle,#150d2a 0 13%,transparent 15%),repeating-conic-gradient(from 13deg,#cc8fff 0deg 29deg,#1c0f33 29deg 60deg);animation:mechFan .55s linear infinite;box-shadow:inset 0 0 9px #000,0 0 18px #a43cf6}.turbine:nth-child(2){animation-direction:reverse}.turbine i{display:block;width:26%;height:26%;background:#ffe055;border:2px solid #f7ad15;border-radius:50%;position:absolute;left:37%;top:37%;box-shadow:0 0 12px #ffe557}
.machine-chip{position:absolute;left:5%;bottom:4%;font:600 clamp(5px,.7vw,9px) Chakra Petch,sans-serif;letter-spacing:1px;color:#ceb3f1}
.gpu-crate{position:absolute;left:8%;bottom:20%;width:29%;height:12%;border:3px ridge #b06bf0;background:linear-gradient(#62456a,#21162b 40%,#150b22);box-shadow:0 0 27px #ad38ff9c,0 11px 20px #000;transform:perspective(600px) rotateY(20deg) rotateX(18deg) translateZ(25px);animation:gpuDock 3.8s cubic-bezier(.17,.77,.18,1) both;display:flex;align-items:center;justify-content:center}
.gpu-crate span{font:900 clamp(12px,2.3vw,25px) Oxanium,sans-serif;color:#fbd757;letter-spacing:3px;filter:drop-shadow(0 0 7px #ffcf48)}.gpu-pcb{position:absolute;width:70%;height:5px;bottom:-8px;background:repeating-linear-gradient(90deg,#eabb4d 0 8px,transparent 8px 13px)}.gpu-pins{position:absolute;inset:3px;border:1px dashed #b571ff}
.workshop-arm{position:absolute;z-index:4;width:37%;height:49%;top:4%;filter:drop-shadow(0 7px 9px #000c);transform:translateZ(35px)}.workshop-arm.arm-left{left:-9%}.workshop-arm.arm-right{right:-13%;transform:scaleX(-1) translateZ(35px);top:-3%}
.arm-foundation{position:absolute;left:4%;top:2%;width:27%;height:17%;background:linear-gradient(130deg,#795698,#221334);border:2px ridge #b37ad4;border-radius:8px;box-shadow:0 0 13px #942df677}
.arm-shoulder{position:absolute;left:17%;top:9%;width:19px;height:60%;border:3px ridge #ae79e1;border-radius:8px;background:linear-gradient(90deg,#1d1026,#6a4780,#230e32);transform-origin:50% 4%;animation:shoulderMove 7.8s ease-in-out both;box-shadow:0 0 17px #9a46fe}.arm-shoulder:before,.arm-elbow:before{content:"";position:absolute;width:32px;height:32px;border:6px double #d2a9f7;background:radial-gradient(circle,#ffd34f 0 32%,#522c70 38%);border-radius:50%;top:-15px;left:-11px;box-shadow:0 0 12px #e0a43f9f}
.arm-elbow{position:absolute;top:85%;left:0;width:17px;height:70%;border:3px ridge #cd91ff;background:linear-gradient(90deg,#130b26,#8b57aa,#251035);border-radius:7px;transform-origin:50% 5%;animation:elbowMove 7.8s ease-in-out both}
.arm-forearm{position:absolute;top:78%;left:-3px;width:19px;height:30px;background:linear-gradient(#b577df,#4a2862);border:2px solid #ffe380;border-radius:4px}
.arm-claw{position:absolute;bottom:-15px;left:-10px;width:31px;height:21px;border-left:5px solid #ffdd55;border-right:5px solid #ffdd55;border-bottom:2px solid #ffdd55;border-radius:2px 2px 10px 10px}
.arm-light{position:absolute;bottom:-13px;left:5px;width:7px;height:12px;border-radius:50%;background:#ffd12a;box-shadow:0 0 14px 7px #ffb72a8f;animation:welder 2.4s linear infinite}
.welder-beam{position:absolute;left:29%;top:32%;height:2px;width:45%;transform:rotate(-14deg);background:linear-gradient(90deg,transparent,#ffe490,#ffd447,transparent);filter:drop-shadow(0 0 8px #ffeb8a);opacity:0;animation:beamWeld 8s linear both}
.assembly-sparks{position:absolute;inset:0;overflow:hidden}.assembly-sparks .spark{position:absolute;width:3px;height:9px;background:linear-gradient(#fff9d8,#ffbf0b,transparent);left:var(--x);top:var(--y);border-radius:20px;opacity:0;box-shadow:0 0 7px #ffcb55;animation:sparkDrop var(--dur) var(--delay) ease-out both;transform:rotate(var(--r))}
.workshop-indicator{position:absolute;left:1.5%;bottom:4%;width:75%;min-height:31px;display:flex;align-items:center;gap:8px;background:#14081fbf;border:1px solid #ffdb4657;border-radius:7px;box-shadow:0 0 14px #5b1d8859;padding:5px 10px;color:#ffda5b;font:700 clamp(8px,1vw,11px) Chakra Petch,sans-serif;letter-spacing:1px}.indicator-point{width:6px;height:6px;flex-shrink:0;background:#ffdd54;border-radius:50%;box-shadow:0 0 8px #ffd448;animation:indicatorBlink 1s step-end infinite}.indicator-number{margin-left:auto;color:#bea5d3}
/* Recorte de fragmentos da imagem 3D real aprovada: os pedaços voam, encaixam e formam o nome. */
.logo-scene.js-assembly .logo-main,.logo-scene.js-assembly .logo-crown{display:none}
.logo-scene .logo-piece{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;backface-visibility:hidden;will-change:transform,opacity;transform-origin:center;animation:logoFragment var(--speed,1.25s) var(--delay,1s) cubic-bezier(.16,.77,.22,1.02) both;filter:drop-shadow(0 0 9px #5e18dd4d)}
.logo-scene .logo-built-crown{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;clip-path:inset(0 0 57% 0);transform-origin:50% 43%;opacity:0;animation:crownMachined 1.5s 4.55s cubic-bezier(.19,.91,.23,1.06) both;filter:drop-shadow(0 0 9px #ffca4299)}
.logo-scene .logo-flash{position:absolute;inset:32% 2% 0;border-radius:50%;background:radial-gradient(circle,#fff7c449,#ce69ff11,transparent 55%);opacity:0;animation:brandFlash 7.8s both;mix-blend-mode:screen}
.cinematic-controls{position:absolute;z-index:15;display:flex;gap:9px;right:2%;bottom:0;pointer-events:auto}.cinematic-controls button{border:1px solid #c6a3ed85;background:#160921db;color:#ffe282;font:700 10px Chakra Petch,sans-serif;letter-spacing:.7px;min-height:33px;border-radius:7px;padding:6px 10px;backdrop-filter:blur(8px);transition:background .2s}.cinematic-controls button:hover{background:#40205b}.cinematic-controls button:focus-visible{outline:3px solid #ffda4a;outline-offset:3px}.cinematic-controls button span{font-size:15px;margin-right:4px}
.hero-visual.is-paused .assembly-workshop *, .hero-visual.is-paused .logo-scene *, .hero-visual.is-paused .studio-stage *, .hero-visual.is-paused .logo-scene{animation-play-state:paused!important}
@keyframes mechFan{to{transform:rotate(360deg)}}
@keyframes gpuDock{0%{opacity:0;transform:translate3d(-180%,100px,120px) rotateY(65deg) rotateX(45deg)}35%{opacity:1}70%,100%{opacity:1;transform:translate3d(0,0,25px) rotateY(20deg) rotateX(18deg)}}
@keyframes machineDeploy{from{opacity:0;transform:translate3d(140%,50px,-100px) rotateY(-70deg) rotateX(12deg)}to{opacity:1;transform:rotateY(-21deg) rotateX(3deg) translateZ(-25px)}}
@keyframes shoulderMove{0%{transform:rotate(-38deg)}24%{transform:rotate(5deg)}48%{transform:rotate(-27deg)}69%{transform:rotate(11deg)}100%{transform:rotate(-18deg)}}
@keyframes elbowMove{0%{transform:rotate(65deg)}24%{transform:rotate(20deg)}48%{transform:rotate(-22deg)}69%{transform:rotate(30deg)}100%{transform:rotate(40deg)}}
@keyframes beamWeld{0%,18%,44%,75%,100%{opacity:0}22%,38%,55%,69%{opacity:.86}}
@keyframes welder{0%,20%,80%,100%{opacity:.2}25%,65%{opacity:1}}
@keyframes logoFragment{0%{opacity:0;transform:translate3d(var(--dx),var(--dy),-180px) rotateY(var(--ry)) rotateZ(var(--rz)) scale(.68);filter:blur(6px)}50%{opacity:1;filter:blur(1px)}84%{transform:translate3d(0,6px,0) rotateY(0) rotateZ(0) scale(1.01);filter:blur(0)}100%{opacity:1;transform:translate3d(0,0,0) rotateY(0) rotateZ(0) scale(1);filter:blur(0)}}
@keyframes crownMachined{0%{opacity:0;transform:translate3d(0,-160px,-110px) rotateX(-60deg) scale(.5)}55%{opacity:1}82%{transform:translate3d(0,9px,0) rotateX(0) scale(1.04)}100%{opacity:1;transform:none}}
@keyframes sparkDrop{0%,100%{opacity:0;transform:translate3d(0,0,0) rotate(var(--r)) scale(.2)}18%{opacity:1}50%{opacity:.88}95%{opacity:0;transform:translate3d(var(--vx),var(--vy),0) rotate(var(--r)) scale(.8)}}
@keyframes indicatorBlink{50%{opacity:.25}}
@keyframes brandFlash{0%,66%,83%,100%{opacity:0}73%{opacity:.85}}
@media(max-width:1100px){.workshop-arm.arm-left{left:-13%}.workshop-arm.arm-right{right:-15%}.cpu-machine{right:0;width:28%}}
@media(max-width:760px){.assembly-workshop{inset:0 -3px 10px}.cpu-machine{width:30%;top:14%;height:59%;right:0}.workshop-arm{width:32%;height:42%;top:0}.workshop-arm.arm-right{right:-16%}.gpu-crate{left:6%;bottom:19%;width:34%}.workshop-indicator{left:4%;bottom:5%;width:70%}.logo-scene{top:51%}.cinematic-controls{right:3%;bottom:0}}
@media(max-width:540px){.assembly-workshop{inset:0}.workshop-arm{height:52%;width:37%;top:1%}.workshop-arm.arm-left{left:-18%}.workshop-arm.arm-right{right:-23%}.arm-shoulder{width:12px;border-width:2px}.arm-elbow{width:12px;border-width:2px}.arm-forearm{width:13px}.cpu-machine{width:33%;height:55%;top:16%;right:-3%}.turbine{border-width:3px}.gpu-crate{width:38%;bottom:17%;height:10%}.logo-scene{top:47%;width:111%}.workshop-indicator{left:3%;bottom:8%;max-width:55%;letter-spacing:0;font-size:8px}.indicator-number{display:none}.hero-caption{bottom:40px}.cinematic-controls{right:0;bottom:4px}.cinematic-controls button{padding:5px;font-size:8px;min-height:30px}.cinematic-controls button span{margin-right:2px}.hero-visual{height:385px}}
@media(prefers-reduced-motion:reduce){.logo-scene .logo-piece,.logo-scene .logo-built-crown,.cpu-machine,.gpu-crate,.workshop-arm *,.turbine,.assembly-sparks .spark{animation:none!important;opacity:1!important;transform:none!important}.assembly-sparks{display:none}.welder-beam{display:none}.logo-scene .logo-built-crown{opacity:1!important}.cinematic-controls{display:none}}

/* Force CSS animations to restart when the replay button toggles the parent state. */
.hero-visual:not(.is-assembling) .logo-piece,.hero-visual:not(.is-assembling) .logo-built-crown,.hero-visual:not(.is-assembling) .logo-flash{animation:none!important;opacity:0!important}
.hero-visual:not(.is-assembling) .gpu-crate,.hero-visual:not(.is-assembling) .cpu-machine{animation:none!important;opacity:0!important}
@media(prefers-reduced-motion:reduce){.hero-visual:not(.is-assembling) .logo-piece,.hero-visual:not(.is-assembling) .logo-built-crown,.hero-visual:not(.is-assembling) .logo-flash{opacity:1!important}.hero-visual:not(.is-assembling) .cpu-machine,.hero-visual:not(.is-assembling) .gpu-crate{opacity:1!important}}