.back-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid #9caaa0;
  border-radius: 32px;
}
.hero.about-hero .about-photo {
  display: block;
  height: auto;
  max-width: 440px;
  justify-self: center;
  border-radius: 22px;
}
.pill, .back-link { white-space: normal; }
@media (prefers-reduced-motion: no-preference) {
  .pill {
    background-image: linear-gradient(110deg, transparent 35%, #ffffff20 73%, #ffffff0b 100%);
    background-size: 235% 100%;
    background-position: 0 50%;
    transition: background-position 240ms ease-out, box-shadow 180ms ease-out, transform 180ms ease-out;
  }
  .pill:focus-visible, .pill:active { background-position: 100% 50%; }
  .pane, .invitation, .team .card {
    transition: transform 200ms ease-out, box-shadow 200ms ease-out;
  }
  .pane:focus-within, .invitation:focus-within, .team .card:focus-within {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px #292e2b15;
  }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .pill:hover { background-position: 100% 50%; }
  .pane:hover, .invitation:hover, .team .card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px #292e2b15;
  }
}

/* Shared navigation, adapted from the capsule pattern on 21st.dev. */
.mast .site-nav {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid #d4dbd3;
  border-radius: 30px;
  background: #fff;
}
.site-nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 clamp(10px, 2vw, 20px);
  border-radius: 24px;
  color: #292e2b;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}
.site-nav a:hover, .site-nav a:focus-visible, .mast .site-nav a[aria-current="page"] {
  background: #f5f6f3;
  color: #292e2b;
  box-shadow: inset 0 0 0 1px #d4dbd3;
  text-decoration: none;
}
.home-mast { flex-wrap: wrap; gap: 10px; padding-block: 10px; }
.home-mast .trail-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 44px;
  padding: 0 13px;
  border: 1px solid #9caaa0;
  border-radius: 30px;
  font-size: 14px;
  font-weight: 700;
}
@media (prefers-reduced-motion: no-preference) {
  .site-nav a { transition: background-color 180ms ease-out, color 180ms ease-out; }
}
@media (max-width: 580px) {
  .top-band .mast.home-mast { justify-content: center; }
}



/* A restrained radial fill for the two primary links in the home panels. */
.origin-cta {
  background-image: radial-gradient(circle at center, #ffffff23 0, #ffffff23 50%, transparent 51%);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0 0;
}
@media (prefers-reduced-motion: no-preference) {
  .origin-cta { transition: background-size 440ms cubic-bezier(.16,1,.3,1), box-shadow 180ms ease-out; }
  .origin-cta:focus-visible, .origin-cta:active {
    background-position: center;
    background-size: 250% 250%;
  }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .origin-cta:hover {
    background-position: center;
    background-size: 250% 250%;
  }
}