h1 {
  color: rgb(13, 123, 233); /* Corrected property */
  font-size: clamp(2rem, 5vw, 3rem);
}
h2 {
  font-size: clamp(1.75rem, 4.5vw, 2.5rem);
}
h3 {
  font-size: clamp(1.5rem, 4vw, 2rem);
}
h4 {
  font-size: clamp(1.25rem, 3vw, 1.75rem);
}
h5 {
  font-size: clamp(1rem, 2.5vw, 1.5rem);
}
h6 {
  font-size: clamp(0.875rem, 2vw, 1.25rem);
}

/* Párrafos responsivos */
p {
  font-size: clamp(1rem, 2vw, 1.25rem);
  line-height: 1.6;
}


#scrollable {
    margin-top: 60px;
    max-height: 350px; /* Ajusta la altura máxima según tus necesidades */
    overflow-y: auto;
}

.post-excerpt {
    position: relative;
    max-height: 150px;  /* Ajusta según necesites */
    overflow: hidden;
}

.post-excerpt p {
    margin: 0;
    padding: 0;
    text-align: justify;
}

.post-excerpt:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;  /* Altura del degradado */
    background: linear-gradient(to bottom, #ffffff00 0%, rgba(255,255,255,1) 100%);
}

.read-more {
    display: block;
    margin-top: 10px;
    text-align: right;
    color: #007bff;
    text-decoration: none;
}

.read-more:hover {
    text-decoration: underline;
}

.contact-form {
    max-width: 600px;
    margin: 0 auto;
}

.form-group {
    margin-bottom: 15px;
}

.footer-icons {
    display: flex;
    justify-content: space-between;
}

.footer-icons a {
    text-decoration: none;
}

.footer-icons .btn {
    display: flex;
    align-items: center;
}

.footer-icons .btn i {
    margin-right: 5px;
}

.seccion-derecha {
  position: relative;
  background: linear-gradient(to left, white 70%, #0d6efd 100%);
  padding: 50px; /* Ajusta el padding según tu diseño */
}

.icono-decoracion img {
  max-width: 100%;
}

.bienvenido-titulo {
  font-size: 1.5rem;
  font-weight: bold;
}

.color-titulo {
  color: #0d6efd; /* Azul primario de Bootstrap */
}

/* Opción con un degradado más curvado usando radial-gradient */
.seccion-derecha {
  background: radial-gradient(circle at 10% 90%, #ffffff 65%, #0d6efd 100%);
  padding: 4rem 3rem;
  border-top-left-radius: 40px;
  box-shadow: inset 0 0 60px rgba(13,110,253,0.08), 0 0 40px rgba(13,110,253,0.1);
  transition: all 0.5s ease-in-out;
}

.seccion-derecha:hover {
  background: radial-gradient(circle at 20% 80%, #ffffff 55%, #3299ff 100%);
  box-shadow: inset 0 0 80px rgba(13,110,253,0.12), 0 0 60px rgba(13,110,253,0.15);
  transform: scale(1.01);
}


/* color de botones */
.btn-soft-primary {
  background-color: #b6d4fe;  /* un azul claro */
  color: #084298;             /* texto azul oscuro */
  border: 1px solid #b6d4fe;
}

.btn-soft-primary:hover {
  background-color: #b6d4fe;
  color: #052c65;
}
.btn-soft-primary:focus {
  box-shadow: 0 0 0 0.2rem rgba(13, 123, 233, 0.25);
}

.richtext-content img,
.ck-content img {
  max-width: 100% !important;
  height: auto !important;
  display: block;
  margin: 1rem auto;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

/* ===== Cloudinary media visibility fixes (global, no JS) ===== */
img.cloudinary-img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: cover;
}

.cloudinary-wrap {
  overflow: visible !important;
  min-height: 1px !important;
}

/* Specific fix for card images with fixed height */
img.cloudinary-card-img {
  width: 100% !important;
  height: 220px !important;
  object-fit: cover !important;
  display: block !important;
}

/* Attribute-selector fallback: apply styles automatically to Cloudinary images */
img[src*="res.cloudinary.com"] {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
}

/* If used inside Bootstrap cards, ensure cover behavior */
.card img.card-img-top[src*="res.cloudinary.com"] {
  object-fit: cover !important;
}

/* Override problematic class when present */
img[src*="res.cloudinary.com"].object-fit-cover {
  object-fit: cover !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
}

/* Guard against collapsed parent containers */
.card, .carousel, .cloudinary-wrap {
  overflow: visible !important;
}