/* =========================================================
   HAND´S（ハンズ）— 京都・六角通の理美容室
   墨と生成り。明朝を主役に、筆の勢いで緩急をつける。
   ========================================================= */
:root{
  --sumi:#1f1b18;      /* 墨：店内の黒・テキスト */
  --sumi-2:#2b2622;    /* 墨の面 */
  --kinari:#efe8db;    /* 生成り：紙 */
  --kami:#e4dac9;      /* 生成りの濃い面 */
  --hai:#5b524a;       /* 灰：補助テキスト（生成り上 6.9:1） */
  --usuzumi:#bfb5a6;   /* 薄墨：墨上の補助テキスト（墨上 8.6:1） */
  --kin:#a8875a;       /* 真鍮：シャンデリアの金。罫と記号だけに */
  --line:#06c755;      /* LINE公式色：アイコンの小さな点だけに使う */

  --mincho:"Shippori Mincho B1","Shippori Mincho","Noto Serif JP","Noto Serif CJK JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --serif-en:"Cormorant Garamond","Cormorant",Garamond,"Times New Roman",serif;
  --gothic:"Zen Kaku Gothic New","Hiragino Sans","Noto Sans JP","Noto Sans CJK JP","Yu Gothic",sans-serif;

  --gut:clamp(20px,5vw,72px);
  --max:1320px;
  --ease:cubic-bezier(.2,.7,.1,1);
  --hd:76px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hd) + 16px)}
body{
  margin:0;background:var(--kinari);color:var(--sumi);
  font-family:var(--mincho);font-size:17px;line-height:2;letter-spacing:.04em;
  font-feature-settings:"palt" 0;font-kerning:normal;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto}
picture{display:contents}
a{color:inherit;text-underline-offset:.25em;text-decoration-thickness:1px}
a:hover{text-decoration-color:var(--kin)}
:focus-visible{outline:2px solid var(--kin);outline-offset:3px}
h1,h2,h3,h4{margin:0;font-weight:600;line-height:1.5;letter-spacing:.06em;word-break:auto-phrase;text-wrap:balance}
.nb{display:inline-block}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
ul,ol{margin:0;padding:0;list-style:none}
dl,dd{margin:0}
address{font-style:normal}
small{font-size:.82em}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--sumi);color:var(--kinari);padding:10px 16px;font-family:var(--gothic);font-size:15px}
.skip:focus{top:12px}

/* ---------- テキストリンク：筆で払ったような下線 ---------- */
.tlink{
  display:inline-flex;align-items:center;gap:.7em;font-family:var(--gothic);font-weight:700;font-size:16px;
  letter-spacing:.08em;text-decoration:none;padding:.5em 0;position:relative;
}
.tlink::after{
  content:"";width:34px;height:9px;flex:none;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 9'%3E%3Cpath d='M0 5.2C8 4.4 18 4 28 4.3L25 1l9 3.8-9 3.6 3-3.1C18 5.6 8 5.8 0 6z'/%3E%3C/svg%3E") no-repeat center/contain;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 9'%3E%3Cpath d='M0 5.2C8 4.4 18 4 28 4.3L25 1l9 3.8-9 3.6 3-3.1C18 5.6 8 5.8 0 6z'/%3E%3C/svg%3E") no-repeat center/contain;
  transition:transform .4s var(--ease);
}
.tlink:hover::after{transform:translateX(6px)}
.tlink--light{color:var(--kinari)}

/* ---------- LINEボタン ---------- */
.btn-line{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  min-height:54px;padding:0 28px;border-radius:6px;background:var(--line);color:#fff;border:0;
  font-family:var(--gothic);font-weight:700;font-size:16px;letter-spacing:.05em;text-decoration:none;
  transition:background .25s;
}
.btn-line::before{
  content:"";width:20px;height:19px;background:#fff;flex:none;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M12 0C5.4 0 0 4.3 0 9.6c0 4.8 4.2 8.8 10 9.5.4.1.9.3 1 .6.1.3.1.8 0 1.1l-.2 1c0 .3-.2 1.2 1.1.6 1.3-.5 7-4.1 9.5-7C23.2 13.6 24 11.7 24 9.6 24 4.3 18.6 0 12 0z'/%3E%3C/svg%3E") no-repeat center/contain;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M12 0C5.4 0 0 4.3 0 9.6c0 4.8 4.2 8.8 10 9.5.4.1.9.3 1 .6.1.3.1.8 0 1.1l-.2 1c0 .3-.2 1.2 1.1.6 1.3-.5 7-4.1 9.5-7C23.2 13.6 24 11.7 24 9.6 24 4.3 18.6 0 12 0z'/%3E%3C/svg%3E") no-repeat center/contain;
}
.btn-line:hover{background:#05b24c}
.btn-line--sm{min-height:42px;padding:0 18px;font-size:14px;border-radius:5px}
.btn-line--sm::before{width:17px;height:16px}


/* ---------- 電話ボタン（SPメニュー内） ---------- */
.btn-tel{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:54px;padding:0 24px;border-radius:6px;border:1px solid rgba(239,232,219,.45);color:var(--kinari);font-family:var(--serif-en);font-size:22px;letter-spacing:.06em;text-decoration:none}
.btn-tel svg{width:18px;height:18px}
/* ---------- フッター SNS（公式アイコン） ---------- */
.ft__sns{display:flex;gap:14px;margin-top:22px;padding:0;list-style:none}
.ft__sns a{display:block;width:40px;height:40px;transition:opacity .25s,transform .25s}
.ft__sns img{width:40px;height:40px;display:block}
.ft__sns a:hover{opacity:.85;transform:translateY(-2px)}

/* =========================================================
   ヘッダー
   ========================================================= */
.hd{
  position:fixed;inset:0 0 auto;z-index:100;height:var(--hd);
  display:flex;align-items:center;gap:24px;padding:0 var(--gut);
  color:var(--sumi);background:rgba(239,232,219,.94);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(31,27,24,.1);
  transition:background .35s,color .35s,border-color .35s,transform .4s var(--ease);
}
.hd__brand{flex:none;display:block;width:112px;position:relative}
.hd__logo img{width:112px;height:auto}
.hd__logo--light img{position:absolute;inset:0;opacity:0;transition:opacity .35s}
.hd__logo--dark img{transition:opacity .35s}
.hd__nav ul{display:flex;gap:clamp(16px,2vw,32px)}
.hd__nav a{white-space:nowrap;font-family:var(--gothic);font-weight:500;font-size:15px;letter-spacing:.08em;text-decoration:none;padding:8px 0;position:relative}
.hd__nav a[aria-current="page"]::after,.hd__nav a:hover::after{
  content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--kin);border-radius:2px;
}
.hd__navfoot{display:none}
.hd__nav{margin-left:auto}
.hd__cta{display:flex;align-items:center;gap:18px}
.hd__tel{font-family:var(--gothic);font-weight:700;font-size:20px;letter-spacing:.04em;text-decoration:none;line-height:1.2;display:flex;flex-direction:column}
.hd__tel-l{font-size:11.5px;font-weight:500;letter-spacing:.1em;color:inherit;opacity:.8}
.hd__toggle{display:none}

