/* Opening typography and scroll pacing follow namespace-ERI/atria_demo.
   The volume is adapted from Atria-Cowork's own galaxy-space.js. */
.site-header{position:absolute;inset:0 0 auto;z-index:5;width:100%;justify-content:space-between;height:88px;color:#101623;--brand:#1d68ff}
.entry-nav-link{display:inline-flex;align-items:center;gap:14px;min-height:44px;font:600 20px/1 var(--display)}
.entry-nav-link .icon{width:15px;height:15px}
.entry-nav-link:hover{color:var(--brand)}
.entry-scene{--entry-progress:0;--entry-night:0;position:relative;height:185svh;isolation:isolate;background:var(--paper)}
.entry-sticky{position:sticky;top:0;height:100svh;min-height:560px;overflow:hidden;background:rgb(calc(255 - 250*var(--entry-night)),calc(255 - 250*var(--entry-night)),calc(255 - 249*var(--entry-night)))}
.entry-art,.entry-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.entry-art{opacity:0;animation:entry-arrive 1.1s ease-out forwards}
.entry-canvas{opacity:0;transition:opacity .5s ease}
.entry-static-logo{position:absolute;left:50%;top:35%;width:min(33svh,52vw);height:auto;transform:translate(-50%,-50%);opacity:.88}
.entry-scene[data-renderer] .entry-canvas{opacity:1}
.entry-scene[data-renderer] .entry-static-logo{opacity:0}
.entry-copy{position:absolute;top:61%;left:24px;right:24px;text-align:center;animation:entry-arrive 1s ease-out both}
.entry-title{display:grid;place-items:center;margin:0;color:rgb(calc(16 + 224*var(--entry-night)),calc(28 + 215*var(--entry-night)),calc(48 + 199*var(--entry-night)));font:600 clamp(54px,7.6vw,104px)/1.04 var(--display);letter-spacing:-.025em}
.entry-title>span{grid-area:1/1;will-change:opacity,transform}
.entry-origin{opacity:clamp(0,calc(1 - var(--entry-progress)*3.6),1);transform:translateY(calc(var(--entry-progress)*-24px))}
.entry-destination{opacity:clamp(0,calc((var(--entry-progress) - .3)*3.2),1);transform:translateY(calc((1 - clamp(0,calc((var(--entry-progress) - .3)*3.2),1))*24px))}
.entry-categories{display:flex;justify-content:center;align-items:center;gap:16px;margin:26px 0 0;color:rgb(calc(129 + 39*var(--entry-night)),calc(136 + 39*var(--entry-night)),calc(149 + 39*var(--entry-night)));font-size:12px;letter-spacing:.045em}
.entry-categories a{display:inline-flex;align-items:center;min-height:36px}
.entry-categories a:hover{color:rgb(calc(16 + 224*var(--entry-night)),calc(28 + 215*var(--entry-night)),calc(48 + 199*var(--entry-night)))}
.entry-categories span{color:#b9bec6}
.entry-scroll{display:inline-flex;align-items:center;gap:26px;min-height:44px;margin-left:auto;font-size:12px;color:rgb(calc(101 + 67*var(--entry-night)),calc(110 + 65*var(--entry-night)),calc(125 + 63*var(--entry-night)))}
.entry-scroll .icon{transform:rotate(90deg);width:16px;height:16px;transition:transform .25s ease}
.entry-scroll:hover{color:rgb(calc(16 + 224*var(--entry-night)),calc(28 + 215*var(--entry-night)),calc(48 + 199*var(--entry-night)))}
.entry-scroll:hover .icon{transform:translateY(4px) rotate(90deg)}
.gallery-section{position:relative;background:var(--paper);padding-top:72px}
@keyframes entry-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:760px){
  .site-header{height:76px}.entry-nav-link{font-size:18px;gap:10px}
  .entry-title{font-size:clamp(52px,10vw,76px)}.entry-copy{left:16px;right:16px;top:59%}
  .entry-categories{margin-top:20px;gap:15px}
  .entry-scene{height:170svh}.entry-static-logo{top:35%;width:min(30svh,52vw)}
  .gallery-section{padding-top:48px}
}
@media(max-height:560px) and (min-width:761px){
  .entry-sticky{min-height:0}.entry-title{font-size:62px}.entry-copy{top:59%}
  .entry-categories{margin-top:12px}
}
@media(prefers-reduced-motion:reduce){
  .entry-scene{height:100svh}.entry-title>span{will-change:auto;transform:none}
  .entry-art,.entry-copy{animation:none;opacity:1}.entry-origin{opacity:1}.entry-destination{opacity:0}
}


/* Solid opening mark crossfades into the original particle simulation. */
.entry-static-logo{filter:brightness(0);opacity:1;pointer-events:none}
.entry-scene[data-renderer] .entry-static-logo{opacity:var(--entry-solid-logo,1)}
.entry-scene[data-renderer] .entry-canvas{opacity:calc(1 - var(--entry-solid-logo,1))}

/* Inverted opening palette. Scroll animation and following sections are unchanged. */
.site-header{color:#fff}
.site-header .brand img{filter:brightness(0) invert(1)}
.entry-scene,.entry-sticky{background:#050506}
.entry-title{color:#fff}
.entry-categories,.entry-scroll{color:#b8bdc7}
.entry-categories a:hover,.entry-scroll:hover{color:#fff}
.entry-static-logo{filter:brightness(0) invert(1)}

.entry-paper-title{margin:18px auto 0;color:#e0e2e7;font:500 clamp(9px,2.8vw,36px)/1.16 var(--display);white-space:nowrap;opacity:clamp(0,calc(1 - var(--entry-progress)*3.6),1)}
@media(max-height:600px){.entry-paper-title{margin-top:10px}.entry-categories{margin-top:12px}}
