/* Mobile-only refinements. Nothing here applies above 600px, so desktop is untouched. */
@media (max-width:600px){
  body .avatar-row{grid-template-columns:1fr 1fr;gap:28px 16px}
  body .avatar-row a:nth-child(2),body .avatar-row a:nth-child(4){transform:none}
  body .avatar-row .circ{width:min(160px,100%);height:auto;aspect-ratio:1/1;margin-bottom:14px}
  body .avatar-row h3{font-size:20px;margin-bottom:6px}
  body .avatar-row p{font-size:14px;max-width:none}
  body .avatars{padding:80px 0}
  body .avatars .head{margin-bottom:36px}
  body .avatar-link{margin-top:56px}
  body .about-copy{padding:36px var(--px) 80px}
  body .about-quote{position:relative;top:auto;bottom:auto;right:auto;left:auto;margin:-40px 22px 28px;max-width:none}
  body .logos,body .ticker{overflow:hidden}
  body .final .icons{flex-wrap:wrap;gap:18px 22px;justify-content:center}
  body .final .icons img{height:44px}
  body .journey .circ{width:min(260px,100%);height:auto;aspect-ratio:1/1}
  body img,body video,body iframe{max-width:100%}
  body .hero h1{width:100%}
  body .page-hero.contact-hero{grid-template-columns:1fr}
  body .page-hero.contact-hero .hero-text{text-align:center;align-items:center}
  body .page-hero.contact-hero .hero-text p{margin-left:auto;margin-right:auto}
  body .hero{display:flex;flex-direction:column}
  body .hero-text{display:contents}
  body .hero-text>.hero-kicker,body .hero-text>h1,body .hero-text>p{padding-left:var(--px);padding-right:var(--px)}
  body .hero-text>h1{margin-top:48px}
  body .hero-text>p{margin-bottom:36px}
  body .hero-photo{order:3}
  body .hero-text>.btn-big{order:4;align-self:center;margin:32px var(--px) 44px}
  body .about-grid .about-copy{padding-top:56px}
}

@media (max-width:600px){body .nav-logo{font-size:17px}}