.landing-page {

    display: flex;
    flex-direction: column;
    padding-top: 5rem;
    background: linear-gradient(to bottom, #05CECE 0%, #FFFFFF 80%);
    color: #fff;
    border-radius: 40px;
    margin: 0 50px;
}

.landing-page h3 {
    font-weight: 400;
    opacity: 0; /* Na začiatku je text neviditeľný */
    transform: scale(0.9); /* Na začiatku je text mierne posunutý dole */
    animation: fadeInText 1.5s ease-out forwards; /* Animácia pre text */
}

.landing-page h1 {
    font-size: 40px;
    text-align: center;
    width: 48%;
    padding: 1rem 0;
    opacity: 0; /* Na začiatku je text neviditeľný */
    transform: scale(0.9); /* Na začiatku je text mierne posunutý dole */
    animation: fadeInText 1.5s ease-out forwards; /* Animácia pre text */
}

@keyframes fadeInText {
    0% {
      opacity: 0;
      transform: scale(0.9); /* Začiatok s posunutím dole */
    }
    100% {
      opacity: 1;
      transform: scale(1); /* Konečná pozícia je na pôvodnom mieste */
    }
  }

.landing-page .knt-btn {
    text-decoration: none;
    background-color: #089C9C;
    color: #fff;
    padding: 15px 30px;
    border-radius: 50px;

    margin-top: 3rem;

    opacity: 0; /* Na začiatku je text neviditeľný */
    transform: scale(0.9); /* Na začiatku je text mierne posunutý dole */
    animation: fadeInText 1.5s ease-out forwards; /* Animácia pre text */
}



.fade-in-image {
    display: block;

    height: auto;
    opacity: 0; /* Na začiatku je obrázok neviditeľný */
    transform: scale(0.9); /* Na začiatku je obrázok mierne zmenšený */
    animation: fadeIn 0.8s ease-out forwards; /* Animácia pre postupné zobrazenie */
  }
  
  @keyframes fadeIn {
    0% {
      opacity: 0;
      transform: scale(0.9); /* Začiatok s menším obrázkom */
    }
    100% {
      opacity: 1;
      transform: scale(1); /* Konečná pozícia s normálnou veľkosťou */
    }
  }

 


@media (max-width: 950px) {
    .landing-page {
        text-align: center;
        background: linear-gradient(to bottom, #05CECE 0%, #FFFFFF 90%);
        margin: 0%;  
      }

    .landing-page h3 {
        font-size: 20px;
        width: 95%;
    }

    .landing-page h1 {
        width: 95%;
        font-size: 35px;
    }

    .landing-page img {
        width: 100%;
    }
}