/* ダーク面の上ではヘッダーを透明に */
.theme-dark .hd:not(.is-solid){background:transparent;border-color:transparent;color:var(--kinari);-webkit-backdrop-filter:none;backdrop-filter:none}
.theme-dark .hd:not(.is-solid) .hd__logo--light img{opacity:1}
.theme-dark .hd:not(.is-solid) .hd__logo--dark img{opacity:0}

/* =========================================================
   TOP：ヒーロー（墨の見開き。縦書きの大コピー＋店内写真）
   ========================================================= */
.hero{position:relative;background:var(--sumi);color:var(--kinari);min-height:max(680px,100svh);overflow:hidden}
.hero__photo{position:absolute;inset:0;overflow:hidden}
.hero__slide{position:absolute;inset:0;opacity:0;transition:opacity 1.6s ease}
.hero__slide.is-on{opacity:1;z-index:1}
.hero__slide.is-out{opacity:0;z-index:1}
.hero__slide img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;transform:scale(1.02);transform-origin:var(--ox,50%) var(--oy,50%)}
.hero__slide:first-child img{object-position:50% 58%}
.hero__slide:nth-child(2) img{object-position:50% 22%}
.hero__slide:nth-child(3) img{object-position:50% 30%}
.hero__slide.is-zoom img{transform:scale(1.12);transition:transform 9s linear}
.hero__photo::after{z-index:2}
.hero__prog{position:absolute;z-index:3;right:var(--gut);bottom:clamp(36px,5vw,64px);display:flex;gap:8px;width:clamp(120px,12vw,180px)}
.hero__prog i{flex:1;height:2px;background:rgba(239,232,219,.28);position:relative;overflow:hidden}
.hero__prog i::after{content:"";position:absolute;inset:0;background:var(--kinari);transform:scaleX(0);transform-origin:left}
.hero__prog i.is-done::after{transform:scaleX(1)}
.hero__prog i.is-on::after{transform:scaleX(1);transition:transform var(--dur,6.5s) linear}
.hero__prog.is-paused i.is-on::after{transition:none}
.hero__photo::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(31,27,24,.5) 0,rgba(31,27,24,0) 22%),
             linear-gradient(0deg,rgba(31,27,24,.78) 0,rgba(31,27,24,.25) 34%,rgba(31,27,24,0) 55%),
             linear-gradient(270deg,rgba(31,27,24,.42) 0,rgba(31,27,24,0) 28%)}
.hero__copy{
  position:absolute;z-index:3;top:calc(var(--hd) + 56px);right:clamp(32px,7vw,120px);margin:0;
  writing-mode:vertical-rl;display:flex;gap:.5em;
  font-weight:400;font-size:clamp(34px,3.4vw,52px);line-height:1.5;letter-spacing:.18em;font-feature-settings:"vpal" 1;
  text-shadow:0 1px 24px rgba(31,27,24,.5);
}
.hero__col:nth-child(2){padding-top:2.2em}
.hero__copy .ch{display:inline-block}
.hero__copy .ch--p{letter-spacing:0;margin-block-end:-.42em}
.hero__foot{position:absolute;z-index:3;padding-bottom:28px;left:var(--gut);right:var(--gut);bottom:clamp(36px,5vw,64px);
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 48px;align-items:end;max-width:var(--max)}
.hero__en{grid-column:1 / -1;font-family:var(--serif-en);font-style:italic;font-weight:400;font-size:clamp(26px,2.6vw,40px);line-height:1.2;letter-spacing:.01em;margin-bottom:18px}
.hero__en i{font-style:normal;opacity:.6}
.hero__h1{font-family:var(--gothic);font-weight:500;font-size:14px;letter-spacing:.12em;color:var(--usuzumi);line-height:1.7;margin:0}
.hero__lead{grid-column:1;font-size:17px;line-height:1.9;margin:0}
.hero__info{grid-column:2;grid-row:2 / span 2;display:grid;gap:4px;font-size:15px;line-height:1.7;border-left:1px solid rgba(239,232,219,.35);padding-left:20px}
.hero__info div{display:grid;grid-template-columns:3em 1fr}
.hero__info dt{color:#d9c29c;font-family:var(--gothic);font-weight:700;font-size:13.5px;padding-top:.15em}

.js .hero__copy .ch{opacity:0;filter:blur(6px);animation:ink 1.4s var(--ease) forwards;animation-delay:calc(.4s + var(--i) * .12s)}
.js .hero__slide:first-child img{animation:settle 2.6s var(--ease) both}
.js .hero__slide:first-child.is-zoom img{animation:none}
.js .hero__foot{animation:fadein 1.2s ease 1.3s both}
@keyframes ink{to{opacity:1;filter:none}}
@keyframes settle{from{transform:scale(1.05);opacity:.5}to{transform:none;opacity:1}}
@keyframes fadein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* =========================================================
   TOP：ご挨拶（文字だけの見開き）
   ========================================================= */
.greet{padding:clamp(120px,16vw,240px) var(--gut) clamp(100px,12vw,180px)}
.greet__in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(12,1fr);gap:0 24px}
.greet__t{grid-column:1 / span 8;font-size:clamp(40px,5.6vw,84px);font-weight:500;line-height:1.35;letter-spacing:.04em;margin-bottom:clamp(48px,6vw,88px)}
.greet__body{grid-column:5 / span 5;font-size:18px;line-height:2.15}
.greet__note{grid-column:10 / span 3;align-self:end;font-size:15px;line-height:1.95;color:var(--hai);border-left:1px solid var(--kin);padding-left:20px}
.greet__date{color:var(--sumi);font-weight:600;font-size:16px}

/* =========================================================
   TOP：三つの手（手元写真を三枚並べる）
   ========================================================= */
.hands{background:var(--kami);padding:clamp(96px,11vw,160px) var(--gut)}
.hands__head{max-width:var(--max);margin:0 auto clamp(48px,6vw,80px);display:grid;grid-template-columns:auto 1fr;gap:24px 64px;align-items:end}
.hands__t{font-size:clamp(56px,8vw,128px);font-weight:500;line-height:1;letter-spacing:.08em}
.hands__lead{max-width:30em;font-size:18px}
.hands__list{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,48px)}
.hand:nth-child(2){margin-top:clamp(40px,7vw,120px)}
.hand:nth-child(3){margin-top:clamp(20px,3.5vw,60px)}
.hand__ph{aspect-ratio:1;overflow:hidden;background:var(--sumi);margin-bottom:22px}
.hand__ph img{width:100%;height:100%;object-fit:cover}
.hand__role{font-family:var(--gothic);font-weight:700;font-size:14px;letter-spacing:.12em;color:var(--hai);margin-bottom:4px}
.hand__name{font-size:clamp(28px,2.6vw,38px);font-weight:500;margin-bottom:10px}
.hand__txt{font-size:16.5px;line-height:1.95;max-width:22em}
.hands__more{max-width:var(--max);margin:clamp(40px,5vw,64px) auto 0;text-align:right}

