/* Existing content shares the supplied studio's chrome and environmental art. */
@layer components {
  .legacy-page { background: #07131f; }
  .legacy-environment { position: absolute; inset: 0 0 auto; height: 72rem; pointer-events: none; }
  .legacy-environment::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, #07131f55, #07131fed 45%, #07131f 90%); }
  .legacy-content { position: relative; margin: 0 auto; padding: 10rem max(24px, 5vw) 6rem; max-width: 1280px; min-height: 70vh; overflow-wrap: anywhere; }
  .legacy-content h1 { max-width: 24ch; margin-bottom: 1.5rem; font-size: clamp(2.4rem, 5vw, 5rem); line-height: 1.05; }
  .legacy-content h2 { margin-block: 2rem 1rem; font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.15; }
  .legacy-content p { line-height: 1.75; }
  .legacy-content article, .legacy-content section { max-width: 100%; }
  .legacy-content .tdp-tier, .legacy-content.tdp-tier { margin-top: 0; }
  .legacy-content pre { max-width: 100%; overflow: auto; }
  .legacy-content table { display: block; max-width: 100%; overflow: auto; }
  .legacy-content img, .legacy-content iframe { max-width: 100%; }
  .site-footer nav { flex-wrap: wrap; }
  .form-footnote a { text-decoration: underline; text-underline-offset: .2em; overflow-wrap: anywhere; }
  .project-form { min-width: 0; }
  .cf-turnstile { min-height: 65px; max-width: 100%; }
  .client-work-link { margin-bottom: 3rem; }
}
@media (max-width: 700px) {
  .legacy-content { padding: 8rem 22px 4rem; }
  .legacy-content h1 { font-size: clamp(2rem, 9vw, 3.2rem); }
  .contact-intro h1 em { display: block; }
}
