.disp_component {
    margin-bottom: clamp(20px, 3vw, 40px);
    width: 100%;
}

.disp_component a {
    display: block;
    text-decoration: none;
    transition: opacity var(--transition-fast, 0.2s);
}

.disp_component a:hover {
    opacity: 0.9;
}

.disp_component a img {
    border-radius: 16px;
    width: 100%;
    height: auto;
    object-fit: cover;
    aspect-ratio: 16/9; 
    transition: transform var(--transition-base, 0.3s);
    box-shadow: var(--shadow-sm, 0 2px 8px rgba(0,0,0,0.05));
}

.disp_component a:hover img {
    transform: scale(1.02);
    box-shadow: var(--shadow-md, 0 4px 16px rgba(0,0,0,0.08));
}

@media (min-width: 1024px) {
    .disp_component a img {
        aspect-ratio: 21/9; 
        max-height: 250px;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .disp_component a img {
        aspect-ratio: 16/9;
        max-height: 220px;
    }
}

@media (max-width: 767px) {
    .disp_component a img {
        aspect-ratio: 4/3; 
        max-height: 200px;
    }
}


@media (max-width: 426px) {
    .disp_component {
        display: none; 
    }
}