/* Grobitec IT-Service
   a1: Anpassungen zum Einblenden per css - update 2026.04.30
   a1 a: Effekt 1 
   a1 b: Effekt 2
*/


/* -------------------- */
/* a1 b                 */
/* -------------------- */
/* Grundzustand: unsichtbar und leicht nach unten verschoben */
.gt-einblenden-2 {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 1s ease-out, transform 1s ease-out;
  visibility: hidden; /* Verhindert Interaktion, solange unsichtbar */
}
/* Zustand, wenn das Element im Sichtfeld ist */
.gt-einblenden-2.sichtbar {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
}


/* -------------------- */
/* a1 a                 */
/* -------------------- */
.gt-einblenden-1  {
  opacity: 0;
  animation: none;
  animation-fill-mode:forwards;
}

.gt-einblenden-1.sichtbar  {
  animation: textwelle 4s;
  animation-fill-mode:forwards;
  animation-timing-function: ease-in-out;
}

@keyframes textwelle {
  0% {
    transform: scale(0.2);
    opacity: 0.1;
  }  
  80% {
    transform: scale(1.20);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;	
  }
}