/*
 * MediQual — Photos finales des spécialités
 */

.cards-grid .card-link {
    padding: 0 0 26px !important;
    overflow: hidden !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    transition:
        transform 260ms ease,
        box-shadow 260ms ease,
        border-color 260ms ease !important;
}

.cards-grid .card-link:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 22px 45px rgba(11, 53, 88, 0.12) !important;
    border-color: rgba(11, 110, 168, 0.28) !important;
}

.cards-grid .card-link > .card__icon {
    display: none !important;
}

.mq-specialty-photo {
    position: relative;
    width: 100%;
    height: 235px;
    margin: 0 0 28px;
    overflow: hidden;
    background: #eaf4f7;
}

.mq-specialty-photo::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(
            180deg,
            rgba(11, 53, 88, 0.00) 55%,
            rgba(11, 53, 88, 0.12) 100%
        );
}

.mq-specialty-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 480ms cubic-bezier(.22, 1, .36, 1);
}

.cards-grid .card-link:hover .mq-specialty-photo img {
    transform: scale(1.055);
}

/* Espacement intérieur du contenu texte */
.cards-grid .card-link > h2,
.cards-grid .card-link > h3,
.cards-grid .card-link > p,
.cards-grid .card-link > .text-link {
    margin-left: 28px !important;
    margin-right: 28px !important;
}

.cards-grid .card-link > h2,
.cards-grid .card-link > h3 {
    margin-top: 0 !important;
}

.cards-grid .card-link > p {
    color: #627788 !important;
}

@media (max-width: 1100px) {
    .mq-specialty-photo {
        height: 220px;
    }
}

@media (max-width: 700px) {
    .cards-grid .card-link {
        padding-bottom: 22px !important;
    }

    .mq-specialty-photo {
        height: 210px;
        margin-bottom: 24px;
    }

    .cards-grid .card-link > h2,
    .cards-grid .card-link > h3,
    .cards-grid .card-link > p,
    .cards-grid .card-link > .text-link {
        margin-left: 22px !important;
        margin-right: 22px !important;
    }
}