/* =========================================================
   TOP：トリートメント（写真の全面見開き＋重なるカード）
   ========================================================= */
.spread{position:relative;background:var(--sumi);color:var(--kinari);min-height:min(92vh,960px);display:grid;align-items:end}
.spread__ph{position:absolute;inset:0;overflow:hidden}
.spread__ph img{width:100%;height:120%;object-fit:cover;object-position:40% 40%;will-change:transform}
.spread__ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(31,27,24,0) 35%,rgba(31,27,24,.9) 100%),linear-gradient(90deg,rgba(31,27,24,0) 45%,rgba(31,27,24,.55))}
.spread__card{position:relative;margin:0 var(--gut) clamp(56px,7vw,96px) auto;max-width:560px;padding-left:28px;border-left:2px solid var(--kin)}
.spread__kicker{font-family:var(--gothic);font-weight:700;font-size:14px;letter-spacing:.12em;color:var(--usuzumi);margin-bottom:10px}
.spread__t{font-size:clamp(30px,3.4vw,50px);font-weight:500;line-height:1.45;margin-bottom:24px}
.spread__card p{font-size:17px}

/* =========================================================
   TOP：主な料金（墨面）
   ========================================================= */
.price{background:var(--sumi);color:var(--kinari);padding:clamp(96px,11vw,160px) var(--gut)}
.price__in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:40px clamp(40px,6vw,96px)}
.price__t{font-size:clamp(40px,4.6vw,68px);font-weight:500;margin-bottom:18px}
.price__head p{color:var(--usuzumi);font-size:16px}
.price .plist{border-color:rgba(239,232,219,.2)}
.price .plist li{border-color:rgba(239,232,219,.2)}
.price .plist__n small{color:var(--usuzumi)}
.price__facts{grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,1fr);gap:24px clamp(24px,4vw,56px);margin-top:clamp(24px,4vw,56px);font-size:16px;color:var(--usuzumi)}
.price__facts strong{display:block;color:var(--kinari);font-weight:600;font-size:18px;margin-bottom:8px}
.price__more{grid-column:1 / -1;text-align:right}

/* 料金表（共通） */
.plist{border-top:1px solid rgba(31,27,24,.22)}
.plist li{display:grid;grid-template-columns:1fr auto;gap:2px 24px;align-items:baseline;padding:16px 0;border-bottom:1px solid rgba(31,27,24,.22)}
.plist__n{font-size:18px;font-weight:600}
.plist__n small{display:block;font-family:var(--gothic);font-weight:500;font-size:14px;color:var(--hai);letter-spacing:.06em}
.plist__p{font-size:20px;font-weight:600;letter-spacing:.02em;font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.plist__p small{font-size:.75em;margin-left:.1em}
.plist__d{grid-column:1 / -1;font-size:15.5px;line-height:1.8;color:var(--hai)}
.plist--big .plist__n{font-size:clamp(19px,1.7vw,23px)}
.plist--big .plist__p{font-size:clamp(22px,2vw,28px)}

/* =========================================================
   TOP：お知らせ・アクセス
   ========================================================= */
.news-top{max-width:var(--max);margin:0 auto;padding:clamp(96px,10vw,150px) var(--gut) clamp(40px,5vw,72px);display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:24px clamp(40px,6vw,96px)}
.news-top__t{font-size:clamp(28px,2.6vw,38px);font-weight:500}
.news-top > p{grid-column:2;text-align:right}
.nlist{border-top:1px solid rgba(31,27,24,.22)}
.nlist li{border-bottom:1px solid rgba(31,27,24,.22)}
.nlist a{display:grid;grid-template-columns:8em 1fr;gap:16px;padding:20px 0;text-decoration:none;font-size:17px}
.nlist a:hover span{text-decoration:underline;text-decoration-color:var(--kin)}
.nlist time{font-family:var(--gothic);font-weight:500;font-size:15px;color:var(--hai);padding-top:.15em}

.access{max-width:var(--max);margin:0 auto;padding:clamp(40px,6vw,96px) var(--gut) clamp(110px,12vw,180px);display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:40px clamp(40px,6vw,96px);align-items:center}
.access__ph{aspect-ratio:3/4;overflow:hidden;background:var(--sumi)}
.access__ph img{width:100%;height:100%;object-fit:cover}
.access__t{font-size:clamp(40px,5vw,76px);font-weight:500;line-height:1.25;margin-bottom:36px}
.access__links{display:flex;flex-wrap:wrap;gap:8px 32px;margin-top:28px}

/* 定義リスト（共通） */
.dl{display:grid;border-top:1px solid rgba(31,27,24,.22)}
.dl > div{display:grid;grid-template-columns:7em 1fr;gap:16px;padding:16px 0;border-bottom:1px solid rgba(31,27,24,.22)}
.dl dt{font-family:var(--gothic);font-weight:700;font-size:15px;letter-spacing:.08em;color:var(--hai);padding-top:.2em}
.dl dd{font-size:17px;line-height:1.85}

/* =========================================================
   予約帯（全ページ共通）
   ========================================================= */
.reserve{background:var(--sumi);color:var(--kinari);padding:clamp(88px,10vw,140px) var(--gut);border-bottom:1px solid rgba(239,232,219,.12)}
.reserve__in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px clamp(32px,5vw,80px);align-items:center}
.reserve__illust{width:clamp(110px,10vw,150px);height:auto;margin-bottom:24px}
.reserve__t{font-size:clamp(32px,3.6vw,54px);font-weight:500;line-height:1.35;margin-bottom:20px}
.reserve__text p{color:var(--usuzumi);font-size:16px;max-width:30em}
.reserve__act{display:grid;gap:18px;justify-items:start}
.reserve__act .btn-line{min-width:290px}
.reserve__tel{display:flex;align-items:baseline;gap:14px;text-decoration:none;font-family:var(--gothic);font-weight:700;font-size:clamp(28px,2.6vw,36px);letter-spacing:.04em;line-height:1.2}
.reserve__tel span{font-size:14px;font-weight:500;color:var(--usuzumi);letter-spacing:.1em}
.reserve__hours{font-size:15px;color:var(--usuzumi);line-height:1.8}

