/* ============ KEYFRAMES ============ */

@keyframes beamdot{0%{left:0;opacity:0}8%{opacity:1}92%{opacity:1}100%{left:100%;opacity:0}}
@keyframes pagein{from{opacity:0;transform:translateY(18px);filter:blur(4px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes drift{from{transform:translate(0,0) scale(1)}to{transform:translate(50px,40px) scale(1.12)}}
@keyframes pulse{50%{opacity:.35}}
@keyframes wordup{to{transform:none}}
@keyframes sweep{0%{left:0;opacity:1}95%{opacity:1}100%{left:100%;opacity:0}}
@keyframes fillin{to{clip-path:inset(0 0 0 0)}}
@keyframes floaty{0%,100%{margin-top:0}50%{margin-top:-20px}}

@keyframes cue{from{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}to{transform:scaleY(0);transform-origin:bottom}}
@keyframes mq{to{transform:translateX(-50%)}}
@keyframes pop{40%{transform:scale(1.4)}}
@keyframes spinc{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes fluttua{0%,100%{margin-top:0}50%{margin-top:-16px}}
@keyframes respiro{0%,100%{filter:drop-shadow(0 0 22px rgba(59,125,224,.45)) drop-shadow(0 0 70px rgba(59,125,224,.22)) drop-shadow(0 30px 50px rgba(0,0,0,.6))}
50%{filter:drop-shadow(0 0 40px rgba(59,125,224,.75)) drop-shadow(0 0 120px rgba(59,125,224,.4)) drop-shadow(0 30px 50px rgba(0,0,0,.6))}}
@keyframes sweepfx{0%,62%{transform:rotate(-14deg) translateX(-120vw);opacity:0}66%{opacity:.6}78%{opacity:.6}84%,100%{transform:rotate(-14deg) translateX(120vw);opacity:0}}
@keyframes lload{0%{transform:translateX(-100%)}100%{transform:translateX(450%)}}
@keyframes faqin{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* Failsafe: se il JS non parte, il loader si dissolve da solo dopo 5s */
.loader{animation:loaderfailsafe .8s ease 5s forwards}
@keyframes loaderfailsafe{to{opacity:0;visibility:hidden}}

/* Uscita morbida di pagina (l'ingresso usa già "pagein" in layout.css) */
.page.leaving{animation:pageout .18s ease forwards;pointer-events:none}
@keyframes pageout{to{opacity:0;transform:translateY(-14px) scale(.98);filter:blur(3px)}}
@media (prefers-reduced-motion: reduce){ .page.leaving{animation:none} }

/* ===== EFFETTI PREMIUM ===== */

/* Shimmer — scorrimento luminoso su superfici (bottoni, card hover) */
@keyframes shimmer{
  0%{background-position:-200% center}
  100%{background-position:200% center}
}
.shimmer-fx{
  background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.18) 50%,transparent 100%);
  background-size:200% auto;
  animation:shimmer 2.4s linear infinite;
}

/* Glow pulse — bagliore brand pulsante */
@keyframes glowPulse{
  0%,100%{box-shadow:0 0 0 0 transparent,0 0 20px rgba(245,217,78,.0)}
  50%{box-shadow:0 0 0 4px rgba(245,217,78,.08),0 0 40px rgba(245,217,78,.18)}
}

/* Scan line — effetto laser che scansiona */
@keyframes scanLine{
  0%{transform:translateY(-100%);opacity:0}
  10%{opacity:.7}
  90%{opacity:.7}
  100%{transform:translateY(100vh);opacity:0}
}

/* Float 3D — levitazione con leggera prospettiva */
@keyframes float3d{
  0%,100%{transform:translateY(0) rotateX(0deg) rotateY(0deg)}
  33%{transform:translateY(-12px) rotateX(2deg) rotateY(-2deg)}
  66%{transform:translateY(-6px) rotateX(-1deg) rotateY(2deg)}
}

/* Reveal slide-up con fade (usato da .reveal) */
@keyframes revealUp{
  from{opacity:0;transform:translateY(32px)}
  to{opacity:1;transform:none}
}

/* Border run — bordo animato che gira attorno a un elemento */
@keyframes borderRun{
  0%{background-position:0% 0%}
  25%{background-position:100% 0%}
  50%{background-position:100% 100%}
  75%{background-position:0% 100%}
  100%{background-position:0% 0%}
}

/* Laser trace — striscia luminosa diagonale (hero accent) */
@keyframes laserTrace{
  0%{transform:rotate(-14deg) translateX(-120vw);opacity:0}
  8%{opacity:.55}
  80%{opacity:.55}
  100%{transform:rotate(-14deg) translateX(120vw);opacity:0}
}

/* Scale in — pop di ingresso per modal/toast */
@keyframes scaleIn{
  from{opacity:0;transform:scale(.92)}
  to{opacity:1;transform:scale(1)}
}

/* Hero text gradient animate */
@keyframes gradShift{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}

/* bg-picker entrance */
@keyframes pickerIn{
  from{opacity:0;transform:translateY(12px) scale(.97)}
  to{opacity:1;transform:none}
}

/* ===== ENTERPRISE ANIMATIONS ===== */

/* Fade + blur reveal (Framer-style) */
@keyframes fadeBlurIn{
  from{opacity:0;transform:translateY(24px);filter:blur(10px)}
  to{opacity:1;transform:none;filter:blur(0)}
}

/* Ticker card scroll (GPU-accelerated via translateX) */
@keyframes tickerScroll{to{transform:translateX(-50%)}}
@keyframes tickerScrollRev{to{transform:translateX(50%)}}

/* Card glow entrance */
@keyframes cardGlow{
  0%{opacity:0;transform:scale(.95) translateY(16px)}
  100%{opacity:1;transform:scale(1) translateY(0)}
}

/* Light sweep across cards */
@keyframes lightSweep{
  0%{left:-60%}
  100%{left:120%}
}

/* Stagger system — reveals with blur */
.reveal-blur{
  opacity:0;
  filter:blur(8px);
  transform:translateY(20px);
  transition:opacity .75s cubic-bezier(.22,.8,.4,1),transform .75s cubic-bezier(.22,.8,.4,1),filter .75s cubic-bezier(.22,.8,.4,1)
}
.reveal-blur.in{opacity:1;transform:none;filter:blur(0)}

/* Stagger delays */
.stagger-1{transition-delay:.08s}
.stagger-2{transition-delay:.16s}
.stagger-3{transition-delay:.24s}
.stagger-4{transition-delay:.32s}
.stagger-5{transition-delay:.40s}
.stagger-6{transition-delay:.48s}

@media (prefers-reduced-motion: reduce){
  .reveal-blur{opacity:1;transform:none;filter:blur(0);transition:none}
}