/* ===== Base ===== */
:root{
  --bg:#fff;
  --fg:#111;
  --muted:#888;
  --paper:#fff;
  --overlay:rgba(0,0,0,.35);
  --max:1080px;
  --max-narrow:760px;
  --gap:clamp(16px, 2vw, 24px);
}



*{box-sizing:border-box}
html,body{height:100%}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--fg);
  background:var(--bg);
  font-family:"Poppins","Noto Sans JP",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue","Hiragino Kaku Gothic ProN","Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
  font-weight:300; letter-spacing:.03em; line-height:1.75;
  opacity:0; animation: page-in .6s ease forwards;
  padding-top:56px; /* fixed header offset */
}
@keyframes page-in{to{opacity:1}}
a{color:inherit;text-decoration:none}
a:hover{opacity:.85}
.btn{display:inline-block; border:1px solid var(--fg); padding:.7em 1.2em; border-radius:999px; font-size:.95rem; letter-spacing:.05em; font-weight:400}
.btn-outline{background:transparent}
.btn:not(.btn-outline){background:var(--fg); color:var(--paper)}
.btn + .btn{margin-left:.75rem}

/* ===== Header (fixed strongly) ===== */
.site-header{
  position:fixed !important; top:0; left:0; right:0; height:56px;
  z-index:1000; background:rgba(255,255,255,.6); backdrop-filter:saturate(1.2) blur(8px);
  border-bottom:1px solid #0002;
}
.menu-btn,.book-btn{position:absolute; top:50%; transform:translateY(-50%)}
.menu-btn{left:12px}
.book-btn{right:12px; border:1px solid #6db1a7; padding:.45rem .8rem; border-radius:.6rem; background:transparent; color:#2e9f90; font-family:"Poppins","Noto Sans JP",sans-serif; letter-spacing:.08em}
.brand--center{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%)}
.icon-btn{appearance:none;border:0;background:transparent;padding:.6rem;cursor:pointer}
.icon-burger, .icon-burger::before, .icon-burger::after{display:block; width:22px; height:2px; background:#111; border-radius:1px; content:"";}
.icon-burger::before{transform:translateY(-6px)}
.icon-burger::after{transform:translateY(4px)}
.icon-close, .icon-close::before{width:22px; height:2px; border-radius:1px; background:#fff; display:block; content:""; transform:rotate(45deg)}
.icon-close::before{transform:rotate(-45deg)}
.progress{position:absolute; left:0; right:0; bottom:-1px; height:2px; background:transparent}
.progress span{display:block; height:100%; width:0; background:#111; transition:width .1s linear}

/* ===== Hero ===== */
.hero{position:relative; min-height:100svh; display:grid; align-items:center; justify-content:center}
.hero-media{position:absolute; inset:0; overflow:hidden}
.hero-video{width:100%; height:100%; object-fit:cover; filter:grayscale(100%) contrast(110%) saturate(0.9) brightness(.9); transform:scale(1.04); animation: hero-zoom 16s ease-in-out infinite alternate}
.hero-overlay{position:absolute; inset:0; background:var(--overlay)}
.hero-copy{position:relative; z-index:2; color:#fff; text-align:center; padding:calc(56px + 6vh) var(--gap) 10vh}
.hero-logo{width:min(54vw, 320px); height:auto}
.hero-sub{margin:.8rem 0 1.2rem; opacity:.9}
.fade-in{opacity:0; transform:translateY(8px); animation:fade-up .8s ease .2s forwards}
.fade-in-delayed{opacity:0; transform:translateY(8px); animation:fade-up .8s ease .35s forwards}
.fade-in-delayed2{opacity:0; transform:translateY(8px); animation:fade-up .8s ease .5s forwards}

/* ===== Concept hero ===== */
.concept-hero{position:relative; min-height:92svh; display:grid; align-items:center; padding-block:clamp(72px,10vh,120px); color:#fff; isolation:isolate}
.concept-media{position:absolute; inset:0; overflow:hidden; z-index:-2}
.concept-video{width:100%; height:100%; object-fit:cover; filter:grayscale(100%) contrast(110%) saturate(.9) brightness(.9); transform:scale(1.04); animation: hero-zoom 18s ease-in-out infinite alternate}
.concept-overlay{position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.45) 35%, rgba(0,0,0,.35) 100%)}
.concept-inner{width:min(100%, 980px); margin-inline:auto; padding-inline:clamp(16px,4vw,28px)}
.concept-kicker{font-family:"Poppins","Noto Sans JP",sans-serif; letter-spacing:.12em; opacity:.9; font-size:clamp(.9rem,2.6vw,1.1rem); margin:0 0 .6rem}
.concept-title{font-family:"Cormorant Garamond","Poppins",serif; font-weight:600; letter-spacing:.06em; line-height:1.05; font-size:clamp(2.2rem,10vw,4.4rem); margin:.1em 0 .6em; text-transform:uppercase}
.concept-lead{font-family:"Noto Sans JP","Poppins",sans-serif; font-weight:300; line-height:2.0; font-size:clamp(.98rem,2.6vw,1.12rem); text-wrap:balance; opacity:.95}
.concept-note{margin-top:1.2em; font-family:"Poppins","Noto Sans JP",sans-serif; letter-spacing:.08em; opacity:.92}
@media (min-width:960px){ .concept-inner{margin-left: clamp(40px, 10vw, 160px)} }

/* ===== Fixed global BGs ===== */
.global-bg{position:fixed; inset:0; z-index:0; pointer-events:none; opacity:0; transition:opacity .45s ease}
.global-bg.is-active{opacity:1}
.global-bg video{width:100%; height:100%; object-fit:cover; filter:grayscale(100%) contrast(110%) saturate(.9) brightness(.9)}
.global-bg__overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.35) 35%, rgba(0,0,0,.3))}

