.content {
  width: calc(100% - (2 * var(--space-sm)));
  background-color: var(--color-surface-translucent);
  backdrop-filter: blur(12px);
  border-radius: var(--radius-large);
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.5);
  margin: auto;
  margin-bottom: var(--space-4xl);
  max-width: var(--page-width);
  padding: var(--space-lg);
  position: relative;
  z-index: 1;
}

.content h1,
.content h2,
.content h3 {
  font-family: var(--font-display);
  line-height: var(--line-height-heading);
}

.content h1 {
  color: var(--color-heading);
  font-size: var(--text-title);
  font-weight: bolder;
  text-align: center;
}

.content h2 {
  font-size: var(--text-heading);
  color: var(--color-heading);
  font-weight: bolder;
  text-align: center;
}

.content h3 {
  font-size: var(--text-subheading);
  color: var(--color-subheading);
  font-weight: bolder;
  text-align: left;
}