/* === Animasi demo Wabi-Sabi: CSS + JS vanilla (tanpa Three.js) === */
.anim{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform .9s cubic-bezier(.22,.8,.3,1)}
.anim.muncul{opacity:1;transform:translateY(0)}
.anim-lambat{transition-duration:1.3s}
h2::after{width:0!important;transition:width 1.4s ease .25s}
h2.muncul::after{width:120px!important}
.hero-teks>*{opacity:0;transform:translateY(18px);animation:naik 1s cubic-bezier(.22,.8,.3,1) forwards}
.hero-teks>*:nth-child(2){animation-delay:.15s}.hero-teks>*:nth-child(3){animation-delay:.3s}.hero-teks>*:nth-child(4){animation-delay:.45s}.hero-teks>*:nth-child(5){animation-delay:.6s}
@keyframes naik{to{opacity:1;transform:translateY(0)}}
.hero-foto figure{animation:melayang 7s ease-in-out infinite alternate}
.hero-foto figure:nth-child(2){animation-delay:1.2s}.hero-foto figure:nth-child(3){animation-delay:2s}.hero-foto figure:nth-child(4){animation-delay:.6s}
@keyframes melayang{from{transform:translateY(0)}to{transform:translateY(-7px)}}
.kartu-divisi,.orang,.kartu-produk{transition:transform .45s ease,box-shadow .45s ease,opacity .9s ease}
.kartu-divisi:hover,.orang:hover,.kartu-produk:hover{transform:translateY(-5px)}
@media (prefers-reduced-motion:reduce){.anim,.hero-teks>*{opacity:1;transform:none;animation:none;transition:none}.hero-foto figure{animation:none}}