style.css

/* @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@200;400;700&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;600;700&display=swap" rel="stylesheet');

/* :root {
    --order: 1;
  } */

body {
    background-color: #1d1a1d;
    color: #ffffff;
    font-family: 'Caveat', sans-serif;
    font-size: 100%;
    padding: 0;
    margin: 0;
}

section {
    display: grid;
    place-items: center;
    align-content: start;
    margin-top: 8rem;
    min-height: 100vh;
}

h1 {
    font-size:4rem;
    font-weight:700;
}

p {
    margin-left: 12rem;
    margin-right: 12rem;
    text-align: center;
    text-transform: capitalize;
    font-size:1.75rem;
    font-weight:400;
}

.hidden {
    opacity: 0;
    filter: blur(5px);
    transform: translateX(-100%);
    transition: all 1.5s;
}

.hidden-delay {
    opacity: 0;
    filter: blur(5px);
    transform: translateX(-100%);
    transition: all 2.5s;
}

@media(prefers-reduced-motion){
    .hidden {
        transition: none;
    }
}

@media (max-width: 700px){
    section {
        margin-top: 12rem;
        min-height: 100vh;
    }

    h1 {
        font-size:2.5rem;
        /* font-weight:700; */
    }

    p {
        margin-left: 4rem;
        margin-right: 4rem;
        font-size:1rem;
        /* font-weight:400; */
    }

    img {
        width:4rem;
    }
}

.show {
    opacity: 1;
    filter: blur(0);
    transform: translateX(0);
}

.logos {
    display: flex;
}


.logo:nth-child(n){
    transition-delay: calc(200ms * var(--order));
}

/* .logo:nth-child(2){
    transition-delay: 200ms;   
}

.logo:nth-child(3){
    transition-delay: 400ms;
}

.logo:nth-child(4){
    transition-delay: 600ms;
}

.logo:nth-child(5){
    transition-delay: 800ms;
} */