:root {
  --color-primary: #0b1f3a;
  --color-secondary: #c9a44c;
  --color-tertiary: #c8102e;
  --color-neutral: #ffffff;
  --color-surface: #0e1623;
  --color-on-surface: #ffffff;

  --font-family-base: Inter, "Segoe UI", Arial, sans-serif;

  --font-headline-lg-size: 48px;
  --font-headline-lg-weight: 700;
  --font-headline-lg-line-height: 1.1;
  --font-headline-lg-letter-spacing: -0.02em;

  --font-headline-md-size: 32px;
  --font-headline-md-weight: 600;
  --font-headline-md-line-height: 1.2;

  --font-body-md-size: 16px;
  --font-body-md-weight: 400;
  --font-body-md-line-height: 1.5;

  --font-label-caps-size: 12px;
  --font-label-caps-weight: 500;
  --font-label-caps-line-height: 1;
  --font-label-caps-letter-spacing: 0.12em;

  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 32px;
  --space-xl: 64px;
  --space-2xl: 96px;

  --radius-sm: 4px;
  --radius-md: 8px;

  --overlay-strong: rgba(14, 22, 35, 0.82);
  --overlay-primary: rgba(11, 31, 58, 0.78);
  --overlay-subtle: rgba(14, 22, 35, 0.72);
  --border-subtle: rgba(255, 255, 255, 0.12);
  --text-muted: rgba(255, 255, 255, 0.72);

  --banner-width: 120in;
  --banner-height: 24in;
  --banner-preview-width: 980px;
  --banner-ratio: 120 / 24;

  --bunting-width: 30in;
  --bunting-height: 78in;
  --bunting-preview-width: 320px;
  --bunting-ratio: 30 / 78;

  --qr-a4-width: 8.27in;
  --qr-a4-height: 11.69in;
  --qr-a3-width: 297mm;
  --qr-a3-height: 420mm;
  --qr-preview-width: 420px;
  --qr-a4-ratio: 8.27 / 11.69;
  --qr-a3-ratio: 297 / 420;

  --invitation-width: 5.8in;
  --invitation-height: 8.3in;
  --invitation-preview-width: 420px;
  --invitation-ratio: 5.8 / 8.3;

  --landing-max-width: 420px;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

html {
  background: #08111d;
}

body {
  font-family: var(--font-family-base);
  font-size: var(--font-body-md-size);
  line-height: var(--font-body-md-line-height);
  color: var(--color-on-surface);
  background: #09111d;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}