:root{
  --sand:#F4F1EB; --sand-d:#EAE6DB;
  --ink:#1A1917; --ink60:rgba(26,25,23,.60); --ink35:rgba(26,25,23,.35);
  --forest:#2B4538;
  --serif:'Cormorant Garamond','Hiragino Mincho ProN',Georgia,serif;
  --sans:'Jost','Hiragino Kaku Gothic ProN',sans-serif;
  --out:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth;overflow-x:hidden}
body{background:#0a0907;color:var(--ink);font-family:var(--sans);font-weight:300;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;width:100%;height:100%;object-fit:cover}
a{color:inherit;text-decoration:none}
button{font-family:inherit;background:none;border:none;cursor:pointer;padding:0;color:inherit}

/* ── REVEAL ── */
.sr{opacity:0;transition:opacity 1.3s var(--out),transform 1.3s var(--out)}
.sr.up{transform:translateY(18px)}
.sr.fade{transform:none;transition-duration:1.6s}
.sr.on{opacity:1;transform:translateY(0)}

/* ── LAYOUT ── */
.w{max-width:1060px;margin:0 auto;padding:0 clamp(1.4rem,4.5vw,3rem)}
.wn{max-width:620px;margin:0 auto;padding:0 clamp(1.4rem,4.5vw,3rem)}
.eb{display:block;font-size:.52rem;font-weight:400;letter-spacing:.26em;text-transform:uppercase;color:var(--ink35);margin-bottom:1.3rem}
.eb-lt{color:rgba(255,255,255,.26)}.eb-ct{text-align:center}
.hr{display:block;width:24px;height:1px;background:rgba(26,25,23,.12);margin-bottom:1.7rem}
.hr-lt{background:rgba(255,255,255,.13)}.hr-ct{margin-left:auto;margin-right:auto}

/* ── NAV ── */
.nav{position:fixed;top:0;left:0;right:0;z-index:300;
  display:flex;align-items:center;justify-content:space-between;
  padding:1.4rem 2.4rem;
  opacity:0;
  transition:background .6s var(--out),border-color .6s,opacity .6s var(--out);
  border-bottom:1px solid transparent}
.nav.lit{background:rgba(244,241,235,.95);backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);border-color:rgba(26,25,23,.1);opacity:1}
.nav__logo{font-family:var(--serif);font-size:1.12rem;font-weight:300;
  letter-spacing:.28em;color:rgba(255,255,255,.78);transition:color .5s}
.nav.lit .nav__logo{color:var(--ink)}
@media(max-width:580px){.nav{padding:1rem 1.2rem}}

/* ══════════════════════════════════
   §1 HERO
══════════════════════════════════ */
#heroSpacer{height:100svh;position:relative}
.hero-sticky{position:sticky;top:0;height:100svh;min-height:560px;
  overflow:hidden;display:flex;align-items:flex-end}
.h-bg{position:absolute;inset:0;background-size:cover;background-position:center;
  transform-origin:50% 54%;
  animation:heroZoomOut 18s cubic-bezier(.08,.0,.18,1) forwards,heroBrighten 10s cubic-bezier(.2,0,.4,1) forwards}
@keyframes heroZoomOut{from{transform:scale(1.40)}to{transform:scale(1.0)}}
@keyframes heroBrighten{from{filter:brightness(.72)}to{filter:brightness(1.02)}}
@media(max-width:580px){
  .h-bg{animation-name:heroZoomOutMobile,heroBrighten}
  @keyframes heroZoomOutMobile{from{transform:scale(1.22)}to{transform:scale(1.0)}}
}
#heroC{position:absolute;inset:0;z-index:2;width:100%;height:100%;pointer-events:none;opacity:0}
.h-veil{position:absolute;inset:0;z-index:2;
  background:linear-gradient(180deg,rgba(10,9,7,0) 28%,rgba(10,9,7,.4) 66%,rgba(10,9,7,.84) 100%)}
.h-text{position:relative;z-index:3;
  padding:0 clamp(1.4rem,5vw,4.5rem) clamp(3.5rem,8svh,6.5rem);
  pointer-events:none;max-width:min(760px,100%)}
.h-logo{font-family:var(--serif);font-size:clamp(3.8rem,10vw,8.5rem);
  font-weight:300;letter-spacing:.1em;color:#fff;line-height:.9;margin-bottom:1.5rem;
  opacity:0;filter:blur(8px);
  transition:opacity 4s cubic-bezier(.2,0,.5,1),filter 4s cubic-bezier(.2,0,.5,1)}
