@media (max-width: 1990px) {
    .cnt_prjcts h3 {
        font-size: 26px;
        letter-spacing: 0.1px;
        line-height: 30px;
    }

    .bannersection .banner_cnt .wrap_bannersec h1 {
        font-size: 60px;
        line-height: 55px;
        margin-top: 0;
    }

    .bannersection .banner_cnt .wrap_bannersec .awards_sec {
        width: 150px;
        padding-bottom: 0;
    }

    .bannersection .banner_cnt .wrap_bannersec .awards_sec img {
        width: 49px;
    }

    .txtbannersec p {
        font-size: 20px;
    }

    .leftwelsec h2 {
        font-size: 50px;
        letter-spacing: -2px;
    }

    .blocks_awrds h3 {
        font-size: 25px;
        letter-spacing: 0px;
        margin-top: 11px;
    }

    .rightwelsec {
        gap: 51px;
    }

    .abtwelimg img {
        width: 80%;
    }

    .title_sec h2 {
        font-size: 45px;
        letter-spacing: -1px;
    }

    .title_sec p {
        font-size: 18px;
        line-height: 26px;
        font-weight: 300;
    }

    .block_expertise h3 {
        font-size: 23px;
        margin-bottom: 0;
    }

    .block_expertise p {
        font-size: 16px;
        line-height: 21px;
        margin-top: 15px;
    }

    section.commitments {
    }

    .verticalblocks .vertical_cntblck h2 {
        font-size: 26px;
        line-height: 30px;
        padding-right: 0;
    }

    .verticalblocks .vertical_cntblck p {
        font-size: 16px;
        line-height: 19px;
        margin-top: 0;
        margin-bottom: 23px;
    }

    .ourreach_cnts h3 {
        font-size: 50px;
        letter-spacing: -2px;
    }

    .blcks_stats h2 {
        font-size: 32px;
        margin-bottom: 0;
    }

    .ourreach_cnts p {
        margin-top: 0;
        letter-spacing: 0.7px;
        line-height: 21px;
        font-size: 16px;
    }

    .wrapreachcnts {
        padding-bottom: 0;
        margin-bottom: 60px;
    }

    .wrap_projects .owl-item.active.center + .owl-item .cnt_prjcts h3 {
        padding-right: 0;
    }

    .titleprt h3 {
        font-size: 50px;
    }

    .block_news h5 {
        font-size: 17px;
        line-height: 23px;
    }

    .lefttrustbysec h3 {
        font-size: 35px;
        line-height: 40px;
        font-weight: 500;
    }

    .lefttrustbysec .btn_mains a {
        font-size: 18px;
        letter-spacing: 0;
    }

    .getconnectedsec strong {
        font-size: 18px;
    }

    .wrap_projects.owl-carousel.owl-loaded.owl-drag {
        margin-top: 55px;
    }

    .bannersection .icon_shape {
        width: 7%;
    }

    .welcome_sections {
        padding-bottom: 130px;
    }

    .leftwelsec {
        width: calc(100% - 50%);
    }

    .wrap_insidebanner h1 {
        font-size: 41px;
        line-height: 49px;
        margin-bottom: 20px;
        font-weight: 600;
        width: 80%;
    }

    .wrap_insidebanner strong {
        font-size: 17px;
        clip-path: none;
        margin-top: 2px;
        font-weight: 300 !important;
        letter-spacing: 0.3px;
    }

    .innerpage_banners {
        padding-top: 270px;
        padding-bottom: 0;
    }

    .blocksnumbersSecs .blocks_awrds .icon {
        height: 45px;
    }

    .blocksnumbersSecs .blocks_awrds p {
        font-size: 16px;
        padding-right: 0;
    }

    .blocksnumbersSecs {
        grid-template-columns: repeat(4,1fr);
        justify-content: center;
        width: 79%;
        margin: 0 auto;
    }

    .cmpanyseca .leftwelsec h2 {
        font-size: 45px;
        line-height: 43px;
        letter-spacing: -1px;
    }

    .leftwelsec p {
    }

    .cmpanyseca .leftwelsec {
        width: 50%;
    }

    .wrap_secondheader .logosec {
        width: 100px;
        padding: 22px 10px;
    }

    .wrap_secondheader .logosec {
        width: 100px;
        padding: 22px 10px;
    }

    .wrap_secondheader .navigation_sec {
        width: calc(100% - 160px);
    }

    .topheader .wrap_secs {
        padding-left: 159px;
    }

    .wrap_secondheader .navigation_sec .navbar ul li a {
        font-size: 16px;
        transition: 0.5s ease-in-out;
    }

    .wrap_secondheader .navigation_sec .navbar ul li a:hover, .wrap_secondheader .navigation_sec .navbar ul li:hover>a {
        color: #ff8e6e;
    }
}

@media (max-width: 1700px) {
   
    .wrapcommitment .img_comitment {
        width: 480px;
    }

    .verticalsliders {
        width: calc(100% - 480px - 15px) !important;
    }
}

@media (max-width: 1580px) {
   

    .wrapcommitment .img_comitment {
        width: 400px;
    }

    .verticalsliders {
        width: calc(100% - 400px - 15px) !important;
    }
}





@media (max-width: 1140px) {
    /* Old left-slide nav removed — right-slide drawer handled in @media (max-width: 1024px) */

    .wrap_footer {
        display: grid;
        grid-template-columns: repeat(2,1fr);
    }

    .block_footer {
        display: flex;
        /* align-items: flex-start; */
    }

    .block_footer:first-child>h3 {
        display: none;
    }

    .contactUs {
        margin-top: 0;
    }

    .block_footer:last-child {
        border: none;
        justify-content: space-between;
    }

    .block_footer:last-child h3 {
        display: none;
    }

    .block_footer.abt_img {
        grid-column: 1 / -1;
        order: 1;
        margin-top: 31px;
        border-top: 1px solid #ccc;
        padding-top: 30px;
    }
}

