:root {
            --dark-green: #40513B;
            --earth-brown: #954C2E;
            --white: #FFFFFF;
        }

        body {
            font-family: 'Roboto Slab', serif;
            background-color: var(--dark-green);
            color: var(--white);
            margin: 0;
            overflow-x: hidden;
            scroll-behavior: smooth;
        }

        /* HERO LAYOUT */
.hero-split {
    display: flex;
    min-height: calc(100vh - 80px);
}

/* LEFT CONTENT */
.hero-content {
    width: 50%;
    padding: 80px;
    display: flex;
    align-items: center;
}

/* HIDE BY DEFAULT */
.hero-visual {
    display: none;
}

/* SHOW ONLY ON HOME */
.home-page .hero-visual {
    display: block;
    width: 50%;
    height: calc(100vh - 80px);

    /* OPTION A (SAFE - RECOMMENDED) */
    position: sticky;
    top: 80px;

    /* OPTION B (if you REALLY want fixed, uncomment below) */
    /* position: fixed; right: 0; top: 80px; */

    background: url('https://i1-c.pinimg.com/1200x/3d/77/40/3d77408e18fb18a906dad6bf4173f502.jpg') no-repeat center center;
    background-size: cover;
}

/* MOBILE FIX */
@media (max-width: 768px) {
    .hero-split {
        flex-direction: column;
    }

    .hero-content {
        width: 100%;
        padding: 40px 20px;
    }

    .hero-visual {
        display: none !important;
    }
}

        /* Fixed Header */
        header {
            position: fixed;
            top: 0;
            width: 100%;
            height: 80px;
            background-color: var(--dark-green);
            z-index: 1000;
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0 5%;
        }

        .nav-link {
            font-weight: 400;
            position: relative;
            margin-right: 2rem;
            transition: opacity 0.3s;
        }
        .nav-link::after {
            content: '';
            position: absolute;
            width: 0;
            height: 1px;
            bottom: -4px;
            left: 0;
            background: white;
            transition: width 0.4s ease;
        }
        .nav-link:hover::after { width: 100%; }

        /* Hamburger Menu */
        .mobile-menu { display: none; }
        @media (max-width: 768px) {
            .desktop-nav { display: none; }
            .mobile-menu-btn { display: block; }
        }

        /* Hero Split Panel */
        .hero-split {
            display: flex;
            min-height: 100vh;
            padding-top: 80px;
        }
        .hero-content {
            width: 50%;
            padding: 10% 5%;
            background-color: var(--dark-green);
            z-index: 10;
        }
        .hero-visual {
            width: 50%;
            height: calc(100vh - 80px);
            position: fixed;
            right: 0;
            top: 80px;
            background-size: cover;
        }
        @media (max-width: 1024px) {
            .hero-split { flex-direction: column; }
            .hero-content, .hero-visual { width: 100%; position: relative; top: 0; height: auto; }
            .hero-visual { height: 50vh; }
        }

        /* Editorial Elements */
        .separator { border-top: 1px solid rgba(255,255,255,0.2); width: 100%; margin: 2rem 0; }
        .parallax-section {
            background-attachment: fixed;
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            min-height: 60vh;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        /* Animations */
        .reveal { opacity: 0; transform: translateY(30px); transition: 1s ease-out; }
        .reveal.active { opacity: 1; transform: translateY(0); }

        .card-zoom { overflow: hidden; }
        .card-zoom img { transition: transform 0.6s ease; }
        .card-zoom:hover img { transform: scale(1.1); }

        /* Custom Scrollbar */
        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: var(--dark-green); }
        ::-webkit-scrollbar-thumb { background: var(--earth-brown); border-radius: 4px; }

        /* Buttons */
        .btn-adventure {
            border: 2px solid white;
            padding: 12px 32px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 2px;
            transition: all 0.3s ease;
        }
        .btn-adventure:hover {
            background: white;
            color: var(--earth-brown);
        }

        /* Mobile Overlay */
        #mobile-overlay {
            position: fixed;
            inset: 0;
            background: var(--dark-green);
            z-index: 2000;
            display: none;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 2rem;
        }