@charset "UTF-8";

/* ============================================================
   ひふみ旅館 — 2026 redesign
   一二三 = 一つ、二つ、三つ。ロゴの三本線はその数の連なり。
   ============================================================ */

:root{
  /* 墨・和紙・弁柄 ── アクセントは朱の一色のみ */
  --sumi:        #14110f;
  --sumi-2:      #1d1917;
  --sumi-3:      #2a2422;
  --washi:       #f6f2ea;
  --washi-2:     #efe9de;
  --ink:         #211c19;
  --ink-soft:    #4f463f;
  --ink-faint:   #928880;
  --line:        #ded5c8;
  --line-dark:   rgba(246,242,234,.16);
  --accent:      #9c3a3a;
  --accent-soft: #c4736a;
  --accent-dim:  #d59a86;   /* 墨地の上で朱を読ませるための明度違い */

  --mincho: 'Shippori Mincho B1', 'Yu Mincho', 'Hiragino Mincho ProN', serif;
  --gothic: 'Zen Kaku Gothic New', 'Hiragino Sans', 'Noto Sans JP', sans-serif;
  --latin:  'Cormorant Garamond', 'Times New Roman', serif;
  --display:'Italiana', 'Cormorant Garamond', serif;
  --hand:   'Caveat', cursive;

  /* 余白は一般的なサイトの倍近く取る */
  --pad-section: clamp(120px, 15vw, 260px);
  --gutter: clamp(20px, 5vw, 80px);
  --maxw: 1320px;

  --ease: cubic-bezier(.22,.61,.28,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --dur: .9s;
}

/* ---------- base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--washi);
  color:var(--ink);
  font-family:var(--gothic);
  font-weight:400;
  font-size:16px;
  line-height:2.2;
  letter-spacing:.08em;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.is-locked{ overflow:hidden; }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ margin:0; font-weight:400; letter-spacing:.1em; }
p{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }
::selection{ background:var(--accent); color:var(--washi); }

.content{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter); position:relative; z-index:2; }

/* ---------- 粒子（紙の肌理） ---------- */
.grain{
  position:fixed; inset:-50%; z-index:9000; pointer-events:none; opacity:.035;
  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='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grainShift 6s steps(6) infinite;
}
@keyframes grainShift{
  0%{transform:translate(0,0)} 20%{transform:translate(-3%,2%)} 40%{transform:translate(2%,-3%)}
  60%{transform:translate(-2%,-2%)} 80%{transform:translate(3%,1%)} 100%{transform:translate(0,0)}
}

/* ---------- のれん（開幕） ---------- */
.curtain{ position:fixed; inset:0; z-index:9500; pointer-events:none; }
.curtain-panel{
  position:absolute; top:0; bottom:0; width:50.2%;
  background:var(--sumi);
  transition:transform 1.25s var(--ease-out);
}
.curtain-l{ left:0; }
.curtain-r{ right:0; }
.curtain-l::after,.curtain-r::after{
  content:''; position:absolute; top:0; bottom:0; width:1px; background:var(--line-dark);
}
.curtain-l::after{ right:0; }
.curtain-r::after{ left:0; }
.curtain-mark{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:92px; color:var(--washi); transition:opacity .5s var(--ease);
}
.curtain.is-open .curtain-l{ transform:translateX(-100%); }
.curtain.is-open .curtain-r{ transform:translateX(100%); }
.curtain.is-open .curtain-mark{ opacity:0; transition-duration:.35s; }
.curtain.is-done{ display:none; }

/* ---------- ロゴマーク（一二三） ---------- */
.mark{ display:block; width:100%; height:auto; overflow:visible; }
.mark-ring{
  fill:none; stroke:currentColor; stroke-width:1.1;
  stroke-dasharray:186 207; stroke-dashoffset:0;
  transform-origin:50% 50%; transform:rotate(-96deg);
  opacity:.85;
}
.mark-bar{ fill:currentColor; transform-origin:26px 50%; }
.mark-lg .mark-ring{ animation:ringDraw 1.4s var(--ease-out) forwards; }
.mark-lg .mark-bar{ transform:scaleX(0); animation:barIn .7s var(--ease-out) forwards; }
.mark-lg .b1{ animation-delay:.35s; } .mark-lg .b2{ animation-delay:.5s; } .mark-lg .b3{ animation-delay:.65s; }
@keyframes ringDraw{ from{ stroke-dashoffset:207; opacity:0 } to{ stroke-dashoffset:0; opacity:.85 } }
@keyframes barIn{ from{ transform:scaleX(0) } to{ transform:scaleX(1) } }

.logo .mark-ring{ transition:transform 1.4s var(--ease-out), opacity .4s; }
.logo:hover .mark-ring{ transform:rotate(264deg); opacity:1; }
.logo:hover .mark-bar{ animation:barPulse .6s var(--ease-out); }
.logo:hover .b2{ animation-delay:.06s; } .logo:hover .b3{ animation-delay:.12s; }
@keyframes barPulse{ 0%{transform:scaleX(1)} 45%{transform:scaleX(.2)} 100%{transform:scaleX(1)} }

/* ---------- スクロール進捗 ---------- */
.scroll-progress{
  position:fixed; top:0; left:0; right:0; height:2px; z-index:8000; pointer-events:none;
  background:transparent;
}
.scroll-progress i{
  display:block; height:100%; width:0%;
  background:linear-gradient(90deg,var(--accent),var(--accent-soft));
  transition:width .12s linear;
}

/* ---------- カーソル ---------- */
.cursor,.cursor-dot{ position:fixed; z-index:8500; pointer-events:none; border-radius:50%; mix-blend-mode:difference; opacity:0; }
.cursor{ width:34px; height:34px; border:1px solid rgba(255,255,255,.75); transition:opacity .3s, width .35s var(--ease), height .35s var(--ease), background .35s; }
.cursor-dot{ width:4px; height:4px; background:#fff; transition:opacity .3s; }
.cursor.is-active{ width:64px; height:64px; background:rgba(255,255,255,.12); }
@media (hover:none),(max-width:900px){ .cursor,.cursor-dot{ display:none; } }

/* ============================================================
   HEADER
   ============================================================ */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:7000;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  padding:26px var(--gutter);
  transition:transform .6s var(--ease), background .6s var(--ease), padding .6s var(--ease), box-shadow .6s var(--ease), backdrop-filter .6s;
  color:var(--washi);
}
/* 背景とぼかしは擬似要素に持たせる。
   header 自身に backdrop-filter / transform を掛けると、その中の position:fixed
   （＝スマホの全画面メニュー）が画面ではなくヘッダーの内側に閉じ込められてしまう。 */
.site-header::before{
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:rgba(20,17,15,.72);
  backdrop-filter:blur(18px) saturate(1.2);
  -webkit-backdrop-filter:blur(18px) saturate(1.2);
  box-shadow:0 1px 0 var(--line-dark);
  opacity:0; transition:opacity .6s var(--ease);
}
.site-header.scrolled{ padding:14px var(--gutter); }
.site-header.scrolled::before{ opacity:1; }
/* メニューを開いている間は、移動中の transform も含めて包含ブロックを作らせない */
body.menu-open .site-header{ transform:none; transition:padding .6s var(--ease); }
/* メニューを開いている間は、チャットのボタン（最前面に出る）を伏せる */
#talkappi-app{ transition:opacity .35s var(--ease); }
body.menu-open #talkappi-app{ opacity:0; pointer-events:none; }
.site-header.hide{ transform:translateY(-104%); }

.logo{ display:flex; align-items:center; gap:14px; flex-shrink:0; }
.logo .mark-sm{ width:34px; }
.logo-text{ display:flex; flex-direction:column; line-height:1.25; }
.logo-mark{ font-family:var(--mincho); font-size:17px; letter-spacing:.24em; font-weight:500; }
.logo-sub{ font-family:var(--latin); font-size:9.5px; letter-spacing:.42em; opacity:.62; }

.main-nav{ display:flex; align-items:center; gap:clamp(18px,2.6vw,42px); margin-left:auto; }
.nav-list{ display:flex; gap:clamp(14px,1.9vw,30px); }
.nav-list a{
  position:relative; font-family:var(--mincho); font-size:13.5px; letter-spacing:.16em; opacity:.88;
  padding:6px 0; display:block; overflow:hidden;
}
.nav-list a span{ display:block; transition:transform .5s var(--ease-out); }
.nav-list a::after{
  content:''; position:absolute; left:0; bottom:0; width:100%; height:1px; background:currentColor;
  transform:scaleX(0); transform-origin:right; transition:transform .6s var(--ease-out);
}
.nav-list a:hover::after{ transform:scaleX(1); transform-origin:left; }
.nav-list a:hover span{ transform:translateY(-2px); }

.nav-actions{ display:flex; align-items:center; gap:clamp(12px,1.6vw,24px); }
.manage-link{ font-size:11.5px; letter-spacing:.14em; opacity:.7; border-bottom:1px solid transparent; transition:opacity .4s, border-color .4s; }
.manage-link:hover{ opacity:1; border-color:currentColor; }

.reserve-btn{
  position:relative; overflow:hidden; display:inline-block;
  padding:12px 30px; border:1px solid rgba(246,242,234,.5);
  font-family:var(--mincho); font-size:13px; letter-spacing:.22em;
  transition:color .5s var(--ease), border-color .5s var(--ease), transform .5s var(--ease-out);
}
.reserve-btn span{ position:relative; z-index:2; }
.reserve-btn::before{
  content:''; position:absolute; inset:0; background:var(--accent);
  transform:translateY(101%); transition:transform .55s var(--ease-out);
}
.reserve-btn:hover{ border-color:var(--accent); }
.reserve-btn:hover::before{ transform:translateY(0); }

.lang-switcher{ display:flex; align-items:center; gap:10px; font-size:10.5px; letter-spacing:.14em; }
.lang-active{ opacity:1; border-bottom:1px solid var(--accent-soft); padding-bottom:2px; }
.lang-link{ opacity:.55; transition:opacity .4s; }
.lang-link:hover{ opacity:1; }

.menu-toggle{
  display:none; width:46px; height:46px; background:none; border:0; cursor:pointer; padding:0;
  position:relative; z-index:7600;
}
.menu-toggle span{
  display:block; height:1px; background:currentColor; margin:7px auto; width:26px;
  transition:transform .5s var(--ease-out), opacity .3s;
}
body.menu-open .menu-toggle span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
body.menu-open .menu-toggle span:nth-child(2){ opacity:0; }
body.menu-open .menu-toggle span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative; min-height:100svh; display:flex; align-items:flex-end;
  overflow:hidden; background:var(--sumi); color:var(--washi);
  padding:0 var(--gutter) clamp(90px,13vh,150px);
}
.hero-media{ position:absolute; inset:-8% 0; }
.hero-image{
  position:absolute; inset:0;
  background:url("/img/hero-exterior-night.jpg") center 58%/cover no-repeat;
  transform:scale(1.08);
  animation:kenburns 26s var(--ease) infinite alternate;
}
@keyframes kenburns{ from{ transform:scale(1.06) translate3d(0,0,0) } to{ transform:scale(1.16) translate3d(-1.5%,-1.5%,0) } }
.hero-veil{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(14,11,10,.72) 0%, rgba(14,11,10,.24) 32%, rgba(14,11,10,.62) 72%, rgba(14,11,10,.92) 100%),
    radial-gradient(120% 90% at 18% 85%, rgba(14,11,10,.72), transparent 62%);
}
.hero-kamon{
  position:absolute; right:-7vw; top:6vh; width:min(58vw,720px); height:min(58vw,720px);
  color:var(--washi); opacity:.05; pointer-events:none;
  animation:slowSpin 160s linear infinite;
}
@keyframes slowSpin{ to{ transform:rotate(360deg) } }
.hero-rings{
  position:absolute; right:6vw; bottom:-14vh; width:min(62vw,760px); height:min(62vw,760px);
  pointer-events:none; opacity:.22;
}
.hero-rings circle{ fill:none; stroke:var(--washi); stroke-width:.5; }

