/* The opening resolves into an editorial portrait and the original sinking words. */
body {background:#dfd9d2}
.cover-scroll {position:relative;height:calc(100svh + 3000px)}
.hero.motion-cover {position:sticky;top:0;height:100svh;min-height:0;margin:0;background:#dfd9d2;isolation:isolate}
.hero__bloom {position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;z-index:2;opacity:0}
.hero__bloom.is-loaded {opacity:1}
.cover-poster {position:absolute;inset:0;z-index:1;pointer-events:none;--poster-w:450px;--poster-h:556px;--poster-pad:12px}
.cover-poster__frame,.cover-poster__paper {position:absolute;left:50%;top:50%;width:var(--poster-w);height:var(--poster-h);background:#fff;transform:translate(-50%,-50%) scale(0);will-change:transform,width,height}
.cover-poster__paper {width:calc(var(--poster-w) - var(--poster-pad)*2);height:calc(var(--poster-h) - var(--poster-pad)*2);background:#dfd9d2}
.cover-poster__type {position:absolute;top:calc(50% - var(--poster-h)/2 + var(--poster-h)*.07);left:50%;width:var(--poster-w);text-align:center;transform:translateX(-50%);opacity:0;will-change:transform,opacity}
.cover-poster__type h1 {font-family:var(--font-display);font-size:calc(var(--poster-h)*.077);font-weight:400;letter-spacing:-.055em;line-height:.96;margin:0}
.cover-poster__type h1 em {font-weight:400}
.cover-poster__type p {font-size:calc(var(--poster-h)*.015);font-family:var(--font-body);font-weight:400;letter-spacing:.01em;margin:calc(var(--poster-h)*.023) 0 0}
.cover-poster__signature {position:absolute;left:50%;bottom:calc(50% - var(--poster-h)/2 + var(--poster-h)*.045);margin:0;font-family:var(--font-display);font-style:italic;font-size:calc(var(--poster-h)*.023);opacity:0;transform:translateX(-50%)}
.bloom-replay {position:fixed;right:4.5%;top:22px;z-index:150;padding:8px 0;border:0;background:none;color:var(--text);font-family:var(--font-display);font-size:12px;font-style:italic;cursor:pointer;transition:opacity .3s}
.bloom-replay span {margin-left:8px}
.bloom-replay.is-away {opacity:0;pointer-events:none}
body.cover-opening>.header {opacity:0;pointer-events:none}
body>.header {transition:opacity .6s}
[data-cover-copy] {z-index:3;opacity:0;will-change:opacity,transform}
.motion-cover .hero__hint {opacity:0}
.hero__bloom[hidden],.cover-poster[hidden] {display:none}
.bloom-replay:focus-visible {outline:1px solid currentColor;outline-offset:4px}
@media(max-width:700px){
  .bloom-replay {top:auto;bottom:22px;left:var(--gutter,6vw);right:auto;font-size:11px}
  .motion-cover .hero__title {font-size:5.15vw}
  .nav {gap:18px}
  .nav a {font-size:12px}
}
@media(prefers-reduced-motion:reduce){body>.header {transition:none}}

.cover-front {position:absolute;inset:0;z-index:2;opacity:0;pointer-events:none;will-change:transform}
.cover-front__photo {position:absolute;left:var(--front-x,50%);top:var(--front-y,60%);width:var(--front-w,62.5vw);height:var(--front-h,45vh);transform:translate(-50%,-50%);overflow:hidden;margin:0;background:var(--bg)}
.cover-front__photo img {display:block;width:100%;height:100%;object-fit:cover;transform-origin:center;will-change:transform}

.cover-world {position:absolute;right:4.5%;top:var(--front-y,60%);transform:translateY(-50%);z-index:4;color:var(--text);font-family:var(--font-display);font-size:13px;font-style:italic;line-height:1.4;white-space:nowrap;padding:8px 0;opacity:0;visibility:hidden;text-decoration:none}
.cover-world span {display:inline-block;margin-left:12px;transition:transform .3s}
.cover-world::after {content:"";position:absolute;left:0;right:25px;bottom:5px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s}
.cover-world:hover::after {transform:scaleX(1)}
.cover-world:hover span {transform:translate(2px,2px)}
.cover-world:focus-visible {outline:1px solid currentColor;outline-offset:5px}
@media(max-width:700px){.cover-world {right:8%;top:calc(var(--front-y,53vh) + var(--front-h,25vh)/2 + 22px);transform:none;font-size:12px}}
@media(prefers-reduced-motion:reduce){.cover-world span,.cover-world::after {transition:none}}

/* Offset type and a full, uncropped portrait share the same visual field. */
.motion-cover .hero__caption {left:6vw;right:auto;top:22%;width:49vw}
.motion-cover .hero__caption-row {flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:26px}
.motion-cover .hero__name {font-size:clamp(24px,2.2vw,34px)}
.motion-cover .hero__caption .eyebrow {font-size:10px;letter-spacing:.1em}
.motion-cover .hero__title {font-size:min(6.7vw,11.5svh);line-height:1.08;letter-spacing:-.055em}
.motion-cover .hero__title .hero__line {display:flex;flex-direction:column;align-items:flex-start;line-height:1.08}
.motion-cover .hero__word {display:block;margin:0;line-height:1.15;padding-right:.08em}
.motion-cover .hero__word:nth-child(2) {margin-left:2.1vw}
.motion-cover .hero__word:nth-child(3) {margin-left:.65vw}
.motion-cover .hero__hint {left:50%;right:auto;bottom:20px;width:48px;height:56px;transform:translateX(-50%);border:0;border-radius:0;background:transparent}
.motion-cover .hero__hint:hover {background:transparent}
.motion-cover .hero__hint:focus-visible {outline:1px solid currentColor;outline-offset:4px}
.motion-cover .hero__hint svg {animation:cover-hint-float 5.6s cubic-bezier(.4,0,.6,1) infinite}
@keyframes cover-hint-float {
  0% {transform:translate3d(0,-10px,0);opacity:0}
  20%,55% {opacity:1}
  84% {opacity:0}
  100% {transform:translate3d(0,10px,0);opacity:0}
}
@media(prefers-reduced-motion:reduce){.motion-cover .hero__hint svg {animation:none;transform:none;opacity:1}}
.motion-cover .cover-world {left:8.1vw;right:auto;top:var(--world-y);transform:none;font-size:14px}
@media(max-height:650px) and (min-width:701px){
  .motion-cover .hero__caption {top:21%}
  .motion-cover .hero__caption-row {gap:8px;margin-bottom:16px}
  .motion-cover .hero__name {font-size:24px}
}
@media(max-width:700px){
  .motion-cover .hero__caption {left:6vw;right:6vw;top:80px;width:auto}
  .motion-cover .hero__caption-row {gap:8px;margin-bottom:16px}
  .motion-cover .hero__name {font-size:22px}
  .motion-cover .hero__caption .eyebrow {font-size:9px;letter-spacing:.08em}
  .motion-cover .hero__title {font-size:min(10.4vw,6svh);line-height:1.08}
  .motion-cover .hero__word:nth-child(2) {margin-left:9vw}
  .motion-cover .hero__word:nth-child(3) {margin-left:2vw}
  .motion-cover .cover-world {left:10vw;right:auto;font-size:13px}
  .motion-cover .hero__hint {bottom:18px}
}