@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@500;700&display=swap');
/* ═══════════════════════════════════════
   Neutral【ニュートラル】 共通スタイルシート
   /new/css/style.css
═══════════════════════════════════════ */
:root {
  --ivory:       #FFFFFF;        /* 白基調 */
  --ivory-dark:  #FFF8F2;        /* 淡オレンジベージュ */
  --charcoal:    #1F1A14;        /* 黒系本文 */
  --charcoal-mid:#4A3F36;
  --gold:        #E87841;        /* メインオレンジ（アクセント色） */
  --gold-light:  #F49866;        /* 明るいオレンジ（暗背景上で視認性確保） */
  --gold-deep:   #C25A24;        /* 濃いオレンジ（ホバー等） */
  --gold-pale:   #FFE0CC;        /* 淡オレンジ（バッジ・タグ背景） */
  --muted:       #8A7F78;
  --white:       #FFFFFF;
  --warm-bg:     #FFEEDC;        /* 暖色バッジ背景 */
  --serif-en:    'Cormorant Garamond', Georgia, serif;
  --serif-jp:    'Noto Serif JP', serif;
  --sans-jp:     'Noto Sans JP', sans-serif;
  --ease-silk:   cubic-bezier(0.25, 0.1, 0.25, 1);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: var(--ivory); color: var(--charcoal); font-family: var(--sans-jp); font-weight: 300; line-height: 1.9; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }

/* Reveal */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .85s var(--ease-silk), transform .85s var(--ease-silk); }
.reveal.visible { opacity: 1; transform: none; }
.reveal-d1 { transition-delay: .12s; }
.reveal-d2 { transition-delay: .24s; }
.reveal-d3 { transition-delay: .36s; }
.reveal-d4 { transition-delay: .48s; }

/* Utilities */
.gold-line { display: block; width: 42px; height: 1px; background: var(--gold); margin: 0 auto 1.6rem; }
.gold-line-l { display: block; width: 42px; height: 1px; background: var(--gold); margin: 0 0 1.6rem; }
.sec-en { font-family: var(--serif-en); font-style: italic; font-weight: 300; font-size: clamp(0.9rem,1.4vw,1.1rem); letter-spacing: .1em; color: var(--muted); line-height: 1.4; display: block; margin-bottom: .5rem; opacity: .7; }
.sec-jp { font-family: var(--serif-jp); font-weight: 500; font-size: clamp(1.5rem,2.8vw,2.2rem); letter-spacing: .04em; color: var(--charcoal); margin-top: 0; line-height: 1.35; }
.section { padding: 5rem 8vw; }
.section-sm { padding: 3rem 8vw; }
.section-dark { background: var(--charcoal); }
.section-mid { background: var(--ivory-dark); }

