.hero h1.aos {
    animation: zoomin 1s ease 1 forwards;
}

.hero h1.aos::after {
    animation: linefull 1s ease 0.5s 1 forwards;
}

.hero h2.aos {
    animation: fadeupp 1s ease 1 forwards;
}

.hero p.aos {
    animation: zoomin 1s ease 1 forwards;
}

.content-grid .content-text.aos {
    animation: fadeleft 1s ease 1 forwards;
}

.content-grid .content-text h2.aos::before {
    animation: animate 6s linear 0.5s 1 forwards;
}

@keyframes animate {
    0% {
        width: 0%;
    }

    100% {
        width: 100%;
    }
}

.content-grid .content-image.aos {
    animation: faderight 1s ease 1 forwards;
}

.container .stats-section.aos {
    animation: fadeupp 1s ease 1 forwards;
}

.content-main.aos {
    animation: fadeleft 1s ease 1 forwards;
}

.main-about-section .content-text h2.aos {
    animation: fadeupp 1s ease 1 forwards;
}

.content-text .about-box.aos {
    animation: faderight 1s ease 1 forwards;
}

.hero-content .section-tag.aos {
    animation: fadeupp 1s ease 1 forwards;
}

.hero-content .section-tag.aos::before {
    animation: linefull 1s ease 1 forwards;
}

@keyframes linefull {
    0% {
        width: 0;
    }

    100% {
        width: 80%;
    }
}

@keyframes fadeupp {
    0% {
        transform: translateY(50px);
        opacity: 0;
    }

    100% {
        transform: translateY(0px);
        opacity: 1;
    }
}

.hero-content h2.aos {
    animation: fadeupp 1s ease 1 forwards;
}

.hero-content p.aos {
    animation: fadeupp 1s ease 1 forwards;
}

.btn-portfolio.aos {
    -webkit-animation: jello-horizontal 0.9s both;
    animation: jello-horizontal 0.9s both;
}

@-webkit-keyframes jello-horizontal {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        -webkit-transform: scale3d(0.95, 1.05, 1);
        transform: scale3d(0.95, 1.05, 1);
    }

    75% {
        -webkit-transform: scale3d(1.05, 0.95, 1);
        transform: scale3d(1.05, 0.95, 1);
    }

    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes jello-horizontal {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        -webkit-transform: scale3d(0.95, 1.05, 1);
        transform: scale3d(0.95, 1.05, 1);
    }

    75% {
        -webkit-transform: scale3d(1.05, 0.95, 1);
        transform: scale3d(1.05, 0.95, 1);
    }

    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.values-section .values-grid .value-card.aos {
    animation: fadeup 1s ease 1 forwards;
}

.container .team-grid .team-card.aos {
    animation: zoomin 1s ease 1 forwards;
}