/* ---------------------------- Hero Section (START) -------------------------- */

.hero-section {
    padding: 80px 150px 0;
}

.reviews {
    margin: 0 auto;
    display: flex;
    gap: 20px;
}

.review {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    width: 33.33%;
}

.review .star-icon {
    color: #F0AD4E;
}

.review p {
    font-style: italic;
    font-size: 12px;
    text-align: center;
}

.hero-head {
    margin-top: 60px;
    font-size: 44px;
    text-align: center;
}

.hero-head #head-span {
    color: var(--primary-color);
}

.typed-cursor {
    font-weight: 500;
    position: relative;
    top: -3px;
}


.bullets {
    margin-top: 50px;
    display: flex;
    flex-wrap: wrap;
    column-gap: 1%;
    row-gap: 10px;
    justify-content: center;
}

.bullet {
    flex-basis: 32.5%;
    display: flex;
    align-items: flex-start;
    gap: 4px;
}

.bullet .icon {
    color: var(--primary-color); 
    position: relative;  
    top: 5px;
}

.bullet p {
    text-align: justify;
    width: 240px;
}

.quote-btn {
    margin-top: 50px;
    
}

/* ---------------------------- Hero Section (END) -------------------------- */



@media screen and (max-width: 900px) {

    .hero-section {
        padding: 60px 20px 0;
    }
}



@media screen and (max-width: 500px) {

    .reviews {
        flex-wrap: wrap;
        justify-content: center;
    }
    .review {
        flex-basis: 45%;
    }
    .hero-head {
        font-size: 35px;
        margin-top: 25px;
    }
}