html {
  scroll-behavior: smooth;
}

/* Alap felúszás */
@keyframes fadeSlideUp {
  0%   { opacity: 0; transform: translate3d(0, 24px, 0); }
  100% { opacity: 1; transform: translate3d(0, 0, 0); }
}

/* Hero balról / jobbról beúszó blokkok */
@keyframes slideInLeft {
  0%   { opacity: 0; transform: translate3d(-40px, 0, 0); }
  100% { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes slideInRight {
  0%   { opacity: 0; transform: translate3d(40px, 0, 0); }
  100% { opacity: 1; transform: translate3d(0, 0, 0); }
}

.animate-on-scroll {
  opacity: 0;
  transform: translate3d(0, 24px, 0);
  transition: opacity 0.4s ease-out, transform 0.4s ease-out;
}

.animate-on-scroll.visible {
  animation: fadeSlideUp 0.7s ease-out forwards;
}

/* Hero speciális animációs osztályok */
.hero-left,
.hero-right {
  opacity: 0;
}

.hero-left.visible {
  animation: slideInLeft 0.8s ease-out forwards;
}

.hero-right.visible {
  animation: slideInRight 0.8s ease-out 0.15s forwards;
}

/* Mobilon inkább alulról felúszás */
@media (max-width: 767px) {
  .hero-left.visible,
  .hero-right.visible {
    animation: fadeSlideUp 0.7s ease-out forwards;
  }
}

 /* Extra: sticky call bar mobilra + finom SOS anim */
    .sos-pulse {
      box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.55);
      animation: sosPulse 1.6s infinite;
    }
    @keyframes sosPulse {
      0% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.45); }
      70% { box-shadow: 0 0 0 14px rgba(239, 68, 68, 0); }
      100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); }
    }
    
     /* Piros pulse (ha még használod) */
  .sos-pulse{
    animation: sosPulse 1.6s infinite !important;
    will-change: box-shadow;
    box-shadow: 0 0 0 0 rgba(239,68,68,.55);
  }
  @keyframes sosPulse{
    0%{box-shadow:0 0 0 0 rgba(239,68,68,.45)}
    70%{box-shadow:0 0 0 14px rgba(239,68,68,0)}
    100%{box-shadow:0 0 0 0 rgba(239,68,68,0)}
  }

  /* Zöld pulse */
  .lime-pulse{
    animation: limePulse 1.6s infinite !important;
    will-change: box-shadow;
    box-shadow: 0 0 0 0 rgba(163,230,53,.55); /* lime-400 */
  }
  @keyframes limePulse{
    0%{box-shadow:0 0 0 0 rgba(163,230,53,.45)}
    70%{box-shadow:0 0 0 14px rgba(163,230,53,0)}
    100%{box-shadow:0 0 0 0 rgba(163,230,53,0)}
  }

  /* Ha valahol a CSS-ed kikapcsolja mobilon az animációt, ez visszakapcsolja */
  @media (max-width: 768px){
    .sos-pulse{ animation: sosPulse 1.6s infinite !important; }
    .lime-pulse{ animation: limePulse 1.6s infinite !important; }
  }