body {
    font-feature-settings: "cv11", "ss01";
    -webkit-font-smoothing: antialiased;
}

::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #050505; 
}
::-webkit-scrollbar-thumb {
    background: #333; 
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #555; 
}

.glass-panel {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

@keyframes nav-reveal {
    from { transform: translateY(-100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@keyframes hero-letter-spacing {
    from { letter-spacing: -0.05em; transform: scale(0.95); opacity: 0; }
    to { letter-spacing: -0.025em; transform: scale(1); opacity: 1; }
}

@keyframes subtitle-reveal {
    from { transform: translateX(-20px); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

@keyframes text-reveal {
    from { transform: translateY(10px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@keyframes image-wipe {
    from { clip-path: inset(0 100% 0 0); transform: scale(1.1); }
    to { clip-path: inset(0 0 0 0); transform: scale(1); }
}

@keyframes loop-zoom {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

.hero-zoom {
    animation: loop-zoom 15s ease-in-out infinite !important;
    will-change: transform;
    opacity: 1 !important;
}

@keyframes feature-reveal {
    from { transform: perspective(1000px) rotateX(-10deg) translateY(30px); opacity: 0; }
    to { transform: perspective(1000px) rotateX(0) translateY(0); opacity: 1; }
}

@keyframes drift {
    from { transform: translateX(-30px); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

@keyframes list-item-reveal {
    from { transform: translateX(20px); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

@keyframes system-badge-reveal {
    from { transform: scale(0.8) translateY(20px); opacity: 0; }
    to { transform: scale(1) translateY(0); opacity: 1; }
}

.animate-nav {
    animation: nav-reveal 1s cubic-bezier(0.23, 1, 0.32, 1) both;
}

.hero-reveal .hero-title {
    animation: hero-letter-spacing 1.5s cubic-bezier(0.23, 1, 0.32, 1) both;
}

.hero-reveal .hero-subtitle {
    animation: subtitle-reveal 1s cubic-bezier(0.23, 1, 0.32, 1) 0.5s both;
}

.hero-reveal .hero-text {
    animation: text-reveal 1s cubic-bezier(0.23, 1, 0.32, 1) 0.8s both;
}

.image-container img { 
    opacity: 0; 
    transition: opacity 0.5s ease-in;
}
.image-container.visible img {
    animation: image-wipe 1.2s cubic-bezier(0.77, 0, 0.175, 1) both;
    opacity: 1 !important;
}

.hero-zoom {
    opacity: 1 !important;
}

.feature-item { opacity: 0; }
.feature-item.visible {
    animation: feature-reveal 1s cubic-bezier(0.23, 1, 0.32, 1) both;
}

.drift-text { opacity: 0; }
.drift-text.visible {
    animation: drift 1.2s cubic-bezier(0.23, 1, 0.32, 1) both;
}

.tech-list-item { opacity: 0; }
.tech-list-item.visible {
    animation: list-item-reveal 0.8s cubic-bezier(0.23, 1, 0.32, 1) both;
}

.system-badge { opacity: 0; }
.system-badge.visible {
    animation: system-badge-reveal 1s cubic-bezier(0.34, 1.56, 0.64, 1) 0.5s both;
}