.hero-content{ position:relative; z-index:3; width:100%; max-width:var(--maxw); margin:0 auto; }
.hero .hero-eyebrow{
  font-family:var(--latin); font-size:12px; letter-spacing:.56em; opacity:0; color:var(--accent-dim);
  margin-bottom:34px; text-transform:uppercase;
  animation:fadeUp 1.2s var(--ease-out) .35s forwards;
}
.hero-title{
  font-family:var(--mincho); font-weight:500;
  font-size:clamp(42px,7.2vw,104px); line-height:1.42; letter-spacing:.09em;
  text-shadow:0 2px 40px rgba(0,0,0,.35);
}
.hero-title .accent{ color:#e7c9a8; position:relative; }
.hero-title .accent::after{
  content:''; position:absolute; left:0; right:0; bottom:.1em; height:1px; background:currentColor;
  transform:scaleX(0); transform-origin:left;
  animation:lineGrow 1.6s var(--ease-out) 1.5s forwards; opacity:.5;
}
@keyframes lineGrow{ to{ transform:scaleX(1) } }


/* 見出しが3行以上の言語（EN など）は一段詰める */
body.hero-dense .hero-title{ font-size:clamp(32px,5.2vw,74px); line-height:1.36; }
body.hero-dense .hero .hero-eyebrow{ margin-bottom:22px; }
body.hero-dense .hero-subtitle{ margin-top:24px; }
body.hero-dense .hero-cta{ margin-top:clamp(28px,3.6vw,46px); }

.line{ display:block; overflow:hidden; }
.line-in{ display:block; transform:translateY(110%); opacity:0; }
.is-ready .hero-title .line-in{ animation:lineUp 1.25s var(--ease-out) forwards; }
.is-ready .hero-title .line:nth-child(1) .line-in{ animation-delay:.5s; }
.is-ready .hero-title .line:nth-child(2) .line-in{ animation-delay:.66s; }
.is-ready .hero-subtitle .line-in{ animation:lineUp 1.1s var(--ease-out) forwards; }
.is-ready .hero-subtitle .line:nth-child(1) .line-in{ animation-delay:.95s; }
.is-ready .hero-subtitle .line:nth-child(2) .line-in{ animation-delay:1.05s; }
@keyframes lineUp{ to{ transform:translateY(0); opacity:1 } }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(16px) } to{ opacity:1; transform:none } }

.hero-subtitle{
  font-family:var(--latin); font-style:italic; font-weight:300;
  font-size:clamp(15px,1.5vw,21px); line-height:2; letter-spacing:.06em;
  opacity:.82; margin-top:34px;
}
.hero-cta{
  position:relative; display:inline-flex; align-items:center; gap:18px;
  margin-top:clamp(40px,5vw,64px); padding:19px 44px;
  border:1px solid rgba(246,242,234,.45); overflow:hidden;
  font-family:var(--mincho); font-size:15px; letter-spacing:.2em;
  opacity:0; animation:fadeUp 1.1s var(--ease-out) 1.35s forwards;
  transition:border-color .5s var(--ease), transform .5s var(--ease-out), box-shadow .5s var(--ease);
}
.hero-cta::before{
  content:''; position:absolute; inset:0; background:var(--accent);
  transform:translateX(-101%); transition:transform .6s var(--ease-out);
}
.hero-cta > *{ position:relative; z-index:2; }
.hero-cta:hover{ border-color:var(--accent); box-shadow:0 18px 44px -22px rgba(0,0,0,.8); }
.hero-cta:hover::before{ transform:translateX(0); }
.hero-cta .arrow{ transition:transform .5s var(--ease-out); }
.hero-cta:hover .arrow{ transform:translateX(9px); }

.hero-vertical{
  position:absolute; left:calc(var(--gutter) - 4px); top:22vh; z-index:3;
  height:60vh;                    /* 長い欧文は段に折り返して画面外へ出さない */
  opacity:0; animation:fadeUp 1.4s var(--ease-out) 1.7s forwards;
}
.vertical-text{
  writing-mode:vertical-lr; font-family:var(--mincho);
  font-size:11.5px; letter-spacing:.34em; opacity:.6;
  max-height:100%;
}
html[lang="ja"] .vertical-text{ font-size:12.5px; letter-spacing:.7em; }
.vertical-text::after{ content:''; display:block; width:1px; height:64px; margin:22px auto 0; background:linear-gradient(var(--washi),transparent); opacity:.5; }

.hero-scroll{
  position:absolute; right:calc(var(--gutter) + 96px); bottom:0; z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:14px;
  opacity:0; animation:fadeUp 1.2s var(--ease-out) 1.9s forwards;
}
.hero-scroll-text{ font-family:var(--latin); font-size:10px; letter-spacing:.44em; writing-mode:vertical-rl; opacity:.65; }
.hero-scroll-line{ width:1px; height:84px; background:rgba(246,242,234,.22); overflow:hidden; }
.hero-scroll-line i{ display:block; width:100%; height:34%; background:var(--accent-soft); animation:scrollRun 2.4s var(--ease) infinite; }
@keyframes scrollRun{ 0%{ transform:translateY(-100%) } 60%,100%{ transform:translateY(300%) } }

/* ============================================================
   共通：スクロール出現
   ============================================================ */
[data-reveal]{ opacity:0; transform:translateY(38px); transition:opacity 1s var(--ease-out), transform 1.15s var(--ease-out); will-change:opacity,transform; }
[data-reveal].in{ opacity:1; transform:none; }
[data-reveal] .line-in{ transform:translateY(110%); opacity:0; transition:transform 1.05s var(--ease-out), opacity .8s var(--ease-out); }
[data-reveal].in .line-in{ transform:none; opacity:1; }
[data-reveal].in .line:nth-child(2) .line-in{ transition-delay:.1s; }
[data-reveal].in .line:nth-child(3) .line-in{ transition-delay:.2s; }
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition-duration:.01ms !important; }
  [data-reveal]{ opacity:1; transform:none; }
  .line-in{ transform:none !important; opacity:1 !important; }
}

/* 画像の幕開け */
.img-mask{ position:absolute; inset:0; background:var(--washi); transform-origin:bottom; z-index:2; pointer-events:none; }
[data-reveal].in .img-mask,.point-card.in .img-mask,.room-card.in .img-mask,.menu-item.in .img-mask{ animation:maskUp 1.15s var(--ease-out) .12s forwards; }
@keyframes maskUp{ to{ transform:scaleY(0) } }

/* ============================================================
   INTRO
   ============================================================ */
.intro{ position:relative; padding:var(--pad-section) 0 calc(var(--pad-section) * .58); background:var(--washi); }
.seigaiha-top{
  position:absolute; top:0; left:0; width:100%; height:46px; color:var(--line); opacity:.42; pointer-events:none;
}
.intro-grid{ display:grid; grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr); gap:clamp(44px,7vw,110px); align-items:center; }

