:root {
            --p-purple: #5B23FF;
            --s-violet: #B153D7;
            --white: #FFFFFF;
        }

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

        .site-margin {
            padding-left: 10%;
            padding-right: 10%;
        }

        /* Typography Defaults */
        h1, h2, h3, h4 {
            letter-spacing: 0.3em;
            text-transform: uppercase;
        }

        p {
            line-height: 2;
            letter-spacing: 0.08em;
            font-size: 1.1rem;
        }

        /* Header Nav Treatments */
        .nav-about { border-bottom: 2px solid var(--p-purple); padding-bottom: 2px; }
        .nav-projects { background: var(--s-violet); color: var(--white) !important; padding: 10px 24px; border-radius: 99px; }
        .nav-events { border: 1.5px solid var(--p-purple); padding: 8px 20px; }
        .nav-team { position: relative; }
        .nav-team::after { content: ''; position: absolute; bottom: -4px; left: 0; width: 0; height: 1px; background: var(--s-violet); transition: 0.4s; }
        .nav-team:hover::after { width: 100%; }
        .nav-news { background: linear-gradient(to right, var(--p-purple), var(--s-violet)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
        .nav-contact { background: var(--p-purple); color: var(--white) !important; padding: 12px 28px; }

        /* Geometric Cuts */
        .cut-diag-bottom { clip-path: polygon(0 0, 100% 0, 100% 88%, 0% 100%); }
        .cut-diag-top { clip-path: polygon(0 12%, 100% 0, 100% 100%, 0% 100%); }
        .cut-wave-bottom { clip-path: polygon(0 0, 100% 0, 100% 90%, 75% 95%, 50% 90%, 25% 95%, 0 90%); }
        
        /* Layout Elements */
        .hero-overlap {
            margin-top: -100px;
            z-index: 50;
            position: relative;
            border-top: 5px solid var(--p-purple);
            box-shadow: 0 20px 50px rgba(177, 83, 215, 0.2);
        }

        .card-glow {
            transition: all 0.5s ease;
        }
        .card-glow:hover {
            transform: translateY(-10px);
            box-shadow: 0 0 30px rgba(91, 35, 255, 0.2);
        }

        .reveal { opacity: 0; transform: translateY(40px); transition: 1.2s ease-out; }
        .reveal.active { opacity: 1; transform: translateY(0); }

        /* Filter Chips */
        .filter-btn {
            border: 1px solid var(--p-purple);
            padding: 8px 20px;
            font-size: 0.7rem;
            transition: 0.3s;
            cursor: pointer;
        }
        .filter-btn.active { background: var(--p-purple); color: white; }

        /* Modal */
        .modal {
            display: none;
            position: fixed;
            inset: 0;
            background: rgba(91, 35, 255, 0.95);
            z-index: 200;
            align-items: center;
            justify-content: center;
            padding: 5%;
        }
        .modal-content {
            background: white;
            width: 100%;
            max-width: 1200px;
            height: 85vh;
            border-radius: 40px;
            overflow-y: auto;
            display: flex;
            flex-direction: column;
        }

        /* Animation Background */
        .bg-animate {
            background: linear-gradient(45deg, #ffffff, #f3efff, #ffffff);
            background-size: 400% 400%;
            animation: gradientBG 15s ease infinite;
        }
        @keyframes gradientBG {
            0% { background-position: 0% 50%; }
            50% { background-position: 100% 50%; }
            100% { background-position: 0% 50%; }
        }