body {
    padding: 0px;
    margin: 0px;
    overflow-x: hidden;
    overflow-y: scroll;
}

/* Bouton responsive */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: clamp(0.6rem, 2vw, 0.9rem) clamp(1.2rem, 4vw, 1.8rem);
    font-size: clamp(0.9rem, 2.5vw, 1rem);
    font-weight: 600;

    color: #fff;
    /*background: linear-gradient(135deg, #6366f1, #4f46e5);*/
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.5), rgba(79, 70, 229, 0.5));
    border: none;
    border-radius: 999px;

    cursor: pointer;
    text-decoration: none;
    transition:
            transform 0.2s ease,
            box-shadow 0.2s ease,
            background 0.2s ease;
}

/* Hover */
.btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(79, 70, 229, 0.35);
}

/* Active */
.btn:active, .btn.active {
    transform: translateY(0);
    /*box-shadow: 0 4px 10px rgba(79, 70, 229, 0.3);*/
    /*box-shadow: 0 4px 10px rgb(70, 229, 205);*/
    background: linear-gradient(135deg, #6366f1, #4f46e5);

}

/* Focus (accessibilité) */
.btn:focus-visible {
    outline: 3px solid rgba(99, 102, 241, 0.6);
    outline-offset: 3px;
}

/* Désactivé */
.btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    box-shadow: none;
    transform: none;
}

/* Réduction des animations si l’utilisateur le demande */
@media (prefers-reduced-motion: reduce) {
    .btn {
        transition: none;
    }
}