/* =========================================================
   フッター
   ========================================================= */
.ft{background:var(--sumi);color:var(--kinari);padding:clamp(64px,7vw,96px) var(--gut) 32px}
.ft__in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:minmax(0,3fr) minmax(0,5fr) minmax(0,4fr);gap:40px}
.ft__sign img{width:150px}
.ft__sign p{margin-top:10px;color:var(--usuzumi);font-size:15px}
.ft__name{font-weight:600;font-size:18px;margin-bottom:6px}
.ft__nap{font-size:16px;line-height:1.9}
.ft__nap address{margin-bottom:12px}
.ft__nav ul{display:grid;grid-template-columns:1fr 1fr;gap:4px 24px}
.ft__nav a{font-family:var(--gothic);font-weight:500;font-size:15px;text-decoration:none;display:inline-block;padding:6px 0}
.ft__nav a:hover{text-decoration:underline}
.ft__copy{max-width:var(--max);margin:56px auto 0;color:var(--usuzumi);font-family:var(--gothic)}

/* SP固定予約バー */
.spbar{display:none}

/* =========================================================
   下層：ページ見出し
   ========================================================= */
.crumb ol{display:flex;flex-wrap:wrap;gap:4px 0;font-family:var(--gothic);font-size:14px;letter-spacing:.06em}
.crumb li:not(:last-child)::after{content:"／";margin:0 .5em;opacity:.6}
.crumb a{text-decoration:none}
.crumb a:hover{text-decoration:underline}

/* 写真を背にした見出し（menu / treatment / salon） */
.phead{position:relative;background:var(--sumi);color:var(--kinari);overflow:hidden}
.phead__ph{position:absolute;inset:0}
.phead__ph img{width:100%;height:100%;object-fit:cover}
.phead__ph::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(31,27,24,.88) 0,rgba(31,27,24,.55) 45%,rgba(31,27,24,.1) 100%)}
.phead__in{position:relative;max-width:var(--max);margin:0 auto;padding:calc(var(--hd) + 40px) var(--gut) 72px}
.phead .crumb{color:var(--usuzumi);margin-bottom:clamp(48px,7vw,110px)}
.phead__t{font-size:clamp(46px,6.4vw,104px);font-weight:500;line-height:1.2;letter-spacing:.04em;margin-bottom:28px}
.phead__lead{font-size:clamp(17px,1.4vw,20px);max-width:30em;line-height:1.9}
.phead--band .phead__ph img{object-position:50% 50%}
.phead--full{min-height:min(100svh,980px);display:flex;align-items:flex-end}
.phead--full .phead__in{width:100%}
.phead--full .phead__ph img{height:115%;object-position:60% 30%}
.phead--full .phead__ph::after{background:linear-gradient(90deg,rgba(31,27,24,.9) 0,rgba(31,27,24,.5) 42%,rgba(31,27,24,0) 70%),linear-gradient(0deg,rgba(31,27,24,.6),rgba(31,27,24,0) 40%)}
.phead--salon{min-height:min(88svh,880px);display:flex;align-items:flex-end}
.phead--salon .phead__in{width:100%}

/* 文字の見出し（staff / news / policy） */
.shead{max-width:var(--max);margin:0 auto;padding:calc(var(--hd) + 40px) var(--gut) clamp(48px,6vw,80px)}
.shead .crumb{color:var(--hai);margin-bottom:clamp(40px,6vw,96px)}
.shead__t{font-size:clamp(52px,8.2vw,136px);font-weight:500;line-height:1.15;letter-spacing:.04em;margin-bottom:32px}
.shead__lead{font-size:clamp(17px,1.4vw,20px);line-height:1.95;max-width:34em}
.shead--simple .shead__t{font-size:clamp(40px,5vw,72px)}

/* =========================================================
   MENU
   ========================================================= */
.mcats{position:sticky;top:var(--hd);z-index:50;background:var(--kinari);border-bottom:1px solid rgba(31,27,24,.16)}
.mcats ul{max-width:var(--max);margin:0 auto;padding:0 var(--gut);display:flex;gap:4px 28px;overflow-x:auto;scrollbar-width:none}
.mcats ul::-webkit-scrollbar{display:none}
.mcats a{display:block;white-space:nowrap;padding:16px 0;font-family:var(--gothic);font-weight:500;font-size:15.5px;text-decoration:none;border-bottom:2px solid transparent}
.mcats a:hover,.mcats a.is-on{border-bottom-color:var(--kin)}
.mwrap{max-width:var(--max);margin:0 auto;padding:clamp(56px,7vw,100px) var(--gut) clamp(100px,10vw,150px)}
.mintro{display:grid;grid-template-columns:repeat(3,1fr);gap:20px 40px;margin-bottom:clamp(64px,8vw,120px);font-size:16.5px;line-height:1.9}
.mintro li{padding-top:16px;border-top:2px solid var(--sumi)}
.mblock{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:24px clamp(40px,6vw,96px);padding:clamp(48px,6vw,80px) 0;border-top:1px solid rgba(31,27,24,.22)}
.mblock__t{font-size:clamp(30px,3vw,46px);font-weight:500;line-height:1.2;position:sticky;top:calc(var(--hd) + 90px);align-self:start}
.mh3{font-family:var(--gothic);font-weight:700;font-size:15px;letter-spacing:.12em;color:var(--hai);margin:40px 0 4px}
.mh3:first-child{margin-top:0}
.mh4{font-size:19px;font-weight:700;margin:40px 0 10px}
.mlead{font-size:16.5px;margin:12px 0 16px}
.note{font-size:15px;color:var(--hai);line-height:1.85;margin-top:16px}
.explain{margin-top:32px;padding:24px 28px;background:var(--kami)}
.explain h3{font-size:18px;font-weight:700;margin-bottom:8px}
.explain p{font-size:16.5px;line-height:1.95}
.mmore{margin-top:24px}
.mshave{display:grid;grid-template-columns:1fr 240px;gap:40px;align-items:start}
.mshave__ph img{aspect-ratio:1;object-fit:cover;width:100%}
.mshave__ph figcaption{font-size:14.5px;color:var(--hai);margin-top:10px;line-height:1.7}
.mshave__ph{margin:0}
.aging__t{font-size:clamp(21px,1.8vw,25px);font-weight:700;margin-bottom:16px;line-height:1.6}
.aging__pts{margin:20px 0 0;display:grid;gap:6px}
.aging__pts li{padding-left:1.4em;position:relative;font-size:16.5px}
.aging__pts li::before{content:"";position:absolute;left:.2em;top:.95em;width:.55em;height:2px;background:var(--kin)}

/* =========================================================
   TREATMENT
   ========================================================= */
