/* QA-FIX R6 — Etapa 1 (prévia local). Correções globais P0.1–P0.4.
   Não altera o estilo da marca: só impede quebra do nav, colisão no
   header mobile, sobreposição do .wa-float e CTA do hero abaixo da dobra. */

/* ----- P0.1: nav desktop íntegro a partir de 1200px ----- */
@media (max-width: 1199px) {
  /* O painel do hambúrguer (menu-mobile.css) controla display/visibility
     de .nav-links. Não forçar display:none aqui — o overlay ficaria invisível. */
  .nav { padding: 16px 24px; }
  .nav.scrolled { padding: 12px 24px; }
}

@media (min-width: 1200px) {
  .nav-links {
    display: flex;
    flex-wrap: nowrap;
    gap: 24px; /* mínimo pedido; era 40px */
    align-items: center;
  }
  .nav-links > li > a {
    white-space: nowrap;
  }
  .nav-links .has-drop > a {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    gap: 0;
  }
  .nav-caret {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    vertical-align: middle;
  }
  .nav-cta {
    padding: 8px 18px;
    white-space: nowrap;
    flex: none;
  }
}

/* ----- P0.2: header 360–390px — gap e wordmark/.nav-cta menores ----- */
@media (max-width: 400px) {
  .nav {
    gap: 8px;
    padding-left: 16px;
    padding-right: 16px;
  }
  .nav-brand {
    gap: 8px;
    min-width: 0;
    flex: 1 1 auto;
  }
  .nav-wordmark {
    font-size: 10px;
    letter-spacing: 0.16em;
  }
  .nav-logo { width: 28px; height: 28px; }
  .nav-toggle {
    margin-left: 8px;
    flex: none;
  }
  .nav-cta {
    padding: 8px 12px;
    font-size: 12px;
    letter-spacing: 0.08em;
    flex: none;
  }
}

/* ----- P0.3: .wa-float não cobre o CTA do hero em ~360px ----- */
@media (max-width: 400px) {
  /* Reserva o canto direito da área de ações para o float.
     white-space: nowrap evita o botão ganhar uma 2ª linha e atravessar a dobra. */
  .page-hero { padding-bottom: 24px; }
  .page-hero-sub { margin-bottom: 20px; }
  .page-hero-actions { gap: 12px; }
  .page-hero-actions,
  .hero-actions {
    width: 100%;
    padding-right: 72px;
    box-sizing: border-box;
  }
  .page-hero-actions .btn,
  .hero-actions .btn {
    max-width: 100%;
    white-space: nowrap;
    box-sizing: border-box;
    padding-left: 16px;
    padding-right: 16px;
    letter-spacing: 0.08em;
    font-size: 13px;
    overflow: visible;
  }
  .hero { padding-bottom: 24px; }
  .hero-sub { margin-bottom: 16px !important; }
  .hero-sub-local { margin-bottom: 16px !important; }
  .hero-content {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
  }
  .hero-actions {
    align-items: stretch;
    justify-content: flex-start;
    max-width: 100%;
  }
  .hero-actions .btn {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }
}

/* ----- P0.4: CTA do hero na primeira dobra (1280 / 1440) ----- */
.page-hero {
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
}
.page-hero .container {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 100%;
}
.page-hero-content {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.page-hero-actions {
  margin-top: auto;
}

@media (min-width: 1200px) {
  .page-hero {
    padding-top: 120px;
    padding-bottom: 48px;
  }
  .page-hero h1 {
    font-size: clamp(52px, 3.8vw, 56px);
    line-height: 1.15;
  }
  .page-hero-sub { margin-bottom: 28px; }

  /* Home (.hero): mesmo padrão de dobra, sem mudar o texto do H1 */
  .hero {
    min-height: 100vh;
    min-height: 100svh;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    padding-top: 120px;
    padding-bottom: 48px;
  }
  .hero-content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
  }
  .hero-actions { margin-top: auto; }
  .hero h1 {
    font-size: clamp(52px, 3.8vw, 56px);
    line-height: 1.15;
  }
}