/* Light for Instagram */
.global-bg--light{z-index:0; opacity:0; transition:opacity .45s ease}
.global-bg--light.is-active{opacity:1}
.global-bg--light video{width:100%; height:100%; object-fit:cover; filter:grayscale(100%) brightness(1.65) contrast(85%) saturate(.8)}
.global-bg__overlay--light{position:absolute; inset:0; background:linear-gradient(180deg, rgba(255,255,255,.86) 0%, rgba(255,255,255,.82) 45%, rgba(255,255,255,.78) 100%), radial-gradient(90vh 50vh at 50% 20%, rgba(255,255,255,.14), transparent 60%); pointer-events:none}

/* Elevation of content above video */
.section, .hero, .concept-hero, .site-header, .panel{position:relative; z-index:1}

/* ===== Slide-up in Concept ===== */
.reveal-up{opacity:0; transform:translateY(24px)}
.reveal-up.in{opacity:1; transform:none; transition:transform .7s ease, opacity .7s ease}

/* ===== Sections & type ===== */
.section{padding:clamp(56px,8vw,100px) var(--gap); max-width:var(--max); margin-inline:auto}
.section--narrow{max-width:var(--max-narrow)}
.section--inset{border-left:0; border-right:0}
.section--center{text-align:center}
.display-en{font-family:"Poppins","Noto Sans JP",sans-serif; font-weight:600; letter-spacing:.08em; font-size:clamp(1.6rem,3.8vw,2.4rem); margin:.2em 0 .8em}
.eyebrow{font-family:"Noto Sans JP","Poppins",sans-serif; font-weight:400; font-size:.8rem; letter-spacing:.28em; color:#666; margin:0 0 .2rem}
.lead{font-size:1.05rem; color:#222}

/* ===== Glass cards (mid sections) ===== */
.glass{background:rgba(17,17,17,.34); color:#fff; backdrop-filter: blur(4px); border:1px solid rgba(255,255,255,.06); border-radius:16px; max-width:var(--max); margin-inline:auto; padding:clamp(40px,6vw,72px) var(--gap)}
.glass .eyebrow{ color:#d0d0d0 }

/* ===== Styles grid ===== */
.grid{--col:minmax(0,1fr); display:grid; grid-template-columns:repeat(2, var(--col)); gap:var(--gap)}
@media(min-width:680px){ .grid{grid-template-columns:repeat(3, var(--col))} }
.style img{width:100%; display:block; border:1px solid #0002}
.style figcaption{font-size:.85rem; color:var(--muted); padding:.4rem .2rem}
/* モノクロ→カラーのみ（移動なし） */
.desat{filter:grayscale(100%) contrast(104%); transition:filter .9s ease}
.desat.reveal{filter:none}
.note{color:#666; font-size:.9rem}

/* ===== Menu ===== */
.menu{display:grid; gap:var(--gap)}
@media(min-width:760px){ .menu{grid-template-columns:1fr 1fr 1fr} }
.menu h3{font-size:1rem; letter-spacing:.08em; margin:0 0 .6rem; font-weight:500}
.menu ul{margin:0; padding:0; list-style:none; border-top:1px solid #fff2}
.menu li{display:flex; align-items:baseline; justify-content:space-between; gap:1rem; border-bottom:1px solid #fff2; padding:.8rem 0}
.menu li span{opacity:.9}
.menu li strong{font-weight:500}
.menu-note{color:#cfcfcf}

/* ===== Stylist ===== */
.stylist{display:grid; gap:var(--gap)}
@media(min-width:760px){ .stylist{grid-template-columns: 1fr 1.2fr; align-items:center} }
.stylist img{width:100%; border:1px solid #0002}
.stylist-bio h3{margin:.2rem 0 .6rem; font-weight:500; letter-spacing:.08em}

/* ===== News (dark panel) / Access / Contact ===== */
.section--panel-dark{position:relative; color:#e9ecea; background:linear-gradient(180deg,#121617,#0f1415); border:1px solid rgba(255,255,255,.06); border-radius:16px; max-width:var(--max); margin:clamp(20px,3vw,28px) auto; box-shadow:0 10px 30px rgba(0,0,0,.28) inset, 0 8px 20px rgba(0,0,0,.18)}
.section--panel-dark .eyebrow{ color:#cfd6d3 }
.section--panel-dark .display-en{ color:#f3f5f4 }
.section--panel-dark a{ color:#e9ecea }
.section--panel-dark .news-list{border-top:1px solid rgba(255,255,255,.08)}
.section--panel-dark .news-list li{border-bottom:1px solid rgba(255,255,255,.08)}
.section--panel-dark .map iframe{filter:grayscale(100%) contrast(110%) brightness(1.05); border-radius:12px; border:1px solid rgba(255,255,255,.08)}
.section--panel-dark .btn{border-color:#e9ecea; color:#0f1415; background:#e9ecea}
.section--panel-dark .btn.btn-outline{background:transparent; color:#e9ecea; border-color:#e9ecea}

/* ===== Instagram (alternating + pop-in) ===== */
.insta-feed{max-width:var(--max); margin-inline:auto}
.insta-item{display:grid; gap:clamp(16px,3vw,28px); align-items:center; margin-block:clamp(16px,3vw,28px)}
.insta-media img{width:100%; display:block; border-radius:14px; border:1px solid #0002; filter:grayscale(100%) contrast(105%); transition:filter .6s ease}
.insta-media a:hover img{filter:none}
.insta-body{background:rgba(17,17,17,.04); border:1px solid rgba(0,0,0,.06); border-radius:14px; padding:clamp(16px,3vw,24px)}
.insta-eyebrow{font-size:.8rem; letter-spacing:.22em; color:#666; margin:0 0 .35rem}
.insta-title{font-family:"Cormorant Garamond","Poppins",serif; font-size:clamp(1.2rem,3.2vw,1.6rem); letter-spacing:.04em; margin:.1rem 0 .4rem}
.insta-text{color:#333; margin:.2rem 0 .6rem}
.insta-tags{color:#777; font-size:.9rem; letter-spacing:.04em; margin:0 0 .6rem}
.insta-link{display:inline-block; border-bottom:1px solid currentColor; padding-bottom:2px}
@media (min-width: 900px){
  .insta-item{grid-template-columns: 1.2fr 1fr}
  .insta-item.dir-ltr{grid-template-areas: "media body"}
  .insta-item.dir-rtl{grid-template-columns: 1fr 1.2fr; grid-template-areas: "body media"}
  .insta-media{grid-area: media}
  .insta-body{grid-area: body}
}
.pop-in{opacity:0; transform:scale(.96)}
.pop-in.in{opacity:1; transform:scale(1); transition:opacity .6s ease, transform .6s ease}
/* ===== NEWS (BPC風カード) ===== */
.news{
  background: radial-gradient(1200px 380px at 30% -10%, #ffffff70, #ffffff00 60%),
              linear-gradient(#0f1418, #0f1418);
  color:#fff;
}
.news-slider{
  position:relative;
  width:min(92vw, 1200px);
  margin-top:12px;
  padding:14px 72px;            /* 矢印ぶんの余白 */
  overflow:hidden;
}
.news-track{
  display:flex; gap:28px;
  transition: transform 520ms cubic-bezier(.22,.7,.2,1);
  will-change: transform;
}
.news-card{
  flex:0 0 min(86vw, 520px);
  display:flex; flex-direction:column; overflow:hidden;
  background:#2b2f33cc;         /* 半透明ダーク */
  border:1px solid #ffffff22;
  border-radius:22px;
  box-shadow: 0 18px 40px #0006, inset 0 1px 0 #ffffff20;
  backdrop-filter: blur(6px) saturate(1.1);
}

/* 画像（初期モノクロ） */
.news-media{ aspect-ratio: 16 / 9; position:relative; background:#0c0f12; }
.news-media::after{              /* 下部の被写体保護グラデ */
  content:""; position:absolute; inset:auto 0 0 0; height:22%;
  background: linear-gradient(#0000, #0009);
}
.news-media img{
  width:100%; height:100%; object-fit:cover; display:block;
  filter: grayscale(1) saturate(.78) contrast(1.05);
  transition: filter 760ms ease var(--colorDelay,0ms), transform 400ms ease;
}

/* 本文（アクティブ時に先に出す） */
.news-body{
  padding:18px 18px 16px;
  background: linear-gradient(#2b2f33dd, #262a2edd);
  color:#f4f4f4;
  opacity:0; transform: translateY(8px);
  transition: opacity 360ms ease, transform 360ms ease;
}
.news-title{ font-weight:700; font-size:clamp(18px,2.6vw,22px); margin:.25em 0 .35em; }
.news-text{ line-height:1.75; margin:.1em 0 .9em; opacity:.95; }
.news-meta{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.news-cat{ font-size:.92rem; letter-spacing:.04em; opacity:.9; }
.news-more{
  color:#fff; text-decoration:none; font-style:italic;
  position:relative; padding-right:20px;
}
.news-more::after{
  content:"→"; position:absolute; right:0; top:50%; translate:0 -50%;
}

/* アクティブカードの演出：本文→少し遅れて画像カラー化 */
.news-card.is-active .news-body{ opacity:1; transform:none; }
.news-card.is-active .news-media img{
  --colorDelay: 240ms;
  filter: grayscale(0) saturate(1.18) contrast(1.06);
}

/* 矢印＋カウンタ（中央寄せ） */
.news-arrow{
  position:absolute; top:44%; translate:0 -50%;
  width:44px; height:44px; border-radius:50%;
  border:1px solid #ffffff33; background:#1e242acc;
  color:#fff; display:grid; place-items:center;
  font-size:26px; cursor:pointer;
  box-shadow: 0 8px 20px #0006, inset 0 1px 0 #ffffff30;
}
.news-arrow.prev{ left:12px; }
.news-arrow.next{ right:12px; }
.news-counter{
  position:absolute; left:50%; top:calc(44% + 30px);
  translate:-50% 0; font-feature-settings:"tnum";
  letter-spacing:.12em; font-size:.95rem; opacity:.9;
}

/* エッジがフェードするマスク（スクショ寄せ） */
.news-fade{
  position:absolute; top:0; bottom:0; width:64px; z-index:2; pointer-events:none;
  background: linear-gradient(to right, #0f1418 40%, #0f141800);
}
.news-fade--left{ left:0; }
.news-fade--right{
  right:0; transform:scaleX(-1);
}

/* モバイル最適化 */
@media (max-width:640px){
  .news-slider{ padding:12px 58px; }
  .news-card{ flex-basis: 88vw; }
  .news-arrow{ width:40px; height:40px; font-size:22px; top:42%; }
  .news-counter{ top:calc(42% + 26px); }
}

/* ===== Access ===== */
.access{display:grid; gap:var(--gap)}
@media(min-width:900px){ .access{grid-template-columns:1fr 1.2fr} }
.hours dl{display:grid; grid-template-columns:7em 1fr; gap:.4rem 1rem; margin:0}
.hours dt{color:#777}
.map iframe{width:100%; height:360px; border:0}

/* ===== Contact ===== */
.cta-row{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}

/* ===== Footer ===== */
.footer{background:#222826; color:#e8ecea; padding:48px clamp(16px,4vw,32px) 28px; border-top:1px solid rgba(255,255,255,.06)}
.footer-grid{max-width:1200px; margin:0 auto; display:grid; gap:32px}
@media (min-width:980px){ .footer-grid{grid-template-columns: 1.2fr .8fr .8fr 1.2fr; align-items:start} }
.footer-logo{height:28px; width:auto; display:block; margin-bottom:12px; filter:brightness(1.1) contrast(110%)}
.footer-title{font-family:"Cormorant Garamond","Poppins",serif; letter-spacing:.14em; font-weight:600; margin:.3rem 0 1rem; color:#f2f4f3}
.footer-address{font-style:normal; color:#cfd6d3; line-height:1.9; margin-bottom:1rem}
.footer-address a{border-bottom:1px solid transparent}
.footer-address a:hover{border-bottom-color:currentColor}
.footer-copy{display:block; color:#98a39f; margin-top:.6rem}
.footer-head{font-family:"Cormorant Garamond","Poppins",serif; letter-spacing:.18em; color:#f2f4f3; margin:4px 0 10px}
.footer-list{list-style:none; margin:0; padding:0}
.footer-list li{margin:.4rem 0}
.footer-list a{color:#dfe6e3; letter-spacing:.06em}
.footer-list a:hover{opacity:.85}
.footer-news .footer-note{color:#cfd6d3; margin:.3rem 0 10px}
.footer-form{display:flex; gap:10px; align-items:center}
.footer-form input{flex:1 1 auto; height:42px; padding:0 12px; background:#9aa39f; color:#18201d; border:1px solid #7f8a86; border-radius:4px; letter-spacing:.08em}
.footer-form input::placeholder{color:#2b332f; letter-spacing:.18em}
.footer-send{height:42px; padding:0 18px; border-radius:4px; background:transparent; color:#e8ecea; border:1px solid #e8ecea; letter-spacing:.18em}
.footer-send:hover{background:#e8ecea; color:#1f2724}
.footer-legal{max-width:1200px; margin:18px auto 0; display:flex; gap:24px; justify-content:flex-end; padding-top:14px; border-top:1px solid rgba(255,255,255,.06)}
.footer-legal a{color:#e8ecea}

/* ===== Panels ===== */
.panel[hidden]{display:none}
.panel{position:fixed; inset:0; display:grid; z-index:2000}
.scrim{position:absolute; inset:0; background:#0008; opacity:0; transition:.25s}
.panel-body{opacity:0; transform:translateY(10px); transition:.28s}
.panel.open .scrim{opacity:1}
.panel.open .panel-body{opacity:1; transform:none}
.panel--dark .panel-body{background:#222; color:#eee}
.panel--dark .panel-header{display:flex; align-items:center; justify-content:space-between; padding:20px var(--gap) 0}
.panel--dark .panel-logo{font-family:"Allerta Stencil","Cormorant Garamond","Poppins",serif; letter-spacing:.2em; font-size:24px}
.panel--dark .book-outline{border:1px solid #6db1a7; color:#bfe7e0; padding:.45rem .8rem; border-radius:.6rem}
.panel--dark .panel-nav{padding:24px var(--gap) 6px; display:grid; gap:12px}
.stencil a{font-family:"Allerta Stencil","Cormorant Garamond","Poppins",serif; font-size:clamp(28px,7vw,46px); letter-spacing:.16em; color:#eee; border-bottom:1px solid #fff1; padding:.18em 0 .3em; display:block}
.stencil a .arrow{font-size:.8em; opacity:.8}
.stencil a.tint{color:#ccb79a}
.panel--dark .gridlinks{display:grid; grid-template-columns:repeat(2,1fr); gap:14px var(--gap); padding:20px var(--gap) 40px; color:#cfcfcf; letter-spacing:.2em}
.close-btn{position:absolute; left:8px; top:8px}
.panel--light .panel-body.sheet{display:grid; justify-content:end}
.sheet-inner{width:min(88vw,720px); height:100%; background:#f5f3ef; color:#222; border-top-left-radius:18px; border-bottom-left-radius:18px; padding:20px clamp(16px,3vw,28px) 28px; border-left:1px solid #0001; transform:translateX(10px); opacity:0; transition:transform .32s ease, opacity .32s ease}
.panel.open .sheet-inner{transform:none; opacity:1}
.panel--light .close-btn{right:calc(min(88vw,720px) + 6px); left:auto; top:8px}
.panel--light .icon-close, .panel--light .icon-close::before{background:#222}

/* ===== Animations ===== */
@keyframes hero-zoom{from{transform:scale(1.04)} to{transform:scale(1.08)}}
@keyframes fade-up{to{opacity:1; transform:none}}
/* 下からフワッと上がる */
[data-anim="fade-down"]{opacity:0; transform:translateY(14px)}
[data-anim="fade-down"].in{opacity:1; transform:none; transition:opacity .7s ease, transform .7s ease}

@media (prefers-reduced-motion: reduce){
  .hero-video,.concept-video{animation:none !important}
  .fade-in,.fade-in-delayed,.fade-in-delayed2{animation:none !important; opacity:1 !important; transform:none !important}
  .reveal-up,[data-anim]{opacity:1 !important; transform:none !important}
}

/* Stencil fonts import */
@import url('https://fonts.googleapis.com/css2?family=Allerta+Stencil&family=Cormorant+Garamond:wght@400;600&display=swap');

/* ==== Header fixed HARD override ==== */
.site-header{
  position: fixed !important;
  top: 0; left: 0; right: 0;
  height: 56px;
  z-index: 3000 !important; /* どの要素よりも前へ */
  will-change: transform;    /* iOSでのチラつき抑制 */
}

/* ヘッダー下に潜り防止 */
body{ padding-top: 56px !important; }

/* 背景動画は最背面に固定 */
.global-bg,
.global-bg--light{ z-index: 0 !important; }

/* セクションは動画より前面、ヘッダーより背面 */
.section, .hero, .concept-hero{ z-index: 1 !important; }

/* パネルはヘッダーより上（開いている時） */
.panel{ z-index: 4000 !important; }

/* === Square sections: remove borders & rounded corners === */
.glass,
.section--panel-dark{
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ACCESS 予約ボックスの体裁（統合版用） */
.access .reserve-box{
  margin-top: 12px;
  display: flex; gap: 10px; flex-wrap: wrap;
}
.access .reserve-box .btn{ padding:.7em 1.1em }

/* Access / Reservation layout (left: info + reservation, right: map) */
.access{
  display:grid;
  gap:var(--gap);
}
@media(min-width:900px){
  .access{ grid-template-columns:1fr 1.2fr; align-items:flex-start; }
}

.access dl{
  display:grid;
  grid-template-columns:7em 1fr;
  gap:.4rem 1rem;
  margin:0;
}
.access dt{ color:#aaa; }
.access dd{ margin:0; }

.access .reserve{
  margin-top:24px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.1);
}
.access .reserve .eyebrow{
  color:#cfd6d3;
}
.access .reserve .display-en{
  color:#f3f5f4;
  margin-top:.3em;
}
.access .reserve .lead{
  margin:.6em 0 1em;
  color:#dcdcdc;
}
.access .cta-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.access .cta-row .btn{
  flex:1 1 auto;
  min-width:140px;
  text-align:center;
}

/* ===== White wave background zone: Instagram -> Access ===== */
.section--panel-dark.white-wave{
  background: transparent !important;
  color: #111 !important;
  border: none;
  box-shadow: none;
}
.section--panel-dark.white-wave .eyebrow{ color: #555 !important; }
.section--panel-dark.white-wave .display-en{ color: #000 !important; }
.section--panel-dark.white-wave .lead{ color: #333 !important; }
.section--panel-dark.white-wave a{ color: #111 !important; }
.section--panel-dark.white-wave .btn{
  background:#111; color:#fff; border-color:#111;
}
.section--panel-dark.white-wave .btn.btn-outline{
  background:transparent; color:#111; border-color:#111;
}
.section--panel-dark.white-wave .map iframe{
  filter: grayscale(0%) brightness(1.05);
  border: 1px solid #ddd;
}

/* === Access 予約ボタン調整 === */
.access .cta-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-start;         /* 伸びすぎ防止 */
}
.access .cta-row .btn{
  flex:0 0 auto;                      /* 伸びない・必要分だけ */
  min-width:160px;
  height:44px;
  line-height:44px;
  padding:0 18px;                     /* 高さはheightで管理 */
  border-radius:999px;
  font-size:.95rem;
  text-align:center;
}

/* 配色：LINEだけ主ボタン、TEL/MAILはアウトライン */
.btn-primary{ background:#111; color:#fff; border-color:#111; }
.btn-outline{ background:transparent; color:#111; border-color:#111; }

/* 白波ゾーンでも同じ配色になるよう強制 */
.section--panel-dark.white-wave .btn-primary{ background:#111 !important; color:#fff !important; border-color:#111 !important; }
.section--panel-dark.white-wave .btn.btn-outline{ background:transparent !important; color:#111 !important; border-color:#111 !important; }

@media (max-width:520px){
  .access .cta-row .btn{ min-width:100%; } /* スマホは縦並びで見やすく */
}

/* ==== Panels: core ==== */
.panel[hidden]{display:none}
.panel{position:fixed; inset:0; z-index:4000; display:grid; align-items:start; justify-items:center;
  opacity:0; visibility:hidden; transition:opacity .28s ease, visibility .28s ease;}
.panel.open{opacity:1; visibility:visible;}
.panel .scrim{position:absolute; inset:0; background:#0008; opacity:0; transition:.28s;}
.panel.open .scrim{opacity:1;}
.panel .panel-body{opacity:0; transform:translateY(12px); transition:.28s;}
.panel.open .panel-body{opacity:1; transform:none;}

/* ==== Main Nav : BPC-like 2 columns ==== */
.navsheet{
  width:min(1100px,96vw);
  max-height:calc(100vh - 24px);
  margin:12px auto;
  background:#222827; color:#e9eee9;
  border-radius:18px; border:1px solid rgba(255,255,255,.08);
  box-shadow:0 20px 60px rgba(0,0,0,.45);
  display:flex; flex-direction:column; overflow:hidden;
}
.navsheet-bar{
  display:grid; grid-template-columns:56px 1fr auto; align-items:center; gap:8px;
  padding:12px 14px; border-bottom:1px solid rgba(255,255,255,.08);
}
.navsheet-logo{font-family:"Playfair Display",serif; font-size:28px; text-align:center; letter-spacing:.14em;}
.navsheet-book{
  height:40px; padding:0 16px; border-radius:8px;
  background:transparent; color:#bfe3d8; border:1px solid #5aa79a;
}
.navsheet-inner{display:grid; gap:32px; padding:24px 18px; grid-template-columns:1.2fr 1fr; overflow:auto;}
.navsheet-left a{
  display:flex; align-items:center; height:72px; border-bottom:1px solid rgba(255,255,255,.06);
  font-family:"Playfair Display","Noto Serif JP",serif; font-size:clamp(28px,4.5vw,44px);
  letter-spacing:.18em; text-decoration:none; color:#cfd6d3; transition:opacity .2s, transform .2s;
}
.navsheet-left a:hover{opacity:.9; transform:translateX(4px);}
.quicklinks{list-style:none; margin:0 0 14px; padding:0;}
.ql{position:relative; display:flex; align-items:center; gap:10px; padding:18px 48px 18px 18px;
  text-decoration:none; color:#f0f2f1; border:1px solid rgba(255,255,255,.12); border-radius:12px; margin-bottom:12px;
  background:rgba(255,255,255,.02);}
.ql:hover{background:rgba(255,255,255,.05);}
.ql-title{font-family:"Playfair Display",serif; font-size:22px; letter-spacing:.08em;}
.ql-sub{color:#b8bfbc; font-size:.95rem;}
.ql-arrow{position:absolute; right:14px; font-size:22px; color:#b8bfbc;}
.sidecard{position:relative; display:block; text-decoration:none; padding:18px 48px 18px 18px; border-radius:12px; margin-top:6px;}
.sidecard--dark{background:#0c0c0c; color:#fff; border:1px solid #161616;}
.sidecard-title{font-family:"Playfair Display",serif; font-size:24px; letter-spacing:.06em;}
.sidecard-sub{margin-top:6px; color:#d8d8d8; font-size:.95rem; opacity:.9;}
.sidecard-launch{position:absolute; right:14px; top:50%; transform:translateY(-50%); font-size:20px; opacity:.9;}
@media (max-width:900px){ .navsheet-inner{grid-template-columns:1fr; gap:18px;} .navsheet-left a{height:62px;} }

/* ==== Book panel (beige sheet) ==== */
.sheet{max-width:820px; width:min(92vw,820px); margin:40px auto; background:#F5F3EE; color:#222;
  border-radius:18px; border:1px solid rgba(0,0,0,.15); box-shadow:0 20px 60px rgba(0,0,0,.25);}
.close-btn{position:absolute; left:18px; top:18px;}
.sheet-inner{padding:16px 0 24px;}
.eyebrow{font-family:"Noto Serif JP",serif;}
.sheet-row{position:relative; display:flex; align-items:center; gap:10px; padding:22px 56px 22px 24px;
  text-decoration:none; color:#222; border-top:1px solid #cfcfcf; background:#F5F3EE;}
.sheet-row:hover{background:#F0EEE7;}
.sheet-title{font-family:"Playfair Display","Noto Serif JP",serif; font-size:clamp(22px,3.4vw,28px); letter-spacing:.05em;}
.sheet-sub{color:#666; font-size:.95rem;}
.sheet-arrow{position:absolute; right:20px; top:50%; transform:translateY(-50%); font-size:24px; color:#777;}
.sheet-card{position:relative; display:block; text-decoration:none; margin:12px 16px; padding:22px 56px 22px 24px; border-radius:10px;}
.sheet-card--tan{background:#C3AE90; color:#1b1b1b; border:1px solid #BAA27E;}
.card-title{font-family:"Playfair Display","Noto Serif JP",serif; font-size:clamp(22px,3.4vw,32px);}
.card-sub{margin-top:6px; opacity:.9; font-size:.95rem;}
.card-launch{position:absolute; right:18px; top:50%; transform:translateY(-50%); font-size:22px; opacity:.9;}