/**
 * Design Token Palette — Gold Authority (Production Default)
 *
 * All Elementor templates reference these variables via custom CSS.
 * To switch palettes, change values here or override with a palette switcher.
 *
 * Source: mockups/shared/base.css + docs/conversion/css-theme-palettes-prd.md §1
 * For all 17 palette definitions: docs/product/2026-04-03-color-palette-switcher-prd.md
 */

:root {
  /* ── Brand ── */
  --gold: #d4af37;
  --gold-light: #fbbf24;
  --gold-hover: #b8960e;

  /* ── Category Colors (independent of brand) ── */
  --cat-finance: #10b981;
  --cat-tech: #3b82f6;
  --cat-industrie: #f59e0b;
  --cat-geopolitik: #ef4444;
  --cat-energie: #8b5cf6;
  --cat-pharma: #14b8a6;

  /* ── Text ── */
  --text-primary: #1a1a2e;
  --text-secondary: #4a4a5a;
  --text-muted: #5f6775;
  --text-on-dark: #ffffff;

  /* ── Backgrounds ── */
  --bg-body: #f8f9fa;
  --bg-card: #ffffff;
  --bg-panel: #f1f3f5;
  --dark-surface: #1e293b;

  /* ── Borders ── */
  --border-subtle: rgba(0, 0, 0, 0.08);
  --border-medium: rgba(0, 0, 0, 0.1);
  --border-strong: rgba(0, 0, 0, 0.15);

  /* ── Component ── */
  --radius: 8px;
  --shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  --shadow-hover: 0 4px 16px rgba(0, 0, 0, 0.1);

  /* ── Header ── */
  --header-bg: #ffffff;
  --header-border: var(--border-subtle);

  /* ── Footer ── */
  --footer-bg: #1e293b;
  --footer-text: #cbd5e1;
  --footer-link: #94a3b8;
  --footer-muted: #64748b;
  --footer-border: rgba(255, 255, 255, 0.1);
  --footer-input-bg: rgba(255, 255, 255, 0.05);
  --footer-input-border: rgba(255, 255, 255, 0.15);
  --footer-input-text: #ffffff;

  /* ── Badge Pairs (bg / text) ── */
  --badge-energie-bg: #f5f3ff;
  --badge-energie-text: #6d28d9;
  --badge-finance-bg: #ecfdf5;
  --badge-finance-text: #047857;
  --badge-geopolitik-bg: #fef2f2;
  --badge-geopolitik-text: #b91c1c;
  --badge-tech-bg: #eff6ff;
  --badge-tech-text: #1d4ed8;
  --badge-industrie-bg: #fffbeb;
  --badge-industrie-text: #b45309;
  --badge-pharma-bg: #f0fdfa;
  --badge-pharma-text: #0f766e;
  --badge-geldpolitik-bg: #ecfdf5;
  --badge-geldpolitik-text: #047857;

  /* ── Layout ── */
  --container: 1400px;
  --pad: 25px;
}

/* ── Tablet ── */
@media (max-width: 1024px) {
  :root {
    --pad: 20px;
  }
}

/* ── Mobile ── */
@media (max-width: 767px) {
  :root {
    --pad: 15px;
  }
}
