/* self — production stylesheet
   base reset + site styles */

/* Reset & base */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: "Noto Serif JP", "游明朝", "Yu Mincho", serif;
  font-weight: 300;
  line-height: 1.9;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, picture, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
h1, h2, h3, h4, p { margin: 0; font-weight: inherit; }

/* Reveal animation utility (used by all plans) */
.reveal { opacity: 0; transform: translateY(20px); transition: opacity 1s ease-out, transform 1s ease-out; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }


/* ─────────────────────────────────────────────
   Revised — ambient (Figma監修反映 / 実装版)
   正: Figma「Revised — ambient PC / 1440」(2:2)
       「Revised — ambient SP / 375」(54:2)
   TraceのFV+Ma派生構成に、対角バランス調整・実写真差し替えを反映
   ───────────────────────────────────────────── */

.rv {
  --ink: #3e3a39;
  --gray: #808080;
  --hair: #d9d5d0;
  /* ブランドカラー(オリーブ)。予約ボタンに使用 */
  --olive: #4f533c;
  --olive-dark: #3f4230;
  background: #fff;
  color: var(--ink);
  font-family: "游明朝", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-weight: 300;
  font-size: 13px;
  line-height: 2.2;
  letter-spacing: 0.12em;
  animation: rv-pagein 3s 1 forwards;
  overflow-x: hidden;
}
@keyframes rv-pagein { from { opacity: 0; } to { opacity: 1; } }

.rv a { color: inherit; text-decoration: none; }
.rv figure { margin: 0; }
.rv img { display: block; max-width: 100%; }
.rv h2, .rv h3 { font-weight: 300; margin: 0; }

.rv-garamond { font-family: "EB Garamond", serif; letter-spacing: 0.1em; }

.rv .back-index {
  position: fixed; z-index: 12; right: 16px; top: 14px;
  font-family: "EB Garamond", serif; font-size: 11px;
  letter-spacing: 0.2em; color: var(--gray);
}

/* PCはSNSアイコン (B案) / SPはハンバーガー */
.rv-fv-sns {
  /* 言語切り替え(左上)の下に置く */
  position: absolute; z-index: 10; top: 76px; left: 23px;
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  color: var(--ink);
}
.rv-fv-sns a { display: block; opacity: 0.85; transition: opacity 0.3s; }
.rv-fv-sns a:hover { opacity: 0.5; }

/* 三本線メニュー (SPのみ) */
.rv-nav {
  appearance: none; border: none; background: none; padding: 0; margin: 0;
  cursor: pointer;
  position: fixed; z-index: 60; top: 33px; left: 23px; /* オーバーレイ(50)より上 = 閉じる×を押せる */
  display: none; flex-direction: column; gap: 8px;
}
.rv-nav span {
  display: block; width: 24px; height: 1px; background: var(--ink);
  transition: transform 0.3s, opacity 0.3s;
}
.rv-nav.is-open span:nth-child(1) { transform: translateY(9px) rotate(-45deg); }
.rv-nav.is-open span:nth-child(2) { opacity: 0; }
.rv-nav.is-open span:nth-child(3) { transform: translateY(-9px) rotate(45deg); }

/* 全画面オーバーレイナビ */
.rv-menu-overlay {
  position: fixed; inset: 0; z-index: 50; /* 追従の予約ボタン(40)より前面 */
  display: flex; align-items: center; justify-content: center;
  align-items: safe center; /* 画面より縦に長くなっても上が切れない (非対応ブラウザは上行を使用) */
  overflow-y: auto;
  background: rgba(255, 255, 255, 0.94);
  visibility: hidden; opacity: 0;
  transition: opacity 0.35s, visibility 0.35s;
}
.rv-menu-overlay.is-open { visibility: visible; opacity: 1; }
.rv-menu-overlay ul {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 30px;
  text-align: center;
}
.rv-menu-overlay a {
  font-family: "EB Garamond", serif;
  font-size: 20px; letter-spacing: 0.14em;
  color: var(--ink); text-decoration: none;
  transition: opacity 0.3s;
}
.rv-menu-overlay a:hover { opacity: 0.6; }
.rv-noscroll { overflow: hidden; }

