/* --- Definitive Mobile Header Fix --- */
@media (max-width: 991px) {
    /* 1. Make Header Sticky */
    .site-header {
        position: fixed !important;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1000;
        background-color: #ffffff !important; /* Ensure solid background */
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }

    /* 2. Prevent Content Overlap */
    body {
        padding-top: 0 !important;
        overflow-x: hidden !important;
    }

    /* 3. Handle WordPress Admin Bar */
    body.admin-bar .site-header {
        top: 46px;
    }
    body.admin-bar {
        padding-top: 126px; /* Header height + Admin bar height */
    }

    /* 4. Align Logo & Menu in One Row */
    /* Prevent horizontal overflow on all wrappers */
    #page, .site, .main-slider-wrap, .main-slider, .main-slider .slide-item, .section-feature-posts-area .feature-posts-one .row {
        max-width: 100vw !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }
    /* Ensure hero slider has fixed height */
    .main-slider-wrap.slider-layout-one {
        height: 400px !important;
        max-height: 400px !important;
        overflow: hidden !important;
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    .main-slider-wrap.slider-layout-one .main-slider {
        height: 100% !important;
        min-height: 400px !important;
    }
    .main-slider-wrap.slider-layout-one .slide-item {
        height: 100% !important;
        min-height: 400px !important;
    }
    .bottom-header {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: #fff;
    box-shadow: none !important;
}
body {
    padding-top: 0 !important;
}
.bottom-header .container > .row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    width: 100%;
}

/* Hide the full menu, show hamburger on mobile */
.main-navigation {
    display: none !important;
}
@media (max-width: 991px) {
  .slicknav_menu {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    position: fixed !important;
    top: 0;
    right: 0;
    left: auto;
    z-index: 2000 !important;
    background: #fff !important;
    box-shadow: none !important;
    border-radius: 0 0 0 8px;
    height: 56px;
    width: auto;
    padding: 0 10px;
  }
  .slicknav_menu .slicknav_btn {
    margin-left: 12px;
    margin-right: 0;
  }
  /* Prevent overlap with logo */
  .bottom-header .site-branding {
    margin-right: 60px;
    display: flex !important;
    align-items: center !important;
    flex: 0 1 auto !important;
  }
}



/* Logo and menu icon side by side */
.bottom-header .site-branding {
    display: flex !important;
    align-items: center !important;
    flex: 0 1 auto !important;
}

.slicknav_menu .slicknav_btn {
    margin-left: 12px;
    margin-right: 0;
}


    /* 5. Ensure Correct Sizing and Order */
    .bottom-header .col-lg-3, /* Logo container */
    .bottom-header .col-lg-9 { /* Menu container */
        flex: 1 1 auto;
        width: auto;
        padding: 0 15px;
    }

    .site-header .site-branding { /* Logo */
        margin-right: auto; /* Push menu to the right */
    }

    .site-header .main-navigation { /* Menu */
        display: flex !important;
        justify-content: flex-end;
    }
}




/* Fix: Ensure service/feature images are visible on mobile */
@media screen and (max-width: 767px) {
  .section-feature-posts-area .feature-posts-image {
    min-height: 220px; /* Adjust this height as needed */
  }
}

/* Display top header elements horizontally on mobile */
@media (max-width: 991.98px) {
  .top-header .col-lg-8,
  .header-btn {
    display: block !important;
  }

  .top-header-inner > .container > .row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }

  .header-contact-info {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    margin-bottom: 10px;
  }

  .header-contact-info .contact-details {
    margin: 5px 10px;
  }

  .header-btn {
    text-align: center;
    width: 100%;
  }
}

/* Align logo and menu horizontally on mobile header */
@media (max-width: 991.98px) {
  .bottom-header .container > .row {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
  }
  .bottom-header .col-lg-3,
  .bottom-header .col-lg-9 {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
  }
  .bottom-header .col-lg-3 {
    display: flex;
    align-items: center;
  }
  .bottom-header .col-lg-9 {
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
  .main-navigation-wrap,
  .main-navigation {
    width: auto;
  }
  .alt-menu-icon.d-lg-none {
    display: flex !important;
    align-items: center;
    margin-left: 12px;
  }
}

/* Mobile header: Logo left, menu right, sticky with top margin */
@media (max-width: 991.98px) {
  .site-header {
    position: sticky !important;
    top: 15px; /* 4-5mm below top margin */
    left: 0;
    right: 0;
    z-index: 999;
    background: #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    padding: 8px 0;
  }
  
  .bottom-header .container {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }
  
  .bottom-header .col-lg-3 {
    flex: 0 0 auto;
    width: auto;
    order: 1;
  }
  
  .bottom-header .col-lg-9 {
    flex: 0 0 auto;
    width: auto;
    order: 2;
    display: flex;
    justify-content: flex-end;
  }
  
  /* Show mobile menu icon on the right */
  .alt-menu-icon.d-lg-none {
    display: flex !important;
    align-items: center;
  }
  
  /* Hide desktop navigation */
  .main-navigation {
    display: none !important;
  }
}
@media (max-width: 991px) {
  .slicknav_nav {
    position: fixed !important;
    top: 56px !important;  /* Height of your sticky header/menu icon */
    right: 0;
    left: 0;
    width: 100vw;
    max-height: calc(100vh - 56px);
    overflow-y: auto;
    background: #fff;
    z-index: 1999 !important;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  }
}