.scrollbar-none::-webkit-scrollbar {
    display: none;
}

.scrollbar-none {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Ticker de Beneficios Infinito (Marquee) */
@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

.marquee-track {
    display: flex;
    width: max-content;
    animation: marquee 25s linear infinite;
}

.marquee-track:hover {
    animation-play-state: paused;
}

.mask-gradient {
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}

/* Custom UI Micro-animations */
.glass-panel {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.cta-hover {
    transition: all 0.3s ease;
}

.cta-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -5px rgba(20, 143, 155, 0.4), 0 8px 10px -6px rgba(20, 143, 155, 0.1);
    /* brand-600 shadow */
}

.product-card {
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.product-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

@keyframes shake-periodic {
    0%,
    90% {
        transform: translate3d(0, 0, 0);
    }

    91%,
    99% {
        transform: translate3d(-2px, 0, 0);
    }

    92%,
    98% {
        transform: translate3d(3px, 0, 0);
    }

    93%,
    95%,
    97% {
        transform: translate3d(-5px, 0, 0);
    }

    94%,
    96% {
        transform: translate3d(5px, 0, 0);
    }

    100% {
        transform: translate3d(0, 0, 0);
    }
}

.animate-shake-periodic {
    animation: shake-periodic 8s cubic-bezier(.36, .07, .19, .97) both infinite;
}

/* Efeeto dinámico para links del menú */
.nav-link-custom {
    position: relative;
    padding: 0.25rem 0;
    transition: color 0.3s ease, transform 0.2s ease;
}

/* Efecto Underline Slide-in */
.nav-link-custom::after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: -2px;
    left: 0;
    background: linear-gradient(to right, #148F9B, #42C8B9); /* Gradient using brand-600 and brand-400 */
    transform-origin: bottom right;
    transition: transform 0.3s cubic-bezier(0.86, 0, 0.07, 1);
}

.nav-link-custom:hover::after {
    transform: scaleX(1);
    transform-origin: bottom left;
}

/* Micro-animación de escala y traducción en hover */
.nav-link-custom:hover {
    transform: translateY(-1.5px);
}

/* Micro-animación de presión al hacer click (active state) */
.nav-link-custom:active {
    transform: scale(0.93) translateY(0);
}

/* --- ESTADOS ACTIVOS DEL MENÚ --- */
/* Menú de Escritorio */
.nav-link-custom.nav-link-active {
    color: #148F9B !important; /* brand-600 */
}

/* Forzar que el underline del hover se mantenga visible y activo */
.nav-link-custom.nav-link-active::after {
    transform: scaleX(1) !important;
    transform-origin: bottom left !important;
}


/* Menú Móvil */
.mobile-link.mobile-link-active {
    color: #42C8B9 !important; /* brand-400 */
    position: relative;
}

/* Bullet point indicador a la izquierda del texto activo en móvil */
.mobile-link.mobile-link-active::before {
    content: '•';
    position: absolute;
    left: -1rem;
    color: currentColor;
    font-size: 1.5rem;
    line-height: 1;
    top: 50%;
    transform: translateY(-50%);
}


