/* A imagem estática permanece como fallback até as camadas carregarem. */
.hero-scroll{position:relative;background:var(--ink)}
.galvanizing-scene,.scroll-story{display:none}
.hero-scroll.is-animated{height:310svh}
.is-animated .hero-stage{position:sticky;top:0;height:100svh;min-height:480px;overflow:hidden}
.is-animated .hero-image{visibility:hidden}
.is-animated .galvanizing-scene{display:block;position:absolute;inset:0;z-index:-2;overflow:hidden}
.scene-world{position:absolute;left:50%;top:50%;width:max(100%,177.778svh);aspect-ratio:16/9;transform:translate(-50%,-50%)}
.scene-background,.moving-metal,.moving-metal img,.piece-occlusion,.hoist-cables{position:absolute;inset:0;width:100%;height:100%}
.scene-background,.moving-metal img{max-width:none;object-fit:fill}
.piece-occlusion{clip-path:polygon(0 0,100% 0,100% 89%,48% 66%,0 66%)}
.moving-metal{transform:translate3d(0,var(--piece-drop,0%),0);will-change:transform}
.metal-coated{opacity:var(--coated,0)}
.metal-raw{opacity:calc(1 - var(--coated,0))}
.hoist-cables{stroke:#8a9297;stroke-width:2;filter:drop-shadow(1px 0 1px #080f17);opacity:.85}
.zinc-vapor{position:absolute;inset:0;opacity:calc(var(--vapor,0) * .46);pointer-events:none;filter:blur(.8px);transition:opacity 2.4s ease-out}
.is-steaming .zinc-vapor{transition-duration:.45s}
.zinc-vapor img{width:100%;height:100%;max-width:none;object-fit:fill;transform-origin:74% 88%;animation:zinc-mist-rise 7.3s linear -2s infinite}
.zinc-vapor::after{content:"";position:absolute;inset:0;background:url('assets/animacao/vapor.webp') center/100% 100% no-repeat;transform-origin:65% 88%;animation:zinc-mist-drift 10.1s linear -6s infinite}
@keyframes zinc-mist-rise{0%{transform:translate3d(-.5%,2%,0) scale(.98,.48);opacity:0}22%{opacity:.85}65%{opacity:.62}100%{transform:translate3d(1.2%,-9%,0) scale(1.05,.67);opacity:0}}
@keyframes zinc-mist-drift{0%{transform:translate3d(1%,3%,0) scale(1,.5);opacity:0}27%{opacity:.48}68%{opacity:.3}100%{transform:translate3d(-1.5%,-12%,0) scale(1.08,.72);opacity:0}}
.zinc-bubbles{position:absolute;inset:0;opacity:var(--agitation,0);pointer-events:none}
.zinc-bubble{position:absolute;left:var(--x);top:var(--y);width:var(--size);aspect-ratio:3.5;border:1px solid #e8f3fac7;border-radius:50%;box-shadow:0 1px 2px #172b3c90,inset 0 1px 2px #f5faff80;animation:zinc-bubble-pop var(--duration) ease-out var(--delay) infinite}
.zinc-bubble::after{content:"";position:absolute;left:38%;top:-20%;width:20%;height:85%;border-radius:50%;background:linear-gradient(130deg,#e9f1f8b3,#83919b60);animation:zinc-surface-rise var(--duration) ease-out var(--delay) infinite}
@keyframes zinc-bubble-pop{0%{transform:scale(.25);opacity:0}20%{opacity:.85}75%{transform:scale(1.15);opacity:.5}100%{transform:scale(1.65);opacity:0}}
@keyframes zinc-surface-rise{0%,100%{opacity:0;transform:translateY(0)}30%{opacity:.8;transform:translateY(-35%)}65%{opacity:0;transform:translateY(10%)}}
.zinc-ripple{position:absolute;left:58%;top:81%;width:31%;height:5%;border:2px solid #e5efff60;border-radius:50%;filter:blur(3px);opacity:var(--vapor,0);transform:scale(calc(1 + var(--vapor,0) * .2))}
.is-animated .hero-shade{background:linear-gradient(90deg,#091521ec 0%,#091521c9 25%,#09152180 38%,transparent 60%),linear-gradient(0deg,#0a1621df,transparent 25%)}
.is-animated .hero-inner{height:100%;min-height:0;padding-top:45px;padding-bottom:150px;align-items:center}
.is-animated .hero-content{max-width:570px}
.is-animated .hero h1{font-size:clamp(72px,7vw,110px)}
.is-animated .hero-bottom{display:none}
.is-animated .image-note{bottom:140px;right:0;font-size:8px}
.is-animated .scroll-story{display:block;position:absolute;left:50%;bottom:28px;transform:translateX(-50%);z-index:2}
.scroll-story-top{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:23px}
.scroll-instruction{font-size:11px;color:#d5e3ef;letter-spacing:.025em}
.scroll-instruction>span{margin-left:15px;font-size:18px}
.scroll-story-top>a{font-size:10px;color:#b5c6d6;border-bottom:1px solid #8a9cac;padding-bottom:3px}
.process-stages{display:flex;list-style:none;padding:0;margin:0 0 15px;justify-content:space-between;gap:20px}
.process-stages li{color:#8c9ba8;font-size:12px;transition:color .2s}
.process-stages li>span{font-size:10px;letter-spacing:.04em;margin-right:12px}
.process-stages li.is-current{color:#fff}
.process-stages li.is-current>span{color:#9bbbe7}
.scroll-progress{display:block;width:100%;height:2px;appearance:none;border:0;background:#ffffff2e;border-radius:0}
.scroll-progress::-webkit-progress-bar{background:#ffffff2e}
.scroll-progress::-webkit-progress-value{background:#a7c8f1}
.scroll-progress::-moz-progress-bar{background:#a7c8f1}
@media(max-height:720px) and (min-width:851px){.is-animated .hero h1{font-size:70px;margin-bottom:16px}.is-animated .hero .eyebrow{margin-bottom:15px}.is-animated .hero-description{font-size:13px}.is-animated .hero-actions{margin-top:20px}.is-animated .hero-inner{padding-top:25px;padding-bottom:145px}}
@media(max-width:850px){.is-animated .hero-content{max-width:470px}.is-animated .hero h1{font-size:76px}.scene-world{left:42%}.is-animated .hero-shade{background:linear-gradient(90deg,#091521e6,#0915218c 45%,#09152110),linear-gradient(0deg,#0a1621ed,transparent 35%)}}
@media(max-width:600px){
 .hero-scroll.is-animated{height:290svh}
 .is-animated .hero-stage{min-height:600px}
 .is-animated .hero-inner{padding:28px 0 0;align-items:flex-start}
 .hero-scroll .hero-content{width:100%;max-width:none;text-align:center}
 .hero-scroll .hero .eyebrow{justify-content:center}
 .hero-scroll .hero-description{margin-inline:auto}
 .hero-scroll .hero-actions{justify-content:center}
 .is-animated .hero h1{font-size:clamp(44px,12vw,52px);line-height:.95;margin-bottom:14px}
 .is-animated .hero .eyebrow{font-size:8px;margin-bottom:16px}
 .is-animated .hero-description{font-size:11px;line-height:1.65}
 .is-animated .hero-actions{margin-top:17px;flex-direction:row;gap:18px;align-items:center}
 .is-animated .hero-actions .button{padding:11px 13px;font-size:10px;gap:18px}
 .is-animated .hero-actions .text-link{display:none}
 .is-animated .galvanizing-scene{top:30%;bottom:65px}
 .scene-world{width:max(100%,calc((100svh - 30svh - 65px) * 1.77778));left:20%;top:50%}
 .is-animated .hero-shade{background:linear-gradient(180deg,#0a1621 0%,#0a1621 20%,#0a1621ad 36%,#0a162100 52%,#0a162138 73%,#0a1621f5 90%)}
 .is-animated .image-note{bottom:123px;right:0;font-size:7px;padding:2px 5px}
 .is-animated .scroll-story{bottom:22px}
 .scroll-story-top{margin-bottom:18px;gap:12px}
 .scroll-instruction{font-size:9px;max-width:220px;line-height:1.6}
 .scroll-instruction>span{margin-left:5px;font-size:14px}
 .scroll-story-top>a{font-size:8px;white-space:nowrap}
 .process-stages{gap:15px;margin-bottom:12px}
 .process-stages li{font-size:9px;line-height:1.5;max-width:105px}
 .process-stages li>span{display:block;font-size:8px;margin:0 0 3px}
}
@media(prefers-reduced-motion:reduce){.hero-scroll.is-animated{height:auto}.is-animated .hero-stage{position:relative;height:auto}.is-animated .hero-image{visibility:visible}.is-animated .galvanizing-scene,.is-animated .scroll-story{display:none}.is-animated .hero-bottom{display:block}}