:root {
            --purple: #612D53;
            --mint: #7AE2CF;
        }
        body {
            background-color: var(--purple);
            color: white;
            font-family: 'Jost', sans-serif;
            overflow-x: hidden;
            scroll-behavior: smooth;
        }

        /* Framed Layout */
        .framed-container {
            padding: 0 5vw;
        }
        .center-image-frame {
            height: 90vh;
            position: relative;
            overflow: hidden;
            background: #222;
        }

        /* Diagonal Motion Lines (Lane Style) */
        .track-lanes {
            background: repeating-linear-gradient(
                45deg,
                transparent,
                transparent 50px,
                rgba(122, 226, 207, 0.05) 50px,
                rgba(122, 226, 207, 0.05) 51px
            );
        }

        /* Overlay Menu */
        #menu-overlay {
            clip-path: circle(0% at 100% 0%);
            transition: clip-path 0.8s cubic-bezier(0.77, 0, 0.175, 1);
        }
        #menu-overlay.active {
            clip-path: circle(150% at 100% 0%);
        }
        .menu-item {
            opacity: 0;
            transform: translateY(40px);
            transition: all 0.5s ease;
        }
        #menu-overlay.active .menu-item {
            opacity: 1;
            transform: translateY(0);
        }

        /* Stacked Panels Logic */
        .stacked-panel {
            position: sticky;
            top: 100px;
        }

        /* Animations */
        @keyframes panHero {
            0% { transform: scale(1) translateX(0); }
            50% { transform: scale(1.1) translateX(-20px); }
            100% { transform: scale(1) translateX(0); }
        }
        .hero-pan { animation: panHero 30s infinite ease-in-out; }

        .btn-speed {
            border: 2px solid var(--mint);
            padding: 14px 40px;
            font-weight: 900;
            text-transform: uppercase;
            letter-spacing: 0.2em;
            transition: 0.3s;
            position: relative;
            overflow: hidden;
        }
        .btn-speed:hover {
            background: var(--mint);
            color: var(--purple);
        }

        .no-scrollbar::-webkit-scrollbar { display: none; }
        
        /* Page Sections View */
        .view-section { display: none; }
        .view-section.active { display: block; animation: sectionFadeIn 0.8s ease forwards; }

        @keyframes sectionFadeIn {
            from { opacity: 0; transform: scale(0.98); }
            to { opacity: 1; transform: scale(1); }
        }

        .lane-border { border-bottom: 2px solid #eee; position: relative; }
        .lane-border::before {
            content: ''; position: absolute; left: 0; bottom: -2px;
            width: 50px; height: 2px; background: var(--mint);
        }