main {

  width: min(var(--max), calc(100vw - 32px));

  margin: 16px auto 0;

}



.site-header {

  position: sticky;

  top: var(--ticker);

  z-index: 80;

  width: min(var(--max), calc(100vw - 32px));

  min-height: 82px;

  margin: 16px auto 0;

  padding: 0 18px 0 24px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 22px;

  border: 1px solid var(--line);

  border-radius: 999px;

  background: rgba(5, 5, 9, .82);

  backdrop-filter: blur(18px);

  box-shadow: 0 20px 80px rgba(0, 0, 0, .34);

}



.brand {

  display: inline-flex;

  align-items: center;

  flex: 0 0 auto;

  min-width: 0;

}



.brand img {

  height: 58px;

  width: auto;

  display: block;

}



.site-nav {

  display: flex;

  align-items: center;

  justify-content: flex-end;

  gap: 16px;

  min-width: 0;

  font-size: 11px;

  text-transform: uppercase;

  letter-spacing: .1em;

  color: #e7e7ef;

}



.site-nav a:not(.nav-cta) {

  opacity: .78;

}



.site-nav a:hover,

.site-nav button:hover {

  opacity: 1;

  color: var(--purple2);

}



.nav-cta {

  background: linear-gradient(135deg, var(--purple), #6f22d5);

  padding: 13px 18px;

  border-radius: 999px;

  font-weight: 900;

  box-shadow: 0 12px 30px rgba(139, 44, 255, .28);

  white-space: nowrap;

}



.nav-toggle {

  display: none;

}



.language-switcher {

  display: inline-flex;

  align-items: center;

  gap: 6px;

  flex: 0 0 auto;

}



.lang-select {

  background: transparent;

  border: none;

  color: #fff;

  font-weight: 700;

  cursor: pointer;

  outline: none;

}



.lang-btn {

  width: 28px;

  height: 28px;

  border: 0;

  border-radius: 50%;

  background: transparent;

  color: var(--muted);

  cursor: pointer;

  font-size: 10px;

  font-weight: 800;

  letter-spacing: 0;

  text-transform: uppercase;

  transition: .2s ease;

}



.lang-btn.active {

  background: rgba(255, 255, 255, .12);

  color: #fff;

}



.lang-btn:not(:last-child)::after {

  content: none;

}



.section-frame {

  border: 1px solid var(--line);

  border-radius: var(--radius);

  background: rgba(0, 0, 0, .52);

  box-shadow: 0 0 80px rgba(0, 0, 0, .30);

}



.section-pad {

  padding: 88px 0;

}



.split,

.section-head {

  display: grid;

  grid-template-columns: minmax(0, 1fr) minmax(300px, .78fr);

  gap: 52px;

  align-items: end;

}



.hero {

  position: relative;

  min-height: 690px;

  display: grid;

  grid-template-columns: minmax(0, 1fr) minmax(380px, .82fr);

  align-items: center;

  overflow: hidden;

  padding: 58px;

}



.hero::before {

  content: "";

  position: absolute;

  inset: 0;

  background:

    radial-gradient(circle at 69% 16%, rgba(255, 255, 255, .18), transparent 11%),

    radial-gradient(circle at 73% 58%, rgba(139, 44, 255, .20), transparent 32%),

    linear-gradient(90deg, rgba(0, 0, 0, .74), transparent 62%);

  pointer-events: none;

}



.hero-copy {

  position: relative;

  z-index: 3;

  max-width: 700px;

}



.hero-visual {

  position: relative;

  z-index: 2;

  min-height: 560px;

  display: flex;

  align-items: flex-end;

  justify-content: center;

}



.hero-visual img {

  width: min(600px, 100%);

  height: auto;

  object-fit: contain;

  filter: contrast(1.06) saturate(.92);

}



.footer-brand {

  display: inline-flex;

  align-items: center;

}



.footer-brand img {

  height: 52px;

  width: auto;

  display: block;

}