/* First screen only; navigation uses the original site styles. */
/* Shared landing-page typography, matching the new hero heading. */
body.fusion-page {
  --font-display: Inter, Arial, sans-serif;
  --font-ui: Inter, Arial, sans-serif;
  font-family: var(--font-ui);
}
body.fusion-page .server-activity-heading h2 {
  font-family: var(--font-display);
}
body.fusion-page #hero.newsite-hero {
  position: relative;
  isolation: isolate;
  display: block;
  min-height: max(100vh, calc(83.5vh + 24.5vw + 32px));
  align-content: start !important;
  padding: 0 !important;
  overflow: hidden;
  color: #fff;
  font-family: Inter, Arial, sans-serif;
  text-align: center;
}
body.fusion-page #hero .newsite-hero__background {
  position: absolute; inset: -32px; z-index: -1;
  background: linear-gradient(rgba(5, 2, 7, .83), rgba(5, 4, 5, .92)), url('/assets/img/newsite-top/background.png') center / cover;
  filter: blur(18px);
  pointer-events: none;
}
body.fusion-page #hero .newsite-hero__copy {
  position: relative; z-index: 2;
  padding: clamp(145px, 22vh, 235px) 24px 0;
  margin: 0 auto;
  width: min(1200px, 100%);
}
body.fusion-page #hero .newsite-hero__title {
  position: relative;
  isolation: isolate;
  margin: 0 auto;
  max-width: 860px;
  font: 600 clamp(42px, 4vw, 76px)/1.16 Inter, Arial, sans-serif;
  letter-spacing: -.025em;
  color: #fff;
}
body.fusion-page #hero .newsite-hero__title::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 12%; right: 12%; bottom: -15px;
  height: 42px;
  background: radial-gradient(ellipse, rgba(239, 59, 64, .13), transparent 70%);
  filter: blur(18px);
  pointer-events: none;
}
body.fusion-page #hero .newsite-hero__title > span:first-child { color: #ef3b40; }
body.fusion-page #hero .newsite-hero__description {
  margin: 20px 0 0;
  color: #808080;
  font-size: 15px; line-height: 1.45; font-weight: 400;
}
body.fusion-page #hero .newsite-hero__users {
  margin: 12px 0 0; color: #ff383e; font-size: 14px; line-height: 1.4;
}
body.fusion-page #hero .newsite-hero__users .hstat-num {
  font: inherit !important;
  color: #ff383e !important;
  text-shadow: none !important;
}
body.fusion-page #hero .newsite-hero__actions {
  display: flex; justify-content: center; gap: 10px; margin-top: 28px;
}
body.fusion-page #hero .newsite-hero__actions a {
  display: inline-flex; justify-content: center; align-items: center; gap: 10px;
  min-width: 194px; height: 54px; padding: 0 28px; border-radius: 999px;
  font-size: 16px; font-weight: 500; text-decoration: none;
  transition: background-color .25s, border-color .25s, box-shadow .3s;
}
body.fusion-page #hero .newsite-hero__actions > .newsite-hero__buy {
  min-width: 230px;
  color: #fff; background: linear-gradient(100deg, #ed3b40, #df3339);
  box-shadow: 0 15px 24px -10px rgba(239, 59, 64, .3);
}
body.fusion-page #hero .newsite-hero__buy svg {
  width: 18px; height: 18px;
  transition: transform .3s cubic-bezier(.16, 1, .3, 1);
}
body.fusion-page #hero .newsite-hero__actions > .newsite-hero__support {
  min-width: 154px; color: #aaa;
  background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
}
body.fusion-page #hero .newsite-hero__buy:is(:hover, :focus-visible) {
  box-shadow: 0 18px 27px -10px rgba(239, 59, 64, .36);
}
body.fusion-page #hero .newsite-hero__buy:is(:hover, :focus-visible) svg { transform: translateX(5px); }
body.fusion-page #hero .newsite-hero__support:is(:hover, :focus-visible) {
  background-color: rgba(255,255,255,.07);
  border-color: rgba(255,255,255,.16);
}
body.fusion-page #hero a:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
body.fusion-page #hero .newsite-hero__screens { position: absolute; inset: 0; pointer-events: none; }
body.fusion-page #hero .newsite-hero__screen {
  position: absolute; width: 35.6%; height: auto; aspect-ratio: 994 / 619;
  border-radius: 9px; box-shadow: 0 20px 60px rgba(0,0,0,.4);
}
body.fusion-page #hero .newsite-hero__screen--left { left: 2.5%; top: 83vh; transform: rotate(6deg); }
body.fusion-page #hero .newsite-hero__screen--right { right: 2.5%; top: 83vh; transform: rotate(-6deg); }
body.fusion-page #hero .newsite-hero__screen--center { left: 31.5%; top: 83.5vh; z-index: 1; }
/* Keep the reference images clear during the initial stage of the 3D scene. */
body.fusion-page .hero3d:not(.is-3d) .hero3d__blend,
body.fusion-page .hero3d:not(.is-3d) .fx-layer { visibility: hidden; }
html[data-fx-quality="low"] body.fusion-page .hero3d__sticky {
  padding: 0 !important;
}

