:root {
  color-scheme:dark;
  --bg:#0b0d0e;
  --surface:#121516;
  --text:#f3f0e9;
  --muted:#a5a6a3;
  --accent:#dfc5a1;
  --line:#ffffff1c;
  --font:Arial,Helvetica,sans-serif;
  --serif:Georgia,'Times New Roman',serif;
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:32px;
}

body {
  margin:0;
  background:var(--bg);
  color:var(--text);
  font:16px/1.6 var(--font);
  -webkit-font-smoothing:antialiased;
}

a {
  color:inherit;
  text-decoration:none;
}

button {
  font:inherit;
}

button,a,summary {
  -webkit-tap-highlight-color:transparent;
}

a,button,summary {
  touch-action:manipulation;
}

a:focus-visible,button:focus-visible,summary:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:6px;
}

::selection {
  background:var(--accent);
  color:var(--bg);
}

.wrap {
  width:min(1280px,calc(100% - 112px));
  margin-inline:auto;
}

.skip {
  position:fixed;
  top:16px;
  left:16px;
  z-index:20;
  background:var(--accent);
  color:var(--bg);
  padding:12px 24px;
  transform:translateY(-180%);
}

.skip:focus {
  transform:none;
}

.header {
  height:110px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  position:relative;
  z-index:2;
  border-bottom:1px solid var(--line);
}

.brand {
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-size:33px;
  font-weight:700;
  letter-spacing:-1.8px;
  line-height:1.4;
  min-height:44px;
}

.brand svg {
  width:29px;
  height:29px;
  color:var(--accent);
  margin-right:2px;
}

.brand-dot {
  color:var(--accent);
}

nav {
  display:flex;
  gap:36px;
  margin-left:80px;
}

nav a {
  color:#c0c0ba;
  font-size:13px;
  min-height:44px;
  display:flex;
  align-items:center;
  transition:color .2s;
}

nav a:hover,.back-top:hover {
  color:var(--accent);
}

.header-end {
  display:flex;
  align-items:center;
  gap:30px;
}

.languages {
  display:flex;
  align-items:center;
  gap:2px;
  font-size:12px;
  color:#787b78;
}

.languages button {
  background:none;
  border:0;
  color:var(--muted);
  min-width:44px;
  min-height:44px;
  cursor:pointer;
  transition:color .2s;
}

.languages button[aria-pressed=true] {
  color:var(--text);
}

.languages button:hover {
  color:var(--accent);
}

.launch-label {
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:12px;
  letter-spacing:.04em;
}

.launch-label i,.art-label i {
  height:6px;
  width:6px;
  display:inline-block;
  background:var(--accent);
  border-radius:50%;
  box-shadow:0 0 12px #dfc5a140;
}

.hero {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:780px;
}

.hero-content {
  position:relative;
  z-index:1;
  padding-top:99px;
}

.eyebrow {
  font-size:10px;
  font-weight:500;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--accent);
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 27px;
}

.small-line {
  width:26px;
  height:1px;
  background:var(--accent);
}

h1 {
  font-size:clamp(64px,6.8vw,100px);
  line-height:1.04;
  font-weight:400;
  letter-spacing:-5px;
  margin:0 0 29px;
}

em {
  font-family:var(--serif);
  font-weight:400;
  color:var(--accent);
}

.hero-copy {
  max-width:380px;
  font-size:15px;
  color:var(--muted);
  line-height:1.85;
  margin:0 0 32px;
}

.button {
  min-height:54px;
  padding:0 23px;
  display:inline-flex;
  align-items:center;
  gap:35px;
  border-radius:3px;
  background:var(--accent);
  color:#171818;
  font-size:12px;
  font-weight:600;
  transition:background .2s,transform .2s;
}

.button:hover {
  background:#f0d9b8;
  transform:translateY(-2px);
}

.button span:last-child {
  font-size:23px;
  font-weight:400;
}

.hero-note {
  margin-top:22px;
  color:var(--muted);
  font-size:11px;
  display:flex;
  align-items:center;
  gap:10px;
}

.signal {
  display:flex;
  align-items:center;
  height:15px;
  gap:3px;
}

.signal b {
  display:block;
  width:2px;
  height:5px;
  background:var(--accent);
}

.signal b:nth-child(2) {
  height:12px;
}

.signal b:nth-child(3) {
  height:8px;
}

.hero-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:relative;
  margin-top:90px;
  padding-bottom:28px;
  font-size:10px;
  color:var(--muted);
  letter-spacing:.08em;
}