/* Buttons */
.btn-primary { display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 2.3rem;background:var(--charcoal);color:var(--ivory);font-family:var(--serif-jp);font-weight:300;font-size:.88rem;letter-spacing:.18em;border:1px solid var(--charcoal);transition:background .5s var(--ease-silk),color .5s var(--ease-silk);cursor:pointer; }
.btn-primary:hover { background:transparent;color:var(--charcoal); }
.btn-gold { display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 2.3rem;background:transparent;color:var(--gold);border:1px solid var(--gold);font-family:var(--serif-jp);font-size:.88rem;letter-spacing:.18em;font-weight:300;transition:background .5s var(--ease-silk),color .5s var(--ease-silk);cursor:pointer; }
.btn-gold:hover { background:var(--gold);color:var(--white); }
.btn-line { display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 2.3rem;background:#06C755;color:#fff;font-family:var(--serif-jp);font-size:.88rem;letter-spacing:.18em;font-weight:300;transition:opacity .3s;cursor:pointer; }
.btn-line:hover { opacity:.85; }

/* Announce Bar */
.announce-bar { background:#3A3530;padding:.7rem 2rem;text-align:center;font-family:var(--serif-jp);font-size:.84rem;letter-spacing:.12em;color:rgba(255,255,255,.85);font-weight:300; }

/* ── Header ── */
/* ─── ヘッダー（白背景固定・参考サイト準拠） ─── */
.site-header { position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:.85rem 3rem;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);box-shadow:0 1px 0 rgba(0,0,0,.06);transition:padding .3s; }
.site-header.scrolled { padding:.65rem 3rem;box-shadow:0 1px 6px rgba(0,0,0,.08); }
.site-header.inner { padding:.7rem 3rem; }
.header-logo { display:flex;align-items:center;gap:.6rem;font-family:var(--serif-en);font-style:italic;font-weight:300;font-size:1.2rem;letter-spacing:.08em;color:var(--charcoal);transition:opacity .3s; }
.header-logo:hover { opacity:.8; }
.header-logo img { height:42px;width:auto;display:block;font-size:0;color:transparent; }
.header-logo img:not([src]),.header-logo img[src=""] { display:none; }
.header-logo-name { font-family:var(--serif-jp);font-weight:400;font-size:1rem;letter-spacing:.08em;color:var(--charcoal);white-space:nowrap; }
.header-nav { display:flex;align-items:center;gap:2rem; }
.header-nav a { font-family:var(--serif-jp);font-weight:400;font-size:.88rem;letter-spacing:.08em;color:var(--charcoal-mid);transition:color .3s; }
.header-nav a:hover,.header-nav a.active { color:var(--gold); }
.header-cta { display:flex;gap:.55rem; }
.hcta-line,.hcta-reserve { padding:.55rem 1.3rem;font-family:var(--serif-jp);font-size:.78rem;letter-spacing:.08em;font-weight:500;border-radius:0;transition:all .3s;cursor:pointer; }
.hcta-line { background:#06C755;color:#fff;border:1px solid #06C755; }
.hcta-line:hover { background:#05a847;border-color:#05a847; }
.hcta-reserve { border:1px solid var(--gold);color:var(--gold);background:transparent; }
.hcta-reserve:hover { background:var(--gold);color:#fff; }
.header-sns { display:none;align-items:center;gap:.5rem;margin-right:.3rem; }
.header-sns a { display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;color:var(--charcoal);transition:opacity .3s; }
.header-sns a:hover { opacity:.7; }
.header-sns svg { width:18px;height:18px;display:block;fill:currentColor; }
.hamburger { display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px; }
.hamburger span { display:block;width:22px;height:1px;background:var(--charcoal); }
.mobile-nav { display:none;position:fixed;inset:0;background:var(--charcoal);z-index:99;flex-direction:column;align-items:center;justify-content:center;gap:2rem;opacity:0;transition:opacity .4s; }
.mobile-nav.open { display:flex;opacity:1; }
.mobile-nav a { font-family:var(--serif-jp);font-weight:200;font-size:.98rem;letter-spacing:.22em;color:var(--ivory);transition:color .3s; }
.mobile-nav a:hover { color:var(--gold); }
.mobile-nav-close { position:absolute;top:1.5rem;right:1.8rem;font-size:1.4rem;color:var(--ivory);cursor:pointer;background:none;border:none;font-family:var(--serif-en); }

/* ── Page Hero (inner pages) ── */
.page-hero { padding:9.5rem 8vw 4.5rem;background:var(--charcoal);position:relative;overflow:hidden; }
.page-hero::before { content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(196,164,107,.09) 0%,transparent 60%); }
.page-hero-inner { position:relative;z-index:1; }
.breadcrumb { display:flex;gap:.55rem;align-items:center;font-family:var(--serif-jp);font-size:.82rem;letter-spacing:.12em;color:rgba(255,255,255,.85);margin-bottom:1.6rem; }
.breadcrumb a { color:rgba(255,255,255,.32);transition:color .3s; }
.breadcrumb a:hover { color:var(--gold-light); }
.breadcrumb span { color:rgba(255,255,255,.18); }
.page-title-en { font-family:var(--serif-en);font-style:italic;font-weight:300;font-size:clamp(2.2rem,6vw,4rem);letter-spacing:.04em;color:var(--white);line-height:1.1;margin-bottom:.7rem; }
.page-title-jp { font-family:var(--serif-jp);font-weight:200;font-size:.78rem;letter-spacing:.24em;color:var(--gold-light); }

/* ── Concern Layout ── */
.concern-grid { display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center; }
.concern-visual { aspect-ratio:3/4;background:var(--ivory-dark);position:relative;overflow:hidden; }
.concern-visual img,.concern-visual .img-ph { width:100%;height:100%;object-fit:cover; }
.concern-visual::after { content:'';position:absolute;inset:1.1rem;border:1px solid var(--gold);pointer-events:none;opacity:.42; }
.img-ph { display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#E8E0D5 0%,#D4C8BB 100%);font-family:var(--serif-en);font-style:italic;color:rgba(0,0,0,.17);font-size:.76rem;letter-spacing:.2em;min-height:200px; }
.concern-list { list-style:none;margin-top:1.6rem;display:flex;flex-direction:column;gap:.75rem; }
.concern-list li { display:flex;align-items:flex-start;gap:.85rem;font-family:var(--serif-jp);font-weight:300;font-size:.95rem;letter-spacing:.05em;line-height:1.85; }
.concern-list li::before { content:'';display:block;width:5px;height:5px;border-radius:50%;background:var(--gold);margin-top:.56em;flex-shrink:0; }

/* ── Feature Box ── */
.feature-box { display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center; }
.feature-box-img { aspect-ratio:4/3;overflow:hidden;position:relative; }
.feature-box-img img,.feature-box-img .img-ph { width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease-silk); }
.feature-box:hover .feature-box-img img { transform:scale(1.04); }
.feature-box-body { display:flex;flex-direction:column;gap:1.1rem; }
.feature-tag { font-family:var(--serif-en);font-style:italic;font-size:.82rem;letter-spacing:.22em;color:var(--gold); }
.feature-title { font-family:var(--serif-jp);font-weight:300;font-size:clamp(1.15rem,2.4vw,1.65rem);letter-spacing:.1em;line-height:1.55; }
.feature-text { font-size:.95rem;line-height:1.95;color:var(--charcoal-mid);letter-spacing:.04em; }
.feature-divider { padding:5rem 8vw;display:flex;flex-direction:column;gap:4rem; }

/* ── Price Cards ── */
.price-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.4rem;margin-top:3rem; }
/* 1メニュー：中央寄せで横幅半分 */
.price-grid.solo { grid-template-columns:1fr;max-width:520px;margin-left:auto;margin-right:auto; }
/* 2メニュー：横並び各50% */
.price-grid.duo { grid-template-columns:1fr 1fr;max-width:1000px;margin-left:auto;margin-right:auto; }
@media (max-width:768px){
  .price-grid.duo { grid-template-columns:1fr; }
  .price-grid.solo { max-width:100%; }
}
.price-card { border:1px solid var(--ivory-dark);background:var(--white);padding:2.3rem 2.8rem;display:flex;flex-direction:column;gap:.7rem;position:relative; }
/* 料金カード内のボタンを最下部に揃える */
.price-card .btn-gold { margin-top:auto; }

.price-card::before { content:'初回限定';position:absolute;top:-1px;right:1.8rem;background:var(--gold);color:var(--white);font-family:var(--serif-jp);font-size:.75rem;letter-spacing:.13em;padding:.35rem 1rem;font-weight:400; }
.price-name { font-family:var(--serif-jp);font-weight:400;font-size:1.05rem;letter-spacing:.08em;line-height:1.55;padding-right:4.8rem;word-break:auto-phrase; }
/* Other Treatments セクション内の price-card だけは1行表示 */
.other-treatments-grid .price-card .price-name { 
  white-space:nowrap;
  font-size:.95rem;
  letter-spacing:.04em;
  padding-right:0;
}
/* バッジ非表示のカード（通常価格のみのメニュー用） */
.price-card.no-badge::before { display:none; }
.price-card.no-badge .price-name { padding-right:0; }
.price-time { font-size:.84rem;color:var(--muted);letter-spacing:.08em; }
.price-amount { display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap;margin-top:.6rem; }
.price-amount-row { display:flex;flex-direction:column;gap:.2rem;margin-top:.4rem;width:100%; }
.price-row { display:flex;align-items:baseline;justify-content:space-between;gap:.5rem; }
.price-row-label { font-family:var(--serif-jp);font-size:.78rem;color:var(--charcoal-mid);letter-spacing:.05em;white-space:nowrap; }
.price-original { font-family:'Roboto Mono',monospace;font-size:1.05rem;color:var(--charcoal-mid);font-weight:500; }
.price-new { font-family:'Roboto Mono',monospace;font-weight:700;font-size:1.55rem;color:var(--gold);letter-spacing:.01em; }
.price-unit { font-size:.78rem;color:var(--muted);font-family:var(--serif-jp); }
.price-note { font-size:.8rem;color:var(--muted);letter-spacing:.07em;line-height:1.8;margin-top:.2rem; }

/* ── Section Heading ── */
.sec-head { margin-bottom:3.5rem; }
.sec-head.center { text-align:center; }
.sec-head.center .gold-line { margin:0 auto 1.6rem; }

/* ── CTA Strip ── */
.cta-strip { background:var(--charcoal);padding:5rem 8vw;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.8rem; }
.cta-strip p { font-family:var(--serif-jp);font-weight:300;font-size:.95rem;letter-spacing:.1em;color:rgba(255,255,255,.92);line-height:2; }
.cta-btns { display:flex;gap:1rem;flex-wrap:wrap;justify-content:center; }

/* ── Voice (testimonials) ── */
.voice-tabs { display:flex;flex-wrap:wrap;border-bottom:1px solid var(--ivory-dark);margin-bottom:3.5rem; }
.voice-tab { padding:.9rem 1.8rem;cursor:pointer;font-family:var(--serif-jp);font-weight:300;font-size:.92rem;letter-spacing:.12em;color:var(--charcoal-mid);border-bottom:2px solid transparent;transition:color .3s,border-color .3s;background:none;border-top:none;border-left:none;border-right:none; }
.voice-tab.active { color:var(--charcoal);border-bottom-color:var(--gold); }
.voice-tab:hover { color:var(--charcoal-mid); }
.voice-pane { display:none; }
.voice-pane.active { display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1.4rem; }
.voice-card { background:var(--white);border:1px solid var(--ivory-dark);padding:1.8rem;display:flex;flex-direction:column;gap:.75rem; }
.voice-meta { display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;font-size:.85rem;color:var(--muted);letter-spacing:.09em; }
.voice-meta > span:not(.voice-tag-label) { order: 2; }  /* 名前・日付を2番目に */
.voice-tag-label { order: 1; }  /* カテゴリを1番目に */
.voice-tag-label { background:var(--gold-pale);padding:.28rem .85rem;font-family:var(--serif-jp);font-size:.75rem;letter-spacing:.08em;color:var(--gold-deep); }
.voice-text { font-family:var(--serif-jp);font-weight:300;font-size:.82rem;line-height:1.9;letter-spacing:.04em; }
.voice-reply { border-top:1px solid var(--ivory-dark);padding-top:.75rem;margin-top:.4rem;font-size:.73rem;color:var(--muted);line-height:1.8;letter-spacing:.04em; }
.voice-reply::before { content:'▷ サロンより　';font-size:.66rem;color:var(--gold);letter-spacing:.09em; }

/* ── FAQ Accordion ── */
.faq-group-title { font-family:var(--serif-jp);font-weight:300;font-size:.76rem;letter-spacing:.2em;color:var(--gold);padding:2rem 0 .9rem;border-bottom:1px solid var(--ivory-dark); }
.faq-list { display:flex;flex-direction:column; }
.faq-item { border-bottom:1px solid var(--ivory-dark); }
.faq-q { width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:1.4rem;padding:1.3rem 0;cursor:pointer;background:none;border:none;text-align:left;font-family:var(--serif-jp);font-weight:300;font-size:.86rem;letter-spacing:.05em;color:var(--charcoal);line-height:1.7;transition:color .3s; }
.faq-q:hover { color:var(--gold); }
.faq-icon { width:18px;height:18px;border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:3px;font-size:.7rem;color:var(--gold);transition:transform .4s var(--ease-silk); }
.faq-item.open .faq-icon { transform:rotate(45deg); }
.faq-a { display:none;padding:0 0 1.3rem;font-size:.8rem;line-height:1.95;color:var(--charcoal-mid);letter-spacing:.04em; }
.faq-a a { color:var(--gold);border-bottom:1px solid rgba(196,164,107,.38); }
.faq-item.open .faq-a { display:block; }

/* ── Access ── */
.access-layout { display:grid;grid-template-columns:1fr 1fr;min-height:460px; }
.access-map iframe { width:100%;height:100%;min-height:420px;border:0;display:block; }
.access-map .img-ph { min-height:420px; }
.access-info { padding:5rem 4.5rem;display:flex;flex-direction:column;gap:1.8rem;background:var(--ivory); }
.access-table { width:100%;border-collapse:collapse;font-size:.8rem; }
.access-table tr { border-bottom:1px solid var(--ivory-dark); }
.access-table th { font-family:var(--serif-jp);font-weight:300;letter-spacing:.13em;color:var(--muted);padding:.95rem 1rem .95rem 0;text-align:left;white-space:nowrap;width:5.5rem;vertical-align:top; }
.access-table td { padding:.95rem 0;line-height:1.8;letter-spacing:.04em;vertical-align:top; }

/* ── NaviCard strip ── */
.nc-strip { background:var(--charcoal);padding:2rem 8vw;display:flex;align-items:center;justify-content:space-between;gap:1.4rem;flex-wrap:wrap; }
.nc-strip-text { font-family:var(--serif-jp);font-weight:200;font-size:.78rem;letter-spacing:.16em;color:rgba(255,255,255,.55); }
.nc-strip-text strong { display:block;font-size:.9rem;color:var(--gold-light);margin-bottom:.2rem;font-weight:300; }

/* ── Footer ── */
.site-footer { background:var(--charcoal);padding:5rem 8vw 3rem; }
.footer-top { display:flex;justify-content:space-between;align-items:flex-start;gap:3rem;padding-bottom:3rem;border-bottom:1px solid rgba(255,255,255,.07);flex-wrap:wrap; }
.footer-logo { font-family:var(--serif-en);font-style:italic;font-weight:300;font-size:1.35rem;color:var(--white);letter-spacing:.08em;margin-bottom:.35rem; }
.footer-tagline { font-family:var(--serif-jp);font-size:.82rem;letter-spacing:.13em;color:rgba(255,255,255,.75);font-weight:300; }
.footer-nav { display:flex;gap:3rem;flex-wrap:wrap; }
.footer-nav-group h4 { font-family:var(--serif-en);font-style:italic;font-size:.85rem;letter-spacing:.18em;color:var(--gold);margin-bottom:.95rem;font-weight:400; }
.footer-nav-group ul { list-style:none;display:flex;flex-direction:column;gap:.5rem; }
.footer-nav-group ul li a { font-family:var(--sans-jp);font-size:.88rem;letter-spacing:.06em;color:rgba(255,255,255,.85);transition:color .3s; }
.footer-nav-group ul li a:hover { color:var(--gold-light); }
.footer-bottom { padding-top:1.8rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.8rem; }
.footer-legal { display:flex;gap:1.6rem;flex-wrap:wrap; }
.footer-legal a { font-family:var(--sans-jp);font-size:.78rem;letter-spacing:.07em;color:rgba(255,255,255,.7);transition:color .3s; }
.footer-legal a:hover { color:rgba(255,255,255,.5); }
.footer-copy { font-family:var(--serif-en);font-style:italic;font-weight:300;font-size:.78rem;color:rgba(255,255,255,.6);letter-spacing:.08em; }

/* ── Responsive ── */
@media (max-width: 1024px) {
  .header-nav,.header-cta { display:none; }
  .header-logo-name { display:none; }
  .header-logo img { height:34px; }
  .header-sns { display:flex; }
  .hamburger { display:flex; }
  .concern-grid{grid-template-columns:1fr;gap:2.5rem;}
  .concern-visual{aspect-ratio:4/3;}
  .feature-box{grid-template-columns:1fr;gap:2.5rem;}
  .access-layout{grid-template-columns:1fr;}
  .access-info{padding:3rem 2rem;}
}
@media(max-width:768px){
  .site-header{padding:1rem 1.4rem;}
  .section{padding:2.6rem 5vw;}
  .section-sm{padding:2rem 5vw;}
  .page-hero{padding:8rem 5vw 3rem;}
  .price-grid{grid-template-columns:1fr;}
  .nc-strip{flex-direction:column;gap:1rem;padding:2rem 5vw;}
  .footer-top{flex-direction:column;}
  .footer-nav{gap:1.8rem;}
  .footer-bottom{flex-direction:column;align-items:flex-start;}
  .cta-btns{flex-direction:column;align-items:center;}
  .feature-divider{padding:4rem 5vw;}
  .access-map iframe,.access-map .img-ph{min-height:240px;}
}


/* ═══════════════════════════════════════
   STEP TIMELINE（流れ）— 現サイト風タイムライン
═══════════════════════════════════════ */
.step-list {
  max-width: 920px;
  margin: 3rem auto 0;
  position: relative;
  padding-left: 0;
}
.step-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2.5rem;
  padding: 2.4rem 0 2.6rem 3rem;
  position: relative;
  align-items: flex-start;
}
/* 縦線（タイムラインの軸） */
.step-item::before {
  content: '';
  position: absolute;
  left: 0.55rem;
  top: 2.4rem;
  bottom: -0.5rem;
  width: 1px;
  background: var(--gold-pale);
}
.step-item:last-child::before { display: none; }
/* 丸マーカー */
.step-item::after {
  content: '';
  position: absolute;
  left: 0;
  top: 2.6rem;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 4px var(--white), 0 0 0 5px var(--gold-pale);
}
.step-content {
  min-width: 0;
}
.step-title {
  font-family: var(--serif-jp);
  font-weight: 500;
  font-size: 1.1rem;
  letter-spacing: 0.08em;
  color: var(--charcoal);
  margin-bottom: 0.9rem;
  line-height: 1.6;
}
.step-text {
  font-family: var(--serif-jp);
  font-weight: 300;
  font-size: 0.92rem;
  line-height: 2.05;
  color: var(--charcoal-mid);
  letter-spacing: 0.04em;
}
.step-text strong {
  color: var(--gold-deep);
  font-weight: 500;
}
.step-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  padding: 0.8rem 1.2rem;
  background: var(--ivory-dark);
  min-width: 80px;
  align-self: flex-start;
}
.step-label-en {
  font-family: var(--serif-en);
  font-style: italic;
  font-weight: 400;
  font-size: 0.74rem;
  letter-spacing: 0.18em;
  color: var(--gold-deep);
  line-height: 1;
  text-transform: uppercase;
}
.step-label-num {
  font-family: var(--serif-en);
  font-weight: 500;
  font-size: 2rem;
  color: var(--gold);
  line-height: 1;
}

