.action-row {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: var(--space-md);
}

.action-link {
  color: var(--color-on-action);
  background-color: var(--color-action);
  padding: 10px var(--space-lg);
  border-radius: var(--radius-small);
  font-weight: bold;
  text-decoration: none;
  transition:
    color 150ms ease,
    background-color 150ms ease;
}

.action-link:hover {
  background-color: var(--color-action-hover);
}

.action-link-secondary {
  color: var(--color-action-hover);
  background-color: var(--color-surface-raised);
}

.action-link-secondary:hover {
  color: var(--color-action-hover);
  background-color: var(--color-surface-hover);
}

.page-stack {
  display: grid;
  gap: var(--space-3xl);
}

.page-introduction {
  display: grid;
  justify-items: center;
  gap: var(--space-lg);
  max-width: var(--reading-width);
  margin: auto;
  padding: var(--space-2xl) var(--space-lg);
  text-align: center;
}

.page-introduction h1,
.page-introduction p {
  margin: 0;
}

.page-status {
  color: var(--color-accent);
  font-size: var(--text-small);
  font-weight: bold;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.information-section {
  max-width: var(--reading-width);
  margin: auto;
  padding: 0 var(--space-lg);
  text-align: center;
}

.content-card {
  padding: var(--space-lg);
  border-radius: var(--radius-medium);
  background-color: var(--color-surface-raised);
}

@media (prefers-reduced-motion: reduce) {
  .action-link {
    transition: none;
  }
}
