:root {
            --pearl: #FDFCFB;
            --champagne: #F4EFEA;
            --gold-accent: #C5A059;
            --rich-black: #121212;
            --soft-grey: #666666;
        }

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

        .serif { font-family: 'Playfair Display', serif; }
        .cursive { font-family: 'Cedarville Cursive', cursive; }

        /* Custom Animations */
        @keyframes revealMask {
            from { clip-path: inset(0 100% 0 0); }
            to { clip-path: inset(0 0 0 0); }
        }
        .reveal { animation: revealMask 1.8s cubic-bezier(0.19, 1, 0.22, 1) forwards; }

        @keyframes lineGrow {
            from { width: 0; }
            to { width: 100%; }
        }
        .metallic-line {
            height: 1px;
            background: linear-gradient(90deg, transparent, var(--gold-accent), transparent);
            animation: lineGrow 2.5s ease-in-out forwards;
        }

        .strand-cue {
            width: 1px;
            height: 80px;
            background: linear-gradient(to bottom, var(--gold-accent), transparent);
            position: relative;
            overflow: hidden;
        }
        .strand-cue::after {
            content: '';
            position: absolute;
            top: 0; left: 0; width: 100%; height: 20px;
            background: white;
            box-shadow: 0 0 10px white;
            animation: strandMove 3s infinite linear;
        }
        @keyframes strandMove {
            0% { top: -20px; }
            100% { top: 80px; }
        }

        /* Layout Utilities */
        .page-node { display: none; opacity: 0; transition: opacity 0.6s ease-in-out; }
        .page-node.active { display: block; opacity: 1; }

        .editorial-card {
            background: white;
            transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.8s;
            cursor: pointer;
        }
        .editorial-card:hover {
            transform: translateY(-15px);
            box-shadow: 0 30px 60px rgba(0,0,0,0.05);
        }
        .editorial-card img {
            transition: transform 1.2s ease;
            filter: grayscale(20%);
        }
        .editorial-card:hover img { transform: scale(1.08); filter: grayscale(0%); }

        .btn-editorial {
            border: 1px solid var(--rich-black);
            padding: 1.2rem 3rem;
            text-transform: uppercase;
            font-size: 0.7rem;
            letter-spacing: 0.4em;
            transition: all 0.5s;
            background: transparent;
            display: inline-block;
        }
        .btn-editorial:hover {
            background: var(--rich-black);
            color: white;
            letter-spacing: 0.5em;
        }

        .vertical-watermark {
            writing-mode: vertical-rl;
            font-size: 12vw;
            opacity: 0.03;
            position: absolute;
            pointer-events: none;
            z-index: 0;
            top: 10%;
        }

        /* Modal Blur */
        .modal-wrap {
            position: fixed; inset: 0; background: rgba(255,255,255,0.92);
            backdrop-filter: blur(10px); z-index: 9999;
            display: none; align-items: center; justify-content: center;
            padding: 2rem;
        }
        .modal-wrap.active { display: flex; }

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