.h-tagline{font-family:var(--serif);font-style:italic;
  font-size:clamp(.82rem,1.6vw,.97rem);
  color:rgba(255,255,255,.52);line-height:2;margin-bottom:2.2rem;
  opacity:0;transition:opacity 3.5s cubic-bezier(.2,0,.5,1)}
.h-enter{display:inline-flex;align-items:center;gap:.8rem;
  font-size:.54rem;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(255,255,255,.65);pointer-events:auto;
  border:1px solid rgba(255,255,255,.24);padding:.72rem 1.3rem;min-height:44px;
  opacity:0;transition:opacity 2.5s cubic-bezier(.2,0,.5,1),color .4s,border-color .4s}
.h-enter:hover{color:#fff;border-color:rgba(255,255,255,.6)}
.h-enter-arrow{display:block;width:18px;height:1px;background:currentColor;
  transition:width .4s var(--out)}
.h-enter:hover .h-enter-arrow{width:30px}


/* ══════════════════════════════════
   廊下1: Hero → LANDとは
   暗→砂 グラデーション 40vh
══════════════════════════════════ */
.corridor-1{
  height:40vh;
  background:linear-gradient(to bottom, #0a0907 0%, var(--sand) 100%);
}

/* ══════════════════════════════════
   §2 LANDとは (砂・明るい)
══════════════════════════════════ */
.what{background:var(--sand);padding:clamp(6rem,11svh,10rem) 0}
.what-head{font-family:var(--serif);font-size:clamp(1.85rem,4vw,2.9rem);
  font-weight:300;line-height:1.22;margin-bottom:clamp(2.2rem,4.5svh,4rem)}
.what-body{font-family:var(--serif);font-size:clamp(1rem,2vw,1.16rem);
  font-weight:300;line-height:2.25;color:var(--ink60)}
.what-body p{margin-bottom:1.7rem}
.what-body p:last-child{margin-bottom:0}
.what-body em{color:var(--ink);font-style:italic}
.what-conn{margin:3rem 0}
.what-conn p{font-family:var(--serif);font-style:italic;
  font-size:clamp(.97rem,1.9vw,1.1rem);color:var(--ink);
  padding:.9rem 0;
  opacity:0;transform:translateY(6px);
  transition:opacity 1.2s var(--out),transform 1.2s var(--out)}
.what-conn p.on{opacity:1;transform:translateY(0)}

/* ══════════════════════════════════
   廊下2: LANDとは → LANDで起きること
   砂→暗 グラデーション 60vh
══════════════════════════════════ */
.bridge{
  position:relative;
  height:70vh;
  overflow:hidden;
}
.bridge__img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 60%;
}
.bridge__top{
  position:absolute;
  top:0;left:0;right:0;
  height:40%;
  background:linear-gradient(to bottom, var(--sand) 0%, transparent 100%);
  z-index:2;
}
.bridge__bottom{
  position:absolute;
  bottom:0;left:0;right:0;
  height:50%;
  background:linear-gradient(to top, #0a0907 0%, transparent 100%);
  z-index:2;
}

/* ══════════════════════════════════
   §3 LANDで起きること (暗い)
══════════════════════════════════ */
.happens{background:#0a0907;color:#fff}
.hap-head{padding:clamp(5rem,10svh,9rem) 0 clamp(4rem,8svh,7rem);text-align:center}
.hap-title{font-family:var(--serif);font-size:clamp(1.65rem,3.8vw,2.7rem);
  font-weight:300;line-height:1.25;color:rgba(255,248,235,.85);text-align:center}
.fn-word{
  height:70svh;min-height:320px;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  padding:0 clamp(2rem,8vw,8rem);
}
.fn-ja{
  font-family:var(--serif);font-style:normal;
  font-size:clamp(2.6rem,7.5vw,6rem);
  font-weight:300;
  color:rgba(255,248,235,0);
  filter:blur(10px);
  transform:scale(1.15);
  letter-spacing:.04em;line-height:1;
  transition:color 3.2s var(--out),filter 3.2s var(--out),transform 3.2s var(--out);
}
.fn-ja.on{color:rgba(255,248,235,.82);filter:blur(0px);transform:scale(1.0)}
.fn-desc{
  font-family:var(--serif);font-style:italic;
  font-size:clamp(.82rem,1.6vw,1rem);
  color:rgba(255,248,235,0);margin-top:1.6rem;
  line-height:2.1;letter-spacing:.02em;
  filter:blur(4px);
  transform:scale(1.1);
  transition:color 3.2s var(--out) .5s,filter 3.2s var(--out) .5s,transform 3.2s var(--out) .5s;
}
.fn-desc.on{color:rgba(255,248,235,.46);filter:blur(0px);transform:scale(1.0)}
.hap-foot{
  height:80svh;min-height:360px;
  display:flex;align-items:center;justify-content:center;
  padding:0 clamp(2rem,8vw,8rem);text-align:center;
}
.hap-foot p{
  font-family:var(--serif);font-style:italic;
  font-size:clamp(1rem,2.2vw,1.3rem);
  color:rgba(255,248,235,0);
  line-height:2.4;
  filter:blur(6px);
  transition:color 3s var(--out),filter 3s var(--out);
}
.hap-foot p.on{color:rgba(255,248,235,.52);filter:blur(0px)}

/* ══════════════════════════════════
   廊下3: → Experiences
   「今、どこにいますか。」30vh
══════════════════════════════════ */
.corridor-3{
  height:30vh;min-height:160px;
  background:#0a0907;
  display:flex;align-items:center;justify-content:center;
  position:relative;
}
.corridor-3__q{
  font-family:var(--serif);font-style:italic;
  font-size:clamp(.9rem,2vw,1.1rem);
  color:rgba(255,255,255,.42);
  opacity:0;
  transition:opacity 1.2s var(--out);
}
.corridor-3__q.on{opacity:1}

/* ══════════════════════════════════
   §4 Experiences
══════════════════════════════════ */
.exp{background:#0a0907}
.exp-intro{padding:clamp(5rem,9svh,8rem) 0 clamp(2rem,4svh,3.5rem);
  text-align:center;background:var(--sand)}
.exp-head{font-family:var(--serif);font-size:clamp(1.65rem,3.8vw,2.7rem);
  font-weight:300;line-height:1.2;margin-bottom:1rem}
.exp-sub{font-family:var(--serif);font-style:italic;
  font-size:clamp(.92rem,1.75vw,1.05rem);color:var(--ink60);line-height:1.9;
  max-width:400px;margin:0 auto}

/* フルスクリーンパネル */
.film{position:relative;height:100svh;min-height:520px;
  overflow:hidden;cursor:pointer;display:flex;align-items:flex-end;background:#0a0907}
.film__photo{position:absolute;inset:0;
  background-size:cover;
  transform:scale(1.0);transform-origin:50% 50%;
  will-change:transform;}
.film__photo.on{
  transform:scale(1.08);
  transition:transform 20s cubic-bezier(.08,0,.18,1);
}
.film__veil{position:absolute;inset:0;z-index:3;
  background:linear-gradient(180deg,rgba(5,4,3,.05) 0%,rgba(5,4,3,.22) 50%,rgba(5,4,3,.88) 100%)}
.film__copy{position:absolute;z-index:5;bottom:0;left:0;right:0;
  padding:0 clamp(1.6rem,5vw,5rem) clamp(2.5rem,5svh,5rem)}
.film__journey{font-size:.48rem;letter-spacing:.26em;text-transform:uppercase;
  color:rgba(255,255,255,.32);margin-bottom:1rem;display:block}
.film__title{font-family:var(--serif);font-size:clamp(1.75rem,5vw,3.8rem);
  font-weight:300;color:#fff;line-height:1.05;margin-bottom:.65rem;
  text-shadow:0 2px 20px rgba(0,0,0,.5)}
.film__q{font-family:var(--serif);font-style:italic;
  font-size:clamp(.82rem,1.5vw,.96rem);
  color:rgba(255,255,255,.5);line-height:1.82;margin-bottom:1.6rem;
  max-width:min(400px,90vw);text-shadow:0 1px 12px rgba(0,0,0,.6)}
.film__discover{display:inline-flex;align-items:center;gap:.7rem;
  font-size:.54rem;letter-spacing:.18em;text-transform:uppercase;
  color:#fff;background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.32);
  padding:.72rem 1.3rem;min-height:44px;
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  transition:background .35s,border-color .35s;cursor:pointer}
.film:hover .film__discover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.6)}
.film__dl{display:block;width:16px;height:1px;background:currentColor;
  transition:width .4s var(--out)}
.film:hover .film__dl{width:28px}

/* パネル間の糸 */
.exp-thread{height:clamp(1.8rem,3.5svh,3rem);background:#0a0907;
  display:flex;align-items:center;justify-content:center}
.exp-thread-line{width:1px;height:100%;background:rgba(255,255,255,.08)}

/* ══════════════════════════════════
   §5 Why It Works
══════════════════════════════════ */
.why{background:#0a0907;color:#fff;padding:clamp(6rem,11svh,10rem) 0;
  position:relative;overflow:hidden}
#whyC{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.why-inner{position:relative;z-index:1;max-width:940px;margin:0 auto;
  padding:0 clamp(1.4rem,4vw,3rem)}
.why-pull{font-family:var(--serif);font-size:clamp(1.85rem,4.2vw,3.2rem);
  font-weight:300;line-height:1.26;color:#fff;
  max-width:540px;margin-bottom:clamp(3.2rem,7svh,6.5rem)}
.why-cols{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(2.5rem,6vw,7rem)}
.why-body{font-family:var(--serif);font-size:clamp(.9rem,1.7vw,1.02rem);
  font-weight:300;line-height:2.18;color:rgba(255,255,255,.44)}
.why-body p{margin-bottom:1.3rem}
.why-body p:last-child{margin-bottom:0}
.why-body em{color:rgba(255,255,255,.82);font-style:italic}
.why-aside{margin-top:2.8rem;padding-top:1.8rem;border-top:1px solid rgba(255,255,255,.07)}
.why-aside-label{display:block;font-size:.48rem;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(255,255,255,.2);margin-bottom:.55rem}
.why-aside-text{font-family:var(--serif);font-size:.9rem;
  color:rgba(255,255,255,.28);line-height:1.88}
@media(max-width:680px){.why-cols{grid-template-columns:1fr;gap:2.5rem}}

/* ══════════════════════════════════
   廊下5: Why → Guide
   最長・最重要 100vh
   「ここに、人がいます。」
══════════════════════════════════ */
.corridor-5{
  height:100vh;
  background:#050403;
  display:flex;align-items:center;justify-content:center;
  position:relative;
}
.corridor-5__txt{
  font-family:var(--serif);font-style:italic;
  font-size:clamp(.85rem,1.6vw,.98rem);
  color:rgba(255,255,255,.38);
  text-align:center;
  opacity:0;
  transition:opacity 1.4s var(--out);
}
.corridor-5__txt.on{opacity:1}

/* ══════════════════════════════════
   §6 Guide
   写真→名前→言葉 の段階的出現
══════════════════════════════════ */
.guide{background:var(--sand);overflow:hidden}
.guide-layout{display:grid;grid-template-columns:1fr 1fr}
.guide-photo{position:relative;min-height:clamp(380px,78vw,1365px);
  background:var(--sand-d);overflow:hidden}
.guide-photo img{position:absolute;inset:0;object-position:bottom center;
  transition:transform 1.2s var(--out)}
.guide-photo:hover img{transform:scale(1.03)}
.guide-photo::after{content:'';position:absolute;top:0;right:0;bottom:0;width:26%;
  background:linear-gradient(to left,var(--sand) 0%,transparent 100%)}
.guide-text{padding:clamp(4.5rem,9svh,8rem) clamp(2rem,4.5vw,4.5rem);
  display:flex;align-items:flex-start}
.guide-inner{max-width:370px}
/* 段階的出現 */
.guide-name-wrap{opacity:0;transition:opacity 1.4s var(--out)}
.guide-name-wrap.on{opacity:1}
.guide-body-wrap{opacity:0;transition:opacity 1.4s var(--out) .4s}
.guide-body-wrap.on{opacity:1}
.guide-name{font-family:var(--serif);font-size:clamp(1.85rem,3.7vw,2.9rem);
  font-weight:300;letter-spacing:.07em;line-height:1.05;margin:1rem 0 .38rem}
.guide-role{font-size:.58rem;letter-spacing:.13em;color:var(--ink35);
  line-height:2;margin-bottom:2.5rem}
.guide-body{font-family:var(--serif);font-size:clamp(.93rem,1.7vw,1.04rem);
  font-weight:300;line-height:2.2;color:var(--ink60)}
.guide-body p{margin-bottom:1.25rem}
.guide-body p:last-child{margin-bottom:0}
.guide-body em{color:var(--ink);font-style:italic}
.guide-cta{display:inline-flex;align-items:center;gap:.75rem;margin-top:3rem;
  font-size:.54rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--forest);border:1px solid rgba(43,69,56,.28);
  padding:.72rem 1.3rem;min-height:44px;
  transition:background .4s,color .4s,border-color .4s}
.guide-cta:hover{background:var(--forest);color:#fff;border-color:var(--forest)}
.guide-cta-line{display:block;width:18px;height:1px;background:currentColor;
  transition:width .4s var(--out)}
.guide-cta:hover .guide-cta-line{width:30px}
@media(max-width:840px){
  .guide-layout{grid-template-columns:1fr}
  .guide-photo{min-height:clamp(240px,50vw,420px)}
  .guide-photo::after{display:none}
  .guide-text{padding:3.5rem 1.4rem 4rem}
  .guide-inner{max-width:100%}
}

/* ══════════════════════════════════
   廊下6: Guide → Voices 50vh
══════════════════════════════════ */
.corridor-6{
  height:50vh;
  background:linear-gradient(to bottom, var(--sand) 0%, #0a0907 100%);
}

/* ══════════════════════════════════
   §7 Voices
   1画面1言葉 / 左右中央 不規則
══════════════════════════════════ */
.voices{background:#0a0907;overflow:hidden}

/* タイトルエリア */
.voices-head{
  padding:clamp(6rem,11svh,10rem) 0 clamp(3rem,6svh,5rem);
  text-align:center;
}
.voices-title{font-family:var(--serif);font-size:clamp(1.55rem,3.5vw,2.4rem);
  font-weight:300;color:#fff;margin-bottom:.45rem}
.voices-sub{font-family:var(--serif);font-style:italic;font-size:.92rem;
  color:rgba(255,255,255,.25)}

/* 各Voiceは1画面分の高さを持つ */
.voice-page{
  height:60vh;min-height:300px;
  display:flex;align-items:center;
  padding:0 clamp(1.4rem,6vw,5rem);
  position:relative;
}
/* 位置バリエーション */
.voice-page.pos-left  {justify-content:flex-start}
.voice-page.pos-right {justify-content:flex-end}
.voice-page.pos-center{justify-content:center}

.voice-page__q{
  font-family:var(--serif);
  font-weight:300;font-style:italic;
  line-height:1.65;
  color:rgba(255,255,255,.78);
  max-width:min(600px,85vw);
  word-break:break-word;
  opacity:0;transform:translateY(8px);
  transition:opacity 1.6s var(--out),transform 1.6s var(--out);
}
.voice-page.pos-right .voice-page__q{text-align:right}
.voice-page.pos-center .voice-page__q{text-align:center}
.voice-page__q.on{opacity:1;transform:translateY(0)}

/* サイズバリエーション */
.voice-page__q.sz-s{font-size:clamp(.95rem,2vw,1.2rem)}
.voice-page__q.sz-m{font-size:clamp(1.1rem,2.5vw,1.55rem)}
.voice-page__q.sz-l{font-size:clamp(1.3rem,3.2vw,2rem)}

/* 余白ページ */
.voice-gap{height:40vh;background:#0a0907}

/* 最後の言葉 */
.voice-last{
  height:80vh;min-height:360px;
  display:flex;align-items:center;justify-content:center;
  padding:0 clamp(1.4rem,6vw,5rem);
}
.voice-last__q{
  font-family:var(--serif);font-size:clamp(1.4rem,3.5vw,2.2rem);
  font-weight:300;font-style:italic;line-height:1.6;
  color:rgba(255,255,255,.88);text-align:center;
  max-width:min(560px,85vw);
  opacity:0;transform:translateY(8px);
  transition:opacity 1.8s var(--out),transform 1.8s var(--out);
}
.voice-last__q.on{opacity:1;transform:translateY(0)}

/* 廊下7: Voices→Invitation */
.corridor-7{
  height:40vh;
  background:linear-gradient(to bottom,#0a0907 0%,var(--sand) 100%);
}

/* ══════════════════════════════════
   §8 Invitation
══════════════════════════════════ */
.inv{background:var(--sand);padding:clamp(8rem,15svh,13rem) 0;
  text-align:center;position:relative;overflow:hidden}
.inv-echo{position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);
  width:clamp(280px,52vw,520px);height:clamp(280px,52vw,520px);
  opacity:0;transition:opacity 3s var(--out);pointer-events:none}
.inv-echo.on{opacity:.05}
.inv-inner{position:relative;z-index:1;max-width:560px;margin:0 auto;
  padding:0 clamp(1.4rem,4vw,3rem)}
.inv-title{font-family:var(--serif);font-size:clamp(1.6rem,3.8vw,2.9rem);
  font-weight:300;line-height:1.22;margin-bottom:clamp(2rem,4svh,3.5rem)}
.inv-body{font-family:var(--serif);font-size:clamp(.97rem,1.85vw,1.1rem);
  font-weight:300;line-height:2.2;color:var(--ink60);margin-bottom:2rem}
.inv-body p{margin-bottom:.9rem}
.inv-welcome{font-family:var(--serif);font-size:clamp(1rem,2vw,1.28rem);
  font-style:italic;color:var(--ink);margin-bottom:3rem}
.inv-btn{display:inline-flex;align-items:center;justify-content:center;gap:.9rem;
  font-size:.56rem;letter-spacing:.24em;text-transform:uppercase;
  color:#fff;background:var(--ink);border:1px solid var(--ink);
  padding:1.15rem 3rem;min-height:50px;
  transition:background .4s var(--out),border-color .4s}
.inv-btn:hover{background:var(--forest);border-color:var(--forest)}
.inv-sns{display:flex;gap:1rem;justify-content:center;margin-bottom:3rem}
.inv-sns-btn{font-size:.52rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink35);border:1px solid rgba(26,25,23,.2);
  padding:.55rem 1.3rem;min-height:38px;
  transition:color .3s,border-color .3s}
.inv-sns-btn:hover{color:var(--ink);border-color:rgba(26,25,23,.5)}
.inv-form-wrap{margin-top:3rem;border-top:1px solid rgba(26,25,23,.08);padding-top:3rem}
.inv-form-label{font-family:var(--serif);font-style:italic;
  font-size:clamp(.92rem,1.8vw,1.05rem);color:var(--ink60);
  margin-bottom:1.8rem;text-align:center}
.inv-form{display:flex;flex-direction:column;gap:1rem}
.inv-field{width:100%}
.inv-input,.inv-textarea{width:100%;font-family:var(--serif);font-size:clamp(.88rem,1.6vw,1rem);
  color:var(--ink);background:transparent;
  border:none;border-bottom:1px solid rgba(26,25,23,.2);
  padding:.7rem 0;outline:none;
  transition:border-color .3s}
.inv-input:focus,.inv-textarea:focus{border-color:rgba(26,25,23,.6)}
.inv-input::placeholder,.inv-textarea::placeholder{color:var(--ink35)}
.inv-textarea{resize:none;line-height:1.9}

/* ── FOOTER ── */
.footer{background:#0a0907;padding:2.4rem 2.4rem;
  display:flex;align-items:center;justify-content:space-between;
  border-top:1px solid rgba(255,255,255,.04)}
.footer__logo{font-family:var(--serif);font-size:.95rem;letter-spacing:.26em;
  color:rgba(255,255,255,.26)}
.footer__copy{font-size:.5rem;letter-spacing:.1em;color:rgba(255,255,255,.15)}
@media(max-width:500px){.footer{flex-direction:column;gap:.7rem;text-align:center}}

/* ── MODAL ── */
.modal-ov{display:none;position:fixed;inset:0;z-index:500;
  background:rgba(8,7,6,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  align-items:center;justify-content:center;
  padding:clamp(.6rem,2svh,1.4rem) clamp(.6rem,3vw,1.4rem);
  opacity:0;transition:opacity .52s var(--out)}
.modal-ov.opening{display:flex}
.modal-ov.open{opacity:1}
.modal{background:var(--sand);width:100%;max-width:760px;max-height:92svh;
  overflow-y:auto;overflow-x:hidden;position:relative;
  display:grid;grid-template-columns:1fr 1.08fr;
  transform:translateY(22px);opacity:0;
  transition:transform .7s var(--out),opacity .52s var(--out);
  scrollbar-width:thin;scrollbar-color:rgba(26,25,23,.12) transparent;min-width:0}
.modal::-webkit-scrollbar{width:4px}
.modal::-webkit-scrollbar-thumb{background:rgba(26,25,23,.12);border-radius:2px}
.modal-ov.open .modal{transform:translateY(0);opacity:1}
.modal__img{position:sticky;top:0;align-self:flex-start;
  height:min(92svh,560px);overflow:hidden;background:var(--sand-d)}
.modal__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.modal__body{padding:clamp(2rem,4svh,3.3rem) clamp(1.3rem,3vw,2.3rem) clamp(1.6rem,3svh,2.6rem);
  display:flex;flex-direction:column;min-width:0}
.modal__close{position:absolute;top:.85rem;right:.85rem;width:42px;height:42px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;z-index:10;
  background:var(--sand);border:1px solid rgba(26,25,23,.14);
  cursor:pointer;transition:background .28s,border-color .28s}
.modal__close:hover{background:var(--sand-d);border-color:rgba(26,25,23,.4)}
.modal__close::before,.modal__close::after{content:'';position:absolute;
  width:14px;height:1px;background:var(--ink)}
.modal__close::before{transform:rotate(45deg)}
.modal__close::after{transform:rotate(-45deg)}
.modal__back{display:inline-flex;align-items:center;gap:.5rem;
  font-size:.52rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink35);margin-bottom:1.7rem;min-height:40px;
  transition:color .28s;cursor:pointer}
.modal__back:hover{color:var(--ink)}
.modal__back-arrow{display:block;width:14px;height:1px;background:currentColor;position:relative}
.modal__back-arrow::before{content:'';position:absolute;left:0;top:-3px;
  width:7px;height:1px;background:currentColor;
  transform:rotate(-45deg);transform-origin:0 0}
.modal__tag{font-size:.48rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--ink35);margin-bottom:.8rem}
.modal__title{font-family:var(--serif);font-size:clamp(1.2rem,2.2vw,1.65rem);
  font-weight:300;line-height:1.22;margin-bottom:1.7rem;word-break:break-word}
.modal__text{font-family:var(--serif);font-size:clamp(.86rem,1.6vw,.98rem);
  font-weight:300;line-height:2.18;color:var(--ink60);flex:1;margin-bottom:2rem;word-break:break-word}
.modal__text p{margin-bottom:.95rem}
.modal__text p:last-child{margin-bottom:0}
.modal__price-wrap{margin-top:2.6rem;padding-top:2.2rem;
  border-top:1px solid rgba(26,25,23,.1);text-align:center}
.modal__price{font-family:var(--serif);font-size:clamp(1.05rem,2vw,1.3rem);
  font-weight:300;letter-spacing:.03em;color:var(--ink);margin-bottom:.7rem}
.modal__price-tax{font-size:.62em;color:var(--ink35);letter-spacing:.05em}
.modal__price-note{font-family:var(--serif);font-style:italic;
  font-size:clamp(.74rem,1.4vw,.84rem);color:var(--ink35);line-height:1.8}
.modal__cta{display:inline-flex;align-items:center;gap:.6rem;
  font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;
  color:#fff;background:var(--forest);border:1px solid var(--forest);
  padding:.85rem 1.7rem;min-height:46px;align-self:flex-start;
  transition:opacity .35s}
.modal__cta:hover{opacity:.82}
@media(max-width:580px){
  .modal{grid-template-columns:1fr;max-height:96svh;width:calc(100vw - 1rem)}
  .modal__img{position:relative;top:auto;height:auto;aspect-ratio:4/3}
  .modal__body{padding:1.5rem 1.1rem 1.7rem}
  .modal__close{top:.55rem;right:.55rem}
  .guide-photo{min-height:160vw}
  .guide-photo img{object-position:center bottom}
}
@media(prefers-reduced-motion:reduce){
  .sr,.flow-node,.voice-page__q,.voice-last__q,.corridor-3__q,.corridor-5__txt,
  .guide-name-wrap,.guide-body-wrap{transition:none!important}
  .sr,.voice-page__q,.voice-last__q,.corridor-3__q,.corridor-5__txt,
  .guide-name-wrap,.guide-body-wrap{opacity:1;transform:none}
  .h-bg{animation:none!important;transform:scale(1)!important;filter:brightness(1.02)!important}
  .h-logo,.h-tagline,.h-enter{opacity:1;filter:none;transform:none}
}