:root {
  --msp-primary: #1f4f7a;
  --msp-secondary: #f4f7fa;
  --msp-text: #1f2933;
}

body {
  color: var(--msp-text);
  background: #ffffff;
}

.hero {
  background: linear-gradient(180deg, var(--msp-secondary) 0%, #ffffff 100%);
}

.site-logo {
  width: 42px;
  height: 42px;
  object-fit: contain;
}

.navbar-brand {
  font-weight: 600;
  color: var(--msp-primary);
}

.navbar-brand:hover,
.navbar-brand:focus {
  color: var(--msp-primary);
}

.info-card {
  background: var(--msp-secondary);
  border: 1px solid #dce6ef;
}

.btn-primary {
  background-color: var(--msp-primary);
  border-color: var(--msp-primary);
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #153a5d;
  border-color: #153a5d;
}

main p {
  max-width: 75ch;
}