.essay{max-width:var(--max);margin:0 auto;padding:clamp(110px,13vw,200px) var(--gut);display:grid;grid-template-columns:repeat(12,1fr);gap:40px 24px}
.essay__t{grid-column:1 / span 6;font-size:clamp(36px,4.6vw,70px);font-weight:500;line-height:1.35}
.essay__body{grid-column:7 / span 5;font-size:18px;line-height:2.15;padding-top:.6em}

.three{background:var(--kami);padding:clamp(96px,11vw,160px) var(--gut)}
.three__t{max-width:var(--max);margin:0 auto clamp(56px,7vw,96px);font-size:clamp(34px,4vw,60px);font-weight:500;line-height:1.35}
.three__list{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:48px clamp(28px,4vw,64px)}
.three__n{display:block;font-size:clamp(72px,7vw,112px);font-weight:500;line-height:1;color:var(--kin);margin-bottom:20px}
.three__list h3{font-size:22px;font-weight:700;margin-bottom:14px}
.three__list p{font-size:16.5px;line-height:2}

.check{background:var(--sumi);color:var(--kinari);padding:clamp(96px,11vw,160px) var(--gut)}
.check__in{max-width:var(--max);margin:0 auto}
.check__t{font-size:clamp(34px,4vw,60px);font-weight:500;line-height:1.35;margin-bottom:48px}
.check__tags{display:flex;flex-wrap:wrap;gap:12px 14px;margin-bottom:40px;max-width:980px}
.check__tags li{border:1px solid rgba(239,232,219,.35);border-radius:999px;padding:8px 22px;font-size:clamp(17px,1.5vw,21px)}
.check__lead{font-size:18px;margin-bottom:56px;max-width:34em}
.prepost{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid rgba(239,232,219,.22)}
.prepost > div{padding:40px clamp(0px,3vw,48px) 0 0}
.prepost > div + div{padding-left:clamp(24px,3vw,48px);border-left:1px solid rgba(239,232,219,.22)}
.prepost h3{font-size:clamp(26px,2.4vw,34px);font-weight:500;margin-bottom:14px}
.prepost p{color:var(--usuzumi);font-size:16.5px;line-height:2}

.about{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;gap:0}
.about__ph{aspect-ratio:1;overflow:hidden;background:var(--sumi)}
.about__ph img{width:100%;height:100%;object-fit:cover}
.about__body{padding:clamp(56px,7vw,120px) var(--gut);max-width:680px}
.about__t{font-size:clamp(30px,3.4vw,50px);font-weight:500;line-height:1.4;margin-bottom:32px}
.about__body p{font-size:17px;line-height:2.1}

.home{max-width:var(--max);margin:0 auto;padding:clamp(110px,13vw,200px) var(--gut);display:grid;grid-template-columns:repeat(12,1fr);gap:40px 24px}
.home__t{grid-column:2 / span 10;font-size:clamp(34px,4.4vw,66px);font-weight:500;line-height:1.35;text-align:center;margin-bottom:clamp(24px,4vw,56px)}
.home__body{grid-column:3 / span 8;font-size:17.5px;line-height:2.15}

.flow{background:var(--sumi);color:var(--kinari);padding:clamp(96px,11vw,160px) var(--gut)}
.flow__in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px clamp(40px,6vw,96px)}
.flow__t{font-size:clamp(36px,4vw,60px);font-weight:500;margin-bottom:20px}
.flow__lead{color:var(--usuzumi);font-size:16.5px}
.flow__list{grid-column:2;grid-row:1 / span 2;counter-reset:f}
.flow__list li{display:grid;grid-template-columns:3.2em 1fr;align-items:baseline;padding:14px 0;border-bottom:1px solid rgba(239,232,219,.18);font-size:18px}
.flow__n{font-family:var(--gothic);font-weight:700;font-size:15px;color:var(--kin)}
.flow__note{grid-column:1;align-self:end;border-left:2px solid var(--kin);padding-left:24px}
.flow__note h3{font-size:19px;font-weight:700;margin-bottom:10px}
.flow__note p{color:var(--usuzumi);font-size:16px;line-height:1.95}

/* =========================================================
   STAFF
   ========================================================= */
.trio{max-width:var(--max);margin:0 auto;padding:0 var(--gut) clamp(96px,10vw,150px);display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,36px)}
.trio a{display:block;text-decoration:none}
.trio img{aspect-ratio:4/5;width:100%;object-fit:cover;background:var(--sumi);transition:filter .5s}
.trio a:hover img{filter:brightness(1.06)}
.trio__n{display:block;font-size:clamp(28px,2.8vw,42px);font-weight:500;margin-top:20px;line-height:1.3}
.trio__r{display:block;font-family:var(--gothic);font-weight:500;font-size:15px;color:var(--hai);letter-spacing:.08em}
.trio li:nth-child(2){margin-top:clamp(32px,5vw,80px)}

.person{display:grid;align-items:center}
.person__name{font-size:clamp(48px,6vw,96px);font-weight:500;line-height:1.1;margin-bottom:28px;letter-spacing:.06em}
.person__q{font-size:clamp(21px,2vw,28px);font-weight:600;line-height:1.75;margin-bottom:24px}
.person__body p:not(.person__q){font-size:17px;line-height:2.05}
.person__ph{overflow:hidden;background:var(--sumi)}
.person__ph img{width:100%;height:100%;object-fit:cover}
.person--master{background:var(--sumi);color:var(--kinari);grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.person--master .person__ph{aspect-ratio:3/2}
.person--master .person__body{padding:clamp(48px,6vw,96px) var(--gut)}
.person--master .person__body p:not(.person__q){color:var(--usuzumi)}
.person--mama{grid-template-columns:minmax(0,5fr) minmax(0,6fr);max-width:var(--max);margin:0 auto;padding:clamp(110px,12vw,180px) var(--gut);gap:clamp(40px,6vw,96px)}
.person--mama .person__ph{aspect-ratio:4/3}
.person--kenji{position:relative;background:var(--sumi);color:var(--kinari);min-height:min(88vh,900px);align-items:end}
.person--kenji .person__ph{position:absolute;inset:0}
.person--kenji .person__ph img{height:115%;object-position:50% 30%}
.person--kenji .person__ph::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(31,27,24,0) 30%,rgba(31,27,24,.85) 75%),linear-gradient(0deg,rgba(31,27,24,.6),rgba(31,27,24,0) 50%)}
.person--kenji .person__body{position:relative;max-width:520px;margin:0 var(--gut) clamp(56px,7vw,100px) auto}
.person--kenji .person__body p:not(.person__q){color:var(--usuzumi)}

/* =========================================================
   SALON
   ========================================================= */
