/* ================================================
   THEME: Warm & Distinctive
   Cream background, earthy tones, friendly but professional
   Approachable consultant + creative musician
   ================================================ */

:root {
    /* Core palette - warm creams and naturals */
    --color-bg: #fdfbf7;
    --color-bg-alt: #f7f3ed;
    --color-bg-card: #ffffff;
    --color-bg-elevated: #f0ebe3;
    
    /* Text colours - warm darks */
    --color-text: #44403c;
    --color-text-muted: #78716c;
    --color-text-bright: #1c1917;
    
    /* Primary accent - terracotta/rust */
    --color-primary: #c2410c;
    --color-primary-dark: #9a3412;
    --color-primary-light: #ea580c;
    --color-primary-glow: rgba(194, 65, 12, 0.1);
    
    /* Tech accent - forest green */
    --color-tech: #166534;
    --color-tech-dark: #14532d;
    --color-tech-light: #22c55e;
    --color-tech-glow: rgba(22, 101, 52, 0.1);
    
    /* Music accent - warm amber */
    --color-music: #b45309;
    --color-music-dark: #92400e;
    --color-music-light: #d97706;
    --color-music-glow: rgba(180, 83, 9, 0.1);
    
    /* Gradient - earthy warmth */
    --gradient-blend: linear-gradient(135deg, var(--color-tech) 0%, var(--color-music) 100%);
    --gradient-primary: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
    
    /* Borders */
    --color-border: #e7e5e4;
    --color-border-strong: #d6d3d1;
    
    /* Typography - Warm, readable serifs */
    --font-display: 'Fraunces', Georgia, serif;
    --font-heading: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-body: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono: 'JetBrains Mono', monospace;
    
    /* Shadows - warm tinted */
    --shadow-sm: 0 1px 2px rgba(28, 25, 23, 0.05);
    --shadow-md: 0 4px 6px rgba(28, 25, 23, 0.08);
    --shadow-lg: 0 10px 25px rgba(28, 25, 23, 0.12);
    --shadow-primary: 0 4px 14px rgba(194, 65, 12, 0.15);
    --shadow-tech: 0 4px 14px rgba(22, 101, 52, 0.15);
    --shadow-music: 0 4px 14px rgba(180, 83, 9, 0.15);
    
    /* Theme-specific */
    --header-bg: rgba(253, 251, 247, 0.95);
    --hero-overlay: rgba(253, 251, 247, 0.3);
}

/* Warm theme header contrast fixes */
.site-header {
    background: var(--header-bg);
    border-bottom: 1px solid var(--color-border);
}

.logo-text {
    color: var(--color-text-bright);
}

.nav-link {
    color: var(--color-text);
}

.nav-link:hover,
.nav-link.active {
    color: var(--color-text-bright);
}

/* Warm theme adjustments */
.hero-name {
    font-family: var(--font-display);
    font-weight: 900;
    font-style: normal;
    background: linear-gradient(135deg, var(--color-text-bright) 0%, var(--color-text) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-bg::before {
    background: radial-gradient(ellipse at center, rgba(22, 101, 52, 0.06), transparent 60%);
}

.hero-bg::after {
    background: radial-gradient(ellipse at center, rgba(180, 83, 9, 0.06), transparent 60%);
}

.hero-grid {
    background-image: 
        linear-gradient(rgba(28, 25, 23, 0.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(28, 25, 23, 0.02) 1px, transparent 1px);
}

/* Softer card styling */
.world-card,
.expertise-card,
.band-card,
.project-card {
    border-radius: 16px;
    border-color: var(--color-border);
}

.world-card::before {
    border-radius: 16px 16px 0 0;
}

/* Warmer buttons */
.btn-primary {
    background: var(--color-primary);
    border-radius: 100px;
}

.btn-outline {
    border-radius: 100px;
    border-color: var(--color-border-strong);
}

/* Role tags with warm styling */
.role-tag {
    border-radius: 100px;
    background: var(--color-bg-alt);
}

.role-tag--tech {
    border-color: rgba(22, 101, 52, 0.3);
    color: var(--color-tech);
}

.role-tag--music {
    border-color: rgba(180, 83, 9, 0.3);
    color: var(--color-music);
}

/* Section labels */
.section-label {
    font-weight: 500;
}

.section-label--tech {
    color: var(--color-tech);
}

.section-label--music {
    color: var(--color-music);
}

/* Footer with warm background */
.site-footer {
    background: var(--color-bg-alt);
}
