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

    /* Glassy Navbar */
    .glassy-navbar {
        width: 100%;
        padding: 10px;
    }

    .navbar-brand img {
        width: 70px;
        height: 50px;
    }

    /* Brand Text */
    .brand-text {
        font-size: 20px;
    }

    .glassy-navbar a p {
        font-size: 14px;
        left: 5px;
    }

    .navbar-toggler-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='white' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }

    .extra-btn {
     width: 50%;
     text-align: center;
    }

    #banner-section {
        height: 140vh
    }

    #banner-section .overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 140vh;
        background: #56021fa9;
        z-index: 1;
    }

    #banner-section .content {
        width: 100%;
        flex-wrap: wrap;
    }

    #banner-section .content .box {
        width: 100%;
        padding-top: 130px;
    }

    #banner-section .content .box h1 {
        font-size: 35px;
    }

    #banner-section .content .box h6 {
        font-size: 20px;
    }

    #banner-section .content .btns button {
        padding: 10px;
        width: 250px;
    }

    #banner-section .content .btns button a {
        color: black;
        text-decoration: none;
        font-size: 16px;
    }

    #banner-section .content .box2 {
        padding: 0;
    }

    #third-section {
        padding: 10px;
    }

    #third-section .points {
        width: 100%;
        gap: 10px;
    }

    #third-section .points .box {
        width: 100%;
    }

    .why-container {
        gap: 20px;

    }

    .why-image {
        flex: 1 1 0px;
        animation: float 3s ease-in-out infinite;
    }

    .why-image img {
        width: 100%;
        max-width: 500px;
        filter: drop-shadow(10px 10px 25px rgba(0, 0, 0, 0.1));
        border-radius: 20px;
    }

    #testimonial {
        height: 150vh;
    
    }

    #testimonial .content {
        width: 100%;
        gap: 10px;
        flex-wrap: wrap;
    }

    #testimonial .content .image-box img {
        width: 100%;
    }

    #testimonial .testi-section {
        gap: 20px;
        margin-top: 20px;
        position: relative;
        z-index: 2;
        width: 100%;
        flex-wrap: wrap;
    }
    
    #testimonial .testi-section .boxy{
        width: 100%;
    }

    .reviews-container {
        display: flex;
        gap: 20px;
        transition: transform 0.5s ease-in-out;
        width: calc(100% * 5); /* 5 reviews */
      }
      
      .reviews {
        width: 100%;
        padding: 10px;
        box-sizing: border-box;
        text-align: center;
        background: white;
      }
    



    .faq-section {
        background: #fff8f7;
        padding: 20px 30px 0px 30px;
        font-family: 'Segoe UI', sans-serif;
    }

    .faq-container {
        gap: 0px;
    }


    .footer {
        background: linear-gradient(135deg, #56021f, #ff5e7e);
        color: #fff;
        padding: 60px 30px 30px;
        font-family: 'Segoe UI', sans-serif;
        margin-top: 0%;
    }

    .brand {
        flex: 1 1 1px;
    }


}














@media screen and (max-width:576px) and (min-width: 414px) {

    /* Glassy Navbar */
    .glassy-navbar {
        width: 100%;
        padding: 10px;
    }

    .navbar-brand img {
        width: 70px;
        height: 50px;
    }

    /* Brand Text */
    .brand-text {
        font-size: 20px;
    }

    .glassy-navbar a p {
        font-size: 14px;
        left: 5px;
    }

    .navbar-toggler-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='white' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }

    .extra-btn {
     width: 50%;
     text-align: center;
    }

    #banner-section {
        height: 140vh
    }

    #banner-section .overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 140vh;
        background: #56021fa9;
        z-index: 1;
    }

    #banner-section .content {
        width: 100%;
        flex-wrap: wrap;
    }

    #banner-section .content .box {
        width: 100%;
        padding-top: 130px;
    }

    #banner-section .content .box h1 {
        font-size: 35px;
    }

    #banner-section .content .box h6 {
        font-size: 20px;
    }

    #banner-section .content .btns button {
        padding: 10px;
        width: 250px;
    }

    #banner-section .content .btns button a {
        color: black;
        text-decoration: none;
        font-size: 16px;
    }

    #banner-section .content .box2 {
        padding: 0;
    }

    #third-section {
        padding: 10px;
    }

    #third-section .points {
        width: 100%;
        gap: 10px;
    }

    #third-section .points .box {
        width: 100%;
    }

    .why-container {
        gap: 20px;

    }

    .why-image {
        flex: 1 1 0px;
        animation: float 3s ease-in-out infinite;
    }

    .why-image img {
        width: 100%;
        max-width: 500px;
        filter: drop-shadow(10px 10px 25px rgba(0, 0, 0, 0.1));
        border-radius: 20px;
    }

    #testimonial {
        height: 150vh;
    
    }

    #testimonial .content {
        width: 100%;
        gap: 10px;
        flex-wrap: wrap;
    }

    #testimonial .content .image-box img {
        width: 100%;
    }

    #testimonial .testi-section {
        gap: 20px;
        margin-top: 20px;
        position: relative;
        z-index: 2;
        width: 100%;
        flex-wrap: wrap;
    }
    
    #testimonial .testi-section .boxy{
        width: 100%;
    }

    .reviews-container {
        display: flex;
        gap: 20px;
        transition: transform 0.5s ease-in-out;
        width: calc(100% * 5); /* 5 reviews */
      }
      
      .reviews {
        width: 100%;
        padding: 10px;
        box-sizing: border-box;
        text-align: center;
        background: white;
      }
    



    .faq-section {
        background: #fff8f7;
        padding: 20px 30px 0px 30px;
        font-family: 'Segoe UI', sans-serif;
    }

    .faq-container {
        gap: 0px;
    }


    .footer {
        background: linear-gradient(135deg, #56021f, #ff5e7e);
        color: #fff;
        padding: 60px 30px 30px;
        font-family: 'Segoe UI', sans-serif;
        margin-top: 0%;
    }

    .brand {
        flex: 1 1 1px;
    }


}














