/* spin4bonus animations */
:root{--s4b-a:#9D4EDD;--s4b-a2:#c77dff;--s4b-gold:#ffc53d}
/* scroll progress */
#s4b-progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#7b2cbf,var(--s4b-a2),var(--s4b-gold));z-index:99999;pointer-events:none;box-shadow:0 0 12px #c77dff99}
/* hero particles */
.s4b-hero{position:relative;isolation:isolate}
#s4b-fx{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;opacity:.9}
.s4b-shimmer{background:linear-gradient(100deg,var(--s4b-a) 0%,var(--s4b-a2) 30%,#fff 45%,var(--s4b-a2) 60%,var(--s4b-a) 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:s4bShimmer 4.5s ease-in-out infinite}
@keyframes s4bShimmer{0%{background-position:100% 0}50%{background-position:0 0}100%{background-position:100% 0}}
/* entrance */
.s4b-in{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.s4b-in.s4b-on{opacity:1;transform:none}
.s4b-hero-in{animation:s4bUp .9s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--d,0s)}
@keyframes s4bUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
/* icon boxes */
.elementor-widget-icon-box .elementor-icon{transition:transform .5s cubic-bezier(.3,1.6,.5,1),filter .3s}
.elementor-widget-icon-box .elementor-icon-box-icon{animation:s4bFloat 4s ease-in-out infinite;animation-delay:var(--fd,0s)}
@keyframes s4bFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.elementor-widget-icon-box:hover .elementor-icon{transform:rotateY(180deg) scale(1.12);filter:drop-shadow(0 0 12px var(--s4b-a2))}
/* casino cards */
.s4b-card{transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease!important}
.s4b-card:hover{transform:translateY(-6px);box-shadow:0 18px 50px -12px #9D4EDD88,0 0 0 1px #9D4EDD66 inset;border-color:#9D4EDD!important}
.s4b-card img{transition:transform .5s ease}
.s4b-card:hover .elementor-widget-image img{transform:scale(1.06) rotate(-1deg)}
.s4b-card .e-rating .e-icon{display:inline-block}
.s4b-card.s4b-on .s4b-star{animation:s4bStar .5s cubic-bezier(.3,1.8,.5,1) both;animation-delay:calc(var(--i)*.09s + .3s)}
@keyframes s4bStar{from{transform:scale(0) rotate(-90deg);opacity:0}to{transform:none;opacity:1}}
/* CTA buttons */
.s4b-cta{position:relative;overflow:hidden!important;isolation:isolate;transition:transform .25s ease,box-shadow .25s ease!important;animation:s4bPulse 2.8s ease-in-out infinite}
.s4b-cta::after{content:"";position:absolute;top:-50%;left:-80%;width:45%;height:200%;background:linear-gradient(100deg,transparent,#ffffff8c,transparent);transform:rotate(18deg);animation:s4bShine 3.2s ease-in-out infinite;z-index:1;pointer-events:none}
.s4b-cta:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 10px 30px -6px #c77dffcc}
@keyframes s4bShine{0%,55%{left:-80%}100%{left:140%}}
@keyframes s4bPulse{0%,100%{box-shadow:0 0 0 0 #9D4EDD66}50%{box-shadow:0 0 0 8px #9D4EDD00}}
/* chips (deposit / wagering / spins) */
.s4b-chip{transition:background .3s,border-color .3s,transform .3s}
.s4b-chip:hover{background:#9D4EDD22;border-color:#9D4EDD;transform:translateY(-2px)}
/* headings underline */
.s4b-hl{position:relative;display:inline-block}
.s4b-hl::after{content:"";position:absolute;left:0;bottom:-8px;height:3px;width:100%;background:linear-gradient(90deg,var(--s4b-a),transparent);transform:scaleX(0);transform-origin:0 50%;transition:transform .9s cubic-bezier(.2,.7,.2,1) .2s}
.s4b-on .s4b-hl::after,.s4b-hl.s4b-on::after{transform:scaleX(1)}
/* post cards */
.elementor-post__card{transition:transform .35s ease,box-shadow .35s ease}
.elementor-post__card:hover{transform:translateY(-6px);box-shadow:0 18px 40px -14px #9D4EDDaa}
.elementor-post__thumbnail img{transition:transform .6s ease}
.elementor-post__card:hover .elementor-post__thumbnail img{transform:scale(1.08)}
/* nav links underline */
.elementor-nav-menu a.elementor-item{position:relative}
/* back to top */
#s4b-top{position:fixed;right:18px;bottom:18px;width:46px;height:46px;border-radius:50%;border:1px solid #9D4EDD;background:#24003Dcc;color:#fff;font-size:20px;cursor:pointer;z-index:9998;opacity:0;transform:translateY(20px) scale(.8);transition:.35s;backdrop-filter:blur(6px)}
#s4b-top.s4b-show{opacity:1;transform:none}
#s4b-top:hover{background:#9D4EDD;box-shadow:0 0 20px #c77dff}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.s4b-in{opacity:1!important;transform:none!important}#s4b-fx{display:none}}

/* ===== v2: più dinamico ===== */
@property --s4b-ang{syntax:'<angle>';inherits:false;initial-value:0deg}
/* aurora di sfondo */
#s4b-aurora{position:fixed;inset:-20vmax;z-index:-1;pointer-events:none;filter:blur(60px);opacity:.55}
#s4b-aurora i{position:absolute;border-radius:50%;mix-blend-mode:screen;will-change:transform}
#s4b-aurora i:nth-child(1){width:55vmax;height:55vmax;left:5%;top:0;background:radial-gradient(circle,#7b2cbf 0,transparent 65%);animation:s4bOrb1 18s ease-in-out infinite alternate}
#s4b-aurora i:nth-child(2){width:45vmax;height:45vmax;right:0;top:25%;background:radial-gradient(circle,#c77dff80 0,transparent 65%);animation:s4bOrb2 22s ease-in-out infinite alternate}
#s4b-aurora i:nth-child(3){width:40vmax;height:40vmax;left:30%;bottom:0;background:radial-gradient(circle,#ff4f8b40 0,transparent 65%);animation:s4bOrb3 26s ease-in-out infinite alternate}
@keyframes s4bOrb1{to{transform:translate(25vmax,20vmax) scale(1.2)}}
@keyframes s4bOrb2{to{transform:translate(-30vmax,15vmax) scale(.85)}}
@keyframes s4bOrb3{to{transform:translate(-15vmax,-25vmax) scale(1.25)}}
/* glow che segue il mouse */
#s4b-glow{position:fixed;left:0;top:0;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(circle,#9D4EDD38 0,#9D4EDD10 35%,transparent 65%);mix-blend-mode:screen;transition:opacity .4s;will-change:transform}
/* titolo: lettere che entrano */
.s4b-ch{display:inline-block;opacity:0;transform:translateY(.6em) rotateX(-80deg);transform-origin:50% 100%;animation:s4bCh .7s cubic-bezier(.2,.9,.3,1.3) forwards;animation-delay:calc(var(--c)*28ms + .25s)}
@keyframes s4bCh{to{opacity:1;transform:none}}
.s4b-word{display:inline-block;white-space:nowrap}
/* scritta che ruota */
.s4b-rot{display:inline-block;min-width:7ch;text-align:left;color:#ffc53d;font-weight:700;position:relative}
.s4b-rot b{display:inline-block;font-weight:inherit;animation:s4bRot .5s cubic-bezier(.2,.9,.3,1.2)}
@keyframes s4bRot{from{opacity:0;transform:translateY(80%) rotateX(-90deg);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
.s4b-caret{display:inline-block;width:2px;height:1em;background:#ffc53d;margin-left:3px;vertical-align:-2px;animation:s4bBlink 1s steps(1) infinite}
@keyframes s4bBlink{50%{opacity:0}}
/* ticker */
.s4b-ticker{position:relative;overflow:hidden;margin:34px 0 10px;padding:14px 0;border-block:1px solid #9D4EDD55;background:linear-gradient(90deg,#24003D,#3c096c,#24003D);-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);transform:rotate(-1.2deg)}
.s4b-ticker div{display:flex;gap:46px;width:max-content;animation:s4bTick 28s linear infinite;font:600 17px/1 system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#fff}
.s4b-ticker span{display:inline-flex;align-items:center;gap:46px;white-space:nowrap}
.s4b-ticker em{font-style:normal;color:#ffc53d;font-size:20px}
.s4b-ticker:hover div{animation-play-state:paused}
@keyframes s4bTick{to{transform:translateX(-50%)}}
/* bordo animato rotante sulle schede */
.s4b-card{position:relative}
.s4b-card::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:2px;background:conic-gradient(from var(--s4b-ang),transparent 0 62%,#9D4EDD 72%,#c77dff 80%,#ffc53d 86%,transparent 96%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:s4bAng 5s linear infinite;pointer-events:none;z-index:2;opacity:.85}
.s4b-card:nth-of-type(2n)::before{animation-duration:6.5s;animation-direction:reverse}
@keyframes s4bAng{to{--s4b-ang:360deg}}
.s4b-card.s4b-tilt{transition:transform .12s linear,box-shadow .35s!important;transform-style:preserve-3d}
.s4b-card .s4b-shine{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:1;background:radial-gradient(400px circle at var(--mx,50%) var(--my,50%),#ffffff14,transparent 45%);opacity:0;transition:opacity .3s}
.s4b-card:hover .s4b-shine{opacity:1}
/* entrata schede da destra/sinistra */
.s4b-card.s4b-in{transform:translateX(var(--sx,-60px)) scale(.94) rotate(var(--sr,-1.5deg));opacity:0}
.s4b-card.s4b-in.s4b-on{transform:none;opacity:1}
/* logo casinò: riflesso */
.s4b-card .elementor-widget-image .elementor-widget-container{position:relative;overflow:hidden;border-radius:10px}
.s4b-card .elementor-widget-image .elementor-widget-container::after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(100deg,transparent,#ffffff70,transparent);transform:skewX(-20deg);animation:s4bLogo 5s ease-in-out infinite;animation-delay:var(--ld,0s)}
@keyframes s4bLogo{0%,70%{left:-120%}100%{left:160%}}
/* freccia nel pulsante */
.s4b-cta .s4b-arrow{display:inline-block;margin-left:6px;animation:s4bArrow 1.1s ease-in-out infinite}
@keyframes s4bArrow{50%{transform:translateX(5px)}}
/* monete esplosione */
.s4b-coin{position:fixed;z-index:99999;width:18px;height:18px;border-radius:50%;pointer-events:none;background:radial-gradient(circle at 35% 30%,#fff6c8,#ffc53d 45%,#b47800);box-shadow:0 0 8px #ffc53d}
/* icon box 3D */
.elementor-widget-icon-box{transition:transform .15s linear;transform-style:preserve-3d}
/* numero 4.2 */
.s4b-num{display:inline-block}
@media (hover:none){#s4b-glow{display:none}}
@media (prefers-reduced-motion:reduce){#s4b-aurora,#s4b-glow,.s4b-ticker div{animation:none!important}.s4b-ch{opacity:1!important;transform:none!important}}
html,body{overflow-x:clip}
