/* Navegación estable para iPhone, iPad, tablet y laptops compactas. */
@media (max-width: 1100px) {
  .app-header {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .nav-toggle {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    position: relative;
    z-index: 102;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  .main-nav {
    display: none;
    position: absolute;
    z-index: 101;
    top: 100%;
    left: 0;
    right: 0;
    max-height: calc(100vh - 62px);
    max-height: calc(100dvh - 62px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    background: var(--ink);
    flex-direction: column;
    align-items: stretch;
    gap: .25rem;
    padding: 1rem 5vw calc(1rem + env(safe-area-inset-bottom));
    box-shadow: 0 20px 45px #071c1840;
  }

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

  .main-nav > a,
  .property-nav > a,
  .property-nav > button {
    color: #fff;
    min-height: 44px;
    box-sizing: border-box;
    align-items: center;
    text-align: left;
    padding: .65rem .25rem;
    touch-action: manipulation;
  }

  .main-nav > a {
    display: flex;
  }

  .property-nav {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px;
    align-items: center;
    width: 100%;
    height: auto;
  }

  .property-nav > button {
    display: grid;
    place-items: center;
    width: 44px;
    padding: 0;
    justify-self: end;
    -webkit-tap-highlight-color: transparent;
  }

  .property-menu {
    grid-column: 1 / -1;
    position: static;
    display: none;
    visibility: visible;
    opacity: 1;
    transform: none;
    width: 100%;
    margin: 0 0 .35rem;
    padding: .25rem;
    background: #294b43;
    box-shadow: none;
  }

  .property-nav.expanded .property-menu {
    display: block;
  }

  .property-menu a {
    color: #fff;
    min-height: 44px;
    box-sizing: border-box;
    border-bottom: 1px solid #ffffff21;
    touch-action: manipulation;
  }

  .main-nav .owner-link {
    display: flex !important;
    width: fit-content;
    min-height: 44px;
    color: #fff;
    border-color: #ffffff47;
    margin-top: .35rem;
  }

  .language-switcher {
    right: 4.7rem;
  }
}

@media (max-width: 880px) {
  .main-nav {
    top: 100%;
  }
}

@media (max-width: 420px) {
  .app-header {
    padding-left: max(4vw, env(safe-area-inset-left));
    padding-right: max(4vw, env(safe-area-inset-right));
  }

  .brand {
    width: min(142px, 43vw);
  }

  .language-switcher {
    right: calc(4vw + 44px);
  }

  .main-nav {
    padding-left: max(5vw, env(safe-area-inset-left));
    padding-right: max(5vw, env(safe-area-inset-right));
  }
}

@media (prefers-reduced-motion: reduce) {
  .property-menu,
  .nav-toggle,
  .nav-toggle svg {
    transition: none !important;
  }
}