.intro-visual{ position:relative; }
.intro-visual-frame{ position:relative; overflow:hidden; aspect-ratio:4/5; background:var(--sumi-2); }
.intro-visual-frame img{ position:absolute; inset:-9% 0; width:100%; height:118%; object-fit:cover; filter:grayscale(.18) contrast(1.04) brightness(.92); }
.intro-visual-frame::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(200deg, rgba(20,17,15,.1), rgba(20,17,15,.55));
}
.intro-visual-line{ position:absolute; left:-18px; top:-18px; width:76px; height:76px; border-left:1px solid var(--accent); border-top:1px solid var(--accent); opacity:.6; }
.intro-visual::after{ content:''; position:absolute; right:-18px; bottom:-18px; width:76px; height:76px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }

.intro-label{ display:flex; align-items:baseline; gap:24px; margin-bottom:clamp(30px,4vw,52px); }
.intro-label-en{ font-family:var(--latin); font-size:12px; letter-spacing:.44em; color:var(--accent); }
.intro-label-jp{ font-family:var(--mincho); font-size:clamp(40px,5vw,66px); line-height:1; color:var(--ink); opacity:.16; }

.intro-content h2{
  font-family:var(--mincho); font-size:clamp(25px,3.3vw,46px); line-height:2; letter-spacing:.12em;
  margin-bottom:clamp(32px,4vw,56px); font-weight:500;
}
.intro-content h2 .em{ color:var(--accent); position:relative; white-space:nowrap; }
.intro-content h2 .em::before{
  content:''; position:absolute; left:-.1em; right:-.1em; bottom:-.16em; height:6px;
  background:linear-gradient(90deg, rgba(156,58,58,.16), rgba(156,58,58,.03));
}
.intro-content p{ font-size:15.5px; line-height:2.5; color:var(--ink-soft); max-width:46em; }
.intro-content p + p{ margin-top:1.9em; }

/* ============================================================
   POINTS
   ============================================================ */
.points{ padding:calc(var(--pad-section) * .7) 0 calc(var(--pad-section) * .85); background:var(--washi-2); position:relative; }
.points::before{
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.32;
  background-image:linear-gradient(var(--line) 1px, transparent 1px);
  background-size:100% 72px; mask-image:linear-gradient(transparent, #000 40%, transparent);
  -webkit-mask-image:linear-gradient(transparent, #000 40%, transparent);
}
.points-header{ text-align:center; margin-bottom:clamp(60px,8vw,110px); }
.points-eyebrow{ font-family:var(--latin); font-size:12px; letter-spacing:.44em; color:var(--accent); margin-bottom:22px; }
.points-title{ font-family:var(--mincho); font-size:clamp(25px,3.4vw,44px); letter-spacing:.2em; font-weight:500; }
.rule{ display:block; width:min(200px,40vw); height:1px; margin:34px auto 0; color:var(--line); }
.rule line{ stroke:currentColor; stroke-width:1; stroke-dasharray:200; stroke-dashoffset:200; transition:stroke-dashoffset 1.6s var(--ease-out) .2s; }
.rule.in line{ stroke-dashoffset:0; }

.points-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(30px,4vw,64px); }
.point-card{ position:relative; transition:transform .7s var(--ease-out); }
.point-card:hover{ transform:translateY(-10px); }
.point-num{
  position:absolute; top:-34px; left:-8px; z-index:3;
  font-family:var(--display); font-size:clamp(56px,7vw,96px); line-height:1;
  color:var(--accent); opacity:.14; transition:opacity .6s var(--ease), transform .8s var(--ease-out);
}
.point-card:hover .point-num{ opacity:.3; transform:translateY(-6px); }
.point-img-wrap{ position:relative; overflow:hidden; aspect-ratio:4/3; margin-bottom:34px; background:var(--sumi-3); }
.point-img-wrap img{ width:100%; height:100%; object-fit:cover; transition:transform 1.4s var(--ease-out), filter 1s var(--ease); filter:saturate(.92); }
.point-card:hover .point-img-wrap img{ transform:scale(1.07); filter:saturate(1.03); }
.point-img-wrap::after{
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, transparent 45%, rgba(20,17,15,.42));
  opacity:.8; transition:opacity .7s var(--ease);
}
.point-card:hover .point-img-wrap::after{ opacity:.45; }
.point-chapter{ font-family:var(--mincho); font-size:12px; letter-spacing:.42em; color:var(--accent); margin-bottom:16px; }
.point-card h3{ font-family:var(--mincho); font-size:clamp(19px,1.8vw,24px); line-height:1.95; letter-spacing:.1em; margin-bottom:20px; font-weight:500; }
.point-card p{ font-size:14.5px; line-height:2.35; color:var(--ink-soft); margin-bottom:26px; }
.point-link{
  display:inline-block;   /* 「ACCESS →」を一続きの文字として保つ */
  font-family:var(--latin); font-size:13px; letter-spacing:.32em; color:var(--accent);
  padding-bottom:8px; position:relative;
}
.point-link::after{ content:''; position:absolute; left:0; bottom:0; width:100%; height:1px; background:currentColor; opacity:.35; transform:scaleX(.34); transform-origin:left; transition:transform .7s var(--ease-out), opacity .5s; }
.point-link:hover::after{ transform:scaleX(1); opacity:.8; }
.point-link i{ font-style:normal; display:inline-block; transition:transform .5s var(--ease-out); }
.point-link:hover i{ transform:translateX(7px); }

/* ============================================================
   共通セクションヘッダ
   ============================================================ */
.section-header{ display:flex; align-items:baseline; gap:clamp(18px,2.6vw,38px); flex-wrap:wrap; margin-bottom:clamp(56px,7vw,104px); }
.section-num{ font-family:var(--latin); font-size:12.5px; letter-spacing:.42em; color:var(--accent); }
.section-title-jp{ font-family:var(--mincho); font-size:clamp(28px,4vw,54px); letter-spacing:.2em; font-weight:500; }
.section-title-en{ font-family:var(--display); font-size:clamp(13px,1.3vw,17px); letter-spacing:.56em; opacity:.35; }
.section-header.light .section-num{ color:var(--accent-dim); }
.section-header.light .section-title-jp{ color:var(--washi); }
.section-header.light .section-title-en{ color:var(--washi); opacity:.4; }

/* ============================================================
   ROOMS
   ============================================================ */
.rooms{ position:relative; padding:var(--pad-section) 0; background:var(--washi); overflow:hidden; }
.rooms-bg{ position:absolute; inset:0; z-index:0; }
.rooms-bg img{ position:absolute; top:-9%; left:0; width:100%; height:118%; object-fit:cover; filter:grayscale(.5) brightness(1.06); }
.rooms-bg span{ position:absolute; inset:0; background:linear-gradient(180deg, var(--washi) 0%, rgba(246,242,234,.965) 18%, rgba(246,242,234,.985) 55%, var(--washi) 100%); }

.rooms-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(28px,3.4vw,52px); }
.room-card{
  position:relative; background:#fffdfa; border:1px solid var(--line);
  display:flex; flex-direction:column; overflow:hidden;
  transition:transform .75s var(--ease-out), box-shadow .75s var(--ease), border-color .6s;
}
.room-card:hover{ transform:translateY(-12px); box-shadow:0 40px 70px -46px rgba(33,28,25,.55); border-color:var(--ink-faint); }
.room-card.feature{ grid-row:span 1; }
.room-card.feature .room-img{ aspect-ratio:4/3; }
.room-img{ position:relative; overflow:hidden; aspect-ratio:4/3; background:var(--sumi-3); }
.room-img img{ width:100%; height:100%; object-fit:cover; transition:transform 1.5s var(--ease-out); }
.room-card:hover .room-img img{ transform:scale(1.08); }
.room-body{ padding:clamp(26px,2.8vw,40px); display:flex; flex-direction:column; flex:1; }
.room-card .room-tatami{ font-family:var(--display); font-size:12px; letter-spacing:.42em; color:var(--accent); margin-bottom:14px; }
.room-name{ font-family:var(--mincho); font-size:clamp(21px,2vw,27px); letter-spacing:.14em; margin-bottom:18px; }
.room-meta{ display:flex; flex-wrap:wrap; gap:8px 10px; margin-bottom:22px; }
.room-meta span{ font-size:11.5px; letter-spacing:.1em; color:var(--ink-soft); border:1px solid var(--line); padding:5px 12px; border-radius:999px; }
.room-desc{ font-size:14.5px; line-height:2.3; color:var(--ink-soft); margin-bottom:30px; flex:1; }
.room-actions{ display:flex; flex-direction:column; gap:12px; }
.room-actions .room-detail,.room-actions .room-reserve{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  font-family:var(--mincho); font-size:13.5px; letter-spacing:.14em;
  padding:14px 20px; border:1px solid var(--line); position:relative; overflow:hidden;
  transition:color .5s var(--ease), border-color .5s var(--ease);
}
.room-actions .room-detail > *,.room-actions .room-reserve > *{ position:relative; z-index:2; }
.room-actions .room-detail::before,.room-actions .room-reserve::before{
  content:''; position:absolute; inset:0; background:var(--ink); transform:translateY(101%);
  transition:transform .55s var(--ease-out);
}
.room-actions .room-reserve{ border-color:var(--accent); color:var(--accent); }
.room-actions .room-reserve::before{ background:var(--accent); }
.room-actions .room-detail:hover,.room-actions .room-reserve:hover{ color:var(--washi); }
.room-actions .room-detail:hover::before,.room-actions .room-reserve:hover::before{ transform:translateY(0); }
.arrow{ font-style:normal; transition:transform .5s var(--ease-out); }
.room-actions .room-detail:hover .arrow,.room-actions .room-reserve:hover .arrow{ transform:translateX(7px); }

