@media (max-width: 1100px) {
    .nav-menu { gap: 16px; }
    .hero-grid { gap: 35px; }
    .footer-grid { grid-template-columns: 1.2fr 1fr 1fr; }
}

@media (max-width: 900px) {
    .section { padding: 70px 0; }

    .nav-toggle { display: grid; place-items: center; }

    .nav-menu {
        position: absolute;
        left: 16px;
        right: 16px;
        top: calc(100% + 8px);
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: 10px;
        border: 1px solid var(--border);
        border-radius: 14px;
        background: var(--white);
        box-shadow: var(--shadow);
    }

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

    .nav-menu li a {
        display: block;
        padding: 12px;
        border-radius: 8px;
    }

    .nav-menu li a:hover { background: var(--primary-soft); }

    .hero { min-height: auto; padding: 70px 0; }
    .hero-grid { grid-template-columns: 1fr; }
    .hero-visual { min-height: 400px; }
    .hero-image { height: 370px; }

    .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    .container { width: min(calc(100% - 24px), var(--container)); }
    .section { padding: 55px 0; }

    .topbar-inner {
        justify-content: center;
        min-height: 38px;
    }

    .topbar-links { display: none; }

    .navbar { min-height: 68px; }

    .hero { padding: 55px 0; }
    .hero h1 { font-size: 2.55rem; }
    .hero-visual { min-height: 340px; }
    .hero-image { width: 100%; height: 320px; }
    .hero-float { left: 12px; bottom: 12px; }

    .grid-2,
    .grid-3,
    .grid-4 { grid-template-columns: 1fr; }

    .cta { padding: 32px 24px; }

    .appointment-card,
    .appointment-info { padding: 24px; }

    .footer-grid { grid-template-columns: 1fr; gap: 28px; }

    .section-heading { margin-bottom: 32px; }
}