:root {
            --cream: #FDFCF8;
            --sand: #F7F3EE;
            --charcoal: #1A1A1A;
            --clay: #A68069;
            --sage: #8A9A8A;
        }

        body {
            font-family: 'Inter', sans-serif;
            background-color: var(--cream);
            color: var(--charcoal);
            overflow-x: hidden;
        }

        .serif { font-family: 'Cormorant Garamond', serif; }
        .cursive { font-family: 'Allison', cursive; font-size: 2.8rem; line-height: 0.8; color: var(--clay); }
        
        /* Typography Overrides */
        h1, h2, h3, .heading-serif { font-family: 'Cormorant Garamond', serif; font-weight: 400; font-style: italic; }

        /* Animation System */
        .reveal { opacity: 0; transform: translateY(40px); transition: 1.2s cubic-bezier(0.16, 1, 0.3, 1); }
        .reveal.active { opacity: 1; transform: translateY(0); }
        
        .bg-zoom { transition: transform 20s linear; }
        .hero-container:hover .bg-zoom { transform: scale(1.1); }

        /* UI Components */
        .btn-journal {
            padding: 1rem 2rem; border: 1px solid var(--charcoal);
            text-transform: uppercase; font-size: 0.7rem; font-weight: 700;
            letter-spacing: 0.15em; transition: 0.4s; background: transparent;
            cursor: pointer; display: inline-block;
        }
        .btn-journal:hover { background: var(--charcoal); color: white; }

        .tag { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.3em; color: var(--clay); margin-bottom: 1.5rem; display: block; }

        /* Navigation */
        #main-nav { transition: all 0.5s ease; }
        .nav-scrolled { background: rgba(253, 252, 248, 0.95); backdrop-filter: blur(10px); padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; box-shadow: 0 10px 30px rgba(0,0,0,0.02); }

        /* Custom Scrollbar */
        ::-webkit-scrollbar { width: 4px; }
        ::-webkit-scrollbar-track { background: var(--cream); }
        ::-webkit-scrollbar-thumb { background: var(--clay); }

        /* Overlays */
        .overlay-panel {
            position: fixed; inset: 0; background: var(--cream); z-index: 2000;
            transform: translateX(100%); transition: 0.8s cubic-bezier(0.7, 0, 0.3, 1);
            overflow-y: auto; padding: 10vw;
        }
        .overlay-panel.active { transform: translateX(0); }

        .search-overlay {
            position: fixed; inset: 0; background: rgba(26,26,26,0.98); z-index: 3000;
            display: none; flex-direction: column; align-items: center; justify-content: center;
            color: white; padding: 2rem;
        }

        /* Cart Badge */
        .cart-count { background: var(--clay); color: white; border-radius: 50%; width: 16px; height: 16px; font-size: 9px; display: flex; align-items: center; justify-content: center; position: absolute; top: -5px; right: -8px; }

        /* Page Layout */
        .page { min-height: 100vh; width: 100%; transition: opacity 0.5s; }
        .section-padding { padding: 120px 0; }