/* Color Naranja Asefimex */
    .text-orange { color: #FF7B00; }
    .border-orange { border: 2px solid #FF7B00 !important; border-radius: 12px; }

    /* Tamaño de las imágenes en las tarjetas pequeñas */
    .card-img-top {
        height: 120px;
        object-fit: contain; /* Para que el logo/imagen no se corte */
    }

    .card {
        transition: transform 0.2s;
    }
/* 
    .card:hover {
        transform: scale(1.05);
    } */

    /* Ajuste de flechas para que no tapen las tarjetas */
    .carousel-control-prev { left: -50px; }
    .carousel-control-next { right: -50px; }

    @media (max-width: 768px) {
        .carousel-control-prev { left: -20px; }
        .carousel-control-next { right: -20px; }
    }

    .card-img-top {
    width: 100%;
    height: 150px; /* Altura fija para que todas las tarjetas sean iguales */
    object-fit: contain; /* Esto evita que la imagen se estire feo */
    background-color: #fff; /* Fondo blanco por si la imagen es transparente */
}

/* Contenedor necesario para posicionar el overlay */
    .card-image-container {
        position: relative;
        overflow: hidden; /* Importante para que el overlay no se salga */
        border-radius: 10px 10px 0 0;
    }

    /* Estilo del Overlay (Oculto por defecto) */
    .card-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: white; /* Naranja Asefimex con transparencia */
        color: white;
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: 0; /* Invisible */
        transition: all 0.4s ease-in-out;
        transform: translateY(100%); /* Viene desde abajo */
    }

    /* Efecto al pasar el Mouse */
    .product-card:hover .card-overlay {
        opacity: 1;
        transform: translateY(0);
    }

    /* Ajuste de la imagen bajo el overlay */
    .product-card:hover .card-img-top {
        filter: blur(2px); /* Opcional: desenfoca un poco la imagen de fondo */
        transform: scale(1.1);
        transition: 0.4s;
    }

    .overlay-content h6 {
        letter-spacing: 1px;
        text-transform: uppercase;
    }

    .overlay-content ul li {
        margin-bottom: 5px;
    }
    card-img-border {
        border: 2px solid #FF7B00 !important;
        border-radius: 12px;
    }
    /* Forzamos el tamaño de la tarjeta */
    .product-card {
        min-height: 400px; /* Tarjeta más alta */
        overflow: hidden;
        border: 2px solid #FF7B00 !important;
        border-radius: 15px !important;
        transition: transform 0.3s ease;
    }

    /* Contenedor de la imagen: ahora ocupa la mayor parte de la tarjeta */
    .card-image-container {
        position: relative;
        height: 320px; /* Altura grande para la imagen */
        width: 100%;
        overflow: hidden;
    }

    /* La imagen ahora llena el contenedor */
    .card-img-top {
        width: 100%;
        height: 100% !important;
        object-fit: cover; /* Esto hace que la imagen no se vea pequeña */
        transition: transform 0.5s ease;
    }

    /* Capa de información (Overlay) */
    .card-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(#FFFFFF, 0.95);
        
        /* Naranja Asefimex */
        color: white;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.4s ease;
        padding: 20px;
        text-align: center;
    }

    /* Efecto Hover */
    .product-card:hover .card-overlay {
        opacity: 1;
    }

    .product-card:hover .card-img-top {
        transform: scale(1.1);
    }

    /* Título al pie de la tarjeta */
    .card-footer-title {
        background: white;
        padding: 15px;
        border-top: 1px solid #eee;
    }