@media (max-width: 980px) {

    .topheader .wrap_secs .toplefnav {
        display: none;
    }

    .leftwelsec {
        width: 100%;
        order: 2;
        margin-top: 40px;
        border-top: 1px solid #ccc;
        padding-top: 40px;
    }

    .rightwelsec {
        width: 100%;
        display: flex;
        justify-content: space-between;
        order: 1;
    }

    .wrap_welcsec {
        flex-flow: column;
    }

    .welcome_sections {
        padding-top: 40px;
    }

    .leftwelsec h2 {
        font-size: 40px;
        letter-spacing: 0;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .wrap_core_expertise {
        grid-template-columns: repeat(2,1fr);
        flex-flow: column;
    }

    .block_expertise:first-child {
        clip-path: none;
    }

    .title_sec {
        flex-flow: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .title_sec .buttonsec {
        margin: 0;
    }

    .title_sec .cnt_sec_heds {
        width: 100%;
        text-align: center;
    }

    .title_sec .cnt_sec_heds h2 {
        text-align: center;
    }

    .title_sec .cnt_sec_heds p {
        text-align: center;
    }

    .verticalsliders {
        width: 100% !important;
        padding-left: 0;
        order: 1;
    }

    .wrapcommitment {
        display: flex;
        flex-flow: column;
    }

    .wrapcommitment .img_comitment {
        order: 2;
        margin-top: 20px;
        width: 100%;
    }

    .wrapcommitment .img_comitment img {
        height: auto !important;
    }

    .ourreach_cnts p {
        text-align: center;
    }

    .ourprojects .title_sec p {
        padding: 0;
        text-align: center;
    }

    .ourprojects .title_sec h2, .ourprojects .title_sec p {
        text-align: center !important;
    }

    .newslist {
        grid-template-columns: repeat(1, 1fr);
    }

    .block_news {
        padding: 30px 0;
        border-left: none !important;
        border-top: 1px solid #ccc;
        border-right: none !important;
    }

    .block_news:first-child {
        padding-top: 0;
        border: none;
    }

    .wrap_trustedby {
        flex-flow: column;
    }

    .lefttrustbysec {
        width: 100%;
        padding: 0;
        order: 2;
        margin-top: 40px;
    }

    .getconnectedsec {
        width: inherit;
    }

    .lefttrustbysec h3 {
        line-height: 37px;
    }

    .wraplowfoter {
        display: flex;
        flex-flow: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .getreadysecs {
        flex-flow: column;
        align-items: center;
        justify-content: center;
    }

    .getreadysecs h4 {
        margin-bottom: 20px;
    }

    .copyrightsecs {
        align-items: center;
        margin-top: 29px;
    }

    .block_footer.abt_img .imgabt {
        width: 30%;
    }

    .block_footer.abt_img .cntabtsec {
        width: 60%;
    }

    .block_footer.abt_img .cntabtsec h3 img {
        display: none;
    }

    .bannersection .banner_cnt .wrap_bannersec h1 {
        font-size: 40px;
        line-height: 43px;
    }

    .bannersection video {
        object-fit: cover;
        height: 100%;
    }
}

@media (max-width: 768px) {
    .block_footer:last-child {
        display: none;
    }

    .topheader .wrap_secs ul li:last-child {
        display: none;
    }

    .bannersection .banner_cnt .wrap_bannersec .awards_sec {
        width: 160px;
        background: #ffffff24;
        padding-left: 75px;
        margin-top: 20px;
        margin-bottom: 0;
        order: 1;
        padding: 20px 30px 16px 70px;
        border-radius: 4px;
        backdrop-filter: blur(4px);
        -webkit-backdrop-filter: blur(3px);
    }

    .bannersection .banner_cnt .wrap_bannersec .txtbannersec {
        width: 100%;
        order: 2;
        margin-bottom: 40px;
        padding: 0!important;
    }

    .bannersection .banner_cnt .wrap_bannersec {
        width: 100%;
        display: flex;
        flex-flow: column;
    }

    .bannersection .banner_cnt .wrap_bannersec h1 {
        padding: 0;
        font-size: 30px;
        line-height: 36px;
        letter-spacing: 0;
    }

    .bannersection .banner_cnt .wrap_bannersec .awards_sec img {
        position: absolute;
        left: 16px;
        width: 35px;
        top: 25px;
    }

    .bannersection .banner_cnt .wrap_bannersec .awards_sec:before, .bannersection .banner_cnt .wrap_bannersec .awards_sec:after {
        display: none;
    }

    .bannersection .banner_cnt .wrap_bannersec .awards_sec h3 {
        margin-top: 0;
    }

    /* Only hide the old eyebrow/label spans, not h1 content spans */
    .bannersection .banner_cnt .wrap_bannersec .txtbannersec > span {
        display: none;
    }
    .bannersection .banner_cnt .wrap_bannersec .txtbannersec h1 span {
        display: inline !important;
    }

    .bannersection .icon_shape {
        display: none;
    }

    .rightwelsec {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 45px;
        background: #f1f1f1;
        padding: 25px;
        border-radius: 6px;
        width: inherit;
    }

    .blocks_awrds p {
        padding: 0;
        font-size: 14px;
    }

    .blocks_awrds h3 {
        font-size: 28px;
    }

    .leftwelsec {
        border-top: none;
        padding-top: 0;
    }

    .abtwelimg {
        margin-top: 0;
    }

    .abtwelimg img {
        width: 100%;
    }

    .title_sec p {
        padding: 0;
    }

    .title_sec .cnt_sec_heds p {
        padding: 0;
    }

    .wrap_footer {
        display: flex;
        flex-flow: column;
        padding-bottom: 40px;
    }

    .block_footer.abt_img .cntabtsec {
        padding-left: 0;
        width: 60%;
    }

    .block_footer.abt_img .imgabt {
        width: 25%;
    }

    .block_footer.abt_img .cntabtsec h3 {
        font-size: 30px;
        margin-bottom: 0;
    }

    .block_footer.abt_img .cntabtsec p {
        margin-top: 10px;
    }

    footer#mainfooter {
        padding-top: 40px;
    }

    section.ctasections {
        padding: 40px 0;
    }

    section.news_events {
        padding: 40px 0;
    }

    .title_sec {
        margin-bottom: 0 !important;
    }

    .wrap_projects.owl-carousel.owl-loaded.owl-drag {
        margin-top: 40px;
    }

    .verticalsliders.carouselverticlslider {
        margin-top: 40px;
    }
}

@media (max-width: 680px) {
    /* Header styles now handled in @media (max-width: 1024px) */
    .btn_emplyee { display: none; }
    .header:before { display: none; }

    .wrap_core_expertise {
        grid-template-columns: repeat(1,1fr);
    }

    .block_expertise {
        align-items: center;
        justify-content: center;
        text-align: center;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .title_sec .cnt_sec_heds h2 {
        font-size: 30px;
    }

    .title_sec .cnt_sec_heds p {
        font-size: 16px;
        line-height: 20px;
    }

    .verticalblocks .vertical_cntblck {
        padding-left: 25px;
        padding-right: 25px;
    }

    .verticalblocks .slideImgs img {
        height: 600px;
    }

    .titleprt h3 {
        font-size: 30px;
        letter-spacing: -0.5px;
    }

    .lefttrustbysec h3 {
        font-size: 25px;
        letter-spacing: 0.4px;
        line-height: 30px;
        text-align: center;
    }

    .lefttrustbysec p {
        font-size: 16px;
        line-height: 21px;
        text-align: center;
    }

    .lefttrustbysec {
        flex-flow: column;
        align-items: center;
        justify-content: center;
    }

    .lefttrustbysec .btn_mains a {
        font-size: 15px;
    }

    .lefttrustbysec .btn_mains a img {
        width: 25px;
    }

    .block_footer.abt_img {
        flex-flow: column;
        order: inherit !important;
        margin: 0;
        padding: 0;
        border: navajowhite;
    }

    .block_footer.abt_img .imgabt {
        width: inherit;
    }

    .block_footer.abt_img .cntabtsec {
        width: 100%;
        text-align: center;
        margin-top: 30px;
        display: flex;
        flex-flow: column;
        align-items: center;
        justify-content: center;
    }

    .getreadysecs h4 {
        font-size: 22px;
        line-height: 30px;
    }

    .lowerfooter {
        background-size: 100%;
        padding-bottom: 50px;
    }

    .copyrightsecs ul.socialmedia {
        gap: 2px !important;
        margin-bottom: 0;
        opacity: 0.6;
    }

    .copyrightsecs ul.socialmedia li {
        margin-right: 6px;
    }

    .block_footer {
        flex-flow: column;
        order: 2;
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        padding: 20px 0;
        margin: 20px 0;
    }

    .block_footer ul {
        align-items: center;
    }

    .block_footer h3 {
        text-align: center;
        margin-top: 30px;
        text-transform: uppercase;
        font-size: 18px;
    }

    .block_footer:first-child>h3 {
        display: block;
        margin-top: 0;
    }

    .contactUs p {
        text-align: center;
    }

    .block_footer.abt_img .cntabtsec h3 {
        margin-top: 0;
    }

    .block_footer:last-child {
        display: block;
    }

    .block_footer:last-child {
        padding: 0 !important;
        margin-top: 0;
        display: grid;
        grid-template-columns: repeat(2,1fr);
        justify-content: flex-start;
        text-align: left !important;
    }

    .block_footer:last-child ul {
        align-items: flex-start;
    }
}

@media (max-width: 520px) {
    .leftwelsec h2 {
        font-size: 32px;
        letter-spacing: -0.9px;
        margin-top: 5px !important;
        margin-bottom: 10px !important;
        line-height: 40px;
    }

    .leftwelsec p {
        font-size: 16px;
        font-family: "Google Sans", sans-serif;
        line-height: 21.2px;
        letter-spacing: 0.2px;
    }

    .leftwelsec .btn_mains {
        margin-top: 10px;
    }

    .blocks_awrds p {
        font-size: 14px;
        letter-spacing: 0;
        line-height: 17px;
    }

    .rightwelsec {
        gap: 30px;
    }
}

/* ============================================================
   RESPONSIVE — NEW COMPONENTS (header, footer, all sections)
   Mobile-first premium app feel
   ============================================================ */

/* ---------- Shared utilities ---------- */
@media (max-width: 1024px) {
    html, body { background: #ffffff !important; }
    .container { padding: 0 32px !important; }

    /* Hide top bar */
    .topheader { display: none !important; }

    /* ====================================================
       HEADER: sticky, white, [logo] ··· [CTA] [≡]
       ==================================================== */
    .header,
    .second_header {
        position: sticky !important;
        top: 32px;
        z-index: 1000;
        padding: 0 !important;
        background: #fff !important;
        box-shadow: 0 1px 12px rgba(0,0,0,0.1);
        transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    }

    /* Flatten wrap to simple flex row */
    .wrap_secondheader,
    .second_header .container {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        padding: 0px 7px !important;
        gap: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Logo: left, fixed height, no stretch */
    .logosec {
        order: 1;
        width: auto !important;
        min-width: 0 !important;
        max-width: 200px !important;
        padding: 7px 0 !important;
        border: none !important;
        flex-shrink: 0;
        display: flex;
        align-items: center;
    }
    .logosec img {
        height: 66px !important;
        width: auto !important;
        max-width: 200px !important;
        object-fit: contain !important;
        display: block !important;
    }

    /* navigation_sec: shrink to just the hamburger, push right */
    .navigation_sec,
    .wrap_secondheader .navigation_sec {
        order: 3;
        margin-left: 0 !important;
        width: auto !important;
        flex: none !important;
        display: flex !important;
        flex-flow: row !important;
        align-items: center !important;
    }

    /* Mobile translate top bar */
    .mob_translate_bar {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        background: #fff8ef !important;
        padding: 7px 14px !important;
        font-size: 12px !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 1001 !important;
    }
    .mob_translate_bar .gt_selector,
    .mob_translate_bar select {
        font-size: 12px !important;
        padding: 3px 6px !important;
        border-radius: 4px !important;
        border: none !important;
        background: #2a2a2a !important;
        color: #eee !important;
        max-width: 130px !important;
    }

    /* btns_sec */
    .btns_sec {
        order: 2;
        margin-left: auto !important;
        display: flex !important;
        align-items: center !important;
        gap: 0 !important;
    }

    /* Hide social + whatsapp buttons */
    .header_social_btn { display: none !important; }
    .header_whatsapp_btn { display: none !important; }

    /* CTA button */
    .header_cta_btn {
        display: inline-flex !important;
        align-items: center !important;
        gap: 0 !important;
        padding: 9px 18px !important;
        background: #0e4889 !important;
        color: #fff !important;
        border-radius: 50px !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        margin-right: 6px;
    }
    .header_cta_btn svg { display: none !important; }

    /* Hamburger: 3 white lines, flush to right edge */
    .wrap_secondheader .navigation_sec .navbar {
        position: static !important;
        margin-left: 0 !important;
        display: flex !important;
        align-items: center !important;
        flex-flow: row !important;
        width: auto !important;
    }
    .togglermobile {
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        width: 24px !important;
        height: 18px !important;
        cursor: pointer !important;
        z-index: 10001 !important;
        background: none !important;
        border: none !important;
        border-top: none !important;
        padding: 0 !important;
        margin: 0 !important;
        position: relative;
    }
    .togglermobile span,
    .togglermobile::before,
    .togglermobile::after {
        content: '' !important;
        display: block !important;
        width: 100% !important;
        height: 2px !important;
        background: #1a1410 !important;
        border-radius: 2px !important;
        transition: all 0.35s ease !important;
        position: static !important;
        top: auto !important;
        bottom: auto !important;
    }
    .togglermobile.closemenu { border: none !important; }
    .togglermobile.closemenu::before {
        transform: rotate(45deg) translate(4px, 4px) !important;
    }
    .togglermobile.closemenu::after {
        transform: rotate(-45deg) translate(4px, -4px) !important;
    }
    .togglermobile.closemenu > span { opacity: 0 !important; }

    /* ====================================================
       NAV DRAWER — UL slides in from right, navbar stays static
       ==================================================== */
    .navigation_sec .navbar > ul {
        display: flex !important;
        flex-direction: column !important;
        position: fixed !important;
        top: 0 !important; right: 0 !important; bottom: 0 !important;
        left: auto !important;
        width: min(300px, 82vw) !important;
        background: #ffffff !important;
        background-color: #ffffff !important;
        transform: translateX(110%) !important;
        opacity: 1 !important;
        visibility: visible !important;
        transition: transform 0.38s cubic-bezier(0.32,0.72,0,1) !important;
        padding: 64px 28px 40px !important;
        overflow-y: auto !important;
        z-index: 99999 !important;
        pointer-events: none !important;
        margin: 0 !important;
        box-shadow: -12px 0 48px rgba(0,0,0,0.2) !important;
    }
    .navigation_sec .navbar ul.activemobile_menu,
    .wrap_secondheader .navigation_sec .navbar ul.activemobile_menu {
        transform: translateX(0) !important;
        pointer-events: all !important;
        left: auto !important;
        background: #ffffff !important;
        background-color: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
    /* Backdrop is a real div injected by JS — no body::before needed */
    #nav_backdrop { display: none; }

    /* Close button inside drawer */
    .nav_close_btn {
        position: fixed !important;
        top: 16px !important;
        right: 16px !important;
        background: none !important;
        border: none !important;
        cursor: pointer !important;
        padding: 8px !important;
        color: #1a1410 !important;
        line-height: 1 !important;
        z-index: 100000 !important;
        display: none;
    }
    .nav_close_btn.visible { display: block !important; }

    /* Drawer nav items — dark text on white */
    .navigation_sec .navbar ul li {
        margin-bottom: 0 !important;
        border-bottom: 1px solid rgba(0,0,0,0.07) !important;
        display: block !important;
        position: relative !important;
        flex-flow: unset !important;
    }
    .navigation_sec .navbar ul li a {
        display: block !important;
        font-size: 17px !important;
        font-weight: 600 !important;
        color: #1a1410 !important;
        padding: 15px 0 !important;
        letter-spacing: -0.2px !important;
        text-decoration: none !important;
    }
    .navigation_sec .navbar ul li a:hover,
    .navigation_sec .navbar ul li.current-menu-item > a {
        color: #0e4889 !important;
    }

    /* ---- About section ---- */
    .abt2_inner {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
        padding: 30px 0 !important;
    }
    .abt2_left { display: none !important; }
    .abt2_right { padding: 0 !important; }
    .abt2_stats { flex-wrap: wrap; gap: 20px 0; }

    /* ---- Service bento ---- */
    .svc_bento { grid-template-columns: 1fr 1fr !important; gap: 16px !important; }
    .svc_bento_card:first-child { grid-column: 1 / -1; }

    /* ---- Why choose us ---- */
    .wcu2_grid { grid-template-columns: 1fr 1fr !important; gap: 20px !important; }

    /* ---- Blog cards (home) ---- */
    .blg3_grid { grid-template-columns: 1fr 1fr !important; gap: 24px !important; }
    .blg3_inner { padding: 60px 32px !important; }

    /* ---- Footer ---- */
    .ft2_inner {
        grid-template-columns: 1fr 1fr !important;
        gap: 40px 32px !important;
        padding: 60px 32px !important;
    }
    .ft2_brand { grid-column: 1 / -1; }
    .ft2_bottom_inner {
        flex-direction: column !important;
        gap: 8px;
        text-align: center;
    }

    /* ---- CTA band ---- */
    .cta_band_inner {
        grid-template-columns: 1fr !important;
        border-radius: 20px !important;
    }
    .cta_band_right { border-radius: 0 0 20px 20px !important; }

    /* ---- Gallery ---- */
    .masonary-gallery { grid-template-columns: repeat(3,1fr) !important; }

    /* ---- IPB2 inner banner ---- */
    .ipb2_inner { flex-direction: column !important; gap: 32px !important; padding: 80px 32px 60px !important; }
    .ipb2_text h1 { font-size: 36px !important; }
    .ipb2_stats { gap: 24px !important; flex-wrap: wrap; }

    /* ---- Blog listing layout ---- */
    .blog_layout { grid-template-columns: 1fr !important; gap: 32px !important; }
    .blog_sidebar {
        position: static !important;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }
    .blog_sidebar > * { margin-bottom: 0 !important; }

    /* ---- Single post ---- */
    .sng_layout { grid-template-columns: 1fr !important; }
    .sng_sidebar { display: none; }

    /* ---- Contact page ---- */
    .cnt2_inner { grid-template-columns: 1fr !important; }
}

/* ---------- Mobile: 768px and below ---------- */
@media (max-width: 768px) {
    .container { padding: 0 20px !important; }

    /* Whatsapp text hidden on small */
    .header_whatsapp_btn span,
    .header_whatsapp_btn { font-size: 0 !important; padding: 10px !important; border-radius: 50% !important; width: 40px; height: 40px; justify-content: center; }
    .header_whatsapp_btn svg { width: 20px !important; height: 20px !important; }

    /* ---- Banner ---- */
    .bannersection { min-height: 100svh !important; }
    .txtbannersec h1 { font-size: 32px !important; line-height: 1.2 !important; }
    .txtbannersec p { font-size: 16px !important; }
    .banner_review_wrap { flex-direction: column; gap: 10px; align-items: flex-start; }
    .banner_gbiz_btn { width: fit-content; }

    /* ---- About section ---- */
    section.abt2 { padding: 0 !important; }
    .abt2_right h2 { font-size: 28px !important; }
    .abt2_stats { flex-direction: column !important; gap: 16px !important; }
    .abt2_divider { display: none !important; }

    /* ---- Services ---- */
    .svc_bento { grid-template-columns: 1fr !important; }

    /* ---- Why choose us ---- */
    .wcu2_grid { grid-template-columns: 1fr !important; }
    .wcu2_item { flex-direction: row !important; text-align: left !important; }

    /* ---- Testimonials ---- */
    .tst2_slider { gap: 16px !important; }

    /* ---- Home blog ---- */
    .blg3_grid { grid-template-columns: 1fr !important; }
    .blg3_top { flex-direction: column !important; align-items: flex-start !important; gap: 12px; }
    .blg3_inner { padding: 50px 20px !important; }

    /* ---- Gallery ---- */
    .masonary-gallery { grid-template-columns: repeat(2,1fr) !important; }

    /* ---- CTA band ---- */
    .cta_band_left { padding: 36px 24px !important; }
    .cta_band_left h2 { font-size: 28px !important; }
    .cta_band_right { padding: 32px 24px !important; flex-direction: column !important; }
    .cta_band_contacts { flex-direction: column; gap: 12px; }

    /* ---- Footer ---- */
    .ft2_inner { grid-template-columns: 1fr !important; padding: 48px 20px !important; }
    .ft2_brand img { height: 36px; }
    .ft2_bottom { padding: 0 !important; }
    .ft2_bottom_inner { padding: 20px !important; font-size: 13px; }

    /* ---- IPB2 subbanner ---- */
    .ipb2_inner { padding: 70px 20px 50px !important; }
    .ipb2_text h1 { font-size: 28px !important; line-height: 1.25 !important; }
    .ipb2_stats { gap: 16px !important; }
    .ipb2_stat_val { font-size: 22px !important; }

    /* ---- Blog sidebar ---- */
    .blog_sidebar { grid-template-columns: 1fr !important; }

    /* ---- Blog sort bar ---- */
    .blog_topbar { flex-direction: column !important; gap: 12px !important; align-items: flex-start !important; }

    /* ---- Blog cards ---- */
    .blog_grid { grid-template-columns: 1fr !important; }

    /* ---- Single post ---- */
    .sng_banner { min-height: 260px !important; }
    .sng_banner_inner { padding: 100px 20px 40px !important; }
    .sng_banner h1 { font-size: 26px !important; }
    .sng_body .container { padding: 0 20px !important; }
    .sng_layout { padding: 0 !important; }
    .sng_body { padding-top: 30px !important; }

    /* ---- Contact ---- */
    .cnt2 .container { padding: 0 20px !important; }
    .cnt2_inner { padding: 40px 0 !important; gap: 32px !important; }

    /* ---- Gallery page ---- */
    .gallery_page_section .masonary-gallery { grid-template-columns: repeat(2,1fr) !important; }

    /* ---- 404 ---- */
    .pg404 { padding: 80px 20px !important; }
    .pg404_ghost { font-size: 120px !important; }

    /* ---- Title sections ---- */
    .title_sec h2 { font-size: 28px !important; }
    .title_sec p { font-size: 15px !important; }

    /* ---- Section padding reduction ---- */
    section.abt2,
    section.why_choose_us,
    section.testimonials_section,
    section.ourprojects.home_gallery,
    section.blg3,
    section.news_events { padding: 10px 0 !important; }
}

/* ---------- Mobile: 480px and below ---------- */
@media (max-width: 480px) {
    /* Header tighter */
    .wrap_secondheader { padding: 8px 16px; }
    .logosec img { height: 34px; }
    .togglermobile { margin-left: 0; }

    /* Banner */
    .txtbannersec h1 { font-size: 26px !important; line-height: 1.2 !important; }
    .banner_cnt { padding-top: 80px !important; }

    /* Gallery single col */
    .masonary-gallery { grid-template-columns: 1fr !important; }
    .gallery_page_section .masonary-gallery { grid-template-columns: 1fr !important; }

    /* Blog */
    .blg3_card .blg3_thumb { height: 200px !important; }

    /* Footer */
    .ft2_socials a { width: 36px; height: 36px; }

    /* IPB2 */
    .ipb2_stats { flex-direction: column !important; align-items: flex-start !important; }

    /* CTA band */
    .cta_band_btn { width: 100% !important; justify-content: center !important; }

    /* Nav drawer full width on very small screens */
    .navigation_sec .navbar > ul { width: 100% !important; }

    /* Single */
    .sng_nav { gap: 8px !important; }
    .sng_nav_title { display: none !important; }

    /* Contact */
    .cnt2_info_item { flex-direction: column !important; gap: 8px !important; }

    /* Comments */
    .sng_comments .comment-form .form-submit input { width: 100% !important; }
}

/* ---- Floating WhatsApp FAB on mobile ---- */
@media (max-width: 768px) {
    .wa_fab {
        position: fixed;
        bottom: 24px;
        right: 20px;
        z-index: 900;
        width: 54px;
        height: 54px;
        background: #25d366;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 4px 20px rgba(37,211,102,0.45);
        text-decoration: none;
        animation: wa_pulse 2.5s ease-in-out infinite;
    }
    @keyframes wa_pulse {
        0%,100% { box-shadow: 0 4px 20px rgba(37,211,102,0.45); }
        50% { box-shadow: 0 4px 30px rgba(37,211,102,0.7), 0 0 0 8px rgba(37,211,102,0.1); }
    }
}

/* ---- Banner h1: smaller so full text shows, no clipping ---- */
@media (max-width: 768px) {
    .bannersection .banner_cnt .wrap_bannersec h1 {
        font-size: 26px !important;
        line-height: 1.18 !important;
        letter-spacing: -0.5px !important;
    }
    /* Ensure review badge score (4.8) is visible */
    .bgr_score {
        display: inline !important;
        font-size: 18px !important;
        color: #fff !important;
    }
    /* Review badges side by side on mobile */
    .banner_review_wrap {
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 10px !important;
        align-items: center !important;
    }
}

@media (max-width: 480px) {
    .bannersection .banner_cnt .wrap_bannersec h1 {
        font-size: 22px !important;
        line-height: 1.2 !important;
    }
    .banner_review_wrap {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
}

/* =============================================
   MOBILE TAB BAR  (≤ 1024px)
   ============================================= */
@media (max-width: 1024px) {

    /* Hide footer and CTA band — replaced by tab bar */
    .ft2,
    .cta_band {
        display: none !important;
    }

    /* Hide old WhatsApp FAB — tab bar has it */
    .wa_fab {
        display: none !important;
    }

    /* Body bottom padding so content isn't hidden behind tab bar */
    body {
        padding-bottom: 66px;
    }

    /* Tab bar */
    .mob_tabbar {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 9990;
        background: #ffffff;
        border-top: 1px solid #ede8e3;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.08);
        height: 62px;
        align-items: stretch;
        /* safe-area for iOS home bar */
        padding-bottom: env(safe-area-inset-bottom);
    }

    .mob_tab {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        color: #9b8f84;
        text-decoration: none;
        font-size: 9px;
        font-weight: 500;
        letter-spacing: 0;
        transition: color 0.2s;
        padding: 6px 2px;
        -webkit-tap-highlight-color: transparent;
    }

    .mob_tab svg {
        flex-shrink: 0;
        stroke: currentColor;
        transition: color 0.2s;
        width: 20px !important;
        height: 20px !important;
    }


    .mob_tab.active,
    .mob_tab:active {
        color: #0e4889;
    }

    .mob_tab.active svg,
    .mob_tab:active svg {
        color: #0e4889;
    }


    /* Contact tab — highlight in theme color */
    .mob_tab_cta {
        color: #0e4889;
    }
    .mob_tab_cta svg {
        color: #0e4889;
    }
}

/* Desktop: hide tab bar entirely */
@media (min-width: 1025px) {
    .mob_tabbar {
        display: none !important;
    }
}

/* =============================================
   HOMEPAGE — COMPACT MOBILE  (≤ 1024px)
   ============================================= */
@media (max-width: 1024px) {

    /* ── Banner ── */
    .bannersection {
        min-height: 55vh !important;
        height: 55vh !important;
    }
    .wrap_bannersec { padding: 0 !important; }
    .txtbannersec { padding: 20px 20px 0 !important; }
    .txtbannersec h1 {
        font-size: 26px !important;
        line-height: 1.25 !important;
        margin-bottom: 8px !important;
    }
    /* Hide the long banner subtitle on mobile */
    .txtbannersec > p { display: none !important; }
    .banner_review_wrap {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        gap: 8px !important;
        margin-top: 12px !important;
    }
    /* Both pills same fixed height + radius */
    .banner_google_review,
    .banner_gbiz_btn {
        height: 60px !important;
        min-height: unset !important;
        border-radius: 12px !important;
        box-sizing: border-box !important;
        padding: 0 12px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-shrink: 0 !important;
    }
    .banner_google_review { gap: 10px !important; }
    .bgr_logo { width: 28px !important; height: 28px !important; border-radius: 6px !important; }
    .bgr_score { font-size: 15px !important; }
    .bgr_star_icons svg { width: 11px !important; height: 11px !important; }
    .bgr_label { font-size: 10px !important; }
    .banner_gbiz_btn { font-size: 12px !important; gap: 6px !important; }
    .banner_scroll { display: none !important; }

    /* ── About (abt2) ── */
    .abt2 { padding: 28px 0 !important; }
    .abt2_inner { flex-direction: column !important; gap: 16px !important; }
    /* Hide image column — text & stats are enough on mobile */
    .abt2_left { display: none !important; }
    .abt2_right { padding: 0 !important; width: 100% !important; }
    .abt2_eyebrow { font-size: 11px !important; }
    .abt2_right h2 { font-size: 20px !important; margin: 6px 0 8px !important; }
    .abt2_right > p { font-size: 13px !important; line-height: 1.6 !important; margin-bottom: 14px !important; }
    /* Stats — material card, single inline row */
    .abt2_stats {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        gap: 0 !important;
        margin-bottom: 16px !important;
        padding: 14px 8px !important;
        background: #ffffff !important;
        border-radius: 14px !important;
        box-shadow: 0 2px 12px rgba(0,0,0,0.08), 0 0 0 1px rgba(0,0,0,0.05) !important;
    }
    .abt2_stat {
        flex: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        padding: 6px 4px !important;
    }
    .abt2_stat strong { font-size: 18px !important; letter-spacing: -0.5px !important; }
    .abt2_stat span {font-size: 8px !important;}
    /* Keep the vertical dividers */
    .abt2_divider {
        width: 1px !important;
        align-self: stretch !important;
        background: #ede8e3 !important;
        margin: 6px 0 !important;
    }

    /* ── Services (svc_bento) ── */
    .svc_bento { padding: 16px 0 !important; }
    .svc_inner { padding: 0 16px !important; }
    .svc_head { flex-direction: row !important; align-items: center !important; gap: 8px !important; margin-bottom: 14px !important; justify-content: space-between !important; }
    .svc_head_left { flex: 1 !important; }
    /* Hide eyebrow label */
    .svc_eyebrow { display: none !important; }
    .svc_head h2 { font-size: 18px !important; margin: 0 !important; }
    /* Horizontal scroll row instead of stacked */
    .svc_grid {
        display: flex !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        gap: 10px !important;
        padding-bottom: 8px !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch !important;
    }
    .svc_grid::-webkit-scrollbar { display: none !important; }
    .svc_card,
    .svc_card--wide {
        flex: 0 0 72vw !important;
        max-width: 260px !important;
        min-height: 200px !important;
        scroll-snap-align: start !important;
        grid-column: unset !important;
        border-radius: 12px !important;
        overflow: hidden !important;
        position: relative !important;
    }
    /* Image fills entire card (desktop pattern) */
    .svc_card_img {
        position: absolute !important;
        inset: 0 !important;
        height: auto !important;
        overflow: hidden !important;
    }
    .svc_card_img img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center !important;
    }
    .svc_card_body { padding: 12px !important; }
    .svc_num { font-size: 11px !important; }
    .svc_card_body h3 { font-size: 14px !important; margin: 4px 0 4px !important; }
    /* Hide card descriptions */
    .svc_card_body p { display: none !important; }

    /* ── Why Choose Us (wch3) ── */
    .wch3_wrap { padding: 16px 0 !important; }
    .wch3_card {
        display: block !important;
        border-radius: 14px !important;
        margin: 0 16px !important;
        overflow: hidden !important;
        width: calc(100% - 32px) !important;
        box-sizing: border-box !important;
        min-height: unset !important;
    }
    /* Hide image panel — must be truly removed from flow */
    .wch3_left { display: none !important; width: 0 !important; height: 0 !important; overflow: hidden !important; }
    .wch3_right {
        padding: 16px !important;
        width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        flex: 1 !important;
    }
    .wch3_right_inner {
        padding: 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }
    .wch3_label { font-size: 11px !important; margin-bottom: 6px !important; }
    .wch3_right h2 { 
        font-size: 28px !important;
        margin-bottom: 8px !important;
        margin-top: 10px;
     }
    .wch3_right > .wch3_right_inner > p { display: none !important; }
    .wch3_chips {
        display: block !important;
        margin-bottom: 10px !important;
    }
    .wch3_chip {
        display: block !important;
        width: 100% !important;
        padding: 7px 10px !important;
        font-size: 13px !important;
        margin-bottom: 4px !important;
        box-sizing: border-box !important;
    }
    /* Map row — stack vertically on mobile */
    .wch3_map_row {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 10px !important;
        padding: 12px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        width: 100% !important;
    }
    /* Top row: pin + address inline */
    .wch3_map_pin { flex-shrink: 0 !important; width: 28px !important; height: 28px !important; }
    .wch3_map_info {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100% !important;
        min-width: 0 !important;
    }
    .wch3_map_info strong {
        font-size: 13px !important;
        white-space: normal !important;
        word-break: break-word !important;
    }
    /* Button full width below */
    .wch3_gmaps_btn {
        display: flex !important;
        width: 100% !important;
        justify-content: center !important;
        font-size: 13px !important;
        padding: 10px !important;
        box-sizing: border-box !important;
    }
    .wch3_map_sub { display: none !important; }

    /* ── Testimonials (tst2) ── */
    .tst2 { padding: 16px 0 !important; }
    .tst2_inner { padding: 0 16px !important; }
    .tst2_head {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        flex-wrap: nowrap !important;
        margin-bottom: 14px !important;
        gap: 8px !important;
    }
    .tst2_eyebrow { display: none !important; }
    .tst2_head h2 {
        font-size: 18px !important;
        margin: 0 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        flex: 1 !important;
        min-width: 0 !important;
    }
    .tst2_rating_badge { display: none !important; }
    /* Horizontal scroll */
    .tst2_grid {
        display: flex !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        gap: 10px !important;
        padding-bottom: 6px !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch !important;
    }
    .tst2_grid::-webkit-scrollbar { display: none !important; }
    .tst2_card {
        flex: 0 0 80vw !important;
        max-width: 280px !important;
        scroll-snap-align: start !important;
        padding: 14px !important;
        border-radius: 12px !important;
    }
    .tst2_card p { font-size: 13px !important; line-height: 1.5 !important; }
    /* Hide "Verified Customer" tag */
    .tst2_via { display: none !important; }

    /* ── Gallery (ourprojects) ── */
    .ourprojects,
    .home_gallery,
    section.ourprojects.home_gallery { padding: 16px 0 !important; }
    .gallery_lightbox_sec { min-height: unset !important; }
    .masonary-gallery { min-height: unset !important; }
    .gallery_item { min-height: unset !important; height: auto !important; }
    .home_gallery .gallery_item { height: 160px !important; max-height: 160px !important; overflow: hidden !important; }
    .home_gallery .gallery_item img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
    /* Title row — h2 left, CTA right like blg3_top / tst2_head */
    .home_gallery .title_sec,
    .ourprojects .title_sec {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
        margin-bottom: 12px !important;
        flex-wrap: nowrap !important;
        text-align: left !important;
        padding: 0 0px !important;
        width: auto;
    }
    .lightbox-content {
        align-items: center;
        display: flex;
        justify-content: space-around;
    }
    .home_gallery .title_sec h2,
    .ourprojects .title_sec h2 {
        font-size: 18px !important;
        margin: 0 !important;
        flex: 1 !important;
        min-width: 0 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        text-align: left !important;
    }
    .home_gallery .title_sec h2 span,
    .ourprojects .title_sec h2 span {
        white-space: nowrap !important;
    }
    /* Hide the long description under the title */
    .title_sec p { display: none !important; }
    .gallery_cta_wrap { display: none !important; }
    .title_sec_cta {
        display: inline-flex !important;
        align-items: center !important;
        gap: 4px !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        color: #e05a2b !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        flex-shrink: 0 !important;
    }
    .gallery_lightbox_sec { margin-top: 10px !important; }
    .home_gallery .masonary-gallery,
    .masonary-gallery {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        columns: unset !important;
        gap: 6px !important;
    }
    .gallery_item { margin-bottom: 0 !important; break-inside: avoid; }
    .gallery_item img { width: 100% !important; height: 140px !important; object-fit: cover !important; display: block !important; border-radius: 6px !important; }
    /* Show all 8 images */
    .gallery_item:nth-child(n+5) { display: block !important; }

    /* ── Blog (blg3) ── */
    .blg3 { padding: 16px 0 !important; }
    .blg3_inner { padding: 0 16px !important; }
    .blg3_top {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
        margin-bottom: 10px !important;
    }
    .blg3_eyebrow { display: none !important; }
    .blg3_top h2 { font-size: 18px !important; margin: 0 !important; }
    /* Horizontal scroll for blog cards */
    .blg3_grid {
        display: flex !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        gap: 10px !important;
        padding-bottom: 6px !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch !important;
        align-items: stretch !important;
    }
    .blg3_grid::-webkit-scrollbar { display: none !important; }
    .blg3_card {
        flex: 0 0 72vw !important;
        max-width: 260px !important;
        min-height: unset !important;
        height: auto !important;
        scroll-snap-align: start !important;
        border-radius: 12px !important;
        overflow: hidden !important;
        display: flex !important;
        flex-direction: column !important;
    }
    .blg3_thumb {
        height: 140px !important;
        min-height: unset !important;
        position: relative !important;
        flex-shrink: 0 !important;
    }
    .blg3_body {
        padding: 12px !important;
        flex: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 6px !important;
    }
    .blg3_body h3 { font-size: 14px !important; margin: 0 !important; line-height: 1.4 !important; }
    .blg3_meta_row { display: flex !important; }
}

/* ── Phone only (≤ 480px) ── */
@media (max-width: 480px) {
    .bannersection { height: 50vh !important; min-height: 50vh !important; }
    .txtbannersec h1 { font-size: 22px !important; }
    .abt2,
    .svc_bento,
    .wch3_wrap,
    .tst2,
    .ourprojects,
    .home_gallery,
    .blg3 { padding: 28px 0 !important; }
    .svc_card,
    .svc_card--wide { flex: 0 0 80vw !important; }
    .blg3_card { flex: 0 0 80vw !important; }
    .tst2_card { flex: 0 0 85vw !important; }
}

@media (min-width: 1025px) {
    .title_sec_cta { display: none !important; }
}

/* =============================================
   IPAD — 3-col grid for services & blog (768px–1024px)
   ============================================= */
@media (min-width: 768px) and (max-width: 1024px) {

    /* Services — 3-col grid, full width */
    .svc_grid {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        flex-direction: unset !important;
        overflow-x: unset !important;
        gap: 12px !important;
        padding-bottom: 0 !important;
    }
    .svc_card,
    .svc_card--wide {
        flex: unset !important;
        max-width: unset !important;
        min-height: 220px !important;
        width: auto !important;
        scroll-snap-align: unset !important;
    }
    .svc_card--wide { grid-column: span 1 !important; }

    /* Gallery — 2-col grid, show all 8 images */
    .masonary-gallery {
        columns: 2 !important;
        column-gap: 10px !important;
    }
    .gallery_item { margin-bottom: 10px !important; }
    .gallery_item:nth-child(n+5) { display: block !important; }

    /* Blog — 3-col grid, full width */
    .blg3_grid {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        flex-direction: unset !important;
        overflow-x: unset !important;
        gap: 12px !important;
        padding-bottom: 0 !important;
    }
    .blg3_card {
        flex: unset !important;
        max-width: unset !important;
        width: auto !important;
        height: 320px !important;
        min-height: unset !important;
        position: relative !important;
        overflow: hidden !important;
        scroll-snap-align: unset !important;
    }
    .blg3_thumb {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
    }
}

/* =============================================
   GALLERY PAGE — 2-col grid on all mobile sizes
   ============================================= */
@media (max-width: 1024px) {
    .gallery_page_section .masonary-gallery {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }
    .gallery_page_section .masonary-gallery .gallery_item {
        height: 160px !important;
        border-radius: 8px !important;
    }
}

/* =============================================
   INNER PAGE BANNER (ipb2) — compact mobile
   ============================================= */
@media (max-width: 1024px) {
    .cnt2_right{
        padding: 15px;
    }
    .ipb2 {
        min-height: unset !important;
        max-height: 120px !important;
        height: 30px !important;
        align-items: flex-end !important;
    }
    .ipb2_bg {
        background-position: center top !important;
    }
    .ipb2_inner {
        padding: 0 16px 16px !important;
        gap: 10px !important;
    }
    /* Hide eyebrow label */
    .ipb2_eyebrow { display: none !important; }
    .ipb2_breadcrumb { font-size: 11px !important; margin-bottom: 2px !important; }
    .ipb2_content h1 {
        font-size: 24px !important;
        line-height: 1.2 !important;
        margin: 0 !important;
        letter-spacing: .01px;
    }
    /* Hide the subtitle paragraph */
    .ipb2_content p { display: none !important; }
    /* Stats row — compact inline, no card background */
    .ipb2_stats {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        backdrop-filter: blur(6px) !important;
        padding: 8px 12px !important;
        gap: 0 !important;
        border-radius: 10px !important;
        margin-bottom: 0 !important;
        width: auto;
    }
    .ipb2_stat {
        flex: 1 !important;
        padding: 0 6px !important;
        text-align: center !important;
    }
    .ipb2_stat strong { font-size: 15px !important; color: #fff !important; }
    .ipb2_stat span { font-size: 8px !important; color: rgba(255,255,255,0.75) !important; letter-spacing: 0 !important; }
    .ipb2_stat_div { width: 1px !important; background: rgba(255,255,255,0.25) !important; align-self: stretch !important; }
}

/* =============================================
   ABOUT PAGE — content sections mobile
   ============================================= */
@media (max-width: 1024px) {
    /* Stats inline — fix overflow by tightening padding & font */
    .ipb2_stat {
        padding: 0 4px !important;
    }
    .ipb2_stat strong { font-size: 16px !important; }
    .ipb2_stat span { font-size: 8px !important; letter-spacing: 0 !important; }

    /* About intro section — kill the 110px top padding */
    .txt_abtstartsec {
        width: 100% !important;
        padding: 20px 0px!important;
        margin: 0 !important;
    }
    .txt_abtstartsec h2 {
        font-size: 22px !important;
        line-height: 1.25 !important;
        margin-bottom: 12px !important;
        text-align: left !important;
    }
    .txt_abtstartsec p {
        font-size: 13px !important;
        line-height: 1.6 !important;
        text-align: left !important;
        margin-bottom: 10px !important;
    }
    .cnt2{
        padding: 0px 0px 100px !important;
    }

    /* Who We Are section — kill giant padding/margin */
    section.welcome_sections.cmpanyseca {
        padding: 28px 0 !important;
        margin-top: 0 !important;
    }
    .wrap_welcsec {
        flex-direction: column !important;
        gap: 16px !important;
    }
    .leftwelsec {
        width: 100% !important;
    }
    .leftwelsec h3 { font-size: 12px !important; margin-bottom: 4px !important; }
    .leftwelsec h2 { font-size: 20px !important; line-height: 1.3 !important; margin-bottom: 12px !important; }
    .leftwelsec p { font-size: 13px !important; line-height: 1.6 !important; }
    .board_quote {
        font-size: 13px !important;
        line-height: 1.5 !important;
        padding: 46px 14px 0 0!important
        margin-top: 10px !important;
    }
    /* Hide the decorative image block on mobile */
    .rightwelsec.welcomeimg { display: none !important; }
}

/* =============================================
   FLOATING SOCIAL FAB — mobile only
   ============================================= */
.mob_social_fab { display: none; }

@media (max-width: 1024px) {
    .mob_social_fab {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        position: fixed;
        right: calc(10% - 23px);
        bottom: calc(62px + env(safe-area-inset-bottom) + 8px);
        z-index: 9980;
    }

    /* Toggle button — always visible */
    .mob_fab_toggle {
        width: 46px;
        height: 46px;
        border-radius: 50%;
        background: #2aa8f9;
        border: none;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 3px 12px rgba(14,72,137,0.38);
        cursor: pointer;
        flex-shrink: 0;
        transition: transform 0.2s ease, background 0.2s ease;
    }
    .mob_fab_toggle:active { transform: scale(0.92); }

    /* Icon visibility */
    .mob_fab_icon_close { display: none; }
    .mob_fab_icon_open  { display: block; }
    .mob_social_fab.open .mob_fab_icon_close { display: block; }
    .mob_social_fab.open .mob_fab_icon_open  { display: none; }

    /* Social buttons — hidden by default */
    .mob_social_fab_btn {
        width: 42px;
        height: 42px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 2px 10px rgba(0,0,0,0.22);
        opacity: 0;
        transform: translateY(20px) scale(0.7);
        pointer-events: none;
        transition: opacity 0.22s ease, transform 0.22s ease;
    }

    /* Closed: stagger top→bottom (reverse, no animation needed) */
    .mob_social_fab_btn:nth-child(1) { transition-delay: 0.08s; }
    .mob_social_fab_btn:nth-child(2) { transition-delay: 0.04s; }
    .mob_social_fab_btn:nth-child(3) { transition-delay: 0s; }

    /* When open, animate bottom→top: IG first (closest), FB, WA last (farthest) */
    .mob_social_fab.open .mob_social_fab_btn {
        opacity: 1;
        transform: translateY(0) scale(1);
        pointer-events: auto;
    }
    .mob_social_fab.open .mob_social_fab_btn:nth-child(3) { transition-delay: 0s; }
    .mob_social_fab.open .mob_social_fab_btn:nth-child(2) { transition-delay: 0.07s; }
    .mob_social_fab.open .mob_social_fab_btn:nth-child(1) { transition-delay: 0.14s; }

    .mob_social_fab_btn:active { transform: scale(0.92); }
    .mob_fab_wa  { background: #25d366; }
    .mob_fab_fb  { background: #1877f2; }
    .mob_fab_ig  { background: linear-gradient(135deg, #f58529 0%, #dd2a7b 50%, #515bd4 100%); }

    /* hide old single wa_fab if still present */
    .wa_fab { display: none !important; }
}

/* =============================================
   REVIEWS PAGE — no scroll, grid layout
   ============================================= */
@media (max-width: 1024px) {
    .reviews_page .tst2_grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        flex-direction: unset !important;
        overflow-x: unset !important;
        overflow: visible !important;
        scroll-snap-type: unset !important;
        gap: 12px !important;
        padding-bottom: 0 !important;
    }
    .reviews_page .tst2_card {
        flex: unset !important;
        max-width: unset !important;
        width: auto !important;
        scroll-snap-align: unset !important;
    }
}

@media (max-width: 480px) {
    .reviews_page .tst2_grid {
        grid-template-columns: 1fr !important;
    }
}

/* =============================================
   REVIEWS FILTER — sticky top offset
   ============================================= */
@media (max-width: 1024px) {
    /* Mobile sticky header is ~60px tall */
    .reviews_filter {
        top: 60px !important;
    }
    /* When WP admin bar is visible (logged in), add its 46px */
    .admin-bar .reviews_filter {
        top: 106px !important;
    }
}

@media (max-width: 1024px) {
    .svc_view_all {
        padding: 7px 16px !important;
        font-size: 12px !important;
        gap: 6px !important;
        background: none !important;
        border-color: transparent !important;
        color: #e05c36 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .svc_view_all svg { width: 11px !important; height: 11px !important; }

    .abt2_cta {
        padding: 9px 20px !important;
        font-size: 13px !important;
        gap: 6px !important;
        box-shadow: none !important;
    }
    .abt2_cta svg { width: 12px !important; height: 12px !important; }
}
