/* Four reflective 3D letters, composited behind the opening's content. */
.im-scroll-thread-surface{position:absolute;inset:0;z-index:1;overflow:clip;pointer-events:none;user-select:none;contain:paint}
.im-scroll-thread-shape{position:sticky;top:0;left:0;display:block;max-width:none;will-change:filter;pointer-events:none}
[data-site-complete]{overflow-anchor:none}
[data-site-complete] .hero{overflow:clip}
.intro-pending .im-scroll-thread-surface,.motion-off .im-scroll-thread-surface{visibility:hidden!important}

/* Give the approach room to unfold, with the existing story held in the viewport. */
[data-site-complete] .im-reel-perspective > #perspective.thread-is-timed .thread-scroll{height:320svh;min-height:0}
[data-site-complete] .im-reel-perspective > #perspective.thread-is-timed .thread-sticky{position:sticky;top:var(--story-header);height:calc(100svh - var(--story-header));min-height:0}
[data-site-complete] #perspective.thread-is-timed .thread-sticky > .p-label{position:absolute;left:6.5%;right:6.5%;top:30px;margin:0;padding:0;z-index:5;color:#fff;text-shadow:0 1px 12px #2c1e46aa}
[data-site-complete] #perspective.thread-is-timed .thread-sticky > .p-label > span:last-child{color:#f3eaf7}
[data-site-complete] #perspective[data-thread-playback="time"].thread-is-timed .thread-panel{transition:opacity .3s ease,visibility .3s;transition-delay:0s}
[data-site-complete] #perspective[data-thread-playback="time"].thread-is-timed .thread-message > span{animation:none}
/* Share the FV's per-character signal treatment at each sentence change. */
[data-site-complete] #perspective[data-thread-transition="glitch"].thread-is-timed .thread-panel{transition:none}
[data-story-scramble] .scramble-letter::before,[data-story-scramble] .scramble-letter::after{animation-play-state:var(--story-glitch-play-state,paused)!important}
.motion-off [data-story-scramble] .scramble-letter::before{display:none}
.motion-off [data-story-scramble] .scramble-letter::after{animation:none}
/* Preserve the approved print texture, using the same lavender-white ink for
   the artwork and its particles. The soft reveal resolves to a crisp print. */
[data-site-complete] #perspective .thread-message.thread-brand{width:min(900px,88vw);max-width:100%;margin-inline:auto;line-height:1;text-shadow:none}
[data-site-complete] #perspective .thread-wordmark{display:block;position:relative;width:100%;aspect-ratio:2079 / 177;overflow:visible;opacity:calc(.94 * var(--wordmark-visibility,1))}
[data-site-complete] #perspective .thread-wordmark[data-halftone="revealing"]{will-change:opacity}
[data-site-complete] #perspective .thread-wordmark-frame{position:absolute;inset:0;overflow:hidden;filter:blur(var(--wordmark-blur,0px))}
[data-site-complete] #perspective .thread-wordmark img{position:absolute;display:block;width:104.4733%;max-width:none;height:auto;left:-2.3569%;top:-152.5424%;filter:url('#wordmark-ink-tint');box-shadow:none;pointer-events:none}
[data-site-complete] #perspective .thread-wordmark-particles{position:absolute;left:-24px;top:-24px;pointer-events:none}
[data-site-complete] #perspective .thread-wordmark-particles[hidden]{display:none}
.motion-off [data-site-complete] #perspective .thread-wordmark img{opacity:1!important}
.motion-off [data-site-complete] #perspective .thread-wordmark{opacity:.94;filter:none}
.motion-off [data-site-complete] #perspective .thread-wordmark-frame{filter:none}
.motion-off [data-site-complete] #perspective .thread-wordmark-particles{display:none}
/* This beat is the gathering of the 3D letters, with no duplicate text label.
   The text remains available only when the animation cannot run. */
html:not(.motion-off) [data-site-complete] #perspective.has-move-object.thread-is-timed [data-thread-panel="6"] .thread-message{display:none}
@media(max-width:600px){
 [data-site-complete] .im-reel-perspective > #perspective.thread-is-timed .thread-scroll{height:320svh}
 [data-site-complete] #perspective.thread-is-timed .thread-sticky > .p-label{top:24px}
 [data-site-complete] #perspective.thread-is-timed .thread-caption > .p-kicker{position:absolute;top:18%;left:0;right:0;margin:0;text-align:center}
}
@media(prefers-reduced-motion:reduce){.im-scroll-thread-surface{display:none}
[data-site-complete] #perspective .thread-wordmark{opacity:.94;filter:none}
[data-site-complete] #perspective .thread-wordmark img{opacity:1!important}
[data-site-complete] #perspective .thread-wordmark-frame{filter:none}
[data-site-complete] #perspective .thread-wordmark-particles{display:none}
html:not(.motion-off) [data-site-complete] #perspective.has-move-object.thread-is-timed [data-thread-panel="6"] .thread-message{display:block}}

/* The first finale leaves a short tail and at most one viewport of return
   travel. Sticky content keeps its screen position during the rebase. */
[data-site-complete] .im-reel-perspective > #perspective.thread-is-timed.story-runway-extended .thread-scroll{height:calc(100svh - var(--story-header) + var(--story-runway-travel));overflow-anchor:none}
[data-site-complete] .im-reel-perspective > #perspective.thread-is-timed.story-exit-compact .thread-scroll{height:calc(100svh - var(--story-header) + var(--story-exit-travel));overflow-anchor:none}
