/* Washi: one room composition followed by three quiet material studies. */
.wx{--wx-ink:#302f2a;--wx-soft:#716b61;--wx-body:#4c4942;--wx-m:clamp(24px,3.333vw,56px);background:transparent;color:var(--wx-ink)}
.wx *{box-sizing:border-box}
.wx h2{margin:0;font:400 17px/1.4 Inter,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--wx-ink)}
.wx .jp{display:inline-block;margin-left:18px;font:400 12px/1 "Noto Serif JP",serif;letter-spacing:.3em;color:var(--wx-soft);vertical-align:middle}
.wx .sub{margin:20px 0 28px;font:italic 400 18px/1.5 "PT Serif",Georgia,serif;color:var(--wx-soft)}
.wx p.t{margin:18px 0 0;font:400 15px/1.8 "PT Serif",Georgia,serif;color:var(--wx-body);text-wrap:pretty}
.wx .more{display:inline-block;margin:0;font:italic 400 14px/1.5 "PT Serif",Georgia,serif;color:var(--wx-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:7px}
.wx .more:hover{color:var(--wx-soft)}
.wx .more:focus-visible{outline:2px solid currentColor;outline-offset:7px}
.wx .wcap{margin-top:18px}
.wx .wcap b{display:block;font:500 10.5px/1.4 Inter,Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--wx-ink)}
.wx .wcap>span{font:italic 400 12px/1.5 "PT Serif",Georgia,serif;color:var(--wx-soft)}
.wx .bw-caption-story{margin:14px 0 0;font:400 14px/1.8 "PT Serif",Georgia,serif;color:var(--wx-body);text-wrap:pretty}
.wx img{display:block;max-width:100%}
.wx .wph{position:relative;overflow:hidden;background:#e6dfd3}
.wx .wph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
html body .wx .wph img{max-height:none!important}
.bw{padding:100px var(--wx-m) 100px;max-width:1440px;margin:0 auto;scroll-margin-top:110px}
.bw-top{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:1fr auto 1fr auto 1fr;column-gap:24px}
.bw-room{grid-column:1/7;grid-row:1/6;margin:0}
.bw-room .wph{aspect-ratio:1812/2400}
.bw-text{grid-column:8/12;grid-row:2;max-width:340px}
.bw-close{grid-column:8/13;grid-row:4;display:grid;grid-template-columns:110px minmax(0,220px);gap:26px;align-items:center;margin:60px 0 0}
.bw-close .wph{aspect-ratio:4/5}
.bw-close .wcap{margin:0}
.bw-steps{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;margin-top:140px;align-items:start}
.bw-step{margin:0;grid-row:1}
.bw-step:nth-child(1){grid-column:2/5}
.bw-step:nth-child(2){grid-column:6/9;margin-top:72px}
.bw-step:nth-child(3){grid-column:10/13;margin-top:144px}
.bw-step .wph{width:100%;aspect-ratio:4/5}
.bw-step:nth-child(2) img{object-position:66% 62%}
.bw-step .wcap{max-width:29ch;margin-top:24px}
.bw-discover{margin-top:64px;text-align:right}
.wx-js .wx .fadein{opacity:0;transition:opacity 1.1s ease}
.wx-js .wx .fadein.in{opacity:1}
.wx-js .wx .rise{opacity:0;transform:translateY(16px);transition:opacity 650ms ease,transform 650ms ease}
.wx-js .wx .rise.in{opacity:1;transform:none}
@media(max-width:820px){
 .bw{padding:72px 24px;scroll-margin-top:80px}
 .bw-top{display:flex;flex-direction:column}
 .bw-text{order:1;max-width:34ch}
 .bw-room{order:2;margin-top:44px}
 .bw-close{order:3;grid-template-columns:90px minmax(0,1fr);gap:24px;margin-top:56px;max-width:430px}
 .wx .bw-close .bw-caption-story{font-size:13px;line-height:1.75}
 .bw-steps{display:flex;flex-direction:column;gap:72px;margin-top:88px}
 .bw-step:nth-child(n){width:76%;max-width:340px;margin:0}
 .bw-step:nth-child(2){align-self:flex-end}
 .bw-step .wcap{max-width:none;margin-top:22px}
 .bw-discover{margin-top:48px;text-align:left}
}
@media(prefers-reduced-motion:reduce){.wx-js .wx .fadein,.wx-js .wx .rise{opacity:1!important;transform:none!important;transition:none!important}}
