/* ===== Motion layer: everything here degrades to a static page without JS ===== */

/* hide hero pieces only while the motion script is booting (html.motion is removed after 3s if JS fails) */
.motion .hero-title,.motion .hero .lead,.motion .hero-actions,.motion .hero-facts,.motion .admit-pill,.motion .scroll-cue{opacity:0}
.motion .page-hero h1,.motion .page-hero .lead,.motion .page-hero .crumbs{opacity:0}

/* scroll progress */
.progress{position:fixed;left:0;top:0;height:3px;width:100%;background:var(--lagoon);transform-origin:0 50%;transform:scaleX(0);z-index:120;pointer-events:none}

/* page transition */
.pt{position:fixed;inset:0;z-index:300;pointer-events:none}
.pt-panel{position:absolute;inset:-2px 0;background:var(--gulf);transform:translateY(102%);display:grid;place-items:center}
.pt-in .pt-panel{transform:translateY(0)}
.pt-mark{font-family:var(--display);color:#fff;font-size:clamp(1.6rem,3vw,2.4rem);display:flex;flex-direction:column;align-items:center;gap:14px}
.pt-mark svg{width:56px;height:70px}

/* intro */
.intro{position:fixed;inset:0;z-index:310;background:var(--gulf-2);display:none;place-items:center;color:#fff}
.first-visit .intro{display:grid}
.intro-inner{display:flex;flex-direction:column;align-items:center;gap:22px}
.intro svg{width:120px;height:150px;overflow:visible}
.intro svg path{fill:none;stroke:var(--saffron);stroke-width:2}
.intro-ar{font-family:var(--display);font-size:clamp(2rem,5vw,3.4rem);line-height:1}
.intro-en{font-size:.95rem;letter-spacing:.06em;color:#A2B4DC}

/* cursor */
.cursor{position:fixed;left:0;top:0;width:38px;height:38px;margin:-19px 0 0 -19px;border:1.5px solid var(--lagoon);border-radius:50%;pointer-events:none;z-index:400;opacity:0;display:grid;place-items:center;transition:width .25s,height .25s,margin .25s,background .25s,opacity .3s;mix-blend-mode:normal}
.cursor span{font-size:.72rem;font-weight:500;color:var(--ink);opacity:0;transition:opacity .2s}
.cursor.is-link{width:56px;height:56px;margin:-28px 0 0 -28px;background:rgba(156,198,245,.18)}
.cursor.is-view{width:84px;height:84px;margin:-42px 0 0 -42px;background:var(--gulf);border-color:var(--gulf)}
.cursor.is-view span{color:#fff}
.cursor.is-view span{opacity:1}
@media (pointer:coarse){.cursor{display:none}}

/* hero (home) upgrade */
.hero{min-height:100svh}
.hero-media{will-change:clip-path}
.hero-media img{transform-origin:50% 40%}
.hero .arches{position:absolute;right:-6%;bottom:-10%;width:min(60vw,820px);height:auto;z-index:-1;opacity:.35;pointer-events:none}
.arches path{fill:none;stroke:rgba(255,255,255,.35);stroke-width:1}
.hero .hero-title{font-size:clamp(2.8rem,7vw,6.4rem);line-height:.98;letter-spacing:-.02em;max-width:none}
.scroll-cue{position:absolute;right:20px;bottom:40px;display:flex;align-items:center;gap:12px;font-size:.85rem;color:#BCCBEA;writing-mode:vertical-rl}
.scroll-cue i{display:block;width:1.5px;height:64px;background:linear-gradient(var(--saffron),transparent);animation:cue 2s ease-in-out infinite;transform-origin:top}
@keyframes cue{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
@media (max-width:760px){.scroll-cue{display:none}}

/* marquee */
.marquee{overflow:hidden;background:var(--gulf-2);color:#fff;padding-block:26px;border-block:1px solid rgba(255,255,255,.08)}
.marquee-track{display:flex;width:max-content;animation:marq 38s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-track span{font-family:var(--display);font-weight:600;font-size:clamp(2rem,5vw,4.2rem);line-height:1;padding-inline:28px;display:flex;align-items:center;gap:56px;white-space:nowrap}
.marquee-track span.o{color:transparent;-webkit-text-stroke:1.2px rgba(255,255,255,.55)}
.marquee-track svg{width:28px;height:36px;flex:none}
.marquee-track svg path{fill:var(--saffron)}
.marquee.light .marquee-track svg path{fill:var(--gulf)}
@keyframes marq{to{transform:translateX(-50%)}}
.marquee.rev .marquee-track{animation-direction:reverse}
.marquee.light{background:#fff;color:var(--gulf);border-color:var(--line)}
.logo-marquee .marquee-track{gap:20px;animation-duration:30s}
.logo-marquee img{height:84px;width:auto;border-radius:12px;border:1px solid var(--line);padding:8px;background:#fff}

/* scrub statement */
.statement{font-family:var(--display);font-weight:500;font-size:clamp(1.9rem,4.4vw,4rem);line-height:1.14;color:var(--gulf);max-width:22ch;letter-spacing:-.01em}
.statement .w{display:inline-block}
.statement-wrap{display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,5vw,80px);align-items:start}
.statement-wrap .arch{width:clamp(120px,16vw,220px);aspect-ratio:3/4}
@media (max-width:760px){.statement-wrap{grid-template-columns:1fr}.statement-wrap .arch{display:none}}

/* journey: free horizontal carousel with arrows and swipe */
.journey{background:var(--gulf);color:#DEE6F6;overflow:hidden;position:relative}
.journey-head{padding-top:clamp(64px,8vw,110px)}
.journey-head h2{color:#fff;max-width:18ch}
.journey .lead{color:#BCCBEA}
.journey-bar{height:2px;background:rgba(255,255,255,.14);margin-top:28px;position:relative}
.journey-bar i{position:absolute;inset:0;background:var(--saffron);transform-origin:0 50%;transform:scaleX(.17);transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.j-top{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.j-top h2{margin-bottom:.3em}.j-top .lead{margin:0}
.j-nav{display:flex;align-items:center;gap:14px;flex:none}
.j-nav button{width:58px;height:58px;border-radius:50%;border:1.5px solid rgba(255,255,255,.35);background:transparent;color:#fff;cursor:pointer;display:grid;place-items:center;transition:background .25s,color .25s,border-color .25s}
.j-nav button svg{width:22px;height:22px}
.j-nav button:hover:not(:disabled){background:var(--saffron);border-color:var(--saffron);color:var(--ink)}
.j-nav button:disabled{opacity:.3;cursor:default}
.j-count{font-family:var(--display);font-size:1.1rem;color:#fff;min-width:64px;text-align:center}
.journey-track{display:flex;gap:28px;padding:48px max(20px,calc((100vw - 1200px)/2 + 20px)) clamp(64px,8vw,110px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:max(20px,calc((100vw - 1200px)/2 + 20px));scrollbar-width:none;overscroll-behavior-x:contain;outline:none}
.journey-track::-webkit-scrollbar{display:none}
.j-panel{scroll-snap-align:start}
.j-panel{flex:none;width:min(78vw,860px);display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-l);padding:clamp(22px,3vw,40px)}
.j-num{font-family:var(--display);font-size:clamp(4rem,9vw,8rem);line-height:.85;color:transparent;-webkit-text-stroke:1.5px var(--saffron);display:block;margin-bottom:10px}
.j-panel h3{color:#fff;font-size:clamp(1.6rem,2.6vw,2.4rem);margin-bottom:.2em}
.j-age{display:inline-block;color:var(--saffron);font-weight:500;margin-bottom:14px}
.j-panel p{color:#BCCBEA;margin:0}
.j-img{border-radius:999px 999px 18px 18px;overflow:hidden;aspect-ratio:4/5;background:var(--gulf-2)}
.j-img img{width:100%;height:100%;object-fit:cover}
@media (max-width:899px){
  .journey-track{padding-inline:16px;scroll-padding-inline:16px;gap:14px}
  .j-panel{width:86vw;grid-template-columns:1fr;gap:18px}
  .j-nav button{width:48px;height:48px}
  .j-img{aspect-ratio:16/10;border-radius:200px 200px 14px 14px}
}

/* constellation map */
.constellation{position:relative}
.constellation svg{width:100%;height:auto;display:block;overflow:visible}
.c-dots circle{fill:rgba(37,65,135,.22)}
.c-line{fill:none;stroke:var(--lagoon);stroke-width:1.6;stroke-dasharray:4 6}
.c-node circle.core{fill:var(--gulf)}
.c-node circle.ring{fill:none;stroke:var(--lagoon);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:ping 2.8s ease-out infinite}
.c-node:nth-child(2) circle.ring{animation-delay:.4s}.c-node:nth-child(3) circle.ring{animation-delay:.8s}.c-node:nth-child(4) circle.ring{animation-delay:1.2s}.c-node:nth-child(5) circle.ring{animation-delay:1.6s}.c-node:nth-child(6) circle.ring{animation-delay:2s}
@keyframes ping{0%{transform:scale(.6);opacity:1}100%{transform:scale(2.6);opacity:0}}
.c-node text{font-family:var(--display);font-size:26px;fill:var(--gulf);font-weight:600}
.c-node text.n{font-family:var(--text);font-size:16px;fill:var(--muted);font-weight:400}
.c-node:hover circle.core,.c-node:focus circle.core{fill:var(--lagoon)}
.c-node{cursor:pointer;outline:none}
.c-sea{font-family:var(--text);font-size:15px;fill:var(--lagoon);font-style:italic;letter-spacing:.08em}
.map-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(24px,5vw,64px);align-items:center}
@media (max-width:900px){.map-grid{grid-template-columns:1fr}}
.map-stats{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:28px 0}
.map-stats b{display:block;font-family:var(--display);font-size:2.6rem;line-height:1;color:var(--gulf)}
.map-stats span{color:var(--muted);font-size:.95rem}

/* tracks hover image */
.track-float{position:fixed;left:0;top:0;width:260px;aspect-ratio:3/4;border-radius:999px 999px 16px 16px;overflow:hidden;pointer-events:none;z-index:90;opacity:0;transform:scale(.6);margin:-170px 0 0 30px;box-shadow:0 30px 60px -20px rgba(0,0,0,.5)}
.track-float img{width:100%;height:100%;object-fit:cover}
.track-list li{transition:padding .35s cubic-bezier(.2,.7,.2,1)}
@media (pointer:fine){.track-list li:hover{padding-left:18px}.bg-gulf .track-list li:hover h3{color:var(--saffron)}}

/* parallax gallery */
.pgallery{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;height:clamp(560px,80vh,860px);overflow:hidden;border-radius:var(--radius-l);position:relative}
.pgallery::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(var(--paper),transparent 14%,transparent 86%,var(--paper))}
.pcol{display:flex;flex-direction:column;gap:18px}
.pcol img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:16px}
.pcol:nth-child(2){margin-top:-120px}
@media (max-width:700px){.pgallery{grid-template-columns:1fr 1fr;height:520px}.pcol:nth-child(3){display:none}}

/* quote rotator */
.rotator{position:relative}
.rotator.on .quotes{display:block;border:0;min-height:300px;position:relative}
.rotator.on .quote{position:absolute;inset:0 0 auto 0;border:0;padding:0;opacity:0;visibility:hidden}
.rotator.on .quote.active{opacity:1;visibility:visible}
.rotator.on .quote blockquote{font-size:clamp(1.7rem,3.6vw,3.2rem);line-height:1.18;max-width:24ch}
.rot-controls{display:none;align-items:center;gap:18px;margin-top:28px}
.rotator.on .rot-controls{display:flex}
.rot-controls button{width:48px;height:48px;border-radius:50%;border:1.5px solid rgba(255,255,255,.35);background:none;color:#fff;cursor:pointer;font-size:1.2rem}
.rot-controls button:hover{background:#fff;color:var(--gulf)}
.rot-dots{display:flex;gap:8px}
.rot-dots i{width:28px;height:3px;background:rgba(255,255,255,.2);border-radius:2px;overflow:hidden;position:relative}
.rot-dots i b{position:absolute;inset:0;background:var(--saffron);transform:scaleX(0);transform-origin:0 50%}

/* footer wordmark */
.footer-mark{font-family:var(--display);font-weight:600;font-size:clamp(3.4rem,13vw,13rem);line-height:.9;color:transparent;-webkit-text-stroke:1.2px rgba(255,255,255,.22);white-space:nowrap;margin-top:56px;letter-spacing:-.02em}

/* page-hero decoration */
.page-hero .arches{position:absolute;right:-8%;top:-30%;width:min(70vw,900px);opacity:.3;pointer-events:none}
.page-hero .wrap{position:relative;z-index:1}

/* split helpers */
.split-line{overflow:hidden;padding-bottom:.06em}

@media (prefers-reduced-motion:reduce){
  .marquee-track{animation:none}
  .c-node circle.ring{animation:none;opacity:0}
  .scroll-cue i{animation:none}
}
@media (max-width:700px){.c-node text{font-size:40px}.c-node text.n{font-size:28px}.c-sea{font-size:24px}}