body { 
    font-family: 'Inter', sans-serif; 
    font-feature-settings: "cv11", "ss01"; 
    -webkit-font-smoothing: antialiased; 
    background-color: white;
    color: #0f172a;
} 
::-webkit-scrollbar { width: 6px; } 
::-webkit-scrollbar-track { background: #fafafa; } 
::-webkit-scrollbar-thumb { background: #e4e4e7; border-radius: 4px; } 
::-webkit-scrollbar-thumb:hover { background: #d4d4d8; } 

.anim-trigger {
    opacity: 0;
    will-change: transform, opacity, clip-path, filter;
}

.anim-scale-out {
    transform: scale(1.1);
    filter: blur(4px);
    transition: opacity 1.5s cubic-bezier(0.16, 1, 0.3, 1), transform 2s cubic-bezier(0.16, 1, 0.3, 1), filter 1.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.anim-scale-out.is-visible {
    opacity: 1;
    transform: scale(1);
    filter: blur(0);
}

.anim-scale-entrance {
    transform: scale(0.9) translateY(40px);
    filter: blur(10px);
    transition: opacity 1.2s cubic-bezier(0.2, 0.8, 0.2, 1), transform 1.2s cubic-bezier(0.2, 0.8, 0.2, 1), filter 1.2s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.anim-scale-entrance.is-visible {
    opacity: 1;
    transform: scale(1) translateY(0);
    filter: blur(0);
}

.anim-split-line {
    clip-path: inset(100% 0 0 0);
    transform: translateY(30px);
    transition: opacity 1.2s cubic-bezier(0.2, 0.8, 0.2, 1), clip-path 1.2s cubic-bezier(0.2, 0.8, 0.2, 1), transform 1.2s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.anim-split-line.is-visible {
    opacity: 1;
    clip-path: inset(0 0 0 0);
    transform: translateY(0);
}

.anim-drift-right {
    transform: translateX(-30px);
    transition: opacity 1.2s cubic-bezier(0.16, 1, 0.3, 1), transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.anim-drift-right.is-visible {
    opacity: 1;
    transform: translateX(0);
}

.anim-fade-drift {
    transform: translateY(20px);
    transition: opacity 1.2s cubic-bezier(0.16, 1, 0.3, 1), transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.anim-fade-drift.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.anim-skew-reveal {
    transform: translateY(50px) rotate(-2deg);
    transform-origin: left top;
    transition: opacity 1s cubic-bezier(0.2, 0.8, 0.2, 1), transform 1s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.anim-skew-reveal.is-visible {
    opacity: 1;
    transform: translateY(0) rotate(0deg);
}

.anim-wipe-dir {
    opacity: 1;
    clip-path: inset(0 100% 0 0);
    transition: clip-path 1.4s cubic-bezier(0.77, 0, 0.175, 1);
}
.anim-wipe-dir.is-visible {
    clip-path: inset(0 0 0 0);
}

.anim-zoom-overflow {
    transform: scale(1.3);
    transition: transform 1.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.anim-wipe-dir.is-visible .anim-zoom-overflow {
    transform: scale(1);
}

.staggered-1 { transition-delay: 0.1s; }
.staggered-2 { transition-delay: 0.2s; }
.staggered-3 { transition-delay: 0.3s; }
.staggered-4 { transition-delay: 0.4s; }
.staggered-5 { transition-delay: 0.5s; }
