:root{
  --sumi:        #14130f;
  --sumi-deep:   #0c0b08;
  --ivory:       #e8e3d8;
  --ivory-dim:   #a8a296;
  --gold:        #b89968;
  --gold-soft:   rgba(184,153,104,0.35);

  --font-jp: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Noto Serif JP", "Songti SC", serif;
  --font-en: "Cormorant Garamond", "EB Garamond", Georgia, "Times New Roman", "Yu Mincho", serif;
}

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

html{ scroll-behavior:smooth; }

body{
  background:var(--sumi);
  color:var(--ivory);
  font-family:var(--font-jp);
  font-weight:400;
  line-height:2.0;
  letter-spacing:0.18em;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

body.lang-en{
  font-family:var(--font-en);
  letter-spacing:0.08em;
}

body.no-scroll{ overflow:hidden; }

.calligraphy{
  width:auto;
  user-select:none;
  pointer-events:none;
}

img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }

#opening{
  position:fixed;
  inset:0;
  z-index:9999;
  background:var(--sumi-deep);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  transition:opacity 1.6s ease;
}
#opening.hide{
  opacity:0;
  pointer-events:none;
}
.opening-title{
  font-size:clamp(3.5rem, 12vw, 8rem);
  letter-spacing:0.45em;
  color:var(--ivory);
  opacity:0;

  animation:openingFade 3.2s ease forwards;
  text-indent:0.45em;
}
.opening-sub{
  margin-top:2.2rem;
  font-size:clamp(0.7rem, 2vw, 0.9rem);
  letter-spacing:0.5em;
  color:var(--gold);
  opacity:0;
  animation:openingFade 3.2s ease 0.6s forwards;
  text-indent:0.5em;
}
@keyframes openingFade{
  0%   { opacity:0; transform:translateY(14px); filter:blur(6px); }
  40%  { opacity:1; transform:translateY(0);    filter:blur(0); }
  100% { opacity:1; transform:translateY(0);    filter:blur(0); }
}

header#nav{
  position:fixed;
  top:0; left:0; right:0;
  z-index:1000;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:1.4rem clamp(1.2rem, 4vw, 3.5rem);
  background:rgba(20,19,15,0);
  transition:background 0.6s ease, padding 0.6s ease;
}

header#nav.scrolled{
  background:rgba(12,11,8,0.92);
  padding:1.0rem clamp(1.2rem, 4vw, 3.5rem);
  border-bottom:1px solid var(--gold-soft);
}
.nav-logo{
  font-size:1.25rem;
  letter-spacing:0.4em;
  color:var(--ivory);
  text-indent:0.4em;
}
.nav-menu{
  display:flex;
  align-items:center;
  gap:clamp(1.2rem, 3vw, 2.6rem);
}
.nav-menu a{
  font-size:0.78rem;
  letter-spacing:0.28em;
  color:var(--ivory-dim);
  transition:color 0.4s ease;
  text-indent:0.28em;
}
.nav-menu a:hover{ color:var(--gold); }

.lang-switch{
  display:flex;
  align-items:center;
  gap:0.5rem;
  font-size:0.78rem;
  letter-spacing:0.1em;
}
.lang-switch button{
  background:none;
  border:none;
  color:var(--ivory-dim);
  cursor:pointer;
  font-family:inherit;
  font-size:0.78rem;
  letter-spacing:0.1em;
  padding:0.2rem 0.1rem;
  transition:color 0.4s ease;
}
.lang-switch button.active{ color:var(--gold); }
.lang-switch .divider{ color:var(--gold-soft); }

@media (max-width:768px){
  .nav-menu .nav-link{ display:none; }
}

section{
  padding:clamp(5rem, 12vw, 10rem) clamp(1.4rem, 6vw, 7rem);
  position:relative;
}

.rule-gold{
  width:100%;
  max-width:1100px;
  margin:0 auto;
  height:1px;
  background:linear-gradient(90deg,
    transparent, var(--gold-soft) 20%, var(--gold-soft) 80%, transparent);
}

.section-label{
  font-size:1rem;
  letter-spacing:0.5em;
  color:var(--gold);
  margin-bottom:1.8rem;
  text-indent:0.5em;
}
.section-title{
  font-size:clamp(1.8rem, 4vw, 2.8rem);
  letter-spacing:0.25em;
  font-weight:400;
  line-height:1.6;
  margin-bottom:3rem;
  text-indent:0.25em;
}

.reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity 1.6s ease, transform 1.6s ease;
}
.reveal.visible{
  opacity:1;
  transform:translateY(0);
}

.vertical{
  writing-mode:vertical-rl;
  text-orientation:upright;
  letter-spacing:0.3em;
  line-height:1.9;
}

#mv{
  height:100vh;
  min-height:600px;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  overflow:hidden;
}