/* 罫線 + EB Garamond 28px の見出し (Figma eyebrow) */
.rv-eyebrow {
  display: flex; align-items: center; gap: 18px;
  font-family: "EB Garamond", serif;
  font-size: 28px; letter-spacing: 0.18em;
  line-height: 2.2;
  color: var(--ink);
}
.rv-eyebrow::before {
  content: ''; display: block; flex: none;
  width: 48px; height: 1px; background: var(--hair);
}

/* 写真・テキストのreveal (Trace方式 / 2s) */
.rv .reveal { opacity: 0; transform: translateY(24px); transition: opacity 2s ease-out, transform 2s ease-out; }
.rv .reveal.is-visible { opacity: 1; transform: translateY(0); }
/* FV写真はフェードのみ (上昇エフェクトなし) */
.rv .rv-fv__photo.reveal { transform: none; transition: opacity 2s ease-out; }
.rv .rv-fv__photo.reveal.is-visible { transform: none; }

/* SPのみ表示する改行 */
.rv .sp-only { display: none; }
.rv .pc-only { display: inline; }
/* 文節の途中で折り返さないための単位 (端末幅が狭い時のみ文節境界で折れる) */
.rv .nw { display: inline-block; }

/* ─── FV: 右寄せ大判 (360..1388/1440) + 左下ロゴ ─── */
.rv-fv { position: relative; }
.rv-fv__photo {
  position: relative;
  margin-left: 25%;
  width: 71.4%;
  aspect-ratio: 1028 / 672;
  overflow: hidden;
}
.rv-fv__slide {
  position: absolute; inset: 0;
  background-position: center; background-size: cover;
  opacity: 0; transition: opacity 2.375s;
}
.rv-fv__slide.is-active { opacity: 1; }
.rv-fv__cap {
  /* 写真左端(25%)から28px+テキスト幅ぶん離して重なりを防ぐ */
  position: absolute; left: calc(25% - 64px); top: 32px;
  margin: 0;
  writing-mode: vertical-rl;
  max-height: 480px;
  font-family: "EB Garamond", serif;
  font-size: 12px; letter-spacing: 0.08em; line-height: 12px;
  color: var(--ink);
}
/* logo.svg は字面ぴったり。旧PNGは周囲に余白を含んでいたため
   同じ見た目になるよう幅と位置を補正 (PNG内の字面比 = 幅67.3% / 左17.5% / 下31.8%) */
.rv-fv__logo {
  position: absolute; left: calc(5.7% + 17px); bottom: 24px;
  width: 67px;
}

/* ─── concept: 左に縦写真 / 右にテキスト / 右下に小写真 ─── */
.rv-concept {
  position: relative;
  margin-top: 16.5vw;
  padding-bottom: 6vw;
}
.rv .rv-concept__photo {
  margin-left: 12.6%;
  width: 37.5%;
}
.rv-concept__photo img { width: 100%; aspect-ratio: 540 / 840; object-fit: cover; }
.rv-concept__txt {
  position: absolute; left: 53.8%; top: 24.4vw;
}
.rv-concept__lead {
  margin: 12px 0 0;
  font-size: 16px; letter-spacing: 0.08em; line-height: 1.5;
}
/* 「ゆるむ、きづく、ととのう」と本文の間に空1行 */
.rv-concept__lead + .rv-concept__lead { margin-top: 1.5em; }
.rv .rv-concept__sub {
  position: absolute; left: 66.8%; top: 45.1vw;
  width: 25%;
}
.rv-concept__sub img { width: 100%; aspect-ratio: 360 / 270; object-fit: cover; }

/* ─── body care / self time 共通 ─── */
.rv-care, .rv-time { margin-top: 300px; }
.rv-care__head { margin-left: 11.25%; }
.rv-care__ttl {
  margin: 4px 0 0;
  font-size: 21px; letter-spacing: 0.3em; line-height: 2.2;
}

