@charset "UTF-8";



:root{
  --bg:        #000000;   
  --bg-2:      #050505;   
  --fg:        #f2f0ec;   
  --muted:     #b4b4b4;   
  --accent:    #ffffff;   
  --accent-2:  #9a9a9a;   
  --line:      rgba(255,255,255,.16);

  
  --f-en:  'Cormorant Garamond', 'Times New Roman', serif;
  
  --f-ja:  'Noto Sans JP', 'Hiragino Sans', 'Yu Gothic', sans-serif;
  
  --f-ui:  'Cormorant Garamond', 'Times New Roman', serif;

  --pad: clamp(20px, 5vw, 80px);
  --ease: cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }

html{
  scroll-behavior:smooth;
  scroll-padding-top:100px;   
  -webkit-text-size-adjust:100%;
}


html.lenis,
html.lenis body{ height:auto; }
html.lenis.lenis-smooth{ scroll-behavior:auto !important; }
html.lenis.lenis-stopped{ overflow:clip; }
html.lenis.lenis-smooth [data-lenis-prevent]{ overscroll-behavior:contain; }

body{
  background:var(--bg);
  color:var(--fg);
  font-family:var(--f-ja);
  font-size:15px;
  line-height:2;          
  letter-spacing:.04em;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.is-locked{ overflow:hidden; }


body::after{
  content:''; position:fixed; inset:0; z-index:9999; pointer-events:none;
  opacity:.035; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
}

img,iframe{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul,ol{ list-style:none; }

::selection{ background:var(--accent); color:#0a0a0a; }


.header__tel,.hero__meta,.section__note,.feats i,.feats span,.info,.menu__desc,
.loader__mark,.nav__list a{
  font-variant-numeric:lining-nums tabular-nums;
  font-feature-settings:'lnum' 1,'tnum' 1;
}

.hero__meta,.section__note{ font-family:var(--f-ja); }


.ph{
  position:relative; overflow:hidden;
  border:0;              
  background:#000;
}

.ph__in{ filter:grayscale(1) contrast(1.06) brightness(.78); }


.ph::before{ content:''; }
.ph::before,
.ph__in{
  
  position:absolute; left:0; right:0; top:-12%; bottom:-12%;
  background:
    radial-gradient(120% 90% at 30% 15%, rgba(255,255,255,.05), transparent 60%),
    linear-gradient(160deg,#161a22 0%,#0c0f15 55%,#11151d 100%);
  transform:translate3d(0,var(--py,0px),0);
  will-change:transform;
}
.ph__in{ width:100%; height:124%; object-fit:cover; }

.ph:has(.ph__in)::before,
.ph:has(.ph__in)::after{ content:none; }
.ph::after{
  content:attr(data-ph);
  position:absolute; inset:0; display:grid; place-content:center;
  padding:1.5em; text-align:center;
  font-family:var(--f-ui); font-size:11px; line-height:1.9; letter-spacing:.14em;
  color:rgba(231,224,210,.28);
}


.loader{
  position:fixed; inset:0; z-index:2000; background:var(--bg);
  display:grid; place-content:center;
  transition:opacity .8s var(--ease), visibility .8s;
}
.loader.is-done{ opacity:0; visibility:hidden; }
.loader__mark{
  font-family:var(--f-en); font-weight:300; font-size:clamp(24px,4vw,38px);
  letter-spacing:.36em; color:var(--fg);
  animation:pulse 2.2s ease-in-out infinite;
}
@keyframes pulse{ 0%,100%{opacity:.35} 50%{opacity:1} }


.header{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  padding:26px var(--pad);
  transition:padding .5s var(--ease), background .5s, backdrop-filter .5s;
}
.header.is-stuck{
  padding:14px var(--pad);
  background:rgba(0,0,0,.86);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.header__logo{ display:flex; flex-direction:column; gap:2px; line-height:1; }
.header__logo-en{
  font-family:var(--f-en); font-weight:400; font-size:23px;
  letter-spacing:.16em; color:var(--fg);
}
.header__logo-ja{
  font-family:var(--f-ui); font-size:9.5px; letter-spacing:.3em; color:var(--muted);
}

.nav__list{ display:flex; gap:clamp(28px,3.6vw,58px); }
.nav__list a{
  position:relative; display:flex; align-items:baseline;
  font-family:var(--f-ui); font-size:17px; letter-spacing:.03em; color:var(--fg);
  padding-bottom:4px;
}
.nav__list a::after{
  content:''; position:absolute; left:0; bottom:0; width:100%; height:1px;
  background:var(--accent); transform:scaleX(0); transform-origin:right;
  transition:transform .5s var(--ease);
}
.nav__list a:hover::after{ transform:scaleX(1); transform-origin:left; }
.nav__foot{ display:none; }


.header__tel{
  font-family:var(--f-ui); font-size:16px; letter-spacing:.04em;
  color:var(--fg); border:1px solid var(--line);
  padding:7px 20px; border-radius:0; transition:.4s var(--ease);
}
.header__tel:hover{ border-color:var(--fg); background:rgba(255,255,255,.08); }

.burger{ display:none; }


.hero{
  position:relative; min-height:100svh;
  display:flex; flex-direction:column; justify-content:center;
  padding:0 var(--pad);
  overflow:hidden;
}

.hero__sky{
  position:absolute; inset:-10%;
  background:
    radial-gradient(1.2px 1.2px at 12% 22%, rgba(255,255,255,.75), transparent),
    radial-gradient(1px 1px   at 28% 68%, rgba(255,255,255,.5),  transparent),
    radial-gradient(1.6px 1.6px at 46% 14%, rgba(255,246,225,.9), transparent),
    radial-gradient(1px 1px   at 62% 46%, rgba(255,255,255,.45), transparent),
    radial-gradient(1.3px 1.3px at 78% 26%, rgba(255,255,255,.7), transparent),
    radial-gradient(1px 1px   at 88% 72%, rgba(255,255,255,.45), transparent),
    radial-gradient(1px 1px   at 8%  84%, rgba(255,255,255,.4),  transparent),
    radial-gradient(1.1px 1.1px at 68% 88%, rgba(255,255,255,.5), transparent),
    radial-gradient(70% 55% at 74% 18%, rgba(255,255,255,.05), transparent 70%),
    linear-gradient(180deg,#050505 0%,#000000 100%);
  animation:drift 40s ease-in-out infinite alternate;
}


.hero::before{
  content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  
  background-image:repeating-linear-gradient(90deg,
    rgba(255,255,255,.05) 0 1px, transparent 1px calc(100% / 12));
}
@keyframes drift{ from{ transform:translate3d(0,0,0) } to{ transform:translate3d(-2%,1.5%,0) } }

.hero__photo{
  position:absolute; inset:0; border:0; opacity:0; 
  animation:kenburns 22s ease-in-out infinite alternate;
}

.hero__photo:has(.ph__in){ opacity:1; }
@keyframes kenburns{ from{ transform:scale(1) } to{ transform:scale(1.08) } }

.hero__veil{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.34) 40%, rgba(0,0,0,.95) 100%);
}

.hero__inner{ position:relative; z-index:2; max-width:1500px; }
.hero__eyebrow{
  font-family:var(--f-ui); font-size:clamp(14px,1.4vw,18px); letter-spacing:.14em;
  color:var(--fg); margin-bottom:30px; opacity:.88;
}
.hero__title{
  font-family:var(--f-en); font-weight:300;
  
  font-size:clamp(40px,15.4vw,250px); line-height:1.0; letter-spacing:-.005em;
}
.hero__title > span{ display:block; overflow:hidden; }
.hero__title em{ font-style:italic; font-weight:300; color:var(--accent); }
.hero__lead{
  margin-top:34px; font-size:clamp(14px,1.5vw,17px);
  line-height:2.3; letter-spacing:.12em; color:rgba(231,224,210,.82);
}

.hero__meta{
  position:absolute; z-index:2; left:var(--pad); bottom:56px;
  display:flex; align-items:center; gap:16px;
  font-family:var(--f-ui); font-size:11.5px; letter-spacing:.2em; color:var(--muted);
}
.dot{ width:3px; height:3px; border-radius:50%; background:var(--accent); }

.scroll{
  position:absolute; z-index:2; right:var(--pad); bottom:0;
  display:flex; flex-direction:column; align-items:center; gap:14px;
  font-family:var(--f-ui); font-size:10px; letter-spacing:.3em; color:var(--muted);
  writing-mode:vertical-rl;
}
.scroll i{ display:block; width:1px; height:80px; background:var(--line); position:relative; overflow:hidden; }
.scroll i::after{
  content:''; position:absolute; inset:0; background:var(--accent);
  animation:trace 2.4s var(--ease) infinite;
}
@keyframes trace{
  0%{ transform:translateY(-100%) } 50%{ transform:translateY(0) } 100%{ transform:translateY(100%) }
}


.section{ padding:clamp(90px,13vw,180px) var(--pad); }
.section--alt{ background:var(--bg-2); }

.section__head{ margin-bottom:clamp(48px,7vw,90px); }

.label{
  display:flex; align-items:baseline;
  font-family:var(--f-ui); font-weight:400; font-size:clamp(15px,1.5vw,20px);
  letter-spacing:.06em; color:var(--fg); margin-bottom:26px;
}
.label > span::before{ content:'( '; }
.label > span::after{ content:' )'; }


.h2::after{
  content:''; display:block; height:1px; background:var(--line);
  margin-top:clamp(18px,2.4vw,34px);
  transform:scaleX(0); transform-origin:left;
  transition:transform 1.5s var(--ease) .3s;
}
.h2.is-in::after{ transform:scaleX(1); }

.h2{
  font-family:var(--f-en); font-weight:300;
  
  font-size:clamp(34px,10.6vw,168px); line-height:1.04; letter-spacing:-.005em;
}
.h2 > span{ display:block; }
.h2 em{ font-style:italic; font-weight:300; color:var(--accent); }
.h2--c{ text-align:center; }
.h2--c .label{ justify-content:center; }

.section__note{
  margin-top:26px; font-family:var(--f-ui);
  font-size:12px; letter-spacing:.14em; color:var(--muted);
}


.concept{
  display:grid; grid-template-columns:1.15fr .85fr;
  gap:clamp(40px,6vw,90px); align-items:start;
}
.concept__text p{ margin-bottom:1.9em; color:rgba(231,224,210,.78); }
.concept__text p:last-child{ margin-bottom:0; }
.concept__text .lead{
  font-family:var(--f-ja); font-weight:700;
  font-size:clamp(19px,2.2vw,28px); line-height:1.8;
  color:var(--fg); letter-spacing:.01em;
}
.concept__img{ aspect-ratio:3/4; position:sticky; top:120px; }

.feats{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:1px; background:var(--line);
  margin-top:clamp(60px,8vw,110px); border:1px solid var(--line);
}
.feats li{ background:var(--bg); padding:38px 26px; text-align:center; }
.section--alt .feats li{ background:var(--bg-2); }
.feats i{
  display:block; font-family:var(--f-en); font-style:normal; font-weight:300;
  font-size:clamp(40px,5.2vw,72px); line-height:1; letter-spacing:0; color:var(--fg);
}
.feats span{
  display:block; margin-top:10px; font-family:var(--f-ui);
  font-size:10px; letter-spacing:.3em; color:var(--muted); text-transform:uppercase;
}
.feats p{ margin-top:14px; font-size:12.5px; line-height:1.8; color:rgba(231,224,210,.8); }


.stack{ padding-top:0; padding-bottom:0; }
.stack__track{ position:relative; height:calc((var(--n,4) + .55) * 100vh); }
.stack__pin{
  position:sticky; top:0; height:100vh;
  display:grid; grid-template-columns:1.04fr .96fr;
  gap:clamp(30px,5vw,80px); align-items:center;
  padding:96px var(--pad) 64px;
}
.stack__text .section__head{ margin-bottom:clamp(26px,3.4vw,44px); }


.stack .h2{ font-size:clamp(30px,6.3vw,100px); }

.stack .h2::after{ transform:scaleX(var(--p,0)); transition:none; }



.stack__items{ position:relative; min-height:15em; }
.stack__item{
  position:absolute; left:0; top:0; right:0;
  opacity:0; transform:translateY(16px); pointer-events:none;
  transition:opacity .7s var(--ease), transform .7s var(--ease);
}
.stack__item.is-on{ opacity:1; transform:none; pointer-events:auto; }
.stack__no{
  font-family:var(--f-en); font-size:clamp(20px,2.1vw,28px);
  letter-spacing:.02em; color:var(--muted); margin-bottom:6px;
  font-variant-numeric:lining-nums;
}


.stack__cards{
  position:relative; justify-self:center; align-self:center;
  width:min(58vh,40vw); height:min(58vh,40vw);
  perspective:1400px;
}
.card{
  position:absolute; inset:0; overflow:hidden;
  background:#0d0d0d; border-radius:10px;
  box-shadow:0 34px 70px rgba(0,0,0,.8), 0 0 0 1px rgba(255,255,255,.06);
  transform:
    translate3d(var(--tx,0), var(--ty,0), 0)
    rotate(var(--rot,0deg))
    scale(var(--sc,1));
  opacity:var(--op,1);
  will-change:transform,opacity;
}
.card__ph{ position:absolute; inset:0; }

.card::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(0,0,0,.62) 0%, transparent 26%,
                                     transparent 62%, rgba(0,0,0,.72) 100%);
}
.card__en,
.card__no{ position:absolute; z-index:2; font-family:var(--f-en); color:var(--fg); }
.card__en{
  left:clamp(16px,2vw,26px); top:clamp(12px,1.6vw,20px);
  font-size:clamp(17px,1.7vw,24px); letter-spacing:.02em;
}
.card__no{
  right:clamp(16px,2vw,26px); bottom:clamp(4px,1vw,12px);
  font-size:clamp(44px,5.4vw,78px); line-height:1; letter-spacing:.01em;
  font-variant-numeric:lining-nums; opacity:.9;
}

.menu__en{
  font-family:var(--f-en); font-style:normal; font-weight:400;
  font-size:clamp(20px,2vw,27px); letter-spacing:-.01em;
  color:var(--accent); line-height:1.25;
}
.menu__ja{
  font-size:14px; font-weight:500; letter-spacing:.14em;
  margin:6px 0 14px; padding-bottom:14px; border-bottom:1px solid var(--line);
}
.menu__desc{ font-size:12.5px; line-height:2; color:rgba(231,224,210,.8); }


.gallery{
  display:grid; grid-template-columns:repeat(6,1fr);
  grid-auto-rows:11vw; gap:clamp(10px,1.4vw,20px);
}
.g1{ grid-column:1/4; grid-row:1/3; }
.g2{ grid-column:4/6; grid-row:1/4; }
.g3{ grid-column:6/7; grid-row:1/2; }
.g4{ grid-column:6/7; grid-row:2/4; }
.g5{ grid-column:1/4; grid-row:3/4; }

.tags{
  display:flex; flex-wrap:wrap; gap:10px;
  margin-top:clamp(36px,5vw,60px);
}
.tags li{
  font-family:var(--f-ui); font-size:11.5px; letter-spacing:.14em;
  color:var(--muted); border:1px solid var(--line);
  padding:8px 18px; border-radius:0;
}


.access{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,5vw,80px); align-items:start; }
.info div{
  display:grid; grid-template-columns:110px 1fr; gap:24px;
  padding:20px 0; border-bottom:1px solid var(--line);
}
.info div:first-child{ border-top:1px solid var(--line); }
.info dt{
  font-family:var(--f-ui); font-size:11px; letter-spacing:.22em;
  color:var(--muted); padding-top:.5em;
}
.info dd{ font-size:13.5px; line-height:2; }
.info dd a{ color:var(--accent); border-bottom:1px solid rgba(255,255,255,.4); }

.map{
  position:relative; aspect-ratio:3/4; border:1px solid var(--line);
  filter:grayscale(1) invert(.92) contrast(.85) hue-rotate(180deg); 
}
.map iframe{ width:100%; height:100%; border:0; }


.reserve{
  position:relative; padding:clamp(100px,14vw,180px) var(--pad);
  text-align:center; overflow:hidden;
  background:
    radial-gradient(70% 100% at 50% 0%, rgba(255,255,255,.045), transparent 70%),
    var(--bg);
  border-top:1px solid var(--line);
}
.reserve__inner{ max-width:1200px; margin:0 auto; }
.reserve .label{ justify-content:center; }
.reserve .label::after{ display:none; }
.reserve__lead{
  max-width:640px; margin:34px auto 0;
  font-size:14px; line-height:2.3; color:rgba(231,224,210,.85);
}
.btns{ display:flex; justify-content:center; flex-wrap:wrap; gap:16px; margin-top:44px; }
.btn{
  display:inline-flex; align-items:center; gap:12px;
  font-family:var(--f-ui); font-size:14px; letter-spacing:.16em;
  padding:19px 44px; border:1px solid var(--line); border-radius:0;
  transition:.45s var(--ease);
}
.btn__sub{ font-size:9.5px; letter-spacing:.3em; color:var(--accent); }
.btn:hover{ border-color:var(--accent); background:rgba(255,255,255,.08); }
.btn--fill{ background:var(--accent); color:#0a0a0a; border-color:var(--accent); }
.btn--fill .btn__sub{ color:rgba(10,10,10,.55); }
.btn--fill:hover{ background:#dcdcdc; border-color:#dcdcdc; }


.footer{
  padding:70px var(--pad) 90px; text-align:center;
  border-top:1px solid var(--line); background:var(--bg-2);
}
.footer__logo{
  font-family:var(--f-en); font-weight:300; font-size:clamp(28px,3vw,42px);
  letter-spacing:.26em; color:var(--fg);
}
.footer__addr{
  margin-top:22px; font-size:12px; line-height:2.2; color:var(--muted);
}
.footer__copy{
  margin-top:34px; font-family:var(--f-ui);
  font-size:10px; letter-spacing:.2em; color:var(--muted);
}

.totop{
  position:fixed; right:var(--pad); bottom:34px; z-index:900;
  font-family:var(--f-ui); font-size:10px; letter-spacing:.24em; color:var(--muted);
  writing-mode:vertical-rl; padding:14px 0;
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:.6s var(--ease);
}
.totop.is-on{ opacity:1; visibility:visible; transform:translateY(0); }
.totop:hover{ color:var(--accent); }




[data-reveal]{
  opacity:0; transform:translateY(34px);
  transition:opacity 1.4s var(--ease) var(--d,0s), transform 1.4s var(--ease) var(--d,0s);
  will-change:opacity,transform;
}
[data-reveal].is-in{ opacity:1; transform:none; }


[data-split][data-reveal]{ opacity:1; transform:none; transition:none; }


.ch{ display:inline-block !important; will-change:transform,opacity; }

.wd{ display:inline-block; white-space:nowrap; }


[data-split="mask"] > *{
  display:block; overflow:hidden;
  
  padding-bottom:.32em; margin-bottom:-.32em;
}
[data-split="mask"] .ch{
  transform:translateY(115%);
  transition:transform 1.25s cubic-bezier(.16,1,.3,1) var(--cd,0s);
}
[data-split="mask"].is-in .ch{ transform:translateY(0); }


[data-split="fade"] .ch{
  opacity:0; transition:opacity 1s ease var(--cd,0s);
}
[data-split="fade"].is-in .ch{ opacity:1; }



[data-swing]{
  --swing:11deg;
  opacity:0;
  
  transform-origin:50% -75%;
  will-change:transform,opacity;
}

[data-swing][data-reveal]{ transform:none; transition:none; }

[data-swing].is-in{
  
  animation:swingL 1.9s cubic-bezier(.37,0,.63,1) var(--d,0s) both;
}
[data-swing="right"].is-in{ animation-name:swingR; }


@keyframes swingL{
  0%  { opacity:0; transform:rotate(calc(var(--swing) * -1)); }
  22% { opacity:1; }
  44% { transform:rotate(calc(var(--swing) *  .30)); }
  62% { transform:rotate(calc(var(--swing) * -.13)); }
  78% { transform:rotate(calc(var(--swing) *  .055)); }
  90% { transform:rotate(calc(var(--swing) * -.022)); }
  100%{ opacity:1; transform:rotate(0deg); }
}
@keyframes swingR{
  0%  { opacity:0; transform:rotate(var(--swing)); }
  22% { opacity:1; }
  44% { transform:rotate(calc(var(--swing) * -.30)); }
  62% { transform:rotate(calc(var(--swing) *  .13)); }
  78% { transform:rotate(calc(var(--swing) * -.055)); }
  90% { transform:rotate(calc(var(--swing) *  .022)); }
  100%{ opacity:1; transform:rotate(0deg); }
}


.gallery [data-swing]{ --swing:6deg; }
.concept__img[data-swing]{ --swing:7deg; }
.menu__img[data-swing]{ --swing:15deg; }   


.hero.no-anim [data-reveal],
.hero.no-anim .ch,
.no-anim .ch{ transition:none !important; animation:none !important; }


.hero__inner,
.hero__meta{ will-change:transform,opacity; }


@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition-duration:.01ms !important; }
  [data-reveal]{ opacity:1; transform:none; }
  [data-split] .ch{ opacity:1 !important; transform:none !important; }
  [data-swing]{ opacity:1 !important; transform:none !important; }
  html{ scroll-behavior:auto; }
}

.sp{ display:none; }


@media (max-width:1024px){
  .concept{ grid-template-columns:1fr; }
  .concept__img{ position:static; aspect-ratio:16/10; order:-1; }
  .access{ grid-template-columns:1fr; }
  .map{ aspect-ratio:4/3; }
  .feats{ grid-template-columns:repeat(2,1fr); }
}


@media (max-width:900px), (prefers-reduced-motion: reduce){
  .stack{ padding-top:clamp(90px,13vw,180px); padding-bottom:clamp(90px,13vw,180px); }
  .stack__track{ height:auto; }
  .stack__pin{ position:static; height:auto; display:block; padding:0; }
  .stack .h2::after{ transform:scaleX(1); }

  .stack__items{ min-height:0; }
  .stack__item{
    position:static; opacity:1; transform:none; pointer-events:auto;
    margin-bottom:34px; transition:none;
  }
  .stack__no{ margin-bottom:2px; }

  
  .stack__cards{
    width:100%; height:auto; margin-top:38px;
    justify-self:stretch; align-self:stretch; perspective:none;
    display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(10px,1.6vw,18px);
  }
  .card{
    position:relative; inset:auto; aspect-ratio:1/1;
    transform:none !important; opacity:1 !important;
    box-shadow:none; outline:1px solid rgba(255,255,255,.06);
  }
}


@media (max-width:768px){
  body{ font-size:14px; line-height:2; }
  .sp{ display:block; }

  .header{ padding:18px var(--pad); }
  .header.is-stuck{ padding:14px var(--pad); }
  .header__tel{ display:none; }

  
  .burger{
    display:block; position:relative; z-index:1002;
    width:34px; height:22px; background:none; border:0; cursor:pointer;
  }
  .burger span{
    position:absolute; left:0; width:100%; height:1px; background:var(--fg);
    transition:.5s var(--ease);
  }
  .burger span:nth-child(1){ top:6px; }
  .burger span:nth-child(2){ bottom:6px; }
  .burger.is-open span:nth-child(1){ top:11px; transform:rotate(38deg); }
  .burger.is-open span:nth-child(2){ bottom:10px; transform:rotate(-38deg); }

  .nav{
    position:fixed; inset:0; z-index:1001;
    background:rgba(9,11,16,.97); backdrop-filter:blur(10px);
    display:flex; flex-direction:column; justify-content:center;
    padding:0 var(--pad);
    opacity:0; visibility:hidden; transition:.6s var(--ease);
  }
  .nav.is-open{ opacity:1; visibility:visible; }
  .nav__list{ flex-direction:column; gap:0; }
  .nav__list li{ border-bottom:1px solid var(--line); }
  .nav__list a{
    padding:22px 0; font-size:18px; letter-spacing:.2em;
    font-family:var(--f-en);
  }
  .nav__list a::after{ display:none; }
  .nav__foot{
    display:block; margin-top:44px;
    font-family:var(--f-ui); font-size:12px; letter-spacing:.16em; color:var(--muted);
  }
  .nav__tel{
    display:inline-block; font-size:20px; color:var(--accent);
    letter-spacing:.1em; margin-bottom:10px;
  }

  .hero{ min-height:92svh; }
  .hero__meta{ bottom:104px; flex-wrap:wrap; gap:10px; font-size:10.5px; }
  .scroll{ right:calc(var(--pad) - 4px); }
  .scroll i{ height:52px; }

  .menu__item{ grid-template-columns:110px 1fr; gap:20px; align-items:start; }
  .menu__en{ font-size:19px; }

  
  .gallery [data-swing]{ --swing:4.5deg; }
  .concept__img[data-swing]{ --swing:5deg; }
  .menu__img[data-swing]{ --swing:12deg; }

  .gallery{ grid-template-columns:repeat(2,1fr); grid-auto-rows:32vw; }
  .g1{ grid-column:1/3; grid-row:1/2; }
  .g2{ grid-column:1/2; grid-row:2/4; }
  .g3{ grid-column:2/3; grid-row:2/3; }
  .g4{ grid-column:2/3; grid-row:3/4; }
  .g5{ grid-column:1/3; grid-row:4/5; }

  .feats{ grid-template-columns:1fr 1fr; }
  .feats li{ padding:28px 16px; }

  .info div{ grid-template-columns:1fr; gap:6px; padding:18px 0; }
  .info dt{ padding-top:0; }

  .btns{ flex-direction:column; }
  .btn{ justify-content:center; }
  .totop{ display:none; }
}




:root{ color-scheme:dark; }


.steps{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:1px; background:var(--line); border:1px solid var(--line);
}
.steps li{ background:var(--bg); padding:clamp(28px,3vw,44px) clamp(18px,2vw,30px); }
.section--alt .steps li{ background:var(--bg-2); }
.steps__no{
  font-family:var(--f-en); font-weight:300;
  font-size:clamp(34px,4vw,58px); line-height:1; color:var(--accent-2);
  font-variant-numeric:lining-nums tabular-nums;
}
.steps__ja{ margin-top:16px; font-size:14.5px; font-weight:500; line-height:1.8; }
.steps__desc{ margin-top:12px; font-size:12.5px; line-height:2; color:rgba(231,224,210,.8); }


.form{
  max-width:760px; margin:clamp(46px,6vw,72px) auto 0; text-align:left;
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(18px,2.4vw,26px);
}
.field{ grid-column:1/-1; }
.field--half{ grid-column:span 1; }

.form label{
  display:block; font-size:12px; letter-spacing:.08em;
  color:rgba(231,224,210,.82); margin-bottom:10px;
}
.req{
  display:inline-block; margin-left:10px; padding:2px 7px; vertical-align:1px;
  font-family:var(--f-ui); font-size:9.5px; letter-spacing:.18em;
  color:var(--muted); border:1px solid var(--line);
}

.form input[type="text"],
.form input[type="email"],
.form input[type="date"],
.form select,
.form textarea{
  width:100%; padding:15px 16px;
  font-family:var(--f-ja); font-size:14px; line-height:1.7; color:var(--fg);
  background:rgba(255,255,255,.03); border:1px solid var(--line); border-radius:0;
  transition:border-color .35s var(--ease), background .35s var(--ease);
}
.form textarea{ resize:vertical; line-height:2; }
.form input:focus,
.form select:focus,
.form textarea:focus{
  outline:none; border-color:var(--accent); background:rgba(255,255,255,.06);
}
.form ::placeholder{ color:rgba(231,224,210,.3); }


.form select{
  appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,rgba(231,224,210,.55) 50%),
                   linear-gradient(135deg,rgba(231,224,210,.55) 50%,transparent 50%);
  background-position:calc(100% - 22px) calc(50% + 1px), calc(100% - 16px) calc(50% + 1px);
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
  padding-right:46px;
}

