:root {
  --h5fx-primary: #0f6fff;
  --h5fx-secondary: #13b8ff;
  --h5fx-accent: #7d57ff;
  --h5fx-dark: #101828;
  --h5fx-text: #1f2937;
  --h5fx-border: rgba(15, 23, 42, 0.10);
  --h5fx-shadow: 0 12px 30px rgba(15, 23, 42, 0.12);
  --h5fx-shadow-strong: 0 18px 38px rgba(15, 23, 42, 0.18);
  --h5fx-radius: 18px;
  --h5fx-transition: all .35s ease;
}

.h5fx-lift-soft, .h5fx-lift-medium, .h5fx-scale-soft, .h5fx-scale-glow, .h5fx-shadow-grow,
.h5fx-border-highlight, .h5fx-border-sweep, .h5fx-glow-soft, .h5fx-gradient-shift, .h5fx-glass,
.h5fx-tilt-soft, .h5fx-tilt-forward, .h5fx-blur-focus, .h5fx-gradient-border,
.h5fx-btn-lift, .h5fx-btn-press, .h5fx-btn-glow, .h5fx-btn-shine, .h5fx-btn-fill-left,
.h5fx-btn-fill-up, .h5fx-btn-icon-move, .h5fx-btn-pulse, .h5fx-btn-pulse-ring, .h5fx-btn-border-invert,
.h5fx-btn-slide-skew, .h5fx-btn-magnetic-soft, .h5fx-btn-neon-outline, .h5fx-btn-arrow-nudge,
.h5fx-img-zoom, .h5fx-img-overlay, .h5fx-img-gray-color, .h5fx-img-lift, .h5fx-img-blur-sharp,
.h5fx-img-saturate, .h5fx-img-rotate-soft, .h5fx-img-shine,
.h5fx-icon-pop, .h5fx-icon-rotate, .h5fx-icon-bounce, .h5fx-icon-float, .h5fx-icon-glow,
.h5fx-icon-wiggle, .h5fx-icon-ring, .h5fx-icon-flip,
.h5fx-text-gradient, .h5fx-text-underline, .h5fx-text-glow, .h5fx-text-highlight, .h5fx-text-raise,
.h5fx-text-gradient-move, .h5fx-text-underline-center, .h5fx-text-stroke-fill,
.h5fx-card-interactive, .h5fx-cta-interactive, .h5fx-card-service-pro, .h5fx-card-product-zoom,
.h5fx-card-team-focus, .h5fx-mini-cta-band {
  transition: var(--h5fx-transition);
}

/* Containers */
.h5fx-lift-soft:hover { transform: translateY(-6px); }
.h5fx-lift-medium:hover { transform: translateY(-10px); box-shadow: var(--h5fx-shadow-strong); }
.h5fx-scale-soft:hover { transform: scale(1.025); }
.h5fx-scale-glow:hover { transform: scale(1.025); box-shadow: 0 0 0 1px rgba(87, 167, 255, .20), 0 0 24px rgba(87, 167, 255, .18); }
.h5fx-shadow-grow:hover { box-shadow: var(--h5fx-shadow-strong); }
.h5fx-border-highlight { border: 1px solid transparent; }
.h5fx-border-highlight:hover { border-color: rgba(15,111,255,.45); box-shadow: 0 0 0 4px rgba(15,111,255,.08); }
.h5fx-border-sweep { position: relative; overflow: hidden; }
.h5fx-border-sweep::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  background: linear-gradient(90deg, rgba(15,111,255,.15), rgba(19,184,255,.6), rgba(125,87,255,.15));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; opacity: 0; transition: var(--h5fx-transition);
}
.h5fx-border-sweep:hover::after { opacity: 1; }
.h5fx-glow-soft:hover { box-shadow: 0 0 0 1px rgba(87, 167, 255, .30), 0 0 24px rgba(87, 167, 255, .26); }
.h5fx-gradient-shift { background-size: 200% 200% !important; }
.h5fx-gradient-shift:hover { background-position: right center !important; transform: translateY(-4px); }
.h5fx-glass {
  background: rgba(255,255,255,.14) !important;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.28);
}
.h5fx-tilt-soft:hover { transform: perspective(1000px) rotateX(2deg) rotateY(-3deg) translateY(-4px); }
.h5fx-tilt-forward:hover { transform: perspective(1000px) rotateX(5deg) translateY(-4px); }
.h5fx-blur-focus { filter: saturate(.9) blur(.4px); }
.h5fx-blur-focus:hover { filter: saturate(1.03) blur(0); box-shadow: var(--h5fx-shadow-strong); }
.h5fx-gradient-border { position: relative; }
.h5fx-gradient-border::before {
  content:""; position:absolute; inset:-1px; border-radius: inherit; padding:1px;
  background: linear-gradient(135deg, rgba(15,111,255,.85), rgba(19,184,255,.55), rgba(125,87,255,.8));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; opacity:.55;
}
.h5fx-gradient-border:hover { transform: translateY(-5px); box-shadow: var(--h5fx-shadow-strong); }

