/* ===== Dekada FX touch: hero 3D depth + spotlight, project card tilt, cinematic dark-section reveal ===== */
html .hero{--mx:70%;--my:40%}
html .hero::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(38rem 28rem at var(--mx) var(--my),rgba(171,188,59,.13),transparent 65%);opacity:0;transition:opacity .6s}
html .hero.fx-on::after{opacity:1}
html .hero .hero-in{z-index:1}
html .hero-in{perspective:1600px}
html .hgx-home{transform-style:preserve-3d;transform:rotateX(var(--frx,0deg)) rotateY(var(--fry,0deg));transition:transform .9s cubic-bezier(.22,1,.36,1);will-change:transform}
html .hgx-home.fx-live{transition:transform .25s cubic-bezier(.22,1,.36,1)}
html .hgx-home>*{transition:translate .9s cubic-bezier(.22,1,.36,1)}
html .hgx-home .hgx-steps{translate:0 0 calc(55px*var(--fz,0))}
html .hgx-home .hgx-flt1,html .hgx-home .hgx-flt2,html .hgx-home .hgx-flt3{translate:0 0 calc(85px*var(--fz,0))}
html .hgx-home .hgx-live{translate:0 0 calc(110px*var(--fz,0))}
html .hgx-home .hgx-site{box-shadow:0 calc(30px*var(--fz,0)) calc(60px*var(--fz,0)) -20px rgba(0,0,0,.55)}
/* project cards: 3D tilt, glare, inner parallax (values eased every frame in JS, so motion stays smooth) */
html .cs{transform:perspective(1000px) rotateX(var(--crx,0deg)) rotateY(var(--cry,0deg));transform-style:preserve-3d;backface-visibility:hidden}
html .cs .cs-bg{translate:var(--cbx,0px) var(--cby,0px);scale:1.03;transition:transform 1.1s cubic-bezier(.22,1,.36,1);will-change:transform,translate;backface-visibility:hidden}
html .cs:hover .cs-bg{transform:scale(1.04)}
html .cs .fx-glare{position:absolute;inset:-20%;pointer-events:none;z-index:3;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.16) 0%,rgba(255,255,255,.06) 22%,transparent 45%);opacity:0;transition:opacity .8s cubic-bezier(.22,1,.36,1)}
html .cs:hover .fx-glare{opacity:1}
/* cinematic reveal: dark sections open from an inset rounded card to full width */
html section.fx-cine{clip-path:inset(0 calc(var(--k,0)*3.2%) round calc(var(--k,0)*2.6rem));will-change:clip-path}
@media (hover:none),(max-width:900px){html .hgx-home,html .cs{transform:none!important}html .hero::after,html .cs .fx-glare{display:none}html .cs .cs-bg{translate:none}}
@media (prefers-reduced-motion:reduce){html .hgx-home,html .cs{transform:none!important}html section.fx-cine{clip-path:none}html .hero::after{display:none}}