/* body care */
.rv .rv-care__kv {
  width: 68%;
  margin: 35px auto 0 0;
}
.rv-care__kv img { width: 100%; aspect-ratio: 980 / 613; object-fit: cover; }
.rv-care__intro {
  margin: 55px 0 0 11.25%;
  max-width: 50%;
  font-size: 13px; line-height: 2.6; letter-spacing: 0.12em;
}
.rv-img img { width: 100%; object-fit: cover; }
.rv .rv-img--care1 { width: 58.3%; margin: 116px 0 0 31.25%; }
.rv-img--care1 img { aspect-ratio: 840 / 540; }
.rv .rv-img--care2 { width: 37.5%; margin: 150px 0 0 14.6%; }
.rv-img--care2 img { aspect-ratio: 540 / 840; }
.rv .rv-img--care3 { width: 48%; margin: 150px 0 0 41.6%; }
.rv-img--care3 img { aspect-ratio: 691 / 461; }
.rv .rv-img--care4 { width: 37.5%; margin: 150px 0 0 33.3%; }
.rv-img--care4 img { aspect-ratio: 540 / 840; }

/* self time */
.rv .rv-time__kv {
  width: 68%;
  margin: 45px 0 0 auto;
}
.rv-time__kv img { width: 100%; aspect-ratio: 980 / 613; object-fit: cover; object-position: center 30%; }
.rv-time__intro {
  margin: 55px 0 0 31.9%;
  max-width: 47.7%;
  font-size: 13px; line-height: 2.6; letter-spacing: 0.12em;
}
.rv-time__band {
  margin: 80px 6.9% 0 6.7%;
  display: flex; align-items: flex-start; gap: 5.4%;
}
.rv-time__band img { width: 100%; object-fit: cover; }
.rv-time__b-wide { width: 41.7%; }
.rv-time__b-wide img { aspect-ratio: 4 / 3; }
.rv-time__b-tall { width: 23.5%; }
.rv-time__b-tall img { aspect-ratio: 3 / 4; }

/* ─── about / reservation 共通 ─── */
.rv-sec { margin-top: 300px; }
.rv-sec__inner { width: min(88%, 680px); margin: 0 auto; }
.rv-sec__inner--narrow { width: min(88%, 680px); margin: 0 auto; }

/* about */
.rv-about {
  margin-top: 34px;
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 14%;
}
.rv-about__block { width: 43%; }
.rv-label { font-size: 15px; letter-spacing: 0.16em; color: var(--ink); }
.rv-staff {
  margin-top: 34px;
  display: flex; gap: 5%;
}
.rv-staff__card { width: 47.5%; margin: 0; }
.rv-staff__photo { aspect-ratio: 3 / 4; overflow: hidden; }
.rv-staff__photo img { width: 100%; height: 100%; object-fit: cover; }
.rv-staff__card figcaption { margin-top: 18px; }
.rv-staff__role { display: block; font-size: 12px; color: var(--gray); letter-spacing: 0.14em; }
.rv-staff__name { display: block; margin-top: 6px; font-size: 13px; letter-spacing: 0.2em; }
.rv-staff__name-en { display: block; margin-top: 5px; font-size: 12px; letter-spacing: 0.1em; color: var(--gray); }
.rv-staff__ig { display: inline-block; margin-top: 14px; color: var(--ink); opacity: 0.85; transition: opacity 0.3s; }
.rv-staff__ig:hover { opacity: 0.5; }
.rv-staff__bio {
  margin: 14px 0 0;
  font-size: 12px; line-height: 2; letter-spacing: 0.08em;
  color: var(--ink);
}

.rv-about__addr {
  margin: 26px 0 0;
  font-size: 14px; line-height: 2.2; letter-spacing: 0.1em;
}
.rv-about__link { margin: 26px 0 0; }
.rv-about__link a {
  font-family: "EB Garamond", serif;
  font-size: 13px; letter-spacing: 0.12em;
  border-bottom: 1px solid var(--hair);
  padding-bottom: 3px;
}

.rv-about__she { margin-top: 20px; width: 66px; mix-blend-mode: multiply; }
.rv-about__body { margin: 20px 0 0; font-size: 13px; line-height: 2.4; }