/* ============================================================
   CUISINE
   ============================================================ */
.cuisine{ position:relative; background:var(--sumi); color:var(--washi); padding:var(--pad-section) 0; overflow:hidden; }
.cuisine::before{
  content:''; position:absolute; inset:0; opacity:.5; pointer-events:none;
  background:
    radial-gradient(90% 60% at 10% 0%, rgba(156,58,58,.16), transparent 60%),
    radial-gradient(70% 50% at 100% 100%, rgba(231,201,168,.08), transparent 60%);
}
.cuisine-feature{ display:grid; grid-template-columns:1.08fr 1fr; gap:clamp(40px,6vw,96px); align-items:center; }
.cuisine-feature-img{ position:relative; overflow:hidden; aspect-ratio:5/4; }
.cuisine-feature-img img{ width:100%; height:100%; object-fit:cover; transition:transform 2s var(--ease-out); }
.cuisine-feature-img:hover img{ transform:scale(1.06); }
.cuisine-feature-img .img-mask{ background:var(--sumi); }
.cuisine-feature-img::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(140deg, rgba(20,17,15,.28), transparent 45%, rgba(20,17,15,.35));
}
.cuisine-feature-text h3{
  font-family:var(--mincho); font-size:clamp(25px,3.2vw,44px); line-height:1.95; letter-spacing:.12em;
  margin-bottom:clamp(28px,3.4vw,44px); font-weight:500;
}
.cuisine-feature-text h3 .em{ color:#e0b98e; }
.cuisine-feature-text p{ font-size:15.5px; line-height:2.5; color:rgba(246,242,234,.72); }
.cuisine-callout{
  position:relative; margin-top:clamp(34px,4vw,54px); padding-left:30px;
  font-family:var(--latin); font-style:italic; font-size:clamp(16px,1.6vw,22px); line-height:2;
  color:rgba(246,242,234,.9);
}
.quote-line{ position:absolute; left:0; top:4px; width:2px; height:calc(100% - 8px); color:var(--accent-soft); }
.quote-line line{ stroke:currentColor; stroke-width:2; stroke-dasharray:80; stroke-dashoffset:80; transition:stroke-dashoffset 1.4s var(--ease-out) .3s; }
.cuisine-callout.in .quote-line line{ stroke-dashoffset:0; }

/* 四季の帯 */
.season-band{ position:relative; height:clamp(220px,34vw,420px); margin:clamp(80px,10vw,150px) 0; overflow:hidden; }
.season-band-img{ position:absolute; inset:-12% 0; }
.season-band-img img{ width:100%; height:100%; object-fit:cover; filter:saturate(.72) contrast(.98) brightness(.88); }
.season-band-veil{
  position:absolute; inset:0;
  background:linear-gradient(180deg, var(--sumi) 0%, rgba(20,17,15,.28) 38%, rgba(20,17,15,.38) 62%, var(--sumi) 100%);
}
.season-lines{ position:absolute; inset:0; width:100%; height:100%; opacity:.5; }
.season-lines path{ stroke:rgba(246,242,234,.35); stroke-width:1; }

.banquet-intro{ text-align:center; margin-bottom:clamp(56px,7vw,96px); }
.banquet-eyebrow{ font-family:var(--latin); font-size:12px; letter-spacing:.44em; color:var(--accent-dim); margin-bottom:22px; }
.banquet-intro h3{ font-family:var(--mincho); font-size:clamp(23px,3vw,38px); letter-spacing:.2em; margin-bottom:26px; font-weight:500; }
.banquet-intro p{ font-size:14.5px; line-height:2.5; color:rgba(246,242,234,.65); }

.cuisine-menu{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(20px,2.6vw,40px); }
.menu-item{ position:relative; transition:transform .7s var(--ease-out); }
.menu-item:hover{ transform:translateY(-8px); }
.menu-item-img{ position:relative; overflow:hidden; aspect-ratio:1/1; margin-bottom:22px; background:var(--sumi-3); }
.menu-item-img .img-mask{ background:var(--sumi); }
.menu-item-img img{ width:100%; height:100%; object-fit:cover; transition:transform 1.4s var(--ease-out), filter .8s; filter:brightness(.95); }
.menu-item:hover .menu-item-img img{ transform:scale(1.08); filter:brightness(1.05); }
.menu-item-img::after{
  content:''; position:absolute; inset:0; z-index:1; border:1px solid rgba(246,242,234,.14);
  transition:border-color .6s var(--ease);
}
.menu-item:hover .menu-item-img::after{ border-color:rgba(231,201,168,.5); }
.menu-name{ font-family:var(--mincho); font-size:16px; letter-spacing:.14em; margin-bottom:10px; }
.menu-price{ font-family:var(--latin); font-size:15px; letter-spacing:.12em; color:rgba(246,242,234,.6); }
.menu-price .yen{ color:var(--accent-dim); margin-right:3px; }

/* ============================================================
   DAILY / VOICES
   ============================================================ */
.daily{ padding:var(--pad-section) 0 calc(var(--pad-section) * .7); background:var(--washi); }
.daily-intro,.voices-header{ text-align:center; margin-bottom:clamp(48px,6vw,80px); }
.hand{ font-family:var(--hand); font-size:clamp(24px,2.6vw,34px); color:var(--accent); margin-bottom:14px; letter-spacing:.02em; }
.daily-intro h2,.voices-header h2{ font-family:var(--mincho); font-size:clamp(25px,3.2vw,42px); letter-spacing:.2em; margin-bottom:24px; font-weight:500; }
.daily-intro p{ font-size:14.5px; line-height:2.5; color:var(--ink-soft); }
.daily-instagram,.voices-widget{ min-height:180px; position:relative; }
.daily-cta{ text-align:center; margin-top:clamp(40px,5vw,64px); }
.daily-cta a{
  display:inline-flex; align-items:center; gap:14px; padding:17px 38px;
  border:1px solid var(--line); font-family:var(--mincho); font-size:14px; letter-spacing:.14em;
  position:relative; overflow:hidden; transition:color .5s var(--ease), border-color .5s, transform .5s var(--ease-out);
}
.daily-cta a > *{ position:relative; z-index:2; }
.daily-cta a::before{ content:''; position:absolute; inset:0; background:var(--ink); transform:translateY(101%); transition:transform .55s var(--ease-out); }
.daily-cta a:hover{ color:var(--washi); border-color:var(--ink); }
.daily-cta a:hover::before{ transform:translateY(0); }
.ig-icon{ width:19px; height:19px; }
.daily-cta a:hover .arrow{ transform:translateX(7px); }

.voices{ padding:0 0 var(--pad-section); background:var(--washi); }

/* ============================================================
   ACCESS
   ============================================================ */
.access{ position:relative; padding:var(--pad-section) 0; background:var(--washi-2); overflow:hidden; }
.access-bg{ position:absolute; inset:0; z-index:0; }
.access-bg img{ position:absolute; top:-9%; left:0; width:100%; height:118%; object-fit:cover; filter:grayscale(.72) brightness(1.1); }
.access-bg span{
  position:absolute; inset:0;
  background:linear-gradient(180deg, var(--washi-2) 0%, rgba(239,233,222,.965) 16%, rgba(239,233,222,.985) 52%, var(--washi-2) 100%);
}
.access-grid{ display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(40px,6vw,96px); align-items:start; }
.access-text h3{ font-family:var(--mincho); font-size:clamp(24px,3vw,40px); line-height:1.9; letter-spacing:.12em; margin-bottom:28px; font-weight:500; }
.access-lead{ font-family:var(--mincho); font-size:15px; line-height:2.4; color:var(--ink-soft); margin-bottom:clamp(36px,4vw,56px); }
.access-detail{ border-top:1px solid var(--line); }
.access-row{ display:grid; grid-template-columns:120px 1fr; gap:20px; padding:24px 0; border-bottom:1px solid var(--line); }
.access-label{ font-family:var(--mincho); font-size:12.5px; letter-spacing:.24em; color:var(--accent); padding-top:4px; }
.access-value{ font-size:14.5px; line-height:2.2; color:var(--ink-soft); }
.map-link{ border-bottom:1px solid transparent; transition:border-color .5s, color .4s; }
.map-link:hover{ border-color:var(--accent); color:var(--ink); }
.access-tel{ display:block; font-family:var(--latin); font-size:clamp(26px,2.8vw,36px); letter-spacing:.06em; color:var(--ink); margin-bottom:4px; transition:color .4s; }
.access-tel:hover{ color:var(--accent); }
.tel-note{ font-family:var(--gothic); font-size:11px; letter-spacing:.1em; margin-left:10px; color:var(--ink-faint); }

.access-map{ position:relative; overflow:hidden; aspect-ratio:4/3; border:1px solid var(--line); background:#ded7cb; }
.access-map iframe{ width:100%; height:100%; border:0; filter:grayscale(.85) contrast(1.05); transition:filter 1s var(--ease); }
.access-map:hover iframe{ filter:grayscale(0); }

.luup-banner{
  margin-top:clamp(70px,8vw,120px); display:grid; grid-template-columns:1.05fr 1fr;
  background:#fffdfa; border:1px solid var(--line); overflow:hidden;
  transition:box-shadow .8s var(--ease);
}
.luup-banner:hover{ box-shadow:0 42px 80px -54px rgba(33,28,25,.6); }
.luup-banner-img{ position:relative; overflow:hidden; min-height:300px; background:#f2ece2; display:flex; align-items:center; }
.luup-banner-img img{ width:100%; height:auto; max-height:100%; object-fit:contain; transition:transform 1.6s var(--ease-out); }
.luup-banner:hover .luup-banner-img img{ transform:scale(1.05); }
.luup-banner-body{ padding:clamp(32px,4vw,64px); display:flex; flex-direction:column; justify-content:center; }
.luup-banner-label{ font-family:var(--latin); font-size:11.5px; letter-spacing:.42em; color:var(--accent); margin-bottom:18px; }
.luup-banner-body h3{ font-family:var(--mincho); font-size:clamp(21px,2.2vw,30px); line-height:1.9; letter-spacing:.12em; margin-bottom:22px; font-weight:500; }
.luup-banner-body p{ font-size:14px; line-height:2.35; color:var(--ink-soft); margin-bottom:30px; }
.luup-banner-cta{
  align-self:flex-start; position:relative; overflow:hidden;
  padding:14px 32px; border:1px solid var(--ink); font-family:var(--mincho); font-size:13.5px; letter-spacing:.16em;
  transition:color .5s var(--ease), transform .5s var(--ease-out);
}
.luup-banner-cta span{ position:relative; z-index:2; }
.luup-banner-cta::before{ content:''; position:absolute; inset:0; background:var(--ink); transform:translateX(-101%); transition:transform .55s var(--ease-out); }
.luup-banner-cta:hover{ color:var(--washi); }
.luup-banner-cta:hover::before{ transform:translateX(0); }
.luup-banner-apps{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; margin-top:26px; font-size:11.5px; letter-spacing:.1em; color:var(--ink-faint); }
.luup-banner-apps a{ border-bottom:1px solid var(--line); padding-bottom:3px; color:var(--ink-soft); transition:border-color .4s, color .4s; }
.luup-banner-apps a:hover{ border-color:var(--accent); color:var(--accent); }

/* ============================================================
   NEWS
   ============================================================ */
.news{ padding:var(--pad-section) 0; background:var(--washi); }
.news-list{ border-top:1px solid var(--line); }
.news-item{
  position:relative; display:grid; grid-template-columns:120px 140px 1fr 40px; align-items:center; gap:24px;
  padding:34px 8px; border-bottom:1px solid var(--line);
  transition:padding .6s var(--ease-out), color .4s;
}
.news-item::before{
  content:''; position:absolute; left:0; bottom:-1px; width:100%; height:1px; background:var(--accent);
  transform:scaleX(0); transform-origin:left; transition:transform .8s var(--ease-out);
}
.news-item:hover{ padding-left:22px; }
.news-item:hover::before{ transform:scaleX(1); }
.news-date{ font-family:var(--latin); font-size:15px; letter-spacing:.1em; color:var(--ink-faint); }
.news-cat{ font-size:11.5px; letter-spacing:.14em; color:var(--accent); border:1px solid rgba(156,58,58,.3); padding:5px 0; text-align:center; border-radius:999px; }
.news-title{ font-family:var(--mincho); font-size:16px; letter-spacing:.08em; line-height:1.9; }
.news-arrow{ text-align:right; color:var(--ink-faint); transition:transform .5s var(--ease-out), color .4s; }
.news-item:hover .news-arrow{ transform:translateX(8px); color:var(--accent); }
.tag-new,.feat-mark{ font-family:var(--gothic); font-size:10.5px; letter-spacing:.12em; color:var(--accent); border:1px solid rgba(156,58,58,.35); padding:2px 9px; border-radius:999px; margin-right:12px; }
.news-item.is-featured{ background:linear-gradient(90deg, rgba(156,58,58,.05), transparent 60%); }
.news-more{ margin-top:clamp(40px,5vw,64px); text-align:right; }
.news-more a{
  display:inline-block; font-family:var(--mincho); font-size:14px; letter-spacing:.16em;
  padding-bottom:10px; position:relative;
}
.news-more a::after{ content:''; position:absolute; left:0; bottom:0; width:100%; height:1px; background:var(--ink); transform:scaleX(.3); transform-origin:left; transition:transform .7s var(--ease-out), background .4s; }
.news-more a:hover::after{ transform:scaleX(1); background:var(--accent); }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ position:relative; background:var(--sumi); color:var(--washi); padding:clamp(110px,13vw,180px) 0 48px; overflow:hidden; }
.footer-bg{ position:absolute; inset:0; z-index:0; overflow:hidden; }
.footer-bg img{ position:absolute; top:-8%; left:0; width:100%; height:116%; object-fit:cover; opacity:.5; }
.footer-bg span{
  position:absolute; inset:0;
  background:linear-gradient(180deg, var(--sumi) 0%, rgba(20,17,15,.82) 30%, rgba(20,17,15,.9) 65%, var(--sumi) 100%);
}
.footer-wave{ position:absolute; top:-1px; left:0; width:100%; height:clamp(60px,8vw,120px); z-index:2; }
.footer-wave path{ fill:var(--washi); }
.footer-grid{ display:grid; grid-template-columns:1.6fr repeat(3,1fr); gap:clamp(36px,4.5vw,72px); padding-bottom:clamp(60px,7vw,96px); border-bottom:1px solid var(--line-dark); }
.footer-brand{ position:relative; }
.footer-kamon{ position:absolute; right:2%; top:-46px; width:210px; height:210px; color:var(--washi); opacity:.05; pointer-events:none; }
.footer-brand .mark-md{ width:44px; margin-bottom:22px; color:var(--washi); opacity:.9; }
.footer-logo{ font-family:var(--mincho); font-size:23px; letter-spacing:.26em; margin-bottom:10px; }
.footer-logo-en{ font-family:var(--latin); font-size:11px; letter-spacing:.24em; white-space:nowrap; opacity:.5; margin-bottom:30px; }
.footer-brand p{ font-size:13px; line-height:2.3; color:rgba(246,242,234,.6); margin-bottom:26px; }
.footer-brand .map-link:hover{ color:var(--washi); border-color:var(--accent-soft); }
.footer-tel{ display:block; font-family:var(--latin); font-size:30px; letter-spacing:.06em; transition:color .4s; }
.footer-tel:hover{ color:var(--accent-soft); }
.footer-tel .tel-note{ color:rgba(246,242,234,.45); }
.footer-tel-hours{ display:block; font-size:11.5px; letter-spacing:.1em; color:rgba(246,242,234,.45); margin-top:6px; }

.footer-col h4{ font-family:var(--display); font-size:12px; letter-spacing:.44em; color:var(--accent-dim); margin-bottom:26px; }
.footer-col li{ margin-bottom:15px; }
.footer-col a{ font-size:13.5px; letter-spacing:.1em; color:rgba(246,242,234,.68); position:relative; padding-bottom:3px; transition:color .4s; }
.footer-col a::after{ content:''; position:absolute; left:0; bottom:0; width:100%; height:1px; background:var(--accent-soft); transform:scaleX(0); transform-origin:right; transition:transform .5s var(--ease-out); }
.footer-col a:hover{ color:var(--washi); }
.footer-col a:hover::after{ transform:scaleX(1); transform-origin:left; }

.footer-bottom{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; padding-top:40px; font-size:11px; letter-spacing:.14em; color:rgba(246,242,234,.42); }
.social-links{ display:flex; flex-wrap:wrap; gap:clamp(14px,2vw,28px); }
.social-links a{ transition:color .4s; }
.social-links a:hover{ color:var(--accent-soft); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1180px){
  .nav-list{ gap:16px; }
  .nav-list a{ font-size:12.5px; }
  .manage-link{ display:none; }
}

@media (max-width:1024px){
  .cuisine-menu{ grid-template-columns:repeat(2,1fr); }
  .points-grid,.rooms-grid{ grid-template-columns:repeat(2,1fr); }
  .rooms-grid .room-card.feature{ grid-column:span 2; }
  .rooms-grid .room-card.feature{ display:grid; grid-template-columns:1fr 1fr; }
  .rooms-grid .room-card.feature .room-img{ aspect-ratio:auto; height:100%; }
  .access-grid,.cuisine-feature,.intro-grid,.luup-banner{ grid-template-columns:1fr; }
  .intro-visual{ max-width:420px; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}

@media (max-width:900px){
  body{ font-size:15px; }
  .menu-toggle{ display:block; color:var(--washi); }
  .site-header{ color:var(--washi); }
  .site-header.scrolled .menu-toggle{ color:var(--washi); }

  .main-nav{
    position:fixed; inset:0; z-index:7400;
    flex-direction:column; align-items:flex-start; gap:26px;
    justify-content:center; justify-content:safe center;  /* 画面が低いとき先頭が切れないように */
    padding:96px clamp(28px,9vw,80px) 116px;   /* 下端はチャットのボタンに重ならない高さを空ける */
    overflow-y:auto; overscroll-behavior:contain;
    background:var(--sumi);
    clip-path:circle(0% at calc(100% - 46px) 42px);
    transition:clip-path .9s var(--ease-out);
    margin-left:0;
  }
  body.menu-open .main-nav{ clip-path:circle(150% at calc(100% - 46px) 42px); }
  .nav-list{ flex-direction:column; gap:14px; }
  .nav-list a{ font-size:20px; letter-spacing:.2em; line-height:1.6; }
  .nav-list li{ opacity:0; transform:translateY(24px); transition:opacity .6s var(--ease-out), transform .7s var(--ease-out); }
  body.menu-open .nav-list li{ opacity:1; transform:none; }
  body.menu-open .nav-list li:nth-child(1){ transition-delay:.22s }
  body.menu-open .nav-list li:nth-child(2){ transition-delay:.28s }
  body.menu-open .nav-list li:nth-child(3){ transition-delay:.34s }
  body.menu-open .nav-list li:nth-child(4){ transition-delay:.40s }
  body.menu-open .nav-list li:nth-child(5){ transition-delay:.46s }
  body.menu-open .nav-list li:nth-child(6){ transition-delay:.52s }
  body.menu-open .nav-list li:nth-child(7){ transition-delay:.58s }
  body.menu-open .nav-list li:nth-child(8){ transition-delay:.64s }
  .nav-actions{ flex-direction:column; align-items:flex-start; gap:22px; opacity:0; transition:opacity .6s var(--ease-out) .7s; }
  body.menu-open .nav-actions{ opacity:1; }
  .manage-link{ display:inline-block; }

  .hero{ min-height:92svh; align-items:flex-end; padding-bottom:clamp(110px,16vh,170px); }
  .hero-vertical{ display:none; }
  .hero-scroll{ right:auto; left:var(--gutter); }
  .hero-title{ line-height:1.55; }

  .points-grid,.rooms-grid,.cuisine-menu{ grid-template-columns:1fr; }
  .rooms-grid .room-card.feature{ grid-column:span 1; display:flex; }
  .rooms-grid .room-card.feature .room-img{ aspect-ratio:4/3; }
  .point-num{ top:-24px; }
  .news-item{ grid-template-columns:1fr 40px; grid-template-areas:"date arrow" "cat arrow" "title title"; gap:10px 16px; padding:26px 4px; }
  .news-date{ grid-area:date; } .news-cat{ grid-area:cat; justify-self:start; padding:5px 16px; } .news-title{ grid-area:title; } .news-arrow{ grid-area:arrow; }
  .access-row{ grid-template-columns:1fr; gap:8px; }
  .footer-grid{ grid-template-columns:1fr; }
  .footer-kamon{ display:none; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; }
}

@media (max-width:520px){
  .hero-title{ font-size:38px; }
  .hero-cta{ width:100%; justify-content:space-between; padding:17px 26px; }
  .intro-label{ gap:16px; }
  .season-band{ margin:70px 0; }
}

/* ============================================================
   客室ページ（/rooms/）
   ============================================================ */
.page-hero{
  position:relative; min-height:clamp(420px,62vh,640px);
  display:flex; align-items:flex-end;
  padding:0 var(--gutter) clamp(56px,8vh,96px);
  background:var(--sumi); color:var(--washi); overflow:hidden;
}
.page-hero-img{ position:absolute; inset:-8% 0; background-size:cover; background-position:center 55%; }
.page-hero::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(14,11,10,.66) 0%, rgba(14,11,10,.26) 40%, rgba(14,11,10,.86) 100%);
}
.page-hero .content{ position:relative; z-index:2; }
.page-hero .hero-eyebrow{
  display:block; font-family:var(--mincho); font-size:13px; letter-spacing:.34em;
  color:#e7c9a8; margin-bottom:22px; opacity:0; animation:fadeUp 1.1s var(--ease-out) .5s forwards;
}
.page-hero h1{
  font-family:var(--mincho); font-weight:500; letter-spacing:.14em;
  font-size:clamp(32px,5.2vw,68px); line-height:1.5;
}
.is-ready .page-hero h1 .line-in{ animation:lineUp 1.2s var(--ease-out) forwards; }
.is-ready .page-hero h1 .line:nth-child(1) .line-in{ animation-delay:.55s; }
.is-ready .page-hero h1 .line:nth-child(2) .line-in{ animation-delay:.68s; }
.is-ready .page-hero h1 .line:nth-child(3) .line-in{ animation-delay:.81s; }
.is-ready .page-hero h1 .line:nth-child(4) .line-in{ animation-delay:.94s; }
.page-hero .hero-en{
  display:block; margin-top:20px; font-family:var(--display);
  font-size:clamp(12px,1.2vw,15px); letter-spacing:.5em;
  opacity:0; animation:fadeUp 1.1s var(--ease-out) 1.1s forwards;
}
.page-hero-kamon{
  position:absolute; right:-6vw; bottom:-18vh; width:min(48vw,560px); height:min(48vw,560px);
  color:var(--washi); opacity:.05; pointer-events:none; animation:slowSpin 180s linear infinite;
}

.rooms-intro{ position:relative; padding:var(--pad-section) 0 calc(var(--pad-section) * .6); background:var(--washi); text-align:center; }
.rooms-intro h2{
  font-family:var(--mincho); font-size:clamp(24px,3.2vw,42px); line-height:1.9; letter-spacing:.12em;
  font-weight:500; margin-bottom:34px;
}
.rooms-intro p{ font-size:15px; line-height:2.6; color:var(--ink-soft); }

/* --- 部屋ごとの詳細 --- */
section.room-detail{ position:relative; padding:calc(var(--pad-section) * .55) 0; background:var(--washi); overflow:hidden; }
section.room-detail.alt{ background:var(--washi-2); }
.room-detail-grid{ display:grid; grid-template-columns:1.06fr 1fr; gap:clamp(36px,5.5vw,88px); align-items:center; }
section.room-detail.reverse .room-detail-grid{ direction:rtl; }
section.room-detail.reverse .room-detail-grid > *{ direction:ltr; }
.room-detail-img{ position:relative; overflow:hidden; aspect-ratio:4/3; background:var(--sumi-3); }
.room-detail-img img{ width:100%; height:100%; object-fit:cover; transition:transform 1.6s var(--ease-out); }
.room-detail-img:hover img{ transform:scale(1.05); }
.room-detail-img::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  border:1px solid rgba(246,242,234,.18);
}
section.room-detail .room-tatami{
  display:block; font-family:var(--display); font-size:12px; letter-spacing:.42em;
  color:var(--accent); margin-bottom:16px;
}
.room-detail-text h2{
  font-family:var(--mincho); font-size:clamp(26px,3.2vw,42px); letter-spacing:.14em;
  font-weight:500; margin-bottom:26px;
}
.room-detail-text > p{ font-size:15px; line-height:2.5; color:var(--ink-soft); margin-bottom:36px; }

