/*
 * ============================================================
 *  THEMES — All visual tokens defined here per theme
 *  Add new themes by creating a new [data-theme="..."] block
 * ============================================================
 */

/* ── 1. Clean & Professional (default) ───────────────────── */
[data-theme="clean-pro"], :root {
  --color-bg:          #F7F6F4;
  --color-surface:     #FFFFFF;
  --color-surface-alt: #F0EFED;
  --color-border:      #E2E0DC;
  --color-text:        #1A1A18;
  --color-text-muted:  #6B6860;
  --color-accent:      #A0622A;   /* warm oak */
  --color-accent-light:#F2E8DF;
  --color-accent-dark: #7A4A1E;
  --color-nav-bg:      #FFFFFF;
  --color-nav-text:    #1A1A18;
  --color-hero-bg:     #1A1A18;
  --color-hero-text:   #F7F6F4;
  --color-hero-accent: #C17F45;
  --color-btn-primary:    #A0622A;
  --color-btn-primary-fg: #FFFFFF;
  --color-btn-secondary:    #1A1A18;
  --color-btn-secondary-fg: #FFFFFF;
  --color-footer-bg:   #1A1A18;
  --color-footer-text: #A09990;
  --color-success:     #2D7D46;
  --color-error:       #C0392B;

  --font-display: 'DM Serif Display', Georgia, serif;
  --font-body:    'DM Sans', 'Helvetica Neue', sans-serif;
  --font-mono:    'JetBrains Mono', monospace;

  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  16px;
  --shadow-sm:  0 1px 3px rgba(0,0,0,.06);
  --shadow-md:  0 4px 16px rgba(0,0,0,.08);
  --shadow-lg:  0 12px 40px rgba(0,0,0,.10);

  --nav-height: 68px;
  --max-width:  1160px;
  --section-v:  96px;
}

/* ── 2. Warm & Natural ────────────────────────────────────── */
[data-theme="warm-natural"] {
  --color-bg:          #FAF6F0;
  --color-surface:     #FDF9F4;
  --color-surface-alt: #F2EAE0;
  --color-border:      #DDD0BF;
  --color-text:        #2D1F10;
  --color-text-muted:  #7A6350;
  --color-accent:      #7C4A18;
  --color-accent-light:#F5E6D3;
  --color-accent-dark: #5C3410;
  --color-nav-bg:      #3D2512;
  --color-nav-text:    #F5E6D3;
  --color-hero-bg:     #3D2512;
  --color-hero-text:   #FAF6F0;
  --color-hero-accent: #D4924A;
  --color-btn-primary:    #7C4A18;
  --color-btn-primary-fg: #FDF9F4;
  --color-btn-secondary:    #3D2512;
  --color-btn-secondary-fg: #FAF6F0;
  --color-footer-bg:   #2D1F10;
  --color-footer-text: #9A8070;
  --color-success:     #2D7D46;
  --color-error:       #C0392B;

  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'Source Sans 3', Helvetica, sans-serif;
  --font-mono:    monospace;
}

/* ── 3. Bold & Modern (dark) ──────────────────────────────── */
[data-theme="bold-modern"] {
  --color-bg:          #0F0F0F;
  --color-surface:     #1A1A1A;
  --color-surface-alt: #242424;
  --color-border:      #2E2E2E;
  --color-text:        #F0F0F0;
  --color-text-muted:  #888888;
  --color-accent:      #E8A45A;
  --color-accent-light:#2A1E0F;
  --color-accent-dark: #C07830;
  --color-nav-bg:      #0F0F0F;
  --color-nav-text:    #F0F0F0;
  --color-hero-bg:     #0F0F0F;
  --color-hero-text:   #F0F0F0;
  --color-hero-accent: #E8A45A;
  --color-btn-primary:    #E8A45A;
  --color-btn-primary-fg: #0F0F0F;
  --color-btn-secondary:    #F0F0F0;
  --color-btn-secondary-fg: #0F0F0F;
  --color-footer-bg:   #080808;
  --color-footer-text: #666666;
  --color-success:     #3CB371;
  --color-error:       #E55454;

  --font-display: 'Space Grotesk', 'Helvetica Neue', sans-serif;
  --font-body:    'Space Grotesk', 'Helvetica Neue', sans-serif;
  --font-mono:    'JetBrains Mono', monospace;
}