html {
    scroll-behavior: smooth;
}

.gradient-text {
    background: linear-gradient(90deg, #ff3d00 0%, #d91772 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent
}

.card {
    position: relative
}

.card::after {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: 16px;
    filter: blur(14px);
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
    z-index: 0
}

.card:hover::after {
    opacity: 1
}

@keyframes float {
    0% {
        transform: translateY(0)
    }
    50% {
        transform: translateY(-6px)
    }
    100% {
        transform: translateY(0)
    }
}

.animate-float {
    animation: float 6s ease-in-out infinite
}

section {
    scroll-margin-top: 50px; /* adapte la valeur à la hauteur de ton header */
}

@media(max-width: 1024px){
    #summaryMenu {
        transition: max-height 0.3s ease, opacity 0.3s ease;
        overflow: hidden;
        max-height: 0;
        opacity: 0;
    }
}

#summaryMenu.open {
    display: flex !important;
    max-height: 500px; /* assez grand pour contenir les liens */
    opacity: 1;
}
/* Spark keyframes */
@keyframes spark {
    0% { transform: translateY(0) scale(1); opacity: 1; }
    100% { transform: translateY(-200px) scale(0.5); opacity: 0; }
}

/* Flash light animation */
.flash-light {
    opacity: 1;
    transition: opacity 1.5s ease-out;
}

/* Card spin reveal */
#certificateWrapper.reveal {
    opacity: 1 !important;
    transform: rotateY(720deg) scale(1) !important; /* 2 tours complets */
    transition: transform 3s ease-out, opacity 1.5s ease-in;
}

#certificateCard {
    transform: rotateY(0deg) scale(0.6); /* point de départ */
    opacity: 0;
}

.same-height {
    align-items: stretch;
}

.same-height > label > div {
    height: 100%; /* force chaque box à occuper toute la hauteur disponible */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}


@media(max-width: 768px){
    iframe {
        width: 100% !important;
        max-width: 100%;
    }
}