/* =========================================================
   つきじ治作 — home（トップページ）固有スタイル
   抽出元: index.html の <style>
   命名: 既存BEM/JSフック名を保持（main.js依存のため不変）
   body: page-home（名前空間）
   url(): css/pages/ 基準（../../images/...）
   注: ヘッダー/フッター/メニュー共通オーバーライドは index が
       lp-base.css を読み込まないため本ファイルに同梱（展開時に style.css へ集約検討）
   ========================================================= */
/* ===== Header v2 overrides ===== */
.header{padding:0 clamp(24px,8vw,120px);height:110px;}

.header__tools{gap:20px;}

/* ご予約 button — outline style with subtitle */
.btn-reserve-v2{
  display:inline-flex;flex-direction:column;align-items:center;justify-content:center;
  font-family:var(--serif);font-weight:400;font-size:11px;letter-spacing:.22em;
  color:var(--ink);
  padding:6px 14px;
  border:1px solid var(--gold);
  background:var(--gold);
  transition:color .4s var(--ease),border-color .4s var(--ease),background .4s var(--ease);
  white-space:nowrap;text-decoration:none;line-height:1.1;
}
.btn-reserve-v2:hover{color:var(--gold);border-color:var(--gold);background:transparent;}
.btn-reserve-v2 .reservation{
  font-family:var(--en-body);font-size:8px;letter-spacing:.08em;font-style:italic;
  opacity:.85;line-height:1;
}

/* Phone with icon */
.header-tel{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--en-body);font-weight:500;font-size:15px;letter-spacing:.05em;
  color:var(--mute);white-space:nowrap;text-decoration:none;
  transition:color .3s;
}
.header-tel:hover{color:var(--gold-hi);}
.header-tel svg{flex-shrink:0;}

/* Plain text nav links (婚礼, オンラインショップ) */
.header-nav-link{
  font-family:var(--serif);font-size:13px;letter-spacing:.18em;
  color:var(--mute);white-space:nowrap;text-decoration:none;
  transition:color .3s;
}
.header-nav-link:hover{color:var(--gold-hi);}

/* SNS icons in header */
.header-sns{display:inline-flex;align-items:center;gap:10px;}
.header-sns a{display:inline-flex;align-items:center;color:var(--mute);transition:color .3s;}
.header-sns a:hover{color:var(--gold-hi);}

/* Language selector v2 — globe icon + 日本語 */
.lang-select-v2{position:relative;}
.lang-select-v2__toggle{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--serif);font-size:12px;letter-spacing:.15em;
  color:var(--mute);padding:6px 14px;line-height:1.1;
  border:1px solid rgba(232,226,212,.4);border-radius:20px;
  background:none;cursor:pointer;
  transition:color .3s,border-color .3s;white-space:nowrap;
}
.lang-select-v2__toggle:hover{color:var(--gold-hi);border-color:var(--gold-hi);}
.lang-select-v2__toggle svg{flex-shrink:0;}
.lang-select-v2__caret{
  display:inline-block;width:5px;height:5px;
  border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:translateY(-1px) rotate(45deg);transition:transform .3s var(--ease);
}
.lang-select-v2:hover .lang-select-v2__caret{transform:translateY(0) rotate(225deg);}
.lang-select-v2__menu{
  position:absolute;top:calc(100% + 6px);right:0;min-width:140px;
  list-style:none;padding:8px 0;margin:0;
  background:rgba(14,17,22,.96);backdrop-filter:blur(14px);
  border:.5px solid rgba(184,147,90,.35);
  opacity:0;visibility:hidden;transform:translateY(-4px);
  transition:opacity .3s var(--ease),transform .3s var(--ease),visibility 0s .3s;
  z-index:10;
}
.lang-select-v2:hover .lang-select-v2__menu,
.lang-select-v2:focus-within .lang-select-v2__menu{
  opacity:1;visibility:visible;transform:translateY(0);
  transition:opacity .3s var(--ease),transform .3s var(--ease),visibility 0s;
}
.lang-select-v2__menu a{
  display:block;padding:8px 18px;
  font-family:var(--serif);font-size:11px;letter-spacing:.2em;color:var(--mute);
  transition:color .3s,background .3s;
}
.lang-select-v2__menu a:hover{color:var(--gold-hi);background:rgba(184,147,90,.08);}

