@media (min-width: 1100px) and (max-width: 1500px) {
    .col-xl-3 {
        flex: 0 0 33.333%;
        max-width: 33.333%;
    }
}

@media (max-width: 800px) {
    .col-sm-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* Styles pour les cards */
.custom-card {
    color: var(--text-color) !important;
    border-radius: 12px;
    box-shadow: 0 4px 8px 0 var(--terciary-color), 0 6px 20px 0 var(--terciary-color);
}

.profile-image-placeholder img {
    max-width: 100px;
    height: auto;
    border-radius: 50%;
    border: 1px solid var(--text-color) !important;
}

.custom-card:hover .profile-image-placeholder img {
    filter: brightness(50%);
    transition: filter 0.3s ease;
}

.card-header {
    background-color: var(--background-color) !important;
    border-bottom: 1px solid var(--text-color) !important;
}

.card-footer {
    background-color: unset;
}

.social-logo {
    transition: transform 0.3s ease;
}