.room-specs{ border-top:1px solid var(--line); margin-bottom:36px; }
.room-specs li{
  display:grid; grid-template-columns:118px 1fr; gap:16px;
  padding:16px 2px; border-bottom:1px solid var(--line); align-items:baseline;
}
.room-specs label{ font-family:var(--mincho); font-size:12.5px; letter-spacing:.2em; color:var(--accent); }
.room-specs span{ font-size:14.5px; line-height:2; color:var(--ink-soft); }

section.room-detail .room-reserve{
  display:inline-flex; align-items:center; gap:16px; position:relative; overflow:hidden;
  padding:16px 34px; border:1px solid var(--accent); color:var(--accent);
  font-family:var(--mincho); font-size:14px; letter-spacing:.18em;
  transition:color .5s var(--ease), transform .5s var(--ease-out);
}
section.room-detail .room-reserve > *{ position:relative; z-index:2; }
section.room-detail .room-reserve::before{
  content:''; position:absolute; inset:0; background:var(--accent);
  transform:translateY(101%); transition:transform .55s var(--ease-out);
}
section.room-detail .room-reserve:hover{ color:var(--washi); }
section.room-detail .room-reserve:hover::before{ transform:translateY(0); }
section.room-detail .room-reserve:hover .arrow{ transform:translateX(8px); }

