@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Autour+One&display=swap');

body {
    font-family: 'Poppins', sans-serif;
    /* Menggunakan font Poppins */
}

html {
    scroll-snap-type: y mandatory;
    scroll-behavior: smooth;
}

section {
    scroll-snap-align: start;
}

.font-author-one {
    font-family: 'Autour One', sans-serif;
}

/* Terapkan animasi ke elemen dengan durasi dan pengulangan tak terbatas */
.cloud1 {
    animation: cloud1 10s infinite;
}
.cloud2 {
    animation: cloud2 9s infinite 2s;
}
.cloud3 {
    animation: cloud3 8s infinite 1s;
}
.cloud4 {
    animation: cloud4 5s infinite 3s;
}

@keyframes cloud1 {
    0% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(20px);
    }

    100% {
        transform: translateX(0);
    }
}
@keyframes cloud2 {
    0% {
        transform: translateX(0px);
    }

    50% {
        transform: translateX(28px);
    }

    100% {
        transform: translateX(0px);
    }
}
@keyframes cloud3 {
    0% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(12px);
    }

    100% {
        transform: translateX(0px);
    }
}
@keyframes cloud4 {
    0% {
        transform: translateX(0px);
    }

    50% {
        transform: translateX(15px);
    }

    100% {
        transform: translateX(0);
    }
}