/* Base Variables - Original Theme (Leather & Gold) */
:root, [data-theme="original"] {
    --bg-primary: #0a0a0a;
    --bg-secondary: #141414;
    --text-primary: #e2c275;
    --text-secondary: #a88035;
    --accent: #fff3a1;
    --border-color: #332612;
    --btn-hover: rgba(255, 243, 161, 0.1);
    
    /* Logo Filters */
    --logo-filter: none;
    --text-glow-shadow: none;
    --box-glow-shadow: none;
}

/* Neon Nightmare Theme */
[data-theme="neon"] {
    --bg-primary: #000000;
    --bg-secondary: #090909;
    --text-primary: #00f3ff;
    --text-secondary: #ff003c;
    --accent: #b026ff;
    --border-color: #ff003c;
    --btn-hover: rgba(176, 38, 255, 0.15);
    
    /* Turn the gold logo into a bright neon cyan/magenta variant */
    /* Hue rotate approx 180deg shifts gold/yellow to cyan/blue, 
       brightness bumps it up, drop shadow gives it the glow */
    --logo-filter: hue-rotate(180deg) brightness(1.5) saturate(2) drop-shadow(0 0 15px rgba(0, 243, 255, 0.8));
    --text-glow-shadow: 0 0 20px rgba(0, 243, 255, 0.6);
    --box-glow-shadow: 0 0 40px rgba(176, 38, 255, 0.4);
}

/* Minimal Theme */
[data-theme="minimal"] {
    --bg-primary: #fafafa;
    --bg-secondary: #ffffff;
    --text-primary: #1a202c;
    --text-secondary: #4a5568;
    --accent: #000000;
    --border-color: #e2e8f0;
    --btn-hover: rgba(0, 0, 0, 0.05);
    
    /* Turn the gold logo into crisp charcoal */
    /* Grayscale it, drop brightness, bump contrast */
    --logo-filter: grayscale(100%) brightness(0.2) contrast(1.5);
    --text-glow-shadow: none;
    --box-glow-shadow: none;
}

/* --- Entrance Animation --- */
/* The overlay covers everything and fades out */
#intro-overlay {
    transition: opacity 0.8s cubic-bezier(0.85, 0, 0.15, 1);
    /* No transition-delay here, we handle it in JS */
}
#intro-overlay.fade-out {
    opacity: 0;
}

.intro-logo-container {
    perspective: 1000px;
}

.intro-logo-img {
    opacity: 0;
    transform: translate3d(0, 50px, 0) scale(0.95);
    animation: premiumReveal 1.5s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

@keyframes premiumReveal {
    0% {
        opacity: 0;
        transform: translate3d(0, 50px, 0) scale(0.95);
        filter: blur(10px);
    }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
        filter: blur(0);
    }
}

/* --- Theme Classes --- */
.logo-filter {
    filter: var(--logo-filter);
    will-change: filter;
}

.text-glow {
    text-shadow: var(--text-glow-shadow);
    transition: text-shadow 0.5s ease;
}

.bg-glow {
    box-shadow: var(--box-glow-shadow);
    transition: box-shadow 0.5s ease;
}

.shadow-glow {
    box-shadow: var(--box-glow-shadow);
    transition: box-shadow 0.5s ease;
}

/* --- Scroll Revelations --- */
.reveal {
    opacity: 0;
    transform: translate3d(0, 30px, 0);
    transition: opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
    will-change: opacity, transform;
}

.reveal.active {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

/* Add a slight delay to children for staggered effect if needed, though simple setup for now */
.card-hover {
    transform: translate3d(0, 0, 0);
    transition: transform 0.3s ease, border-color 0.3s ease;
}
.card-hover:hover {
    transform: translate3d(0, -5px, 0);
}

/* Switcher button active state */
.theme-btn.active-theme {
    background-color: var(--bg-primary);
    color: var(--text-primary);
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}