/* Compact About Us introduction; these styles apply only to this page. */
.editorial-about .studio-hero { padding-block: 35px; }
.editorial-about .studio-hero-grid { grid-template-columns: 1fr 1fr; gap: 68px; }
.editorial-about .studio-hero-copy .editorial-label { margin-bottom: 17px; }
.editorial-about .studio-hero-copy h1 { font-size: clamp(46px, 4.5vw, 62px); line-height: 1.04; }
.editorial-about .studio-hero-lede { max-width: 465px; margin-top: 19px; font-size: 16px; line-height: 1.7; }
.editorial-about .studio-hero .editorial-actions { margin-top: 23px; gap: 25px; }
.editorial-about .studio-hero .button { min-height: 44px; padding-block: 9px; font-size: 11px; }
.studio-intro-scene { min-width: 0; overflow: hidden; border: 1px solid #bcc8af; border-radius: 6px; background: #19372a; }
.studio-scene-art { position: relative; overflow: hidden; aspect-ratio: 1.95; }
.studio-scene-art::after { content: ''; position: absolute; inset: 45% 0 0; background: linear-gradient(0deg,#0e2b23c9,transparent); pointer-events: none; }
.studio-scene-art > img { width: 100%; height: 100%; object-fit: cover; object-position: center 54%; }
.studio-scene-units { position: absolute; z-index: 1; left: 15px; bottom: 15px; display: flex; gap: 7px; padding: 7px; border: 1px solid #c8dcac5c; border-radius: 4px; background: #15382cdd; }
.studio-scene-units > img { width: 33px; height: 33px; border-radius: 3px; }
.studio-scene-game { position: absolute; z-index: 1; right: 17px; bottom: 22px; color: #fff6d3; font-family: Georgia,serif; font-size: 20px; font-weight: 700; letter-spacing: -.03em; }
.studio-intro-scene figcaption { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 14px 17px; color: #c3d1b6; font-size: 10px; }
.studio-intro-scene figcaption > a { display: inline-flex; align-items: center; gap: 15px; flex: none; color: #eed291; font-size: 10px; text-decoration: none; text-underline-offset: 4px; }
.studio-intro-scene figcaption > a:hover { text-decoration: underline; }
@media (max-width: 1120px) {
  .editorial-about .studio-hero-grid { gap: 44px; }
  .editorial-about .studio-hero-copy h1 { font-size: 53px; }
  .editorial-about .studio-hero-lede { font-size: 15px; }
  .studio-intro-scene figcaption { gap: 14px; padding-inline: 14px; font-size: 9px; }
  .studio-intro-scene figcaption > a { gap: 10px; font-size: 9px; }
}
@media (max-width: 850px) {
  .editorial-about .studio-hero { padding-block: 30px; }
  .editorial-about .studio-hero-grid { gap: 30px; }
  .editorial-about .studio-hero-copy h1 { font-size: 45px; }
  .editorial-about .studio-hero-copy .editorial-label { font-size: 8px; }
  .editorial-about .studio-hero-lede { margin-top: 16px; font-size: 14px; }
  .editorial-about .studio-hero .editorial-actions { gap: 18px; margin-top: 20px; }
  .editorial-about .studio-hero .button { gap: 12px; padding-inline: 13px; font-size: 10px; }
  .editorial-about .studio-hero .editorial-text-link { gap: 12px; font-size: 10px; }
  .studio-scene-art { aspect-ratio: 1.65; }
  .studio-scene-units { left: 10px; bottom: 11px; gap: 5px; padding: 5px; }
  .studio-scene-units > img { width: 26px; height: 26px; }
  .studio-scene-game { right: 12px; bottom: 20px; font-size: 16px; }
  .studio-intro-scene figcaption { align-items: start; flex-direction: column; gap: 5px; padding-block: 10px; }
}
@media (max-width: 650px) {
  .editorial-about .studio-hero { padding-block: 27px 30px; }
  .editorial-about .studio-hero-grid { grid-template-columns: 1fr; gap: 26px; }
  .editorial-about .studio-hero-copy h1 { font-size: clamp(42px,10vw,54px); }
  .editorial-about .studio-hero-copy .editorial-label { margin-bottom: 14px; font-size: 8px; }
  .editorial-about .studio-hero-lede { max-width: 440px; margin-top: 16px; font-size: 14px; }
  .editorial-about .studio-hero .editorial-actions { gap: 23px; margin-top: 18px; }
  .editorial-about .studio-hero .button { font-size: 11px; }
  .editorial-about .studio-hero .editorial-text-link { font-size: 11px; }
  .studio-scene-art { aspect-ratio: 2.15; }
  .studio-scene-units > img { width: 27px; height: 27px; }
  .studio-scene-game { bottom: 20px; font-size: 18px; }
  .studio-intro-scene figcaption { flex-direction: row; align-items: center; padding: 11px 12px; gap: 12px; font-size: 8px; }
  .studio-intro-scene figcaption > a { gap: 8px; font-size: 8px; }
}
@media (max-width: 360px) {
  .studio-scene-units { gap: 4px; }
  .studio-scene-units > img { width: 24px; height: 24px; }
  .studio-scene-game { font-size: 16px; }
  .studio-intro-scene figcaption { gap: 8px; padding-inline: 10px; font-size: 7px; }
  .studio-intro-scene figcaption > a { font-size: 7px; }
}
