/* Motion reinforces the journey without changing its layout. */
.motion-ready .motion-item{transition:opacity .65s ease,transform .65s cubic-bezier(.2,.65,.2,1);transition-delay:var(--arrival-delay,0ms)}
.motion-ready .motion-item:not(.motion-in){opacity:0;transform:translateY(12px)!important}
.motion-ready .motion-item.motion-in{opacity:1;transform:none!important}
.motion-ready .contact-monogram.motion-item:not(.motion-in){transform:none!important}
.story-tabs{position:relative}
.story-tabs::after{content:'';position:absolute;left:var(--tab-x,0px);bottom:-1px;width:var(--tab-width,0px);height:2px;background:#dfc4f4;transition:left .32s cubic-bezier(.2,.65,.2,1),width .32s ease;pointer-events:none}
.story-tabs button[aria-selected=true]{border-bottom-color:transparent}
.story-panel{animation:story-settle .4s ease both}
.scene-photo{transition:opacity .65s ease}
@keyframes story-settle{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.chapter-next{text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px;transition:text-decoration-color .25s,color .25s}
.chapter-next:hover,.chapter-next:focus-visible{text-decoration-color:currentColor}
.chapter-next>span{text-decoration:none}
.chapter-next:focus-visible i{transform:translateY(4px)}
@media(min-width:801px) and (prefers-reduced-motion:no-preference){
 .scene-base,.scene-photo img{scale:var(--photo-scale,1);transform-origin:center;transition:scale .25s linear}
 .project-oasis .scene-photo img{scale:1}
}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
 .motion-ready .thread-image.motion-in:hover,.motion-ready .thread-image.motion-in:focus-visible{transform:translateY(-4px)!important;transition-delay:0ms;border-color:#e6c9ff90}
 .thread-image span{transition:color .25s,text-shadow .25s}
 .thread-image:hover span,.thread-image:focus-visible span{color:#fff;text-shadow:0 0 12px #f0d8ff70}
}
@media(max-width:800px){.motion-ready .motion-item{transition-duration:.4s;transition-delay:0ms}.motion-ready .motion-item:not(.motion-in){transform:translateY(6px)!important}.story-panel{animation-duration:.25s}}
@media(prefers-reduced-motion:reduce){.motion-ready .motion-item{opacity:1!important;transform:none!important;transition:none!important}.scene-base,.scene-photo img{scale:1}.story-panel{animation:none}.story-tabs::after,.scene-photo,.chapter-next,.thread-image span{transition:none}.chapter-next:hover i,.chapter-next:focus-visible i{transform:none}}
/* A bolder opening, with the photograph visible throughout. */
.hero-word-mask{overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.hero-opening .hero-word{animation:word-unveil .75s cubic-bezier(.18,.7,.22,1) both;animation-delay:var(--word-delay,0ms)}
.hero-opening .hero-content>.eyebrow{animation:opening-fade .5s ease both}
.hero-opening .intro-copy{animation:opening-fade .55s ease .75s both}
.hero-opening>.enter{animation:opening-fade .5s ease .95s both}
.hero-opening>.enter .circle-mark{animation:plus-settle .5s ease .95s both}
@keyframes word-unveil{from{transform:translateY(110%)}to{transform:translateY(0)}}
@keyframes opening-fade{from{opacity:0}to{opacity:1}}
@keyframes plus-settle{from{transform:rotate(-80deg)}to{transform:rotate(0deg)}}
.motion-ready .chapter-replay .motion-item{transition-duration:.45s;transition-delay:var(--return-delay,0ms)}
.motion-ready .motion-item.motion-reset{transition:none!important}
@media(max-width:800px){.hero-opening .hero-word{animation-duration:.55s}.hero-opening .intro-copy{animation-delay:.55s}.hero-opening>.enter,.hero-opening>.enter .circle-mark{animation-delay:.75s}.motion-ready .chapter-replay .motion-item{transition-duration:.3s;transition-delay:0ms}}
@media(prefers-reduced-motion:reduce){.hero-opening .hero-word,.hero-opening .hero-content>.eyebrow,.hero-opening .intro-copy,.hero-opening>.enter,.hero-opening>.enter .circle-mark{animation:none;opacity:1;transform:none}}
/* Two openings, chosen once per page load. */
.hero-opening.opening-perspective .hero-word-mask{overflow:visible}
.hero-opening.opening-perspective .hero-word{transform-origin:left center;animation:perspective-arrival .9s cubic-bezier(.18,.7,.22,1) both;animation-delay:var(--word-delay,0ms)}
.hero-opening.opening-perspective .hero-word-mask:nth-child(2) .hero-word{animation-name:people-focus;animation-duration:1.55s}
@keyframes perspective-arrival{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:none}}
@keyframes people-focus{0%{opacity:0;transform:translateY(20px) scale(.96)}45%{opacity:1;transform:scale(1.065)}72%{opacity:1;transform:scale(1.065)}100%{opacity:1;transform:none}}
.hero-opening.opening-light .hero-word{background-image:linear-gradient(90deg,#c6aecbcc 0%,#c6aecbcc 32%,#fff6ff 44%,#e7caff 50%,#fff6ff 56%,#c6aecbcc 68%,#c6aecbcc 100%);background-size:300% 100%;background-repeat:no-repeat;background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:light-word 1.6s ease-in-out both;animation-delay:var(--word-delay,0ms);transform:none}
@keyframes light-word{0%{background-position:100% 0;color:transparent;-webkit-text-fill-color:transparent}90%{background-position:0% 0;color:transparent;-webkit-text-fill-color:transparent}100%{background-position:0% 0;color:#fff6ff;-webkit-text-fill-color:#fff6ff}}
.hero-opening.opening-light .places-word .hero-word{--settled-word:#eddbff}
.hero-opening.opening-light .places-word .hero-word{animation-name:light-places}
@keyframes light-places{0%{background-position:100% 0;color:transparent;-webkit-text-fill-color:transparent}90%{background-position:0% 0;color:transparent;-webkit-text-fill-color:transparent}100%{background-position:0% 0;color:#eddbff;-webkit-text-fill-color:#eddbff}}
.hero-opening.opening-perspective .intro-copy,.hero-opening.opening-light .intro-copy{animation-delay:1.55s}
.hero-opening.opening-perspective>.enter,.hero-opening.opening-light>.enter,.hero-opening.opening-perspective>.enter .circle-mark,.hero-opening.opening-light>.enter .circle-mark{animation-delay:1.8s}
@media(max-width:800px){.hero-opening.opening-perspective .hero-word{animation-duration:.65s}.hero-opening.opening-perspective .hero-word-mask:nth-child(2) .hero-word{animation-duration:1.1s}.hero-opening.opening-light .hero-word{animation-duration:1.2s}.hero-opening.opening-perspective .intro-copy,.hero-opening.opening-light .intro-copy{animation-delay:1.2s}.hero-opening.opening-perspective>.enter,.hero-opening.opening-light>.enter,.hero-opening.opening-perspective>.enter .circle-mark,.hero-opening.opening-light>.enter .circle-mark{animation-delay:1.4s}}
@media(prefers-reduced-motion:reduce){.hero-opening.opening-perspective .hero-word,.hero-opening.opening-light .hero-word{animation:none!important;background:none;color:inherit;-webkit-text-fill-color:currentColor;opacity:1;transform:none!important}}
/* On phones, reveal the content as it is read rather than the whole long card. */
@media(min-width:801px){.motion-ready .mobile-story-item{opacity:1!important;transform:none!important;transition:none!important}}
@media(max-width:800px){.motion-ready .story-wrap.motion-item{opacity:1!important;transform:none!important}.motion-ready .mobile-story-item{transition-duration:.45s}.motion-ready .mobile-story-item:not(.motion-in){transform:translateY(10px)!important}}
@media(prefers-reduced-motion:reduce){.motion-ready .mobile-story-item{opacity:1!important;transform:none!important;transition:none!important}}
