/* ── two-column hero on desktop ─────────────────────────────── */
  .home-hero {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    height: 50vh;
    padding: 0 2rem;
  }
  
  /* keep the avatar tidy */
  .home-hero img {
    max-width: 240px;
    height: auto;
    border-radius: 8px;
  }
  
  /* ── phones: stack vertically ───────────────────────────────── */
  @media (max-width: 600px) {
    .home-hero {
      flex-direction: column;
      align-items: center;
      text-align: center;
    }
  }