:root { --display-font: "Days One", Arial, Helvetica, sans-serif; }

/* Keep running copy in a neutral text face; use Days One for navigation and display text. */
.site-nav a,
.header-end,
.header-contact,
.hero-topline,
.eyebrow,
.hero-index,
.hero-side-note,
.world-genre,
.world-count,
.scene-label > span,
.scene-button,
.section-tail,
.studio-description a,
.news-no,
.news-text small,
.contact-bottom a,
.site-footer,
.menu-button,
.lang-switch {
  font-family: var(--display-font);
  font-weight: 400;
  letter-spacing: .045em;
  font-synthesis: none;
}

h1, h2, h3,
.scene-label strong,
.news-text strong,
.studio-facts strong {
  font-family: var(--display-font);
  font-weight: 400;
  font-synthesis: none;
}

.site-nav a,
.header-contact,
.lang-switch { font-size: 12px; }
.lang-switch a { opacity: .72; }
.lang-switch a[aria-current] { opacity: 1; }
.hero-topline,
.eyebrow,
.hero-index,
.world-genre,
.world-count,
.scene-label > span,
.section-tail,
.studio-description a,
.news-no,
.news-text small,
.contact-bottom a { font-size: 11px; }
.hero-index,
.world-genre,
.news-text small { color: #465449; }
.scene-button { opacity: .85; }
.scene-button.is-active,
.scene-button:hover { opacity: 1; }

.hero h1 {
  font-family: var(--display-font);
  font-size: clamp(52px, 6.2vw, 112px);
  font-weight: 400;
  font-stretch: normal;
  line-height: .99;
  letter-spacing: -.045em;
}
.hero h1 .italic {
  font-family: var(--display-font);
  font-size: .73em;
  font-style: normal;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -.04em;
}
.hero h1 span:last-child { font-size: .57em; line-height: 1.15; }

.section-heading h2 {
  font-size: clamp(46px, 5vw, 88px);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -.04em;
}
.world-info h3 {
  font-size: clamp(25px, 2.65vw, 41px);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -.04em;
}
.scene-label strong { font-size: 21px; letter-spacing: -.02em; }
.scene-button strong { font-size: 11px; font-weight: 400; letter-spacing: .01em; }

.studio h2 {
  font-size: clamp(55px, 6.2vw, 118px);
  font-weight: 400;
  line-height: 1.04;
  letter-spacing: -.055em;
}
.studio h2 em {
  font-family: var(--display-font);
  font-size: .65em;
  font-style: normal;
  font-weight: 400;
  line-height: 1.22;
  letter-spacing: -.045em;
}
html[lang="ru"] .studio h2 { font-size: clamp(42px, 4.7vw, 92px); }
.studio-facts strong { font-size: clamp(48px, 6vw, 96px); }

.news-text strong { font-size: clamp(22px, 2.5vw, 38px); line-height: 1.18; letter-spacing: -.035em; }
.contact h2 { font-size: clamp(52px, 6.2vw, 110px); line-height: 1.05; letter-spacing: -.045em; }

/* The font does not contain arrow glyphs. Keep those symbols in the system face. */
.circle-link,
.world-arrow,
.scene-label a,
.section-tail span,
.studio-description a span,
.news-arrow,
.contact-bottom a span,
.header-contact span,
.hero-side-note span { font-family: Arial, Helvetica, sans-serif; }

@media (max-width: 800px) {
  .site-nav a { font-family: var(--display-font); font-size: 30px; }
  .hero h1 { font-size: clamp(64px, 11vw, 90px); }
  .section-heading h2 { font-size: clamp(47px, 7.5vw, 75px); }
  .studio h2 { font-size: clamp(50px, 7.8vw, 80px); }
  html[lang="ru"] .studio h2 { font-size: clamp(43px, 6vw, 65px); }
  .contact h2 { font-size: clamp(55px, 8vw, 85px); }
}

@media (max-width: 560px) {
  .site-nav a { font-size: 27px; }
  .hero h1 { font-size: clamp(44px, 10.5vw, 64px); }
  .hero h1 span:last-child { font-size: .55em; }
  .section-heading h2 { font-size: clamp(43px, 9vw, 62px); }
  .world-info h3 { font-size: 26px; }
  .scene-label strong { font-size: 18px; }
  .scene-button strong { font-size: 10px; }
  .studio h2 { font-size: clamp(43px, 9vw, 58px); }
  html[lang="ru"] .studio h2 { font-size: clamp(37px, 8vw, 51px); }
  .studio-facts strong { font-size: 42px; }
  .news-text strong { font-size: 21px; }
  .contact h2 { font-size: clamp(46px, 9vw, 66px); }
}