/* Scroll-led product chapters. Images retain their original proportions. */
.gallery{display:block;padding:0 4vw}
.gallery>article{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(240px,1fr);gap:3vw;align-items:center;overflow:visible;border:0;padding:18px 0;min-height:0!important;opacity:1;transform:none}
.gallery>article>img{position:sticky;top:130px;display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;transform:translateY(var(--photo-shift,0px));transition:none;will-change:transform}
.gallery>article>div{position:relative;align-self:center;padding:40px 0;max-width:340px;transform:translateY(var(--copy-shift,0px));transition:none}
.gallery article:hover img{transform:translateY(var(--photo-shift,0px))}
.gallery h2,.gallery h3{font-size:clamp(28px,3.2vw,48px);line-height:1.08;letter-spacing:-.04em;margin:20px 0}
.gallery p{font-size:16px;line-height:1.65}
.gallery span{font-size:12px;letter-spacing:.12em}
@media(prefers-reduced-motion:reduce){
 .gallery>article{min-height:0!important;padding:24px 0;gap:20px}
 .gallery>article>img{position:static;transform:none!important;will-change:auto}
 .gallery>article>div{transform:none!important;padding:0}
}
@media(max-width:800px){
 .gallery{padding:0 22px}
 .gallery>article{display:block;min-height:0!important;padding:30px 0;gap:20px}
 .gallery>article>img{position:relative;top:auto;transform:translateY(var(--photo-shift,0px))}
 .gallery>article>div{max-width:540px;padding:20px 0 8px}
 .gallery h2,.gallery h3{font-size:30px;margin:12px 0}
}

/* Quiet navigation and tactile controls. */
html{scroll-padding-top:82px}
.topline{display:none}
.site-header{height:64px;position:sticky;top:0;z-index:60;padding:0 max(24px,calc((100vw - 1240px)/2));display:flex;justify-content:space-between;gap:32px;background:rgba(250,250,248,.88);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:0;border-bottom:1px solid #17171312}
.site-header .wordmark{width:88px}
.site-header nav{display:flex;gap:36px;align-items:center}
.site-header nav a{font-size:13px;padding:14px 0;color:#42423e;transition:color .2s}
.site-header .pill{font-family:var(--sans);font-size:13px;min-height:36px;padding:8px 18px;letter-spacing:0;text-transform:none}
.menu-toggle{display:none}
.mobile-nav[hidden]{display:none}
.mobile-nav{position:fixed;top:64px;left:0;right:0;z-index:59;padding:22px;background:#fafaf8;box-shadow:0 18px 32px #0001}
.mobile-nav a{display:block;font-size:24px;padding:14px 0;border-bottom:1px solid var(--line)}
.mobile-nav .button{margin-top:20px}
.button,.pill,.menu-toggle{touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform .18s ease,background-color .18s ease,color .18s ease,box-shadow .18s ease}
.button:focus-visible,.pill:focus-visible,.menu-toggle:focus-visible,a:focus-visible{outline:2px solid #171713;outline-offset:5px}
.button:active,.pill:active,.button.is-pressed,.pill.is-pressed{transform:scale(.96);background:#171713!important;color:#fff!important;box-shadow:0 2px 6px #0002}
.hero .actions .button{border-radius:100px;font-family:var(--sans);font-size:14px;letter-spacing:0;text-transform:none}
@media(hover:hover) and (pointer:fine){
 .button:hover,.pill:hover{transform:translateY(-3px);box-shadow:0 8px 20px #17171318}
 .hero .button-line:hover{background:#171713;color:#fff}
 .site-header nav a:hover{color:#000}
}
@media(max-width:800px){
 .site-header{height:60px;padding:0 22px;gap:18px}
 .site-header nav,.site-header>.pill{display:none}
 .site-header .wordmark{width:86px}
 .menu-toggle{display:block;border:0;background:transparent;color:var(--ink);font:14px var(--sans);padding:12px;min-height:44px}
 .mobile-nav{top:60px}
}
@media(prefers-reduced-motion:reduce){.button,.pill,.menu-toggle{transition:none}.gallery>article>img,.gallery>article>div{transform:none!important;will-change:auto}}