@media (max-width: 768px) {
  .step-item {
    grid-template-columns: 1fr;
    gap: 1rem;
    padding: 1.8rem 0 1.8rem 2.2rem;
  }
  .step-item::after {
    top: 2.1rem;
    width: 11px;
    height: 11px;
  }
  .step-item::before {
    left: 0.45rem;
    top: 1.95rem;
  }
  .step-label {
    flex-direction: row;
    gap: 0.6rem;
    padding: 0.5rem 0.9rem;
    min-width: 0;
    align-self: flex-start;
  }
  .step-label-num {
    font-size: 1.4rem;
  }
  .step-title {
    font-size: 1rem;
    margin-bottom: 0.6rem;
  }
  .step-text {
    font-size: 0.88rem;
    line-height: 1.95;
  }
}


/* ═══════════════════════════════════════
   FOOTER NAVICARD BAR（下層ページの予約バー）
═══════════════════════════════════════ */
.footer-navicard {
  background: #1C1815;
  border-top: 3px solid var(--gold);
  padding: 2rem 8vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  flex-wrap: wrap;
}
.footer-navicard-text { flex: 1; min-width: 0; }
.footer-navicard-label {
  font-family: var(--serif-en);
  font-style: italic;
  font-size: 0.85rem;
  letter-spacing: 0.2em;
  color: var(--gold-light) !important;
  margin-bottom: 0.4rem;
}
.footer-navicard-title {
  font-family: var(--serif-jp);
  font-weight: 500;
  font-size: 1.15rem;
  color: #FFFFFF !important;
  letter-spacing: 0.06em;
  margin-bottom: 0.3rem;
}
.footer-navicard-desc {
  font-size: 0.92rem;
  color: rgba(255,255,255,0.85) !important;
  letter-spacing: 0.04em;
}
.footer-navicard-btn {
  display: inline-flex;
  align-items: center;
  padding: 0.95rem 2.4rem;
  background: var(--gold);
  color: var(--white) !important;
  font-family: var(--serif-jp);
  font-size: 0.95rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  white-space: nowrap;
  transition: background 0.3s, opacity 0.3s;
}
.footer-navicard-btn:hover { background: var(--gold-deep); }
@media (max-width: 768px) {
  .footer-navicard {
    flex-direction: column;
    align-items: flex-start;
    padding: 2rem 5vw;
  }
  .footer-navicard-btn {
    width: 100%;
    justify-content: center;
  }
}