/* Buttons */
.h5fx-btn-lift:hover { transform: translateY(-4px); box-shadow: var(--h5fx-shadow-strong); }
.h5fx-btn-press:active { transform: scale(.97); }
.h5fx-btn-glow:hover { box-shadow: 0 0 24px rgba(15,111,255,.45); }
.h5fx-btn-shine, .h5fx-btn-fill-left, .h5fx-btn-fill-up, .h5fx-btn-slide-skew {
  position: relative; overflow: hidden; isolation: isolate;
}
.h5fx-btn-shine::before, .h5fx-btn-fill-left::before, .h5fx-btn-fill-up::before, .h5fx-btn-slide-skew::before {
  content: ""; position: absolute; inset: 0; z-index: -1; transition: var(--h5fx-transition);
}
.h5fx-btn-shine::after, .h5fx-img-shine::after {
  content: ""; position: absolute; top: 0; left: -120%; width: 60%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.55), transparent);
  transform: skewX(-22deg); transition: all .6s ease;
}
.h5fx-btn-shine:hover::after, .h5fx-img-shine:hover::after { left: 130%; }
.h5fx-btn-fill-left::before { transform: scaleX(0); transform-origin: left; background: rgba(15,111,255,.12); }
.h5fx-btn-fill-left:hover::before { transform: scaleX(1); }
.h5fx-btn-fill-up::before { transform: scaleY(0); transform-origin: bottom; background: rgba(15,111,255,.12); }
.h5fx-btn-fill-up:hover::before { transform: scaleY(1); }
.h5fx-btn-icon-move .h5fx-btn-icon, .h5fx-btn-arrow-nudge .h5fx-btn-icon { display:inline-block; transition: transform .3s ease; }
.h5fx-btn-icon-move:hover .h5fx-btn-icon { transform: translateX(6px); }
.h5fx-btn-pulse { animation: h5fxPulse 2.2s infinite; }
.h5fx-btn-pulse-ring { animation: h5fxPulseRing 2s infinite; }
.h5fx-btn-border-invert:hover { background:#0f6fff !important; color:#fff !important; border-color:#0f6fff !important; box-shadow:0 10px 24px rgba(15,111,255,.22); }
.h5fx-btn-slide-skew::before { left:-130%; right:auto; width:130%; background:rgba(255,255,255,.18); transform: skewX(-26deg); }
.h5fx-btn-slide-skew:hover::before { left:130%; }
.h5fx-btn-magnetic-soft:hover { transform: translateY(-3px) scale(1.02); }
.h5fx-btn-neon-outline { border-color: rgba(125, 200, 255, .4) !important; box-shadow: 0 0 0 1px rgba(125,200,255,.25) inset; }
.h5fx-btn-neon-outline:hover { box-shadow: 0 0 0 1px rgba(125,200,255,.45) inset, 0 0 22px rgba(125,200,255,.32); }
.h5fx-btn-arrow-nudge:hover .h5fx-btn-icon { transform: translateX(10px); }

/* Images */
.h5fx-img-zoom, .h5fx-img-overlay, .h5fx-img-gray-color, .h5fx-img-lift, .h5fx-img-blur-sharp, .h5fx-img-saturate, .h5fx-img-rotate-soft, .h5fx-img-shine {
  position: relative; overflow: hidden;
}
.h5fx-img-zoom:hover .h5fx-demo-image,
.h5fx-img-overlay:hover .h5fx-demo-image,
.h5fx-img-gray-color:hover .h5fx-demo-image,
.h5fx-img-lift:hover .h5fx-demo-image,
.h5fx-img-blur-sharp:hover .h5fx-demo-image,
.h5fx-img-saturate:hover .h5fx-demo-image,
.h5fx-img-rotate-soft:hover .h5fx-demo-image,
.h5fx-img-shine:hover .h5fx-demo-image { transform: scale(1.08); }
.h5fx-img-overlay::after {
  content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(15,23,42,.42), rgba(15,23,42,.06));
  opacity: 0; transition: var(--h5fx-transition);
}
.h5fx-img-overlay:hover::after { opacity: 1; }
.h5fx-img-gray-color .h5fx-demo-image { filter: grayscale(1); }
.h5fx-img-gray-color:hover .h5fx-demo-image { filter: grayscale(0); }
.h5fx-img-lift:hover { transform: translateY(-6px); }
.h5fx-img-blur-sharp .h5fx-demo-image { filter: blur(1.5px); }
.h5fx-img-blur-sharp:hover .h5fx-demo-image { filter: blur(0); }
.h5fx-img-saturate .h5fx-demo-image { filter: saturate(.75) contrast(.95); }
.h5fx-img-saturate:hover .h5fx-demo-image { filter: saturate(1.25) contrast(1.05); }
.h5fx-img-rotate-soft:hover .h5fx-demo-image { transform: scale(1.06) rotate(2deg); }
.h5fx-img-shine::after { z-index: 2; }

