/* ═══════════════════════════════════════════════════════════════════
   Via Traço · correções v21
   Refinos solicitados após a revisão visual da v20.
   Carregado depois de correcoes-v20.css.
   ═══════════════════════════════════════════════════════════════════ */

/* ───────────────────────── PÁGINA SOBRE ───────────────────────── */
/* Título com quebras editoriais fixas no desktop e no responsivo. */
body.sobre-page .sobre-titulo > span,
body.sobre-page .sobre-titulo > em {
  display: block;
}
body.sobre-page .sobre-titulo > em {
  font-style: italic;
}

/* Fundo totalmente branco e grid sem linhas de marcação. */
body.sobre-page,
body.sobre-page .page-hero-band.sobre-hero,
body.sobre-page .sobre-hero-grid,
body.sobre-page .sobre-hero-copy,
body.sobre-page .sobre-hero-media,
body.sobre-page #sobre,
body.sobre-page .sobre-details,
body.sobre-page .sobre-about,
body.sobre-page .sobre-local,
body.sobre-page .sobre-copy {
  background: #fff !important;
}
body.sobre-page .page-hero-band.sobre-hero,
body.sobre-page #sobre,
body.sobre-page .sobre-hero-copy,
body.sobre-page .sobre-about > .ac,
body.sobre-page .sobre-local {
  border: 0 !important;
}

/* Mantém o cartão de localização legível, mas sem aparência de grade. */
body.sobre-page .local-card {
  border-color: rgba(0, 0, 0, .08);
  box-shadow: 0 16px 40px rgba(0, 0, 0, .06);
}

/* O bloco final continua usando exatamente o componente compartilhado
   do restante do site, sem personalização exclusiva da página Sobre. */

/* ───────────────────────── MUHPAN · PARTE 03 ───────────────────────── */
/* No celular, a faixa funciona como capa e o selo como foto de perfil. */
@media (max-width: 900px) {
  body.apre-muhpan #s4 .faixa {
    margin-bottom: 0 !important;
    overflow: hidden;
  }
  body.apre-muhpan #s4 .baixo {
    position: relative !important;
    display: block !important;
    padding-top: clamp(86px, 21vw, 106px);
  }
  body.apre-muhpan #s4 .baixo > div:first-child {
    width: 100%;
  }
  body.apre-muhpan #s4 .swatches {
    padding-right: 0 !important;
  }
  body.apre-muhpan #s4 .selo {
    position: absolute !important;
    top: clamp(-75px, -15.6vw, -58px) !important;
    right: 12px !important;
    bottom: auto !important;
    left: auto !important;
    width: min(30vw, 144px) !important;
    max-width: 144px !important;
    margin: 0 !important;
    border: 4px solid #fff !important;
    border-radius: 12px !important;
    box-shadow: 0 20px 46px -16px rgba(22, 22, 15, .62) !important;
    z-index: 5;
  }
  body.apre-muhpan #s4 .selo img {
    width: 100% !important;
    height: auto !important;
    display: block;
  }
}

/* ─────────────── MESTRES DO RENASCIMENTO · CAPA ─────────────── */
body.apre-renascimento #s1 .capa-img-azul {
  display: none;
}

/* Responsivo na vertical: permanece o convite vermelho, inteiro e central. */
@media (max-width: 900px) and (orientation: portrait) {
  body.apre-renascimento #s1,
  body.apre-renascimento #s1 .capa-plena {
    width: 100%;
    height: 100dvh;
    min-height: 100dvh;
    background: #0d1a22 !important;
  }
  body.apre-renascimento #s1 .capa-img-vermelha {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    object-fit: contain !important;
    object-position: center !important;
    transform: none !important;
  }
  body.apre-renascimento #s1 .capa-img-azul {
    display: none !important;
  }
}

/* Responsivo na horizontal: usa a marca azul em formato panorâmico,
   preenchendo a tela sem cortar a marca. */
@media (max-width: 900px) and (orientation: landscape) {
  body.apre-renascimento #s1,
  body.apre-renascimento #s1 .capa-plena {
    width: 100%;
    height: 100dvh;
    min-height: 100dvh;
    background: #07374e !important;
  }
  body.apre-renascimento #s1 .capa-img-vermelha {
    display: none !important;
  }
  body.apre-renascimento #s1 .capa-img-azul {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    object-fit: cover !important;
    object-position: center !important;
    transform: none !important;
  }
}

@media (max-width: 520px) {
  body.sobre-page .sobre-titulo {
    line-height: 1.08 !important;
  }
}