/* reservation */
.rv-resv__body { margin: 40px 0 0; font-size: 13px; line-height: 2.6; letter-spacing: 0.12em; }
.rv-menu {
  margin-top: 64px;
  border-top: 1px solid var(--hair);
}
.rv-menu__item {
  padding: 32px 0;
  border-bottom: 1px solid var(--hair);
}
.rv-menu__head {
  margin: 0;
  display: flex; align-items: baseline; justify-content: space-between; gap: 24px;
}
.rv-menu__course { font-size: 20px; letter-spacing: 0.08em; }
.rv-menu__course em { font-style: normal; font-size: 17px; margin-left: 8px; }
.rv-menu__price { font-size: 18px; letter-spacing: 0.06em; white-space: nowrap; }
.rv-menu__desc {
  margin: 14px 0 0;
  font-size: 12px; line-height: 2; letter-spacing: 0.08em;
  color: var(--gray);
}
.rv-menu__note {
  margin: 20px 0 0;
  font-size: 11px; letter-spacing: 0.1em; line-height: 2; color: var(--gray);
}

.rv-cta { margin-top: 64px; display: flex; flex-direction: column; gap: 28px; align-items: flex-start; }
.rv-cta__btn { font-size: 13px; letter-spacing: 0.18em; }
.rv-cta__btn span {
  margin-left: 14px;
  font-family: "EB Garamond", serif;
  transition: margin-left 0.4s;
}
.rv-cta__btn:hover span { margin-left: 22px; }

/* footer */
.rv-footer {
  margin-top: 240px;
  padding: 0 0 40px;
  text-align: center;
}
.rv-footer__logo { width: 54px; margin: 15px auto 14px; }
.rv-footer__sns {
  margin-top: 40px;
  display: flex; justify-content: center; gap: 32px;
  color: var(--ink);
}
.rv-footer__sns a { display: block; opacity: 0.85; transition: opacity 0.3s; }
.rv-footer__sns a:hover { opacity: 0.5; }
.rv-footer__copy {
  margin: 40px 0 0;
  font-size: 11px; letter-spacing: 0.24em; color: var(--gray);
}

