/* Stato iniziale comune */
.mario-anim {

    /* Stato iniziale */
    opacity: 0;

    /* Variabili trasformazioni */
    --mario-translate-x: 0px;
    --mario-translate-y: 0px;
    --mario-scale: 1;
    --mario-rotate: 0deg;

    /* Variabili timing */
    --mario-duration: 0.6s;
    --mario-delay: 0s;
    --mario-easing: cubic-bezier(0.4, 0, 0.2, 1);

    transform:
        translateX(var(--mario-translate-x))
        translateY(var(--mario-translate-y))
        scale(var(--mario-scale))
        rotate(var(--mario-rotate));

    transition:
        opacity var(--mario-duration) var(--mario-easing) var(--mario-delay),
        transform var(--mario-duration) var(--mario-easing) var(--mario-delay);
}
.mario-anim.is-visible {
    opacity: 1;

    --mario-translate-x: 0px;
    --mario-translate-y: 0px;
    --mario-scale: 1;
    --mario-rotate: 0deg;
}
.mario-from-y-20 { --mario-translate-y: 20px; }
.mario-from-y-50 { --mario-translate-y: 50px; }
.mario-from-y-100 { --mario-translate-y: 100px; }
.mario-from-y-200 { --mario-translate-y: 200px; }
.mario-from-x-0 { --mario-translate-x: 0px; }
.mario-from-x-20 { --mario-translate-x: 20px; }
.mario-from-x-80 { --mario-translate-x: 80px; }
.mario-from-y--20 { --mario-translate-y: -20px; }
.mario-from-y--50 { --mario-translate-y: -50px; }
.mario-from-y--100 { --mario-translate-y: -100px; }
.mario-from-y--200 { --mario-translate-y: -200px; }
.mario-from-x--20 { --mario-translate-x: -20px; }
.mario-from-x--80 { --mario-translate-x: -80px; }
.mario-from-scale-400 { --mario-scale: 4; }
.mario-from-scale-200 { --mario-scale: 2; }
.mario-from-scale-150 { --mario-scale: 1.5; }
.mario-from-scale-90 { --mario-scale: 0.9; }
.mario-from-scale-80 { --mario-scale: 0.8; }
.mario-from-scale-70 { --mario-scale: 0.7; }
.mario-from-scale-60 { --mario-scale: 0.6; }
.mario-from-scale-50 { --mario-scale: 0.5; }
.mario-from-scale-40 { --mario-scale: 0.4; }
.mario-from-scale-30 { --mario-scale: 0.3; }
.mario-from-scale-20 { --mario-scale: 0.2; }
.mario-from-scale-10 { --mario-scale: 0.1; }
.mario-from-rotate-5  { --mario-rotate: 5deg; }
.mario-from-rotate-10 { --mario-rotate: 10deg; }
.mario-delay-200 { --mario-delay: 0.2s; }
.mario-delay-400 { --mario-delay: 0.4s; }
.mario-delay-600 { --mario-delay: 0.6s; }
.mario-delay-800 { --mario-delay: 0.8s; }
.mario-delay-1000 { --mario-delay: 1s; }
.mario-delay-1500 { --mario-delay: 1.5s; }

.mario-duration-300 { --mario-duration: 0.3s; }
.mario-duration-400 { --mario-duration: 0.4s; }
.mario-duration-500 { --mario-duration: 0.5s; }
.mario-duration-600 { --mario-duration: 0.6s; }
.mario-duration-800 { --mario-duration: 0.8s; }
.mario-duration-1000 { --mario-duration: 1s; }
.mario-duration-1500 { --mario-duration: 1.5s; }
.mario-duration-2000 { --mario-duration: 2s; }
.mario-duration-2500 { --mario-duration: 2.5s; }
.mario-duration-3000 { --mario-duration: 3s; }
.mario-duration-4000 { --mario-duration: 4s; }
.mario-ease-soft {
    --mario-easing: cubic-bezier(0.25, 0.1, 0.25, 1);
}

.mario-ease-bounce {
    --mario-easing: cubic-bezier(0.34, 1.56, 0.64, 1);
}

.mario-ease-elastic {
    --mario-easing: cubic-bezier(0.5, 1.4, 0.4, 1);
}


/* Fade In */
.mario-fade-in.is-visible {
    opacity: 1;
    transform: none;
}

/* Slide Up */
.mario-slide-up.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Zoom In */
.mario-zoom-in {
    transform: scale(0.8);
}
.mario-zoom-in.is-visible {
    opacity: 1;
    transform: scale(1);
}

/* Bounce In (versione definitiva, coerente con il framework) */
.mario-bounce-in {
    opacity: 0;
    transform: scale(0.8);
}

