@media (max-width: 980px) {

    .mobile-toggle {
        display: inline-flex;
    }

    .main-nav {

        position: absolute;

        top:
            calc(100% + 12px);

        left: 0;
        right: 0;

        display: none;

        flex-direction: column;

        padding: 18px;

        border-radius: 24px;

        background:
            var(--glass);

        backdrop-filter:
            blur(22px);
    }

    .main-nav.open {
        display: flex;
    }

    .hero {

        grid-template-columns:
            1fr;

        padding: 24px;
    }

    .property-grid,
    .service-grid,
    .feature-list,
    .contact-grid {

        grid-template-columns:
            1fr 1fr;
    }
}

@media (max-width: 640px) {

    .site-header {
        gap: 12px;
    }

    .logo small {
        display: none;
    }

    .hero,
    .page-hero,
    .section {

        width:
            min(
                100% - 20px,
                1180px
            );
    }

    .hero-content,
    .page-hero {

        padding: 26px;
    }

    .property-grid,
    .service-grid,
    .feature-list,
    .contact-grid,
    .filter-bar {

        grid-template-columns:
            1fr;
    }

    .site-footer {
        flex-direction: column;
    }

    .cookie-banner {

        flex-direction: column;

        align-items: stretch;
    }
}