.gallery{max-width:var(--max);margin:0 auto;padding:clamp(80px,9vw,140px) var(--gut);display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(20px,3vw,40px) clamp(16px,2vw,28px)}
.gallery figure{margin:0}
.gallery img{width:100%;object-fit:cover;background:var(--sumi)}
.gallery figcaption{font-size:15px;color:var(--hai);margin-top:10px}
.g1{grid-column:1 / span 8}
.g1 img{aspect-ratio:3/2}
.g2{grid-column:9 / span 4;align-self:end}
.g2 img{aspect-ratio:3/5}
.g3{grid-column:2 / span 5}
.g3 img{aspect-ratio:3/2}
.g4{grid-column:7 / span 6;margin-top:clamp(40px,8vw,120px) !important}
.g4 img{aspect-ratio:3/2}
.info{max-width:var(--max);margin:0 auto;padding:0 var(--gut) clamp(96px,10vw,150px);display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:24px clamp(40px,6vw,96px)}
.info__t{font-size:clamp(34px,3.8vw,56px);font-weight:500}
.route{background:var(--sumi);color:var(--kinari);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.route__text{padding:clamp(72px,8vw,120px) var(--gut)}
.route__t{font-size:clamp(40px,4.6vw,72px);font-weight:500;line-height:1.25;margin-bottom:40px}
.route__list{border-top:1px solid rgba(239,232,219,.2);margin-bottom:24px}
.route__list li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid rgba(239,232,219,.2);font-size:17px}
.route__list span{color:var(--usuzumi)}
.route__map{position:relative;min-height:440px;background:var(--sumi-2)}
.route__fallback{position:absolute;inset:0;display:grid;place-content:center;gap:8px;text-align:center;color:var(--usuzumi);font-size:15px;padding:24px}
.route__map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.6) contrast(1.05)}

/* =========================================================
   NEWS / POLICY / 404
   ========================================================= */
.posts{max-width:880px;margin:0 auto;padding:0 var(--gut) clamp(96px,10vw,150px)}
.post{padding:40px 0;border-top:1px solid rgba(31,27,24,.22);scroll-margin-top:calc(var(--hd) + 20px)}
.post time{font-family:var(--gothic);font-weight:500;font-size:15px;color:var(--hai)}
.post h2{font-size:clamp(24px,2.4vw,32px);font-weight:500;margin:6px 0 20px}
.post__body{white-space:pre-line;font-size:17px;line-height:2.05}
.post__img{margin-top:24px}
.post.is-target{background:linear-gradient(90deg,var(--kami),transparent);padding-left:20px}
.doc{max-width:820px;margin:0 auto;padding:0 var(--gut) clamp(96px,10vw,150px);font-size:17px}
.doc h2{font-size:21px;font-weight:700;margin:48px 0 12px}
.doc ul{margin:0 0 1em;display:grid;gap:4px}
.doc li{padding-left:1.3em;position:relative}
.doc li::before{content:"";position:absolute;left:.15em;top:.95em;width:.5em;height:2px;background:var(--kin)}
.doc__date{margin-top:48px;color:var(--hai);font-size:15px}
.nf{min-height:80vh;display:grid;place-content:center;justify-items:center;text-align:center;padding:calc(var(--hd) + 60px) var(--gut) 100px}
.nf__illust{width:200px;margin-bottom:32px}
.nf__t{font-size:clamp(30px,3.6vw,48px);font-weight:500;line-height:1.45;margin-bottom:24px}
.nf__act{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 32px;margin-top:24px}

/* =========================================================
   スクロール演出（控えめに）
   ========================================================= */
/* clip-path は監視対象の子要素にかける（対象自体にかけるとChromeのIntersectionObserverが発火しない） */
.js [data-mask] > *{display:block;clip-path:inset(100% 0 0 0);transition:clip-path 1.3s var(--ease)}
.js [data-mask] img{transform:scale(1.08);transition:transform 1.6s var(--ease)}
.js [data-mask].is-in > *{clip-path:inset(0 0 0 0)}
.js [data-mask].is-in img{transform:none}
.js [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity 1s ease,transform 1s var(--ease)}
.js [data-reveal].is-in{opacity:1;transform:none}

/* =========================================================
   レスポンシブ
   ========================================================= */
