/* =========================================================
   MASX — correções de layout mobile (2026-10-16)
   Escopo mínimo e seguro. Nada de nowrap (alargava o container
   e cortava o título do hero).

   1) Régua do ecossistema: um item por linha.
   2) Sub-nav: itens maiores para o toque + scroll-snap.
   3) Hero: respiro sob o sub-nav fixo.
   4) Kicker: texto encurtado no mobile, cabe em 1 linha naturalmente.
   ========================================================= */

@media (max-width: 768px) {
  /* 1) régua do ecossistema (colidia com space-between) */
  .v3-eco-pillars {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 10px;
    padding-top: 22px;
  }
  .v3-eco-pillars span {
    width: auto;
    max-width: 100%;
    line-height: 1.5;
  }

  /* 2) sub-nav */
  .v3-subnav-inner {
    scroll-snap-type: x proximity;
    padding: 10px 2px;
    gap: 8px;
  }
  .v3-subnav a {
    scroll-snap-align: center;
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    font-size: .8rem;
    padding: 8px 15px;
  }
  .v3-subnav::before,
  .v3-subnav::after { width: 34px; }

  /* 3) respiro do hero sob o sub-nav fixo */
  .v3-hero { padding-top: 178px !important; }

  /* 4) kicker: "CONVERSACIONAL" sai no mobile e o texto cabe em 1 linha
        SEM nowrap (nowrap alargava o container e cortava o h1) */
  .v3-kicker .kw-desk { display: none !important; }
  .v3-kicker {
    font-size: 10px !important;
    letter-spacing: .03em !important;
    line-height: 1.4 !important;
  }
  .v3-kicker span { width: 6px !important; height: 6px !important; margin-right: 7px !important; }
}

@media (max-width: 420px) {
  .v3-subnav a { font-size: .76rem; padding: 8px 13px; }
  .v3-eco-pillars { font-size: 10.5px; }
  .v3-kicker { font-size: 9.5px !important; }
}