.mario-bounce-in.is-visible {
    opacity: 1;
    transform: scale(1);
    transition: opacity 0.6s cubic-bezier(0.34, 1.56, 0.64, 1),
                transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes marioBounce {
    0%   { transform: scale(0.8); }
    60%  { transform: scale(1.1); }
    100% { transform: scale(1); }
}
/* Bounce In Strong */
.mario-bounce-in-strong {
    opacity: 0;
    transform: scale(0.5);
}

.mario-bounce-in-strong.is-visible {
    opacity: 1;
    transform: scale(1);
    transition: opacity 0.7s cubic-bezier(0.3, 1.8, 0.4, 1),
                transform 0.7s cubic-bezier(0.3, 1.8, 0.4, 1);
}

/* Delay */
.mario-delay-200 { transition-delay: 0.2s !important; }
.mario-delay-400 { transition-delay: 0.4s !important; }
.mario-delay-500 { transition-delay: 0.5s !important; }
.mario-delay-600 { transition-delay: 0.6s !important; }
.mario-delay-800 { transition-delay: 0.8s !important; }
.mario-delay-1000 { transition-delay: 1s !important; }
.mario-delay-1500 { transition-delay: 1.5s !important; }
.mario-delay-2000 { transition-delay: 2s !important; }
.mario-delay-3000 { transition-delay: 3s !important; }
.mario-delay-4000 { transition-delay: 4s !important; }
/* Durate */
.mario-duration-200 { transition-duration: 0.2s !important; }
.mario-duration-300 { transition-duration: 0.3s !important; }
.mario-duration-500 { transition-duration: 0.5s !important; }
.mario-duration-600 { transition-duration: 0.6s !important; }
.mario-duration-800 { transition-duration: 0.8s !important; }
.mario-duration-1000 { transition-duration: 1s !important; }
.mario-duration-1500 { transition-duration: 1.5s !important; }
.mario-duration-2000 { transition-duration: 2s !important; }
.mario-duration-2500 { transition-duration: 2.5s !important; }
.mario-duration-3000 { transition-duration: 3s !important; }
.mario-duration-4000 { transition-duration: 4s !important; }
/* Translate Y Utilities */
.mario-transform-y-10   { transform: translateY(10px) !important; }
.mario-transform-y-20   { transform: translateY(20px) !important; }
.mario-transform-y-50   { transform: translateY(50px) !important; }
.mario-transform-y-75   { transform: translateY(75px) !important; }
.mario-transform-y-100  { transform: translateY(100px) !important; }
.mario-transform-y-150  { transform: translateY(150px) !important; }
.mario-transform-y-200  { transform: translateY(200px) !important; }
/* Translate X Utilities */
.mario-transform-x-10   { transform: translateX(10px) !important; }
.mario-transform-x-20   { transform: translateX(20px) !important; }
.mario-transform-x-50   { transform: translateX(50px) !important; }
.mario-transform-x-75   { transform: translateX(75px) !important; }
.mario-transform-x-100  { transform: translateX(100px) !important; }
.mario-transform-x-150  { transform: translateX(150px) !important; }
.mario-transform-x-200  { transform: translateX(200px) !important; }
/* Scale Utilities */
.mario-scale-90  { transform: scale(0.9) !important; }
.mario-scale-80  { transform: scale(0.8) !important; }
.mario-scale-70  { transform: scale(0.7) !important; }
.mario-scale-60  { transform: scale(0.6) !important; }
.mario-scale-50  { transform: scale(0.5) !important; }
/* Rotate Utilities */
.mario-rotate-3   { transform: rotate(3deg) !important; }
.mario-rotate-5   { transform: rotate(5deg) !important; }
.mario-rotate-10  { transform: rotate(10deg) !important; }
.mario-rotate-15  { transform: rotate(15deg) !important; }
/* Esasing */
.mario-ease-soft {
    transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1) !important;
}
.mario-ease-smooth {
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.mario-ease-snappy {
    transition-timing-function: cubic-bezier(0.15, 1.1, 0.3, 1) !important;
}
.mario-ease-swift {
    transition-timing-function: cubic-bezier(0.4, 0, 1, 1) !important;
}
.mario-ease-bounce {
    transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}
.mario-ease-elastic {
    transition-timing-function: cubic-bezier(0.5, 1.4, 0.4, 1) !important;
}
/* Preset */
.mario-preset-hero {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 1s cubic-bezier(0.4, 0, 0.2, 1),
                transform 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.mario-preset-hero.is-visible {
    opacity: 1;
    transform: none;
}
.mario-preset-subtitle {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s cubic-bezier(0.25, 0.1, 0.25, 1),
                transform 0.8s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition-delay: 0.2s;
}

.mario-preset-subtitle.is-visible {
    opacity: 1;
    transform: none;
}
.mario-preset-paragraph {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.mario-preset-paragraph.is-visible {
    opacity: 1;
    transform: none;
}
.mario-preset-cta {
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 0.4s cubic-bezier(0.15, 1.1, 0.3, 1),
                transform 0.4s cubic-bezier(0.15, 1.1, 0.3, 1);
    transition-delay: 0.1s;
}

.mario-preset-cta.is-visible {
    opacity: 1;
    transform: scale(1);
}
.mario-preset-image {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 1s cubic-bezier(0.4, 0, 0.2, 1),
                transform 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.mario-preset-image.is-visible {
    opacity: 1;
    transform: none;
}
.mario-preset-section {
    opacity: 0;
    transform: translateY(60px);
    transition: opacity 1.2s cubic-bezier(0.25, 0.1, 0.25, 1),
                transform 1.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition-delay: 0.4s;
}

.mario-preset-section.is-visible {
    opacity: 1;
    transform: none;
}
.mario-preset-card {
    opacity: 0;
    transform: translateY(30px) scale(0.95);
    transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.mario-preset-card.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
}
.mario-preset-feature {
    opacity: 0;
    transform: translateY(50px) scale(0.9);
    transition: opacity 1s cubic-bezier(0.25, 0.1, 0.25, 1),
                transform 1s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition-delay: 0.2s;
}

.mario-preset-feature.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
}
.mario-preset-list {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.mario-preset-list.is-visible {
    opacity: 1;
    transform: none;
}
.mario-preset-image-soft {
    opacity: 0;
    transform: translateY(20px);
    filter: blur(8px);
    transition: opacity 1s cubic-bezier(0.4, 0, 0.2, 1),
                transform 1s cubic-bezier(0.4, 0, 0.2, 1),
                filter 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.mario-preset-image-soft.is-visible {
    opacity: 1;
    transform: none;
    filter: blur(0);
}
.mario-preset-cta-strong {
    opacity: 0;
    transform: scale(0.85);
    transition: opacity 0.4s cubic-bezier(0.15, 1.1, 0.3, 1),
                transform 0.4s cubic-bezier(0.15, 1.1, 0.3, 1);
    transition-delay: 0.1s;
}

.mario-preset-cta-strong.is-visible {
    opacity: 1;
    transform: scale(1);
}
/* Combined animations */
.mario-fade-slide-up {
    opacity: 0;
    transform: translateY(20px);
}

.mario-fade-slide-up.is-visible {
    opacity: 1;
    transform: translateY(0);
}
.mario-fade-slide-left {
    opacity: 0;
    transform: translateX(80px);
}

.mario-fade-slide-left.is-visible {
    opacity: 1;
    transform: translateX(0);
}
.mario-fade-slide-right {
    opacity: 0;
    transform: translateX(-80px);
}

.mario-fade-slide-right.is-visible {
    opacity: 1;
    transform: translateX(0);
}
.mario-zoom-fade {
    opacity: 0;
    transform: scale(0.85);
}

.mario-zoom-fade.is-visible {
    opacity: 1;
    transform: scale(1);
}
.mario-bounce-fade {
    opacity: 0;
    transform: scale(0.8);
}

.mario-bounce-fade.is-visible {
    opacity: 1;
    animation: marioBounce 0.6s ease;
}
.mario-fade-slide-up-repeat {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 1s ease, transform 1s ease;
}

.mario-fade-slide-up-repeat.is-visible {
    opacity: 1;
    transform: translateY(0);
}
.mario-fade-in-repeat {
    opacity: 0;
    transition: opacity 1s ease;
}

.mario-fade-in-repeat.is-visible {
    opacity: 1;
}
.mario-zoom-in-repeat {
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 1s ease, transform 1s ease;
}

.mario-zoom-in-repeat.is-visible {
    opacity: 1;
    transform: scale(1);
}
.mario-bounce-in-repeat {
    opacity: 0;
    transform: scale(0.8);
    transition: opacity 0.8s cubic-bezier(0.34, 1.56, 0.64, 1),
                transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.mario-bounce-in-repeat.is-visible {
    opacity: 1;
    transform: scale(1);
}

/* Preset builder */
/* Preset: NOME */
.mario-preset-NOME {
    opacity: 0;
    transform: TRANSLATE/ZOOM/COMBO;
    filter: FILTRO_INIZIALE; /* opzionale */
    transition: opacity DURATA EASING,
                transform DURATA EASING,
                filter DURATA EASING; /* opzionale */
    transition-delay: DELAY; /* opzionale */
}

.mario-preset-NOME.is-visible {
    opacity: 1;
    transform: TRANSFORM_FINALE;
    filter: FILTRO_FINALE; /* opzionale */
}