:root {
  --navy: #0b1424;
  --navy-deep: #080e19;
  --cream: #f1ede4;
  --gold: #c8a96c;
  --gold-light: #efd49b;
  --muted: #aab0ba;
  --line: rgba(220, 201, 161, .22);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; color: var(--cream); background: var(--navy); font-family: Arial, Helvetica, sans-serif; -webkit-font-smoothing: antialiased; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
button:focus-visible, a:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 5px; }
::selection { color: var(--navy); background: var(--gold-light); }

.page-shell { overflow: clip; }
.site-header { position: absolute; z-index: 20; top: 0; left: 0; right: 0; display: flex; align-items: center; justify-content: space-between; height: 116px; padding: 0 clamp(26px, 5.5vw, 96px); border-bottom: 1px solid rgba(255,255,255,.1); }
.brand { display: flex; align-items: center; gap: 12px; min-width: 196px; }
.brand img { display: block; width: 80px; height: 50px; object-fit: contain; }
.brand__name { display: flex; flex-direction: column; gap: 3px; padding-left: 12px; border-left: 1px solid rgba(200,169,108,.45); color: var(--cream); font-size: 11px; font-weight: 700; line-height: 1.2; letter-spacing: .25em; }
.brand__name span { color: var(--gold); font-size: 8px; font-weight: 400; letter-spacing: .28em; }
.header-status, .header-link, .eyebrow, .hero__cta, .hero__rail, .hero__side-note, .visual__coordinate, .section-index, .about__soon, .site-footer, .loader__caption, .loader__index { font-size: 10px; font-weight: 700; letter-spacing: .22em; }
.header-status { display: flex; align-items: center; gap: 13px; color: var(--muted); }
.header-status__dot, .about__soon-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 12px var(--gold); animation: pulse 2s ease-in-out infinite; }
.header-link { display: flex; align-items: center; gap: 27px; color: var(--cream); transition: color .25s; }
.header-link span { color: var(--gold); font-size: 20px; font-weight: 400; line-height: 1; transition: transform .25s; }
.header-link:hover { color: var(--gold-light); }
.header-link:hover span { transform: translate(3px, -3px); }

