/* =====================================================================
   kem2-title.css — Ketin 2.0 — Title · v1.0.1 · 2026-07-25
   Diseño por defecto SIN !important: todo editable desde Design.
   Identidades ZIHT (default) / PTF (.kem-ptf) solo como carga inicial.

   Changelog 1.0.1: se agrega .kem2-title-lead (bajada opcional debajo
   del título) — mismo serif del título, en cursiva, tono más apagado.
   ===================================================================== */

.kem2-title-inner {
  max-width: 760px;
}

/* ---- Eyebrow: texto ---- */
.kem2-title-eyebrow {
  display: flex;
  align-items: center;
  gap: var(--kem2-line-gap, 10px);
  font-family: 'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-weight: 600;
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #4800fe;
  margin-bottom: 14px;
}

/* ---- Eyebrow: línea (elemento separado, configurable por vars) ---- */
.kem2-title-eyebrow .kem2-line {
  display: inline-block;
  width: var(--kem2-line-w, 22px);
  border-top: var(--kem2-line-t, 1px) var(--kem2-line-s, solid) var(--kem2-line-c, currentColor);
  flex: none;
}

/* Posición "debajo del texto": la línea baja a su propia fila */
.kem2-title-eyebrow.kem2-line-below {
  flex-direction: column;
  align-items: flex-start;
}

/* ---- Título ---- */
.kem2-title-heading {
  font-family: 'Source Serif 4', 'Iowan Old Style', ui-serif, Georgia, serif;
  font-weight: 600;
  font-size: 31px;
  line-height: 1.16;
  letter-spacing: -.008em;
  color: #080b26;
  margin: 0;
}

/* ---- Bajada (opcional, debajo del título) ---- */
.kem2-title-lead {
  font-family: 'Source Serif 4', 'Iowan Old Style', ui-serif, Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.4;
  color: #4c4f76;
  margin: 8px 0 0;
}

/* ---- Identidad PTF (carga por defecto, editable) ---- */
.kem-ptf .kem2-title-eyebrow,
.kem2-title.kem-ptf .kem2-title-eyebrow {
  font-family: 'Work Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: #a9781f;
}
.kem-ptf .kem2-title-heading,
.kem2-title.kem-ptf .kem2-title-heading {
  font-family: 'Newsreader', ui-serif, Georgia, serif;
  font-weight: 500;
  color: #0e2015;
}
.kem-ptf .kem2-title-lead,
.kem2-title.kem-ptf .kem2-title-lead {
  font-family: 'Newsreader', ui-serif, Georgia, serif;
  color: #2f5233;
}

/* ---- Responsive ---- */
@media (max-width: 760px) {
  .kem2-title-heading {
    font-size: 24px;
  }
}