/* WAKA reference: photos 1:1.24/1.25; single poster 1:2.08, paired 1:1.707.
   Two-photo layout: small left (29.1667% minus gutter), large right (66.6667%). */
html:has(.hero-page),.hero-page{background:#d3d1c9;color:#20201e}
.hero-page .intro-sheet{position:relative;isolation:isolate;transform-origin:0 0;background:#f5f4ef;width:100%;aspect-ratio:25/52}
.hero-page .intro-sheet[data-layout="pair"]{aspect-ratio:1000/1707}
.hero-page .paper-clip{position:absolute;inset:0;overflow:hidden;z-index:-1;pointer-events:none}
.hero-page .paper-sheet{position:absolute;inset:0;background:#f5f4ef}
.hero-page .paper-sheet:after{content:"";position:absolute;inset:0;background:url('assets/paper-grain.svg') center/cover;opacity:.06}
.hero-page .site-header{position:fixed;top:0;left:0;right:0;height:clamp(60px,6.3vw,90px);padding:0 1.6cqw;background:rgba(245,244,239,.94);z-index:60}
.hero-page .site-header nav{font-size:clamp(14px,1.35vw,24px);gap:1.8cqw}
.hero-page .brand{width:7cqw}.hero-page .brand img{width:100%}.hero-page .location{font-size:clamp(12px,.8vw,16px)}
.hero-page .menu-dot{border:0;padding:0;cursor:pointer;width:12px;height:12px}
.hero-page .home-main{display:block;padding:7cqw 1.6cqw 0;overflow:visible}
.hero-page .home-wordmark,.hero-page .home-footer-wordmark{width:100%;height:30cqw;display:flex;align-items:center;overflow:hidden;line-height:0}
/* Keep the MAREVE identity undistorted within the reference's wordmark bands. */
.hero-page .home-wordmark img,.hero-page .home-footer-wordmark img{width:100%;height:auto}
.hero-gallery{width:100%;margin:.6cqw auto 0;position:relative}
.hero-image-wrap{position:relative;width:100%;aspect-ratio:25/31;overflow:hidden;background:#d7d5cf}
.hero-project{display:block;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:0;overflow:hidden;cursor:pointer}
.hero-project img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--crop,50% 50%);user-select:none}
.hero-project[hidden]{display:none}
[data-layout="pair"] .hero-image-wrap{display:flex;align-items:flex-start;justify-content:space-between;aspect-ratio:auto;overflow:visible;background:transparent;margin:0 -.8cqw;width:calc(100% + 1.6cqw)}
[data-layout="pair"] .hero-project{flex:0 1 66.6667%;width:66.6667%;height:auto;aspect-ratio:25/31;margin:0 .8cqw;order:2}
[data-layout="pair"] .hero-project-secondary{flex:0 1 calc(29.1667% - 1.6cqw);width:calc(29.1667% - 1.6cqw);aspect-ratio:4/5;order:1}
[data-layout="pair"][data-alignment="reverse"] .hero-project{order:1}
[data-layout="pair"][data-alignment="reverse"] .hero-project-secondary{order:2}
.hero-page .home-footer{display:block;padding:.6cqw 1.6cqw 0;overflow:visible}
.hero-page .home-footer .footer-meta{position:absolute;bottom:1.3cqw;left:1.05cqw;right:1.05cqw;margin:0;padding:0;font-size:clamp(12px,1vw,20px);line-height:1.6}
.hero-page .intro-side-copy{display:none}
.hero-page.intro-running{height:100svh;overflow:hidden}
.hero-page.intro-running .intro-sheet{pointer-events:none;will-change:transform;background:transparent}
.hero-page.intro-running .paper-sheet{transform:translateY(101%)}
.hero-page.intro-running .hero-gallery,.hero-page.intro-running .site-header,.hero-page.intro-running .footer-meta{opacity:0}
.hero-page.intro-running .home-wordmark img,.hero-page.intro-running .home-footer-wordmark img{transform:translateY(220%)}
.hero-page a:focus-visible,.hero-page button:focus-visible{outline:2px solid #20201e;outline-offset:4px}
@media(max-width:760px){
 .hero-page .site-header{height:60px;padding:0 12px;display:flex;justify-content:space-between;gap:10px}.hero-page .brand{width:65px;flex-shrink:0}
 .hero-page .site-header nav{font-size:14px;gap:12px;margin:0}.hero-page .site-header nav a{display:block}.hero-page .location{display:none}.hero-page .menu-dot{flex-shrink:0}
 .hero-page .home-main{padding-top:60px}
 .hero-page .home-wordmark,.hero-page .home-footer-wordmark{height:25cqw}
 .hero-page .home-footer .footer-meta{position:static;margin-top:4cqw;padding:0 8px 16px;font-size:12px;row-gap:16px}
 .hero-page .intro-sheet{min-height:208cqw;aspect-ratio:auto}
 .hero-page .intro-sheet[data-layout="pair"]{min-height:171cqw;aspect-ratio:auto}
}
@media(max-width:380px){.hero-page .site-header nav{gap:8px;font-size:12px}.hero-page .brand{width:58px}}