/* --- 大浴場 --- */
.bathhouse{ position:relative; background:var(--sumi); color:var(--washi); padding:0 0 var(--pad-section); }
.bathhouse-img-wide{ position:relative; height:clamp(260px,42vw,520px); overflow:hidden; }
.bathhouse-img-wide img{ width:100%; height:112%; object-fit:cover; position:absolute; top:-6%; left:0; }
.bathhouse-img-wide::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,17,15,.35), rgba(20,17,15,.2) 45%, var(--sumi) 100%);
}
.bathhouse-text{ max-width:760px; margin:0 auto; text-align:center; padding-top:clamp(40px,5vw,64px); }
.bathhouse .room-tatami{
  display:block; font-family:var(--display); font-size:12px; letter-spacing:.42em;
  color:var(--accent-dim); margin-bottom:18px;
}
.bathhouse h2{ font-family:var(--mincho); font-size:clamp(26px,3.4vw,44px); letter-spacing:.16em; font-weight:500; margin-bottom:28px; }
.bathhouse p{ font-size:15px; line-height:2.6; color:rgba(246,242,234,.72); }
.bath-feature{
  display:inline-block; margin:34px 0; padding:12px 28px;
  border:1px solid rgba(231,201,168,.4); color:#e7c9a8;
  font-family:var(--mincho); font-size:13.5px; letter-spacing:.2em;
}
.bathhouse .room-specs{ border-top-color:var(--line-dark); text-align:left; }
.bathhouse .room-specs li{ border-bottom-color:var(--line-dark); }
.bathhouse .room-specs label{ color:var(--accent-dim); }
.bathhouse .room-specs span{ color:rgba(246,242,234,.7); }

