:root {
    --purple: #4a3291;
    --orange: #FCB614;
    --blue: #54c8ee;
    --green: #59cbbb;
    --yellow: #ffe200;
    --red:#ff8470;
}
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
*{
    font-family: "Poppins", sans-serif;
}
.text-purple{
    color: var(--purple);
}
.bg-orange{
    background-color:var(--orange);
}
.text-orange{
    color: var(--orange);
}
.bg-purple{
    background-color:var(--purple);
}

html.lenis, html.lenis body {
    height: auto;
}

.lenis.lenis-smooth {
    scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
}

.lenis.lenis-stopped {
    overflow: hidden;
}

.lenis.lenis-smooth iframe {
    pointer-events: none;
}

.hero{
    background-color: var(--purple);
}
.green_sec{
    background-color: var(--green);
}
.yellow_sec{
    background-color: var(--yellow);
}
.red_sec{
    background-color: var(--red);
}
.hero:before{
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 80%;
    height: 60%;
    background: rgb(252,182,20);
    background: linear-gradient(203deg, rgba(252,182,20,1) 0%, rgba(74,50,145,1) 35%);
}
.know_more{
    background-color:var(--orange);
    color:var(--purple);
}
.medcom{
    background-color: var(--blue);
}
.mountain{
    /*mix-blend-mode: color-burn;*/
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0%;
    z-index: 1;
    /*animation: rightMoving 30s infinite;*/
    background-image: url('../img/purple_mountain.png');
    background-repeat: repeat-x;
    height: 40%;
    /*animation: rightMoving 180s infinite;*/
    background-size: 200% 100%;
    opacity: 0.8;
    background-position: -95% bottom;
    /*transform: scale(2);*/
    transition: transform 0.3s ease-in-out;

}
.mountain2{
    /*mix-blend-mode: multiply;*/
    width: 160%;
    position: absolute;
    bottom: 0;
    left: -11%;
    z-index: 0;
    opacity: 0.1;
    background-image: url('../img/purple_mountain.png');
    background-repeat: repeat-x;
    height: 60%;
    /*animation: rightMoving 280s infinite;*/
    background-size: cover;
}
.animation_sec{
    position: fixed;
    width: 100vw;
    height: 110vh;
    left: 0;
    top:0;
    z-index: 1;
}
#bird{
    width: 175px;
    height: 129px;
    position: absolute;
    right: 20%;
    top: 30%;
    /*transform: translateY(-50%);*/
    background-image: url("../img/bird/yellow_sprite.png");
    animation: flying 0.75s steps(20) infinite;
    background-position: 0px top;
    margin-top: -100px;
    background-repeat: no-repeat;
}
#bird_move{
    width: 175px;
    height: 120px;
    position: absolute;
    right: 0%;
    top: 0%;
    /*transform: translateY(-50%);*/
    background-image: url("../img/bird/white_sprite.png");
    animation: flying 0.75s steps(20) infinite;
    background-position: 0px top;
    /*margin-top: -100px;*/
    transform: scale(0.2);
    transform-origin: 5px 5px;
    mix-blend-mode: color-burn;
}
@keyframes flying {
    0% {background-position: 0px top;top:49%;}
    50% {top:51%;}
    100% {background-position: -3500px top;top:49%;}
}
@keyframes rightMoving {
    0% {background-position: 0px bottom;}
    100% {background-position: -3500px top;}
}
h2{
    font-size: clamp(1rem, -1.5rem + 8vw, 3rem);
    font-weight: bold;
}
p{
    font-size: clamp(0.5rem, -0.2rem + 3vw, 1rem);
}
section{
    padding: clamp(150px, -2rem + 8vw, 250px) 0;
    height: 110vh;
}
.navbar-brand img{
    width: clamp(70px, -1.5rem + 8vw, 150px);
}
.container{
    position: relative;
    z-index: 1;
}
.btn{
    border-radius: 30px;
    padding: 10px 30px;
    font-size: bold;
    font-size: clamp(0.8rem, -1.5rem + 8vw, 1.5rem);
}

@media (max-width: 678px) {
    .mountain{
        background-size: 500% 100%;
        height: 50%;
    }
    #bird{
        transform: scale(0.8);
        right:0;
    }
    .hero::before {
        width: 90%;
        height: 30%;
    }
}