/* Noah & Cookie — shared styles
   Palette: Soft Ivory #F6F4EF / Sand Beige #D9D0C2 / Ocean Mist #A9C5D1
            Stone Grey #777C79 / Deep Charcoal #292B29 / White #FFFFFF */
:root{
  --ivory:#F6F4EF; --sand:#D9D0C2; --mist:#A9C5D1; --grey:#777C79; --char:#292B29; --white:#FFFFFF;
  --hair:#e3e0d8;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:"Inter","Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP",sans-serif;color:var(--char);background:var(--white);-webkit-font-smoothing:antialiased;}
img{display:block;width:100%;height:100%;object-fit:cover;}
a{color:inherit;}
.label{font-size:11px;letter-spacing:.35em;color:var(--grey);text-transform:uppercase;margin-bottom:18px;}
.label .viewall{float:right;font-size:11px;letter-spacing:.2em;text-transform:none;}
.label .viewall a{text-decoration:none;color:var(--char);border-bottom:1px solid var(--char);padding-bottom:2px;}
section{padding:180px 6vw;}
h1{font-size:clamp(26px,3.6vw,40px);font-weight:500;line-height:1.6;letter-spacing:.04em;}
h2{font-size:clamp(23px,3.2vw,36px);font-weight:500;line-height:1.6;letter-spacing:.04em;}
p{font-size:15px;line-height:2.1;color:#3c3f3d;}
.lead{max-width:680px;}
.more{margin-top:34px;font-size:12px;letter-spacing:.25em;}
.more a{text-decoration:none;border-bottom:1px solid var(--char);padding-bottom:3px;}
.poem{font-size:15px;line-height:2.6;letter-spacing:.05em;color:#3c3f3d;}
.poem .en{display:block;margin-top:26px;font-size:12.5px;line-height:2;letter-spacing:.06em;color:var(--grey);}
/* reveal on scroll — slow, small, quiet */
.reveal{opacity:0;transform:translateY(18px);transition:opacity 1.1s ease,transform 1.1s ease;}
.reveal.in{opacity:1;transform:none;}
/* ---------- header ---------- */
/* &CAT type: slim transparent bar, hamburger left, text wordmark centred, links right */
header.site{position:fixed;top:0;left:0;right:0;z-index:50;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:20px 4vw;}
header.site .logo{justify-self:center;font-size:14px;letter-spacing:.34em;padding-left:.34em;font-weight:500;text-decoration:none;white-space:nowrap;}
header.site.over{color:#fff;mix-blend-mode:difference;}
header.site.over.menu-open{mix-blend-mode:normal;}
header.site.solid{background:rgba(246,244,239,.94);color:var(--char);border-bottom:1px solid var(--hair);backdrop-filter:blur(6px);}
/* menu — button + panel, driven by site.js: tap toggles, link/outside/Escape close */
header.site .menu-wrap{justify-self:start;position:relative;}
header.site .menu-btn{display:flex;flex-direction:column;gap:6px;padding:12px 8px;background:none;border:0;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;}
header.site .menu-btn .bar{display:block;width:26px;height:1px;background:currentColor;transition:transform .35s ease;}
header.site .menu-btn[aria-expanded="true"] .bar:first-child{transform:translateY(3.5px) rotate(45deg);}
header.site .menu-btn[aria-expanded="true"] .bar:last-child{transform:translateY(-3.5px) rotate(-45deg);}
header.site .panel{position:absolute;left:0;top:48px;background:var(--ivory);border:1px solid var(--hair);padding:20px 26px;min-width:210px;z-index:60;box-shadow:0 18px 40px rgba(41,43,41,.12);}
header.site .panel[hidden]{display:none;}
header.site .panel a{display:block;padding:9px 0;font-size:12px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;color:var(--char);}
header.site .acts{justify-self:end;display:flex;gap:26px;align-items:center;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;}
header.site .acts a{text-decoration:none;}
header.site .acts a:hover{color:#C2C2C2;}
@media(max-width:760px){
  header.site{padding:16px 5vw;}
  header.site .acts a.store{display:none;}
  header.site .logo{font-size:13px;letter-spacing:.26em;padding-left:.26em;}
}
/* ---------- hero (TOP) ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:560px;overflow:hidden;padding:0;}
.hero .slide{position:absolute;inset:0;opacity:0;transition:opacity 2.4s ease;pointer-events:none;}
.hero .slide.on{opacity:1;pointer-events:auto;}
.hero .door{display:block;position:absolute;inset:0;text-decoration:none;}
.hero .tag{position:absolute;left:50%;transform:translateX(-50%);bottom:88px;z-index:3;color:#fff;text-align:center;text-shadow:0 1px 10px rgba(0,0,0,.4);width:max-content;max-width:88vw;}
.hero .tag::before{content:"";display:block;width:34px;height:1px;background:rgba(255,255,255,.75);margin:0 auto 14px;}
.hero .tag .en{display:block;font-size:11px;letter-spacing:.35em;text-transform:uppercase;}
.hero .tag .jp{display:block;margin-top:10px;font-size:clamp(19px,2.6vw,27px);font-family:"Hiragino Mincho ProN","YuMincho","Yu Mincho",serif;letter-spacing:.16em;}
.hero .tag .go{display:block;margin-top:12px;font-size:10px;letter-spacing:.3em;opacity:.75;}
.hero .vcopy{position:absolute;left:38px;top:50%;transform:translateY(-50%);writing-mode:vertical-rl;font-family:"Hiragino Mincho ProN","YuMincho","Yu Mincho",serif;font-size:15px;letter-spacing:.32em;color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.35);z-index:3;white-space:nowrap;}
.hero .dots{position:absolute;right:22px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:10px;z-index:3;}
.hero .dots i{display:block;width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.45);}
.hero .dots i.on{background:#fff;}
/* closing photo band — full-width photo slider, no text (&CAT closing type) */
.bandshow{position:relative;height:68vh;min-height:400px;overflow:hidden;padding:0;}
.bandshow .bslide{position:absolute;inset:0;opacity:0;transition:opacity 2.4s ease;}
.bandshow .bslide.on{opacity:1;}
.hero .set-m{display:none;}
.hero .wordmark{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;text-align:center;z-index:2;pointer-events:none;}
.hero .wordmark .wm{font-size:clamp(34px,6vw,64px);letter-spacing:.3em;font-weight:400;text-shadow:0 1px 14px rgba(0,0,0,.35);padding-left:.3em;}
.hero .wordmark .sub{margin-top:22px;font-size:12px;letter-spacing:.45em;text-shadow:0 1px 10px rgba(0,0,0,.4);padding-left:.45em;}
.hero .scroll{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);color:#fff;font-size:10px;letter-spacing:.4em;z-index:2;opacity:.85;}
/* ---------- TOP sections ---------- */
.concept{background:var(--ivory);text-align:center;}
.concept p{max-width:640px;margin:28px auto 0;}
.concept .wide{margin:70px auto 0;max-width:1180px;aspect-ratio:15.7/7;overflow:hidden;}
.concept .more{text-align:center;}
.chars{display:grid;grid-template-columns:1fr 1fr;gap:4vw;}
.char .ph{aspect-ratio:4/5;overflow:hidden;}
.char h3{margin-top:26px;font-size:22px;letter-spacing:.3em;font-weight:500;}
.char .from{margin-top:8px;font-size:12px;letter-spacing:.2em;color:var(--grey);}
.char p{margin-top:14px;}
.sessions-teaser{background:var(--ivory);}
.teaser-grid{display:grid;grid-template-columns:1fr 1fr;gap:4vw;margin-top:50px;}
.teaser{display:block;text-decoration:none;}
.teaser .ph{aspect-ratio:3/2;overflow:hidden;}
.teaser .ph.poster{aspect-ratio:3/2;background:var(--ivory);}
.teaser .ph.poster img{object-fit:contain;}
.teaser h3{margin-top:22px;font-size:18px;font-weight:500;letter-spacing:.12em;line-height:1.8;}
.teaser .cap{margin-top:6px;font-size:10px;letter-spacing:.3em;color:var(--grey);text-transform:uppercase;}
.coastal .grid{display:grid;grid-template-columns:1.4fr 1fr;gap:4vw;margin-top:50px;}
.coastal .a{aspect-ratio:4/3;overflow:hidden;}
.coastal .b{aspect-ratio:1/1;overflow:hidden;align-self:end;}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:4vw;margin-top:50px;}
.tile{position:relative;aspect-ratio:3/2;overflow:hidden;display:block;text-decoration:none;}
.tile .soon{position:absolute;inset:0;background:rgba(41,43,41,.38);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;letter-spacing:.35em;font-size:13px;padding-bottom:58px;}
.tile .soon small{margin-top:10px;font-size:10px;letter-spacing:.3em;opacity:.85;padding-left:.3em;}
.tile .tlabel{position:absolute;left:0;right:0;bottom:14px;text-align:center;color:#fff;font-size:11px;letter-spacing:.3em;text-shadow:0 1px 8px rgba(0,0,0,.45);}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:3vw;margin-top:50px;}
.post{display:block;text-decoration:none;}
.post .ph{aspect-ratio:1/1;overflow:hidden;}
.post .cat{margin-top:18px;font-size:10px;letter-spacing:.3em;color:var(--grey);}
.post h4{margin-top:8px;font-size:16px;font-weight:500;line-height:1.8;}
.post .wip{margin-top:6px;font-size:11px;letter-spacing:.2em;color:var(--grey);}
.journal-sec{background:var(--ivory);}
.newslist{margin-top:40px;border-top:1px solid var(--hair);}
.newslist a{display:flex;gap:40px;padding:22px 4px;border-bottom:1px solid var(--hair);text-decoration:none;font-size:14px;letter-spacing:.06em;}
.newslist time{color:var(--grey);font-size:12px;letter-spacing:.15em;white-space:nowrap;padding-top:2px;}
.band{padding:0;height:52vh;min-height:320px;position:relative;overflow:hidden;}
.band .cap{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;color:#fff;font-size:clamp(18px,2.6vw,26px);letter-spacing:.35em;text-shadow:0 1px 12px rgba(0,0,0,.45),0 0 30px rgba(20,24,20,.42),0 0 6px rgba(20,24,20,.55);padding-left:.35em;text-align:center;}
.insta{text-align:center;}
.insta p{max-width:560px;margin:24px auto 0;}
.insta .links{margin-top:30px;display:flex;justify-content:center;gap:36px;font-size:11px;letter-spacing:.25em;flex-wrap:wrap;}
.insta .links a{text-decoration:none;border-bottom:1px solid var(--char);padding-bottom:3px;}
/* ---------- sub pages ---------- */
.pagehead{padding:170px 6vw 70px;background:var(--ivory);}
.pagehead p{margin-top:24px;max-width:640px;}
/* photo chapter head — every sub page opens like a landing page */
.phead{position:relative;min-height:82vh;overflow:hidden;display:flex;align-items:flex-end;background:var(--char);}
.phead img.bg{position:absolute;inset:0;}
.phead::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(18,20,18,.58),rgba(18,20,18,.04) 55%);}
.phead .inner{position:relative;z-index:2;width:100%;padding:160px 6vw 66px;color:#fff;}
.phead .label{color:rgba(255,255,255,.78);}
.phead h1{text-shadow:0 1px 16px rgba(0,0,0,.35);}
.phead p{margin-top:24px;max-width:640px;color:rgba(255,255,255,.94);text-shadow:0 1px 10px rgba(0,0,0,.35);}
.phead .prov{color:rgba(255,255,255,.65);}
/* full-bleed scenery band — tall image, slow settle on scroll (no background-attachment: fixed) */
.sceneband{padding:0;height:68vh;min-height:400px;position:relative;overflow:hidden;}
.sceneband img{transform:scale(1.08);transition:transform 2.4s ease;}
.sceneband.in img{transform:scale(1);}
.sceneband .cap{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;color:#fff;font-size:clamp(18px,2.6vw,26px);letter-spacing:.35em;text-shadow:0 1px 12px rgba(0,0,0,.45),0 0 30px rgba(20,24,20,.42),0 0 6px rgba(20,24,20,.55);padding-left:.35em;text-align:center;z-index:2;}
/* horizontal scroll rows — Ron Herman style */
.hscroll{display:flex;gap:2.4vw;overflow-x:auto;scroll-snap-type:x proximity;padding:8px 2px 20px;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--sand) transparent;}
.hscroll::-webkit-scrollbar{height:5px;}
.hscroll::-webkit-scrollbar-thumb{background:var(--sand);border-radius:3px;}
.hscroll::-webkit-scrollbar-track{background:transparent;}
.hscroll>*{flex:0 0 auto;scroll-snap-align:start;}
.hscroll .cell{width:min(320px,72vw);}
.hscroll .cell .ph{aspect-ratio:1/1;overflow:hidden;}
.hscroll .ph{overflow:hidden;}
.hscroll.wide .ph{width:min(450px,82vw);aspect-ratio:4/3;}
.scrollhint{margin-top:2px;font-size:9.5px;letter-spacing:.3em;color:var(--grey);text-transform:uppercase;}
/* filmstrip — TOP moments */
.film{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x proximity;padding:8px 2px 20px;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--sand) transparent;}
.film::-webkit-scrollbar{height:5px;}
.film::-webkit-scrollbar-thumb{background:var(--sand);border-radius:3px;}
.film::-webkit-scrollbar-track{background:transparent;}
.film .ph{flex:0 0 auto;height:300px;aspect-ratio:4/3;overflow:hidden;scroll-snap-align:start;}
.film .ph.tall{aspect-ratio:3/4;}
.fullimg{padding:0 6vw;}
.fullimg .ph{overflow:hidden;}
.profiles{display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:start;}
.profile .ph{aspect-ratio:4/5;overflow:hidden;}
.profile h3{margin-top:30px;font-size:26px;letter-spacing:.3em;font-weight:500;}
.profile .poem{margin-top:20px;}
.center-note{text-align:center;background:var(--ivory);}
.center-note .poem{display:inline-block;text-align:left;}
.chapter{display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:center;}
.chapter .ph{aspect-ratio:4/5;overflow:hidden;}
.chapter .ph.wide{aspect-ratio:3/2;}
.chapter .ph.poster{background:var(--ivory);}
.chapter .ph.poster img{object-fit:contain;}
.chapter.flip .txt{order:2;}
.chapter.flip .ph{order:1;}
.chapter h3{font-size:clamp(21px,2.8vw,30px);font-weight:500;line-height:1.7;letter-spacing:.05em;margin-bottom:22px;}
.chapter .no{font-size:11px;letter-spacing:.35em;color:var(--grey);margin-bottom:16px;}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2.4vw;margin-top:50px;}
.gallery-grid .ph{aspect-ratio:1/1;overflow:hidden;}
.article{max-width:760px;margin:0 auto;padding:0 6vw 40px;}
.article .ph{aspect-ratio:3/2;overflow:hidden;margin:50px 0;}
.article p{margin-top:26px;}
.contact-box{text-align:center;}
.contact-box .mail{display:inline-block;margin-top:36px;font-size:clamp(17px,2.6vw,24px);letter-spacing:.12em;text-decoration:none;border-bottom:1px solid var(--char);padding-bottom:6px;}
.contact-box .note{margin-top:22px;font-size:12.5px;color:var(--grey);letter-spacing:.08em;line-height:2;}
/* ---------- provenance / status tag ---------- */
.prov{margin-top:10px;font-size:9.5px;letter-spacing:.3em;color:var(--grey);text-transform:uppercase;}
/* ---------- session index ---------- */
.index-rows{margin-top:46px;border-top:1px solid var(--hair);}
.irow{display:grid;grid-template-columns:64px 1fr;gap:26px;padding:32px 4px;border-bottom:1px solid var(--hair);}
.irow .no{font-size:11px;letter-spacing:.3em;color:var(--grey);padding-top:5px;}
.irow h4{font-size:17px;font-weight:500;letter-spacing:.08em;line-height:1.8;}
.irow .meta{margin-top:14px;display:grid;grid-template-columns:repeat(2,1fr);gap:8px 34px;font-size:12.5px;line-height:1.9;color:#555854;}
.irow .meta span b{display:inline-block;min-width:5.4em;font-weight:500;color:var(--grey);letter-spacing:.12em;font-size:11px;}
.irow .note{margin-top:14px;font-size:13.5px;line-height:2.05;color:#3c3f3d;max-width:640px;}
/* ---------- field record (coastal) ---------- */
.axis{display:grid;grid-template-columns:repeat(4,1fr);gap:2vw;margin-top:46px;}
.axis .ax{border-top:1px solid var(--hair);padding-top:16px;}
.axis .ax h5{font-size:11px;letter-spacing:.3em;font-weight:500;}
.axis .ax p{margin-top:8px;font-size:12.5px;line-height:1.95;color:#555854;}
.season-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2vw;margin-top:54px;}
.season .ph{aspect-ratio:3/4;overflow:hidden;}
.season h4{margin-top:18px;font-size:13px;letter-spacing:.3em;font-weight:500;}
.season p{margin-top:8px;font-size:12.5px;line-height:1.95;color:#555854;}
/* ---------- ritual grid (community) ---------- */
.ritual-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2.4vw;margin-top:50px;}
.ritual{border-top:1px solid var(--hair);padding-top:18px;}
.ritual .rn{font-size:10px;letter-spacing:.3em;color:var(--grey);}
.ritual h4{margin-top:10px;font-size:15px;font-weight:500;letter-spacing:.1em;line-height:1.8;}
.ritual p{margin-top:8px;font-size:12.5px;line-height:1.95;color:#555854;}
/* ---------- field list (form preview) ---------- */
.fieldlist{margin:44px auto 0;max-width:680px;text-align:left;border-top:1px solid var(--hair);}
.fieldlist .fr{display:flex;gap:30px;padding:16px 4px;border-bottom:1px solid var(--hair);font-size:13.5px;line-height:1.9;}
.fieldlist .fr b{font-weight:500;letter-spacing:.1em;white-space:nowrap;min-width:9em;}
.fieldlist .fr span{color:#555854;}
/* ---------- gallery captions ---------- */
.gallery-grid .cell p,.hscroll .cell p{margin-top:12px;font-size:12.5px;line-height:1.9;color:#555854;}
/* ---------- journal themes ---------- */
.themes{margin-top:42px;border-top:1px solid var(--hair);}
.themes .th{display:flex;gap:26px;padding:16px 4px;border-bottom:1px solid var(--hair);font-size:13.5px;letter-spacing:.05em;align-items:baseline;}
.themes .th .st{font-size:10px;letter-spacing:.28em;color:var(--grey);white-space:nowrap;}
/* ---------- record block (article) ---------- */
.record{margin-top:56px;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);padding:26px 4px;display:grid;grid-template-columns:repeat(2,1fr);gap:10px 40px;font-size:12.5px;line-height:2;color:#555854;}
.record b{font-weight:500;color:var(--grey);letter-spacing:.12em;font-size:11px;display:inline-block;min-width:5.4em;}
/* ---------- footer ---------- */
footer{background:var(--char);color:#e9e7e0;padding:90px 6vw 46px;text-align:center;}
footer .lockup{width:170px;height:auto;margin:0 auto;}
footer .tag{margin-top:26px;font-size:12px;letter-spacing:.25em;color:#b9bcb8;line-height:2;}
footer nav{margin-top:44px;display:flex;justify-content:center;gap:28px;flex-wrap:wrap;font-size:10.5px;letter-spacing:.25em;text-transform:uppercase;}
footer nav a{color:#e9e7e0;text-decoration:none;}
footer .sns{margin-top:30px;display:flex;justify-content:center;gap:30px;font-size:10.5px;letter-spacing:.25em;}
footer .sns a{color:#e9e7e0;text-decoration:none;}
footer .copy{margin-top:54px;font-size:10px;letter-spacing:.2em;color:#8f9290;}
/* ---------- intro (TOP only) ---------- */
/* Sequence: mark floats up -> title reveals -> the ivory veil lifts and the
   mark shrinks + settles into the centre of the KV (.kvmark below), where it
   stays as a quiet brand seal. Orchestrated by site.js; tap skips.
   The late introSafety animation is only a no-JS fallback. */
#intro{position:fixed;inset:0;z-index:100;background:var(--ivory);display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;transition:background-color 1.1s ease;animation:introSafety .8s ease 7s forwards;}
#intro .mark{width:min(300px,64vw);height:auto;opacity:0;transform:scale(.95);animation:markIn 1.1s ease .1s forwards;}
#intro .wm{margin-top:34px;font-size:clamp(19px,3.4vw,27px);letter-spacing:.34em;padding-left:.34em;color:var(--char);display:flex;}
#intro .wm span{opacity:0;transform:translateY(12px);animation:letterIn .6s ease forwards;}
#intro .line{margin-top:24px;width:0;height:1px;background:var(--char);animation:lineGrow 1s ease 2s forwards;}
#intro .sub{margin-top:18px;font-size:10px;letter-spacing:.45em;padding-left:.45em;color:var(--grey);opacity:0;animation:letterIn .8s ease 2.3s forwards;}
#intro.lift{background:transparent;pointer-events:none;}
#intro.lift .mark{animation:none;opacity:0;}
#intro.lift .wm{opacity:0;transition:opacity .7s ease;}
#intro.lift .line{animation:none;width:min(300px,60vw);opacity:0;transition:opacity .7s ease;}
#intro.lift .sub{animation:none;opacity:0;transition:opacity .7s ease;}
@keyframes markIn{to{opacity:1;transform:scale(1);}}
@keyframes letterIn{to{opacity:1;transform:translateY(0);}}
@keyframes lineGrow{to{width:min(300px,60vw);}}
@keyframes introSafety{to{opacity:0;visibility:hidden;}}
/* ---------- KV brand seal — the intro mark, settled at the centre of the KV.
   Stays for the whole slideshow; white line + faint shadow so it reads on
   bright and dark photos alike; never intercepts taps. ---------- */
.hero .kvmark{--rest:-106px;--from:-58px;--sc:3.85;position:absolute;left:50%;top:50%;z-index:4;width:78px;pointer-events:none;opacity:.94;transform:translate(-50%,-50%) translateY(var(--rest));}
.hero .kvmark img{width:100%;height:auto;filter:brightness(0) invert(1) drop-shadow(0 1px 7px rgba(20,24,20,.38));}
.hero .kvmark.pre{opacity:0;}
.hero .kvmark.glide{animation:markGlide 1.8s cubic-bezier(.22,.61,.21,1) forwards;}
@keyframes markGlide{
  0%{opacity:0;transform:translate(-50%,-50%) translateY(var(--from)) scale(var(--sc));}
  22%{opacity:1;}
  100%{opacity:.94;transform:translate(-50%,-50%) translateY(var(--rest)) scale(1);}
}
@media (prefers-reduced-motion: reduce){
  #intro{display:none;}
  .hero .kvmark.glide{animation:none;}
}
/* ---------- responsive ---------- */
html,body{overflow-x:clip;}
@media(max-width:760px){
  section{padding:100px 6vw;}
  .bandshow{height:46vh;min-height:280px;}
  .hero .vcopy{left:20px;font-size:13px;}
  .hero{height:92svh;min-height:480px;}
  .hero .set-d{display:none;}
  .hero .set-m{display:block;}
  .hero .set-m .slide img{object-position:center center;}
  .hero .tag{bottom:76px;}
  .hero .kvmark{--rest:-78px;--from:-54px;--sc:4.4;width:56px;}
  .hero .tag .en{font-size:11px;}
  .phead{min-height:64vh;}
  .phead .inner{padding:120px 6vw 48px;}
  .sceneband{height:46vh;min-height:280px;}
  .film .ph{height:208px;}
  .hscroll{gap:14px;}
  .contact-box .mail{font-size:16px;letter-spacing:.06em;word-break:break-all;}
  .hero .wordmark .wm{font-size:30px;letter-spacing:.22em;padding-left:.22em;}
  .hero .wordmark .sub{font-size:10px;letter-spacing:.35em;padding-left:.35em;}
  .chars,.teaser-grid,.tiles,.profiles,.chapter{grid-template-columns:1fr;}
  .chapter.flip .txt{order:1;}
  .chapter.flip .ph{order:2;}
  .chapter{gap:34px;}
  .coastal .grid{grid-template-columns:1fr;}
  .posts{grid-template-columns:1fr;}
  .post .ph{aspect-ratio:3/2;}
  .gallery-grid{grid-template-columns:1fr 1fr;gap:14px;}
  .newslist a{gap:20px;font-size:13px;}
  .season-grid,.ritual-grid{grid-template-columns:1fr 1fr;gap:20px;}
  .axis{grid-template-columns:1fr 1fr;gap:20px;}
  .irow{grid-template-columns:1fr;gap:6px;}
  .irow .meta{grid-template-columns:1fr;}
  .record{grid-template-columns:1fr;}
  .fieldlist .fr{flex-direction:column;gap:2px;}
  .themes .th{flex-direction:column;gap:2px;}
  .band{height:38vh;min-height:240px;}
  .pagehead{padding:120px 6vw 50px;}
  .concept .wide{aspect-ratio:4/3;}
}
/* ---------- QA fixes 2026-11-03 (layout only) ---------- */
/* KV desktop slide 3 (terrace backs): lift the cats so the wordmark band
   crosses their backs instead of the smaller cat's head */
.hero .set-d .slide:nth-child(3) img{object-position:center 84%;}
/* KV desktop slide 5 (hero_brand) carries baked-in vertical lettering;
   the overlay tag collided with it (text on text) — hide the tag there */
.hero .set-d .slide:nth-child(5) .tag{display:none;}
/* Poster tiles (collection): the artwork sits on a light margin inside the
   tile, so keep COMING SOON centred and switch the label to charcoal —
   white text was unreadable on the light margin */
.tile.poster .soon{justify-content:center;padding-bottom:0;}
.tile.poster .tlabel{color:var(--char);text-shadow:none;}
/* Sessions phead: lift the pair so the title crosses chests, not faces */
.phead img.bg[src*="gen_randoseru_doorway"]{object-position:center 72%;}
/* Sessions phead on mobile: the crop is width-driven, so object-position
   cannot lift the cats; give this head more height instead — the fixed-
   height text block then starts below the faces */
@media(max-width:760px){
  .phead:has(> img.bg[src*="gen_randoseru_doorway"]){min-height:86vh;}
  /* and slide the crop right so the left cat leaves the frame entirely —
     its half-cropped face was sitting under the title's first glyphs */
  .phead img.bg[src*="gen_randoseru_doorway"]{object-position:78% 72%;}
  /* Same height escape for two more mobile heads whose faces sit in the
     text band: community (garden pair) and the bath journal article */
  .phead:has(> img.bg[src*="gen_garden.jpg"]){min-height:86vh;}
  .phead:has(> img.bg[src*="gen_bath_steam_wide"]){min-height:86vh;}
  /* Poster tiles on mobile: the crop shifts the poster's own baked
     wordmark up into the label line (text on text) — the poster already
     carries its title, so the overlay label steps aside here */
  .tile.poster .tlabel{display:none;}
}
@media(max-width:400px){
  .hero .wordmark .wm{font-size:25px;letter-spacing:.18em;padding-left:.18em;}
  header.site .logo{font-size:12px;letter-spacing:.22em;padding-left:.22em;}
}