:root {
            --sage: #8A9A5B;
            --cream: #FDFCF8;
            --peach: #FAD4C0;
            --charcoal: #2D312E;
            --beige: #F5F1E9;
            --teal: #4A6D7C;
        }


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

        /* View Management */
.page-view { 
  display: none; 
  opacity: 0; 
}
.page-view.active { 
  display: block; 
  animation: fadeInView 1.2s forwards; 
}
        
        @keyframes fadeInView {
            from { opacity: 0; transform: translateY(20px); }
            to { opacity: 1; transform: translateY(0); }
        }

        /* Scroll Reveal */
        .reveal { opacity: 0; transform: translateY(40px); transition: all 1s cubic-bezier(0.21, 0.6, 0.35, 1); }
        .reveal.visible { opacity: 1; transform: translateY(0); }

        /* Custom Aesthetics */
        .glass-nav { background: rgba(253, 252, 248, 0.85); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(138, 154, 91, 0.1); }
        .btn-sage { background: var(--sage); color: white; transition: all 0.5s ease; border: 1px solid transparent; }
        .btn-sage:hover { background: transparent; color: var(--sage); border-color: var(--sage); transform: scale(1.02); }
        
        .editorial-image { clip-path: inset(0 0 0 0); transition: clip-path 1.5s cubic-bezier(0.19, 1, 0.22, 1); }
        .visible .editorial-image { clip-path: inset(0 0 0 0); }
        
        .hide-scrollbar::-webkit-scrollbar { display: none; }