/* ============================================
   Amber CRT Theme - Macomate-inspired
   ============================================ */

:root {
    /* Macomate-inspired Colors */
    --color-primary: #ffe63a;
    --color-primary-accent: #fff087;
    --color-primary-super: #ffff60;
    
    --color-secondary: #794309;
    --color-secondary-accent: #ad8c1d;
    
    /* CRT Amber Theme */
    --color-bg-primary: #3d2510;
    --color-bg-secondary: #4a2f14;
    --color-bg-card: #4a2f14;
    --color-bg-card-hover: #5a3a18;
    
    --color-text-primary: #ffe63a;
    --color-text-secondary: #fff087;
    --color-text-muted: #ad8c1d;
    
    --color-accent: #ffe63a;
    --color-accent-hover: #fff087;
    --color-accent-glow: rgba(255, 230, 58, 0.4);
    
    --color-synth: #ffe63a;
    --color-effect: #ad8c1d;
    
    --color-border: #4a2f14;
    --color-border-hover: #6a4520;
    
    --shadow-glow: 0 0 20px rgba(255, 230, 58, 0.5);
    --color-glow: 0 0 12px rgba(255, 230, 58, 0.5);
}

/* CRT Scanline Effect */
body.crt-scanlines::before {
    content: "";
    position: fixed;
    inset: 0;
    background: repeating-linear-gradient(
        0deg,
        rgba(0, 0, 0, 0.2) 0px,
        rgba(0, 0, 0, 0.2) 1px,
        transparent 1px,
        transparent 3px
    );
    pointer-events: none;
    z-index: 1000;
}

/* Text glow for amber theme */
body {
    text-shadow: 0 0 5px rgba(255, 230, 58, 0.35);
}

h1, h2, h3 {
    text-shadow: 0 0 10px rgba(255, 230, 58, 0.5);
}

.logo {
    text-shadow: 0 0 15px rgba(255, 230, 58, 0.6);
}

/* Header with video background */
.site-header {
    position: relative;
    height: var(--header-height);
    overflow: hidden;
    background: none;
}

.header-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.header-video-overlay {
    position: absolute;
    inset: 0;
    background: rgba(74, 47, 20, 0.75);
}

.header-content {
    position: relative;
    z-index: 1;
}