@font-face{font-family:Inter;src:url('assets/inter-latin-400-normal.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Cormorant;src:url('assets/cormorant-garamond-latin-400-normal.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Cormorant;src:url('assets/cormorant-garamond-latin-400-italic.woff2') format('woff2');font-style:italic;font-weight:400;font-display:swap}
:root{color-scheme:dark;--paper:#eee9df;--ink:#101010;--muted:#afa99d}
*{box-sizing:border-box}html{scroll-behavior:auto;scroll-padding-top:0}body{margin:0;background:var(--ink);color:var(--paper);font-family:Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid #e9d5b3;outline-offset:8px}::selection{background:#dbc6a8;color:#111}.skip{position:fixed;top:12px;left:12px;z-index:100;background:#eee;color:#111;padding:14px;transform:translateY(-180%)}.skip:focus{transform:none}
.header{position:absolute;z-index:30;top:0;left:0;width:100%;padding:30px 3.5vw;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:17px;font-size:15px;letter-spacing:3px}.brand-sub{padding-left:17px;border-left:1px solid #ffffff40;font-size:10px;letter-spacing:4px}.header-link{font-size:11px;display:flex;gap:24px;align-items:center}.header-link span{font-size:22px}.opening{position:relative}.stage{height:100svh;min-height:560px;position:relative;overflow:hidden;background:#101010}.ambient{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 35%,#343536 0, #191919 42%,#101010 75%)}
.frame{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:36vw;height:80svh;overflow:hidden;background:#29292a;will-change:width,height}.portrait{position:absolute;inset:0;margin:0;overflow:hidden}.portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0%;will-change:transform}.second{clip-path:inset(0 0 0 100%)}.second img{object-position:50% 0%}.light-veil{position:absolute;inset:0;background:linear-gradient(100deg,#080909 12%,#080909ed 34%,#08090910 58%,#080909a6 100%);opacity:.74;pointer-events:none}.bottom-shade{position:absolute;inset:0;background:linear-gradient(0deg,#090909bd 0%,transparent 48%);pointer-events:none}
.intro{position:absolute;left:0;right:0;bottom:16svh;text-align:center;z-index:4;pointer-events:none}.eyebrow{font-size:9px;font-weight:400;letter-spacing:3px;line-height:1.6;margin:0 0 25px}.intro h1{font-family:Cormorant,Georgia,serif;font-size:clamp(76px,9.4vw,166px);font-weight:400;line-height:.84;letter-spacing:-.045em;margin:0;text-shadow:0 2px 30px #0004}em{font-weight:400}.intro h1 em{line-height:1.06}.signature{position:absolute;left:7vw;top:44%;font:400 clamp(50px,6.5vw,110px)/.89 Cormorant,Georgia,serif;letter-spacing:-.035em;opacity:0;visibility:hidden;z-index:5}.signature span,.signature em{display:block}.signature em{margin-left:3vw}.third-scene{position:absolute;inset:0;clip-path:inset(100% 0 0 0);background:#151414;z-index:6}.third-photo{position:absolute;right:0;top:0;width:58%;height:100%;overflow:hidden}.third-photo img{height:100%;width:100%;object-fit:cover;object-position:50% 32%;display:block}.third-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#151414 0,transparent 25%),linear-gradient(0deg,#0006,transparent 35%)}.third-copy{position:absolute;left:7vw;top:50%;transform:translateY(-50%);z-index:2}.third-copy h2{font:400 clamp(60px,7.2vw,120px)/.86 Cormorant,Georgia,serif;letter-spacing:-.035em;margin:0}.third-copy em{color:#c3b4a1}.third-copy .eyebrow{color:#c3b4a1;margin-bottom:32px}
.scene-caption{position:absolute;left:3.5vw;bottom:39px;display:flex;gap:13px;align-items:center;z-index:10;font-size:10px;letter-spacing:1px}.scene-number{color:#ddd4c7}.caption-line{width:30px;height:1px;background:#b6aea066}.scene-word{color:#d2ccc3}.location{position:absolute;right:3.5vw;bottom:39px;font-size:8px;letter-spacing:2px;z-index:10;color:#c6c0b7}.location span{margin:0 9px}.scroll-cue{position:absolute;left:50%;transform:translateX(-50%);bottom:0;display:flex;align-items:center;flex-direction:column;gap:15px;z-index:11;font-size:8px;letter-spacing:2.5px}.scroll-line{width:1px;height:29px;background:linear-gradient(transparent,#c7bdab)}.progress{position:absolute;bottom:0;left:0;width:100%;height:2px;z-index:15;background:#ffffff08}.progress span{height:100%;width:100%;display:block;background:#c8b799;transform:scaleX(0);transform-origin:left}.scroll-marker{position:absolute;top:27%;left:0;width:1px;height:1px;pointer-events:none}
.sequence-end{min-height:64svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:90px 24px 80px;text-align:center;position:relative;background:#101010}.sequence-end .eyebrow{color:#a9a295}.end-title{font:400 clamp(54px,6.8vw,110px)/.92 Cormorant,Georgia,serif;letter-spacing:-.035em;margin:4px 0 30px}.end-title em{color:#bdb09e}.preview-note{font-size:10px;line-height:1.7;color:#9c978e;margin:0 0 25px}.replay{font-size:11px;border-bottom:1px solid #8e81734d;padding:10px 0;display:flex;gap:35px}.replay span{font-size:18px}.motion-control{position:fixed;bottom:12px;right:15px;z-index:40;color:#b9b2a7;border:0;background:#151515c9;border-radius:2px;font-size:9px;padding:7px 9px;cursor:pointer;opacity:.7}.motion-control:hover,.motion-control:focus-visible{opacity:1}.noscript{padding:20px;line-height:1.6}
@media(min-width:1800px){.frame{width:34vw;height:83svh}}
@media(max-width:700px){.header{padding:24px 22px}.brand{font-size:11px;letter-spacing:2px;gap:10px}.brand-sub{font-size:8px;letter-spacing:2px;padding-left:10px}.header-link{font-size:9px;gap:9px}.header-link span{font-size:17px}.stage{min-height:520px}.frame{width:78vw;height:72svh;top:46%}.portrait img{object-position:50% 0%}.intro{bottom:16svh;padding:0 12px}.intro .eyebrow{font-size:7px;letter-spacing:2.5px;margin-bottom:20px}.intro h1{font-size:clamp(60px,16.3vw,110px);line-height:.87}.signature{left:8vw;top:auto;bottom:17svh;font-size:15vw;text-shadow:0 2px 20px #0008}.signature em{margin-left:7vw}.scene-caption{left:22px;bottom:46px;font-size:8px;gap:10px}.caption-line{width:20px}.location{right:22px;bottom:47px;font-size:6px;letter-spacing:1.4px}.location span{margin:0 4px}.scroll-cue{font-size:7px;letter-spacing:2px;gap:10px}.scroll-line{height:23px}.third-photo{width:100%;height:100%}.third-photo img{object-position:50% 25%}.third-photo:after{background:linear-gradient(0deg,#111e 0, #1113 27%,transparent 53%)}.third-copy{left:8vw;top:auto;bottom:12svh;transform:none}.third-copy .eyebrow{font-size:8px;letter-spacing:2.5px;margin-bottom:17px}.third-copy h2{font-size:15.5vw;line-height:.85}.third-copy h2 em{color:#eee6d9}.sequence-end{min-height:60svh}.motion-control{bottom:10px;right:10px;font-size:8px}.sequence-end .eyebrow{font-size:8px}}
@media(max-height:600px) and (min-width:701px){.stage{min-height:420px}.header{padding-top:20px}.intro h1{font-size:17vh}.intro{bottom:15vh}.eyebrow{margin-bottom:15px}.third-copy h2{font-size:15vh}}
/* Photographs remain readable without animation or when reduced motion is selected. */
body.static-mode .opening{height:auto!important}body.static-mode .stage{height:auto;min-height:0;overflow:visible;padding-top:90px}body.static-mode .frame{position:relative;left:auto;top:auto;transform:none;width:100%;height:auto;display:grid;grid-template-columns:1fr 1fr;background:none}body.static-mode .portrait{position:relative;inset:auto;clip-path:none!important;aspect-ratio:2/3}body.static-mode .portrait img{transform:none!important}body.static-mode .light-veil,body.static-mode .bottom-shade,body.static-mode .ambient,body.static-mode .signature,body.static-mode .scroll-cue,body.static-mode .scene-caption,body.static-mode .location,body.static-mode .progress{display:none}body.static-mode .intro{position:relative;bottom:auto;opacity:1!important;transform:none!important;padding:40px 20px;visibility:visible!important}body.static-mode .intro h1{font-size:clamp(65px,9vw,130px)}body.static-mode .third-scene{position:relative;clip-path:none!important;height:90svh;min-height:600px}body.static-mode .third-copy{opacity:1!important;transform:translateY(-50%)!important}body.static-mode .third-photo img{transform:none!important}@media(max-width:700px){body.static-mode .frame{grid-template-columns:1fr}body.static-mode .third-copy{transform:none!important}body.static-mode .third-scene{min-height:650px}}