.tvs-hover-lift {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.tvs-hover-lift:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

.tvs-hover-scale {
    transition: transform 0.3s ease;
}
.tvs-hover-scale:hover {
    transform: scale(1.05);
}

.tvs-hover-glow {
    transition: box-shadow 0.3s ease;
}
.tvs-hover-glow:hover {
    box-shadow: 0 0 30px rgba(99, 102, 241, 0.5);
}

.tvs-hover-rotate {
    transition: transform 0.4s ease;
}
.tvs-hover-rotate:hover {
    transform: rotate(5deg);
}

.tvs-hover-blur {
    transition: filter 0.3s ease;
}
.tvs-hover-blur:hover {
    filter: blur(2px);
}

.tvs-gradient-animate {
    background-size: 200% 200%;
    animation: tvsGradientShift 4s ease infinite;
}

@keyframes tvsGradientShift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.tvs-text-shimmer {
    background: linear-gradient(90deg, #667eea, #764ba2, #f093fb, #667eea);
    background-size: 300% 100%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: tvsTextShimmer 3s linear infinite;
}

@keyframes tvsTextShimmer {
    0% { background-position: 0% 50%; }
    100% { background-position: 300% 50%; }
}

.tvs-text-glow {
    animation: tvsTextGlow 2s ease-in-out infinite alternate;
}

@keyframes tvsTextGlow {
    from { text-shadow: 0 0 10px rgba(99, 102, 241, 0.5); }
    to   { text-shadow: 0 0 30px rgba(99, 102, 241, 1), 0 0 60px rgba(99, 102, 241, 0.5); }
}

.tvs-border-animate {
    position: relative;
    overflow: hidden;
}
.tvs-border-animate::before {
    content: '';
    position: absolute;
    inset: 0;
    border: 2px solid transparent;
    border-radius: inherit;
    background: linear-gradient(90deg, #667eea, #764ba2, #f093fb) border-box;
    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: destination-out;
    mask-composite: exclude;
    animation: tvsBorderRotate 3s linear infinite;
}

@keyframes tvsBorderRotate {
    to { filter: hue-rotate(360deg); }
}

.tvs-ripple {
    position: relative;
    overflow: hidden;
}
.tvs-ripple::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    animation: tvsRipple 2s ease-out infinite;
}

@keyframes tvsRipple {
    to { width: 300%; height: 300%; opacity: 0; }
}

.tvs-counter {
    display: inline-block;
    font-variant-numeric: tabular-nums;
}

.tvs-parallax-slow {
    transform: translateZ(0);
    will-change: transform;
}

.tvs-skeleton {
    background: linear-gradient(90deg, #e2e8f0 25%, #cbd5e1 50%, #e2e8f0 75%);
    background-size: 200% 100%;
    animation: tvsShimmer 1.5s infinite;
    border-radius: 4px;
}

.tvs-reveal-left {
    clip-path: inset(0 100% 0 0);
    animation: tvsRevealLeft 0.8s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}
.tvs-reveal-right {
    clip-path: inset(0 0 0 100%);
    animation: tvsRevealRight 0.8s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}
.tvs-reveal-up {
    clip-path: inset(100% 0 0 0);
    animation: tvsRevealUp 0.8s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}

@keyframes tvsRevealLeft  { to { clip-path: inset(0 0% 0 0); } }
@keyframes tvsRevealRight { to { clip-path: inset(0 0 0 0%); } }
@keyframes tvsRevealUp    { to { clip-path: inset(0% 0 0 0); } }

.tvs-morph {
    border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
    animation: tvsMorph 8s ease-in-out infinite;
}

@keyframes tvsMorph {
    0%, 100% { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; }
    25%       { border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%; }
    50%       { border-radius: 50% 60% 30% 60% / 30% 40% 70% 50%; }
    75%       { border-radius: 40% 60% 50% 40% / 60% 30% 60% 40%; }
}

.tvs-neon {
    animation: tvsNeon 1.5s ease-in-out infinite alternate;
}

@keyframes tvsNeon {
    from {
        box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #667eea, 0 0 40px #667eea;
    }
    to {
        box-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 40px #764ba2, 0 0 80px #764ba2;
    }
}

@media (max-width: 768px) {
    .tvs-float { animation-duration: 4s; }
    .tvs-pulse { animation-duration: 3s; }
    .tvs-gradient-animate { animation-duration: 6s; }
}
