/**
 * Cartão Multibenefícios
 * Mantém apenas estilos para markup vindo do ACF/WYSIWYG (não escaneado pelo Tailwind)
 * e utilitários legados que ainda existem só no conteúdo salvo no banco.
 *
 * Layout da página: classes Tailwind em pg-solucoes-cartao-multibeneficios.php e nos partials tw-box-*.
 */

/* ---- Rich text / títulos: sublinhado em gradiente ---- */
.tw-multibeneficios .underline-detail {
  background-position: bottom;
  background-size: 100% 25%;
  background-repeat: no-repeat;
}

.tw-multibeneficios .underline-detail.orange {
  background-image: linear-gradient(0deg, #ff8014, #ff8014);
}

.tw-multibeneficios .underline-detail.purple {
  background-image: linear-gradient(0deg, #c96dff, #c96dffb2);
}

/* ---- Blocos “Antes / Agora” (HTML no campo ACF) ---- */
.tw-multibeneficios .block-before {
  border: 1px solid #00d8d8;
  background: #000;
}

.tw-multibeneficios .block-after {
  border: 1px solid #eeff88;
  background: #000;
}

.tw-multibeneficios .block-before h3 {
  background: #00d8d8;
  font-size: 19px;
  color: black;
}

.tw-multibeneficios .block-after h3 {
  background: #eeff88;
  font-size: 19px;
  color: black;
}

.tw-multibeneficios .block-before ul,
.tw-multibeneficios .block-after ul {
  padding: 0 1rem !important;
}

/* ---- Classes Bootstrap/antigas só no HTML do banco (Tailwind não gera sem safelist) ---- */
.tw-multibeneficios .d-none {
  display: none;
}

@media (min-width: 1600px) {
  .tw-multibeneficios .d-xxxl-block {
    display: block;
  }
}