/* The same personal diary, composed as a sequence of photographic frames. */
:root{--cinema-ease:cubic-bezier(.19,1,.22,1)}
.header .wordmark{justify-self:center}
.reading-line{position:fixed;inset:0 0 auto;height:2px;z-index:30;pointer-events:none;background:transparent}
.reading-line i{display:block;height:100%;background:#ffa69b;transform:scaleX(0);transform-origin:left}
.introduction{position:relative;padding-top:46px;padding-bottom:48px;overflow:clip}
.intro-editorial{grid-template-columns:1.12fr 1fr;gap:7vw;margin:80px 0 85px}
.intro-copy{position:relative;z-index:1}
.introduction .statement{font-size:clamp(5rem,9.8vw,11rem);line-height:1.08}
.intro-photograph{margin:25px 0 0}
.editorial-shot{border-radius:48% 48% 2px 2px;box-shadow:18px 22px 0 #39091188;isolation:isolate}
.editorial-shot img{aspect-ratio:4/5;object-position:52% 50%}
.intro-photo-label{padding-top:75px}
.intro-bottom{color:#f0d4cf}
.daily-frame{border-top:1px solid #f8eee224}
.daily-frame-media{padding:0;border:0;background:none;overflow:hidden;border-radius:3px}
.daily-frame-open{inset:auto 0 0;padding:60px 22px 22px}
.daily-frame-meta{display:grid;grid-template-columns:1fr auto;gap:4px 20px;padding-top:20px;border-top:1px solid var(--line)}
.daily-frame-meta>.small{grid-column:1/-1}
.daily-frame-meta h3{margin:5px 0}
.daily-frame-meta>p{align-self:end;margin-bottom:6px;font-size:1rem;max-width:18ch;text-align:right}
.american-chapter{overflow:clip}
.journey-heading{align-items:end}
.landscape-feature{margin-left:-6vw;margin-right:-6vw}
.landscape-feature>button{display:block;position:relative;width:100%;padding:0;overflow:hidden;isolation:isolate;clip-path:inset(0 var(--frame-inset,0%) round var(--frame-radius,0px));will-change:clip-path}
.landscape-feature img{display:block;width:100%;aspect-ratio:16/9;max-height:88svh;object-fit:cover;object-position:50% 55%;transform:translateY(var(--image-drift,0px)) scale(1.08);will-change:transform}
.landscape-feature figcaption{padding:18px 6vw 0}
.feature-open{right:7vw;bottom:32px;background:#710f20e6;color:var(--cream);border:1px solid #f8eee25a;backdrop-filter:blur(8px)}
.memory-portrait{box-shadow:0 30px 65px #4e192025;transform:rotate(-5deg)}
.place-notes{border-top:1px solid #650b1035;padding-top:36px}
.journey-map{background:transparent;border-top:1px solid #650b1035;padding-left:0;padding-right:0}
.route-stop{transition:background .35s,color .35s}
.route-stop.active{background:#710f2009}
.motion-memories{position:relative;overflow:clip;background:#360d18;padding-bottom:115px}
.motion-heading{align-items:end}
.film-grid{gap:20px;perspective:1600px;padding:20px 0 35px}
.film-card{border-radius:4px;border:1px solid #ffe5de55;isolation:isolate;transform:translateY(var(--film-drop,0px)) rotate(var(--film-angle,0deg));transition:transform .7s var(--cinema-ease),box-shadow .7s var(--cinema-ease);box-shadow:0 22px 40px #09030870}
.film-card:nth-child(1){--film-angle:-6deg;--film-drop:24px}
.film-card:nth-child(2){--film-angle:-2deg;--film-drop:0px}
.film-card:nth-child(3){--film-angle:3deg;--film-drop:8px}
.film-card:nth-child(4){--film-angle:7deg;--film-drop:38px}
.film-card:nth-child(even){transform:translateY(var(--film-drop)) rotate(var(--film-angle))}
.film-card:hover,.film-card:focus-visible{z-index:3;transform:translateY(-16px) rotate(0deg);box-shadow:0 36px 70px #080206b0}
.film-card img{aspect-ratio:3/5;filter:none;transition:transform 1s var(--cinema-ease)}
.film-card:hover img{transform:scale(1.04)}
.film-card:after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,#0002,transparent 38%,#080509d9);pointer-events:none}
.film-card:before{display:none}
.film-preview{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s;pointer-events:none}
.film-card.is-previewing .film-preview{opacity:1}
.film-caption,.film-play{z-index:2}
.film-play{border:1px solid #fff8;backdrop-filter:blur(8px);transition:background .3s,transform .3s}
.film-card.is-previewing .film-play{background:#710f20c9;transform:scale(.85)}
.gallery-stage{background:radial-gradient(ellipse at 50% 50%,#4b1627,#170c12 76%)}
.gallery-word{color:#edaaac;opacity:.12;font-size:clamp(8rem,24vw,27rem)}
.archive{background:#170c12}
.archive-toolbar{position:relative;border-top:1px solid var(--line);padding-top:24px}
.archive-image{padding:0;border:0;background:none;box-shadow:none}
.archive-card:hover .archive-image,.archive-card:focus-within .archive-image{transform:translateY(-5px);box-shadow:none}
.open-archive-photo{overflow:hidden;border-radius:2px}
.archive-card-caption{padding-top:22px;border-top:1px solid var(--line);margin-top:20px}
.archive-card-caption h3{margin-top:6px}
.archive-card[data-kind=photo] .open-archive-photo img{transition:transform 1.2s var(--cinema-ease)}
.open-archive-photo:hover img{transform:scale(1.025)}
.favorite-button{backdrop-filter:blur(8px);background:#710f20d9}
.personal-story{position:relative;background:linear-gradient(145deg,#710f20,#410d1b)}
.story-ending{padding-top:35px;border-top:1px solid #f8eee24a;font-style:italic}
.story-interests{border-top:1px solid var(--line);padding-top:25px}
footer{position:relative;background:#100b10;overflow:clip}
.footer-frame{position:relative;z-index:1}
.footer-frame h2{font-size:clamp(4rem,9.8vw,11rem)}
.back-top{gap:40px}
.back-top span{display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--line);border-radius:50%;transition:transform .45s var(--cinema-ease),background .35s}
.back-top:hover span{transform:translateY(-5px);background:#710f20}
.navigation{overflow:auto;padding:35px 6vw;background:#210c15;isolation:isolate}
.navigation[open]{align-items:flex-start}
.navigation>.wordmark{position:relative;z-index:2}
.navigation nav{width:53%;max-width:740px;gap:8px;position:relative;z-index:2}
.navigation nav a{font-size:clamp(2rem,4.7vw,5rem);line-height:1.24;padding:18px 0}
.navigation nav a:hover{padding-left:12px;color:#ffc2ae}
.navigation>.small{position:relative;z-index:2;padding-top:16px}
.menu-scene{position:absolute;inset:0 0 0 61%;z-index:-1;overflow:hidden;background:#150b10}
.menu-scene img{width:100%;height:100%;object-fit:cover;object-position:52% 50%;opacity:.7}
.menu-scene:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#210c15,transparent 25%),linear-gradient(0deg,#210c1599,transparent 60%)}
.navigation .close-menu{z-index:4}
.title-word{display:inline-block;transform-origin:50% 100%;vertical-align:baseline}
@media(min-width:1600px){.landscape-feature{margin-left:calc(-1 * max(6vw,calc((100vw - 1480px)/2)));margin-right:calc(-1 * max(6vw,calc((100vw - 1480px)/2)))} }
@media(max-width:1000px){.intro-editorial{gap:5vw}.daily-frame-meta{display:block}.daily-frame-meta>p{text-align:left;max-width:none}.film-grid{gap:30px}.film-card img{aspect-ratio:4/5}.film-card:nth-child(n){--film-angle:0deg;--film-drop:0px}.film-caption{font-size:2rem}.navigation nav{width:60%}.menu-scene{left:57%}}
@media(max-width:700px){
 .introduction{padding-top:32px;padding-bottom:32px}.intro-editorial{grid-template-columns:1fr;gap:40px;margin:40px 0}.introduction .statement{font-size:clamp(4rem,17vw,6.8rem)}.intro-photograph{margin:0 12px 0 0}.editorial-shot img{aspect-ratio:4/5}.editorial-shot{box-shadow:12px 14px 0 #39091188}
 .daily-frame-open{padding:50px 14px 14px}.landscape-feature{margin-left:-24px;margin-right:-24px}.landscape-feature>button{clip-path:none;will-change:auto}.landscape-feature img{aspect-ratio:4/3;transform:none;will-change:auto}.landscape-feature figcaption{padding:16px 24px 0}.feature-open{right:24px;bottom:20px}
 .motion-memories{padding-bottom:65px}.film-grid{gap:16px;padding:0}.film-card:nth-child(n){transform:none}.film-card img{aspect-ratio:3/5}.film-caption{font-size:1.4rem}.film-play{bottom:122px}.place-notes{padding-top:28px}.journey-map{padding-left:0;padding-right:0}
 .navigation{padding:30px 24px}.navigation nav{width:100%;gap:6px}.navigation nav a{font-size:clamp(1.8rem,7vw,2.8rem);padding:14px 0}.menu-scene{left:20%;opacity:.28}.menu-scene:after{background:linear-gradient(90deg,#210c15,transparent)}.navigation>.small{font-size:12px}.close-menu{background:#210c1580;border-radius:3px}
 .footer-frame h2{font-size:clamp(3.2rem,13vw,5rem)}.archive-card-caption{padding-top:15px;margin-top:15px}
}
@media(prefers-reduced-motion:reduce){.landscape-feature>button{clip-path:none;will-change:auto}.landscape-feature img{transform:none;will-change:auto}.film-card:nth-child(n),.film-card:hover,.film-card:focus-visible{transform:none}.film-preview{display:none}.title-word{transform:none!important;opacity:1!important}}
