@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500&family=Space+Grotesk:wght@500&display=swap');
        
        :root {
            --tw-color-primary: #00f0ff;
        }
        
        * {
            transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
            transition-duration: 150ms;
        }
        
        .tail-container * {
            font-family: 'Inter', system_ui, sans-serif;
        }
        
        .heading-font {
            font-family: 'Space Grotesk', sans-serif;
        }

        .hero-bg {
            background: linear-gradient(90deg, #0a0a2a 0%, #1a1a4a 100%);
        }
        
        .section-header {
            position: relative;
        }
        
        .section-header::after {
            content: '';
            position: absolute;
            bottom: -4px;
            left: 0;
            width: 60px;
            height: 4px;
            background: linear-gradient(to right, var(--accent-color), transparent);
        }
        
        .era-card {
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .timeline-dot {
            animation: pulse 2s infinite;
        }
        
        .mockup {
            box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
            transform: perspective(1000px) rotateX(8deg);
        }
        
        .code-window {
            background: #0a0a0a;
            border-radius: 12px;
            box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.3);
        }
        
        .scroll-progress {
            position: fixed;
            top: 0;
            left: 0;
            height: 4px;
            background: linear-gradient(to right, #00f0ff var(--scroll), transparent var(--scroll));
            z-index: 50;
            pointer-events: none;
        }

        #sliderContainer {
            height: 550px;
        }
        
        [class^="yt-"] {
            background-size: contain;
            background-position: top center;
            border-radius: 12px;
            width: 100%;
            height: 550px;
        }

        .yt-2005 {
            background: url(youtube-2005.png);
        }

        .yt-2025 {
            background: url(youtube-2025.png);
        }