/* ===== XXL (≥1400px) ===== */
@media (min-width: 1400px) {
    .xxl-fs-70 {
        font-size: 3.5rem;
        line-height: 3.5rem;
    }
}

/* ===== Large (≥992px) ===== */
@media (min-width: 992px) {
    .nav-get-started {
        display: inline-flex !important;
    }
}

/* ===== Tablet (768px - 991px) ===== */
@media (max-width: 991px) {
    /* Hero: reduce marquee text size */
    #marquee .fs-140 {
        font-size: 6rem;
        line-height: 1;
    }

    /* Stack cards padding */
    .stack-card-item {
        padding: 2rem !important;
    }

    /* Pricing tab nav */
    .pricing-table-style-07 .nav-tabs .nav-link {
        padding: 1.2rem 1.5rem !important;
    }
}

/* ===== Mobile (≤767px) ===== */
@media (max-width: 767px) {

    /* ------- Hero Section ------- */
    #hero {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #hero .row.mt-3 {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    #hero h1 {
        font-size: 2rem !important;
        line-height: 1.2 !important;
    }

    #hero .col-md-5 {
        margin-top: 2rem;
        text-align: center;
    }

    #hero .col-md-5 img {
        max-width: 80% !important;
        margin: 0 auto;
        display: block;
    }

    /* Hero stats row */
    #hero .border-custom::after {
        display: none;
    }

    /* ------- About Section ------- */
    #about {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    #about .col:first-child {
        min-height: 260px;
        margin-bottom: 1.5rem !important;
        overflow: hidden;
    }

    /* ------- Service Section ------- */
    #service {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    /* Service cards on mobile: full width */
    #service .row-cols-sm-2 > .col {
        border-right: none !important;
        margin-bottom: 2rem;
    }

    /* ------- Who We Are (Stack) ------- */
    #who-we-are {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    .stack-card-item {
        padding: 1.5rem !important;
    }

    .stack-card-item h3 {
        font-size: 1.4rem !important;
    }

    .stack-card-item .fs-34 {
        font-size: 1.3rem !important;
    }

    /* Stack images full width on mobile */
    .stack-card-item .col-xl-6:last-child img,
    .stack-card-item .col-lg-6:last-child img {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
        margin-top: 1rem;
    }

    /* ------- Pricing Section ------- */
    #pricing-services {
        padding-top: 2rem !important;
    }

    .pricing-table-style-07 .nav-tabs .nav-link {
        padding: 0.8rem 1rem !important;
    }

    .pricing-table-style-07 .nav-tabs .nav-link .fs-20 {
        font-size: 0.95rem !important;
    }

    /* Pricing tab content padding */
    .pricing-body ul li {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    /* ------- Portfolio Section ------- */
    #portfolio-services .nav-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        justify-content: flex-start !important;
        padding-bottom: 4px;
    }

    #portfolio-services .nav-tabs .nav-item {
        flex-shrink: 0;
    }

    #portfolio-services .nav-tabs .nav-link {
        font-size: 0.9rem !important;
        white-space: nowrap;
    }

    /* ------- FAQ Section ------- */
    #faq-services {
        padding-top: 2rem !important;
    }

    #faq-services h2 {
        font-size: 1.8rem !important;
    }

    /* ------- Footer ------- */
    #contact {
        padding-top: 2.5rem !important;
        padding-bottom: 1rem !important;
    }

    #contact .col-12 {
        margin-bottom: 1.5rem;
    }

    #contact .d-flex.justify-content-around {
        gap: 2rem;
    }

    /* Footer bottom links */
    #contact .d-flex.flex-wrap {
        flex-direction: column;
        gap: 0.5rem !important;
        text-align: center;
    }

    /* Floating WA button: move to right on mobile to avoid interfering with content */
    .floating-wa {
        left: auto !important;
        right: 20px;
        bottom: 20px;
        width: 52px;
        height: 52px;
    }
}

/* ===== Extra Small (≤575px) ===== */
@media (max-width: 575px) {

    /* Hero buttons: full width stacked */
    #hero .btn {
        width: 100% !important;
        display: block !important;
        text-align: center;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* About section: single image, no float decorations */
    #about .col:first-child {
        min-height: 220px;
    }

    /* Reduce section vertical padding */
    section {
        padding-top: 2.5rem !important;
        padding-bottom: 2.5rem !important;
    }

    /* Stack card text */
    .stack-card-item .custom-feature-list li {
        font-size: 13px;
    }

    /* Pricing tab labels */
    .pricing-table-style-07 .nav-link .w-200px,
    .pricing-table-style-07 .nav-link .lg-w-150px {
        width: auto !important;
    }

    /* Marquee text */
    #marquee .fs-140 {
        font-size: 3.5rem !important;
        line-height: 1;
    }

    /* Gallery images height */
    .gallery-box .sm-h-250px {
        height: 200px !important;
        object-fit: cover;
    }
}