body {
  background-color: var(--color-background-page);
  color: var(--color-text);
  font-family: var(--font-family-base);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-normal);
  line-height: 1.5;
}

h1 {
  color: var(--color-text-header);
  font-family: var(--font-family-heading);
  font-size: var(--font-size-3xl);
  font-weight: var(--font-weight-bold);
  letter-spacing: -0.02em;
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

h2 {
  color: var(--color-accent-light);
  font-family: var(--font-family-heading);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  border-bottom: 2px solid var(--color-border-accent);
  padding-bottom: var(--spacing-sm);
}

a {
  color: var(--color-link);
  transition: color 0.2s;
}

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

a:visited {
  color: var(--color-link-visited);
}

p {
  margin: var(--spacing-sm) 0;
}

strong {
  color: var(--color-text-header);
  font-weight: 600;
}

svg.icon {
  display: inline;
  height: 1.5em;
  width: 1.5em;
  vertical-align: middle;
  fill: currentColor;
  flex-shrink: 0;
}