/* Icons */
.h5fx-icon-pop:hover { transform: scale(1.14); }
.h5fx-icon-rotate:hover { transform: rotate(12deg) scale(1.08); }
.h5fx-icon-bounce:hover { animation: h5fxBounce .65s ease; }
.h5fx-icon-float { animation: h5fxFloat 2.6s ease-in-out infinite; }
.h5fx-icon-glow:hover { box-shadow: 0 0 24px rgba(15,111,255,.22); }
.h5fx-icon-wiggle:hover { animation: h5fxWiggle .55s ease; }
.h5fx-icon-ring { animation: h5fxRing 2.2s ease-in-out infinite; }
.h5fx-icon-flip:hover { transform: rotateY(180deg); }

/* Text */
.h5fx-text-gradient, .h5fx-text-gradient-move {
  background: linear-gradient(90deg, #0f6fff, #13b8ff, #7d57ff);
  background-clip: text; -webkit-background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
}
.h5fx-text-gradient-move { background-size: 200% auto; animation: h5fxGradientMove 4s linear infinite; }
.h5fx-text-underline, .h5fx-text-underline-center { position: relative; display: inline-block; }
.h5fx-text-underline::after, .h5fx-text-underline-center::after {
  content: ""; position: absolute; bottom: -4px; height: 2px; background: currentColor; transition: var(--h5fx-transition);
}
.h5fx-text-underline::after { left: 0; width: 100%; transform: scaleX(0); transform-origin: left; }
.h5fx-text-underline:hover::after { transform: scaleX(1); }
.h5fx-text-underline-center::after { left: 50%; width: 0; transform: translateX(-50%); }
.h5fx-text-underline-center:hover::after { width: 100%; }
.h5fx-text-glow { text-shadow: 0 0 16px rgba(98, 179, 255, .45); }
.h5fx-text-highlight {
  background-image: linear-gradient(transparent 58%, rgba(19, 184, 255, .25) 58%);
  background-size: 0% 100%; background-repeat: no-repeat; transition: background-size .4s ease;
}
.h5fx-text-highlight:hover { background-size: 100% 100%; }
.h5fx-text-raise:hover { transform: translateY(-2px); display:inline-block; }
.h5fx-text-stroke-fill {
  -webkit-text-stroke: 1px #0f6fff; color: transparent; transition: var(--h5fx-transition);
}
.h5fx-text-stroke-fill:hover { color: #0f6fff; }

/* Compound */
.h5fx-card-icon, .h5fx-card-title, .h5fx-cta-title, .h5fx-cta-button { transition: var(--h5fx-transition); }
.h5fx-card-interactive:hover, .h5fx-card-service-pro:hover, .h5fx-card-team-focus:hover {
  transform: translateY(-8px); box-shadow: var(--h5fx-shadow-strong);
}
.h5fx-card-interactive:hover .h5fx-card-icon,
.h5fx-card-service-pro:hover .h5fx-card-icon,
.h5fx-card-team-focus:hover .h5fx-card-icon { transform: scale(1.12) rotate(8deg); }
.h5fx-card-interactive:hover .h5fx-card-title,
.h5fx-card-service-pro:hover .h5fx-card-title,
.h5fx-card-team-focus:hover .h5fx-card-title { color: var(--h5fx-primary); }
.h5fx-card-service-pro { position: relative; overflow: hidden; }
.h5fx-card-service-pro::before, .h5fx-mini-cta-band::before, .h5fx-cta-interactive::before {
  content:""; position:absolute; inset:0; z-index:0; background: linear-gradient(135deg, rgba(15,111,255,.06), rgba(19,184,255,.14)); opacity:0; transition: var(--h5fx-transition);
}
.h5fx-card-service-pro > *, .h5fx-mini-cta-band > *, .h5fx-cta-interactive > * { position:relative; z-index:1; }
.h5fx-card-service-pro:hover::before, .h5fx-mini-cta-band:hover::before, .h5fx-cta-interactive:hover::before { opacity:1; }
.h5fx-card-product-zoom .h5fx-demo-image, .h5fx-card-product-zoom .h5fx-cta-button { transition: var(--h5fx-transition); }
.h5fx-card-product-zoom:hover { box-shadow: var(--h5fx-shadow-strong); transform: translateY(-8px); }
.h5fx-card-product-zoom:hover .h5fx-demo-image { transform: scale(1.09); }
.h5fx-card-product-zoom:hover .h5fx-card-title { color: var(--h5fx-primary); }
.h5fx-card-product-zoom:hover .h5fx-cta-button, .h5fx-cta-interactive:hover .h5fx-cta-button, .h5fx-mini-cta-band:hover .h5fx-cta-button { transform: translateY(-2px); }
.h5fx-cta-interactive, .h5fx-mini-cta-band { position: relative; overflow: hidden; isolation: isolate; }
.h5fx-cta-interactive:hover, .h5fx-mini-cta-band:hover { transform: translateY(-6px); box-shadow: var(--h5fx-shadow-strong); }
.h5fx-cta-interactive:hover .h5fx-cta-title, .h5fx-mini-cta-band:hover .h5fx-cta-title { color: var(--h5fx-primary); }

@keyframes h5fxPulse {
  0% { box-shadow: 0 0 0 0 rgba(15,111,255,.25); }
  70% { box-shadow: 0 0 0 12px rgba(15,111,255,0); }
  100% { box-shadow: 0 0 0 0 rgba(15,111,255,0); }
}
@keyframes h5fxPulseRing {
  0% { box-shadow: 0 0 0 0 rgba(15,111,255,.22), 0 0 0 0 rgba(15,111,255,.12); }
  70% { box-shadow: 0 0 0 8px rgba(15,111,255,0), 0 0 0 16px rgba(15,111,255,0); }
  100% { box-shadow: 0 0 0 0 rgba(15,111,255,0), 0 0 0 0 rgba(15,111,255,0); }
}
@keyframes h5fxBounce {
  0%, 100% { transform: translateY(0); }
  30% { transform: translateY(-6px); }
  60% { transform: translateY(2px); }
}
@keyframes h5fxFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
@keyframes h5fxWiggle {
  0%,100% { transform: rotate(0); }
  25% { transform: rotate(-7deg); }
  50% { transform: rotate(7deg); }
  75% { transform: rotate(-3deg); }
}
@keyframes h5fxRing {
  0%,100% { transform: rotate(0); }
  5% { transform: rotate(12deg); }
  10% { transform: rotate(-10deg); }
  15% { transform: rotate(8deg); }
  20% { transform: rotate(-6deg); }
  25% { transform: rotate(0); }
}
@keyframes h5fxGradientMove {
  0% { background-position: 0% center; }
  100% { background-position: 200% center; }
}