@media (max-width:1180px){
  .hd__tel{display:none}
  .hd__nav a{font-size:14px;letter-spacing:.05em}
  .hd__cta,.hd__cta a{white-space:nowrap}
  .hd__tel-l{display:none}
  .hd__nav ul{gap:18px}
}
@media (max-width:1023px){
  :root{--hd:64px}
  .hd{gap:12px}
  .hd__brand,.hd__logo img{width:92px}
  .hd__tel{display:none}
  .hd__toggle{
    display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 4px 0 8px;margin-left:4px;
    background:none;border:0;color:inherit;font-family:var(--gothic);font-weight:700;font-size:14px;letter-spacing:.08em;cursor:pointer;
  }
  .hd__bars{display:grid;gap:7px;width:24px}
  .hd__bars i{display:block;height:2px;background:currentColor;border-radius:2px;transition:transform .35s var(--ease)}
  .hd__toggle[aria-expanded="true"] .hd__bars i:first-child{transform:translateY(4.5px) rotate(20deg)}
  .hd__toggle[aria-expanded="true"] .hd__bars i:last-child{transform:translateY(-4.5px) rotate(-20deg)}
  .hd__cta{margin-left:auto}
  .hd__nav{
    position:fixed;inset:var(--hd) 0 0;background:var(--sumi);color:var(--kinari);margin:0;
    padding:32px var(--gut) 120px;overflow-y:auto;
    opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s;
  }
  .hd__nav.is-open{opacity:1;visibility:visible}
  .hd__nav ul{flex-direction:column;gap:0}
  .hd__nav li{border-bottom:1px solid rgba(239,232,219,.16)}
  .hd__nav a{display:block;font-family:var(--mincho);font-weight:600;font-size:26px;padding:18px 0;letter-spacing:.08em}
  .hd__nav a[aria-current="page"]::after,.hd__nav a:hover::after{display:none}
  .hd__nav a[aria-current="page"]{color:var(--kin)}
  .hd__navfoot{display:grid;gap:12px;margin-top:32px}
  .hd__navfoot a{width:100%}
  body.nav-open{overflow:hidden}
  body.nav-open .hd{background:var(--sumi);color:var(--kinari);border-color:transparent}
  body.nav-open .hd .hd__logo--light img{opacity:1}
  body.nav-open .hd .hd__logo--dark img{opacity:0}

  .hero{min-height:max(620px,100svh)}
  .hero__copy{font-size:clamp(28px,7.6vw,40px);right:var(--gut);top:calc(var(--hd) + 32px)}
  .hero__foot{grid-template-columns:1fr;bottom:calc(32px + 68px)}
  .hero__prog{left:var(--gut);right:auto;bottom:calc(32px + 68px);width:120px}
  .hero__info{grid-column:1;grid-row:auto;border-left:0;padding-left:0;border-top:1px solid rgba(239,232,219,.3);padding-top:12px;margin-top:10px}
  .hero__en{font-size:24px;margin-bottom:12px}
  .hero__photo::after{background:linear-gradient(180deg,rgba(31,27,24,.5) 0,rgba(31,27,24,0) 20%),linear-gradient(0deg,rgba(31,27,24,.92) 0,rgba(31,27,24,.7) 40%,rgba(31,27,24,0) 68%)}
  .greet__t{grid-column:1 / -1}
  .greet__body{grid-column:1 / -1;max-width:36em}
  .greet__note{grid-column:1 / -1;margin-top:48px;max-width:30em}

  .hands__head{grid-template-columns:1fr}
  .hands__list{grid-template-columns:1fr;gap:56px}
  .hand{display:grid;grid-template-columns:44% 1fr;gap:0 20px;align-items:start;margin:0 !important}
  .hand__ph{grid-row:1 / span 3;margin:0}
  .hand:nth-child(2){grid-template-columns:1fr 44%}
  .hand:nth-child(2) .hand__ph{grid-column:2}
  .hand:nth-child(2) > :not(.hand__ph){grid-column:1}
  .hand__role{align-self:end}

  .price__in{grid-template-columns:1fr}
  .price__facts{grid-template-columns:1fr}
  .news-top{grid-template-columns:1fr}
  .news-top > p{grid-column:1}
  .access{grid-template-columns:1fr}
  .access__ph{aspect-ratio:16/10;order:2}
  .reserve__in{grid-template-columns:1fr}
  .reserve__illust{width:120px}
  .ft__in{grid-template-columns:1fr 1fr}
  .ft__sign{grid-column:1 / -1}

  .mintro{grid-template-columns:1fr}
  .mblock{grid-template-columns:1fr}
  .mblock__t{position:static}
  .essay,.home{grid-template-columns:1fr}
  .essay__t,.essay__body,.home__t,.home__body{grid-column:1}
  .home__t{text-align:left}
  .three__list{grid-template-columns:1fr}
  .flow__in{grid-template-columns:1fr}
  .flow__list{grid-column:1;grid-row:auto}
  .about{grid-template-columns:1fr}
  .about__ph{aspect-ratio:4/3}
  .trio{grid-template-columns:repeat(3,1fr)}
  .person--master,.person--mama{grid-template-columns:1fr}
  .person--mama .person__ph{order:-1}
  .info{grid-template-columns:1fr}
  .route{grid-template-columns:1fr}
  .route__map{min-height:360px}
  .gallery{grid-template-columns:repeat(6,1fr)}
  .g1{grid-column:1 / -1}
  .g2{grid-column:1 / span 3}
  .g3{grid-column:4 / span 3;align-self:end}
  .g4{grid-column:1 / -1;margin-top:0 !important}
}
@media (max-width:640px){
  .hero__foot{right:calc(var(--gut) + 2.6em)}
  .hero__copy{font-size:clamp(26px,7vw,36px)}
  body{font-size:16px;line-height:1.95;padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  .hd .btn-line--sm{display:none}
  .spbar{
    display:grid;grid-template-columns:2fr 3fr;position:fixed;inset:auto 0 0;z-index:120;
    padding:8px 8px calc(8px + env(safe-area-inset-bottom));gap:8px;background:rgba(31,27,24,.97);
  }
  .spbar a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;border-radius:6px;font-family:var(--gothic);font-weight:700;font-size:16px;text-decoration:none;letter-spacing:.04em}
  .spbar__tel{border:1px solid rgba(239,232,219,.5);color:var(--kinari)}
  .spbar__tel svg{width:20px;height:20px}
  .spbar__line{background:var(--line);color:#fff}
  .spbar__line::before{content:"";width:19px;height:18px;background:#fff;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M12 0C5.4 0 0 4.3 0 9.6c0 4.8 4.2 8.8 10 9.5.4.1.9.3 1 .6.1.3.1.8 0 1.1l-.2 1c0 .3-.2 1.2 1.1.6 1.3-.5 7-4.1 9.5-7C23.2 13.6 24 11.7 24 9.6 24 4.3 18.6 0 12 0z'/%3E%3C/svg%3E") no-repeat center/contain;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M12 0C5.4 0 0 4.3 0 9.6c0 4.8 4.2 8.8 10 9.5.4.1.9.3 1 .6.1.3.1.8 0 1.1l-.2 1c0 .3-.2 1.2 1.1.6 1.3-.5 7-4.1 9.5-7C23.2 13.6 24 11.7 24 9.6 24 4.3 18.6 0 12 0z'/%3E%3C/svg%3E") no-repeat center/contain}
  .greet__body,.essay__body,.home__body{font-size:16.5px}
  .hands__lead{font-size:16.5px}
  .hand{grid-template-columns:42% 1fr}
  .hand:nth-child(2){grid-template-columns:1fr 42%}
  .hand__txt{font-size:15.5px;grid-column:1 / -1 !important;margin-top:14px}
  .hand__ph{grid-row:1 / span 2}
  .hand__name{margin-bottom:0}
  .plist__n{font-size:17px}
  .plist__p{font-size:18px}
  .nlist a{grid-template-columns:1fr;gap:2px}
  .dl > div{grid-template-columns:1fr;gap:2px}
  .reserve__act{justify-items:stretch}
  .reserve__act .btn-line{min-width:0}
  .ft__in{grid-template-columns:1fr}
  .mshave{grid-template-columns:1fr}
  .mshave__ph{max-width:260px}
  .explain{padding:20px}
  .trio{grid-template-columns:repeat(3,1fr);gap:10px}
  .trio li:nth-child(2){margin-top:32px}
  .trio__n{font-size:19px;margin-top:10px;letter-spacing:.02em}
  .trio__r{font-size:13px;letter-spacing:0;line-height:1.6}
  .shead__t{font-size:clamp(44px,12vw,60px)}
  .prepost{grid-template-columns:1fr}
  .prepost > div + div{padding-left:0;border-left:0;border-top:1px solid rgba(239,232,219,.22);margin-top:40px}
  .person--kenji{min-height:0;display:block}
  .person--kenji .person__ph{position:relative;aspect-ratio:4/3}
  .person--kenji .person__ph img{height:100%}
  .person--kenji .person__ph::after{background:linear-gradient(0deg,var(--sumi),rgba(31,27,24,0) 40%)}
  .person--kenji .person__body{margin:0;padding:24px var(--gut) 72px}
  .spread{min-height:0;display:block}
  .spread__ph{position:relative;aspect-ratio:4/3}
  .spread__ph img{height:100%}
  .spread__ph::after{background:linear-gradient(0deg,var(--sumi),rgba(31,27,24,0) 45%)}
  .spread__card{margin:0;padding:8px var(--gut) 72px;border:0;max-width:none}
  .route__list li{flex-direction:column;gap:0}
  .gallery{gap:24px 12px}
  .phead--band .phead__ph::after{background:rgba(31,27,24,.7)}
  .phead--full .phead__ph::after,.phead--salon .phead__ph::after{background:linear-gradient(0deg,rgba(31,27,24,.92) 0,rgba(31,27,24,.55) 55%,rgba(31,27,24,.3) 100%)}
  .phead--full{min-height:86svh}
}

/* 動きを減らす設定 */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}
  .js .hero__copy .ch{opacity:1;filter:none}
  .js [data-mask] > *,.js [data-reveal]{clip-path:none;opacity:1;transform:none}
  .js [data-mask] img{transform:none}
  [data-parallax] img{transform:none !important}
}
@media print{
  .hd,.spbar,.reserve,.mcats{display:none}
  body{padding:0}
}

