/* 
   THEME: THE PRIMAL DEPTHS 
   Aesthetic: Dark, Atmospheric, Nature-Reclaimed, Ancient Tech
   Refined: Less Glow, More Matte/Clean
*/

:root {
    --color-bg-depth: #020617; /* Slate 950 */
    --color-primary: #14b8a6; /* Teal 500 - Muted Bioluminescence */
    --color-secondary: #0f766e; /* Teal 700 */
    --color-accent: #d97706; /* Amber 600 - Fossil/Amber */
    --color-text-main: #f8fafc; /* Slate 50 */
    --color-text-muted: #94a3b8; /* Slate 400 */
    
    --font-display: 'Chakra Petch', sans-serif;
    --font-body: 'Rajdhani', sans-serif;
}

/* Typography Overrides */
.font-display { font-family: var(--font-display); }
.font-body { font-family: var(--font-body); }

body {
    background-color: var(--color-bg-depth);
    font-family: var(--font-body);
    overflow-x: hidden;
}

/* Smooth Scroll (Lenis) */
html.lenis, html.lenis body { 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; }

/* ATMOSPHERIC EFFECTS */

/* Vignette Overlay - GPU accelerated */
#vignette {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    pointer-events: none;
    background: radial-gradient(circle at center, transparent 0%, rgba(2, 6, 23, 0.1) 70%, rgba(0, 0, 0, 0.35) 100%);
    z-index: 50;
    will-change: auto;
    contain: strict;
}

/* Fog Layers - GPU accelerated */
.fog-layer {
    position: fixed;
    top: 0; left: 0; width: 200%; height: 100%;
    background: url('https://raw.githubusercontent.com/danielstuart14/CSS_FOG_ANIMATION/master/img/fog1.png') repeat-x;
    background-size: contain;
    opacity: 0.08;
    z-index: 1;
    pointer-events: none;
    will-change: transform;
    contain: layout style;
    backface-visibility: hidden;
}

#fog-layer-1 {
    animation: fog-flow 90s linear infinite; /* Slower = less repaints */
}

#fog-layer-2 {
    background: url('https://raw.githubusercontent.com/danielstuart14/CSS_FOG_ANIMATION/master/img/fog2.png') repeat-x;
    background-size: contain;
    animation: fog-flow 70s linear infinite reverse; /* Slower */
    opacity: 0.05;
    z-index: 2;
}

@keyframes fog-flow {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-50%, 0, 0); }
}

/* UTILITIES & COMPONENTS */

/* Reduced Glow Utilities */
.text-glow {
    /* Removed strong glow */
}

.text-glow-amber {
    /* Removed strong glow */
}

/* Modern, cleaner glass panel - optimized for performance */
.glass-panel {
    background: rgba(15, 23, 42, 0.85); /* More opaque = no blur needed */
    border: 1px solid rgba(148, 163, 184, 0.1);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    contain: content;
}

.glass-panel:hover {
    background: rgba(30, 41, 59, 0.9);
    border-color: rgba(20, 184, 166, 0.3);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.2);
}

/* Flat/Solid Text Colors instead of Gradients */
.text-primary-accent {
    color: var(--color-primary);
}

.text-gold-accent {
    color: var(--color-accent);
}

/* Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #020617; }
::-webkit-scrollbar-thumb { background: #1e293b; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #334155; }

/* Animations */
@keyframes float-slow {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
}

.animate-float-slow {
    animation: float-slow 8s ease-in-out infinite; /* Slower, more subtle */
}

.animate-pulse-slow {
    animation: pulse-fade 3s infinite;
}

@keyframes pulse-fade {
    0%, 100% { opacity: 0.7; }
    50% { opacity: 1; }
}