/* ============================================================
   MOVING IMÓVEIS — Responsivo
   breakpoints: 1024 · 880 · 768 (nav) · 560
   script.js alterna .active em .nav__toggle/.nav__menu — painel
   mobile = .nav__menu.active abaixo.
   ============================================================ */

@media (max-width: 1024px) {
    .hero__container { grid-template-columns: 1fr; gap: 44px; }

    .hero__image-icon { height: 300px; }

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

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

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

    .about__content { grid-template-columns: 1fr; gap: 40px; }
}

@media (max-width: 880px) {
    .footer__main { grid-template-columns: 1fr; gap: 34px; }

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

@media (max-width: 768px) {
    .nav__toggle { display: flex; }

    .nav__menu {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        background: var(--abissal-deep);
        border-bottom: 1px solid var(--hairline-champanhe);
        padding: 10px 24px 16px;
        box-shadow: 0 18px 30px rgba(0, 0, 0, 0.45);
    }

    .nav__link {
        display: block;
        padding: 13px 4px;
        border-radius: 0;
        border-bottom: 1px solid rgba(247, 244, 236, 0.1);
    }

    .nav__item:last-child .nav__link { border-bottom: 0; }

    .hero { padding: calc(var(--header-h) + 48px) 0 60px; }

    .hero__stats { flex-wrap: wrap; gap: 22px; }

    .properties, .services, .investments, .about { padding: 56px 0; }

    [class*="__header"] { margin-bottom: 36px; }
}

@media (max-width: 560px) {
    .properties__grid { grid-template-columns: 1fr; }

    .services__grid { grid-template-columns: 1fr; }

    .investments__grid { grid-template-columns: 1fr; }

    .property-card__features { grid-template-columns: 1fr; }

    .investment-card__metrics { grid-template-columns: 1fr; gap: 14px; }

    .investment-metric {
        border-top: 1px dashed var(--hairline-champanhe);
        padding-top: 10px;
    }

    .hero__image-icon { height: 240px; font-size: 92px; }

    .footer__bottom { flex-direction: column; align-items: flex-start; }
}