@media screen and (max-width:780px) and (min-width:576px) {

    /* Glassy Navbar */
    .glassy-navbar {
        width: 100%;
        padding: 10px;
    }

    .navbar-brand img {
        width: 70px;
        height: 50px;
    }

    /* Brand Text */
    .brand-text {
        font-size: 20px;
    }

    .glassy-navbar a p {
        font-size: 14px;
        left: 5px;
    }

    .navbar-toggler-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='white' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }

    .extra-btn {
     width: 50%;
     text-align: center;
    }

    #banner-section {
        height: 140vh
    }

    #banner-section .overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 140vh;
        background: #56021fa9;
        z-index: 1;
    }

    #banner-section .content {
        width: 100%;
        flex-wrap: wrap;
    }

    #banner-section .content .box {
        width: 100%;
        padding-top: 130px;
    }

    #banner-section .content .box h1 {
        font-size: 35px;
    }

    #banner-section .content .box h6 {
        font-size: 20px;
    }

    #banner-section .content .btns button {
        padding: 10px;
        width: 250px;
    }

    #banner-section .content .btns button a {
        color: black;
        text-decoration: none;
        font-size: 16px;
    }

    #banner-section .content .box2 {
        padding: 0;
    }

    #third-section {
        padding: 10px;
    }

    #third-section .points {
        width: 100%;
        gap: 10px;
    }

    #third-section .points .box {
        width: 100%;
    }

    .why-container {
        gap: 20px;

    }

    .why-image {
        flex: 1 1 0px;
        animation: float 3s ease-in-out infinite;
    }

    .why-image img {
        width: 100%;
        max-width: 500px;
        filter: drop-shadow(10px 10px 25px rgba(0, 0, 0, 0.1));
        border-radius: 20px;
    }

    #testimonial {
        height: 150vh;
    
    }

    #testimonial .content {
        width: 100%;
        gap: 10px;
        flex-wrap: wrap;
    }

    #testimonial .content .image-box img {
        width: 100%;
    }

    #testimonial .testi-section {
        gap: 20px;
        margin-top: 20px;
        position: relative;
        z-index: 2;
        width: 100%;
        flex-wrap: wrap;
    }
    
    #testimonial .testi-section .boxy{
        width: 100%;
    }

    .reviews-container {
        display: flex;
        gap: 20px;
        transition: transform 0.5s ease-in-out;
        width: calc(100% * 5); /* 5 reviews */
      }
      
      .reviews {
        width: 100%;
        padding: 10px;
        box-sizing: border-box;
        text-align: center;
        background: white;
      }
    



    .faq-section {
        background: #fff8f7;
        padding: 20px 30px 0px 30px;
        font-family: 'Segoe UI', sans-serif;
    }

    .faq-container {
        gap: 0px;
    }


    .footer {
        background: linear-gradient(135deg, #56021f, #ff5e7e);
        color: #fff;
        padding: 60px 30px 30px;
        font-family: 'Segoe UI', sans-serif;
        margin-top: 0%;
    }

    .brand {
        flex: 1 1 1px;
    }


}