/* --- アメニティ --- */
.amenities-section{ padding:var(--pad-section) 0 calc(var(--pad-section) * .7); background:var(--washi-2); }
.amenities-section .section-header,
.stay-info .section-header{ justify-content:center; }
.amenities-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(24px,3vw,48px); max-width:900px; margin:0 auto; }
.amenity-card{
  background:#fffdfa; border:1px solid var(--line); padding:clamp(28px,3.4vw,48px);
  transition:transform .7s var(--ease-out), box-shadow .7s var(--ease);
}
.amenity-card:hover{ transform:translateY(-8px); box-shadow:0 36px 64px -48px rgba(33,28,25,.5); }
.amenity-card h3{ font-family:var(--mincho); font-size:clamp(19px,2vw,24px); letter-spacing:.16em; margin-bottom:8px; }
.amenity-en{ display:block; font-family:var(--latin); font-size:12px; letter-spacing:.32em; color:var(--accent); margin-bottom:26px; }
.amenity-card ul{ display:flex; flex-wrap:wrap; gap:9px; }
.amenity-card li{
  font-size:13px; letter-spacing:.06em; color:var(--ink-soft);
  border:1px solid var(--line); border-radius:999px; padding:7px 16px;
  transition:border-color .5s, color .5s;
}
.amenity-card:hover li{ border-color:var(--ink-faint); }

/* --- ご滞在のご案内 --- */
.stay-info{ padding:var(--pad-section) 0; background:var(--washi); }
.stay-info-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(22px,2.6vw,44px); }
.info-item{
  border-top:1px solid var(--accent); padding:26px 2px 30px;
  transition:border-color .5s var(--ease);
}
.info-item:hover{ border-top-color:var(--ink); }
.info-item label{ display:block; font-family:var(--display); font-size:11.5px; letter-spacing:.42em; color:var(--accent); margin-bottom:12px; }
.info-jp{ display:block; font-family:var(--mincho); font-size:13.5px; letter-spacing:.14em; color:var(--ink-faint); margin-bottom:8px; }
.info-value{ display:block; font-family:var(--mincho); font-size:clamp(18px,1.8vw,23px); letter-spacing:.1em; margin-bottom:10px; }
.info-note{ display:block; font-size:12.5px; line-height:2; color:var(--ink-soft); }

.tax-note{ margin-top:clamp(60px,7vw,96px); background:var(--washi-2); border:1px solid var(--line); padding:clamp(30px,4vw,60px); }
.tax-note-label{ display:block; font-family:var(--display); font-size:11.5px; letter-spacing:.42em; color:var(--accent); margin-bottom:16px; }
.tax-note h3{ font-family:var(--mincho); font-size:clamp(20px,2.2vw,28px); letter-spacing:.14em; margin-bottom:22px; }
.tax-note p{ font-size:14px; line-height:2.4; color:var(--ink-soft); }
.tax-table-wrap{ overflow-x:auto; margin:30px 0 22px; }
.tax-table{ width:100%; border-collapse:collapse; font-size:14px; min-width:420px; }
.tax-table th{
  font-family:var(--mincho); font-weight:500; letter-spacing:.12em; text-align:left;
  padding:14px 16px; border-bottom:1px solid var(--ink-faint); color:var(--ink);
}
.tax-table td{ padding:13px 16px; border-bottom:1px solid var(--line); color:var(--ink-soft); }
.tax-table tbody tr{ transition:background .4s; }
.tax-table tbody tr:hover{ background:rgba(156,58,58,.045); }
.tax-fine{ font-size:12.5px; line-height:2.2; color:var(--ink-faint); }
.tax-fine a{ color:var(--accent); border-bottom:1px solid transparent; transition:border-color .4s; }
.tax-fine a:hover{ border-bottom-color:var(--accent); }

/* --- 下部CTA --- */
.rooms-cta{ position:relative; background:var(--sumi); color:var(--washi); padding:var(--pad-section) 0; overflow:hidden; text-align:center; }
.rooms-cta::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(80% 60% at 50% 0%, rgba(156,58,58,.18), transparent 62%);
}
.cta-eyebrow{ font-family:var(--display); font-size:12px; letter-spacing:.5em; color:var(--accent-dim); margin-bottom:26px; }
.rooms-cta h2{ font-family:var(--mincho); font-size:clamp(26px,3.6vw,48px); letter-spacing:.18em; font-weight:500; margin-bottom:28px; }
.rooms-cta p{ font-size:15px; line-height:2.5; color:rgba(246,242,234,.68); margin-bottom:clamp(38px,4.6vw,60px); }
.big-cta{
  display:inline-flex; align-items:center; gap:18px; position:relative; overflow:hidden;
  padding:20px 48px; border:1px solid rgba(246,242,234,.45);
  font-family:var(--mincho); font-size:15px; letter-spacing:.2em;
  transition:border-color .5s var(--ease), transform .5s var(--ease-out), box-shadow .5s var(--ease);
}
.big-cta > *{ position:relative; z-index:2; }
.big-cta::before{ content:''; position:absolute; inset:0; background:var(--accent); transform:translateX(-101%); transition:transform .6s var(--ease-out); }
.big-cta:hover{ border-color:var(--accent); box-shadow:0 20px 48px -24px rgba(0,0,0,.8); }
.big-cta:hover::before{ transform:translateX(0); }
.big-cta:hover .arrow{ transform:translateX(9px); }

@media (max-width:1024px){
  .room-detail-grid{ grid-template-columns:1fr; }
  section.room-detail.reverse .room-detail-grid{ direction:ltr; }
  .stay-info-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:900px){
  .amenities-grid{ grid-template-columns:1fr; }
  .stay-info-grid{ grid-template-columns:1fr; }
  .room-specs li{ grid-template-columns:100px 1fr; gap:12px; }
  .page-hero{ min-height:clamp(340px,52vh,460px); }
  .big-cta{ width:100%; justify-content:space-between; padding:18px 28px; }
}

/* ============================================================
   修学旅行ページ（/pamphlet/）
   旧マークアップのクラス名をそのまま使って新しい見た目にする
   ============================================================ */

/* 旧ページがインラインstyleで参照している変数の受け皿 */
:root{ --akabani: var(--accent); --serif-jp: var(--mincho); }

/* 旧マークアップは section-header に text-align:center を直書きしている */
.section-header[style*="center"]{ justify-content:center; }

/* --- お食事プラン --- */
.meals{ padding:var(--pad-section) 0 calc(var(--pad-section) * .8); background:var(--washi); }
.meal-section-label{
  display:flex; align-items:baseline; justify-content:center; gap:20px;
  margin:clamp(56px,7vw,96px) 0 clamp(28px,3.4vw,46px);
}
.meal-section-jp{ font-family:var(--mincho); font-size:clamp(20px,2.2vw,28px); letter-spacing:.24em; }
.meal-section-en{ font-family:var(--display); font-size:12px; letter-spacing:.44em; color:var(--accent); }

.meal-list{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(24px,3vw,44px); }
.meal-list-single{ grid-template-columns:minmax(0,640px); justify-content:center; }
.meal-list-card{
  background:#fffdfa; border:1px solid var(--line); padding:clamp(26px,3vw,42px);
  display:flex; flex-direction:column;
  transition:transform .7s var(--ease-out), box-shadow .7s var(--ease), border-color .5s;
}
.meal-list-card:hover{ transform:translateY(-8px); box-shadow:0 36px 66px -48px rgba(33,28,25,.5); border-color:var(--ink-faint); }
.meal-list-head{ display:flex; align-items:baseline; gap:16px; padding-bottom:18px; border-bottom:1px solid var(--line); margin-bottom:22px; }
.meal-list-day{
  font-family:var(--display); font-size:11.5px; letter-spacing:.32em; color:var(--washi);
  background:var(--accent); padding:6px 14px;
}
.meal-list-name{ font-family:var(--mincho); font-size:clamp(22px,2.4vw,30px); letter-spacing:.2em; }
.meal-list-lead{ font-size:14px; line-height:2.3; color:var(--ink-soft); margin-bottom:24px; }
.meal-list-items{ display:flex; flex-direction:column; gap:0; }
.meal-list-items li{
  position:relative; font-size:14px; line-height:2; color:var(--ink);
  padding:10px 0 10px 22px; border-bottom:1px dashed var(--line);
}
.meal-list-items li:last-child{ border-bottom:0; }
.meal-list-items li::before{
  content:''; position:absolute; left:2px; top:1.05em; width:7px; height:7px;
  border:1px solid var(--accent); border-radius:50%; opacity:.6;
}
.meal-note{
  margin-top:clamp(40px,5vw,64px); padding:26px 30px;
  border-left:2px solid var(--accent); background:var(--washi-2);
  font-size:13.5px; line-height:2.3; color:var(--ink-soft);
}
.meal-note a{ color:var(--accent); border-bottom:1px solid transparent; transition:border-color .4s; }
.meal-note a:hover{ border-bottom-color:var(--accent); }

