/* Orbita Experience — supplied-media edition. Approved opening styles retained. */
@font-face {
  font-family: TypoGraphica;
  src: local('TypoGraphica');
  font-display: swap;
  unicode-range: U+0020-0021,U+002E,U+0030-0039,U+0041-005A,U+0061-007A;
}
:root {
  color-scheme: dark;
  --paper: #f0eee7; --dim: #aaa4ac; --brand: #6c335a; --accent: #d1a6c0;
  --display: TypoGraphica,'Arial Narrow',Arial,sans-serif;
  --perception-font: Garamond,'Iowan Old Style',Baskerville,'Palatino Linotype',Georgia,serif;
  --light: 0; --progress: 0; --reveal: 1;
}
:root[data-font="TypoGraphica"] { --display: 'TypoGraphica Preview',TypoGraphica,'Arial Narrow',Arial,sans-serif; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 0; }
html,body,main { overflow-x: clip; }
body { margin: 0; background: #050506; color: var(--paper); font-family: Arial,sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; }
a,button { -webkit-tap-highlight-color: transparent; }
a:focus-visible,button:focus-visible { outline: 2px solid var(--accent); outline-offset: 7px; }
::selection { color: #fff; background: var(--brand); }
.skip { position: fixed; left: 20px; top: -100px; padding: 16px 22px; background: #eee; color: #151216; z-index: 100; }
.skip:focus { top: 20px; }
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 20;
  display: flex; align-items: center; justify-content: space-between; padding: 27px 4.3vw; gap: 24px;
  color: rgb(calc(240 - var(--light)*207),calc(238 - var(--light)*213),calc(231 - var(--light)*202));
  background: linear-gradient(to bottom,rgba(5,5,6,calc(.58 - var(--light)*.58)),transparent);
}
.brand { display: flex; flex-direction: column; align-items: center; text-decoration: none; gap: 0; line-height: 1; }
.brand>span { font: 400 31px/.95 var(--display); letter-spacing: -.02em; font-synthesis: none; }
.brand>small { font-size: 7px; letter-spacing: .36em; padding-left: .36em; margin-top: 7px; }
.header-right { display: flex; align-items: center; gap: 36px; }
.edition { font-size: 8px; letter-spacing: .13em; }
.edition i { font-style: normal; color: var(--accent); margin: 0 6px; }
button { font-family: Arial,sans-serif; font-size: 10px; letter-spacing: .02em; color: inherit; background: transparent; border: 1px solid rgba(162,112,149,.5); padding: 11px 16px; border-radius: 30px; cursor: pointer; }
button:hover { border-color: var(--accent); }
.stage { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
canvas { display: block; width: 100%; height: 100%; }
.vignette { position: absolute; inset: 0; background: radial-gradient(ellipse at 55% 46%,transparent 22%,#05050650 100%); opacity: calc(1 - var(--light)); }
main { position: relative; z-index: 1; }
.scene { position: relative; min-height: 150svh; display: flex; align-items: center; padding: 130px 8.5vw; scroll-margin-top: 0; isolation: isolate; }
.origin { min-height: 100svh; }
.copy { position: relative; width: 100%; max-width: 1180px; margin: 0 auto; }
.origin .copy,.matter .copy { margin-left: 0; max-width: 48vw; }
.eyebrow { display: flex; align-items: center; gap: 16px; margin: 0 0 34px; font-size: 9px; line-height: 1.5; letter-spacing: .17em; color: var(--accent); font-weight: 400; }
.eyebrow>span { font-size: 10px; color: var(--dim); }
.eyebrow:after { content: ''; display: block; width: 40px; height: 1px; background: var(--brand); margin-left: 2px; }
h1,h2 { font: 400 clamp(48px,6.2vw,98px)/1.04 var(--display); letter-spacing: 0; margin: 0 0 30px; font-synthesis: none; }
h1 { font-size: clamp(48px,5.8vw,92px); }
em { font-family: var(--display); font-style: normal; color: var(--accent); }
.perception-script { font-family:var(--perception-font);font-style:italic;font-weight:400;font-synthesis:style;letter-spacing:.015em; }
.body-copy .perception-script { font-size:1.35em; }
#filosofia .body-copy .perception-script { color:inherit; }
.edition .perception-script { font-size:15px; }
.body-copy { font: 400 clamp(14px,1.13vw,17px)/1.85 Arial,sans-serif; color: #bdb6c0; max-width: 360px; margin: 0 0 34px; }
.text-link { display: inline-flex; align-items: center; gap: 35px; text-decoration: none; padding: 13px 0; border-bottom: 1px solid #635265; font-size: 11px; line-height: 1.5; }
.text-link b { font-size: 20px; font-weight: 400; }
.text-link:hover { border-color: var(--accent); }
.scene-note { position: absolute; left: 8.5vw; bottom: 12vh; margin: 0; font-size: 8px; letter-spacing: .19em; color: #8a7c8d; }
.center { text-align: center; }
.center .eyebrow { justify-content: center; }
.center .eyebrow:after { display: none; }
.center .body-copy { margin-left: auto; margin-right: auto; }
.enhanced .copy,.enhanced .scene-note { opacity: var(--visibility,1); transform: translateY(var(--lift,0px)); }

/* The provided media occupies the centre; words stay at the edge. */
.media-bank { position: fixed; width: 1px; height: 1px; top: 0; left: 0; overflow: hidden; opacity: 0; pointer-events: none; z-index: -1; }
.media-bank video { position: absolute; inset: 0; width: 1px; height: 1px; }
.gravity { min-height: 150svh; }
.traversal { min-height: 220svh; }
.philosophy { min-height: 190svh; }
.methodology { min-height: 170svh; }
.cycle { min-height: 180svh; }
.transformation { min-height: 140svh; }
.purpose { min-height: 150svh; }
.cinematic { padding-top: 0; padding-bottom: 0; }
.cinematic .copy {
  max-width: 1180px; height: 100svh; margin: 0 auto;
  display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; padding-bottom: 4svh;
  color: rgb(calc(240 - var(--light)*207),calc(238 - var(--light)*213),calc(231 - var(--light)*202));
}
.cinematic .eyebrow { font-size: 8px; gap: 13px; margin-bottom: 15px; }
.cinematic .eyebrow>span { font-size: 8px; }
.cinematic .eyebrow:after { width: 24px; }
.cinematic h2 { font-size: clamp(26px,2.8vw,40px); line-height: 1.14; margin-bottom: 15px; max-width: 680px; }
.cinematic .body-copy { color: inherit; opacity: .72; font-size: 12px; line-height: 1.8; max-width: 470px; margin-bottom: 0; }
.traversal h2 { font-size: clamp(28px,3vw,44px); }
.traversal .copy,.traversal .eyebrow,.traversal .eyebrow>span,.traversal .body-copy,.traversal em { color:#fff; }
.traversal .eyebrow,.traversal h2,.traversal .body-copy { text-shadow:0 2px 4px #000,0 0 14px #000b; }
.traversal .body-copy { opacity:1; }
#travessia .body-copy { color:#fff; opacity:1; }
.reference-note { font-size: 9px; line-height: 1.8; color: inherit; opacity: .55; margin: 11px 0 0; }
.reference-note cite { font-style: normal; }

/* Exact stills/posters form the static reading version. No parallel playback. */
.reading-visual { width: 100%; max-width: 1000px; margin: 35px 0 0; }
.reading-visual img { display: block; width: 100%; max-height: 68svh; object-fit: contain; background: #000; }
.reading-visual figcaption { max-width: 720px; margin-top: 15px; color: #98919c; font: 400 11px/1.8 Arial,sans-serif; }
.reading-visual cite { font-style: normal; }
.symbol-visual { max-width: 640px; }
.symbol-visual img { max-height: 56svh; }
.enhanced:not(.reading) .reading-visual { display: none; }

/* The final mark is the unmodified supplied identity. */
.revelation { min-height: 100svh; padding-top: 0; padding-bottom: 0; }
.revelation .copy { height: 100svh; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding-top: 0; padding-bottom: 8svh; }
.revelation .eyebrow { position: absolute; top: max(95px,10svh); left: 0; right: 0; color: #b4a6b0; }
.official { position: relative; width: min(420px,75vw); height: 360px; margin: 0 auto; }
.official img { position: absolute; width: 100%; height: auto; left: 0; mix-blend-mode: screen; }
.revelation .official img { filter:url(#brand-purple); }
.saturn { top: -17%; }
.wordmark { top: 29%; }
.enhanced:not(.reading) .official { display: none; }
.tagline { font: 400 clamp(22px,2.2vw,32px)/1.1 var(--display); margin: 0 0 15px; }
.tagline.perception-script { font-family:var(--perception-font);font-style:italic;font-size:clamp(28px,3vw,42px); }
.revelation .text-link { font-size: 10px; }
.revelation footer { width:100%;max-width:600px;margin:0 auto 14px;display:flex;justify-content:space-between;gap:20px;font-size:7px;letter-spacing:.11em;line-height:1.5;color:#8e8493; }
.revelation footer a { text-decoration: none; }
.revelation .body-copy { margin-bottom:18px; }
.whatsapp-cta { display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:48px;max-width:100%;padding:14px 24px;border:1px solid #9d5a8c;border-radius:30px;background:var(--brand);color:#fff;text-decoration:none;font:400 12px/1.5 Arial,sans-serif; }
.whatsapp-cta>span:last-child { font-size:17px;line-height:1; }
.whatsapp-cta:hover { background:#82416e;border-color:var(--accent); }
.chapters { position: fixed; right: 3.1vw; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; gap: 19px; z-index: 21; color: rgb(calc(170 - var(--light)*77),calc(164 - var(--light)*84),calc(172 - var(--light)*82)); }
.chapters a { position: relative; padding: 3px 1px; font-size: 8px; line-height: 1; text-decoration: none; }
.chapters a[aria-current] { color: rgb(calc(240 - var(--light)*175),calc(238 - var(--light)*211),calc(231 - var(--light)*182)); }
.chapters a[aria-current]:before { content: ''; position: absolute; left: -24px; top: 6px; width: 14px; height: 1px; background: #b970a0; }
.progress { position: fixed; bottom: 0; left: 0; right: 0; height: 2px; background: #29202d; z-index: 30; }
.progress i { display: block; height: 100%; background: var(--brand); width: calc(var(--progress)*100%); }
.nojs { position: absolute; left: 8.5vw; top: 100px; color: #aaa; font-size: 12px; }
.visually-hidden { position: absolute!important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

@media(min-width:1500px) {
  .scene { padding-left: max(8.5vw,calc((100vw - 1440px)/2)); }
  .origin .copy,.matter .copy { max-width: 660px; }
}

/* Opening mobile values match the approved version. */
@media(max-width:800px) {
  .site-header { padding: 24px 6vw; }
  .brand>span { font-size: 27px; }
  .brand>small { font-size: 6px; }
  .edition { display: none; }
  .header-right { gap: 0; }
  button { padding: 10px 12px; font-size: 9px; }
  .scene { padding: 100px 8vw; min-height: 150svh; }
  .origin { min-height: 100svh; }
  .origin .copy,.matter .copy { max-width: 84vw; margin: 0; padding-top: 44vh; }
  .eyebrow { font-size: 8px; gap: 12px; margin-bottom: 22px; }
  .eyebrow>span { font-size: 8px; }
  .eyebrow:after { width: 27px; }
  h1,h2 { font-size: clamp(36px,10vw,65px); line-height: 1.04; margin-bottom: 24px; }
  h1 { font-size: clamp(38px,10.3vw,66px); }
  .body-copy { font-size: 13px; max-width: 290px; line-height: 1.8; margin-bottom: 22px; }
  .text-link { font-size: 10px; gap: 22px; padding: 11px 0; }
  .text-link b { font-size: 18px; }
  .scene-note { display: none; }
  .chapters { right: 3.6vw; gap: 15px; }
  .chapters a { font-size: 7px; }
  .chapters a[aria-current]:before { width: 8px; left: -13px; }
  .gravity { min-height: 150svh; }
  .traversal { min-height: 220svh; }
  .philosophy { min-height: 190svh; }
  .methodology { min-height: 170svh; }
  .cycle { min-height: 180svh; }
  .transformation { min-height: 140svh; }
  .purpose { min-height: 150svh; }
  .cinematic { padding-top: 0; padding-bottom: 0; }
  .cinematic .copy { height: 100svh; max-width: 100%; padding-bottom: 5svh; }
  .cinematic .eyebrow { font-size: 7px; gap: 11px; margin-bottom: 13px; }
  .cinematic .eyebrow>span { font-size: 7px; }
  .cinematic h2 { font-size: clamp(24px,6.4vw,36px); line-height: 1.15; margin-bottom: 13px; max-width: 100%; }
  .cinematic .body-copy { font-size: 11px; line-height: 1.8; max-width: 290px; }
  .reference-note { font-size: 8px; line-height: 1.7; margin-top: 9px; }
  .reading-visual { margin-top: 28px; }
  .reading-visual img { max-height: 60svh; }
  .reading-visual figcaption { font-size: 10px; line-height: 1.8; margin-top: 12px; }
  .revelation { min-height: 100svh; padding-top: 0; padding-bottom: 0; }
  .tagline { font-size: 22px; }
  .revelation .text-link { font-size: 9px; }
  .revelation footer { font-size: 5px; left: 6vw; right: 6vw; bottom: 28px; gap: 12px; }
  .revelation footer a { display: none; }
  .official { height: 290px; width: 280px; }
}

/* Reading mode contains the exact supplied stills, with no automatic movement. */
body.reading .stage,body:not(.enhanced) .stage { opacity: 0; }
body.reading .scene,body:not(.enhanced) .scene { min-height: 100svh; }
body.reading .copy,body:not(.enhanced) .copy { opacity: 1!important; transform: none!important; }
body.reading .origin .copy,body.reading .matter .copy,body:not(.enhanced) .origin .copy,body:not(.enhanced) .matter .copy { max-width: 1180px; padding-top: 0; }
body.reading .cinematic,body:not(.enhanced) .cinematic { padding-top: 130px; padding-bottom: 130px; }
body.reading .cinematic .copy,body:not(.enhanced) .cinematic .copy { height: auto; display: block; padding: 0; color: var(--paper); }
body.reading .cinematic .body-copy,body:not(.enhanced) .cinematic .body-copy { opacity: 1; color: #bdb6c0; }
body.reading .revelation .copy,body:not(.enhanced) .revelation .copy { height: auto; display: block; padding: 100px 0; }
body.reading .revelation .eyebrow,body:not(.enhanced) .revelation .eyebrow { position: static; }
body.reading .official { display: block; }
body.reading .site-header,body.reading .chapters { color: var(--paper); }
body.reading .chapters a[aria-current] { color: #fff; }
body.reading .site-header { background: linear-gradient(to bottom,#050506b0,transparent); }
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  body:not(.motion-enabled) .stage { opacity: 0; }
  body:not(.motion-enabled) .scene { min-height: 100svh; }
  body:not(.motion-enabled) .copy { opacity: 1!important; transform: none!important; }
  body:not(.motion-enabled) .origin .copy,body:not(.motion-enabled) .matter .copy { max-width: 1180px; padding-top: 0; }
  body:not(.motion-enabled) .cinematic { padding-top: 130px; padding-bottom: 130px; }
  body:not(.motion-enabled) .cinematic .copy { height: auto; display: block; padding: 0; color: var(--paper); }
  body:not(.motion-enabled) .reading-visual { display: block!important; }
  body:not(.motion-enabled) .revelation .copy { height: auto; display: block; padding: 100px 0; }
  body:not(.motion-enabled) .revelation .eyebrow { position: static; }
  body:not(.motion-enabled) .official { display: block; }
  body:not(.motion-enabled) .site-header,body:not(.motion-enabled) .chapters { color: var(--paper); }
  body:not(.motion-enabled) .site-header { background: linear-gradient(to bottom,#050506b0,transparent); }
}
:root{--ui-light:0}.site-header{color:rgb(calc(240 - var(--ui-light)*207),calc(238 - var(--ui-light)*213),calc(231 - var(--ui-light)*202));background:linear-gradient(to bottom,rgba(5,5,6,calc(.82 - var(--ui-light)*.82)),rgba(5,5,6,calc(.64 - var(--ui-light)*.64)) 65%,transparent)}.chapters{color:rgb(calc(170 - var(--ui-light)*77),calc(164 - var(--ui-light)*84),calc(172 - var(--ui-light)*82))}.chapters a[aria-current]{color:rgb(calc(240 - var(--ui-light)*175),calc(238 - var(--ui-light)*211),calc(231 - var(--ui-light)*182))}
.reading-visual img{height:auto}
.chapters{padding:12px 7px;border-radius:22px;background:rgba(5,5,6,calc(.72 - var(--ui-light)*.72))}
