/* Start-here strip, one tidy row (Juno, Oct. 26, 2026).
   Live: the label + 3 doors wrapped at every desktop width, orphaning "Power user"
   on a second line. Desktop now: label on its own line, 3 equal-height doors in one row.
   Tokens only (band vars), so it follows every theme. Mobile (<=720px) keeps the stack. */
@media (min-width: 721px) {
  .hero-start {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr;
    gap: .45rem .45rem;
    align-items: stretch;
  }
  .hero-start-label { grid-column: 1 / -1; margin: 0; }
  .hero-start a {
    white-space: nowrap;
    min-width: 0;
    padding: .42rem .6rem .42rem .4rem;
    background: color-mix(in srgb, var(--band-ink) 5%, transparent);
  }
}
/* A little life: the number chip tips like a stamp on hover/focus. */
.hero-start a b { transition: transform .22s cubic-bezier(.3, 1.6, .5, 1); }
.hero-start a:hover b, .hero-start a:focus-visible b { transform: rotate(-10deg) scale(1.12); }
@media (prefers-reduced-motion: reduce) {
  .hero-start a b { transition: none; }
  .hero-start a:hover b, .hero-start a:focus-visible b { transform: none; }
}