:root {
    --primary: #0D0D0D;
    --secondary: #F5F0EB;
    --accent: #C9A962;
    --surface: #EAE5E0;
    --silver-dark: #1a1a1f;
    --silver-mid: #2a2a35;
    --platinum: #3a3a45;
    --font-heading: 'Playfair Display', serif;
    --font-body: 'Outfit', sans-serif;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    cursor: none;
    /* Custom cursor everywhere */
}

html.lenis {
    height: auto;
}

.lenis.lenis-smooth {
    scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
}

.lenis.lenis-stopped {
    overflow: hidden;
}

.lenis.lenis-scrolling iframe {
    pointer-events: none;
}

body {
    font-family: var(--font-body);
    overflow-x: hidden;
    color: var(--primary);
    /* Gradient background from black to silver/platinum */
    background: linear-gradient(180deg,
            var(--primary) 0%,
            var(--silver-dark) 25%,
            var(--silver-mid) 50%,
            var(--platinum) 75%,
            var(--silver-dark) 100%);
    background-attachment: fixed;
    min-height: 100vh;
}

/* Custom Cursor */
#cursor {
    width: 8px;
    height: 8px;
    background: var(--accent);
    border-radius: 50%;
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 9999;
}

#cursor-follower {
    width: 40px;
    height: 40px;
    border: 1px solid var(--accent);
    border-radius: 50%;
    position: fixed;
    top: -16px;
    left: -16px;
    pointer-events: none;
    z-index: 9998;
    transition: transform 0.1s ease-out, width 0.3s, height 0.3s, background 0.3s;
}

/* Hover States for Cursor */
.group:hover~#cursor-follower,
a:hover~#cursor-follower,
button:hover~#cursor-follower {
    transform: scale(1.5);
    background: rgba(201, 169, 98, 0.1);
}

/* Header Glassmorphism on Scroll */
header.scrolled {
    padding-top: 1rem;
    padding-bottom: 1rem;
    background: rgba(13, 13, 13, 0.8);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    color: white;
}

header.scrolled .nav-link {
    color: white;
}

/* Buttons */
.btn {
    position: relative;
    padding: 1.25rem 3rem;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    tracking: 0.2em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}

.btn-primary {
    background: var(--primary);
    color: white;
}

.btn-primary:hover {
    background: var(--accent);
    color: white;
}

/* Mask Reveal Animation (Using clip-path for GSAP compatibility) */
.mask-reveal {
    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
}

/* Magnetic Button Utility */
.magnetic-btn {
    display: inline-block;
    transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
}

/* Marquee Animation Customizations */
.animate-marquee {
    animation: marquee 40s linear infinite;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
    }
}

/* Scroll Line Animation */
.scroll-line {
    animation: scroll-line-anim 2s infinite cubic-bezier(0.77, 0, 0.175, 1);
}

@keyframes scroll-line-anim {
    0% {
        transform: translateY(-100%);
    }

    100% {
        transform: translateY(200%);
    }
}

/* Responsive Overrides */
@media (max-width: 1024px) {
    * {
        cursor: auto !important;
    }

    #cursor,
    #cursor-follower {
        display: none;
    }
}