@layer components {
  .back-link {
    display: inline-flex;
    align-items: center;
    color: var(--text-secondary-light);
    transition: color 0.2s ease;

    &:hover {
      color: var(--primary);
    }
  }

  .back-link-label,
  .button-label {
    font-weight: 600;
  }

  .page-title {
    font-size: clamp(1.875rem, 1.5rem + 1vw, 2.25rem);
    font-weight: 700;
  }

  .page-description {
    font-size: 1.125rem;
    line-height: 1.625;
  }

  .section-title {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--text-light);
  }
}