@keyframes fade-up {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

html { scroll-behavior: smooth; }

.animate-fade-up {
    animation: fade-up 1s ease-out forwards;
}

.container-main { max-width: 1280px; margin: 0 auto; padding: 0 1rem; }
.slider-mask {
    padding: 12px 0
}


/* Mặc định: Desktop */
.desktop-only {
    display: block;
}

.tablet-only,
.mobile-only {
    display: none;
}

/* Tablet: width từ 768px đến 1024px */
@media screen and (min-width: 768px) and (max-width: 1280px) {
    .tablet-only {
        display: block !important;
    }

    .desktop-only,
    .mobile-only {
        display: none !important;
    }
}

/* Mobile: width < 768px */
@media screen and (max-width: 767px) {
    .mobile-only {
        display: block !important;
    }

    .desktop-only,
    .tablet-only {
        display: none !important;
    }
}

/* Ẩn mặc định */
.mobile-tablet-only {
    display: none;
}

/* Hiện ở mobile và tablet: max 1024px */
@media screen and (max-width: 1280px) {
    .mobile-tablet-only {
        display: block !important;
    }
}