:root {

  --zoguy-teal: #0E6D82;
  --zoguy-blue: #08526B;
  --zoguy-navy: #041E2D;

  --zoguy-color-primary: #08526B;
  --zoguy-color-primary-hover: #041E2D;

  --zoguy-color-text: #17232B;
  --zoguy-color-text-muted: #64727A;

  --zoguy-color-background: #FFFFFF;
  --zoguy-color-surface: #F6F8F9;

  --zoguy-color-border: #DCE3E7;

  --zoguy-color-success: #17663A;
  --zoguy-color-warning: #8A5A00;
  --zoguy-color-error: #9B2020;

  --zoguy-font-body:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  --zoguy-font-heading:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  --zoguy-font-size-base: 1rem;
  --zoguy-line-height: 1.6;

  --zoguy-content-width: 76rem;
  --zoguy-content-narrow: 52rem;

  --zoguy-header-height: 72px;

  --zoguy-space-1: 0.25rem;
  --zoguy-space-2: 0.5rem;
  --zoguy-space-3: 0.75rem;
  --zoguy-space-4: 1rem;
  --zoguy-space-5: 1.5rem;
  --zoguy-space-6: 2rem;
  --zoguy-space-7: 3rem;
  --zoguy-space-8: 4rem;
  --zoguy-space-9: 6rem;

  --zoguy-radius-sm: 0.25rem;
  --zoguy-radius-md: 0.5rem;
  --zoguy-radius-lg: 0.75rem;
  --zoguy-radius-pill: 999px;

  --zoguy-shadow-sm:
    0 1px 2px rgb(0 0 0 / 0.05);

  --zoguy-shadow-md:
    0 5px 18px rgb(0 0 0 / 0.08);
}