/* =========================================================
   英字見出し（Cormorant Garamond イタリック）＋和文サブ
   置き方はセクションごとに変える：big / side / label / over / name
   ========================================================= */
.ttl{display:block;font-weight:500;letter-spacing:.08em}
.ttl__en{display:block;font-family:var(--serif-en);font-style:italic;font-weight:400;letter-spacing:.005em;line-height:1}
.ttl__ja{display:block;font-family:var(--mincho);font-weight:500;font-size:16px;letter-spacing:.14em;line-height:1.6}
/* big：左寄せの大きな英字、下に小さく和文 */
.ttl--big .ttl__en{font-size:clamp(56px,6.6vw,104px);margin-bottom:14px}
/* side：英字の右に和文を縦に添える */
.ttl--side{display:flex;align-items:flex-start;gap:18px}
.ttl--side .ttl__en{font-size:clamp(60px,7.4vw,118px)}
.ttl--side .ttl__ja{writing-mode:vertical-rl;font-size:17px;padding-top:.6em;letter-spacing:.3em}
/* label：小さな英字ラベル＋和文がやや大きい */
.ttl--label .ttl__en{font-size:clamp(26px,2.2vw,32px);margin-bottom:8px;color:var(--kin)}
.ttl--label .ttl__ja{font-size:clamp(22px,2vw,28px);letter-spacing:.1em;line-height:1.5}
/* over：写真に重ねるページタイトル */
.ttl--over .ttl__en{font-size:clamp(60px,7.6vw,124px);margin-bottom:16px}
.ttl--over .ttl__ja{font-size:clamp(17px,1.4vw,20px)}
/* name：スタッフ名 */
.ttl--name .ttl__en{font-size:clamp(64px,7vw,112px);margin-bottom:10px}
.ttl--name .ttl__ja{font-size:clamp(22px,2vw,28px);letter-spacing:.2em}

/* 既存の見出しサイズを打ち消す */
.phead__t,.shead__t,.price__t,.mblock__t,.three__t,.check__t,.flow__t,.info__t,.news-top__t,.reserve__t,.person__name{font-size:inherit;line-height:inherit}
.shead__t{margin-bottom:20px}
.shead__sub{font-size:clamp(22px,2.2vw,30px);margin-bottom:16px;letter-spacing:.1em}
.greet__ttl{grid-column:1 / -1;margin-bottom:clamp(40px,5vw,72px)}
.greet__t{font-weight:400;font-size:clamp(28px,3vw,42px);line-height:1.6}
.greet__body{grid-column:5 / span 5}
.hands__t{margin:0}
.hands__head{align-items:start}
.hands__lead{padding-top:24px}
.spread__en{position:absolute;left:var(--gut);top:calc(var(--hd) + 8px);margin:0;font-family:var(--serif-en);font-style:italic;font-size:clamp(72px,11vw,180px);line-height:1;color:rgba(239,232,219,.92);text-shadow:0 2px 40px rgba(31,27,24,.4)}
.spread__t{font-weight:500;font-size:clamp(26px,2.6vw,38px)}
.price{background:var(--sumi-2)}
.price__t .ttl__en{color:var(--kinari)}
.access__t{font-size:clamp(26px,2.4vw,34px);margin-bottom:28px}
.route__t{font-size:clamp(24px,2.2vw,32px);margin:0 0 32px}
.reserve__t .ttl__en{font-size:clamp(46px,5vw,76px);color:var(--kinari);margin-bottom:14px}
.reserve__t{margin-bottom:20px}
.about__ph{position:relative}
.about__en{position:absolute;z-index:2;left:24px;bottom:12px;margin:0;font-family:var(--serif-en);font-style:italic;font-size:clamp(64px,7vw,112px);line-height:1;color:var(--kinari);text-shadow:0 2px 30px rgba(31,27,24,.5)}
.essay__t,.home__t,.about__t{font-weight:500;font-size:clamp(28px,3.2vw,46px)}
.check__t,.flow__t{margin-bottom:32px}
.three__n{font-weight:400;font-size:clamp(56px,5vw,80px)}
.person__q{font-weight:500;font-size:clamp(19px,1.7vw,24px)}
.trio__en{display:block;font-family:var(--serif-en);font-style:italic;font-size:clamp(34px,3.2vw,48px);line-height:1;margin-top:20px}
.trio__n{font-size:18px;font-weight:500;margin-top:6px;letter-spacing:.14em}
.mblock__t .ttl__en{font-size:clamp(40px,4vw,60px);color:var(--sumi)}
.mblock__t .ttl__ja{font-size:17px;letter-spacing:.14em}
.hand__name{font-weight:500}
.nf__en{font-family:var(--serif-en);font-style:italic;font-size:64px;line-height:1;margin:0 0 12px}
.hd__nav a .en{display:none}
@media (max-width:1023px){
  .greet__body{grid-column:1 / -1}
  .hd__nav a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;font-weight:500;font-size:20px}
  .hd__nav a .en{display:block;order:2;font-family:var(--serif-en);font-style:italic;font-size:28px;color:var(--usuzumi)}
  .hands__lead{padding-top:0}
  .spread__en{top:16px}
}
@media (max-width:640px){
  .ttl--big .ttl__en,.ttl--over .ttl__en{font-size:clamp(48px,14vw,64px)}
  .ttl--side .ttl__en{font-size:clamp(52px,15vw,68px)}
  .ttl--name .ttl__en{font-size:56px}
  .trio__en{font-size:24px;margin-top:10px}
  .trio__n{font-size:15px}
  .spread__en{font-size:56px}
  .about__en{font-size:56px}
  .reserve__t .ttl__en{font-size:48px}
}

@media (max-width:640px) and (max-height:700px){
  .hero__lead{display:none}
  .hero__en{font-size:21px}
}