/* ================================================
   VOZ PREMIUM FX — Global animation layer
   virtual-office-zug.com
   ================================================ */

/* --- Scroll Progress Bar --- */
#voz-progress{
  position:fixed;top:0;left:0;width:0%;height:3px;
  background:linear-gradient(90deg,#2563EB,#4B8FD4,#2563EB);
  background-size:200% 100%;
  z-index:99999;transition:none;
  animation:voz-grad-shift 3s linear infinite;
}
@keyframes voz-grad-shift{
  0%{background-position:0% 50%}
  100%{background-position:200% 50%}
}

/* --- Custom Cursor --- */
#voz-cursor-dot{
  position:fixed;width:6px;height:6px;border-radius:50%;
  background:#2563EB;pointer-events:none;z-index:99998;
  transform:translate(-50%,-50%);transition:transform .1s ease,background .2s ease;
}
#voz-cursor-ring{
  position:fixed;width:36px;height:36px;border-radius:50%;
  border:1.5px solid rgba(37,99,235,.5);pointer-events:none;z-index:99997;
  transform:translate(-50%,-50%);transition:width .2s ease,height .2s ease,border-color .2s ease;
}
body.cursor-hover #voz-cursor-ring{width:52px;height:52px;border-color:rgba(37,99,235,.8);}
body.cursor-hover #voz-cursor-dot{transform:translate(-50%,-50%) scale(1.5);}
@media(hover:none){#voz-cursor-dot,#voz-cursor-ring{display:none;}}

/* --- Scroll Reveal base --- */
.voz-fx-up{opacity:0;transform:translateY(40px);transition:opacity .7s cubic-bezier(.22,.68,0,1.05),transform .7s cubic-bezier(.22,.68,0,1.05);}
.voz-fx-left{opacity:0;transform:translateX(-40px);transition:opacity .7s cubic-bezier(.22,.68,0,1.05),transform .7s cubic-bezier(.22,.68,0,1.05);}
.voz-fx-right{opacity:0;transform:translateX(40px);transition:opacity .7s cubic-bezier(.22,.68,0,1.05),transform .7s cubic-bezier(.22,.68,0,1.05);}
.voz-fx-scale{opacity:0;transform:scale(.94);transition:opacity .65s ease,transform .65s cubic-bezier(.34,1.56,.64,1);}
.voz-fx-blur{opacity:0;filter:blur(12px);transform:translateY(20px);transition:opacity .8s ease,filter .8s ease,transform .8s ease;}
.voz-fx-up.vfx-in,.voz-fx-left.vfx-in,.voz-fx-right.vfx-in,.voz-fx-scale.vfx-in,.voz-fx-blur.vfx-in{
  opacity:1;transform:none;filter:none;
}

/* Stagger delays */
.vfx-d1{transition-delay:.08s}.vfx-d2{transition-delay:.16s}.vfx-d3{transition-delay:.24s}
.vfx-d4{transition-delay:.32s}.vfx-d5{transition-delay:.40s}.vfx-d6{transition-delay:.48s}

/* --- Typewriter --- */
.voz-typewriter{display:inline;}
.voz-typewriter-cursor{
  display:inline-block;width:2px;height:1em;
  background:#2563EB;margin-left:2px;vertical-align:text-bottom;
  animation:voz-blink .75s step-end infinite;
}
@keyframes voz-blink{0%,100%{opacity:1}50%{opacity:0}}

/* --- Word Reveal (split text) --- */
.voz-word-reveal .voz-word{display:inline-block;overflow:hidden;vertical-align:top;line-height:1.15;}
.voz-word-reveal .voz-word-inner{
  display:inline-block;transform:translateY(110%);
  transition:transform .75s cubic-bezier(.22,.68,0,1.2);
}
.voz-word-reveal.vfx-in .voz-word-inner{transform:translateY(0);}

/* --- Number Scramble / Counter --- */
.voz-counter{font-variant-numeric:tabular-nums;}

/* --- Card 3D Tilt --- */
.voz-tilt{transform-style:preserve-3d;will-change:transform;}

/* --- Shimmer on cards --- */
.voz-shimmer{position:relative;overflow:hidden;}
.voz-shimmer::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.07) 50%,transparent 60%);
  background-size:200% 100%;opacity:0;
  transition:opacity .3s ease;
}
.voz-shimmer:hover::after{opacity:1;animation:voz-shimmer-slide .6s ease forwards;}
@keyframes voz-shimmer-slide{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* --- Gradient text --- */
.voz-gradient-text{
  background:linear-gradient(135deg,#2563EB 0%,#4B8FD4 50%,#2563EB 100%);
  background-size:200% auto;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  animation:voz-text-shimmer 4s linear infinite;
}
@keyframes voz-text-shimmer{0%{background-position:0% center}100%{background-position:200% center}}

/* --- Magnetic button glow --- */
.voz-magnetic{transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s ease;will-change:transform;}
.voz-magnetic:hover{box-shadow:0 8px 30px rgba(37,99,235,.35);}

/* --- Number flip animation --- */
@keyframes voz-num-flip{
  0%{transform:rotateX(90deg);opacity:0}
  100%{transform:rotateX(0deg);opacity:1}
}
.voz-num-anim{animation:voz-num-flip .4s ease forwards;}

/* --- Line draw (SVG underline) --- */
.voz-underline-fx{position:relative;display:inline-block;}
.voz-underline-fx::after{
  content:'';position:absolute;bottom:-3px;left:0;width:0;height:2px;
  background:linear-gradient(90deg,#2563EB,#4B8FD4);
  transition:width .6s cubic-bezier(.22,.68,0,1.05);
}
.voz-underline-fx:hover::after,.voz-underline-fx.vfx-in::after{width:100%;}

/* --- Section badge pulse --- */
.voz-badge-pulse{position:relative;}
.voz-badge-pulse::before{
  content:'';position:absolute;inset:-4px;border-radius:inherit;
  background:rgba(37,99,235,.15);
  animation:voz-pulse-ring 2s ease-out infinite;
}
@keyframes voz-pulse-ring{0%{transform:scale(1);opacity:.6}100%{transform:scale(1.5);opacity:0}}

/* --- Image reveal (clip-path) --- */
.voz-img-reveal{
  clip-path:inset(0 100% 0 0);
  transition:clip-path .9s cubic-bezier(.77,0,.18,1);
}
.voz-img-reveal.vfx-in{clip-path:inset(0 0% 0 0);}

/* --- Floating element --- */
.voz-float{animation:voz-floating 4s ease-in-out infinite;}
@keyframes voz-floating{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* --- Noise grain overlay --- */
.voz-grain::before{
  content:'';position:absolute;inset:0;pointer-events:none;z-index:1;
  opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
}

/* --- Smooth page entry --- */
.voz-page-enter{animation:voz-page-in .5s ease forwards;}
@keyframes voz-page-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* --- Hero text char stagger --- */
.voz-char{display:inline-block;opacity:0;transform:translateY(30px);
  transition:opacity .5s ease,transform .5s cubic-bezier(.22,.68,0,1.2);}
.voz-char.vfx-in{opacity:1;transform:translateY(0);}

/* --- Scroll indicator --- */
.voz-scroll-hint{
  display:flex;flex-direction:column;align-items:center;gap:6px;opacity:.6;
  animation:voz-scroll-bob 2s ease-in-out infinite;
}
@keyframes voz-scroll-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

/* --- Stats highlight on scroll --- */
.voz-stat-num{transition:color .3s ease;}
.voz-stat-num.counting{color:#2563EB;}