/* Fix for horizontal overflow/whitespace on mobile */
html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

.page-wrapper {
    overflow-x: hidden !important;
    max-width: 100% !important;
}

/* Fix for container overflow */
.container,
.container-fluid {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* Fix for row negative margins causing overflow */
.row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Ensure images don't overflow */
img {
    max-width: 100% !important;
    height: auto !important;
}

iframe {
    max-width: 100% !important;
}

/* Fix for map container */
#map {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

#map iframe {
    width: 100% !important;
    max-width: 100% !important;
}

/* Smooth scroll offset for anchor links */
html {
    scroll-behavior: smooth;
}

/* Add padding-top to sections to account for sticky header */
section[id] {
    scroll-margin-top: 160px; /* Adjust based on header height */
}

/* For smaller screens, adjust the offset */
@media (max-width: 991px) {
    section[id] {
        scroll-margin-top: 120px;
    }
}

/* Match mobile menu font styling with desktop menu */
.mobile-menu li a {
    font-weight: 500 !important;
    font-size: 1.4rem !important;
    letter-spacing: -.01em !important;
    font-family: "Poppins", sans-serif !important;
}

.mobile-menu > li > a {
    font-weight: 500 !important;
    font-size: 1.4rem !important;
    letter-spacing: -.01em !important;
}

/* Fix for specific sections that might cause overflow */
.intro-slider-container,
.main,
.footer {
    max-width: 100vw !important;
    overflow-x: hidden !important;
}

/* Mobile specific fixes */
@media (max-width: 767px) {
    .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    .row {
        margin-left: -15px !important;
        margin-right: -15px !important;
    }
    
    /* Fix for any full-width sections */
    section,
    .bg-light-2,
    .deal {
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }
    
    /* Responsive map height for mobile */
    #map iframe {
        height: 300px !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    #map iframe {
        height: 400px !important;
    }
}

@media (min-width: 992px) {
    #map iframe {
        height: 510px !important;
    }
}