/* H5 FX – Elementor UI Effects */
:root{
  --h5fx-accent:#8e2dff;
  --h5fx-accent-2:#bb7dff;
  --h5fx-dark:#111320;
  --h5fx-light:#ffffff;
  --h5fx-shadow:0 12px 28px rgba(0,0,0,.18);
  --h5fx-shadow-strong:0 18px 40px rgba(0,0,0,.24);
}
[class*="fx-"]{
  transition: transform .32s ease, box-shadow .32s ease, filter .32s ease, opacity .32s ease, background-position .45s ease, border-color .28s ease, color .28s ease;
}
.h5fx-surface,
.h5fx-demo-btn,
.h5fx-icon-box,
.h5fx-image-wrap,
.h5fx-comp-card{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.h5fx-image-wrap img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .4s ease, filter .4s ease, opacity .35s ease;
}
.h5fx-demo-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:none;
  border-radius:16px;
  padding:14px 22px;
  min-width:160px;
  background:linear-gradient(135deg,var(--h5fx-accent),#5f17ff);
  color:#fff;
  font-weight:700;
  cursor:pointer;
  box-shadow: var(--h5fx-shadow);
}
.h5fx-demo-btn span{position:relative;z-index:2;}
.h5fx-surface{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:120px;
  border-radius:18px;
  background:linear-gradient(135deg,#7b22ff,#b54dff);
  color:#fff;
  font-weight:700;
  box-shadow:var(--h5fx-shadow);
}
.h5fx-icon-box{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:120px;
  border-radius:18px;
  background:radial-gradient(circle at 20% 20%, rgba(255,255,255,.15), transparent 35%), linear-gradient(135deg,#1a1d2a,#2a2342);
  color:#fff;
  box-shadow:var(--h5fx-shadow);
}
.h5fx-demo-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:72px;
  height:72px;
  border-radius:20px;
  background:linear-gradient(135deg,var(--h5fx-accent),#c95eff);
  font-size:34px;
  box-shadow:0 12px 26px rgba(142,45,255,.32);
  transition:inherit;
}
.h5fx-text-box{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:120px;
  border-radius:18px;
  background:linear-gradient(135deg,#15182a,#23263c);
  color:#fff;
  box-shadow:var(--h5fx-shadow);
  padding:16px;
  text-align:center;
}
.h5fx-text-box span{
  font-size:28px;
  font-weight:800;
  position:relative;
  display:inline-block;
}
.h5fx-comp-card{
  min-height:160px;
  border-radius:20px;
  background:linear-gradient(135deg,#1a1f31,#232841);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:var(--h5fx-shadow);
}
.h5fx-comp-media{
  height:72px;
  background:linear-gradient(135deg,#8e2dff,#cf66ff);
}
.h5fx-comp-body{padding:16px; display:grid; gap:10px;}
.h5fx-comp-title{color:#fff; font-size:18px;}
.h5fx-comp-text{color:rgba(255,255,255,.8);}
.h5fx-comp-btn{
  display:inline-flex; align-items:center; justify-content:center;
  width:fit-content; padding:10px 14px; border-radius:12px;
  background:#8e2dff; color:#fff; font-weight:700;
}
@keyframes h5fx-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes h5fx-pulse{0%{box-shadow:0 0 0 0 rgba(142,45,255,.55)}70%{box-shadow:0 0 0 14px rgba(142,45,255,0)}100%{box-shadow:0 0 0 0 rgba(142,45,255,0)}}
@keyframes h5fx-grad{0%{background-position:0 50%}50%{background-position:100% 50%}100%{background-position:0 50%}}
@keyframes h5fx-shine{100%{left:125%}}
@keyframes h5fx-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes h5fx-wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(8deg)}50%{transform:rotate(-8deg)}75%{transform:rotate(5deg)}}
@keyframes h5fx-spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes h5fx-ring{0%,100%{transform:rotate(0)}10%,30%,50%,70%{transform:rotate(10deg)}20%,40%,60%{transform:rotate(-10deg)}80%{transform:rotate(6deg)}90%{transform:rotate(-6deg)}}
@keyframes h5fx-flash{0%,100%{opacity:1}50%{opacity:.55}}
@keyframes h5fx-bgslide{0%{background-position:0 0}100%{background-position:100% 0}}

/* Containers */
.fx-lift-soft:hover{transform:translateY(-4px)}
.fx-lift-medium:hover{transform:translateY(-8px)}
.fx-lift-strong:hover{transform:translateY(-12px)}
.fx-scale-soft:hover{transform:scale(1.03)}
.fx-scale-medium:hover{transform:scale(1.05)}
.fx-shadow-soft:hover{box-shadow:0 16px 36px rgba(0,0,0,.22)}
.fx-shadow-strong:hover{box-shadow:0 22px 48px rgba(0,0,0,.28)}
.fx-glow-soft:hover{box-shadow:0 0 0 1px rgba(142,45,255,.2), 0 0 22px rgba(142,45,255,.25)}
.fx-glow-strong:hover{box-shadow:0 0 0 1px rgba(142,45,255,.3), 0 0 34px rgba(142,45,255,.45)}
.fx-border-highlight:hover{border-color:rgba(255,255,255,.6)!important}
.fx-border-accent:hover{border-color:var(--h5fx-accent)!important}
.fx-gradient-shift{background-size:200% 200%}
.fx-gradient-shift:hover{background-position:100% 50%}
.fx-gradient-flow{background-size:220% 220%; animation:h5fx-grad 6s ease infinite}
.fx-glass-soft{backdrop-filter:blur(8px); background:rgba(255,255,255,.1)}
.fx-glass-strong{backdrop-filter:blur(14px); background:rgba(255,255,255,.15)}
.fx-tilt-soft:hover{transform:perspective(900px) rotateX(5deg) rotateY(-5deg) translateY(-4px)}
.fx-tilt-strong:hover{transform:perspective(900px) rotateX(8deg) rotateY(-8deg) translateY(-6px)}
.fx-float-slow{animation:h5fx-float 3.6s ease-in-out infinite}
.fx-pulse-soft{animation:h5fx-pulse 2.4s infinite}
.fx-pulse-ring::after{
  content:""; position:absolute; inset:0; border-radius:inherit; border:2px solid rgba(255,255,255,.4);
  animation:h5fx-pulse 2s infinite;
}
.fx-blur-in:hover{filter:blur(1.2px)}
.fx-backdrop-glow::before{
  content:""; position:absolute; inset:-30%; background:radial-gradient(circle, rgba(142,45,255,.38), transparent 60%);
  opacity:0; transition:opacity .35s ease; z-index:-1;
}
.fx-backdrop-glow:hover::before{opacity:1}
.fx-reveal-up:hover{transform:translateY(-10px); opacity:.98}
.fx-reveal-fade:hover{opacity:.82}
.fx-outline-glow:hover{outline:1px solid rgba(142,45,255,.35); box-shadow:0 0 30px rgba(142,45,255,.28)}
.fx-inner-shadow:hover{box-shadow:inset 0 0 0 1px rgba(255,255,255,.12), inset 0 -18px 40px rgba(0,0,0,.2)}
.fx-soft-rotate:hover{transform:rotate(-1deg) translateY(-4px)}

/* Buttons */
.fx-btn-lift:hover{transform:translateY(-4px)}
.fx-btn-press:active,.fx-btn-press:hover{transform:translateY(1px) scale(.98)}
.fx-btn-glow:hover{box-shadow:0 0 0 1px rgba(255,255,255,.2),0 0 26px rgba(142,45,255,.48)}
.fx-btn-shine::before,
.fx-btn-skew-shine::before{
  content:""; position:absolute; top:0; left:-80%; width:45%; height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-24deg); z-index:1;
}
.fx-btn-shine:hover::before,
.fx-btn-skew-shine:hover::before{animation:h5fx-shine .85s ease}
.fx-btn-fill-left::before,
.fx-btn-fill-right::before,
.fx-btn-fill-up::before,
.fx-btn-fill-down::before,
.fx-btn-glow-fill::before,
.fx-btn-slide-bg::before{
  content:""; position:absolute; inset:0; background:linear-gradient(135deg,#c95eff,#611fff); z-index:0; transition:transform .35s ease;
}
.fx-btn-fill-left::before{transform:scaleX(0); transform-origin:left center}
.fx-btn-fill-left:hover::before{transform:scaleX(1)}
.fx-btn-fill-right::before{transform:scaleX(0); transform-origin:right center}
.fx-btn-fill-right:hover::before{transform:scaleX(1)}
.fx-btn-fill-up::before{transform:scaleY(0); transform-origin:center bottom}
.fx-btn-fill-up:hover::before{transform:scaleY(1)}
.fx-btn-fill-down::before{transform:scaleY(0); transform-origin:center top}
.fx-btn-fill-down:hover::before{transform:scaleY(1)}
.fx-btn-border-sweep{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18), var(--h5fx-shadow);
}
.fx-btn-border-sweep::after{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px;
  background:linear-gradient(90deg,transparent,#fff,transparent); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; opacity:0; transition:opacity .35s ease;
}
.fx-btn-border-sweep:hover::after{opacity:1}
.fx-btn-pulse{animation:h5fx-pulse 1.9s infinite}
.fx-btn-pulse-soft{animation:h5fx-pulse 2.8s infinite}
.fx-btn-icon-slide:hover span{transform:translateX(6px); display:inline-block}
.fx-btn-arrow-nudge:hover{letter-spacing:.02em}
.fx-btn-neon{
  background:#14061f;
  border:1px solid rgba(201,94,255,.45);
  box-shadow:0 0 0 1px rgba(201,94,255,.2), 0 0 18px rgba(201,94,255,.22), inset 0 0 18px rgba(201,94,255,.08);
}
.fx-btn-neon:hover{box-shadow:0 0 0 1px rgba(201,94,255,.35), 0 0 34px rgba(201,94,255,.46), inset 0 0 24px rgba(201,94,255,.12)}
.fx-btn-glass{
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(10px);
}
.fx-btn-glow-fill::before{transform:scaleX(0); transform-origin:left center; filter:blur(8px)}
.fx-btn-glow-fill:hover::before{transform:scaleX(1)}
.fx-btn-ripple::after{
  content:""; position:absolute; width:20px; height:20px; border-radius:50%; inset:50% auto auto 50%;
  background:rgba(255,255,255,.32); transform:translate(-50%,-50%) scale(0); transition:transform .45s ease, opacity .45s ease; opacity:.8;
}
.fx-btn-ripple:hover::after{transform:translate(-50%,-50%) scale(9); opacity:0}
.fx-btn-border-invert{
  background:transparent;
  color:#fff;
  border:2px solid rgba(255,255,255,.42);
}
.fx-btn-border-invert:hover{
  background:#fff;
  color:#5210d8;
  border-color:#fff;
}
.fx-btn-slide-bg{
  background:linear-gradient(90deg,#7c28ff 0%, #ab4dff 50%, #7c28ff 100%);
  background-size:200% 100%;
}
.fx-btn-slide-bg:hover{background-position:100% 0}
.fx-btn-flash:hover{animation:h5fx-flash .55s linear 1}

/* Images */
.fx-img-zoom-soft:hover img{transform:scale(1.05)}
.fx-img-zoom-medium:hover img{transform:scale(1.12)}
.fx-img-gray-color img{filter:grayscale(1)}
.fx-img-gray-color:hover img{filter:grayscale(0)}
.fx-img-blur-sharp img{filter:blur(2px)}
.fx-img-blur-sharp:hover img{filter:blur(0)}
.fx-img-shine::before{
  content:""; position:absolute; top:0; left:-80%; width:45%; height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
  transform:skewX(-20deg); z-index:2;
}
.fx-img-shine:hover::before{animation:h5fx-shine .85s ease}
.fx-img-darken:hover img{filter:brightness(.72)}
.fx-img-brighten:hover img{filter:brightness(1.12)}
.fx-img-rotate-soft:hover img{transform:scale(1.04) rotate(1.5deg)}
.fx-img-tilt:hover{transform:perspective(900px) rotateX(4deg) rotateY(-5deg)}
.fx-img-float{animation:h5fx-float 3.6s ease-in-out infinite}
.fx-img-saturate:hover img{filter:saturate(1.4)}
.fx-img-overlay-reveal::after{
  content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent,rgba(17,19,32,.55));
  opacity:0; transition:opacity .35s ease;
}
.fx-img-overlay-reveal:hover::after{opacity:1}
.fx-img-sepia:hover img{filter:sepia(.82)}
.fx-img-contrast:hover img{filter:contrast(1.18)}

/* Icons */
.fx-icon-pop:hover .h5fx-demo-icon{transform:scale(1.12)}
.fx-icon-bounce:hover .h5fx-demo-icon{animation:h5fx-bounce .55s ease}
.fx-icon-rotate:hover .h5fx-demo-icon{transform:rotate(18deg)}
.fx-icon-spin:hover .h5fx-demo-icon{animation:h5fx-spin .7s linear}
.fx-icon-wiggle:hover .h5fx-demo-icon{animation:h5fx-wiggle .6s ease}
.fx-icon-float .h5fx-demo-icon{animation:h5fx-float 3.2s ease-in-out infinite}
.fx-icon-pulse .h5fx-demo-icon{animation:h5fx-pulse 2s infinite}
.fx-icon-ring:hover .h5fx-demo-icon{animation:h5fx-ring .8s ease}
.fx-icon-glow:hover .h5fx-demo-icon{box-shadow:0 0 28px rgba(201,94,255,.46)}
.fx-icon-lift:hover .h5fx-demo-icon{transform:translateY(-6px)}
.fx-icon-flash:hover .h5fx-demo-icon{animation:h5fx-flash .45s linear}
.fx-icon-rotate-back:hover .h5fx-demo-icon{transform:rotate(-18deg)}

/* Text */
.fx-text-gradient{
  background:linear-gradient(135deg,#fff,#c58bff,#8e2dff);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.fx-text-glow{text-shadow:0 0 20px rgba(142,45,255,.38)}
.fx-text-underline::after,
.fx-text-slide-underline::after{
  content:""; position:absolute; left:0; right:0; bottom:-6px; height:3px; border-radius:999px; background:linear-gradient(90deg,#8e2dff,#d17dff);
}
.fx-text-underline::after{transform:scaleX(.35); transform-origin:left center; transition:transform .32s ease}
.fx-text-underline:hover::after{transform:scaleX(1)}
.fx-text-sweep::before,
.fx-text-highlight::before{
  content:""; position:absolute; left:-4px; right:-4px; top:58%; height:.6em; z-index:-1; border-radius:10px; background:linear-gradient(90deg, rgba(142,45,255,.25), rgba(209,125,255,.45));
  transition:transform .35s ease, opacity .35s ease;
}
.fx-text-sweep::before{transform:scaleX(0); transform-origin:left center}
.fx-text-sweep:hover::before{transform:scaleX(1)}
.fx-text-float{animation:h5fx-float 3.2s ease-in-out infinite}
.fx-text-reveal{overflow:hidden}
.fx-text-reveal::after{
  content:""; position:absolute; inset:0; background:#23263c; transform:translateX(0); transition:transform .45s ease;
}
.fx-text-reveal:hover::after{transform:translateX(100%)}
.fx-text-blur-reveal{filter:blur(2px)}
.fx-text-blur-reveal:hover{filter:blur(0)}
.fx-text-stroke-fill{
  color:transparent;
  -webkit-text-stroke:1px #f1e4ff;
  background:linear-gradient(135deg,#fff,#bb7dff);
  -webkit-background-clip:text;
  background-clip:text;
  background-size:0% 100%;
  background-repeat:no-repeat;
}
.fx-text-stroke-fill:hover{background-size:100% 100%}
.fx-text-gradient-move{
  background:linear-gradient(90deg,#fff,#c58bff,#8e2dff,#fff);
  background-size:220% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:h5fx-bgslide 4s linear infinite alternate;
}
.fx-text-highlight::before{transform:scaleX(1)}
.fx-text-neon{color:#fff; text-shadow:0 0 8px rgba(255,255,255,.2),0 0 18px rgba(201,94,255,.56),0 0 36px rgba(142,45,255,.4)}
.fx-text-slide-underline::after{left:auto; width:0; transition:width .32s ease}
.fx-text-slide-underline:hover::after{left:0; right:auto; width:100%}

/* Composite */
.fx-card-interactive:hover,
.fx-card-service:hover,
.fx-card-product:hover,
.fx-card-team:hover,
.fx-card-testimonial:hover,
.fx-cta-box:hover,
.fx-cta-band:hover,
.fx-media-card-zoom:hover,
.fx-feature-box:hover,
.fx-pricing-highlight:hover,
.fx-hero-glass-panel:hover,
.fx-offer-card:hover{
  transform:translateY(-8px);
  box-shadow:var(--h5fx-shadow-strong);
}
.fx-card-interactive:hover .h5fx-comp-media{transform:scale(1.03)}
.fx-card-interactive:hover .h5fx-comp-btn{transform:translateY(-2px)}
.fx-card-service:hover{border-color:rgba(142,45,255,.45)}
.fx-card-service:hover .h5fx-comp-title{color:#f3e5ff}
.fx-card-product:hover .h5fx-comp-media{transform:scale(1.05)}
.fx-card-product:hover .h5fx-comp-btn{box-shadow:0 0 22px rgba(142,45,255,.36)}
.fx-card-team:hover{background:linear-gradient(135deg,#1a2035,#2d2450)}
.fx-card-testimonial:hover{box-shadow:0 18px 42px rgba(0,0,0,.28), 0 0 0 1px rgba(255,255,255,.08)}
.fx-cta-box{background:linear-gradient(135deg,#23183b,#141824)}
.fx-cta-box:hover::before,
.fx-cta-band::before,
.fx-hero-glass-panel::before,
.fx-offer-card::before{
  content:""; position:absolute; inset:0; background:linear-gradient(135deg, rgba(142,45,255,.16), rgba(201,94,255,.06)); z-index:-1;
}
.fx-cta-band{background-size:200% 200%; animation:h5fx-grad 5s ease infinite}
.fx-media-card-zoom:hover .h5fx-comp-media{transform:scale(1.08)}
.fx-feature-box:hover .h5fx-comp-title{transform:translateX(4px)}
.fx-pricing-highlight{box-shadow:0 0 0 1px rgba(255,255,255,.08), var(--h5fx-shadow)}
.fx-pricing-highlight:hover{box-shadow:0 0 0 1px rgba(201,94,255,.22), 0 24px 46px rgba(0,0,0,.28)}
.fx-hero-glass-panel{backdrop-filter:blur(10px); background:rgba(255,255,255,.06)}
.fx-offer-card:hover .h5fx-comp-btn{background:#c95eff}