:root {
            --primary-bg: #000000;
            --secondary-bg: #FFFFFF;
            --accent-text: #D9CFC7;
            --card-bg: #57595B;
        }

        body {
            font-family: 'Iceland', cursive;
            background-color: var(--primary-bg);
            color: #FFFFFF;
            margin: 0;
            overflow-x: hidden;
            scroll-behavior: smooth;
        }

        /* Multipage Navigation Logic */
        .page { display: none; min-height: 100vh; }
        .page.active { display: block; }

        /* Typography */
        h1, h2, h3, h4, h5, p, span, a, button {
            font-family: 'Iceland', cursive;
            letter-spacing: 0.05em;
        }

        /* Header Transition */
        header {
            transition: opacity 0.5s ease, transform 0.5s ease, background 0.3s ease;
        }
        header.hidden {
            opacity: 0;
            transform: translateY(-100%);
            pointer-events: none;
        }

        /* Hero Animation Background */
        .hero-bg-animate {
            background-size: 120% 120%;
        }
        @keyframes panBackground {
            from { background-position: 0% 0%; }
            to { background-position: 100% 100%; }
        }

        /* Section Reveal */
        .reveal {
            opacity: 0;
            transform: translateY(40px);
            transition: all 1s cubic-bezier(0.16, 1, 0.3, 1);
        }
        .reveal.active {
            opacity: 1;
            transform: translateY(0);
        }

        /* Mission Section Horizontal Motion */
        #mission-container {
            transition: transform 0.1s ease-out;
            will-change: transform;
        }

        /* Timeline Layout Stylings */
        .timeline-divider {
            border-bottom: 1px solid var(--accent-text);
            padding: 5rem 0;
        }

        /* Insights Card Sync Reveal */
        .sync-card {
            opacity: 0;
            transform: translateX(100px);
            transition: all 1.2s ease-out;
        }
        .sync-card.visible {
            opacity: 1;
            transform: translateX(0);
        }

        /* Custom Button */
        .btn-outline {
            border: 2px solid #FFFFFF;
            color: #FFFFFF;
            background: transparent;
            transition: all 0.3s ease;
        }
        .btn-outline:hover {
            background: #FFFFFF;
            color: #000000;
        }

        /* Modal / Detail View */
        .modal-overlay {
            display: none;
            position: fixed;
            inset: 0;
            background: rgba(0,0,0,0.9);
            z-index: 9999;
            align-items: center;
            justify-content: center;
            padding: 20px;
        }
        .modal-overlay.active { display: flex; }

        /* Custom Scrollbar */
        ::-webkit-scrollbar { width: 5px; }
        ::-webkit-scrollbar-track { background: #000; }
        ::-webkit-scrollbar-thumb { background: var(--card-bg); border-radius: 10px; }

        .white-section { background-color: var(--secondary-bg); color: var(--accent-text); }
        .black-section { background-color: var(--primary-bg); color: #FFFFFF; }
        .card-block { background-color: var(--card-bg); color: #FFFFFF; border-radius: 12px; }