/* Englishボタンを13pxに揃える */
.lang-en{font-size:12px;}

@media (max-width:1280px){
  .header-tel{font-size:13px;}
  .header-nav-link{font-size:11px;}
  .btn-reserve-v2{font-size:11px;padding:8px 20px;}
  .header-sns a svg{width:14px;height:14px;}
}
@media (max-width:1080px){
  .header-tel{display:none;}
  .header-nav-link{display:none;}
  .header-sns{display:none;}
  .lang-en{display:none;}
  .btn-reserve-v2{display:none;}
}

/* ===== Carousel card overrides (prologue) ===== */
.item--card{
  --offset-scale:.3;
  --v-shift:0px;
  --L:clamp(28px,3.2vw,44px);
  flex-direction:column;
  align-items:stretch;
  margin-right:clamp(60px,8vw,120px);
  transform:translateY(var(--v-shift));
}
/* portrait (default — large) */
.item--card{width:clamp(320px,30vw,460px);}
/* portrait small */
.item--card.card-s{width:clamp(240px,22vw,340px);}
/* landscape variant */
.item--card.card-l{width:clamp(420px,38vw,580px);}

/* random vertical offsets & margin variation */
.item--card[data-pos="1"]{--v-shift:0px;margin-right:clamp(70px,9vw,130px);}
.item--card[data-pos="3"]{--v-shift:60px;margin-right:clamp(50px,6vw,90px);}
.item--card[data-pos="5"]{--v-shift:-30px;margin-right:clamp(80px,10vw,140px);}
.item--card[data-pos="7"]{--v-shift:40px;margin-right:clamp(55px,7vw,100px);}
.item--card[data-pos="9"]{--v-shift:-20px;margin-right:clamp(90px,11vw,150px);}
.item--card[data-pos="11"]{--v-shift:70px;margin-right:clamp(45px,6vw,85px);}
.item--card[data-pos="13"]{--v-shift:10px;margin-right:clamp(75px,9vw,130px);}
.item--card[data-pos="15"]{--v-shift:-40px;margin-right:clamp(60px,8vw,110px);}
.item--card[data-pos="17"]{--v-shift:50px;margin-right:clamp(85px,10vw,140px);}
.item--card[data-pos="19"]{--v-shift:-10px;margin-right:clamp(50px,7vw,95px);}
.item--card[data-pos="21"]{--v-shift:30px;margin-right:clamp(70px,9vw,120px);}
.item--card[data-pos="23"]{--v-shift:-50px;margin-right:clamp(60px,8vw,110px);}

.loop__card{
  position:relative;
  width:100%;
  aspect-ratio:3/4;
  overflow:visible;
  border-radius:2px;
  box-shadow:0 24px 56px -30px rgba(0,0,0,.9);
}
.card-l .loop__card{aspect-ratio:4/3;}

.loop__card-img{
  position:absolute;inset:0;
  background:center/cover no-repeat #1a2530;
  filter:saturate(.86) brightness(.92);
  border-radius:2px;
  overflow:hidden;
}
.loop__card-img::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(14,17,22,0) 40%,rgba(14,17,22,.55) 100%);
}
.loop__card-jp{
  position:absolute;right:16px;bottom:24px;left:auto;top:auto;
  writing-mode:vertical-rl;
  font-family:var(--serif-display);font-weight:500;
  font-size:clamp(18px,1.8vw,24px);
  letter-spacing:.22em;line-height:1.8;
  color:#fff;
  z-index:1;
}
/* JP text corner variations — four corners */
/* TL = top-left */
.jp-tl .loop__card-jp{top:24px;left:16px;right:auto;bottom:auto;}
.jp-tl .loop__card-img::after{background:linear-gradient(0deg,rgba(14,17,22,0) 40%,rgba(14,17,22,.55) 100%);}
/* TR = top-right (default right, move to top) */
.jp-tr .loop__card-jp{top:24px;right:16px;bottom:auto;left:auto;}
.jp-tr .loop__card-img::after{background:linear-gradient(0deg,rgba(14,17,22,0) 40%,rgba(14,17,22,.55) 100%);}
/* BL = bottom-left */
.jp-bl .loop__card-jp{bottom:24px;left:16px;right:auto;top:auto;}
/* BR = bottom-right (default — no override needed) */
.loop__card-jp span{
  display:inline-block;
  background:rgba(0,0,0,.35);
  padding:8px 6px;
}

