/*
Theme Name: Kastell Child
Theme URI: https://kastell.qodeinteractive.com/
Description: A child theme of Kastell Theme
Author: Mikado Themes
Author URI: http://themeforest.net/user/mikado-themes
Version: 1.0.2
Text Domain: kastell
Template: kastell
*/
.vc_custom_1513350813421 {
    margin-right: 40px !important;
    margin-left: 40px !important;
}
.vc_custom_1513863914988 {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
}
.features-container {
    display: flex;
    flex-wrap: wrap; /* Permet de passer à une nouvelle ligne si nécessaire */
    gap: 20px; /* Espacement entre les blocs */
}

.features-container .vc_column_container {
    flex: 1 1 calc(25% - 20px); /* 4 colonnes sur les grands écrans */
    max-width: calc(25% - 20px); /* Largeur maximale des colonnes */
    box-sizing: border-box; /* Inclut les bordures et marges dans la largeur totale */
}

@media (max-width: 1024px) {
    .features-container .vc_column_container {
        flex: 1 1 calc(33.33% - 20px); /* 3 colonnes sur tablettes */
        max-width: calc(33.33% - 20px);
    }
}

@media (max-width: 768px) {
    .features-container .vc_column_container {
        flex: 1 1 calc(50% - 20px); /* 2 colonnes sur petits écrans */
        max-width: calc(50% - 20px);
    }
}

@media (max-width: 480px) {
    .features-container .vc_column_container {
        flex: 1 1 100%; /* 1 colonne sur les écrans très petits */
        max-width: 100%;
    }
}

/* Conteneur du slider */
.slider-container {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    position: relative;
}

/* Style du slider principal (image principale en grand) */
.main-slider {
    width: 100%;
    height: 500px; /* Hauteur pour l'image principale */
    margin-bottom: 15px;
}

.main-slider .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}

/* Style des miniatures en bas */
.thumbnails-slider {
    width: 100%;
    height: 100px; /* Taille des miniatures */
}

.thumbnails-slider .swiper-slide {
    width: auto;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 5px;
}

.thumbnails-slider .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
    cursor: pointer;
    transition: transform 0.3s ease;
}

.thumbnails-slider .swiper-slide:hover img {
    transform: scale(1.1); /* Effet au survol */
}