body { font-family: 'Manrope', sans-serif; }
h1, h2, h3, h4, .font-serif { font-family: 'Noto Serif', serif; }
.material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24; }

/* --- Smoothness & Transitions --- */

/* Lenis Specific CSS */
html.lenis, html.lenis body { height: auto; scroll-behavior: auto !important; }
html.lenis { overflow-y: scroll; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }

/* Native Page Transitions */
@view-transition {
    navigation: auto;
}

/* --- Animation System --- */

@keyframes revealUp {
    from { transform: translateY(30px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

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

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

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

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes zoomIn {
    from { transform: scale(0.95); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

@keyframes heroZoom {
    from { transform: scale(1.05); opacity: 0.8; }
    to { transform: scale(1); opacity: 1; }
}

@keyframes bounceDown {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(10px); }
    60% { transform: translateY(5px); }
}

.bounce-down {
    animation: bounceDown 2s infinite;
}

/* Base class for scroll reveals */
.reveal {
    opacity: 0;
    transition: none; /* Managed by animation */
}

/* Animation utilities */
.reveal-up.active { animation: revealUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.reveal-down.active { animation: revealDown 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.reveal-left.active { animation: revealLeft 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.reveal-right.active { animation: revealRight 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.fade-in.active { animation: fadeIn 0.8s ease-out forwards; }
.zoom-in.active { animation: zoomIn 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; }

.hero-zoom {
    animation: heroZoom 3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* Stagger delays */
.stagger-1 { animation-delay: 0.1s !important; }
.stagger-2 { animation-delay: 0.2s !important; }
.stagger-3 { animation-delay: 0.3s !important; }
.stagger-4 { animation-delay: 0.4s !important; }
.stagger-5 { animation-delay: 0.5s !important; }

/* Interactive Hover Enhancements */
.hover-zoom {
    overflow: hidden;
}
.hover-zoom img {
    transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.hover-zoom:hover img {
    transform: scale(1.05);
}

.vertical-text {
    writing-mode: vertical-rl;
    text-orientation: mixed;
}

/* Custom Page Transitions (Pseudo-elements) */
::view-transition-old(root),
::view-transition-new(root) {
    animation-duration: 0.4s;
}