/* caption area (default — used by landscape) */
.loop__card-cap{
  margin-top:16px;
  padding-left:2px;
}
.loop__card-line{
  display:block;
}
.loop__card-en{
  font-family:var(--en-body);font-style:italic;font-weight:400;
  font-size:14px;
  letter-spacing:.08em;line-height:1.6;
  color:var(--gold);opacity:.92;
}
/* portrait cards: caption to the right of image, top-aligned */
.item--card:not(.card-l){position:relative;}
.item--card:not(.card-l) .loop__card-cap{
  position:absolute;top:0;left:100%;margin-left:14px;
  display:flex;flex-direction:row;align-items:flex-start;gap:10px;
  margin-top:0;padding-left:0;
}
.item--card:not(.card-l) .loop__card-en{
  writing-mode:vertical-rl;
  line-height:1.8;
}

/* Gold L-shaped accent — positioned at image corner, three patterns.
   acc-in  = fully inside image corner
   acc-mid = corner at edge, text-side stroke extends outside
   acc-out = fully outside image, ~10px offset from corner */
.loop__card-line{
  position:absolute;
  z-index:2;
  border-color:var(--gold);border-style:solid;border-width:0;
  opacity:.45;
  --L:clamp(28px,3.2vw,44px);
  width:var(--L);height:var(--L);
  pointer-events:none;
}

/* ── Portrait ┐ at image top-right corner ── */
.item--card:not(.card-l) .loop__card-line{
  border-top-width:.5px;border-right-width:.5px;
}
.item--card:not(.card-l).acc-in .loop__card-line{
  top:10px;right:10px;
}
.item--card:not(.card-l).acc-mid .loop__card-line{
  top:10px;right:calc(var(--L) * -.35);
}
.item--card:not(.card-l).acc-mid .loop__card-cap{
  margin-left:calc(var(--L) * .35 + 4px);
}
.item--card:not(.card-l).acc-out .loop__card-line{
  top:-6px;right:-6px;
}
.item--card:not(.card-l).acc-out .loop__card-cap{
  margin-left:18px;
}

/* ── Landscape └ at image bottom-left corner ── */
.card-l .loop__card-line{
  border-bottom-width:.5px;border-left-width:.5px;
}
.card-l.acc-in .loop__card-line{
  bottom:10px;left:10px;
}
.card-l.acc-mid .loop__card-line{
  bottom:calc(var(--L) * -.35);left:10px;
}
.card-l.acc-mid .loop__card-cap{
  margin-top:calc(var(--L) * .35 + 4px);
}
.card-l.acc-out .loop__card-line{
  bottom:-6px;left:-6px;
}
.card-l.acc-out .loop__card-cap{
  margin-top:18px;
}

/* photo sources for cards */
.loop__card-img[data-img="1"]{background-image:url('../../images/top/slide01-768.jpg');}
.loop__card-img[data-img="2"]{background-image:url('../../images/top/slide02.webp');}
.loop__card-img[data-img="3"]{background-image:url('../../images/top/shiki-768.jpg');}
.loop__card-img[data-img="4"]{background-image:url('../../images/top/slide04.jpg');}
.loop__card-img[data-img="5"]{background-image:url('../../images/top/slide05.webp');}
.loop__card-img[data-img="6"]{background-image:url('../../images/top/slide06-1280.webp');}
.loop__card-img[data-img="7"]{background-image:url('../../images/top/slide07-768.jpg');}
.loop__card-img[data-img="8"]{background-image:url('../../images/top/slide08.webp');}
.loop__card-img[data-img="9"]{background-image:url('../../images/top/slide09.webp');}
.loop__card-img[data-img="10"]{background-image:url('../../images/top/slide10-1280.jpg');}
.loop__card-img[data-img="11"]{background-image:url('../../images/top/MG_4820-1980x1320.jpg-768.webp');}
.loop__card-img[data-img="12"]{background-image:url('../../images/top/slide12.webp');}

@media (max-width:1080px){
  .item--card{width:clamp(240px,65vw,320px);--offset-scale:.2;margin-right:clamp(30px,6vw,50px);}
  .item--card.card-s{width:clamp(200px,50vw,260px);}
  .item--card.card-l{width:clamp(300px,75vw,420px);}
  .loop__card-jp{font-size:clamp(16px,4vw,20px);right:12px;bottom:16px;}
}

