:root {
  /* Colors */
  --color-primary: #2b5f8a;
  --color-accent: #d4762c;
  --color-bg-dark: #1c1814;
  --color-text-light: #f5f0e8;
  --color-mid: #3d3229;

  /* Derived colors */
  --color-primary-light: #3a7ab5;
  --color-accent-light: #e8944a;
  --color-bg-card: #2a231c;
  --color-border: #4d4036;
  --color-text-muted: #a89b8c;

  /* Fonts */
  --font-heading: 'Playfair Display', Georgia, serif;
  --font-body: 'Source Sans 3', 'Segoe UI', sans-serif;

  /* Spacing scale */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 5rem;

  /* Sizing */
  --max-width: 1100px;
  --nav-height: 64px;
  --border-radius: 6px;

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;

  /* Style / layout (overridden by data-style presets) */
  --border-width: 1px;
  --card-shadow: none;
  --nav-font-size: 0.95rem;
  --nav-letter-spacing: 0.08em;
  --nav-text-transform: uppercase;
  --hero-min-height: 55vh;
  --hero-title-size: clamp(2.5rem, 6vw, 4.5rem);
  --heading-letter-spacing: normal;
  --body-line-height: 1.6;
  --heading-weight: 700;
}

/* ── Mountain Fog — cool slate/blue-grey, teal accent ── */
[data-theme="mountain-fog"] {
  --color-primary: #4a7c8a;
  --color-accent: #2ea8a0;
  --color-bg-dark: #1a1f26;
  --color-text-light: #e4e8ed;
  --color-mid: #272d36;

  --color-primary-light: #5e9bab;
  --color-accent-light: #44c4bb;
  --color-bg-card: #212730;
  --color-border: #3a424e;
  --color-text-muted: #8d96a3;
}

/* ── Golden Hour — warm light theme, amber/gold on off-white ── */
[data-theme="golden-hour"] {
  --color-primary: #8b6914;
  --color-accent: #c4880b;
  --color-bg-dark: #faf6ef;
  --color-text-light: #2c2416;
  --color-mid: #efe8db;

  --color-primary-light: #a67e1e;
  --color-accent-light: #d9a030;
  --color-bg-card: #f2ece2;
  --color-border: #d5cbb8;
  --color-text-muted: #6e6352;
}

/* ══════════════════════════════════════════════
   Style presets (layout / typography axis)
   ══════════════════════════════════════════════ */

/* ── Modern — clean, spacious, shadow-based ── */
[data-style="modern"] {
  --font-heading: 'Montserrat', 'Helvetica Neue', sans-serif;
  --font-body: 'Inter', 'Segoe UI', sans-serif;
  --border-radius: 2px;
  --max-width: 1280px;
  --nav-height: 56px;
  --border-width: 0px;
  --card-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
  --nav-font-size: 0.9rem;
  --nav-letter-spacing: 0.1em;
  --nav-text-transform: uppercase;
  --hero-min-height: 65vh;
  --hero-title-size: clamp(2.8rem, 6vw, 5rem);
  --heading-letter-spacing: -0.01em;
  --body-line-height: 1.65;
  --heading-weight: 700;
}

[data-style="modern"] .member-card,
[data-style="modern"] .contact-card {
  border: none;
  box-shadow: var(--card-shadow);
}

[data-style="modern"] .nav-links a::after {
  display: none;
}

[data-style="modern"] .nav-links a:hover {
  opacity: 0.7;
}

[data-style="modern"] .section-title::after {
  display: none;
}

[data-style="modern"] .btn {
  font-weight: 400;
  letter-spacing: 0.1em;
}

/* ── Rustic — warm, rounded, generous spacing ── */
[data-style="rustic"] {
  --font-heading: 'Lora', Georgia, serif;
  --font-body: 'Cabin', 'Segoe UI', sans-serif;
  --border-radius: 12px;
  --max-width: 960px;
  --nav-height: 72px;
  --border-width: 2px;
  --card-shadow: none;
  --nav-font-size: 1rem;
  --nav-letter-spacing: 0.02em;
  --nav-text-transform: none;
  --hero-min-height: 50vh;
  --hero-title-size: clamp(2.2rem, 5.5vw, 4rem);
  --heading-letter-spacing: 0.01em;
  --body-line-height: 1.75;
  --heading-weight: 700;
}

[data-style="rustic"] .nav-brand {
  font-style: italic;
}

[data-style="rustic"] .nav-links a::after {
  height: 3px;
  border-radius: 2px;
}

[data-style="rustic"] .btn {
  border-radius: 999px;
  text-transform: none;
  letter-spacing: 0.02em;
}

[data-style="rustic"] .btn-outline {
  border-width: 2px;
}
