/*========= Tablet Screen =========*/
@media (max-width: 991.999px) {
    .globalHeading {
        font-size: 38px;
    }
    .btn {
        font-size: 14px;
    }
    /*======== Header Styles ========*/
    header {
        padding: 15px 0;
    }

    header .headerLogo {
        height: 60px;
    }

    .logoBox {
        gap: 15px;
    }

    .logoBox .logoTitle {
        font-size: 20px;
    }
    .logoBox .logoSubtitle {
        font-size: 14px;
    }
    header .btnPrimary {
        padding: 14px 30px;
    }

    .arrowBtn {
        padding: 9px 20px;
        font-size: 14px;
    }

    /*======== Hero Section Styles ========*/
    .hero_sec {
        min-height: 100%;
    }

    .hero_sec .heroContent {
        padding: 150px 0 50px;
    }

    .hero_sec .heroContent h1 {
        font-size: 30px;
        margin-bottom: 16px;
    }

    .hero_sec .heroContent .appDownloadBtnBox {
        margin-top: 50px;
    }
    .appDownloadBtnBox {
        gap: 12px;
    }

    .appDownloadBtnBox .downloadStoreBtn img {
        height: 50px;
    }

    .CTA_sec {
        padding: 70px 0;
    }

    .faqsTabs {
        margin-top: 30px;
        flex-direction: row;
        gap: 10px;
        overflow-x: auto;
    }
    .faqsTabs .nav-link {
        padding: 10px 15px;
        border: 2px solid transparent;
        white-space: nowrap;
        border-radius: 8px;
    }
}

@media (max-width: 767px) {
    .logoBox .logoTextBox {
        display: none;
    }
    header .btnPrimary {
        padding: 12px 20px;
    }

    .arrowBtn {
        padding: 8px 16px;
        font-size: 14px;
        gap: 8px;
    }

    header .arrowBtn .arrow {
        height: 20px;
    }

    /*======= Footer style =======*/
    footer .logoBox {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
    footer .ftrLogo {
        max-height: 90px;
    }
    footer .headingText {
        font-size: 18px;
    }

    footer .socialBox {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 26px;
    }
    footer .socialBox .headingText {
        display: none;
    }

    footer .socialIconBox img {
        max-height: 24px;
    }

    footer .bottomFtr {
        margin-top: 30px;
        padding-top: 20px;
        justify-content: center;
        text-align: center;
        gap: 10px;
    }
    footer .bottomFtr p {
        line-height: 22px;
    }

    footer .bottomFtr ul {
        padding: 0;
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
    }

    .hero_sec {
        background-position: left;
    }

    /*=== Find truck and Goods Transport section ===*/
    .findTruckGoods_sec {
        overflow-x: hidden;
        padding: 100px 0 50px;
    }

    .findTruckGoods_sec .leftSideImageBox .mainImage {
        height: 96%;
    }
    .findTruckGoods_sec .appDownloadBtnBox {
        margin-top: 40px;
    }

    .deshParivahnQuotes_banner .circleIconAnimated {
        height: 220px;
        right: -6%;
        top: -22%;
    }

    .features_sec {
        padding: 90px 0 40px;
    }

    .CTA_sec {
        padding: 50px 0 40px;
    }

    .deshParivahnQuotes_banner {
        padding: 40px 40px 60px 40px;
    }
}

/*========= Mobile Screen =========*/
@media (max-width: 480px) {
    .globalHeading {
        font-size: 30px;
    }
    p {
        font-size: 14px;
    }
    .btn {
        font-size: 12px;
    }

    .btn.btnPrimaryOutline {
        font-size: 12px;
        padding: 10px 20px;
    }
    .arrowBtn {
        font-size: 12px;
    }

    header .navbar {
        padding: 0;
    }

    .findTruckGoods_sec {
        padding: 70px 0 50px;
    }

    .deshParivahnQuotes_banner {
        border-radius: 15px;
        padding: 30px 25px 40px;
    }

    /*---- Feature sec ----*/
    .featureCard_grid {
        row-gap: 20px;
    }
    .feature_card {
        padding: 48px 30px 40px;
        max-width: 310px;
        min-width: 310px;
    }
    .feature_card .cardTop .iconBox {
        max-width: 150px;
        min-width: 150px;
        height: 150px;
    }
    .feature_card .cardTop .iconBox .icon {
        width: 50%;
    }
    .feature_card .featureTitle {
        font-size: 20px;
        padding-inline: 20px;
    }
    .feature_card p {
        font-size: 12px;
    }
    .feature_card .ctaArrow {
        height: 30px;
    }

    .testimonial_sec {
        padding: 60px 0;
    }

    .testimonial_card .content {
        padding: 20px 0 30px;
    }
}