/* ─── mobile: Figma SP / 375 ─── */
@media screen and (max-width: 767px) {
  /* SPはハンバーガーを使う (SNSアイコンはPCのみ) */
  .rv-fv-sns { display: none; }
  .rv-nav { display: flex; top: 24px; left: 17px; }

  .rv .sp-only { display: inline; }

  /* FV: 右フル寄せ写真 → 下にロゴ。キャプションは写真左に沿う縦組み */
  .rv-fv { padding-bottom: 66px; }
  .rv-fv__photo { margin: 120px 0 0 10.1%; width: 89.9%; aspect-ratio: 337 / 360; }
  /* SPのみ トリミング調整:
     fv02=施術中(右上の顔に寄せる) / fv03=ソファ(右の壁の切れ目を画面外へ) */
  .rv-fv__slide.is-fv02 { background-size: auto 116%; background-position: 70% 12%; }
  /* SPは写真の下・ロゴの右横 (Figma: logo x38/y509 w72, cap x119/y509 fs10 lh12) */
  .rv-fv__cap {
    writing-mode: horizontal-tb;
    left: calc(10.1% + 81px);
    top: calc(96vw + 29px); /* 写真高(89.9vw×360/337)+29px */
    max-height: none;
    font-size: 10px; line-height: 1.2;
  }
  .rv-fv__logo { left: calc(10.1% + 13px); top: calc(96vw + 42px); bottom: auto; width: 48px; }

  /* concept: 左写真 → (重ねず28px空けて)右寄せ小写真 → 右寄せテキスト
     Figma SP: 縦写真 x24/y820/232x361, 小写真 x207/y1209/144x108, eyebrow y1344 */
  .rv-concept { margin-top: 74vw; padding-bottom: 0; display: flex; flex-direction: column; }
  .rv .rv-concept__photo { order: 1; margin-left: 6.4%; width: 61.9%; }
  .rv-concept__photo img { aspect-ratio: 232 / 361; }
  .rv .rv-concept__sub {
    position: static;
    order: 2;
    margin: 28px 6.4% 0 auto;
    width: 38.4%;
  }
  .rv-concept__sub img { aspect-ratio: 144 / 108; }
  .rv-concept__txt {
    position: static;
    order: 3;
    margin: 27px 0 0 6.4%;
    text-align: left;
  }
  .rv-concept__lead { font-size: 13px; }

  .rv-care, .rv-time { margin-top: 180px; }
  .rv-care__head { margin-left: 6.4%; }
  .rv-care__ttl { font-size: 17px; }
  #bodycare .rv-care__ttl { line-height: 165%; }

  .rv .rv-care__kv { width: 92%; margin-top: 37px; }
  .rv-care__kv img { aspect-ratio: 345 / 216; }
  .rv-care__intro { margin: 56px 6.4% 0; max-width: none; font-size: 12px; }

  .rv .rv-img--care1 { width: 92%; margin: 72px 0 0 auto; }
  .rv-img--care1 img { aspect-ratio: 345 / 222; }
  .rv .rv-img--care2 { width: 66%; margin: 56px auto 0 6.4%; }
  .rv .rv-img--care3 { width: 92%; margin: 56px auto 0 0; }
  .rv-img--care3 img { aspect-ratio: 345 / 230; }
  .rv .rv-img--care4 { width: 66%; margin: 56px 6.4% 0 auto; }

  .rv .rv-time__kv { width: 92%; margin: 37px 0 0 auto; }
  .rv-time__kv img { aspect-ratio: 345 / 216; }
  .rv-time__intro { margin: 56px 6.4% 0; max-width: none; font-size: 12px; }

  .rv-time__band { margin: 72px 2.4% 0 4.8%; gap: 2.4%; }
  .rv-time__b-wide { width: 44.9%; }
  .rv-time__b-tall { width: 25%; }

  .rv-sec { margin-top: 180px; }
  .rv-sec__inner { width: 87.2%; margin: 0 auto; }
  .rv-sec__inner--narrow { width: 87.2%; }

  .rv .pc-only { display: none; }

  .rv-about { display: block; }
  .rv-about__block { width: 100%; }
  .rv-about__block + .rv-about__block { margin-top: 62px; }
  /* Figma SP: Staff/Access/Group = 16px, Therapist役職 = 12px */
  .rv-label { font-size: 16px; }
  .rv-staff { margin-top: 23px; gap: 5.7%; }
  .rv-staff__card { width: 47.2%; }
  .rv-staff__name-en { font-size: 11px; }
  .rv-staff__role { font-size: 12px; }
  .rv-staff__name { font-size: 12px; }

  .rv-resv__body { margin-top: 30px; font-size: 12px; }
  .rv-menu { margin-top: 22px; }
  .rv-menu__item { padding: 24px 0; }
  .rv-menu__head { gap: 12px; }
  .rv-menu__course { font-size: 17px; }
  .rv-menu__course em { font-size: 14px; margin-left: 6px; }
  .rv-menu__price { font-size: 15px; }
  .rv-menu__desc { margin-top: 10px; font-size: 11px; line-height: 1.9; }
  .rv-menu__desc br { display: none; }
  .rv-menu__note { font-size: 10px; }
  .rv-cta { margin-top: 52px; gap: 27px; }
  .rv-cta__btn { font-size: 12px; }

  .rv-footer { margin-top: 150px; padding-bottom: 60px; }
  .rv-footer__logo { width: 27px; margin: 8px auto 10px; }
  .rv-footer__sns { margin-top: 36px; }
}


/* ─── タブレット幅の調整 ───
   本文の幅は % 指定(1440px想定)のため、768〜1100px では狭くなりすぎて
   文の途中で折り返してしまう。この範囲だけ右マージン指定に切り替えて幅を確保する。 */
@media screen and (min-width: 768px) and (max-width: 1100px) {
  .rv-time__intro { max-width: none; margin-right: 6%; }
  .rv-care__intro { max-width: none; margin-right: 8%; }
}

