/*
 * 18-razones-type-final.css - '¿Por que asistir?': ajuste final para que todos los titulos y descripciones entren en la tarjeta.
 * Origen: index.html, <style> #6 (desde la linea 1). Contenido identico al original.
 */
/* ===== AJUSTE FINAL — texto dentro de los banners ===== */
#razones .info-content{
  height:26%!important;
  padding:12px 18px!important;
  box-sizing:border-box!important;
}

#razones .info-card:hover .info-content,
#razones .info-card:focus-visible .info-content{
  height:34%!important;
}

/* Imágenes ocupan más espacio para que el conjunto quede equilibrado */
#razones .info-photo-wrap{
  height:74%!important;
}

#razones .info-card:hover .info-photo-wrap,
#razones .info-card:focus-visible .info-photo-wrap{
  height:66%!important;
}

/* Títulos reducidos para que TODOS entren dentro del cuadrado */
#razones .info-content h3{
  font-size:24px!important;
  line-height:1.05!important;
  letter-spacing:.055em!important;
  margin:0 0 5px!important;
  white-space:nowrap!important;
}

/* Descripciones reducidas y contenidas */
#razones .info-description p{
  font-size:15px!important;
  line-height:1.22!important;
  padding-top:7px!important;
  margin:0!important;
  max-width:100%!important;
  overflow-wrap:break-word!important;
}


@media(max-width:900px){
  #razones .info-content h3{font-size:22px!important}
  #razones .info-description p{font-size:14px!important}
}

@media(max-width:520px){
  #razones .info-content{
    height:28%!important;
    padding:12px 16px!important;
  }
  #razones .info-card:hover .info-content,
  #razones .info-card:focus-visible .info-content{
    height:40%!important;
  }
  #razones .info-photo-wrap{height:72%!important}
  #razones .info-card:hover .info-photo-wrap,
  #razones .info-card:focus-visible .info-photo-wrap{
    height:60%!important;
  }
  #razones .info-content h3{font-size:20px!important}
  #razones .info-description p{font-size:14px!important}
}