:root {
  /* Core colours sampled from the supplied raster logo */
  --odeys-navy: #091949;
  --odeys-teal: #4493A5;

  /* Supporting digital palette */
  --odeys-ocean: #0C7C91;
  --odeys-sky: #A8D2D9;
  --odeys-ice: #F2F7F8;
  --odeys-cloud: #F7F8FA;
  --odeys-white: #FFFFFF;
  --odeys-slate: #52627A;
  --odeys-border: #DDE5EC;

  /* Typography */
  --odeys-display-font: "Montserrat", "Avenir Next", Arial, sans-serif;
  --odeys-body-font: "Inter", "Segoe UI", Arial, sans-serif;

  /* Layout */
  --odeys-radius: 14px;
  --odeys-space-unit: 8px;
  --odeys-content-width: 1180px;
}

/* Suggested web UI */
.odeys-button-primary {
  background: var(--odeys-navy);
  color: var(--odeys-white);
  border: 1px solid var(--odeys-navy);
}

.odeys-button-secondary {
  background: var(--odeys-white);
  color: var(--odeys-navy);
  border: 1px solid var(--odeys-navy);
}

.odeys-link {
  color: var(--odeys-ocean);
}

.odeys-surface {
  background: var(--odeys-white);
  border: 1px solid var(--odeys-border);
  border-radius: var(--odeys-radius);
}