/* Beast FX styles — effects attach by class to ordinary page-builder widgets. */

/* generic reveal ---------------------------------------------------- */
.beast-reveal{opacity:0;transform:translate3d(0,34px,0);transition:opacity .9s cubic-bezier(.22,.61,.36,1),transform .9s cubic-bezier(.22,.61,.36,1)}
.beast-reveal.beast-in{opacity:1;transform:none}

/* 1. split text ------------------------------------------------------ */
.beast-split .beast-piece{display:inline-block;opacity:0;transform:translate3d(0,.5em,0) rotate(2deg);
 transition:opacity .8s cubic-bezier(.22,.61,.36,1),transform .8s cubic-bezier(.22,.61,.36,1)}
.beast-split.beast-in .beast-piece{opacity:1;transform:none}

/* 2. parallax layers -------------------------------------------------- */
.beast-parallax{will-change:transform}

/* 3. aurora / gradient mesh ------------------------------------------- */
.beast-aurora{position:relative;isolation:isolate;overflow:hidden}
.beast-aurora::before,.beast-aurora::after{content:"";position:absolute;z-index:-1;border-radius:50%;
 filter:blur(70px);opacity:.55;pointer-events:none}
.beast-aurora::before{width:52vw;height:52vw;left:-12vw;top:-18vw;
 background:radial-gradient(circle,var(--beast-aurora-1,rgba(201,167,57,.55)),transparent 62%);
 animation:beastAuroraA 18s ease-in-out infinite alternate}
.beast-aurora::after{width:46vw;height:46vw;right:-14vw;bottom:-20vw;
 background:radial-gradient(circle,var(--beast-aurora-2,rgba(120,90,255,.38)),transparent 62%);
 animation:beastAuroraB 22s ease-in-out infinite alternate}
@keyframes beastAuroraA{to{transform:translate3d(12vw,8vh,0) scale(1.18)}}
@keyframes beastAuroraB{to{transform:translate3d(-10vw,-6vh,0) scale(1.12)}}

/* 4. page-entry curtain ------------------------------------------------ */
.beast-curtain{position:fixed;inset:0;z-index:99999;background:var(--beast-curtain-bg,#0B0B0B);
 display:flex;align-items:center;justify-content:center;transition:transform 1s cubic-bezier(.76,0,.24,1)}
.beast-curtain-up{transform:translateY(-101%)}
.beast-curtain-logo{max-width:200px;opacity:.9;animation:beastPulse 1.6s ease-in-out infinite}
@keyframes beastPulse{50%{opacity:.45}}

/* 5. sticky stacked cards ---------------------------------------------- */
.beast-stack{display:flex;flex-direction:column;gap:26px}
.beast-stack-item{position:sticky;border-radius:22px;overflow:hidden;
 box-shadow:0 24px 60px rgba(10,10,10,.18);transition:box-shadow .4s}
.beast-stack-off .beast-stack-item{position:static}

/* 6. horizontal scroll -------------------------------------------------- */
.beast-hscroll-on{overflow:hidden}
.beast-hscroll-on .beast-hscroll-track{display:flex;gap:24px;flex-wrap:nowrap!important;will-change:transform}
.beast-hscroll-on .beast-hscroll-track>*{flex:0 0 auto}
.beast-hscroll-native .beast-hscroll-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;
 -webkit-overflow-scrolling:touch;padding-bottom:8px}
.beast-hscroll-native .beast-hscroll-track>*{flex:0 0 82%;scroll-snap-align:center}

/* 7. before / after scrub ------------------------------------------------ */
.beast-ba{position:relative;overflow:hidden;border-radius:20px}
.beast-ba .beast-ba-after{position:absolute;inset:0;clip-path:inset(0 0 0 100%);will-change:clip-path}
.beast-ba .beast-ba-after img{width:100%;height:100%;object-fit:cover}
.beast-ba::after{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;
 background:rgba(255,255,255,.35);pointer-events:none;opacity:.6}

/* 8. count-up ------------------------------------------------------------ */
.beast-count{--beast-grad-1:#8a6d1f;--beast-grad-2:#C9A739;--beast-grad-3:#e6cf7a}
.beast-count,.beast-count *{background:linear-gradient(115deg,var(--beast-grad-1),var(--beast-grad-2) 55%,var(--beast-grad-3));
 -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* 9. tilt ---------------------------------------------------------------- */
.beast-tilt{transition:transform .35s cubic-bezier(.22,.61,.36,1);transform-style:preserve-3d;will-change:transform}

/* 10. magnetic ------------------------------------------------------------ */
.beast-magnetic a,.beast-magnetic button,.beast-magnetic .elementor-button{transition:transform .35s cubic-bezier(.22,.61,.36,1)}

/* 11. cursor spotlight ---------------------------------------------------- */
.beast-spotlight{position:relative;isolation:isolate}
.beast-spotlight::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;
 transition:opacity .4s;background:radial-gradient(320px circle at var(--bx,50%) var(--by,50%),
 var(--beast-spot,rgba(201,167,57,.20)),transparent 65%)}
.beast-spotlight.beast-spot-on::before{opacity:1}
.beast-spotlight>*{position:relative;z-index:1}

/* 12. mask reveals --------------------------------------------------------- */
.beast-mask{overflow:hidden}
.beast-mask img{transform:scale(1.12);transition:transform 1.4s cubic-bezier(.22,.61,.36,1)}
.beast-mask.beast-in img{transform:scale(1)}
.beast-mask[data-mask="curtain"]{clip-path:inset(0 0 100% 0);transition:clip-path 1.2s cubic-bezier(.76,0,.24,1)}
.beast-mask[data-mask="curtain"].beast-in{clip-path:inset(0 0 0 0)}
.beast-mask[data-mask="circle"]{clip-path:circle(0% at 50% 50%);transition:clip-path 1.3s cubic-bezier(.76,0,.24,1)}
.beast-mask[data-mask="circle"].beast-in{clip-path:circle(75% at 50% 50%)}
.beast-mask[data-mask="wipe"]{clip-path:inset(0 100% 0 0);transition:clip-path 1.1s cubic-bezier(.76,0,.24,1)}
.beast-mask[data-mask="wipe"].beast-in{clip-path:inset(0 0 0 0)}

/* hover polish helpers ------------------------------------------------------ */
.beast-lift{transition:transform .5s cubic-bezier(.22,.61,.36,1),box-shadow .5s}
.beast-lift:hover{transform:translateY(-10px);box-shadow:0 26px 54px rgba(17,17,17,.18)}
.beast-zoom img{transition:transform .8s cubic-bezier(.22,.61,.36,1)}
.beast-zoom:hover img{transform:scale(1.06)}

/* safety: never leave content invisible ------------------------------------- */
html:not(.beast-fx-ready) .beast-reveal,
html:not(.beast-fx-ready) .beast-split .beast-piece,
html:not(.beast-fx-ready) .beast-mask{opacity:1!important;transform:none!important;clip-path:none!important}
@media (prefers-reduced-motion:reduce){
 .beast-reveal,.beast-split .beast-piece,.beast-mask,.beast-mask img,.beast-tilt,.beast-lift,.beast-zoom img{
  opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important;animation:none!important}
 .beast-aurora::before,.beast-aurora::after{animation:none}
 .beast-stack-item{position:static}
}
@media (max-width:767px){
 .beast-stack-item{position:static}
 .beast-aurora::before,.beast-aurora::after{filter:blur(50px);opacity:.4}
}