/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/
Description: Thème enfant de Hello Elementor.
Author: Studio Inko
Author URI: https://studioinko.fr/
Template: hello-elementor
Version: 1.0
Text Domain: hello-elementor-child
*/

/* 🚀 Gestion de l'overlay grille projet */
@media (min-width: 768px) {
    .projects-three-colums-item,
    .projects-two-colums-item {
        position: relative;
        overflow: hidden;
        transition: opacity 0.3s ease-in-out;
    }

    .projects-three-colums-item-overlay,
    .projects-two-colums-item-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100% !important;
        background: rgba(255, 255, 255, 0.6);
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease-in-out;
    }

    .projects-three-colums-item:hover,
    .projects-two-colums-item:hover {
        cursor: pointer;
    }

    .projects-three-colums-item:hover .projects-three-colums-item-overlay,
    .projects-two-colums-item:hover .projects-two-colums-item-overlay {
        opacity: 1;
        transition: opacity 0.3s ease-in-out;
    }

    .projects-three-colums-item:not(:hover) .projects-three-colums-item-overlay,
    .projects-two-colums-item:not(:hover) .projects-two-colums-item-overlay {
        opacity: 0;
        transition: opacity 0.3s ease-out;
    }
}

/* 🚀 Gestion du fadein au chargement de la grille projet */
.projects-two-colums-item,
.projects-three-colums-item {
    opacity: 0;
    transform: translateY(30px);
}

.projects-two-colums-item.loaded,
.projects-three-colums-item.loaded {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 1.2s ease-out, transform 1s ease-out;
}