.hero-mold-animation{position:absolute;inset:0;width:100%;height:100%;z-index:1;background:#080b0d}
.mold-left{transform-box:fill-box;transform-origin:center;animation:moldLeftCycle 14s cubic-bezier(.65,0,.35,1) infinite}
.mold-right{transform:translateX(0)}
.ejector-pins,.ejector-plate{transform-box:fill-box;transform-origin:left center;animation:ejectPinsCycle 14s cubic-bezier(.65,0,.35,1) infinite}
.mold-part{stroke-dasharray:250;stroke-dashoffset:250;animation:partCycle 14s cubic-bezier(.65,0,.35,1) infinite;transform-origin:1434px 535px}
.melt-feed,.melt-channel{stroke-dasharray:240;stroke-dashoffset:240;animation:meltFlow 14s ease-in-out infinite}.melt-arrow{animation:meltArrow 14s ease-in-out infinite}
.cycle-labels text{fill:#f1f4f5;font:600 18px Inter,sans-serif;letter-spacing:.34em;text-anchor:middle;opacity:0}
.cycle-fill{animation:fillLabel 14s ease infinite}.cycle-cool{animation:coolLabel 14s ease infinite}.cycle-open{animation:openLabel 14s ease infinite}.cycle-eject{animation:ejectLabel 14s ease infinite}.cycle-close{animation:closeLabel 14s ease infinite}
@keyframes moldLeftCycle{0%,29%,85%,100%{transform:translateX(0)}48%,76%{transform:translateX(-250px)}}
@keyframes ejectPinsCycle{0%,56%,76%,100%{transform:translateX(0)}68%,70%{transform:translateX(88px)}}
@keyframes meltFlow{0%,4%{stroke-dashoffset:240;opacity:0}7%{opacity:1}20%{stroke-dashoffset:0;opacity:1}28%{stroke-dashoffset:0;opacity:.25}30%,100%{stroke-dashoffset:240;opacity:0}}
@keyframes meltArrow{0%,5%,29%,100%{opacity:0}9%,20%{opacity:1}}
@keyframes partCycle{0%,6%{opacity:0;stroke-dashoffset:250;transform:translate(0,0) rotate(0)}8%{opacity:1}21%,29%{opacity:1;stroke-dashoffset:0;transform:translate(0,0) rotate(0)}48%,56%{opacity:1;stroke-dashoffset:0;transform:translate(-250px,0) rotate(0)}68%,70%{opacity:1;stroke-dashoffset:0;transform:translate(-162px,0) rotate(0)}79%{opacity:0;stroke-dashoffset:0;transform:translate(-162px,300px) rotate(10deg)}80%,100%{opacity:0;stroke-dashoffset:250;transform:translate(0,0) rotate(0)}}
@keyframes fillLabel{0%,4%,23%,100%{opacity:0}7%,20%{opacity:.8}}
@keyframes coolLabel{0%,20%,31%,100%{opacity:0}23%,28%{opacity:.55}}
@keyframes openLabel{0%,29%,50%,100%{opacity:0}34%,46%{opacity:.55}}
@keyframes ejectLabel{0%,55%,73%,100%{opacity:0}60%,69%{opacity:.8}}
@keyframes closeLabel{0%,82%,98%,100%{opacity:0}87%,95%{opacity:.55}}
.hero .shade{z-index:2;background:linear-gradient(90deg,rgba(5,6,7,.97) 0%,rgba(5,6,7,.82) 34%,rgba(5,6,7,.28) 58%,rgba(5,6,7,.04) 78%),linear-gradient(0deg,rgba(0,0,0,.48),transparent 48%)}
.hero-copy,.hero-index{z-index:3}
@media(max-width:900px){.hero-mold-animation{width:150%;left:-50%}.hero .shade{background:linear-gradient(90deg,rgba(5,6,7,.94) 0%,rgba(5,6,7,.76) 55%,rgba(5,6,7,.2) 100%),linear-gradient(0deg,rgba(0,0,0,.56),transparent 52%)}}
@media(prefers-reduced-motion:reduce){.mold-left,.ejector-pins,.ejector-plate,.mold-part,.melt-feed,.melt-channel,.melt-arrow,.cycle-labels text{animation:none!important}.mold-left{transform:translateX(-250px)}.mold-part{opacity:1;stroke-dashoffset:0;transform:translateX(-250px)}.melt-feed,.melt-channel{opacity:.25;stroke-dashoffset:0}.melt-arrow{opacity:.25}}
