/* 1) HERO
   ------------------------------------------------------------ */
/* Imagen principal del hero.
   - Altura: similar a lo que tenías (clamp para un mínimo y máximo).
   - object-fit: cover para cubrir todo el cuadro sin deformarse.
   - object-position: centrado por defecto en desktop. */
#hero .hero-img {
    height: clamp(600px, 55vh, 640px);
    width: 100%;
    object-fit: cover;
    object-position: 50% 50%; /* centrado */
}

/* Overlay (degradado) que oscurece a la izquierda y se desvanece a la derecha.
   Mantiene tus paddings de Bootstrap (p-3 p-sm-4 p-lg-5) en el HTML. */
#hero .hero-overlay {
    background: linear-gradient(
            90deg,
            rgba(0,0,0,.60) 0%,
            rgba(0,0,0,.35) 50%,
            rgba(0,0,0,0) 100%
    );
}

/* En móviles: recuadre más a la derecha.
   Explicación simple: con object-fit: cover, object-position controla qué parte
   de la foto se prioriza. Si subimos el porcentaje horizontal, el recorte
   "muestra" más contenido del lado derecho (porque movemos la imagen hacia la izquierda
   dentro del cuadro). Ajusta 70% -> 75% o 80% si necesitas aún más. */
@media (max-width: 575.98px) {
    #hero .hero-img {
        object-position: 80% 50%;
    }
}
/* Tables/phones más anchos: ajuste algo menor (opcional) */
@media (min-width: 576px) and (max-width: 767.98px) {
    #hero .hero-img {
        object-position: 60% 50%;
    }
}


/* 2) ÁREAS DE APLICACIÓN: imágenes de cards
   ------------------------------------------------------------ */

/* Alto fijo sin inline; mantiene recorte agradable */
.img-cover-220 {
    height: 220px;
    width: 100%;
    object-fit: cover;
    object-position: center;
}

/* 3) Pequeñas mejoras generales de la página (opcionales)
   ------------------------------------------------------------ */

/* Sombra sutil al pasar sobre cards con tu clase card-hover */
.card-hover {
    transition: transform .18s ease, box-shadow .18s ease;
}
.card-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 0.75rem 1.25rem rgba(0,0,0,.08);
}