        :root {
            --accent: #4B9DA9;
            --black: #000000;
            --white: #ffffff;
        }

        body {
            font-family: 'Manrope', sans-serif;
            background-color: var(--white);
            color: var(--black);
            overflow-x: hidden;
            scroll-behavior: smooth;
        }

        h1, h2, h3, .artist-font {
            font-family: 'Cormorant Garamond', serif;
        }

        /* Menu Overlay */
        .menu-overlay {
            position: fixed;
            inset: 0;
            background: white;
            z-index: 100;
            display: flex;
            align-items: center;
            justify-content: center;
            opacity: 0;
            pointer-events: none;
            transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
        }
        .menu-overlay.open {
            opacity: 1;
            pointer-events: auto;
        }

        /* Hero Animation */
        @keyframes panBG {
            0% { transform: scale(1.1) translateX(0); }
            100% { transform: scale(1.1) translateX(-20px); }
        }
        .hero-bg-anim {
            animation: panBG 10s ease-in-out infinite alternate;
        }

        /* Floating Cards */
        .floating-cards {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            display: flex;
            z-index: 20;
            width: 90%;
            max-width: 800px;
        }
        .text-card {
            background: white;
            padding: 3rem;
            box-shadow: 0 40px 100px rgba(0,0,0,0.1);
            flex: 1;
        }
        .img-card {
            flex: 1;
            box-shadow: 0 40px 100px rgba(0,0,0,0.1);
        }

        /* Portfolio Grid */
        .portfolio-img {
            aspect-ratio: 1 / 1;
            object-fit: cover;
            transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
        }
        .portfolio-card:hover .portfolio-img {
            transform: scale(1.1);
        }
        .portfolio-overlay {
            background: rgba(75, 157, 169, 0.8);
            opacity: 0;
            transition: opacity 0.4s ease;
        }
        .portfolio-card:hover .portfolio-overlay {
            opacity: 1;
        }

        /* Page Management */
        .page { display: none; }
        .page.active { display: block; animation: fadeIn 0.8s ease; }
        @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

        /* Modal */
        .modal {
            position: fixed;
            inset: 0;
            background: rgba(255,255,255,0.98);
            z-index: 200;
            display: none;
            align-items: center;
            justify-content: center;
            padding: 2rem;
        }
        .modal.open { display: flex; }
