/*
 * Estilos del bloque "branded content" que GEO inyecta en el slot boosters-geo.
 * Hereda la tipografía del tema (font-family: inherit) para integrarse con la
 * página. La visibilidad la controla la clase `.publi-expanded` (la añade el JS
 * al hacer clic): colapsado por defecto, sin parpadeo, y el contenido sigue en
 * el HTML fuente para los crawlers de IA.
 */

/* ── Cabecera / trigger: "──── BRANDED CONTENT ▾ ────" con sponsor arriba ── */
.publi-trigger {
  position: relative;
  display: flex;
  align-items: center;
  gap: 18px;
  margin: 32px 0 0;
  padding-top: 20px;
  cursor: pointer;
  user-select: none;
  font-family: inherit;
}
.publi-trigger::before,
.publi-trigger::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: #e6e6e6;
}

.publi-sponsor {
  position: absolute;
  top: 4px;
  right: 0;
  display: none; /* solo visible al desplegar (parte del contenido, no de la cabecera) */
  font-size: 8px;
  line-height: 1;
  letter-spacing: 0.2px;
  color: #c8c8c8;
  font-weight: 400;
}
.publi-trigger.publi-expanded .publi-sponsor {
  display: block;
}
.publi-sponsor strong {
  font-weight: 600;
  color: #b6b6b6;
}

.publi-title {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #4a4a4a;
  font-weight: 700;
  white-space: nowrap;
}

/* Indicador ▼ del marcado (gira 180° al desplegar). */
.publi-arrow {
  display: inline-block;
  font-size: 8px;
  color: #b0b0b0;
  transition: transform 0.25s ease;
}
.publi-trigger.publi-expanded .publi-arrow {
  transform: rotate(180deg);
}

/* ── Contenido: colapsado por defecto; visible con .publi-expanded ── */
.publi-content {
  display: none;
  font-family: inherit;
  color: #909090;
  font-size: 15px;
  line-height: 1.75;
}
.publi-content.publi-expanded {
  display: block;
  margin-top: 20px;
}

/* Todas las preguntas al mismo tamaño (la 1ª es <h2>, el resto <h3>). */
.publi-content h2,
.publi-content h3 {
  color: #2f2f2f;
  font-weight: 700;
  font-size: 15.5px;
  line-height: 1.4;
}
.publi-content h2 {
  margin: 0 0 10px;
}
.publi-content h3 {
  margin: 26px 0 8px;
}
.publi-content p {
  margin: 0 0 14px;
  color: #909090;
}
.publi-content strong {
  color: #1f1f1f;
  font-weight: 700;
}
.publi-content ol {
  margin: 14px 0 18px;
  padding-left: 22px;
  color: #909090;
}
.publi-content ol li {
  margin: 0 0 8px;
  padding-left: 4px;
}

/* ── Footer "Publicidad para : <marca>" ── */
.publi-content [data-cf-end] {
  margin-top: 24px;
  padding-top: 12px;
  border-top: 1px solid #ededed;
  font-size: 9px;
  line-height: 1.5;
  letter-spacing: 0.2px;
  color: #a8a8a8;
}
.publi-content [data-cf-end] strong {
  color: #7a7a7a;
  font-weight: 700;
}
.publi-content [data-cf-end] a {
  color: #a8a8a8;
  text-decoration: underline;
}