.footer-logo-jp {
  font-family: var(--serif-jp);
  font-weight: 300;
  font-size: 0.7em;
  letter-spacing: 0.06em;
  margin-left: 0.1em;
  font-style: normal;
}

/* Other Treatments セクション内の price-card は内側余白を控えめに */
.other-treatments-grid .price-card { padding: 2rem 1.5rem; }

/* ─── 価格メニュー一覧テーブル（下層ページ末尾） ─── */
.price-table-wrap { font-family:var(--serif-jp); }
.price-table-caption { font-family:var(--serif-jp); font-weight:500; font-size:1.05rem; letter-spacing:.1em; color:var(--charcoal); text-align:center; margin-bottom:1.2rem; }
.price-table { width:100%; border-collapse:collapse; font-size:.92rem; }
.price-table thead th { background:var(--ivory-dark); color:var(--charcoal); font-family:var(--serif-jp); font-weight:500; padding:.9rem .8rem; text-align:left; letter-spacing:.05em; border-bottom:1px solid var(--gold); white-space:nowrap; }
.price-table thead th:nth-child(2),
.price-table thead th:nth-child(3) { text-align:right; }
.price-table tbody td { padding:1rem .8rem; border-bottom:1px solid var(--ivory-dark); color:var(--charcoal-mid); letter-spacing:.04em; vertical-align:middle; }
.price-table tbody td:nth-child(2) { color:var(--charcoal); text-align:right; white-space:nowrap; font-family:'Roboto Mono',monospace; font-weight:500; font-size:1.05rem; }
.price-table tbody td:nth-child(3) { color:var(--gold); font-family:'Roboto Mono',monospace; font-weight:700; text-align:right; white-space:nowrap; font-size:1.15rem; }
.price-table-note { font-size:.78rem; color:var(--muted); text-align:center; margin-top:1rem; letter-spacing:.04em; }
@media (max-width:600px){
  .price-table thead th { padding:.7rem .5rem; font-size:.82rem; }
  .price-table tbody td { padding:.85rem .5rem; font-size:.85rem; }
  .price-table tbody td:nth-child(2) { font-size:.95rem; }
  .price-table tbody td:nth-child(3) { font-size:1.05rem; }
}

/* ─── 美容液表（フェイシャル用） ─── */
.serum-table-wrap { max-width:780px; margin:1.8rem auto; }
.serum-table { width:100%; border-collapse:collapse; font-size:.86rem; font-family:var(--serif-jp); }
.serum-table thead th { background:var(--ivory-dark); color:var(--charcoal); font-weight:500; padding:.85rem .8rem; text-align:left; letter-spacing:.04em; border-bottom:1px solid var(--gold); }
.serum-table tbody td { padding:.8rem; border-bottom:1px solid var(--ivory-dark); color:var(--charcoal-mid); letter-spacing:.04em; vertical-align:middle; }
.serum-table tbody td:first-child { color:var(--charcoal); font-weight:500; white-space:nowrap; }
@media (max-width:600px){
  .serum-table thead th, .serum-table tbody td { padding:.65rem .5rem; font-size:.78rem; }
}