/* Mobile Navigation Styles */
@media (max-width: 1024px) {
    hr{
        margin: 30px 0 !important;
    }
    .header-container .navigation ul{
        gap: 20px;
    }
    .navbar-buttons{
        display: none;
    }
    .find-clean-header h2, .easy-steps h2{
        font-size: 40px;
    }
    .banner-content h1{
        font-size: 60px !important;
    }
    .clean-service-content{
        gap: 30px;
    }
    .slick-prev, .slick-next{
        display: none !important;
    }
    .different-wrapper{
        flex-direction: column;
    }
    .different-image{
        flex: 1;
    }
    .different-image{
        display: none;
    }
    .different-content{
        padding: 50px 20px;
    }
    .cleaning-services {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
        margin: 30px 0;
    }
}

@media (max-width: 768px) {
    /* Show hamburger menu on mobile */
    .hamburger-menu {
        display: flex;
    }

    /* Stack header elements vertically on mobile */
    .header-container {
        flex-wrap: wrap;
    }
    .header-container .navigation ul li a{
        color: #333;
    }
    /* Hide navigation by default on mobile */
    .navigation {
        position: absolute;
        top: 70px;
        left: 0;
        right: 0;
        background-color: #fff;
        flex-direction: column;
        width: 100%;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease;
        padding: 0;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        z-index: 999;
    }
    .breeze-columns{
        grid-template-columns: repeat(1, 1fr);
        gap: 20px;
        margin: 0;
    }
    /* Show navigation when active */
    .navigation.active {
        max-height: 500px;
        padding: 20px 0;
        top: 121px;
    }

    /* Mobile navigation list */
    .navigation ul {
        flex-direction: column;
        gap: 0 !important;
        width: 100%;
        padding: 0;
    }

    .navigation ul li {
        width: 100%;
        padding: 0;
    }

    .navigation ul li a {
        display: block;
        padding: 15px 20px;
        border-bottom: 1px solid #eee;
        font-size: 14px;
    }

    .navigation ul li a:hover {
        background-color: #f9f9f9;
    }

    /* Mobile navbar buttons */
    .navbar-buttons {
        flex-direction: column;
        width: 100%;
        margin-left: 0;
        padding: 20px;
        gap: 10px;
    }
    .navbar-buttons a {
        width: 100%;
        text-align: center;
        padding: 12px 20px;
    }

    .navbar-buttons .cart-button {
        order: 2;
    }
    .navbar-buttons .login-button {
        order: 1;
    }
    .navbar-buttons{
        display: block;
    }
    .banner-btns{
        flex-direction: column;
        gap: 10px;
    }
    .clean-service-content{
        flex-direction: column;
        gap: 20px;
    }
    .service-clean-right-item h3{
        font-size: 20px;
    }
    .comparison-icon{
        width: 70px;
        height: 70px;
    }
    .comparison-icon img{
        width: 40px;
        height: 40px;
    }
    .banner{
        margin-top: 110px;
        padding: 0 !important;
    }
    .banner-content h1{
        font-size: 40px !important;
    }
    .banner-btns a{
        padding: 10px 20px;
        height: 50px;
        font-size: 18px;
    }
    .cleaning-services, .easy-steps-container{
        grid-template-columns: repeat(1, 1fr);
        gap: 15px;
    }
    .different-content h2, .reviews h2, .faq h1, .contact h1, .standard-clean h1, .cleaning-comparison h2, .breeze-header h1{
        font-size: 30px;
    }
    .breeze-header h2{
        font-size: 24px;
    }
    .seo-content h2{
        font-size: 24px;
    }
    .different-grid{
        margin-top: 0;
        gap: 10px;
    }
    .question-wrapper{
        flex-direction: column;
    }
    .questions-form{
        padding: 30px 0;
    }
    .satisfaction-grid{
        gap: 30px;
        grid-template-columns: repeat(2, 1fr);
    }
    .footer-grid-col{
        grid-column: span 1 / span 1;
    }
    .footer-grid{
        grid-template-columns: 1fr;
    }
    .col-reverse{
        flex-direction: column-reverse !important;
    }
    .breeze-single-col{
        margin-bottom: 20px;
    }
    .seo-section-wrapper{
        margin-bottom: 20px;
    }
    .seo-section-wrapper{
        flex-direction: column;
        gap: 20px;
    }
    .seo-section{
        padding: 30px 0;
    }
    .seo-image{
        width: 100%;
    }
    .seo-image img{
        width: 100%;
        height: auto;
        object-fit: cover;
    }

}

@media (max-width: 480px) {
    .header-container .logo a {
        font-size: 22px;
    }
    .banner-content h1{
        font-size: 28px !important;
    }

    .navigation ul li a {
        font-size: 13px;
        padding: 12px 15px;
    }

    .navbar-buttons {
        padding: 15px;
    }

    .navbar-buttons a {
        font-size: 12px;
        padding: 10px 15px;
    }
    footer{
        padding: 30px 0;
    }
    .form-group-wrapper{
        flex-direction: column-reverse;
        gap: 10px;
    }
    .contact form{
        gap: 10px;
    }
}