.studio-home {
  --text: #f5f5f5;
  --muted: #b4b7b8;
  --cyan: #00c4cb;
  --magenta: #ed009a;
}

.studio-home [hidden],
.studio-home .library-band.is-empty { display: none !important; }
.studio-home main { letter-spacing: 0; }
.studio-home a:focus-visible,
.studio-home button:focus-visible { outline: 2px solid var(--cyan); outline-offset: 5px; }
.studio-home .construction-banner { background: #111; color: #b4b7b8; font-size: 0.75rem; letter-spacing: 0; padding: 6px 20px; }
.studio-home .site-header { min-height: 80px; }
.studio-home .site-nav { gap: 2rem; font-size: 0.875rem; font-weight: 550; letter-spacing: 0; text-transform: none; }
.studio-home .header-cta,
.studio-home .button.primary { background: var(--cyan); box-shadow: none; border-radius: 3px; letter-spacing: 0; text-transform: none; font-size: 0.9rem; font-weight: 650; }
.studio-home .header-cta:hover,
.studio-home .button.primary:hover { background: #66e0e3; }
.studio-home .hero { min-height: 520px; height: calc(90svh - 110px); max-height: 960px; }
.studio-home .hero-lower { bottom: 48px; max-width: 580px; gap: 20px; }
.studio-home .hero h1 { margin: 0; font-size: 4rem; font-weight: 650; line-height: 1.05; letter-spacing: 0; }
.studio-home .hero h1 span { color: var(--cyan); }
.studio-home .hero-lower p { font-size: 1.125rem; line-height: 1.6; max-width: 510px; }
.studio-home .hero-shade { background: linear-gradient(0deg, rgba(0,0,0,.9), transparent 75%); }
.studio-home .text-link { font-size: 0.875rem; font-weight: 550; letter-spacing: 0; text-transform: none; }
.studio-home .overview-band { grid-template-columns: 1fr 1fr; gap: 64px; padding-block: 64px; background: #090a0a; }
.studio-home #work { grid-column: 1 / -1; }
.studio-home .overview-column { min-width: 0; }
.studio-home .overview-column + .overview-column { border: 0; padding: 0; }
.studio-home .section-kicker { font-size: 1.75rem; font-weight: 600; letter-spacing: 0; text-transform: none; margin-bottom: 28px; }
.studio-home .work-taxonomy { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--line); }
.studio-home .work-item { min-height: 188px; padding: 24px 20px; gap: 12px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; }
.studio-home .work-item::before,
.studio-home .work-item::after { display: none; }
.studio-home .work-item:hover { background: #161818; transform: none; }
.studio-home .work-item span { margin-top: 6px; font-size: 1.0625rem; font-weight: 600; line-height: 1.35; }
.studio-home .work-item small { font-size: 0.875rem; line-height: 1.55; max-width: 24rem; }
.studio-home .work-icon { color: var(--cyan); }
.studio-home .work-item:nth-child(even) .work-icon { color: var(--magenta); }
.studio-home .service-stack { gap: 0; }
.studio-home .service-stack li { padding: 22px 0; border-top: 1px solid var(--line); }
.studio-home .service-stack span { font-size: 1.125rem; font-weight: 600; }
.studio-home .service-stack small { font-size: 0.9375rem; line-height: 1.6; }
.studio-home .process-list { gap: 0; }
.studio-home .process-list li { padding: 22px 0; border-top: 1px solid var(--line); }
.studio-home .process-list strong { font-size: 1.125rem; letter-spacing: 0; text-transform: none; font-weight: 600; }
.studio-home .process-list span { color: var(--magenta); font-weight: 500; }
.studio-home .process-list p { font-size: 0.9375rem; line-height: 1.6; }
.studio-home .about-contact-band { padding-block: 80px; gap: 64px; background: #111313; }
.studio-home .about-panel h2,
.studio-home .contact-panel h2,
.studio-home .library-band h2 { font-size: 2.5rem; line-height: 1.18; font-weight: 550; }
.studio-home .about-panel p { line-height: 1.75; }
.studio-home .contact-panel { padding-left: 0; border: 0; }
.studio-home .contact-panel .button { justify-self: start; }
.studio-home .contact-list li { min-width: 0; }
.studio-home .contact-list a { overflow-wrap: anywhere; }
.studio-home .library-band { padding-block: 64px; }
.studio-home .site-footer { grid-template-columns: 150px 1fr; padding-block: 32px; }
.studio-home .site-footer > span { justify-self: end; font-size: 0.8125rem; }
.studio-home .footer-logo { width: 130px; }

@media (max-width: 1120px) {
  .studio-home .site-nav.open { top: 80px; }
  .studio-home .work-taxonomy { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .studio-home .about-contact-band { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .studio-home .site-header { grid-template-columns: 1fr auto; justify-items: start; min-height: 68px; }
  .studio-home .brand { display: block; width: 124px; }
  .studio-home .brand-mark { width: 124px; }
  .studio-home .site-nav.open { top: 68px; }
  .studio-home .site-nav.open a { padding-block: 12px; }
  .studio-home .hero { height: auto; min-height: 560px; max-height: none; }
  .studio-home .hero-media { position: absolute; inset: 0; height: 100%; }
  .studio-home .hero-media video { object-fit: contain; object-position: center top; }
  .studio-home .hero-shade { display: block; background: linear-gradient(0deg, #000 2%, rgba(0,0,0,.78) 38%, transparent 90%); }
  .studio-home .hero-lower { position: relative; inset: auto; padding: 290px 20px 36px; text-align: left; justify-items: start; gap: 16px; }
  .studio-home .hero h1 { font-size: 2.75rem; }
  .studio-home .hero-lower p { font-size: var(--hero-mobile-text-size, 18px); line-height: 1.5; }
  .studio-home .hero-actions { justify-content: flex-start; width: 100%; gap: 12px 24px; }
  .studio-home .overview-band { grid-template-columns: 1fr; gap: 40px; padding-block: 40px; }
  .studio-home .work-item { padding: 20px 12px; min-height: 200px; }
  .studio-home .work-item span { font-size: 1rem; }
  .studio-home .work-item small { font-size: 0.8125rem; }
  .studio-home .section-kicker { font-size: 1.5rem; }
  .studio-home .about-contact-band { padding-block: 48px; gap: 40px; }
  .studio-home .about-panel h2,
  .studio-home .contact-panel h2,
  .studio-home .library-band h2 { font-size: 2rem; }
  .studio-home .site-footer { grid-template-columns: 1fr; justify-items: start; text-align: left; }
  .studio-home .site-footer > span { justify-self: start; }
}
