:root {
  --color-business-navy: #0f2747;
  --color-business-blue: #1f5f8b;
  --color-business-slate: #475569;
  --color-business-surface: #f6f8fb;
  --radius-system: 0.5rem;
}

html {
  scroll-behavior: smooth;
}

body {
  background:
    radial-gradient(circle at top left, rgba(31, 95, 139, 0.14), transparent 34rem),
    linear-gradient(135deg, #f8fafc 0%, #eef3f8 48%, #f8fafc 100%);
}

:where([class*="rounded"]) {
  border-radius: var(--radius-system) !important;
}

.field-focus {
  transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.field-focus:focus {
  border-color: var(--color-business-blue);
  box-shadow: 0 0 0 4px rgba(31, 95, 139, 0.13);
  outline: none;
}