:root {
  --color-navy: #0b1f2a;
  --color-navy-light: #16303f;
  --color-amber: #f5a623;
  --color-amber-dark: #d98c12;
  --color-offwhite: #fbf9f5;
  --color-white: #ffffff;
  --color-ink: #0b1f2a;
  --color-ink-muted: #4a5c66;
  --color-border: #e3ddd2;
  --color-success: #2e7d4f;
  --color-danger: #b3432b;

  /* Real Lux brand palette, pulled from the company's live Lovable site
     (src/styles.css there) — used for the event page chrome (hero, photo
     section, reviews, footer). The calculator card keeps its existing
     navy/amber tokens above, which already sit comfortably alongside these. */
  --color-charcoal: oklch(0.28 0.02 260);
  --color-charcoal-foreground: oklch(0.98 0.003 247);
  --color-brand: oklch(0.62 0.19 230);
  --color-brand-foreground: oklch(0.99 0.003 247);
  --color-sky: oklch(0.72 0.12 220);
  --color-cream: oklch(0.97 0.01 85);

  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-event-display: "Space Grotesk", "Inter", system-ui, sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;

  --shadow-card: 0 1px 2px rgba(11, 31, 42, 0.06), 0 8px 24px rgba(11, 31, 42, 0.08);

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
}

@font-face {
  font-family: "Inter";
  src: url("/fonts/inter-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("/fonts/inter-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fraunces";
  src: url("/fonts/fraunces-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fraunces";
  src: url("/fonts/fraunces-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: var(--font-body);
  color: var(--color-ink);
  background: var(--color-offwhite);
  -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3 {
  font-family: var(--font-display);
  font-weight: 600;
  margin: 0;
  line-height: 1.15;
}