/* Letters rise independently, while words keep their natural line breaks. */
body.fusion-page #hero .newsite-word { display: inline-block; white-space: nowrap; }
body.fusion-page #hero .newsite-letter { display: inline-block; }
body.fusion-page #hero.newsite-motion-ready .newsite-letter,
body.fusion-page #hero.newsite-motion-ready .newsite-hero__description,
body.fusion-page #hero.newsite-motion-ready .newsite-hero__users,
body.fusion-page #hero.newsite-motion-ready .newsite-hero__actions,
body.fusion-page #hero.newsite-motion-ready .newsite-hero__screen { opacity: 0; }
body.fusion-page #hero.newsite-entering .newsite-letter {
  animation: newsite-letter-rise 650ms cubic-bezier(.16, 1, .3, 1) var(--letter-delay) both;
}
body.fusion-page #hero.newsite-entering .newsite-hero__description {
  animation: newsite-copy-rise 800ms cubic-bezier(.16, 1, .3, 1) 650ms both;
}
body.fusion-page #hero.newsite-entering .newsite-hero__users {
  animation: newsite-copy-rise 800ms cubic-bezier(.16, 1, .3, 1) 750ms both;
}
body.fusion-page #hero.newsite-entering .newsite-hero__actions {
  animation: newsite-copy-rise 800ms cubic-bezier(.16, 1, .3, 1) 850ms both;
}
body.fusion-page #hero.newsite-entering .newsite-hero__screen {
  animation: newsite-screen-rise 1100ms cubic-bezier(.16, 1, .3, 1) 700ms both;
}
body.fusion-page #hero.newsite-entering .newsite-hero__screen--center { animation-delay: 850ms; }
body.fusion-page #hero.newsite-entering .newsite-hero__screen--right { animation-delay: 1000ms; }
@keyframes newsite-letter-rise {
  from { opacity: 0; transform: translateY(.85em); filter: blur(12px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}
@keyframes newsite-copy-rise {
  from { opacity: 0; translate: 0 22px; filter: blur(6px); }
  to { opacity: 1; translate: 0 0; filter: blur(0); }
}
@keyframes newsite-screen-rise {
  from { opacity: 0; translate: 0 85px; }
  to { opacity: 1; translate: 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  body.fusion-page #hero.newsite-motion-ready .newsite-letter,
  body.fusion-page #hero.newsite-motion-ready .newsite-hero__description,
  body.fusion-page #hero.newsite-motion-ready .newsite-hero__users,
  body.fusion-page #hero.newsite-motion-ready .newsite-hero__actions,
  body.fusion-page #hero.newsite-motion-ready .newsite-hero__screen {
    opacity: 1; animation: none; translate: none; filter: none;
  }
  body.fusion-page #hero.newsite-motion-ready .newsite-letter { transform: none; }
}

@media (max-width: 1000px) {
  body.fusion-page #hero .newsite-hero__title { max-width: 800px; }
}
@media (max-width: 600px) {
  body.fusion-page #hero.newsite-hero { min-height: 740px; }
  body.fusion-page #hero .newsite-hero__copy { padding: 125px 18px 0; }
  body.fusion-page #hero .newsite-hero__title { font-size: clamp(30px, 7.4vw, 40px); }
  body.fusion-page #hero .newsite-hero__description { font-size: 13px; line-height: 1.5; }
  body.fusion-page #hero .newsite-hero__actions { gap: 10px; margin-top: 24px; flex-wrap: wrap; }
  body.fusion-page #hero .newsite-hero__actions a { min-width: 0; height: 50px; font-size: 13px; padding: 0 22px; }
  body.fusion-page #hero .newsite-hero__actions > .newsite-hero__buy { min-width: 178px; }
  body.fusion-page #hero .newsite-hero__actions > .newsite-hero__support { min-width: 118px; padding: 0 16px; }
  body.fusion-page #hero .newsite-hero__screen { width: 70%; }
  body.fusion-page #hero .newsite-hero__screen--left { left: -32%; top: 76%; }
  body.fusion-page #hero .newsite-hero__screen--right { right: -32%; top: 76%; }
  body.fusion-page #hero .newsite-hero__screen--center { left: 15%; top: 72%; }
}
@media (max-width: 900px) {
  html body.fusion-page #themeToggle { display: none !important; }
}
