:root {
  --ink: #10283a;
  --muted: #587080;
  --teal: #08a88a;
  --teal-dark: #08745f;
  --coral: #ff785f;
  --paper: #f6fbfa;
  --line: #d9e8e5;
  color-scheme: light;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Arial, Helvetica, sans-serif;
}

a {
  color: var(--teal-dark);
}

a:hover {
  color: var(--ink);
}

:focus-visible {
  outline: 3px solid var(--coral);
  outline-offset: 3px;
}

.brand {
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 800;
  text-decoration: none;
}

.brand img {
  width: 38px;
  height: 38px;
  object-fit: cover;
  border-radius: 50%;
}

.topbar,
header {
  font-family: Arial, Helvetica, sans-serif;
}

.button,
.nav-cta,
.primary {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 800;
}

.footer,
footer {
  font-family: Arial, Helvetica, sans-serif;
}

@media (max-width: 560px) {
  .brand img {
    width: 34px;
    height: 34px;
  }
}

/* Center page intros on public marketing pages (home hero is a full-bleed image and is left as is) */
body:not(.home) .wrap > .hero,
body:not(.home) main > .hero,
body:not(.home) .hero { margin-left:auto; margin-right:auto; text-align:center; }
.wrap > h1, .wrap > header + h1, .wrap > .lede, .wrap > .updated { text-align:center; }
.hero .actions, .hero .cta-row, .hero .hero-actions { justify-content:center; }