/* ============================================================================
   Responsivo — reorganiza, nao apenas encolhe.
   Ordem: telas grandes -> tablet -> celular
   ========================================================================= */

/* --- 1440px+ : respiro maior ------------------------------------------- */
@media (min-width: 1600px) {
  :root { --container: 1360px; }
}

/* --- Ate 1180px : navegacao ainda cabe, grades apertam ------------------ */
@media (max-width: 1180px) {
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .values__grid { grid-template-columns: repeat(2, 1fr); }
  .value:nth-child(odd) { border-left: 0; }
  .value:nth-child(even) { border-left: 1px solid var(--navy-soft); }
  .detail__inner { grid-template-columns: minmax(0, 1fr) 280px; }
}

/* --- Ate 1100px : o menu ja nao cabe -------------------------------------
   🩸 Era 1024. Medido em 04/09/2026: com o menu principal completo, os itens partiam em DUAS
   linhas. Com o submenu (6 itens no topo em vez de 8) ele volta a caber muito mais abaixo:
   medido, parte a <=1040 e cabe a >=1060. Ficou 1100 e nao 1060 porque a fonte nao rende igual em
   todos os sistemas, e 50px de folga e o que separa 'medido' de 'medido nesta maquina'. */
@media (max-width: 1100px) {
  :root { --header-h: 84px; --header-h-scrolled: 70px; }

  .header__logo img { height: 58px; }
  .header.is-scrolled .header__logo img { height: 48px; }

  .header__nav { display: none; }
  .header__toggle { display: inline-flex; }
  .header__actions .btn--primary { display: none; }

  .hero__inner {
    grid-template-columns: 1fr;
    gap: clamp(2rem, 5vw, 3rem);
  }

  .hero__media { order: -1; }
  /* mobile usa 4:3 em TODAS as fotos de arte dirigida — um corte so p/ o designer */
  .hero__media .frame { aspect-ratio: 4 / 3; }
  .hero .watermark--left { display: none; }

  .about__inner,
  .obstetrics__inner,
  .contact__inner,
  .featured,
  .newsletter,
  .page-hero--split .page-hero__inner {
    grid-template-columns: 1fr;
  }

  .about__media .frame,
  .page-hero--split .frame { aspect-ratio: 4 / 3; }

  .about__badge {
    position: static;
    max-width: none;
    margin-top: var(--sp-3);
  }

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

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

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

/* --- Ate 820px : celular grande / tablet retrato ------------------------ */
@media (max-width: 820px) {
  .grid--3,
  .grid--4 { grid-template-columns: repeat(2, 1fr); }

  .pillars__grid { grid-template-columns: 1fr; }
  .pillar + .pillar { border-left: 0; border-top: 1px solid var(--border); }


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

  .band .frame { aspect-ratio: 4 / 3; }
  .band__quote p { max-width: none; }

  .about__fact { grid-template-columns: 1fr; gap: 0.15rem; }

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

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

  .toolbar { flex-direction: column; align-items: stretch; }
  .search { min-width: 0; }
}

/* --- Ate 640px : celular ------------------------------------------------ */
@media (max-width: 640px) {
  :root {
    --fs-hero: clamp(2.35rem, 10.5vw, 3.1rem);
    --section-y: clamp(3.25rem, 12vw, 4.5rem);
  }

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

  .values__grid { grid-template-columns: 1fr; }
  .value + .value { border-left: 0; }
  .value:nth-child(even) { border-left: 0; }

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

  .footer__grid { grid-template-columns: 1fr; gap: var(--sp-5); }
  .footer__bottom { flex-direction: column; align-items: flex-start; }

  .hero__actions .btn,
  .cta__actions .btn { width: 100%; }



  .article__meta { justify-content: flex-start; }
  .article__head { text-align: left; }

  .rule-mark { max-width: 260px; }

  .map iframe { height: 300px; }
}

/* --- Ate 400px : celulares estreitos (360px) ---------------------------- */
@media (max-width: 400px) {
  :root { --gutter: 1.15rem; }

  .header__logo img { height: 50px; }
  .header.is-scrolled .header__logo img { height: 42px; }

  .card,
  .testimonial,
  .contact__form { padding: 1.4rem; }

  .mobile-nav__list a { font-size: 1.3rem; }
}

/* --- Impressao ---------------------------------------------------------- */
@media print {
  .header, .mobile-nav, .wa-float, .cta, .newsletter { display: none !important; }
  .page { padding-top: 0; }
  body { color: #000; }
}