.mv-bg{
  position:absolute;
  inset:0;
  background-image:url('images/IMG_5358.JPG');
  background-size:cover;
  background-position:center;

  filter:brightness(0.42) contrast(1.05);
  transform:scale(1.05);
}
.mv-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(12,11,8,0.5), rgba(12,11,8,0.25) 50%, rgba(12,11,8,0.75));
}
.mv-inner{
  position:relative;
  z-index:2;
  text-align:center;
  padding:0 1.5rem;
}
.mv-title{
  font-size:clamp(4rem, 14vw, 9rem);
  letter-spacing:0.4em;
  line-height:1;
  color:var(--ivory);
  text-indent:0.4em;
  margin-bottom:2rem;
}
.mv-sub{
  font-size:clamp(0.85rem, 2.4vw, 1.1rem);
  letter-spacing:0.4em;
  color:var(--ivory);
  text-indent:0.4em;
}
.mv-scroll{
  position:absolute;
  bottom:2.5rem;
  left:50%;
  transform:translateX(-50%);
  z-index:2;
  font-size:0.65rem;
  letter-spacing:0.4em;
  color:var(--ivory-dim);
  writing-mode:vertical-rl;
}
.mv-scroll::after{
  content:"";
  display:block;
  width:1px;
  height:50px;
  margin:0.8rem auto 0;
  background:linear-gradient(var(--gold), transparent);
}

.profile-grid{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:clamp(2.5rem, 6vw, 6rem);
  align-items:center;
}

.profile-photo{
  width:100%;
  aspect-ratio:3/4;
  background-image:url('images/taisho.jpeg');
  background-size:cover;
  background-position:center 25%;
  filter:brightness(0.95);
}
.profile-body p{
  font-size:1rem;
  color:var(--ivory);
  margin-bottom:1.6rem;
}
.profile-name{
  margin-top:2.5rem;
  font-size:1.3rem;
  letter-spacing:0.3em;
  color:var(--gold);
  text-indent:0.3em;
}
.profile-name span{
  display:block;
  font-size:0.75rem;
  letter-spacing:0.3em;
  color:var(--ivory-dim);
  margin-top:0.6rem;
}
@media (max-width:768px){
  .profile-grid{ grid-template-columns:1fr; }
  .profile-photo{ max-width:340px; margin:0 auto; }
}

.menu-wrap{ max-width:900px; margin:0 auto; }
.course{
  padding:3rem 0;
  border-bottom:1px solid var(--gold-soft);
  text-align:center;
}
.course:first-of-type{ border-top:1px solid var(--gold-soft); }
.course-name{
  font-size:clamp(1.4rem, 3.5vw, 2rem);
  letter-spacing:0.3em;
  margin-bottom:1rem;
  text-indent:0.3em;
}
.course-desc{
  font-size:0.9rem;
  color:var(--ivory-dim);
  margin-bottom:1.6rem;
}
.course-price{
  font-size:1.15rem;
  letter-spacing:0.2em;
  color:var(--gold);
}
.menu-note{
  max-width:900px;
  margin:2.8rem auto 0;
  font-size:0.78rem;
  line-height:2;
  color:var(--ivory-dim);
  text-align:center;
  letter-spacing:0.12em;
}

#reserve{
  text-align:center;
  position:relative;
  background-image:linear-gradient(rgba(12,11,8,0.82), rgba(12,11,8,0.88)),
                   url('images/8003aa6c424a451d62078d9d68c3ac.jpg');
  background-size:cover;
  background-position:center;
  background-attachment:fixed;
}
.reserve-inner{ max-width:760px; margin:0 auto; position:relative; z-index:1; }
.reserve-lead{
  font-size:1.05rem;
  line-height:2.2;
  margin-bottom:3rem;
  color:var(--ivory);
}

.reserve-btn{
  display:inline-block;
  padding:1.1rem 3.5rem;
  border:1px solid var(--gold);
  color:var(--gold);
  font-size:0.85rem;
  letter-spacing:0.4em;
  text-indent:0.4em;
  transition:background 0.5s ease, color 0.5s ease;
}
.reserve-btn:hover{
  background:var(--gold);
  color:var(--sumi);
}

.info-wrap{ max-width:820px; margin:0 auto; }
.info-table{
  width:100%;
  border-collapse:collapse;
}
.info-table th,
.info-table td{
  text-align:left;
  padding:1.3rem 0.5rem;
  border-bottom:1px solid var(--gold-soft);
  font-weight:400;
  vertical-align:top;
}
.info-table th{
  width:34%;
  font-size:0.8rem;
  letter-spacing:0.3em;
  color:var(--gold);
  white-space:nowrap;
}
.info-table td{
  font-size:0.95rem;
  color:var(--ivory);
  letter-spacing:0.1em;
}
.map-link{
  display:inline-block;
  margin-top:2.6rem;
  font-size:0.8rem;
  letter-spacing:0.3em;
  color:var(--ivory-dim);
  border-bottom:1px solid var(--gold-soft);
  padding-bottom:0.4rem;
  transition:color 0.4s ease;
  text-indent:0.3em;
}
.map-link:hover{ color:var(--gold); }
@media (max-width:600px){
  .info-table th{ width:40%; font-size:0.72rem; }
  .info-table td{ font-size:0.85rem; }
}

footer{
  text-align:center;
  padding:4rem 1.5rem 5rem;
  border-top:1px solid var(--gold-soft);
}
.footer-logo{
  font-size:1.6rem;
  letter-spacing:0.5em;
  color:var(--ivory);
  text-indent:0.5em;
  margin-bottom:1.2rem;
}
.footer-copy{
  font-size:0.68rem;
  letter-spacing:0.25em;
  color:var(--ivory-dim);
}

.footer-sns{ margin-top:2.4rem; }
.footer-sns a{
  display:inline-flex;
  align-items:center;
  gap:0.6rem;
  color:var(--ivory-dim);
  font-size:0.72rem;
  letter-spacing:0.3em;
  text-indent:0.3em;
  transition:color 0.4s ease;
}
.footer-sns a:hover{ color:var(--gold); }
.footer-sns svg{ width:19px; height:19px; }