.scroll-note {
  display:flex;
  align-items:center;
  gap:20px;
}

.scroll-note span:last-child {
  font-size:21px;
  color:var(--accent);
}

.edition {
  font-size:9px;
  letter-spacing:.16em;
}

.hero-art {
  position:absolute;
  inset:0;
  z-index:-1;
  overflow:hidden;
  background:radial-gradient(ellipse at 85% 42%,#22333060,transparent 52%);
}

.planet {
  position:absolute;
  width:660px;
  height:660px;
  right:-45px;
  top:90px;
  border-radius:50%;
  background:radial-gradient(circle at 29% 19%,#8a9c9130,transparent 35%),radial-gradient(circle at 10% 12%,#0f1718 20%,#0a0e10 58%,#060808 75%);
  box-shadow:-14px -12px 50px #a0ad9633,-2px -3px 2px #e9d2ab,0 0 90px #c1b69912,inset 0 0 70px #000;
  transform:rotate(-28deg);
}

.planet:after {
  content:'';
  position:absolute;
  inset:0;
  border-radius:50%;
  background:repeating-linear-gradient(165deg,transparent 0 3px,#94aa9810 4px,transparent 5px 9px);
  opacity:.3;
}

.horizon {
  position:absolute;
  top:287px;
  right:-180px;
  width:1050px;
  height:240px;
  border-radius:50%;
  border-top:2px solid #e9caa58c;
  box-shadow:0 -5px 20px #efd0a333,0 -24px 65px #cfb28f16;
  transform:rotate(-37deg);
  mask-image:linear-gradient(90deg,transparent,#000 35%,#000 85%,transparent);
}

.orbit {
  position:absolute;
  border:1px solid #cab78c19;
  border-radius:50%;
  width:1050px;
  height:550px;
  right:-280px;
  top:50px;
  transform:rotate(-37deg);
}

.orbit-two {
  width:1190px;
  height:690px;
  right:-360px;
  top:-20px;
}

.star {
  position:absolute;
  width:3px;
  height:3px;
  border-radius:50%;
  background:#ddc9a9;
  box-shadow:0 0 12px #dfc5a1;
}

.star-one {
  right:35%;
  top:83px;
}

.star-two {
  right:8%;
  top:110px;
}

.star-three {
  right:43%;
  top:430px;
}

.hero-art:after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,var(--bg) 0%,transparent 62%),linear-gradient(0deg,var(--bg),transparent 27%);
}

.vision {
  padding-top:77px;
  padding-bottom:85px;
  border-top:1px solid var(--line);
}

.section-top {
  display:flex;
  justify-content:space-between;
  align-items:baseline;
}

.section-aside {
  font-size:11px;
  color:var(--muted);
}

.vision-intro {
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:90px;
  align-items:center;
  margin-bottom:46px;
}

h2 {
  font-size:clamp(32px,3.5vw,49px);
  font-weight:400;
  letter-spacing:-1.8px;
  line-height:1.2;
  margin:0;
}

.muted {
  color:var(--muted);
}

.vision-intro p {
  font-size:14px;
  color:var(--muted);
  max-width:390px;
  line-height:1.9;
}

.cards {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}

.story-card {
  border:1px solid var(--line);
  border-radius:5px;
  overflow:hidden;
  background:var(--surface);
}

.card-art {
  height:236px;
  position:relative;
  overflow:hidden;
}

.card-copy {
  padding:28px 27px 31px;
}

.card-number {
  font-size:10px;
  letter-spacing:.12em;
  color:var(--accent);
}

h3 {
  font-size:20px;
  line-height:1.4;
  font-weight:400;
  letter-spacing:-.5px;
  margin:12px 0;
}

.card-copy p {
  font-size:13px;
  color:var(--muted);
  line-height:1.8;
  margin:0;
  max-width:300px;
}

.world-art {
  background:radial-gradient(ellipse at 50% 105%,#79847677,#243630 48%,#111b19 100%);
}

.globe {
  width:240px;
  height:240px;
  border:1px solid #b3c6b18c;
  border-radius:50%;
  position:absolute;
  left:50%;
  top:32px;
  transform:translateX(-50%) rotate(-25deg);
  box-shadow:0 0 55px #b0d1b310,inset 12px 0 40px #d2e6c510;
  background:repeating-linear-gradient(0deg,transparent 0 37px,#c6d7bd45 38px,transparent 39px);
}

.globe:before,.globe:after,.globe i {
  content:'';
  position:absolute;
  inset:0 55px;
  border:1px solid #c6d7bd55;
  border-radius:50%;
}

.globe:after {
  inset:0 95px;
}

.globe i:nth-child(1) {
  inset:55px 0;
}

.globe i:nth-child(2) {
  inset:93px 0;
}

.globe i:nth-child(3) {
  inset:0 22px;
}

.coordinate {
  position:absolute;
  bottom:20px;
  left:22px;
  color:#d7dfd2;
  font-size:9px;
  letter-spacing:.13em;
}

.live-art {
  background:linear-gradient(#33343c,#b58672 75%,#bda28c);
}

.live-sun {
  position:absolute;
  width:73px;
  height:73px;
  background:#f0c6a0;
  border-radius:50%;
  left:58%;
  top:46px;
  box-shadow:0 0 60px #ebb59177;
}

.ridge {
  position:absolute;
  inset:80px -10px -1px;
  background:#484b4b;
  clip-path:polygon(0 63%,15% 38%,27% 48%,43% 17%,56% 36%,64% 26%,80% 54%,100% 40%,100% 100%,0 100%);
}

.ridge-front {
  inset:115px -10px -1px;
  background:#202c2b;
  clip-path:polygon(0 42%,20% 69%,36% 52%,55% 79%,76% 43%,88% 28%,100% 40%,100% 100%,0 100%);
}

.art-label {
  position:absolute;
  left:22px;
  bottom:19px;
  font-size:8px;
  letter-spacing:.18em;
  color:#eee9df;
  display:flex;
  gap:8px;
  align-items:center;
}

.simple-art {
  background:radial-gradient(ellipse at 80% 25%,#6a6055,#302d2a 43%,#191c1d);
}

.screen-frame {
  width:217px;
  height:135px;
  border:1px solid #d5c0a373;
  border-radius:6px;
  background:linear-gradient(135deg,#1b2222,#0a0e10);
  position:absolute;
  top:42px;
  left:50%;
  transform:translateX(-50%) perspective(600px) rotateY(-15deg) rotateZ(-7deg);
  box-shadow:20px 20px 35px #0006;
  padding:24px;
}

.screen-mark {
  display:block;
  font-size:43px;
  letter-spacing:-5px;
  font-family:var(--serif);
  color:var(--accent);
  line-height:1;
}

.screen-line {
  height:3px;
  background:#c9b89d55;
  width:70%;
  margin-top:20px;
}

.screen-line.short {
  width:40%;
  margin-top:7px;
}

.art-caption {
  font-size:10px;
  color:var(--muted);
  margin-top:20px;
  text-align:right;
}

.manifesto {
  border-block:1px solid var(--line);
  background:#101313;
}

.manifesto-inner {
  text-align:center;
  padding-block:74px;
}

.spark {
  font-size:35px;
  color:var(--accent);
}

.manifesto p {
  font-size:clamp(31px,4.1vw,57px);
  line-height:1.25;
  letter-spacing:-1.6px;
  margin:22px 0 28px;
}

.manifesto .eyebrow {
  justify-content:center;
  font-size:9px;
  margin:0;
  color:var(--muted);
}

.questions {
  padding-block:100px;
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:80px;
}

.questions-heading p:last-child {
  font-size:14px;
  color:var(--muted);
  margin-top:20px;
}

.questions-heading h2 {
  font-size:39px;
}

.accordions {
  border-top:1px solid var(--line);
}

details {
  border-bottom:1px solid var(--line);
}

summary {
  list-style:none;
  display:flex;
  justify-content:space-between;
  gap:24px;
  cursor:pointer;
  padding:23px 0;
  font-size:14px;
  transition:color .2s;
}

summary::-webkit-details-marker {
  display:none;
}

summary:hover {
  color:var(--accent);
}

summary>span:last-child {
  font-size:20px;
  color:var(--accent);
  line-height:1;
  transition:transform .2s;
}

details[open] summary>span:last-child {
  transform:rotate(45deg);
}

details p {
  color:var(--muted);
  font-size:13px;
  line-height:1.9;
  margin:0 30px 24px 0;
}

.closing {
  text-align:center;
  border-top:1px solid var(--line);
  padding-block:72px 85px;
  background:radial-gradient(ellipse at 50% 100%,#dac4a00a,transparent 65%);
}

.closing h2 {
  font-size:clamp(35px,4.5vw,62px);
  margin:26px 0;
}

.closing p {
  font-size:13px;
  color:var(--muted);
  margin:0 auto 26px;
  max-width:440px;
}

.back-top {
  display:inline-flex;
  align-items:center;
  gap:24px;
  min-height:44px;
  font-size:11px;
  border-bottom:1px solid #dfc5a15c;
  transition:color .2s;
}

.footer {
  border-top:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  padding-block:28px;
  color:var(--muted);
  font-size:10px;
}

.footer .brand {
  font-size:26px;
  color:var(--text);
  gap:0;
}

.footer-note {
  font-size:9px;
}

html[lang=hi] h1 {
  font-size:clamp(54px,6.2vw,85px);
  line-height:1.25;
  letter-spacing:-2px;
}

html[lang=hi] em {
  font-style:normal;
}

html[lang=hi] .eyebrow {
  letter-spacing:.06em;
}

html[lang=hi] h2 {
  line-height:1.4;
  letter-spacing:-1px;
}

@media(min-width:1600px) {
  .planet {
    right:calc((100vw - 1440px)/2 - 45px);
  }
  .horizon {
    right:calc((100vw - 1440px)/2 - 180px);
  }
}

@media(max-width:1100px) {
  .wrap {
    width:calc(100% - 72px);
  }
  nav {
    margin-left:0;
    gap:24px;
  }
  .header-end {
    gap:16px;
  }
  .planet {
    right:-210px;
    opacity:.8;
  }
  .horizon {
    right:-340px;
  }
  .hero-art:after {
    background:linear-gradient(90deg,var(--bg),transparent 100%),linear-gradient(0deg,var(--bg),transparent 30%);
  }
  .vision-intro {
    gap:40px;
  }
  .cards {
    gap:16px;
  }
  .card-copy {
    padding:24px 20px;
  }
  .questions {
    gap:45px;
  }
  .footer-note {
    display:none;
  }
}

@media(max-width:760px) {
  .wrap {
    width:calc(100% - 40px);
  }
  .header {
    height:84px;
    gap:12px;
  }
  .header nav,.header .launch-label {
    display:none;
  }
  .brand {
    font-size:29px;
  }
  .brand svg {
    width:25px;
  }
  .hero {
    min-height:760px;
  }
  .hero-content {
    padding-top:70px;
  }
  h1 {
    font-size:clamp(48px,16vw,65px);
    letter-spacing:-3px;
  }
  .hero-copy {
    max-width:325px;
    font-size:14px;
  }
  .eyebrow {
    font-size:9px;
  }
  .planet {
    width:480px;
    height:480px;
    right:-240px;
    top:200px;
    opacity:.6;
  }
  .horizon {
    right:-570px;
    top:350px;
    opacity:.5;
  }
  .orbit {
    right:-650px;
  }
  .orbit-two {
    right:-700px;
  }
  .hero-art:after {
    background:linear-gradient(90deg,#0b0d0e88,transparent),linear-gradient(0deg,var(--bg),transparent 45%);
  }
  .hero-bottom {
    margin-top:100px;
  }
  .edition {
    display:none;
  }
  .hero-bottom {
    font-size:9px;
  }
  .vision {
    padding-block:50px;
  }
  .section-aside {
    display:none;
  }
  .vision-intro {
    grid-template-columns:1fr;
    gap:12px;
    margin-bottom:30px;
  }
  h2 {
    font-size:34px;
  }
  .vision-intro p {
    font-size:14px;
    max-width:480px;
  }
  .cards {
    grid-template-columns:1fr;
    gap:22px;
  }
  .card-art {
    height:245px;
  }
  .card-copy {
    padding:24px;
  }
  .card-copy p {
    max-width:none;
  }
  .card-copy h3 {
    font-size:23px;
  }
  .art-caption {
    text-align:left;
    font-size:10px;
  }
  .manifesto-inner {
    padding-block:58px;
  }
  .manifesto p {
    letter-spacing:-1px;
  }
  .questions {
    padding-block:62px;
    grid-template-columns:1fr;
    gap:26px;
  }
  .questions-heading h2 {
    font-size:34px;
  }
  .questions-heading .eyebrow {
    margin-bottom:18px;
  }
  .closing {
    padding-block:55px 60px;
  }
  .closing h2 {
    font-size:36px;
    letter-spacing:-1.4px;
  }
  .footer {
    flex-wrap:wrap;
    gap:12px;
    padding-block:24px;
  }
  .footer>span {
    max-width:210px;
    text-align:right;
  }
  html[lang=hi] h1 {
    font-size:54px;
  }
  .hero-note {
    font-size:10px;
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*:before,*:after {
    transition:none!important;
    animation:none!important;
  }
}

