/*
 * Eslogan "Behind the Change. Beyond the Challenge." como banner de marca.
 *
 * - Las frases son contenido: se editan en Elementor o en el editor de la entrada, el tema no las escribe.
 * - Entradas antiguas: el tema añade `lbl-slogan lbl-slogan--legacy` al widget heredado (ver story-layout.php).
 * - Cualquier entrada: añadir la clase `lbl-slogan` a un widget de texto aplica este diseño.
 * - Prevalece el estilo que el equipo ponga a propósito. El diseño usa especificidad baja (0,1,0 y 0,2,0), así que los
 *   ajustes de estilo de Elementor (0,3,0) lo sustituyen. Solo el estilo heredado del sitio antiguo se pisa
 *   (`--legacy`, que se retira solo en cuanto el widget deja de tener ese estilo).
 */
.lbl-slogan,
.lbl-slogan.elementor-widget,
body .lbl-legacy-content .lbl-slogan--legacy.elementor-element {
  box-sizing: border-box;
  flex: 0 0 100%;
  width: 100%;
  margin: 56px 0 0;
  padding: clamp(36px, 6vw, 64px) 24px;
  background: var(--brand-gradient, linear-gradient(125deg, #4C2889 0%, #7C1B6B 28%, #B4123F 55%, #E8121F 80%, #FF0800 100%));
  color: var(--white, #fff);
  font-family: var(--font-display, 'Konnect', sans-serif);
  font-size: clamp(1.5rem, 2.4vw, 2.25rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.01em;
  text-align: center;
}

.lbl-slogan p,
.lbl-slogan .elementor-widget-container {
  margin: 0;
  font: inherit;
  letter-spacing: inherit;
  color: inherit;
  text-align: inherit;
}

/* Dentro de un contenedor que ya tiene fondo oscuro o degradado: solo texto blanco y centrado. */
.lbl-slogan--on-dark,
.lbl-slogan--on-dark.elementor-widget,
body .lbl-legacy-content .lbl-slogan--legacy.lbl-slogan--on-dark.elementor-element {
  margin-top: 24px;
  padding: 0;
  background: none;
}