/* ===== Occasions 信・節・雅 kanji background squares ===== */
.o-card__kanji{
  position:relative;
  z-index:1;
  padding:8px;
  border-radius:2px;
}
.card-A .o-card__kanji{background:rgba(102,12,12,.80);}
.card-B .o-card__kanji{background:rgba(30,92,78,.80);}
.card-C .o-card__kanji{background:rgba(12,42,102,.80);}

/* ===== Cuisine section overrides (from Figma) ===== */

/* Head: stack kicker + title + lead vertically */
.dish .dish__head{
  flex-direction:column;
  align-items:flex-start;
  gap:24px;
}
.dish .dish__kicker{
  font-family:var(--en-serif);
  font-size:11px;
  font-weight:400;
  letter-spacing:.28px;
}
.dish .dish__title{
  font-family:var(--serif-display);
  font-size:var(--fs-h2-section);
  font-weight:500;
  letter-spacing:.55px;
}
.dish .dish__lead{
  font-family:var(--serif);
  font-size:14px;
  font-weight:400;
  line-height:1.6;
  letter-spacing:.21px;
  opacity:1;
  max-width:none;
}

/* Hero: 85% width, right-aligned, 16:9 */
.dish .dish-hero{
  width:85%;
  margin-left:auto;
  margin-right:0;
  aspect-ratio:16/9;
  overflow:visible;
}

