:root {
            --deep-purple: #640D5F;
            --vivid-pink: #D91656;
            --soft-magenta: #FFE1FF;
            --off-white: #fafafa;
        }

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

        .font-heading { font-family: 'Big Shoulders Inline', cursive; }
        .font-serif { font-family: 'Playfair Display', serif; }

        /* HEADER RIBBON */
        .ribbon-nav {
            background: rgba(255, 255, 255, 0.85);
            backdrop-filter: blur(15px);
            border-radius: 100px;
            box-shadow: 0 10px 40px rgba(100, 13, 95, 0.15);
            transition: all 0.4s ease;
        }

        /* HERO CANVAS STYLING */
        #hero-particles {
            position: absolute;
            top: 0; left: 0;
            width: 100%; height: 100%;
            z-index: 1;
            pointer-events: none;
            opacity: 0.6;
        }

        /* ASYMMETRICAL EDITORIAL LAYOUTS */
        .mag-grid {
            display: grid;
            grid-template-columns: repeat(12, 1fr);
            gap: 1.5rem;
        }

        .overlap-1 { grid-column: 1 / 8; z-index: 10; }
        .overlap-2 { grid-column: 6 / 13; margin-top: 5rem; z-index: 5; }

        .skew-card {
            transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
        }
        .skew-card:hover {
            transform: scale(1.02) translateY(-10px) rotate(-1deg);
        }

        /* PULL QUOTE */
        .editorial-quote {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            position: relative;
            padding-left: 2rem;
            border-left: 5px solid var(--vivid-pink);
            transform: rotate(-1deg);
        }

        /* PAGE VISIBILITY */
        .page-view { display: none; opacity: 0; transform: translateY(20px); }
        .page-view.active { display: block; opacity: 1; transform: translateY(0); transition: all 0.8s ease-out; }

        /* BUTTONS */
        .mag-btn {
            padding: 12px 30px;
            border-radius: 50px;
            text-transform: uppercase;
            font-weight: 800;
            font-size: 11px;
            letter-spacing: 2px;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
        }
        .mag-btn-fill { background: var(--deep-purple); color: white; }
        .mag-btn-fill:hover { background: var(--vivid-pink); transform: translateY(-3px); box-shadow: 0 10px 20px rgba(217, 22, 86, 0.3); }

        /* CUSTOM SCROLLBAR */
        ::-webkit-scrollbar { width: 5px; }
        ::-webkit-scrollbar-track { background: var(--off-white); }
        ::-webkit-scrollbar-thumb { background: var(--vivid-pink); border-radius: 10px; }

        /* ANIMATIONS */
        @keyframes float {
            0% { transform: translateY(0px); }
            50% { transform: translateY(-15px); }
            100% { transform: translateY(0px); }
        }
        .float-anim { animation: float 6s ease-in-out infinite; }

        /* HAMBURGER */
        .ham-box { width: 30px; height: 20px; display: flex; flex-direction: column; justify-content: space-between; cursor: pointer; }
        .ham-line { height: 2px; width: 100%; background: var(--deep-purple); transition: 0.3s; }