.hero { position: relative; min-height: min(930px, 100svh); min-height: max(760px, 100svh); display: flex; align-items: center; background: radial-gradient(circle at 77% 47%, #1c2c43 0, #111e31 24%, var(--navy) 55%, var(--navy-deep) 100%); isolation: isolate; }
.hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, transparent 0 49.95%, rgba(226,203,160,.08) 50%, transparent 50.05%), linear-gradient(0deg, transparent 0 49.95%, rgba(226,203,160,.05) 50%, transparent 50.05%); background-size: 19.5vw 100%, 100% 220px; opacity: .65; }
.hero__grain { position: absolute; inset: 0; z-index: -1; opacity: .12; pointer-events: none; background-image: radial-gradient(rgba(229,207,162,.24) .55px, transparent .75px); background-size: 4px 4px; }
.hero__grid { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 50% 50%, transparent 0 35%, rgba(5,10,19,.28) 85%); }
.hero__container { position: relative; z-index: 2; width: min(100% - 11vw, 1480px); min-height: 650px; margin: 116px auto 70px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(430px, .92fr); align-items: center; }
.hero__copy { position: relative; z-index: 2; padding-bottom: 28px; }
.eyebrow { display: flex; align-items: center; gap: 13px; color: var(--gold-light); white-space: nowrap; }
.eyebrow__rule { display: inline-block; width: 30px; height: 1px; background: var(--gold); }
.eyebrow__number { margin-left: 10px; color: #7d8794; }
h1, h2 { margin: 0; font-family: Georgia, 'Times New Roman', serif; font-weight: 400; }
.hero h1 { margin: 26px 0 27px -6px; font-size: clamp(76px, 8.2vw, 148px); line-height: .91; letter-spacing: -.065em; }
.hero h1 em, .about h2 em { color: var(--gold-light); font-weight: 400; }
.hero__period { color: var(--gold); }
.hero__description { max-width: 455px; margin: 0 0 42px; color: #b7bdc7; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(17px, 1.4vw, 21px); line-height: 1.65; }
.hero__cta { display: inline-flex; align-items: center; justify-content: space-between; gap: 38px; min-width: 258px; padding: 9px 9px 9px 23px; border: 1px solid rgba(200,169,108,.6); color: var(--cream); transition: background .3s, color .3s, border-color .3s; }
.hero__cta:hover { color: var(--navy); background: var(--gold-light); border-color: var(--gold-light); }
.hero__cta-arrow { display: grid; place-items: center; width: 36px; height: 36px; background: var(--gold); color: var(--navy); font-size: 23px; font-weight: 400; line-height: 1; transition: background .3s, transform .3s; }
.hero__cta:hover .hero__cta-arrow { background: var(--navy); color: var(--gold-light); transform: rotate(45deg); }
.hero__rail { position: absolute; z-index: 3; bottom: 36px; left: 5.5vw; display: flex; align-items: center; gap: 20px; color: #b2b7bf; }
.hero__rail-line { width: 86px; height: 1px; background: rgba(200,169,108,.5); }
.hero__rail span:last-child { color: var(--gold); }
.hero__side-note { position: absolute; right: 22px; top: 48%; color: #8f99a7; writing-mode: vertical-rl; }
.hero__side-note span { margin: 12px 0; color: var(--gold); }

.visual { position: relative; width: min(50vw, 690px); aspect-ratio: 1; margin-left: -5%; transform: translate3d(var(--visual-x, 0px), var(--visual-y, 0px), 0); transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.visual__halo { position: absolute; inset: 5%; border-radius: 50%; pointer-events: none; }
.visual__halo--one { background: radial-gradient(circle, transparent 25%, rgba(201,167,102,.09) 47%, transparent 67%); filter: blur(7px); }
.visual__halo--two { inset: 0; border: 1px solid rgba(210,177,115,.11); box-shadow: 0 0 60px rgba(174,138,71,.07), inset 0 0 100px rgba(174,138,71,.035); }
.visual__orbit { position: absolute; inset: 5%; border: 1px solid rgba(203,172,112,.23); border-radius: 50%; }
.visual__orbit--one { transform: rotate(-28deg) scaleY(.49); box-shadow: 0 0 22px rgba(200,169,108,.1); animation: orbit-one 19s linear infinite; }
.visual__orbit--one::after, .visual__orbit--two::after { content: ""; position: absolute; top: calc(50% - 5px); left: -5px; width: 10px; height: 10px; border-radius: 50%; background: var(--gold-light); box-shadow: 0 0 19px 5px rgba(239,212,155,.5); }
.visual__orbit--two { inset: 12%; transform: rotate(55deg) scaleY(.46); border-color: rgba(207,180,126,.14); animation: orbit-two 23s linear infinite; }
.visual__orbit--two::after { width: 6px; height: 6px; top: calc(50% - 3px); left: -3px; }
.visual__core { position: absolute; inset: 19%; border: 1px solid rgba(237,207,145,.45); border-radius: 50%; overflow: hidden; transform: rotate(-17deg); background: radial-gradient(circle at 34% 25%, rgba(216,190,132,.17), transparent 43%), radial-gradient(circle at 70% 80%, rgba(195,157,90,.16), transparent 36%), linear-gradient(125deg, #121f31 0%, #192b42 45%, #0d1729 100%); box-shadow: inset -34px -22px 65px rgba(0,0,0,.6), inset 15px 12px 30px rgba(250,220,150,.08), 0 0 0 14px rgba(196,161,96,.035), 0 0 90px rgba(191,157,92,.13); animation: core-breathe 6s ease-in-out infinite; }
.visual__core::before, .visual__core::after { content: ""; position: absolute; inset: 5%; border: 1px solid rgba(203,176,124,.15); border-radius: 50%; }
.visual__core::after { inset: 16%; border-color: rgba(203,176,124,.1); }
.visual__longitude { position: absolute; z-index: 2; top: -1%; bottom: -1%; left: 25%; width: 50%; border: 1px solid rgba(223,190,128,.24); border-radius: 50%; }
.visual__longitude--two { left: 43%; width: 14%; border-color: rgba(223,190,128,.18); }
.visual__latitude { position: absolute; z-index: 2; left: -2%; width: 104%; height: 25%; border: 1px solid rgba(223,190,128,.24); border-radius: 50%; }
.visual__latitude--one { top: 24%; }
.visual__latitude--two { top: 40%; height: 20%; }
.visual__latitude--three { top: 53%; }
.visual__shine { position: absolute; z-index: 3; inset: 0; border-radius: 50%; background: linear-gradient(110deg, transparent 37%, rgba(240,216,165,.11) 48%, transparent 56%); transform: translateX(-100%); animation: globe-shine 9s ease-in-out infinite; }
.visual__coordinate { position: absolute; color: var(--gold-light); font-size: 9px; font-weight: 400; line-height: 2; letter-spacing: .2em; }
.visual__coordinate--top { top: 7%; right: 10%; }
.visual__coordinate--bottom { bottom: 13%; left: 1%; color: #a3adbb; }
.visual__spark { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: var(--gold-light); box-shadow: 0 0 12px 3px rgba(239,212,155,.45); animation: twinkle 3.6s ease-in-out infinite; }
.visual__spark--one { top: 23%; left: 16%; }
.visual__spark--two { right: 10%; bottom: 29%; animation-delay: 1.3s; }
.visual__spark--three { top: 18%; right: 32%; animation-delay: 2.1s; }
.visual__cursor { position: absolute; z-index: 5; width: 120px; height: 120px; left: var(--cursor-x, 50%); top: var(--cursor-y, 50%); pointer-events: none; border-radius: 50%; background: radial-gradient(circle, rgba(237,207,145,.16), transparent 68%); opacity: 0; transform: translate(-50%, -50%); transition: opacity .3s; }
.visual:hover .visual__cursor { opacity: 1; }

.about { position: relative; min-height: 590px; padding: 72px clamp(26px, 5.5vw, 96px) 100px; overflow: hidden; background: #f0ede6; color: var(--navy); }
.about__top { display: flex; align-items: center; justify-content: space-between; padding-bottom: 33px; border-bottom: 1px solid rgba(11,20,36,.18); }
.section-index { color: #716a5c; }
.about__star { color: #ae8d50; font-size: 34px; line-height: 1; }
.about__body { position: relative; z-index: 2; display: grid; grid-template-columns: 1.25fr .75fr; gap: 7vw; align-items: end; width: min(100%, 1450px); margin: 78px auto 0; }
.about h2 { font-size: clamp(62px, 7.1vw, 118px); line-height: .99; letter-spacing: -.066em; }
.about h2 em { color: #a58349; }
.about__details { padding-bottom: 12px; }
.about__rule { display: block; width: 58px; height: 1px; background: #a58349; }
.about__details p { max-width: 380px; margin: 26px 0 38px; color: #555d65; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(18px, 1.6vw, 23px); line-height: 1.55; }
.about__soon { display: inline-flex; align-items: center; gap: 13px; color: #554a36; }
.about__soon-dot { width: 7px; height: 7px; background: #ac8951; box-shadow: 0 0 12px rgba(172,137,81,.4); }
.about__watermark { position: absolute; right: -1%; bottom: -9%; color: rgba(14,27,45,.045); font-family: Georgia, 'Times New Roman', serif; font-size: clamp(190px, 28vw, 460px); letter-spacing: -.09em; line-height: 1; white-space: nowrap; pointer-events: none; }

.site-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 104px; padding: 20px clamp(26px, 5.5vw, 96px); color: #a9afb8; background: var(--navy-deep); font-size: 9px; }
.site-footer__middle { color: var(--gold); }
.motion-toggle { display: inline-flex; align-items: center; gap: 10px; padding: 10px 0 10px 10px; border: 0; background: none; color: #bbc0c9; cursor: pointer; font-size: inherit; font-weight: 700; letter-spacing: inherit; }
.motion-toggle[hidden] { display: none; }
.motion-toggle:hover { color: var(--gold-light); }
.motion-toggle__icon { color: var(--gold); font-size: 14px; line-height: 0; }

.loader { position: fixed; z-index: 100; inset: 0; display: none; place-items: center; color: var(--gold-light); background: var(--navy-deep); pointer-events: none; }
.js .loader { display: grid; }
.js.is-ready .loader { animation: loader-out .6s .1s forwards; }
.loader__content { display: flex; flex-direction: column; align-items: center; width: min(320px, 75vw); }
.loader__mark { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(52px, 11vw, 84px); line-height: 1; letter-spacing: .19em; }
.loader__orbit { display: inline-block; margin: 0 -.14em 0 -.04em; color: var(--gold); animation: loader-orbit 1.1s ease-in-out infinite; }
.loader__line { display: block; width: 100%; height: 1px; margin: 29px 0 22px; background: rgba(200,169,108,.25); overflow: hidden; }
.loader__line span { display: block; height: 100%; background: var(--gold-light); transform-origin: left; animation: loader-progress 2.4s cubic-bezier(.2,.7,.2,1) forwards; }
.loader__caption { color: #8f9aab; font-size: 8px; white-space: nowrap; }
.loader__index { position: absolute; right: 5.5vw; bottom: 38px; font-size: 10px; }
.js:not(.is-ready) .page-shell { opacity: 0; }
.js.is-ready .page-shell { animation: page-in .8s ease-out both; }

.is-paused *, .is-paused *::before, .is-paused *::after { animation-play-state: paused !important; scroll-behavior: auto !important; }

@keyframes pulse { 50% { opacity: .35; box-shadow: 0 0 3px var(--gold); } }
@keyframes orbit-one { 50% { transform: rotate(152deg) scaleY(.49); } 100% { transform: rotate(332deg) scaleY(.49); } }
@keyframes orbit-two { 50% { transform: rotate(-125deg) scaleY(.46); } 100% { transform: rotate(-305deg) scaleY(.46); } }
@keyframes core-breathe { 50% { box-shadow: inset -34px -22px 65px rgba(0,0,0,.6), inset 15px 12px 30px rgba(250,220,150,.12), 0 0 0 14px rgba(196,161,96,.05), 0 0 110px rgba(191,157,92,.24); } }
@keyframes globe-shine { 0%, 25% { transform: translateX(-100%); } 55%, 100% { transform: translateX(100%); } }
@keyframes twinkle { 50% { opacity: .25; transform: scale(.5); } }
@keyframes loader-orbit { 50% { transform: rotate(90deg) scale(.8); opacity: .65; } }
@keyframes loader-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes loader-out { to { opacity: 0; visibility: hidden; } }
@keyframes page-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 1100px) {
  .hero__container { grid-template-columns: minmax(0, 1fr) minmax(340px, .8fr); }
  .hero h1 { font-size: clamp(68px, 8.5vw, 105px); }
  .visual { width: min(52vw, 590px); margin-left: -10%; }
  .hero__side-note { display: none; }
}

@media (max-width: 760px) {
  .site-header { height: 82px; padding: 0 23px; }
  .brand { min-width: 0; gap: 8px; }
  .brand img { width: 65px; height: 42px; }
  .brand__name { font-size: 9px; padding-left: 9px; }
  .brand__name span { font-size: 7px; }
  .header-status { display: none; }
  .header-link { gap: 9px; font-size: 9px; }
  .hero { min-height: 920px; min-height: max(850px, 100svh); }
  .hero__container { display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; width: calc(100% - 46px); min-height: 0; margin: 144px auto 105px; }
  .hero__copy { padding: 0; }
  .eyebrow { font-size: 9px; letter-spacing: .16em; }
  .eyebrow__rule { width: 20px; }
  .hero h1 { margin: 24px 0 22px -3px; font-size: clamp(68px, 15vw, 113px); }
  .hero__description { max-width: 430px; margin-bottom: 27px; font-size: 17px; }
  .hero__cta { min-width: 235px; font-size: 9px; }
  .visual { width: min(86vw, 520px); align-self: center; margin: -7px 0 -50px; }
  .visual__coordinate { font-size: 8px; }
  .hero__rail { bottom: 29px; left: 23px; font-size: 9px; }
  .hero__rail-line { width: 48px; }
  .about { min-height: 0; padding: 58px 23px 115px; }
  .about__body { display: block; margin-top: 63px; }
  .about h2 { font-size: clamp(58px, 12vw, 96px); }
  .about__details { margin-top: 49px; }
  .about__details p { max-width: 530px; }
  .about__watermark { bottom: -3%; }
  .site-footer { flex-wrap: wrap; min-height: 130px; padding: 27px 23px; }
  .site-footer__middle { display: none; }
}

@media (max-width: 440px) {
  .hero { min-height: 800px; }
  .hero__container { margin-top: 132px; }
  .hero h1 { font-size: clamp(63px, 15.8vw, 76px); }
  .hero__description { font-size: 15px; }
  .visual { width: 91vw; margin-top: 5px; }
  .hero__rail { gap: 11px; letter-spacing: .14em; }
  .hero__rail-line { width: 34px; }
  .about h2 { font-size: clamp(52px, 12.5vw, 62px); }
  .site-footer { font-size: 8px; letter-spacing: .12em; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .js .loader { display: none; }
  .js:not(.is-ready) .page-shell { opacity: 1; }
}