/* Layout responsivo — mobile-first (modelo), desktop próprio a partir de 1024px. */

.app { max-width: 520px; margin: 0 auto; min-height: 100vh; background: var(--color-background); padding-bottom: 5rem; }
.top-bar--desktop { display: none; }

.app-footer {
  display: flex; justify-content: center; align-items: center;
  padding: 1.5rem 1.25rem 1.25rem; border-top: 1px solid var(--color-border);
}
.app-footer__brand { display: block; line-height: 0; }
.app-footer__logo {
  display: block; width: auto; height: 3.5rem; max-width: 14rem;
  object-fit: contain;
}

@media (min-width: 768px) { .app { max-width: 640px; } }

.lista-saloes--grid { display: flex; flex-direction: column; gap: 1rem; }

@media (min-width: 1024px) {
  .app { max-width: 1120px; padding-bottom: 0; }
  .bottom-nav { display: none; }
  .app-footer { padding: 2rem 1.5rem 1.5rem; }
  .app-footer__logo { height: 4rem; max-width: 16rem; }
  .top-bar--desktop {
    display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1rem 1.5rem;
    position: sticky; top: 0; z-index: 30; background: var(--color-background); border-bottom: 1px solid var(--color-border);
  }
  .top-bar__brand { display: flex; align-items: center; }
  .top-bar__logo { height: 3.5rem; width: auto; max-width: 18rem; object-fit: contain; }
  .top-bar__nav { display: flex; gap: 1.5rem; }
  .top-bar__link { font-size: 0.875rem; font-weight: 500; color: var(--color-muted-foreground); text-decoration: none; }
  .top-bar__link.is-active { color: var(--color-primary); }

  .lista-saloes--grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
  .detalhe-layout { display: grid; grid-template-columns: 7fr 5fr; gap: 2rem; padding: 1.5rem; align-items: start; }
  .detalhe-layout__contato { position: sticky; top: 5rem; }
  .form-centralizado { max-width: 640px; margin: 0 auto; padding: 2rem 1.5rem; }
}