/* Hero caption: content left edge, overlapping top-left of image */
.dish .dish-hero__cap{
  left:calc(-15 / 85 * 100%);
  top:clamp(24px,4vw,48px);
  right:auto;bottom:auto;
  text-align:left;
  background:var(--paper,#f4efe6);
  padding:20px 32px;
  display:inline-flex;
  flex-direction:column;
  gap:8px;
  text-shadow:none;
  transform:none;
}
.dish .dish-hero__cap .en{
  font-family:var(--en-serif);
  font-size:11px;font-weight:400;
  color:var(--gold);
  letter-spacing:.18px;
  text-shadow:none;
  margin-bottom:0;
}
.dish .dish-hero__cap .jp{
  font-family:var(--serif-display);
  font-size:clamp(16px,1.4vw,20px);
  font-weight:500;
  letter-spacing:.23px;
  color:var(--black,#2a2f3a);
  text-shadow:none;
  line-height:normal;
  writing-mode:horizontal-tb;
}
.dish .dish-hero__cap .jp small{
  font-family:var(--serif);
  font-size:clamp(12px,1vw,16px);
  font-weight:400;
  opacity:.7;
  margin-left:.5em;
}

/* Sig-intro: compact left-aligned, image LEFT + vertical text RIGHT */
.dish .sig-intro{
  display:grid;
  grid-template-columns:clamp(200px,25vw,300px) auto;
  gap:clamp(24px,4vw,48px);
  max-width:clamp(400px,50vw,600px);
  align-items:start;
}
.dish .sig-intro__img{
  order:-1;
  aspect-ratio:73/102;
}
.dish .sig-intro__copy{
  writing-mode:vertical-rl;
  padding:48px 0 0 0;
  position:relative;
}
.dish .sig-intro__kicker{
  writing-mode:horizontal-tb;
  position:absolute;
  top:0;left:0;right:0;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
  margin-bottom:0;
}
.dish .sig-intro__kicker .line{
  width:100%;height:.5px;
  order:1;
}
.dish .sig-intro__kicker .en{
  order:0;
}
.dish .sig-intro__title{
  font-family:var(--serif-display);
  font-size:var(--fs-h3);
  font-weight:500;
  letter-spacing:.37px;
  line-height:1;
  margin-bottom:0;
  margin-left:48px;
}
.dish .sig-intro__desc{
  font-family:var(--serif);
  font-size:14px;
  font-weight:400;
  line-height:1.8;
  letter-spacing:.18px;
}

/* Pillars head: grid — en + rule in col2, h3 in col3, 1fr pushes right */
.dish .pillars__head{
  display:grid;
  grid-template-columns:1fr 240px auto;
  grid-template-rows:auto auto;
  gap:0 28px;
  align-items:end;
}
.dish .pillars__head .txt{
  display:contents;
}
.dish .pillars__head .txt .en{
  grid-column:2;
  grid-row:1;
  text-align:right;
  margin-bottom:6px;
}
.dish .pillars__head .rule{
  grid-column:2;
  grid-row:2;
  width:100%;
  max-width:none;
  height:1px;
  margin-bottom:0;
  background:linear-gradient(90deg,transparent 0%, var(--gold) 100%);
  align-self:center;
}
.dish .pillars__head h3{
  grid-column:3;
  grid-row:1 / 3;
  align-self:end;
  white-space:nowrap;
}

/* Pillars: fine-tune from Figma */
.dish .pillar__body{gap:16px;}
.dish .pillar__no{
  gap:20px;margin-bottom:18px;
  padding-bottom:0;
  border-bottom:1px solid var(--gold);
  opacity:.8;
}
.dish .pillar__no .kanji{font-size:clamp(22px,1.8vw,26px);}
.dish .pillar__no .en{
  font-family:var(--en-serif);
  font-style:italic;
  font-size:clamp(10px,.8vw,12px);
}
.dish .pillar__no .en::before{
  width:1px;
  height:20px;
  margin-right:14px;
  vertical-align:middle;
}
.dish .pillar__title{
  font-size:var(--fs-h4);
  font-weight:500;
  white-space:nowrap;
}
.dish .pillar__desc{
  font-size:14px;
  line-height:2;
}

/* Footer: centered with ornament icon */
.dish .dish__foot{text-align:center;margin-bottom:0;}
.dish .dish-cta{margin-top:clamp(32px,4vw,56px);}
.dish .dish__foot .line{display:none;}
.dish .dish__foot-icon{
  display:block;
  margin:0 auto 24px;
  color:var(--gold);
  opacity:.6;
}
.dish .dish__foot p{
  font-family:var(--serif-display);
  font-size:var(--fs-h3);
  font-weight:500;
  letter-spacing:.28px;
  color:rgba(92,90,85,1);
}

/* CTA: centered column layout */
.dish .dish-cta__inner{
  display:flex;flex-direction:column;align-items:center;
  text-align:center;gap:36px;
}
.dish .dish-cta__copy p{
  max-width:40em;
  text-align:center;
  font-size:14px;
  line-height:1.6;
  letter-spacing:.16px;
}
.dish .dish-cta__btn{
  margin:0 auto;
}

/* ===== Stage (rooms) section overrides ===== */

/* "舞台と、しつらえ。" overlaps the image below */
.rooms .home-garden__top{
  padding-bottom:0;
  margin-bottom:-10rem;
  position:relative;
  z-index:2;
}

/* Tighten spacing between text elements on the image */
.rooms .home-garden__content-heading{
  margin-bottom:clamp(1rem,2.5vh,2.5rem);
}
.rooms .home-garden__content-heading-main{
  margin-bottom:1rem;
}
.rooms .home-garden__content-text{
  margin-bottom:clamp(1.2rem,3vh,3rem);
}

/* Remove full-screen vignette */
.rooms .home-garden__item-content{
  background:none;
}
/* Black mask only behind the text wrapper */
.rooms .home-garden__text-mask{
  background:rgba(0,0,0,.5);
  padding:clamp(1.5rem,3vw,2.5rem) clamp(2rem,4vw,3rem);
  display:inline-flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0;
}

/* ===== Hospitality section overrides ===== */

/* sec-title: remove line, stack vertically with en on top */
.hospitality .sec-title{
  flex-direction:column;
  align-items:flex-start;
  gap:12px;
}
.hospitality .sec-title .line{
  display:none;
}
.hospitality .sec-title .en{
  order:-1;
}

/* Captions: horizontal, outside images */
.hospitality .hospi-caption{
  writing-mode:horizontal-tb;
}
.hospitality .hospi-caption .jp{
  display:flex;
  align-items:center;
  gap:12px;
  letter-spacing:.18em;
}
.hospitality .hospi-caption .jp::before{
  content:"";
  display:inline-block;
  width:28px;
  height:1px;
  background:#fff;
  opacity:.7;
  flex-shrink:0;
}

/* item-1: caption just below photo (photo ends at 84%) */
.hospitality .hospi-item-1 .hospi-caption{
  top:84%;
  bottom:auto;
  left:0;
  right:auto;
}

/* item-2: vertical text, left side of image, bottom-aligned */
.hospitality .hospi-item-2 .hospi-caption{
  writing-mode:vertical-rl;
  top:auto;
  bottom:0;
  left:-2.5em;
  right:auto;
}
.hospitality .hospi-item-2 .hospi-caption .jp{
  flex-direction:row;
  align-items:center;
  gap:10px;
}
.hospitality .hospi-item-2 .hospi-caption .jp::before{
  width:1px;
  height:28px;
}

/* item-3: caption just below photo (photo ends at 78%), right-aligned, 4:3 aspect */
.hospitality .hospi-item-3{
  aspect-ratio:4/3;
}
.hospitality .hospi-item-3 .hospi-caption{
  top:78%;
  bottom:auto;
  left:auto;
  right:-4%;
}

/* ===== Wedding section overrides ===== */

/* Remove full overlay */
.wedding .wedding__overlay{
  background:none;
}
.wedding__link:hover .wedding__overlay{
  background:none;
}

/* Black mask behind text area only */
.wedding .wedding__inner{
  justify-content:flex-end;
  padding-bottom:clamp(60px,10vh,120px);
}
.wedding__text-mask{
  background:rgba(0,0,0,.5);
  padding:clamp(1.5rem,3vw,2.5rem) clamp(2rem,4vw,3rem);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  /* 画面より広くならないようにする。以前は max-width:none / width:auto で、
     文を折り返さない指定（下の white-space）と重なって、狭い画面で黒帯ごと
     画面の外へはみ出し、文字が切れていた（2026-09-06 ご指摘） */
  max-width:100%;
  width:auto;
  box-sizing:border-box;
}
.wedding__text-mask .wedding__en{
  margin-bottom:12px;
}
.wedding__text-mask .wedding__title{
  margin-bottom:14px;
}
.wedding__text-mask .wedding__lead{
  margin-bottom:18px;
  /* 改行位置は本文の <br> で決める。入りきらない画面では折り返す
     （white-space:nowrap だと折り返せず、はみ出して切れてしまう） */
  max-width:100%;
  white-space:normal;
}
a.wedding__more{
  text-decoration:none;
  color:#fff;
}
.wedding__link:hover .wedding__bg{ transform:scale(1); }
.wedding.is-in .wedding__link:hover .wedding__bg{ transform:scale(1); }
.wedding__link:hover .wedding__en,
.wedding__link:hover .wedding__title,
.wedding__link:hover .wedding__lead{ text-shadow:none; }
.wedding__link:hover .wedding__more{ letter-spacing:.3em; color:#fff; border-color:rgba(255,255,255,.8); text-shadow:none; }
.wedding__link:hover .wedding__more .arrow{ width:22px; }
a.wedding__more:hover{ letter-spacing:.34em; color:var(--gold-hi); border-color:var(--gold-hi); }
a.wedding__more:hover .arrow{ width:32px; }

/* ===== Instagram section overrides ===== */

/* Titles side by side */



/* Button in top-right (replacing handle) */






.access .sec-title .line{ display:none; }
.access .sec-title{
  flex-direction:row-reverse;
  justify-content:flex-end;
  gap:16px;
}
.access .access__map{ aspect-ratio:4/3; }
.access .access__map-wrap{
  display:flex;
  flex-direction:column;
  gap:24px;
}
.access .access__icons{ margin-top:0; }

.news .sec-title{ display:none; }
.news__col h3 .news__more{
  font-family:var(--serif);
  font-size:13px;
  font-weight:400;
  letter-spacing:.2em;
  color:var(--ink);
  text-decoration:none;
  padding-bottom:4px;
  border-bottom:.5px solid transparent;
  transition:color .4s var(--ease),border-color .4s var(--ease),letter-spacing .4s var(--ease);
}
.news__col h3 .news__more:hover{
  color:var(--gold);
  border-color:var(--gold);
  letter-spacing:.28em;
}

@media (max-width:767px){
  .dish .pillars__head{display:flex;flex-direction:column;align-items:flex-start;gap:14px;}
  .dish .pillars__head h3{white-space:normal;}
  
}

/* ============================================================
   UNIFIED DARK NAVY — page-wide background normalization
   Header, body, all sections, and footer share a single navy.
   Day/night palette swap is disabled here.
   ============================================================ */
:root{
  --ink:#1a2638;
  --ink-2:#1a2638;
}
html, body, body.is-day{
  background-color:#1a2638 !important;
  color:var(--mute);
}
.header.is-scrolled{
  background:rgba(26,38,56,.85);
}

/* お料理 (.dish) — was designed with a day-mode light palette.
   Lock to dark navy and lift text colors to the cream-on-dark scheme. */
.dish,
.dish.is-day{
  background:#1a2638 !important;
  color:var(--mute) !important;
}
.dish__daylayer{display:none !important;}
.dish .dish__title,
.dish .dish__lead,
.dish .dish__foot p,
.dish .pillar__title,
.dish .pillar__desc,
.dish .sig-intro__title,
.dish .sig-intro__desc{
  color:var(--mute) !important;
}
.dish .dish__title .em{color:var(--gold) !important;}
.dish .dish-hero__cap{
  background:#f0ead9 !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  padding:clamp(32px,3.6vw,48px) clamp(28px,3vw,42px) !important;
  border:.5px solid rgba(184,147,90,.32);
}
.dish .dish-hero__cap-text{
  font-family:var(--serif-display);
  font-size:clamp(13px,1.05vw,16px);
  font-weight:500;
  letter-spacing:.18em;
  line-height:2.1;
  color:var(--ink) !important;
  margin:0;
}
.dish .vessels .v::after{
  color:var(--mute);
  background:rgba(14,17,22,.4);
}
/* dish-cta wrapper — drop its bottom margin */
.dish .dish-cta{margin-bottom:0 !important;}

/* Match dish wrap to other major sections (.occasions, .access, wedding):
   max-width 1600px with padding-inline clamp(24px,5vw,80px) */
.dish > .wrap{
  max-width:1600px !important;
  padding-inline:clamp(24px,5vw,80px) !important;
}
/* dish-hero — right-aligned to the wrap's right edge */
.dish .dish-hero{
  width:78% !important;
  margin-left:auto !important;
  margin-right:0 !important;
}
/* Caption — flush to the wrap's left edge, overlapping image BOTTOM */
.dish .dish-hero__cap{
  left:calc(-22 / 78 * 100%) !important;
  top:auto !important;
  bottom:clamp(-32px,-2vw,-16px) !important;
}
@media (max-width:900px){
  .dish .dish-hero{
    width:100% !important;
    overflow:visible !important;
    aspect-ratio:auto !important;
    display:flex !important;
    flex-direction:column !important;
  }
  .dish .dish-hero__img{
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    aspect-ratio:4/3 !important;
  }
  .dish .dish-hero::after{
    display:none !important;
  }
  .dish .dish-hero__cap{
    position:static !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    width:auto !important;
    max-width:100% !important;
    margin-top:clamp(16px,3vw,24px) !important;
  }
}

/* Wedding section — add bottom breathing room */
.wedding{
  margin-bottom:clamp(80px,11vw,160px) !important;
}

/* Hero lead — vertical column sitting between sub and title */
/* Top-align the three vertical columns (sub / lead / title) */
.hero__copy{align-items:flex-start !important;}
.hero__title{font-size:32px !important;}
.hero__lead{
  writing-mode:vertical-rl;
  font-family:var(--serif);font-weight:400;
  font-size:14px;
  letter-spacing:.32em;line-height:2.3;
  color:rgba(232,226,212,.85);
  margin:0;padding-top:0;
  max-height:52vh;
}
@media (max-width:767px){
  .hero__lead{
    font-size:12px;letter-spacing:.26em;line-height:2.1;
  }
}

/* CTA button — designed dark-on-light, lift to cream-on-dark */
.dish .dish-cta__btn{
  color:var(--mute) !important;
  border-bottom-color:rgba(232,226,212,.6) !important;
}
.dish .dish-cta__btn:hover{
  color:var(--gold) !important;
  border-bottom-color:var(--gold) !important;
}

/* Signature-intro pair — two sig-intros, second offset right & ~50% down */
.dish .sig-intro-pair{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(40px,5vw,80px);
  align-items:start;
  margin-bottom:0;
}
.dish .sig-intro-pair .sig-intro{
  max-width:clamp(360px,42vw,520px);
  width:auto;
}
.dish .sig-intro-pair .sig-intro__copy{
  max-block-size:clamp(140px,16vw,210px);
}
.dish .sig-intro--alt{
  margin-top:clamp(120px,20vh,260px);
  justify-self:end;
}
.dish .sig-intro--alt .sig-intro__img{
  background-image:url('../../images/top/Img26135-1280.jpg');
}
@media (max-width:900px){
  .dish .sig-intro-pair{grid-template-columns:1fr; gap:clamp(48px,8vw,96px);}
  .dish .sig-intro--alt{margin-top:0; justify-self:stretch;}
  /* mobile sig-intro: square image on top, horizontal copy below */
  .dish .sig-intro{
    grid-template-columns:1fr !important;
    max-width:100% !important;
    gap:clamp(20px,4vw,32px) !important;
  }
  .dish .sig-intro-pair .sig-intro{
    max-width:100% !important;
  }
  .dish .sig-intro__img{
    aspect-ratio:1/1 !important;
    width:100% !important;
  }
  .dish .sig-intro__copy{
    writing-mode:horizontal-tb !important;
    padding:0 !important;
    max-block-size:none !important;
  }
  .dish .sig-intro-pair .sig-intro__copy{
    max-block-size:none !important;
  }
  .dish .sig-intro__kicker{
    position:static !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:14px !important;
    margin-bottom:14px !important;
  }
  .dish .sig-intro__kicker .line{
    width:44px !important;
    order:0 !important;
  }
  .dish .sig-intro__kicker .en{
    order:1 !important;
  }
  .dish .sig-intro__title{
    margin-left:0 !important;
    margin-bottom:14px !important;
  }
}

/* Footer — match unified background, soften the top border tone */
.footer{
  background:#1a2638;
  border-top-color:rgba(184,147,90,.25);
}

/* Sections that used transparent/--ink: nothing to override —
   they now inherit the unified body navy automatically. */

/* Occasions cards — remove gold outline, lighten the dark mask */
.o-card{border:none !important;}
.o-card .bg::after{background:rgba(14,17,22,.32) !important;}
.o-card.is-active .bg::after{background:rgba(14,17,22,.28) !important;}
.o-card:not(.is-active) .bg{filter:grayscale(15%) brightness(.95) !important;}
@media (max-width:1080px){
  .o-card__head{
    writing-mode:horizontal-tb !important;
    display:flex !important;
    align-items:baseline !important;
    gap:14px !important;
    line-height:1.2 !important;
  }
}

/* News / Columns — sit on a cream panel so the original ink text
   reads naturally against a light background. */
.news__grid{
  gap:clamp(28px,3.5vw,56px) !important;
}
.news__col{
  background:#f0ead9;
  color:var(--ink);
  padding:clamp(36px,4vw,56px) clamp(28px,3vw,44px);
}
.news .sec-title h2,
.news__col h3,
.news__list li,
.col-card,
.col-card .body h4{
  color:var(--ink) !important;
}
.col-card .body p{color:rgba(26,26,26,.7) !important;}
.col-card .body h4{
  font-size:clamp(13px,1.05vw,15px) !important;
  letter-spacing:.14em !important;
  line-height:1.6 !important;
}
.news__list li{border-bottom-color:rgba(26,38,56,.18) !important;}
.col-card{border-bottom-color:rgba(26,38,56,.18) !important;}

/* お知らせ/コラム 動的化対応：リンク要素をレイアウトに透過させる */
.news__list-link{display:contents; color:inherit; text-decoration:none;}
a.col-card{text-decoration:none; color:var(--ink) !important;}
a.col-card:hover .body h4{color:var(--gold) !important;}

/* ============================================================
   Section padding — trim excessive vertical space
   ============================================================ */
.prologue,.news,.access{
  padding-top:clamp(80px,11vw,150px) !important;
  padding-bottom:clamp(80px,11vw,150px) !important;
}
.access{padding-bottom:0 !important;}
.occasions{
  padding-top:0 !important;
  padding-bottom:clamp(50px,7vw,100px) !important;
}
.dish{
  padding-top:clamp(60px,8vw,110px) !important;
  padding-bottom:clamp(60px,8vw,110px) !important;
}
.footer{margin-top:clamp(120px,16vw,220px) !important;}

/* トップ専用：共有 .sig-intro__img のベース画像を images/top で完結させる */
.sig-intro__img{background-image:url('../../images/top/mizutaki_tate.jpg');}
