@media(max-width:820px){
  .project-media{opacity:.2}
  .project-media::after{background:linear-gradient(90deg,rgba(3,7,13,.94),rgba(3,7,13,.45))}
  .project:focus-visible .project-media,.project:active .project-media{opacity:.82}
  .project-media img{filter:saturate(.78) contrast(1.08) brightness(.74)}
  .project:focus-visible .project-media img,.project:active .project-media img{filter:saturate(1) contrast(1.04) brightness(.94)}
}
@media(max-width:600px){
  .site-header{padding-top:max(1.2rem,env(safe-area-inset-top))}
  .hero{padding-top:calc(6.5rem + env(safe-area-inset-top))}
  .hero-copy{max-width:33rem}
  .hero h1{font-size:clamp(3.75rem,16vw,5.8rem);line-height:.88}
  .hero-lede{font-size:1rem}
  .hero-actions{gap:1rem}
  .button{min-height:3rem}
  .hero-foot{bottom:max(1.2rem,env(safe-area-inset-bottom))}
  .project{min-height:138px}
  .services-content{padding-bottom:6rem}
  .contact{padding-bottom:calc(6rem + env(safe-area-inset-bottom))}
}
@media(max-width:600px){.hero-foot{display:none}}