@media screen and (max-width: 600px) {
    /* Adjust header and navigation styles */
    header {
        padding: 20px 10%; /* Reduce padding */
        flex-direction: column; /* Stack logo and navigation vertically */
    }

    .logo img {
        height: 60px; /* Adjust logo size */
        margin-bottom: 30px;
    }

    nav ul {
        flex-direction: column; /* Stack navigation items vertically */
    }

    nav ul li {
        padding: 10px; /* Reduce padding for navigation items */
        margin: 0; /* Remove margin for a more compact layout */
        font-size: 14px; /* Adjust font size */
    }

    nav ul li .dropdown {
        width: 100%; /* Ensure dropdown spans full width */
        box-sizing: border-box;
    }

    .call-now {
        padding: 10px; /* Adjust button padding */
        font-size: 14px; /* Reduce font size */
    }

    .social {
        padding: 10px 0; /* Adjust padding for social icons */
    }

    /* Adjust fixed top bar */
    .top {
        height: 1px; /* Reduce top bar height */
    }

    .scrolled {
        background-color: rgba(0, 0, 0, 0.7); /* Darker background for better contrast */
    }

    .scrolled .logo img {
        height: 45px; /* Further reduce logo size when scrolled */
        
    }
}

@media screen and (max-width: 600px) {
    /* Hero section adjustments */
    .hero {
        height: 100vh; /* Reduce the hero section height */
        clip-path: none; /* Disable the clip path for simpler layout */
    }

    .hero-overlay {
        padding: 20px; /* Reduce padding */
        font-size: 14px; /* Adjust font size */
        box-sizing: border-box;
        width: 90%;
    }
.hero-overlay div span {
    display: block;
}
    .hero-overlay h1 {
        font-size: 20px; /* Smaller heading */
    }

    .hero-overlay h2 {
        font-size: 18px;
        line-height: 44px;
    }

    /* Intro section adjustments */
    .intro {
        flex-direction: column; /* Stack the sections vertically */
        text-align: left; /* Center align content */
        padding: 15px; /* Reduce padding */
    }

    .left-c, .right-c {
        width: 100%; /* Make both sections full width */
    }

    .left-c span, .right-c span {
        padding: 20px; /* Reduce padding */
    }

    /* Gallery adjustments */
    .gallery {
        flex-direction: column; /* Stack items vertically */
        gap: 10px; /* Reduce gap between items */

    }
    .sub_page, .sub_page_gallery {
        display: block;
    }
    .gallery div {
        width: 100%; /* Make each gallery item full width */
        height: auto; /* Adjust height for responsiveness */
    }
.gallery div img {
    width: calc(100% - 30px);
    transition: 0.5s all;
    opacity: 0.5;
    margin: 0 15px;
}
    /* Footer adjustments */
    .footer-container {
        flex-direction: column; /* Stack footer sections vertically */
        padding: 10px; /* Reduce padding */
    }

    .footer-menu, .footer-contact, .footer-logos {
        text-align: center; /* Center align each section */
        border: none; /* Remove borders for cleaner layout */
        padding: 10px 0; /* Add some vertical spacing */
        min-width: 100%; /* Ensure sections take full width */
    }

    .footer-logos img {
        width: 70px; /* Resize images for smaller screens */
    }

    .footer-menu ul {
        padding: 0; /* Adjust padding for compact layout */
    }

    .footer-contact p {
        font-size: 12px; /* Adjust font size for smaller devices */
    }

    .footer-copyright {
        font-size: 0.8em; /* Make text slightly smaller */
        padding-top: 5px; /* Adjust padding */
    }

.content {
    padding: 30px 3%;
    text-align: left;
}
.footer-menu ul {
    text-align: center;
}

.form-group {
    position: relative;
    width: 100%;
    float: unset;
    box-sizing: border-box;
    padding: 8px 15px;
  }
  .connect-with-us {
    padding: 30px;
    box-sizing: border-box;
  }

  .homeimg {
    width: 100%;
    box-sizing: border-box;
    padding: 0 0 0 0;
}
nav ul li ul {
    display: none;
}

}



@media screen and (max-width: 600px) {
    .services {
        padding: 1rem; /* Adjust padding for smaller screens */
    }

    .service {
        flex-direction: column; /* Stack items vertically */
        gap: 1rem; /* Reduce gap between items */
        display: block;
    }

    .service_img {
        width: 100%; /* Make the image span the full width */
        height: 210px; /* Adjust height for smaller screens */
    }

    .service-text {
        width: 100%; /* Make the text span the full width */
        padding: 20px; /* Adjust padding for smaller screens */
    }


    .image-grid {
        grid-template-columns: repeat(2, 1fr); /* Adjust to 2 columns */
        gap: 10px; /* Reduce gap between images */
    }

    .gallery-container {
        margin: 40px 0; /* Adjust margin for smaller screens */
    }

    .image-grid img {
        opacity: 0.7; /* Slightly increase base opacity */
    }
    .service_img div {
        width: 100%;
    }
    .team {
        display: block;
    }
    .right-c span, .left-c span {
        position: relative;
        box-sizing: border-box;
        width: 100%;
        margin: 0;
        top: 0;
        left: 0;
        transform: unset;
    }




}




@media screen and (max-width: 600px) {
    nav ul {
        display: none; 
        flex-direction: column; 
        position: absolute; 
        top: 60px; 
        left: 0;
        width: 100%; 
        background-color: #1c1917; 
        z-index: 10;
        padding: 20px;
    }

    nav ul li {
        margin: 10px 0; /* Add vertical spacing between items */
        text-align: center; /* Center align menu items */
        font-size: 14px;
        background-color: rgba(0, 0, 0, 0.3);
    }

    nav ul li a {
        color: #f8e6c6;
        text-decoration: none;
    }

    nav ul li a:hover {
        color: #ccc;
    }
.dropdown {
    display: none;
}
    .hamburger {
        display: block;
        position: fixed;
        width: 30px;
        height: 3px;
        background-color: #f8e6c6;
        cursor: pointer;
        margin: 0;
        top: 30px;
        right: 30px;
        transition: background-color 0.3s ease;
        z-index: 200;
    }
    
    .hamburger:before,
    .hamburger:after {
        content: '';
        position: absolute;
        width: 30px;
        height: 3px;
        background-color: #f8e6c6;
        transition: transform 0.3s ease, background-color 0.3s ease;
    }
    
    .hamburger:before {
        top: -10px; /* Add space for the top bar */
    }
    
    .hamburger:after {
        top: 10px; /* Add space for the bottom bar */
    }
    
    .hamburger.open {
        background-color: transparent; /* Hide middle bar when open */
    }
    
    .hamburger.open:before {
        transform: rotate(45deg) translate(5px, 5px); /* Create top part of X */
    }
    
    .hamburger.open:after {
        transform: rotate(-45deg) translate(5px, -5px); /* Create bottom part of X */
    }
    


/* Visible navigation toggling styles */
.menu-open {
    display: flex; /* Show the menu */
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    left: 0;
    z-index: 90;
    padding: 60px 15px 15px 15px;
    top: 0px;
    height: 100vh;
}
.subhero {
    height: 20vh;
}

}