body {
  color: var(--wt-carbon);
  background: var(--wt-bg);
}

:where(a) {
  color: var(--wt-deep-teal);
}

:where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid var(--wt-deep-teal);
  outline-offset: 3px;
}

.wt-container {
  width: min(100% - 40px, var(--wt-wide-width));
  margin-inline: auto;
}

.wt-content {
  width: min(100%, var(--wt-content-width));
  margin-inline: auto;
}

.wt-button {
  min-height: 48px;
  padding: 10px 24px;
  border: 1px solid var(--wt-carbon);
  border-radius: var(--wt-radius-control);
  background: var(--wt-carbon);
  color: #fff;
  font: inherit;
  font-weight: 600;
  text-decoration: none;
}

.wt-button:hover {
  background: var(--wt-carbon-hover);
  color: #fff;
}

@media (max-width: 640px) {
  .wt-container {
    width: min(100% - 40px, var(--wt-wide-width));
  }
}