:root { scroll-behavior: smooth; }
        .page-section { display: none; }
        .page-section.active { display: block; animation: fadeIn 0.8s ease-in-out; }
        
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(20px); }
            to { opacity: 1; transform: translateY(0); }
        }

        .hero-bg {
            background: linear-gradient(rgba(26,26,26,0.3), rgba(26,26,26,0.5)), url('https://images.unsplash.com/photo-1573384666979-6617c5602bb2?auto=format&fit=crop&q=80&w=2000');
            background-size: cover;
            background-position: center;
            background-attachment: fixed;
        }

        .editorial-card { transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); }
        .editorial-card:hover { transform: translateY(-10px); box-shadow: 0 40px 80px -15px rgba(0,0,0,0.1); }
        
        .custom-scrollbar::-webkit-scrollbar { width: 5px; }
        .custom-scrollbar::-webkit-scrollbar-track { background: #f1f1f1; }
        .custom-scrollbar::-webkit-scrollbar-thumb { background: #4F7DFF; border-radius: 10px; }

        .parallax-section { background-attachment: fixed; background-position: center; background-size: cover; }
/* Fade in elements */
.animate-fadeIn {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 1s forwards;
}
.animate-slideInRight {
    opacity: 0;
    transform: translateX(40px);
    animation: slideInRight 1s forwards;
}

/* Delays */
.animate-fadeIn.delay-200 { animation-delay: 0.2s; }
.animate-fadeIn.delay-400 { animation-delay: 0.4s; }
.animate-fadeIn.delay-600 { animation-delay: 0.6s; }
.animate-slideInRight.delay-800 { animation-delay: 0.8s; }
.animate-fadeIn.delay-1000 { animation-delay: 1s; }
.animate-fadeIn.delay-1200 { animation-delay: 1.2s; }
.animate-fadeIn.delay-1400 { animation-delay: 1.4s; }
.animate-fadeIn.delay-1600 { animation-delay: 1.6s; }

@keyframes fadeInUp { to { opacity: 1; transform: translateY(0); } }
@keyframes slideInRight { to { opacity: 1; transform: translateX(0); } }

/* Typewriter animation */
#typewriter {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    border-right: 3px solid #3B82F6;
    animation: typing 3s steps(40, end), blink 0.75s step-end infinite;
}
@keyframes typing { from { width: 0; } to { width: 100%; } }
@keyframes blink { 50% { border-color: transparent; } }

/* Marquee animation */
@keyframes marquee {
    0% { transform: translateX(100%); }
    100% { transform: translateX(-100%); }
}
.animate-marquee {
    display: inline-block;
    animation: marquee 20s linear infinite;
}

/* Optional: scrollbar */
.scrollbar-thin { scrollbar-width: thin; }
.scrollbar-thumb-careBlue { scrollbar-color: #3B82F6 transparent; }