/* Page-specific layout. The design system in tokens.css provides the
   ground (background, type, .card, .t-* utilities, hover settle); this
   file is only the bits that compose the page itself. */

/* Home link, fixed top-left — bare text, no chrome. The only addition
   to the system's vocabulary on this page. */
.home-link {
  position: fixed;
  top: var(--space-5);
  left: var(--space-6);
  z-index: 10;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--fg-muted);
  font-size: var(--fs-sm);
  font-weight: 500;
  text-decoration: none;
  transition: color var(--motion-fast) var(--ease);
}

.home-link:hover,
.home-link:focus-visible {
  color: var(--accent);
}

.home-link__arrow {
  display: inline-block;
  transition: transform var(--motion-fast) var(--ease);
}

.home-link:hover .home-link__arrow {
  transform: translateX(-2px);
}

main {
  max-width: 1100px;
  margin: 0 auto;
  padding: var(--space-20) var(--space-6);
}

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 22px;
}