@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500&family=Manrope:wght@400;500;600&display=swap');
:root{--paper:#f7f4ed;--ink:#171717}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid;outline-offset:6px}.opening{min-height:100svh;display:flex;flex-direction:column;padding:30px 5% 25px}.wordmark{font-size:17px;letter-spacing:5px;align-self:flex-start}.wordmark span,.closing-brand span{display:block;font-size:7px;letter-spacing:3px;margin-top:9px}.intro{margin:auto;text-align:center;padding:20px 0 35px;width:100%}.signature{width:min(490px,78vw);aspect-ratio:1020/750;background:url('brand-reference.jpg') left top/150.588% auto no-repeat;mix-blend-mode:multiply;margin:0 auto 16px}h1{font-family:'Manrope',sans-serif;font-size:clamp(29px,3.3vw,49px);font-weight:400;letter-spacing:-1.7px;line-height:1.22;margin:0 0 18px}.intro p{font-size:14px;color:#6b675f;margin:0}.opening-foot{display:flex;justify-content:space-between;gap:25px;font-size:10px;letter-spacing:.4px;color:#6b675f}.opening-foot a{color:var(--ink)}.journey{height:290vh;position:relative}.stage{height:100svh;position:sticky;top:0;overflow:hidden;background:var(--paper);isolation:isolate}.trail-copy{position:absolute;top:20%;left:9%;opacity:var(--trail-opacity,1)}.trail-copy p{font-family:'Manrope',sans-serif;font-size:clamp(35px,5.5vw,78px);line-height:1.13;letter-spacing:-2.5px;margin:0 0 26px}.trail-copy span,.scroll-note{font-size:9px;letter-spacing:2px}.walking-lyra{position:absolute;left:var(--cat-x,10px);bottom:12%;width:clamp(180px,27vw,400px);aspect-ratio:620/480;z-index:2;transform:translateY(var(--bob,0px)) rotate(var(--tilt,0deg));opacity:var(--cat-opacity,1);will-change:left,transform}.lyra-art{position:absolute;inset:0;background:url('brand-reference.jpg') 32.75% 16.54%/247.74% auto no-repeat;mix-blend-mode:multiply}.curtain{position:absolute;left:70%;top:72%;width:200vmax;height:200vmax;border-radius:50%;background:var(--ink);transform:translate(-50%,-50%) scale(var(--cover,0));z-index:3;will-change:transform}.closing{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--paper);opacity:var(--closing-opacity,0);transform:translateY(var(--closing-y,25px));padding:30px;pointer-events:none}.closing-brand{position:absolute;top:40px;margin:0;font-size:16px;letter-spacing:5px}.closing h2{font-family:'Manrope',sans-serif;font-size:clamp(76px,13vw,190px);font-weight:400;letter-spacing:-7px;line-height:.98;margin:0 0 35px}.closing h2 em{font-family:Georgia,serif;font-weight:400}.closing>p:not(.closing-brand){font-size:14px;color:#d7d4ca}.closing-note{position:absolute;bottom:40px;font-size:10px;color:#b8b5ac}.scroll-note{position:absolute;bottom:35px;left:50%;transform:translateX(-50%);opacity:var(--trail-opacity,1)}
@media(max-width:600px){.opening{padding:27px 7% 25px}.wordmark{font-size:15px;letter-spacing:4px}.wordmark span{font-size:6px;letter-spacing:2.4px}.signature{width:88vw;margin-left:-1vw}.intro{padding-bottom:35px}h1{font-size:32px;letter-spacing:-1px}.opening-foot{flex-wrap:wrap;justify-content:center;text-align:center;gap:16px;font-size:9px}.opening-foot>span:first-child{width:100%}.opening-foot>span:last-child{display:none}.trail-copy{left:8%;top:20%}.trail-copy p{font-size:43px;letter-spacing:-1.6px}.walking-lyra{width:230px;bottom:20%}.closing h2{letter-spacing:-4px;font-size:100px}.closing>p:not(.closing-brand){font-size:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.journey{height:100svh}.walking-lyra,.trail-copy,.scroll-note{display:none}.curtain{transform:translate(-50%,-50%) scale(1)}.closing{opacity:1;transform:none}}
/* Lyra's walk draws a black curtain across the viewport. */
.walking-lyra{width:clamp(180px,25vw,350px);aspect-ratio:3/4;bottom:8%;z-index:5;transform:translateY(var(--bob,0px));filter:drop-shadow(0 3px 1px #0001)}.lyra-art{background-image:url('lyra-walk.png');background-size:400% 100%;background-position:var(--frame-x,0%) 0;background-repeat:no-repeat;mix-blend-mode:normal}.curtain{left:0;top:0;width:100%;height:100%;border-radius:0;transform:none;clip-path:inset(0 calc(100% - var(--wipe,0%)) 0 0);will-change:clip-path}.closing{z-index:6}.journey{height:310vh}
@media(max-width:600px){.walking-lyra{width:180px;bottom:12%}}
@media(prefers-reduced-motion:reduce){.curtain{clip-path:none}.walking-lyra{display:none}}
/* Remove the cream tint from the logo sheet before blending into the page. */
.signature{filter:grayscale(1) contrast(1.15) brightness(1.12);mix-blend-mode:multiply;background-color:transparent}
/* Fill the mobile viewport when browser controls collapse, including overscroll. */
html,body{background:var(--ink)}
.opening{background:var(--paper)}
.stage{height:100vh;height:100dvh}
.journey{background:var(--ink)}
.closing-note{bottom:max(40px,env(safe-area-inset-bottom))}
@media(prefers-reduced-motion:reduce){.journey{height:100vh;height:100dvh}}
.closing{padding-bottom:max(25px,env(safe-area-inset-bottom));pointer-events:auto;visibility:var(--closing-visibility,hidden)}
.closing h2{font-size:clamp(64px,10vw,140px);margin-bottom:18px}
.partnership{max-width:510px;margin-top:20px}
.partnership p{font-size:11px;line-height:1.6;color:#bdbab2;margin:0 0 10px}
.partner-button{display:inline-block;border:1px solid #f7f4ed;padding:12px 22px;font-size:12px;margin-top:7px;color:#f7f4ed}
.partner-button:hover{background:#f7f4ed;color:#171717}
.partner-email{display:block;font-size:10px;color:#bdbab2;margin-top:12px}
@media(max-width:600px){.closing-brand{top:25px}.closing{padding-top:95px;justify-content:center}.closing h2{font-size:70px;margin-bottom:10px}.closing>p:not(.closing-brand){font-size:11px;margin:12px 0}.partnership{margin-top:14px;max-width:330px}.partnership p{font-size:10px}.partner-button{padding:11px 19px}}
@media(max-height:640px){.closing{padding-top:75px}.closing h2{font-size:54px}.closing-brand{top:18px}.partnership{margin-top:10px}.partnership p{font-size:10px;margin-bottom:7px}}
@media(prefers-reduced-motion:reduce){.closing{visibility:visible}}
.scroll-note{opacity:var(--hint-opacity,1);color:var(--hint-color,#171717);z-index:6;letter-spacing:1px;text-transform:none;font-size:11px;pointer-events:none}
@media(prefers-reduced-motion:reduce){.scroll-note{display:none}}
.signature{background-image:url('brand-bottomless.png')}
.signature{background-image:url('brand-no-spout.png')}