.responsive-picture {
  display: block;
  width: 100%;
}

.hero-frame > .responsive-picture,
.case-study-media > .responsive-picture {
  height: 100%;
}

.hero-frame > .responsive-picture img {
  display: block;
  width: 100%;
  height: auto;
}

.case-study-media > .responsive-picture img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

#expertise,
#case-studies,
#tools,
#process,
#about,
#contact {
  content-visibility: auto;
  contain-intrinsic-size: auto 900px;
}

.contact-modal[aria-hidden="true"] {
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .marquee-track {
    animation: none;
  }

  [data-reveal] {
    opacity: 1;
    transform: none;
    transition: none;
  }
}