/* ═══════════════════════════════════════════════════════════════
   THEME — colours, fonts and shapes for the whole site.
   Pick a preset with <html data-theme="…"> or edit the default below.
   Each preset needs its fonts loaded: copy the matching Google Fonts
   link (listed above each preset) into the <head> of every page.
   See GUIDE.md → "3. Themes".
   ═══════════════════════════════════════════════════════════════ */

/* ── Default: "studio" — cool paper, black ink, yellow accent, tall uppercase headlines (the Exa look)
   Fonts: https://fonts.googleapis.com/css2?family=Anton&family=Inter+Tight:wght@400;500;600;700&display=swap */
:root {
  --paper: #eef1f5;        /* page background */
  --paper-hi: #ffffff;     /* glows, top of gradients */
  --surface: #ffffff;      /* cards, buttons, panels */
  --surface-2: #e3e8ee;    /* image wells, bottom of gradients */
  --ink: #111316;          /* text and dark buttons */
  --muted: #5b616c;        /* secondary text — keep 4.5:1 contrast with --paper */
  --accent: #f5c518;       /* the one bright colour */
  --on-accent: #111316;    /* text on the accent */
  --dark: #111316;         /* footer / dark sections */
  --on-dark: #ffffff;

  --display: 'Anton', 'Impact', 'Arial Narrow', sans-serif;
  --display-weight: 400;
  --display-case: uppercase;   /* uppercase or none */
  --display-tracking: .004em;
  --display-leading: .92;
  --sans: 'Inter Tight', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --radius-xl: 28px;
  --radius-lg: 22px;
  --radius-md: 14px;
  --radius-btn: 999px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-io: cubic-bezier(0.76, 0, 0.24, 1);
  --maxw: 1400px;

  /* derived — usually leave alone */
  --line: color-mix(in srgb, var(--ink) 10%, transparent);
  --line-strong: color-mix(in srgb, var(--ink) 18%, transparent);
  --glass: color-mix(in srgb, var(--surface) 62%, transparent);
  --shadow: color-mix(in srgb, var(--ink) 32%, transparent);
  color-scheme: light;
}

/* ── "resort" — hotels, villas, spas, weddings: warm sand, deep green, brass, elegant serif
   Fonts: https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600&family=Jost:wght@400;500;600&display=swap */
html[data-theme="resort"] {
  --paper: #f4efe6; --paper-hi: #fffaf2; --surface: #fffaf2; --surface-2: #e8dfd0;
  --ink: #1f2b25; --muted: #5f645d; --accent: #b98a4b; --on-accent: #fffaf2;
  --dark: #1f2b25; --on-dark: #f4efe6;
  --display: 'Cormorant Garamond', Georgia, serif; --display-weight: 500; --display-case: none;
  --display-tracking: -.01em; --display-leading: .95;
  --sans: 'Jost', system-ui, sans-serif;
  --radius-xl: 6px; --radius-lg: 4px; --radius-md: 4px; --radius-btn: 2px;
}

/* ── "campus" — schools, academies, kids' clubs, training centres: bright, friendly, rounded
   Fonts: https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,700;12..96,800&family=Figtree:wght@400;500;600;700&display=swap */
html[data-theme="campus"] {
  --paper: #f6f7fb; --paper-hi: #ffffff; --surface: #ffffff; --surface-2: #e5e9f5;
  --ink: #18214a; --muted: #555d7a; --accent: #ff6b4a; --on-accent: #ffffff;
  --dark: #18214a; --on-dark: #ffffff;
  --display: 'Bricolage Grotesque', system-ui, sans-serif; --display-weight: 800; --display-case: none;
  --display-tracking: -.03em; --display-leading: .95;
  --sans: 'Figtree', system-ui, sans-serif;
  --radius-xl: 36px; --radius-lg: 28px; --radius-md: 18px;
}

/* ── "care" — clinics, dentists, pharmacies, wellness: calm, clean, trustworthy
   Fonts: https://fonts.googleapis.com/css2?family=DM+Serif+Display&family=DM+Sans:wght@400;500;600;700&display=swap */
html[data-theme="care"] {
  --paper: #f2f7f6; --paper-hi: #ffffff; --surface: #ffffff; --surface-2: #dfece9;
  --ink: #12302c; --muted: #4f625f; --accent: #2bb39a; --on-accent: #ffffff;
  --dark: #12302c; --on-dark: #f2f7f6;
  --display: 'DM Serif Display', Georgia, serif; --display-weight: 400; --display-case: none;
  --display-tracking: -.01em; --display-leading: 1;
  --sans: 'DM Sans', system-ui, sans-serif;
  --radius-xl: 24px; --radius-lg: 18px; --radius-md: 12px;
}

/* ── "bistro" — restaurants, cafés, bars, bakeries: dark, warm, tomato red
   Fonts: https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,700&family=Work+Sans:wght@400;500;600&display=swap */
html[data-theme="bistro"] {
  --paper: #16120f; --paper-hi: #241d18; --surface: #211b16; --surface-2: #0e0b09;
  --ink: #f5ece0; --muted: #b5a898; --accent: #e5533c; --on-accent: #ffffff;
  --dark: #0b0907; --on-dark: #f5ece0;
  --display: 'Fraunces', Georgia, serif; --display-weight: 700; --display-case: none;
  --display-tracking: -.02em; --display-leading: .95;
  --sans: 'Work Sans', system-ui, sans-serif;
  --radius-xl: 20px; --radius-lg: 14px; --radius-md: 10px;
  --shadow: rgba(0, 0, 0, .6);
  color-scheme: dark;
}

/* ── "canyon" — Grand Canyon Banquet Hall: warm ivory, midnight blue (the hall's LED glow), champagne gold (the gilt chairs and carpet)
   Fonts: https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;1,500&family=Jost:wght@400;500;600&display=swap */
html[data-theme="canyon"] {
  --paper: #f6f1e8; --paper-hi: #fffbf4; --surface: #fffbf4; --surface-2: #e9e0d0;
  --ink: #151a36; --muted: #565a6c; --accent: #b98c4e; --on-accent: #ffffff;
  --dark: #0f1330; --on-dark: #f6f1e8;
  --display: 'Cormorant Garamond', Georgia, serif; --display-weight: 500; --display-case: none;
  --display-tracking: -.012em; --display-leading: .95;
  --sans: 'Jost', system-ui, sans-serif;
  --radius-xl: 6px; --radius-lg: 4px; --radius-md: 4px; --radius-btn: 2px;
}