/* ─── 追従の予約ボタン ─── */
.rv-float {
  /* bottom は下部の安全領域(ホームインジケーター)ぶんを加算する。
     env() 非対応・不要な環境では 0 になるので通常表示は変わらない。 */
  position: fixed; z-index: 40; right: 28px;
  bottom: calc(28px + env(safe-area-inset-bottom, 0px));
  padding: 15px 24px;
  background: var(--olive); border: 1px solid var(--olive);
  font-size: 12px; letter-spacing: 0.18em; line-height: 1;
  opacity: 0; visibility: hidden; transform: translateY(10px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out, visibility 0.6s, background 0.3s, border-color 0.3s, color 0.3s;
}
.rv-float.is-shown { opacity: 1; visibility: visible; transform: none; }
.rv-float:hover { background: var(--olive-dark); border-color: var(--olive-dark); }
/* 文字色だけは .rv a { color: inherit } に負けるため、a を含めて特異度を上げる */
.rv a.rv-float { color: #fff; }

@media screen and (max-width: 767px) {
  /* SP: ツールバー表示中は20px、スクロールでツールバーが隠れたときは
     env() が効いてホームインジケーターぶん(約34px)を自動で足す */
  .rv-float {
    right: 16px;
    bottom: calc(20px + env(safe-area-inset-bottom, 0px));
    padding: 13px 18px; font-size: 11px; letter-spacing: 0.14em;
  }
}


/* ─────────────────────────────────────────────
   日英切り替え (JP / EN)
   htmlタグの data-lang="ja" | "en" で表示を出し分ける。
   本文は  <span data-lang="ja">日本語</span><span data-lang="en">English</span>
   のように2言語ぶん書いておき、CSSで片方だけを表示する。
   ───────────────────────────────────────────── */
html[data-lang="ja"] [data-lang="en"],
html[data-lang="en"] [data-lang="ja"] { display: none; }

/* 切り替えボタン: PCは左上(SNSアイコンの上) / SPは右上
   文字は小さいままで、paddingで当たり判定だけを 40px 前後に広げている。
   位置指定(top/left)がpaddingぶん内側にずれているのはそのため。 */
.rv-lang {
  position: absolute; z-index: 12; top: 16px; left: 13px;
  display: flex; align-items: center; gap: 0;
  font-family: "EB Garamond", serif;
  font-size: 12px; letter-spacing: 0.16em; line-height: 1;
  transition: opacity 0.3s;
}
.rv-lang__btn {
  appearance: none; -webkit-appearance: none;
  border: 0; background: none; margin: 0;
  padding: 14px 10px;
  font: inherit; letter-spacing: inherit;
  color: var(--gray); transition: color 0.3s;
  -webkit-tap-highlight-color: transparent;
}
/* 選択中は色を濃く + 細い下線 (Google Map > リンクと同じ罫線色) */
.rv-lang__btn > span {
  display: inline-block; padding-bottom: 3px;
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s;
}
.rv-lang__btn:hover { color: var(--ink); }
/* マウス操作では枠を出さず、キーボード操作のときだけ控えめな枠を出す */
.rv-lang__btn:focus { outline: none; }
.rv-lang__btn:focus-visible { outline: 1px solid var(--hair); outline-offset: 2px; }
.rv-lang__btn[aria-pressed="true"] { color: var(--ink); }
.rv-lang__btn[aria-pressed="true"] > span { border-bottom-color: var(--hair); }
.rv-lang__sep { color: var(--hair); }
/* メニューを開いている間は隠す (オーバーレイ越しに透けるのを防ぐ) */
.rv-noscroll .rv-lang { opacity: 0; pointer-events: none; }
.rv-noscroll .rv-float { opacity: 0; visibility: hidden; pointer-events: none; }

/* オーバーレイメニュー内の切り替え (SP) */
/* メニュー内の切り替え: 文字色は本文と同じ ink、サイズを小さくして
   メニュー項目(20px)と区別する。選択中は ink の下線で示す。 */
.rv-menu-overlay__lang {
  margin-top: 4px;
  display: flex; align-items: center; justify-content: center; gap: 0;
  font-family: "EB Garamond", "游明朝", "Yu Mincho", serif;
  font-size: 13px; letter-spacing: 0.18em;
}
.rv-menu-overlay__lang button {
  appearance: none; -webkit-appearance: none;
  border: 0; background: none; margin: 0;
  padding: 14px 16px;
  font: inherit; letter-spacing: inherit;
  color: var(--ink);
  -webkit-tap-highlight-color: transparent;
}
.rv-menu-overlay__lang button > span {
  display: inline-block; padding-bottom: 4px;
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s;
}
.rv-menu-overlay__lang button:hover > span { border-bottom-color: var(--hair); }
.rv-menu-overlay__lang button:focus { outline: none; }
.rv-menu-overlay__lang button:focus-visible { outline: 1px solid var(--hair); outline-offset: 2px; }
.rv-menu-overlay__lang button[aria-pressed="true"] > span { border-bottom-color: var(--ink); }
/* 区切りの「/」だけ。直下のspanに限定しないとボタン内のラベルにも当たる */
.rv-menu-overlay__lang > span { color: var(--gray); }

/* 英語本文の組み: 欧文はEB Garamond / 字間と行間を欧文向けに詰める */
.rv [data-lang="en"] {
  font-family: "EB Garamond", "游明朝", "Yu Mincho", serif;
  letter-spacing: 0.02em;
}
html[data-lang="en"] .rv-concept__lead { font-size: 18px; line-height: 1.7; letter-spacing: 0.02em; }
html[data-lang="en"] .rv-care__ttl { font-size: 25px; line-height: 1.8; letter-spacing: 0.06em; }
html[data-lang="en"] .rv-care__intro,
html[data-lang="en"] .rv-time__intro { font-size: 15px; line-height: 2.1; letter-spacing: 0.02em; }
html[data-lang="en"] .rv-about__addr { font-size: 15px; line-height: 1.9; }
html[data-lang="en"] .rv-about__body { font-size: 14px; line-height: 2; }
html[data-lang="en"] .rv-resv__body { font-size: 15px; line-height: 2.1; letter-spacing: 0.02em; }
html[data-lang="en"] .rv-staff__name { font-size: 14px; letter-spacing: 0.08em; }
html[data-lang="en"] .rv-menu__desc { font-size: 13px; line-height: 1.9; }
html[data-lang="en"] .rv-menu__note { font-size: 12px; }
html[data-lang="en"] .rv-cta__btn { font-size: 14px; letter-spacing: 0.1em; }
html[data-lang="en"] .rv-float { font-size: 12px; letter-spacing: 0.12em; }

@media screen and (max-width: 767px) {
  .rv-lang { top: 8px; left: auto; right: 7px; }

  html[data-lang="en"] .rv-concept__lead { font-size: 15px; }
  html[data-lang="en"] .rv-care__ttl { font-size: 20px; line-height: 1.6; }
  html[data-lang="en"] .rv-care__intro,
  html[data-lang="en"] .rv-time__intro { font-size: 13.5px; line-height: 1.95; }
  html[data-lang="en"] .rv-about__addr { font-size: 14px; }
  html[data-lang="en"] .rv-about__body { font-size: 13px; }
  html[data-lang="en"] .rv-resv__body { font-size: 13.5px; }
  html[data-lang="en"] .rv-staff__name { font-size: 13px; }
  html[data-lang="en"] .rv-menu__desc { font-size: 12px; }
  html[data-lang="en"] .rv-menu__note { font-size: 11px; }
  html[data-lang="en"] .rv-cta__btn { font-size: 13px; }
  html[data-lang="en"] .rv-float { font-size: 11px; }
}

/* iPhone SE など縦の短い端末: メニュー項目の間隔を詰めて上下に余白を残す */
@media screen and (max-height: 740px) {
  .rv-menu-overlay ul { gap: 20px; }
  .rv-menu-overlay__lang button { padding: 11px 16px; }
}

/* 横向き時にノッチへ潜り込まないよう左右の安全領域を確保
   (viewport-fit=cover の副作用対策。縦向き・PCでは env() が0なので影響なし) */
@media screen and (orientation: landscape) {
  .rv {
    padding-left: env(safe-area-inset-left, 0px);
    padding-right: env(safe-area-inset-right, 0px);
  }
}