/* --- 館内のご案内（動画・3D・平面図） --- */
.floorplans{ padding:var(--pad-section) 0; background:var(--washi-2); }
.tour-block{ margin-bottom:clamp(50px,6vw,84px); }
.tour-block-header{ display:flex; align-items:baseline; flex-wrap:wrap; gap:8px 20px; margin-bottom:24px; }
.tour-num{ font-family:var(--display); font-size:11.5px; letter-spacing:.42em; color:var(--accent); }
.tour-jp{ font-family:var(--mincho); font-size:clamp(18px,2vw,25px); letter-spacing:.16em; }
.tour-meta{ font-size:12.5px; letter-spacing:.06em; color:var(--ink-faint); }
.media-frame{
  position:relative; overflow:hidden; border:1px solid var(--line); background:var(--sumi-3);
  aspect-ratio:16/9;
}
.media-frame iframe,.media-frame img{ width:100%; height:100%; border:0; object-fit:cover; display:block; }

.floorplans-summary{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(16px,2vw,32px); }
.floor-summary-item{
  background:#fffdfa; border:1px solid var(--line); padding:26px 22px; text-align:center;
  transition:transform .6s var(--ease-out), border-color .5s;
}
.floor-summary-item:hover{ transform:translateY(-6px); border-color:var(--accent); }
.floor-label{ font-family:var(--display); font-size:clamp(26px,3vw,38px); letter-spacing:.1em; color:var(--accent); margin-bottom:12px; }
.floor-rooms{ font-family:var(--mincho); font-size:17px; letter-spacing:.12em; margin-bottom:6px; }
.floor-tatami{ font-size:12.5px; color:var(--ink-soft); }

/* --- ご旅程例 --- */
.itinerary{ padding:var(--pad-section) 0; background:var(--washi); }
.itinerary-intro{ text-align:center; font-size:14.5px; line-height:2.5; color:var(--ink-soft); margin-bottom:clamp(44px,5vw,72px); }
.itinerary-meta{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px 16px; margin-top:28px; }
.itinerary-meta-item{
  display:inline-flex; align-items:baseline; gap:10px;
  border:1px solid var(--line); padding:10px 18px; border-radius:999px;
  font-size:12px; letter-spacing:.08em; color:var(--ink-faint);
}
.itinerary-meta-item strong{ font-family:var(--mincho); font-weight:500; font-size:13.5px; color:var(--ink); }

.itinerary-day{ margin-bottom:clamp(38px,4.4vw,64px); }
.itinerary-day-header{
  display:flex; align-items:baseline; flex-wrap:wrap; gap:10px 20px;
  padding-bottom:16px; border-bottom:1px solid var(--ink); margin-bottom:6px;
}
.day-num{ font-family:var(--display); font-size:clamp(18px,2vw,24px); letter-spacing:.34em; color:var(--accent); }
.day-jp{ font-family:var(--mincho); font-size:clamp(16px,1.7vw,21px); letter-spacing:.14em; }
.day-tag{
  margin-left:auto; font-size:11.5px; letter-spacing:.12em; color:var(--ink-soft);
  border:1px solid var(--line); border-radius:999px; padding:5px 14px;
}
.day-tag.hifumi-tag{ color:var(--washi); background:var(--accent); border-color:var(--accent); }

.itinerary-list li{
  display:grid; grid-template-columns:96px 1fr; gap:18px; align-items:baseline;
  padding:15px 4px; border-bottom:1px solid var(--line);
  transition:background .4s, padding-left .5s var(--ease-out);
}
.itinerary-list li:hover{ background:rgba(156,58,58,.035); padding-left:14px; }
.itinerary-list .time{ font-family:var(--display); font-size:14.5px; letter-spacing:.14em; color:var(--accent); }
.itinerary-list .event{ font-size:14.5px; line-height:2; color:var(--ink-soft); }
.event-place{
  display:inline-block; font-family:var(--mincho); color:var(--ink);
  margin-right:14px; letter-spacing:.1em;
}

/* --- 京都のご案内（地図） --- */
.kyotomap{ padding:var(--pad-section) 0; background:var(--washi-2); }
.kyotomap-intro{ text-align:center; font-size:14.5px; line-height:2.5; color:var(--ink-soft); margin-bottom:clamp(40px,5vw,66px); }
.kyotomap-figure{ margin:0 0 clamp(30px,3.6vw,50px); }
.kyotomap-zoom{ display:block; position:relative; overflow:hidden; border:1px solid var(--line); background:#fffdfa; }
.kyotomap-zoom img{ width:100%; height:auto; display:block; transition:transform 1.4s var(--ease-out); }
.kyotomap-zoom:hover img{ transform:scale(1.02); }
.kyotomap-figure figcaption{ margin-top:14px; font-size:12.5px; line-height:2.1; color:var(--ink-faint); }
.kyotomap-tap{ display:block; color:var(--accent); }
.kyotomap-lower{ display:grid; grid-template-columns:1.12fr 1fr; gap:clamp(30px,4vw,64px); align-items:start; }
.kyotomap-access{ border-top:1px solid var(--line); margin-bottom:26px; }
.kyotomap-access dt{
  font-family:var(--mincho); font-size:12.5px; letter-spacing:.18em; color:var(--accent);
  padding-top:16px;
}
.kyotomap-access dd{ margin:4px 0 0; padding-bottom:16px; border-bottom:1px solid var(--line); font-size:14px; line-height:2; color:var(--ink-soft); }
.kyotomap-note{ font-size:13.5px; line-height:2.3; color:var(--ink-soft); }
.kyotomap-note a{ color:var(--accent); border-bottom:1px solid transparent; transition:border-color .4s; }
.kyotomap-note a:hover{ border-bottom-color:var(--accent); }
.kyotomap-credit{ margin-top:16px; font-size:11.5px; color:var(--ink-faint); }
.kyotomap-credit a{ color:inherit; border-bottom:1px solid var(--line); }

/* --- ご資料ダウンロード --- */
.downloads{ padding:var(--pad-section) 0; background:var(--washi); }
.downloads-intro{ text-align:center; font-size:14.5px; line-height:2.5; color:var(--ink-soft); margin-bottom:clamp(44px,5vw,70px); }
.downloads-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(22px,2.6vw,40px); }
.download-card{
  position:relative; display:flex; flex-direction:column; overflow:hidden;
  background:#fffdfa; border:1px solid var(--line); padding:clamp(26px,3vw,40px);
  transition:transform .7s var(--ease-out), box-shadow .7s var(--ease), border-color .5s;
}
.download-card::before{
  content:''; position:absolute; left:0; top:0; width:100%; height:2px;
  background:var(--accent); transform:scaleX(0); transform-origin:left;
  transition:transform .7s var(--ease-out);
}
.download-card:hover{ transform:translateY(-10px); box-shadow:0 38px 70px -48px rgba(33,28,25,.55); border-color:var(--ink-faint); }
.download-card:hover::before{ transform:scaleX(1); }
.download-card-tag{
  align-self:flex-start; font-family:var(--display); font-size:11px; letter-spacing:.3em;
  color:var(--accent); border:1px solid rgba(156,58,58,.35); padding:5px 12px; margin-bottom:20px;
}
.download-card h3{ font-family:var(--mincho); font-size:clamp(19px,2vw,24px); letter-spacing:.14em; margin-bottom:8px; }
.download-card-en{ display:block; font-family:var(--latin); font-size:12.5px; letter-spacing:.18em; color:var(--ink-faint); margin-bottom:20px; }
.download-card p{ font-size:13.5px; line-height:2.2; color:var(--ink-soft); margin-bottom:26px; flex:1; }
.download-card-foot{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding-top:18px; border-top:1px solid var(--line); }
.download-card-foot .meta{ font-size:12px; color:var(--ink-faint); }
.download-card-foot .action{ font-family:var(--mincho); font-size:13.5px; letter-spacing:.14em; color:var(--accent); }
.download-card-foot .arrow{ display:inline-block; transition:transform .5s var(--ease-out); }
.download-card:hover .download-card-foot .arrow{ transform:translate(4px,-4px); }

/* --- ツールへの誘導 --- */
.tool-cta{
  margin-top:clamp(56px,6.5vw,90px); background:var(--sumi); color:var(--washi);
  padding:clamp(32px,4vw,60px); position:relative; overflow:hidden;
}
.tool-cta::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(70% 70% at 90% 10%, rgba(156,58,58,.22), transparent 62%);
}
.tool-cta-body{ position:relative; z-index:2; }
.tool-cta h3{ font-family:var(--mincho); font-size:clamp(20px,2.2vw,28px); letter-spacing:.14em; margin-bottom:18px; }
.tool-cta p{ font-size:14px; line-height:2.3; color:rgba(246,242,234,.72); }
.tool-cta a{ color:var(--accent-dim); border-bottom:1px solid transparent; transition:border-color .4s; }
.tool-cta a:hover{ border-bottom-color:var(--accent-dim); }

@media (max-width:1024px){
  .meal-list{ grid-template-columns:1fr; }
  .downloads-grid{ grid-template-columns:1fr; }
  .floorplans-summary{ grid-template-columns:repeat(2,1fr); }
  .kyotomap-lower{ grid-template-columns:1fr; }
}
@media (max-width:900px){
  .itinerary-list li{ grid-template-columns:72px 1fr; gap:12px; }
  .day-tag{ margin-left:0; }
  .meal-list-single{ grid-template-columns:1fr; }
}