.field__note{
  margin-top:10px; font-size:11.5px; line-height:1.9; color:var(--muted);
}

.check{
  grid-column:1/-1; display:flex; align-items:flex-start; gap:13px;
  padding:20px; border:1px solid var(--line);
  font-size:12.5px; line-height:1.95; color:rgba(231,224,210,.85);
}
.check input{ flex:0 0 auto; width:16px; height:16px; margin-top:.4em; accent-color:#fff; }
.check span{ display:block; }

.form .btns{ grid-column:1/-1; margin-top:6px; }
.form .btn{ background:none; cursor:pointer; font:inherit; font-family:var(--f-ui); font-size:14px; letter-spacing:.16em; }
.form .btn--fill{ background:var(--accent); color:#0a0a0a; }

.form__note{
  grid-column:1/-1; text-align:center;
  font-size:11.5px; line-height:2.1; color:var(--muted);
}


.line{
  max-width:760px; margin:clamp(46px,6vw,72px) auto 0; text-align:left;
  display:grid; gap:clamp(18px,2.4vw,26px);
}
.line__head{ font-family:var(--f-ja); font-weight:700; font-size:clamp(15px,1.3vw,18px); letter-spacing:.04em; }
.line__list{ margin:0; border-top:1px solid var(--line); }
.line__list > div{
  display:grid; grid-template-columns:11em 1fr; gap:16px;
  padding:16px 0; border-bottom:1px solid var(--line);
  font-size:13px; line-height:1.9;
}
.line__list dt{ font-weight:700; color:var(--fg); }
.line__list dd{ margin:0; color:var(--muted); }
.line .btns{ margin-top:6px; }

.btn--fill.line__btn{
  background:linear-gradient(120deg, rgba(6,199,85,.55) 0%, rgba(4,110,48,.42) 45%, rgba(0,0,0,.55) 100%);
  border-color:rgba(6,199,85,.5); color:#fff;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
}
.btn--fill.line__btn{
  font-family:var(--f-ja); font-weight:700; font-size:clamp(17px,1.6vw,20px);
  letter-spacing:.06em; padding:22px 52px;
}
.btn--fill.line__btn:hover{
  background:linear-gradient(120deg, rgba(6,199,85,.75) 0%, rgba(4,110,48,.6) 45%, rgba(0,0,0,.6) 100%);
  border-color:rgba(6,199,85,.8);
}
@media (max-width:600px){
  .line__list > div{ grid-template-columns:1fr; gap:4px; }
}


.form__hp{ position:absolute; left:-9999px; opacity:0; pointer-events:none; }

@media (max-width:1024px){
  .steps{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width:768px){
  .steps{ grid-template-columns:1fr; }
  .form{ grid-template-columns:1fr; }
  .field--half{ grid-column:1/-1; }
  .form .btn{ width:100%; justify-content:center; }
}


:root{
  --f-en:'Playfair Display','Times New Roman',serif;
  --f-ui:'Playfair Display','Times New Roman',serif;
  
  --f-ja:'Shippori Mincho','Hiragino Mincho ProN','Noto Serif JP','Yu Mincho',serif;
  --fg:#ebebeb;
}
html,body{ overflow-x:clip; }


body::before{
  content:''; position:fixed; inset:0; z-index:1; pointer-events:none;
  background-image:linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);
  background-size:calc((100% - var(--pad) * 2) / 12) 100%;
  background-position:var(--pad) 0;
}
.hero::before{ content:none; }



[data-split="mask"] .ch{ transform:translateY(135%); transition:transform .62s cubic-bezier(.16,1,.3,1) var(--cd,0s); }
[data-split="mask"].is-in .ch{ transform:translateY(0); }
[data-split="mask"].is-out .ch{ transform:translateY(-135%); }   
[data-split="fade"] .ch{ transition:opacity .5s ease var(--cd,0s); }
[data-reveal]{ transition-duration:1.1s; }


.loader{ display:block; transition:opacity .7s var(--ease), visibility .7s; }
.loader__inner{
  position:absolute; left:var(--pad); right:var(--pad); top:50%; transform:translateY(-50%);
  display:flex; justify-content:space-between; align-items:center;
  font-family:var(--f-en); font-weight:500; font-size:clamp(17px,1.4vw,22px); color:var(--fg); letter-spacing:0;
}
.loader__lines{ display:grid; }
.loader__line{ grid-area:1/1; margin:0; }   
.loader__pct{ font-variant-numeric:lining-nums tabular-nums; }
@media (prefers-reduced-motion:reduce){ .loader__line--1{ display:none; } }


.header__logo-en{ font-size:26px; letter-spacing:0; font-weight:500; }
.header__logo-ja{ font-size:9px; letter-spacing:.24em; }
.nav__list a{ font-size:18px; letter-spacing:0; font-weight:500; }
.header__tel{
  font-size:17px; padding:8px 18px; color:#fff;
  background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.28);
}
.header__tel:hover{ background:rgba(255,255,255,.26); }


.hero{ overflow:hidden; }
.hero__inner{ position:absolute; inset:0; max-width:none; }
.hero__top{ position:absolute; left:var(--pad); top:clamp(110px,16vh,150px); z-index:2; }
.hero__tag{
  font-family:var(--f-ja); font-weight:600; font-size:clamp(16px,1.4vw,22px);
  line-height:1.6; letter-spacing:.02em; color:#fff;
}
.hero__eyebrow{ margin:20px 0 0; font-family:var(--f-en); font-style:italic; font-weight:500; font-size:clamp(16px,1.35vw,21px); letter-spacing:0; opacity:.9; }
.hero__meta{ position:static; margin-top:12px; bottom:auto; left:auto; }
.hero__title{
  position:absolute; left:-.02em; bottom:2.5vh; margin:0; z-index:1;
  font-family:var(--f-en); font-weight:600; font-style:italic;
  font-size:18.6vw; line-height:1; letter-spacing:-.02em; white-space:nowrap; color:#fff;
}
.hero__title em{ font-style:italic; font-weight:600; }
.scroll{ bottom:auto; top:56%; }


.label{ font-size:clamp(19px,1.75vw,28px); letter-spacing:-.01em; margin-bottom:22px; font-weight:500; }

.label > span::before,.label > span::after{ content:none; }
.h2{ font-weight:500; font-size:clamp(36px,9vw,150px); line-height:1.0; letter-spacing:-.015em; color:#fff; }
.h2 em{ font-weight:500; }
.h2--s{ font-size:clamp(30px,5.4vw,86px); }

.stack .h2{ font-size:clamp(28px,5.2vw,80px); }
.h2::after{ margin-top:clamp(16px,2vw,28px); }
.section__head{ margin-bottom:clamp(40px,5vw,64px); }


.concept__text p{ font-size:clamp(14px,1.1vw,17px); font-weight:600; line-height:1.9; letter-spacing:.01em; color:rgba(255,255,255,.92); }
.concept__text .lead{ font-weight:700; font-size:clamp(17px,1.5vw,22px); line-height:1.8; }
.menu__desc,.steps__desc,.feats p{ font-weight:600; letter-spacing:.01em; color:rgba(255,255,255,.85); }
.menu__desc,.steps__desc{ font-size:13.5px; }
.steps__ja,.menu__ja{ font-weight:700; }
.reserve__lead{ font-weight:500; color:rgba(255,255,255,.85); }


.btn--fill,.form .btn--fill{ background:#dedede; border-color:#dedede; color:#111; }
.btn--fill:hover{ background:#f2f2f2; border-color:#f2f2f2; }

@media (max-width:768px){
  .hero__top{ top:calc(84px + 3vh); }
  
  .hero__title{ bottom:6vh; font-size:18vw; }
  .loader__inner{ font-size:16px; }
  .header__logo-en{ font-size:22px; }
}


.reserve .h2{
  display:inline-block; font-size:clamp(46px,9.6vw,164px); letter-spacing:-.02em; margin:0 auto;
}
.reserve .h2::after{ height:2px; background:rgba(255,255,255,.75); margin-top:.06em; }
.reserve__lead{ font-size:clamp(15px,1.15vw,18px); font-weight:600; }




.bgfx{ position:fixed; inset:-25%; z-index:-1; pointer-events:none; overflow:hidden; filter:blur(90px); }
.bgfx i{
  position:absolute; display:block; border-radius:50%;
  background:radial-gradient(circle at 50% 50%, rgba(255,255,255,.28), rgba(255,255,255,0) 62%);
  will-change:transform;
}
.bgfx i:nth-child(1){ width:70vw; height:48vw; left:5%;  top:8%;  animation:blob1 26s ease-in-out infinite alternate; }
.bgfx i:nth-child(2){ width:55vw; height:60vw; left:50%; top:40%; animation:blob2 31s ease-in-out infinite alternate; opacity:.8; }
.bgfx i:nth-child(3){ width:48vw; height:30vw; left:20%; top:65%; animation:blob3 23s ease-in-out infinite alternate; opacity:.7; }
@keyframes blob1{ from{ transform:translate(0,0) rotate(0deg) }      to{ transform:translate(26vw,14vh) rotate(25deg) } }
@keyframes blob2{ from{ transform:translate(0,0) rotate(0deg) }      to{ transform:translate(-24vw,-18vh) rotate(-30deg) } }
@keyframes blob3{ from{ transform:translate(0,0) scale(1) }          to{ transform:translate(30vw,-22vh) scale(1.25) } }

.section,.section--alt,.reserve{ background:transparent; }
.section--alt .feats li,.feats li{ background:transparent; }
.feats{ gap:0; background:none; border:0; }
.feats li{ outline:1px solid var(--line); outline-offset:-1px; }


.hero{ height:190vh; min-height:0; display:block; padding:0; overflow:visible; background:transparent; }
.hero__pin{ position:sticky; top:0; height:100vh; height:100svh; overflow:hidden; }
.hero__sky{ display:none; }
.hero__photo:has(.ph__in){ opacity:.28; }       
.hero__veil{ background:linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,0) 45%, rgba(0,0,0,.55) 100%); }
.hero__top,.hero__title,.hero__msg,.hero__boxes{ will-change:transform,opacity; }
.hero__msg{
  position:absolute; left:var(--pad); top:calc(clamp(110px,16vh,150px) + 18.6vw + 6vh);
  max-width:min(64ch, 84vw); margin:0; opacity:0;
  font-family:var(--f-ja); font-weight:600; font-size:clamp(15px,1.35vw,21px);
  line-height:1.9; letter-spacing:.01em; color:#fff;
}

.hero__boxes{ position:absolute; inset:0; z-index:1; pointer-events:none; }
.hbox{
  position:absolute; border:1px solid rgba(255,255,255,.55);
  font-family:var(--f-en); font-weight:500; font-size:clamp(13px,1.15vw,18px); color:#fff;
}
.hbox > span{ position:absolute; left:14px; top:10px; }
.hbox--1{ left:10.5%; top:42%;  width:14%; height:18%; }   
.hbox--2{ left:46%;   top:22%;  width:36%; height:55%; }   
.hbox--3{ left:74%;   top:53%;  right:-6%; height:36%; }
.hbox--3 > span{ top:10px; bottom:auto; }   
.hbox--4{ left:2.8%;  top:66%;  width:38%; height:44%; }
.hbox--4 > span{ top:10px; bottom:auto; }   
.hbox--5{ left:84%;  top:15%;  width:12%; height:17%; }   
@media (max-width:768px){
  .hbox--5{ left:68%; top:14%; width:26%; height:11%; }
  .hbox--2{ left:30%; top:28%; width:60%; height:40%; }
  .hbox--3{ left:60%; top:58%; }
  .hero__msg{ top:calc(84px + 3vh + 18vw + 8vh); font-size:15px; }
}


.ap{ display:grid; gap:0; }
.ap__item{
  display:grid; grid-template-columns:5ch 1fr 1.1fr; column-gap:clamp(20px,3vw,48px); align-items:end;
  padding:clamp(34px,4.5vw,64px) 0; border-top:1px solid var(--line);
}
.ap__item:last-child{ border-bottom:1px solid var(--line); }
.ap__no{ font-family:var(--f-en); font-weight:500; font-size:clamp(22px,2.2vw,34px); color:rgba(255,255,255,.8); align-self:start; }
.ap__en{ margin:0; font-family:var(--f-en); font-weight:500; font-size:clamp(46px,7.4vw,124px); line-height:1; letter-spacing:-.02em; color:#fff; }
.ap__body{ align-self:end; padding-bottom:.35em; }
.ap__ja{ font-family:var(--f-ja); font-weight:700; font-size:clamp(17px,1.9vw,30px); line-height:1.5; color:#fff; }
.ap__desc{ margin-top:14px; font-family:var(--f-ja); font-weight:600; font-size:clamp(13px,1vw,15.5px); line-height:1.95; color:rgba(255,255,255,.85); }
@media (max-width:900px){
  .ap__item{ grid-template-columns:4ch 1fr; }
  .ap__body{ grid-column:2; padding-top:16px; }
}


.stack__no{
  display:flex; align-items:baseline; gap:16px; margin-bottom:8px;
  font-family:var(--f-en); font-weight:500; font-size:clamp(20px,2vw,30px); color:#fff;
  font-variant-numeric:lining-nums;
}
.stack__no > span{ font-family:var(--f-ja); font-weight:700; font-size:clamp(12.5px,1vw,15px); letter-spacing:.02em; }
.menu__en{
  margin:6px 0 0; padding-bottom:clamp(14px,1.6vw,22px);
  font-family:var(--f-en); font-weight:500; font-style:normal; font-size:clamp(34px,4.1vw,64px);
  line-height:1.05; letter-spacing:-.015em; color:#fff;
  border-bottom:1px solid rgba(255,255,255,.4);
}
.menu__desc{ margin-top:clamp(14px,1.6vw,22px); font-size:clamp(13px,1vw,15.5px); line-height:1.95; }
.stack__items{ min-height:16.5em; }
.card{ border-radius:14px; }
.card__en{ font-family:var(--f-en); font-weight:500; font-size:clamp(16px,1.5vw,24px); letter-spacing:0; text-transform:none; }
.card__no{ font-family:var(--f-en); font-style:italic; font-weight:500; font-size:clamp(40px,4.6vw,72px); }


.reserve__tag{
  margin:0 auto 34px; font-family:var(--f-ja); font-weight:600;
  font-size:clamp(14px,1.15vw,18px); line-height:1.9; color:rgba(255,255,255,.85);
}
.reserve__tag > span{ display:block; overflow:hidden; padding-bottom:.32em; margin-bottom:-.32em; }
.reserve__foot{ margin-top:clamp(60px,9vw,130px); display:flex; flex-direction:column; align-items:center; gap:22px; }
.foot__top{ font-family:var(--f-en); font-weight:500; font-size:clamp(16px,1.3vw,20px); color:rgba(255,255,255,.85); }
.foot__circle{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  width:46px; height:46px; border:1px solid rgba(255,255,255,.5); border-radius:50%;
  font-family:var(--f-en); font-size:12px; line-height:1; color:rgba(255,255,255,.85); gap:2px;
  transition:border-color .4s var(--ease), background .4s var(--ease);
}
.foot__circle:hover{ border-color:#fff; background:rgba(255,255,255,.1); }
.foot__circle i{ font-style:normal; }


body{ font-family:var(--f-ja); }
.hero__tag{ font-weight:700; letter-spacing:.06em; }
.hero__msg,.concept__text p,.menu__desc,.ap__desc,.reserve__lead,.reserve__tag,.field__note,.form__note,.check{ letter-spacing:.04em; }
.concept__text p,.menu__desc,.ap__desc,.reserve__lead{ font-weight:700; color:rgba(255,255,255,.92); }
.concept__text .lead,.ap__ja,.stack__no > span,.menu__ja,.reserve__tag{ font-weight:700; }
.hero__msg{ font-weight:700; }
.info dt{ font-weight:700; letter-spacing:.06em; }
.info dd{ font-weight:700; letter-spacing:.03em; }
.form label{ letter-spacing:.08em; }
.steps__desc,.field__note,.form__note,.check,.form label,.form input,.form select,.form textarea,.nav__foot,.footer{ font-weight:700; }


body{ word-break:keep-all; overflow-wrap:anywhere; line-break:strict; }
[data-split]{ word-break:normal; overflow-wrap:normal; }
p,dd,li,dt,h3{ text-wrap:pretty; }          
.reserve__lead,.form__note,.field__note,.section__note,.feats p,.line__head{ text-wrap:balance; }


@media (max-width:600px){
  .concept__text p,.menu__desc,.ap__desc,.info dd,.reserve__lead,.check,.field__note{
    font-size:15px; letter-spacing:.02em; line-height:1.95;
  }
  .form__note,.section__note{ font-size:12.5px; letter-spacing:.02em; line-height:1.9; }
  .feats p{ font-size:12px; letter-spacing:0; }

  
  .hero__meta{ display:grid; grid-template-columns:auto auto; justify-content:start;
               gap:4px 18px; font-size:10.5px; letter-spacing:.08em; margin-top:14px; }
  .hero__meta .dot{ display:none; }

  
  .hbox{ font-size:12px; }
  .hbox > span{ left:10px; top:7px; }
  .hbox--1{ left:6%;  top:39%; width:34%; height:13%; }
  .hbox--2{ left:46%; top:35%; width:48%; height:21%; }
  .hbox--5{ left:10%; top:56%; width:30%; height:12%; }
  .hbox--3{ left:56%; top:60%; right:-6%; height:16%; }
  .hbox--3 > span,.hbox--4 > span{ top:7px; bottom:auto; }
  .hbox--4{ left:2.8%; top:72%; width:40%; height:20%; }
}


@media (max-width:900px), (prefers-reduced-motion: reduce){
  .stack__pin{ display:grid; grid-template-columns:minmax(0,1fr); gap:0; }   
  .stack__text,.stack__items,.stack__cards{ display:contents; }
  .stack__text .section__head{ order:0; }
  .card{ aspect-ratio:4/3; margin:0 0 4px; }            
  .stack__item{ margin-bottom:84px; }                    
  .stack__no{ margin-top:0; padding-top:10px; line-height:1.3; }   
  .stack__cards > .card:nth-child(1){ order:1; }  .stack__items > .stack__item:nth-child(1){ order:2; }
  .stack__cards > .card:nth-child(2){ order:3; }  .stack__items > .stack__item:nth-child(2){ order:4; }
  .stack__cards > .card:nth-child(3){ order:5; }  .stack__items > .stack__item:nth-child(3){ order:6; }
  .stack__cards > .card:nth-child(4){ order:7; }  .stack__items > .stack__item:nth-child(4){ order:8; }
  .stack__cards > .card:nth-child(5){ order:9; }  .stack__items > .stack__item:nth-child(5){ order:10; }
  .stack .section__note{ order:11; margin-top:0; }
}


.footer__links{ margin-top:26px; display:flex; flex-wrap:wrap; justify-content:center; gap:6px 28px; font-size:12px; }
.footer__links a{ color:var(--muted); text-decoration:none; border-bottom:1px solid var(--line); padding-bottom:2px; }
.footer__links a:hover{ color:var(--fg); }
.info__sub{ display:block; margin-top:6px; font-size:.86em; font-weight:600; color:var(--muted); }
