/* =========================================================
   AFECCIONES — CABECERA REFINADA
   SOLO afecta el encabezado de #afecciones.
   ========================================================= */

#afecciones .conditions-heading.conditions-heading-refined{
  display:block !important;
  margin:0 0 2.4rem !important;
  padding:0 0 1.6rem !important;
  border-bottom:1px solid rgba(80,54,78,.14) !important;
}

#afecciones .conditions-heading-refined .conditions-heading-main{
  width:100% !important;
  max-width:1100px !important;
}

#afecciones .conditions-heading-refined .eyebrow{
  display:block !important;
  margin:0 0 .7rem !important;
  color:var(--accent) !important;
  font-size:.72rem !important;
  font-weight:850 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
}

#afecciones .conditions-heading-refined h2{
  max-width:27ch !important;
  margin:0 !important;
  color:var(--primary) !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(2.15rem,3.45vw,3.65rem) !important;
  font-weight:500 !important;
  letter-spacing:-.035em !important;
  line-height:1.08 !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
  -webkit-hyphens:none !important;
  text-wrap:balance;
}

@media(max-width:700px){
  #afecciones .conditions-heading.conditions-heading-refined{
    margin-bottom:1.7rem !important;
    padding-bottom:1.2rem !important;
  }

  #afecciones .conditions-heading-refined h2{
    max-width:none !important;
    font-size:clamp(1.85rem,8vw,2.65rem) !important;
    line-height:1.12 !important;
  }
}


/* =========================================================
   AFECCIONES V21 — CABECERA MÁS ANCHA Y EYEBROW MÁS VISIBLE
   SOLO afecta el encabezado de #afecciones.
   ========================================================= */

#afecciones .conditions-heading-refined .conditions-heading-main{
  width:100% !important;
  max-width:1380px !important;
}

/* Eyebrow más visible, sin competir con el título */
#afecciones .conditions-heading-refined .eyebrow{
  display:inline-flex !important;
  align-items:center !important;
  gap:.55rem !important;

  width:auto !important;
  margin:0 0 .9rem !important;
  padding:.46rem .72rem !important;

  color:var(--accent) !important;
  background:color-mix(in srgb, var(--accent) 8%, transparent) !important;

  border:1px solid color-mix(in srgb, var(--accent) 18%, transparent) !important;
  border-radius:999px !important;

  font-size:.82rem !important;
  font-weight:900 !important;
  letter-spacing:.115em !important;
  line-height:1.2 !important;
}

/* Título más ancho: mejor balance y menos líneas */
#afecciones .conditions-heading-refined h2{
  width:100% !important;
  max-width:39ch !important;

  font-size:clamp(2.05rem,3vw,3.25rem) !important;
  line-height:1.06 !important;
  letter-spacing:-.032em !important;

  text-wrap:balance !important;
}

/* Desktop grande: aprovecha mejor el ancho disponible */
@media(min-width:1200px){
  #afecciones .conditions-heading-refined h2{
    max-width:42ch !important;
  }
}

/* Tablet */
@media(max-width:900px){
  #afecciones .conditions-heading-refined h2{
    max-width:34ch !important;
    font-size:clamp(1.95rem,5vw,2.8rem) !important;
  }
}

/* Móvil */
@media(max-width:700px){
  #afecciones .conditions-heading-refined .eyebrow{
    margin-bottom:.72rem !important;
    padding:.4rem .62rem !important;
    font-size:.72rem !important;
    letter-spacing:.09em !important;
  }

  #afecciones .conditions-heading-refined h2{
    max-width:none !important;
    font-size:clamp(1.75rem,7.7vw,2.45rem) !important;
    line-height:1.1 !important;
  }
}