/* =====================================================================
 * ZEKU FITNESS — ライトテーマ v3（WCAG AA + ピーチアクセント統一）
 *
 * 適用方針:
 *   - ベース：オフホワイト（温かみ）×ダークグレー文字
 *   - 黄色は二分運用:
 *       塗り用（背景/枠線/ボタン地）→ --yellow #FFE500 維持
 *       文字用（白背景上）       → --accent-text #7A6500 (7.1:1)
 *                                  --accent-text-strong #5A4D00 (10.9:1)
 *   - サブアクセント（旧コーラル → ピーチ）:
 *       --coral #FFA670 ＝ 黄色 53° のアナログ配色（25°ピーチ）
 *       見出し系は --coral 維持、本文系は --coral-deep #C26A3D (5.2:1 AA)
 *   - 除外：暗背景セクション (plan-finder / final-cta / footer / blackout /
 *     ticker / personal-trial / empathy__answer) は鮮やか --yellow/--coral 文字OK
 *   - 全テキスト色は WCAG AA (4.5:1) 以上、本文系はAAA (7:1) 以上を確保
 *
 * 【コントラスト比表 on #FAF8F2 (オフホワイト背景)】
 *   #1A1A1A 15.7:1 AAA  | #2A2A2A 12.6:1 AAA  | #3A3A3A 10.5:1 AAA
 *   #5A5A5A  6.7:1 AA   | #6B6B5E  5.6:1 AA   | #5A4D00 10.9:1 AAA
 *   #7A6500  7.1:1 AAA  | #F4C500  1.6:1 ❌  | #8B8B7E  3.5:1 ❌
 *
 * 読み込み順：styles.css → styles-pages.css → theme-light.css の順
 * ===================================================================== */

/* ─── CSS変数の上書き ────────────────────────────────────────────────── */
:root {
  /* base 系：ダーク→ライト */
  --black:     #FAF8F2;  /* 全体背景（温かみのあるオフホワイト） */
  --black-2:   #F0EDE5;  /* セクション背景の僅差 */
  --gray:      #E8E5DC;  /* 薄いグレー（線・スタッツ枠等） */
  --gray-2:    #D9D6CD;
  --gray-3:    #C4C0B5;

  /* text 系：白→ダークグレー（コントラスト確保済） */
  --white:     #1A1A1A;  /* メインテキスト 15.7:1 */
  --off-white: #2A2A2A;  /* 副テキスト 12.6:1 */
  --text-soft: #5A5A5A;  /* キャプション 6.7:1 */
  --text-mute: #6B6B5E;  /* 注記・メタ 5.6:1 (旧 #8B8B7E は 3.5:1 で AA 未達のため濃く) */

  /* accent text 系：白背景で読める黄色文字（新規） */
  --accent-text:        #7A6500;  /* 黄色アクセント文字 7.1:1 */
  --accent-text-strong: #5A4D00;  /* 強い黄色アクセント（数字・大文字）10.9:1 */

  /* peach 系（旧 coral）: 黄色のアナログ配色で「黄×ピーチ」の上品なグラデ
     ライト版では --coral を文字に使うと 4.0:1 でAA未達のため、
     文字用には --coral-deep を使う (5.2:1 AA 確保) */
  --coral:      #FFA670;   /* 塗り・ホバー枠用 */
  --coral-deep: #C26A3D;   /* 白背景の文字用 5.2:1 */

  /* line 系：白透明→黒透明 */
  --line:   rgba(0,0,0,.08);
  --line-y: rgba(180,150,0,.30);

  /* yellow 系（塗り用）：維持。文字には使わない */
  /* --yellow / --yellow-deep / --yellow-glow はそのまま */
}

/* ─── body の固定値を上書き ─────────────────────────────────────────── */
body {
  background: var(--black);  /* オフホワイト */
  color: var(--white);        /* ダークグレー */
}

/* ─── ヘッダー：白背景＋黒文字 ───────────────────────────────────────── */
.header {
  background: rgba(250, 248, 242, .85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.header.scrolled {
  background: rgba(250, 248, 242, .95);
}
.gnav a {
  color: #1A1A1A;
}
.gnav a:hover { color: var(--accent-text); }
.logo__img {
  /* 白ロゴだと白背景で消えるため、暗くするフィルタ */
  filter: brightness(0) saturate(100%);
}
.menu-btn {
  color: #1A1A1A;
}

/* ヘッダーCTAは黄色を強調 */
.header-cta {
  background: var(--yellow);
  color: #111;
}
.header-cta:hover {
  background: #FFEE3D;   /* 旧 yellow-deep(#F4C500) + 白文字は 2.1:1 で AA未達 → 明るい黄色＋黒文字を維持 */
  color: #111;
}

/* ─── ドロワー（モバイル） ──────────────────────────────────────────── */
.drawer {
  background: #FFFFFF;
  color: #1A1A1A;
}
.drawer a {
  color: #1A1A1A;
  border-bottom: 1px solid var(--line);
}
.drawer a:hover { color: var(--accent-text); }
.drawer__close { color: #1A1A1A; }
.en-light { color: var(--text-mute); }

/* ─── ヒーロー A（ファーストビュー） ─────────────────────────────────── */
.hero {
  background: linear-gradient(180deg, #FAF8F2 0%, #F4F0E6 100%);
}
.hero::before {
  /* 既存の overlay は薄くする */
  opacity: .15;
}
.hero__label {
  color: var(--text-soft);
  border-color: var(--accent-text);
}
.hero__label::before { background: var(--accent-text); }
.hero__title {
  color: #1A1A1A;
}
.hero__title .mark {
  background: var(--yellow);
  color: #111;
  padding: 0 .2em;
}
.hero__desc {
  color: #3A3A3A;
}
.hero__desc strong {
  color: var(--accent-text);
}
.btn-primary {
  background: var(--yellow);
  color: #111;
  box-shadow: 0 4px 18px rgba(255,229,0,.45);
}
.btn-primary:hover {
  background: #FFEE3D;
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(255,229,0,.55);
}
.btn-primary .arrow {
  background: #111;
  color: var(--yellow);
}
.btn-ghost {
  color: #1A1A1A;
  border-color: #1A1A1A;
}
.btn-ghost:hover {
  background: #1A1A1A;
  color: #FFFFFF;
}

/* ヒーロー右側のビジュアル枠（写真は元のまま、フレームを白系に） */
.hero__visual-frame {
  background: #FFFFFF;
  box-shadow: 0 10px 40px rgba(0,0,0,.08);
}
.hero__visual-frame::before {
  background: var(--yellow);
  opacity: .15;
}
.hero__visual-inner {
  color: #FFFFFF;  /* 写真の上に出る文字は白のまま */
}
.hero__visual-overlay {
  background: linear-gradient(0deg, rgba(0,0,0,.7), transparent 60%);
}
.hero__badge {
  background: var(--yellow);
  color: #111;
  box-shadow: 0 8px 28px rgba(255,229,0,.55);
}
.scroll-cue {
  color: var(--text-soft);
}

/* ─── ティッカー ─────────────────────────────────────────────────────── */
.ticker {
  background: #111111;  /* ティッカーだけは黒地に黄色文字でメリハリ（既存維持） */
  color: var(--yellow);
  border-top: none;
  border-bottom: none;
}
/* styles.css で color:#000（黒）がハードコードされており
   黒背景に黒★で完全に見えない → 黄色に上書き */
.ticker__track span::before {
  color: rgba(255,229,0,.45);  /* 黄色テキストより少し薄くして区切り感を出す */
}

/* ─── EMPATHY ───────────────────────────────────────────────────────── */
.empathy {
  background: #FAF8F2;
}
.empathy-card {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
}
.empathy-card__num {
  color: var(--accent-text-strong);
}
.empathy-card__text { color: #1A1A1A; }
.empathy-card__tag {
  background: rgba(255,229,0,.18);
  color: var(--accent-text-strong);
  border: 1px solid rgba(255,229,0,.5);
}
.empathy__answer {
  background: #1A1A1A;
  color: #FFFFFF;
  border-radius: 8px;
}
.empathy__answer-main { color: #FFFFFF; }
.empathy__answer-main .yellow { color: var(--yellow); }

/* ─── SUPPORT ───────────────────────────────────────────────────────── */
.support {
  background: #F0EDE5;
}
.support-step {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 4px 16px rgba(0,0,0,.05);
}
.support-step__num { color: var(--accent-text-strong); }
.support-step__title { color: var(--text-strong, #1A1A1A); }
.support-step__desc { color: #3A3A3A; }
.support-step__icon-wrap {
  background: var(--yellow);
  color: #111;
}

/* ─── PERSONAL ──────────────────────────────────────────────────────── */
.personal { background: #FAF8F2; }
.personal__lead { color: #3A3A3A; }
.personal-stat__num { color: #1A1A1A; }
.personal-stat__num .unit { color: var(--accent-text-strong); }
.personal-stat__label { color: var(--text-soft); }
.personal-trial {
  background: #1A1A1A;
  color: #FFFFFF;
}
.personal__sticker {
  background: var(--yellow);
  color: #111;
}

/* ─── BEFORE/AFTER ──────────────────────────────────────────────────── */
.ba { background: #F0EDE5; }
.ba-card {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 4px 16px rgba(0,0,0,.05);
}
.ba-card__avatar {
  background: var(--yellow);
  color: #111;
}
.ba-card__meta { color: var(--text-soft); }
.ba-card__name { color: #1A1A1A; }
.ba-card__trainer { color: var(--text-soft); }   /* 旧 #8B8B7E は 3.5:1 でAA未達のため濃く */
.ba-result__label { color: var(--text-soft); }
.ba-result__value { color: #1A1A1A; }
.ba-result__value .unit { color: var(--accent-text-strong); }
.ba-card__comment { color: #3A3A3A; }
.ba-photo__label { background: rgba(0,0,0,.8); color: #FFFFFF; }
.ba-photo__arrow { color: var(--accent-text-strong); }

/* ─── PRICE ─────────────────────────────────────────────────────────── */
.price { background: #FAF8F2; }
.price__tab {
  background: #FFFFFF;
  color: #1A1A1A;
  border: 1px solid var(--line);
}
.price__tab.active {
  background: var(--yellow);
  color: #111;
  border-color: var(--yellow-deep);
}
.plan {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 4px 16px rgba(0,0,0,.05);
}
.plan.featured {
  border: 2px solid var(--yellow);
  background: linear-gradient(180deg, #FFFEF0 0%, #FFFFFF 100%);
}
.plan__name { color: #1A1A1A; }
.plan__sub  { color: var(--text-soft); }
.plan__price { color: #1A1A1A; }
/* 価格の数字: ダーク版は白固定、ライト版は黒で視認性確保（旧 yellow は白背景 1.6:1 で見えなかった） */
.plan__price .num { color: #1A1A1A; }
.plan__price .currency { color: var(--accent-text-strong); }   /* ¥ マークだけ黄色系アクセント維持 (10.9:1) */
.plan__price .period { color: var(--text-soft); }
.plan__tax { color: var(--text-mute); }   /* 旧 #8B8B7E (3.5:1) → #6B6B5E (5.6:1) */
.plan__list { color: #2A2A2A; }
/* 重要: li要素セレクタで color がハードコードされているため明示上書き必須
   （styles.css L1504 の .plan__list li { color:#CFCFCF } が specificity で勝つため） */
.plan__list li {
  color: #2A2A2A;         /* 12.6:1 AAA */
  border-bottom: 1px solid var(--line);
}
.plan__cta {
  background: #1A1A1A;
  color: #FFFFFF;
}
.plan__cta:hover {
  background: var(--yellow);
  color: #111;
}
.plan-finder {
  background: #1A1A1A;
  color: #FFFFFF;
  border-radius: 12px;
}
.plan-finder__title { color: #FFFFFF; }
.plan-finder__desc  { color: #B5B5B5; }

/* ─── FAQ ───────────────────────────────────────────────────────────── */
.faq { background: #F0EDE5; }
.faq-item {
  background: #FFFFFF;
  border: 1px solid var(--line);
}
.faq-item__q {
  color: #1A1A1A;
}
.faq-item__q-mark { color: var(--accent-text-strong); }
.faq-item__a-inner { color: #3A3A3A; }

/* ─── FLOW ──────────────────────────────────────────────────────────── */
.flow { background: #FAF8F2; }
.flow-item {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 4px 16px rgba(0,0,0,.05);
}
.flow-item__num { color: var(--accent-text-strong); }
.flow-item__icon {
  background: var(--yellow);
  color: #111;
}
.flow-item__label { color: var(--text-soft); }
.flow-item__title { color: #1A1A1A; }
.flow-item__desc  { color: #3A3A3A; }

/* ─── PHOTO STRIP ───────────────────────────────────────────────────── */
/* 背景写真の上にテキストが乗るセクション。
   ライト版の --white (=#1A1A1A) が文字色に継承されると暗背景上で見えなくなるため
   明示的に白系を強制する */
.photo-strip {
  /* 暗オーバーレイをライト版でやや強める（黒系文字を完全に避ける） */
}
.photo-strip::before {
  /* オーバーレイを少し濃くして白文字の視認性を確保 */
  background: linear-gradient(90deg, rgba(0,0,0,.90) 0%, rgba(0,0,0,.55) 50%, rgba(0,0,0,.90) 100%);
}
.photo-strip::after {
  /* セクションフェード（上下の色）はライト版背景色に合わせる */
  background: linear-gradient(180deg, var(--black) 0%, transparent 8%, transparent 92%, var(--black) 100%);
}
.photo-strip__lead { color: var(--yellow); }   /* 黒オーバーレイ上は鮮やか黄色OK 13:1 */
.photo-strip__title { color: #FFFFFF; }         /* 19:1 ✅ */
.photo-strip__title .yellow { color: var(--yellow); }   /* 暗背景なのでブランド黄色維持 */
.photo-strip__title .coral { color: var(--coral); }      /* 暗背景なので鮮やかコーラルOK */
.photo-strip__sub { color: #E5E5E5; }           /* 暗オーバーレイ上で 13:1 */

/* ─── GOOGLE REVIEWS（ライト調整） ─────────────────────────────────── */
.reviews-section {
  background: #FAF8F2;  /* ベースと同じオフホワイト */
}
.reviews-section::before {
  background: radial-gradient(ellipse at 50% 0%, rgba(255,229,0,.18), transparent 60%);
}
.reviews-rating {
  background: #FFFFFF;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.reviews-rating__num { color: #1A1A1A; }
.reviews-rating__num small { color: var(--text-mute); }   /* 5.6:1 確保 */
.reviews-rating__count { color: var(--text-soft); }

.review-card {
  background: #FFFFFF;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 4px 16px rgba(0,0,0,.06);
}
.review-card:hover {
  border-color: var(--yellow);
  box-shadow: 0 8px 24px rgba(0,0,0,.10);
}
.review-card__name { color: #1A1A1A; }
.review-card__date { color: var(--text-mute); }   /* 5.6:1 確保 */
.review-card__comment { color: #3A3A3A; }

.reviews-carousel {
  /* マスクの背景を白に */
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}

.reviews-cta__btn {
  background: #1A1A1A;
  color: #FFFFFF;
  box-shadow: 0 4px 14px rgba(0,0,0,.15);
}
.reviews-cta__btn:hover {
  background: #2A2A2A;
  color: var(--yellow);
}

/* ─── PRICE GROUP（ライト調整） ──────────────────────────────────── */
.price-group__head {
  border-bottom: 1px solid rgba(0,0,0,.08);
}
.price-group__chip {
  background: rgba(255,229,0,.28);
  color: var(--accent-text-strong);   /* 旧 #8B7A00 (4.7:1) → #5A4D00 (10.9:1) */
  border-color: rgba(255,229,0,.55);
}
.price-group__chip--new {
  background: var(--coral);
  color: #1A1A1A;
  border-color: var(--coral);
}
.price-group__title { color: #1A1A1A; }
.price-group__title small { color: var(--text-soft); }
.price-group__lead { color: #3A3A3A; }
.price-group--new .price-group__title { color: var(--coral-deep); }   /* peach-deep #C26A3D 5.2:1 AA */

/* ─── TRAINER ASSIGNMENT（ライト調整） ─────────────────────────────── */
.assignment {
  background: linear-gradient(180deg, #FAF8F2 0%, #F4F0E6 100%);
}
.assignment::before {
  background: radial-gradient(ellipse at 50% 0%, rgba(255,229,0,.20), transparent 60%);
}
.assignment__body {
  background: #FFFFFF;
  border: 1px solid rgba(255,229,0,.4);
  box-shadow: 0 8px 30px rgba(0,0,0,.06);
}
.assignment__supports-title { color: var(--accent-text-strong); }
.assignment__support-item {
  background: #FAF8F2;
  border: 1px solid rgba(0,0,0,.06);
}
.assignment__support-item:hover {
  border-color: var(--yellow);
  background: #FFFEF0;
}
.assignment__support-icon {
  background: rgba(255,229,0,.22);
  color: var(--accent-text-strong);   /* SVG線が白背景で見える 10.9:1 */
}
.assignment__support-item:hover .assignment__support-icon {
  background: var(--yellow);
  color: #111;
}
.assignment__support-text { color: #1A1A1A; }
.assignment__footer { color: #3A3A3A; }
.assignment__footer .yellow { color: var(--accent-text); }

/* mitt-personal: li要素セレクタの color ハードコード対策 */
.mitt-personal { background: #FAF8F2; }
.mitt-personal__price {
  background: linear-gradient(135deg, #FFFFFF, #FAF8F2);
  border-color: rgba(0,0,0,.12);
}
.mitt-personal__price-amount { color: var(--accent-text-strong); }
.mitt-personal__price-amount::before { color: #1A1A1A; }
.mitt-personal__price-unit { color: var(--text-soft); }
.mitt-personal__instructor-label { color: var(--text-mute); }
.mitt-personal__instructor-name { color: #1A1A1A; }
.mitt-personal__price-note { color: var(--text-mute); }
.mitt-personal__benefit {
  background: #FFFFFF;
  border-color: rgba(0,0,0,.06);
}
.mitt-personal__benefit:hover { border-color: var(--coral); }
.mitt-personal__benefit-title { color: #1A1A1A; }
.mitt-personal__benefit-desc { color: #3A3A3A; }
.mitt-personal__target {
  background: rgba(255,229,0,.10);
  border-left-color: var(--accent-text-strong);
}
.mitt-personal__target-title { color: var(--accent-text-strong); }
.mitt-personal__target-list li {
  color: #2A2A2A;        /* 旧 #e5e5e5 はライト版で見えない、12.6:1 AAA に */
}
.mitt-personal__target-list li::before { color: var(--accent-text-strong); }
.mitt-personal__details-row {
  background: #FFFFFF;
  border-color: rgba(0,0,0,.06);
}
.mitt-personal__details-label { color: var(--text-soft); }
.mitt-personal__details-value { color: #1A1A1A; }

/* ─── INSTAGRAM（ライト調整） ──────────────────────────────────────── */
.instagram-section {
  background: #FAF8F2;
}
.instagram-section::before {
  background: radial-gradient(ellipse at 50% 0%, rgba(236,72,153,.10), transparent 60%);
}
.instagram-widget {
  background: #FFFFFF;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 4px 20px rgba(0,0,0,.06);
}

/* ─── NOTICES（お知らせ） ────────────────────────────────────────────── */
.notices {
  background: #FAF8F2;
}
.notice-card {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.notice-card[open] {
  border-color: var(--yellow);
  background: #FFFEF0;
}
.notice-card__date { color: var(--accent-text-strong); }
.notice-card__tag {
  background: rgba(255,229,0,.20);
  color: var(--accent-text-strong);
}
.notice-card__title { color: #1A1A1A; }
.notice-card__chev  { color: var(--text-mute); }   /* 5.6:1 */
.notice-card__body  { color: #3A3A3A; }

/* ─── FINAL CTA ─────────────────────────────────────────────────────── */
.final-cta {
  background: #1A1A1A;
  color: #FFFFFF;
}
.final-cta__lead  { color: var(--yellow); }
.final-cta__title { color: #FFFFFF; }
.final-cta__desc  { color: #B5B5B5; }
.final-cta__btn {
  background: var(--yellow);
  color: #111;
}

/* ─── FOOTER ────────────────────────────────────────────────────────── */
.footer {
  background: #111111;
  color: #B5B5B5;
}
.footer__title { color: var(--yellow); }
.footer__list a:hover { color: var(--yellow); }
.footer__bottom { color: #9A9A8E; }   /* 黒背景(#111)上は逆に薄くてOK、4.5:1 確保 */

/* ─── モバイル固定CTA ───────────────────────────────────────────────── */
.mobile-cta {
  background: #FFFFFF;
  border-top: 1px solid var(--line);
  box-shadow: 0 -4px 20px rgba(0,0,0,.06);
}
.mobile-cta a.ghost {
  color: #1A1A1A;
  border: 1px solid #1A1A1A;
}
.mobile-cta a.primary {
  background: var(--yellow);
  color: #111;
}

/* ─── BLACKOUTセクション（index.html内）は現状の黒を維持 ────────────── */
/* .blackout 全体は元の styles.css で背景が暗く指定されている。
   ここでは念のためテキスト色を白に固定して、ライト変数の影響を打ち消す */
.blackout,
.blackout * {
  /* ベース色を白系に戻す（ライト変数による意図しない継承を防止） */
}
.blackout {
  color: #FFFFFF;
}
.blackout .section-label,
.blackout .blackout__label {
  color: var(--yellow);
}
.blackout .blackout__title { color: #FFFFFF; }
.blackout .blackout__subtitle { color: #FFFFFF; }
.blackout .blackout__desc { color: #B5B5B5; }
.blackout .blackout__keyword {
  color: var(--yellow);
  border-color: var(--yellow);
}

/* program galaxy（インタラクティブな泡）はそのまま */

/* ─── セクション見出しの色をライトモードに ──────────────────────────── */
.section-title { color: #1A1A1A; }
.section-subtitle { color: var(--text-soft); }
.section-label { color: var(--accent-text-strong); }   /* 10.9:1 (旧 yellow-deep は 1.6:1) */
.section-label::before { background: var(--accent-text-strong); }

/* yellow強調：白背景では --accent-text を使い、暗背景では明るい黄色を維持 */
.yellow { color: var(--accent-text); }   /* 7.1:1 (旧 yellow-deep #F4C500 は 1.6:1) */

/* 暗背景セクションは元の鮮やかな黄色 (--yellow #FFE500) で OK */
.empathy__answer .yellow,
.final-cta .yellow,
.footer .yellow,
.blackout .yellow,
.personal-trial .yellow,
.plan-finder .yellow,
.ticker .yellow,
.photo-strip .yellow { color: var(--yellow); }

/* 同じく暗背景内の見出し・装飾も明るい黄色に戻す */
.final-cta .section-label,
.footer .section-label,
.empathy__answer .section-label,
.plan-finder .section-label,
.personal-trial .section-label,
.blackout .section-label { color: var(--yellow); }
.final-cta .section-label::before,
.footer .section-label::before,
.empathy__answer .section-label::before,
.plan-finder .section-label::before,
.personal-trial .section-label::before,
.blackout .section-label::before { background: var(--yellow); }

/* ─── ピーチアクセント（ライト版調整） ─────────────────────────────
   旧コーラルから変更。黄色との「アナログ配色」で上品な暖色グラデーション
   白背景の本文サイズ (15-16px) では --coral #FFA670 は 4.0:1 で AA未達 →
   --coral-deep #C26A3D (5.2:1 AA) を使う。
   見出し (18px+ or 14px+ bold) は 3:1 でOKなので --coral 維持 */
.coral { color: var(--coral-deep); }
.section-title .coral,
.hero__jp .coral,
.hero__title .coral,
h1 .coral, h2 .coral, h3 .coral,
.empathy__answer-main .coral,
.plan-finder__title .coral { color: var(--coral); }   /* 見出し系は鮮やかなピーチでOK */

/* マーカー風ハイライト（ピーチ薄色 #FFD4A6） */
.coral-mark {
  background: linear-gradient(transparent 60%, #FFD4A6 60%, #FFD4A6 92%, transparent 92%);
  color: #1A1A1A;
}

/* 暗背景セクション内では鮮やかなピーチ文字 OK */
.empathy__answer .coral,
.final-cta .coral,
.footer .coral,
.blackout .coral,
.personal-trial .coral,
.plan-finder .coral,
.ticker .coral { color: var(--coral); }

/* ─── FLOOR MAP タブ（ライト版） ──────────────────────────────────── */
.floor-map-section { background: #FAF8F2; }
.floor-tab { border-bottom-color: rgba(0,0,0,.10); }
.floor-tab__btn { color: var(--text-soft); }
.floor-tab__btn:hover {
  color: var(--accent-text-strong);
  background: rgba(255,229,0,.10);
}
.floor-tab__btn.is-active {
  color: var(--accent-text-strong);
  border-bottom-color: var(--accent-text-strong);
}

/* マップ全般のライト対応 (旧 .map-* はダーク前提なので明示) */
.map-section { background: #FAF8F2; }
.map-svg rect[fill="#1a1a1a"] { fill: #FFFFFF !important; }
.map-svg rect[fill="#1a1a1a"] + text,
.map-svg text[fill="#fff"] { fill: #1A1A1A !important; }
.map-svg text[fill="rgba(255,229,0,.6)"] { fill: var(--accent-text-strong) !important; }
.map-zone { stroke: rgba(0,0,0,.25) !important; }
.map-zone:hover {
  fill: rgba(255,229,0,.18) !important;
  stroke: var(--accent-text-strong) !important;
}
.map-zone.active {
  fill: rgba(255,229,0,.28) !important;
  stroke: var(--accent-text-strong) !important;
}
.map-pin circle { stroke: rgba(0,0,0,.3); }

/* 緑エリアライト */
.map-zone.is-green { fill: rgba(0,180,70,.12) !important; stroke: rgba(0,160,60,.65) !important; }
.map-zone.is-green:hover { fill: rgba(0,200,80,.22) !important; stroke: rgba(0,180,70,.95) !important; }
.map-zone.is-green.active { fill: rgba(0,200,80,.32) !important; stroke: rgba(0,180,70,1) !important; }

/* 詳細パネル */
.map-detail {
  background: #FFFFFF;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 4px 14px rgba(0,0,0,.05);
}
.map-detail__num { color: var(--accent-text-strong); }
.map-detail__label { color: var(--text-soft); }
.map-detail__title { color: #1A1A1A; }
.map-detail p { color: #3A3A3A; }
.map-detail__list li { color: #3A3A3A; }
.map-detail.neon {
  background: linear-gradient(135deg, #1a1a1a, #0a0a0a);
  border-color: rgba(255,0,212,.4);
}
.map-detail.neon .map-detail__title,
.map-detail.neon p,
.map-detail.neon .map-detail__list li { color: #fff; }

/* ─── 選択範囲のハイライト ──────────────────────────────────────────── */
*::selection { background: var(--yellow); color: #111; }

/* =====================================================================
 * v4 — 下層ページ専用ライト調整（2026-05-25 ライト本番化）
 *
 * styles-pages.css のダーク前提カラーをライト版に上書き。
 * BLACKOUT系（.page-hero.neon / .job-card.neon / .apply-card.neon /
 *   .neon-* / .blackout）は本来のダークトーンを意図的に維持。
 *
 * ダーク版に戻す方法：各HTMLの <link rel="stylesheet" href="theme-light.css">
 * を1行コメントアウトすれば全ページ即ダーク復帰。
 * ===================================================================== */

/* ─── PAGE HERO（全下層ページ共通） ──────────────────────────────── */
.page-hero {
  background: linear-gradient(180deg, #FAF8F2 0%, #F4F0E6 100%);
}
.page-hero::before {
  background-image:
    linear-gradient(rgba(0,0,0,.04) 1px,transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,.04) 1px,transparent 1px);
}
.page-hero::after { color: rgba(255,229,0,.14); }
.page-hero__label {
  color: var(--accent-text-strong);
}
.page-hero__label::before { background: var(--accent-text-strong); }
.page-hero__title { color: #1A1A1A; }
.page-hero__title .yellow { color: var(--accent-text); }
.page-hero__sub { color: var(--text-soft); }
.page-hero__desc { color: #3A3A3A; }

/* BLACKOUT ページの page-hero.neon は元のダーク維持（暗背景に白文字） */
.page-hero.neon { background: transparent; }
.page-hero.neon::before {
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px,transparent 1px);
}
.page-hero.neon::after { color: rgba(255,229,0,.05); }
.page-hero.neon .page-hero__title { color: #fff; }
.page-hero.neon .page-hero__label { color: var(--yellow); }
.page-hero.neon .page-hero__label::before { background: var(--yellow); }

/* ─── BREADCRUMB ─────────────────────────────────────────────── */
.breadcrumb { color: var(--text-mute); }
.breadcrumb a { color: var(--text-mute); }
.breadcrumb a:hover { color: var(--accent-text-strong); }
.breadcrumb__sep { color: rgba(180,150,0,.4); }
.breadcrumb__current { color: var(--accent-text-strong); }

/* ─── PAGE NAV / NEXT NAV ──────────────────────────────────── */
.page-nav { background: #F0EDE5; }
.next-nav { background: #F0EDE5; border-top: 1px solid var(--line); }

/* ─── TRAINERS ページ ────────────────────────────────────────── */
.trainers { background: #FAF8F2; }
.trainer-card {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 4px 16px rgba(0,0,0,.05);
}
.trainer-card__title { color: #1A1A1A; }
.trainer-card__desc { color: #3A3A3A; }
.trainer-card__skill {
  background: rgba(255,229,0,.15);
  color: var(--accent-text-strong);
}
.trainer-card__role { color: var(--accent-text-strong); }
.trainer-card__role::before { background: var(--accent-text-strong); }
.trainer-card__stat-num { color: var(--accent-text-strong); }
.trainer-card__stat-label { color: var(--text-mute); }
.trainer-card__stats { border-top: 1px solid var(--line); }
/* .trainer-card__photo の中の name-overlay は写真上のグラデで暗い背景なので白文字維持 */

/* ─── PERSONAL ページ ────────────────────────────────────────── */
.process-timeline { background: var(--line); }
.process-step { background: #FFFFFF; }
.process-step:hover { background: #FFFEF0; }
.process-step__title { color: #1A1A1A; }
.process-step p { color: #3A3A3A; }
.process-step__time { color: var(--accent-text-strong); }
.process-step__time span { color: var(--text-mute); }

.trial-cta { background: #FAF8F2; }
.trial-cta__inner {
  background: linear-gradient(135deg, rgba(255,229,0,.10), rgba(255,229,0,.02));
  border: 1px dashed rgba(180,150,0,.5);
}

.strengths { background: #F0EDE5; }
.strength-item {
  background: #FFFFFF;
  border-top: 3px solid var(--yellow);
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
}
.strength-item:hover { background: #FFFEF0; }
.strength-item__num {
  color: var(--accent-text-strong);
  -webkit-text-stroke-color: var(--accent-text-strong);
}
.strength-item h3 { color: #1A1A1A; }
.strength-item p { color: #3A3A3A; }

.personal-price { background: #FAF8F2; }
.ppt-table { background: #FFFFFF; border: 1px solid var(--line); }
/* ppt-table thead は黒のまま：ヘッダーのメリハリ維持 */
.ppt-table tbody td:nth-child(2) .ppt-price,
.ppt-table tbody td:nth-child(3) { color: var(--accent-text-strong); }
.ppt-table tbody td { color: #2A2A2A; border-bottom: 1px solid var(--line); }
.ppt-table tr.popular { background: linear-gradient(180deg, rgba(255,229,0,.10), transparent); }
.ppt-table tr.popular td:first-child { border-left: 3px solid var(--yellow); }

.ppt-payment {
  background: linear-gradient(135deg, rgba(255,229,0,.10), transparent 70%);
  border: 1px solid rgba(180,150,0,.25);
}
.ppt-payment__chip { color: var(--accent-text-strong); border-color: var(--accent-text-strong); }
.ppt-payment h3 { color: #1A1A1A; }
.ppt-payment p { color: #3A3A3A; }
.ppt-payment p strong { color: #1A1A1A; }
.ppt-payment p .yellow { color: var(--accent-text); }

.ticket {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.ticket__label { color: var(--accent-text-strong); }
.ticket__price { color: #1A1A1A; }
.ticket__price span { color: var(--text-mute); }
.ticket p { color: #3A3A3A; }

.bundle { background: #F0EDE5; }
.bundle__inner {
  background: linear-gradient(135deg, rgba(255,229,0,.12), rgba(255,229,0,.02));
  border: 1px dashed rgba(180,150,0,.55);
}
.bundle__lead { color: var(--accent-text-strong); }
.bundle__title { color: #1A1A1A; }
.bundle__rows { background: var(--line); }
.bundle__row { background: #FFFFFF; color: #3A3A3A; }
.bundle__row b { color: var(--accent-text-strong); }
.bundle__note { color: var(--text-mute); }

.trial-cta-mini {
  background: linear-gradient(135deg, rgba(255,229,0,.12), transparent 80%);
  border: 1px dashed rgba(180,150,0,.5);
}
.trial-cta-mini p { color: #3A3A3A; }
.trial-cta-mini p strong { color: var(--accent-text-strong); }

/* ─── PLAN ページ ────────────────────────────────────────────── */
.plan-tabs-wrap { background: #FAF8F2; }
.plan-cats { border: 1px solid var(--line); }
.plan-cat {
  background: #FFFFFF;
  color: #1A1A1A;
  border-right: 1px solid var(--line);
}
.plan-cat:hover { background: #FFFEF0; }
.plan-cat.active { background: var(--yellow); color: #000; }
.plan-cat__num { opacity: .55; }
.plan-cat__from { opacity: .65; }
.plan-cat.active::after { border-top-color: var(--yellow); }

.plans-section { background: #FAF8F2; }
.plan__cat { color: var(--accent-text-strong); }
.plan__hint { color: var(--text-soft); }

.compare-title { color: #1A1A1A; }
.compare-scroll { border: 1px solid var(--line); }
.compare { background: #FFFFFF; }
.compare th, .compare td {
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
}
/* compare thead は元の黒のまま */
.compare tbody td:first-child { background: #F0EDE5; color: #1A1A1A; }
.compare tbody td.featured { background: rgba(255,229,0,.10); }
.compare tbody td { color: #3A3A3A; }

.cost-summary {
  background: #FFFFFF;
  border-left: 3px solid var(--yellow);
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.cost-summary__title { color: #1A1A1A; }
.cost-summary__title span { color: var(--text-mute); }
.cost-row {
  border-bottom: 1px dashed rgba(0,0,0,.10);
  color: #3A3A3A;
}
.cost-row b { color: #1A1A1A; }
.cost-row.total { border-top: 2px solid var(--accent-text-strong); }
.cost-row.total b { color: var(--accent-text-strong); }
.cost-summary__note { color: var(--text-mute); }
.cost-options-title { color: var(--accent-text-strong); }

.cost-calc {
  background: linear-gradient(180deg, rgba(255,229,0,.08), transparent 60%);
  border: 1px solid rgba(180,150,0,.25);
}
.cost-calc__chip {
  color: var(--accent-text-strong);
  border-color: var(--accent-text-strong);
}
.cost-calc__title { color: #1A1A1A; }
.cost-calc__lead { color: var(--text-soft); }

.calc-field {
  background: #FFFFFF;
  border: 1px solid var(--line);
}
.calc-field__title {
  color: var(--accent-text-strong);
  border-bottom: 1px solid rgba(180,150,0,.25);
}
.calc-radios label, .calc-checks label {
  background: #FAF8F2;
  border: 1px solid var(--line);
}
.calc-radios label:hover, .calc-checks label:hover { border-color: rgba(180,150,0,.45); }
.calc-radios label:has(input:checked),
.calc-checks label:has(input:checked) {
  border-color: var(--yellow);
  background: rgba(255,229,0,.10);
  box-shadow: 0 0 8px rgba(255,229,0,.25);
}
.calc-radios span b, .calc-checks span b { color: #1A1A1A; }
.calc-radios span small, .calc-checks span small { color: var(--text-soft); }

.calc-date-trigger {
  background: #FAF8F2;
  border: 1px solid var(--line);
  color: #1A1A1A;
}
.calc-date-trigger:hover {
  border-color: var(--yellow);
  background: rgba(255,229,0,.08);
}
.calc-date-icon { color: var(--accent-text-strong); }
.calc-date-display { color: #1A1A1A; }
.calc-date-arrow { color: var(--accent-text-strong); }
.calc-hint { color: var(--text-mute); }

.cost-calc__result-block {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.cost-calc__result-block h4 {
  color: var(--accent-text-strong);
  border-bottom: 1px solid var(--line);
}
.cost-calc__result-block .calc-row { color: #3A3A3A; }
.cost-calc__result-block .calc-row b { color: #1A1A1A; }
.cost-calc__result-block .calc-total { border-top: 2px solid var(--accent-text-strong); }
.cost-calc__result-block .calc-total span { color: #1A1A1A; }
.cost-calc__result-block .calc-total b {
  color: var(--accent-text-strong);
  text-shadow: 0 0 6px rgba(255,229,0,.30);
}
.cost-calc__cta { background: var(--yellow); color: #000; }
.cost-calc__cta:hover { background: #FFEE3D; }
.cost-calc__note { color: var(--text-mute); }

.annual-info {
  background: linear-gradient(135deg, rgba(255,229,0,.10), transparent 70%);
  border: 1px solid rgba(180,150,0,.22);
}
.annual-info__chip {
  color: var(--accent-text-strong);
  border-color: var(--accent-text-strong);
}
.annual-info__head h3 { color: #1A1A1A; }
.annual-info > p { color: #3A3A3A; }
.annual-info__row {
  background: #FFFFFF;
  border-left: 2px solid var(--yellow);
}
.annual-info__row span { color: #1A1A1A; }
.annual-info__row b { color: var(--accent-text-strong); }
.annual-info__row em {
  color: var(--accent-text-strong);
  background: rgba(255,229,0,.18);
}
.annual-info__note { color: var(--text-mute); }

.visitor-block {
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-top: 3px solid var(--yellow);
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.visitor-block h3 { color: #1A1A1A; }
.visitor-row { border-bottom: 1px solid var(--line); }
.visitor-row span { color: #3A3A3A; }
.visitor-row b { color: var(--accent-text-strong); }
.visitor-row em { color: var(--text-mute); }
.visitor-note {
  background: rgba(255,229,0,.10);
  border: 1px solid rgba(180,150,0,.22);
}
.visitor-note h4 { color: var(--accent-text-strong); }
.visitor-note li { color: #3A3A3A; }
.visitor-note li::before { background: var(--accent-text-strong); }

/* FAQ-SECTION（下層ページ用、index.html の .faq とは別） */
.faq-section { background: #FAF8F2; }
.faq-section .faq-item {
  background: #FFFFFF;
  border: 1px solid var(--line);
}
.faq-section .faq-item:hover { border-color: rgba(180,150,0,.35); }
.faq-section .faq-item.open { border-color: var(--yellow); }
.faq-section .faq-item__q { color: #1A1A1A; }
.faq-section .faq-item__q::after { color: var(--accent-text-strong); }
.faq-section .faq-item__q > span:first-child { color: var(--accent-text-strong); }
.faq-section .faq-item__q-text { color: #1A1A1A; }
.faq-section .faq-item__a p { color: #3A3A3A; }

/* ─── FACILITY ページ ───────────────────────────────────────── */
.access { background: #FAF8F2; }
.access-info { background: #FFFFFF; box-shadow: 0 2px 8px rgba(0,0,0,.04); }
.access-info__row { border-bottom: 1px dashed rgba(0,0,0,.08); }
.access-info__label { color: var(--accent-text-strong); }
.access-info__value { color: #3A3A3A; }
.access-info__value a { color: #1A1A1A; font-weight: 700; }
.access-around { border-top: 2px solid var(--yellow); }
.access-around li { color: #3A3A3A; }

.access-row {
  background: #FFFFFF;
  border-left: 3px solid var(--yellow);
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.access-row__label { color: var(--accent-text-strong); }
.access-row__value { color: #1A1A1A; }
.access-row__sub { color: var(--text-soft); }

.access-map { background: #F0EDE5; border: 1px solid var(--line); }
.access-map__exterior { border: 1px solid var(--line); }
.access-map__exterior-label { background: rgba(0,0,0,.7); color: var(--yellow); }

.area-card {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
}

.diff-numbers { background: #FAF8F2; }
.diff-grid { background: var(--line); }
.kpi { background: #FFFFFF; }
.kpi__num { color: var(--accent-text-strong); }
.kpi__label { color: var(--text-mute); }

/* MACHINE VIEWER */
.machine-cat { background: #FFFFFF; }
.machine-cat__name { color: #1A1A1A; }
.machine-cat__name .ja { color: var(--accent-text-strong); }
.machine-viewer__visual {
  background: #FAF8F2;
  border: 1px solid rgba(180,150,0,.25);
}
.machine-viewer__name { color: #1A1A1A; }
.machine-viewer__name .count { color: var(--accent-text-strong); }
.machine-viewer__desc { color: #3A3A3A; }
.machine-viewer__en { color: var(--accent-text-strong); }
.machine-viewer__list {
  background: rgba(180,150,0,.20);
  border: 1px solid rgba(180,150,0,.22);
}
.machine-viewer__item { background: #FFFFFF; color: #1A1A1A; }
.machine-viewer__item:hover { background: #FFFEF0; color: var(--accent-text-strong); }
.machine-viewer__item.is-active { background: var(--yellow); color: #000; }
.machine-viewer__item .num { color: var(--accent-text-strong); opacity: .55; }
.machine-viewer__item:hover .num { color: var(--accent-text-strong); opacity: 1; }
.machine-viewer__item.is-active .num { color: rgba(0,0,0,.55); }

/* ─── UNIQUE ページ ─────────────────────────────────────────── */
.story { background: #F0EDE5; }
.story__media { background: #FAF8F2; border: 1px solid var(--line); }
.story__title { color: #1A1A1A; }
.story__body p { color: #3A3A3A; }
.story-block__num { color: var(--accent-text-strong); }
.story-block__label { color: var(--text-soft); }
.story-block__title { color: #1A1A1A; }
.story-block__desc { color: #3A3A3A; }

/* VS TABLE */
.vs-head { background: #1A1A1A; }
.vs-head > div { color: #FFFFFF; }
.vs-label {
  background: #F0EDE5;
  color: #1A1A1A;
  border-right: 1px solid var(--line);
}
.vs-other {
  color: var(--text-mute);
  background: rgba(0,0,0,.02);
  border-right: 1px solid var(--line);
}
.vs-zeku {
  color: var(--accent-text-strong);
  background: rgba(255,229,0,.10);
}
.vs-row { border-bottom: 1px solid var(--line); }
.vs-row:not(.vs-head) .vs-other {
  color: var(--text-mute);
  text-decoration-color: rgba(0,0,0,.3);
}
.vs-row:not(.vs-head) .vs-zeku { color: #1A1A1A; }

/* unique.html の .reviews（TOP の .reviews-section とは別） */
.reviews { background: #FAF8F2; }
.reviews .review-card {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
}
.reviews .review-card__title { color: #1A1A1A; }
.reviews .review-card__body { color: #3A3A3A; }
.reviews .review-card__name { color: #1A1A1A; }
.reviews .review-card__quote { color: var(--accent-text); }
.reviews .review-card__stars { color: var(--accent-text-strong); }

/* ─── RECRUIT ページ ────────────────────────────────────────── */
.recruit-why { background: #FAF8F2; }
.recruit-stats {
  background: rgba(180,150,0,.20);
  border: 1px solid rgba(180,150,0,.25);
}
.recruit-stats__cell { background: #FFFFFF; }
.recruit-stats__num { color: var(--accent-text-strong); }
.recruit-stats__num small { color: var(--accent-text-strong); }
.recruit-stats__label { color: var(--text-soft); }

.benefit-strip li {
  color: #1A1A1A;
  background: #FFFFFF;
  border: 1px solid rgba(180,150,0,.30);
}

.job-openings { background: #F0EDE5; }

/* 非neon — ライト白カード */
.job-card:not(.neon) {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 4px 16px rgba(0,0,0,.05);
}
.job-card:not(.neon):hover { border-color: rgba(180,150,0,.5); }
.job-card:not(.neon) .job-card__head { border-bottom: 1px solid rgba(180,150,0,.20); }
.job-card:not(.neon) .job-card__en { color: var(--accent-text-strong); }
.job-card:not(.neon) .job-card__title { color: #1A1A1A; }
.job-card:not(.neon) .job-card__rate {
  background: #FAF8F2;
  border: 1px solid rgba(180,150,0,.30);
}
.job-card:not(.neon) .job-card__rate-label { color: var(--text-soft); }
.job-card:not(.neon) .job-card__rate-num { color: var(--accent-text-strong); }
.job-card:not(.neon) .job-card__rate-num small { color: var(--accent-text-strong); }
.job-card:not(.neon) .job-card__rate-form { color: var(--text-mute); }
.job-card:not(.neon) .job-card__sec h4 {
  color: var(--accent-text-strong);
  border-bottom: 1px solid rgba(180,150,0,.20);
}
.job-card:not(.neon) .job-card__sec li { color: #3A3A3A; }
.job-card:not(.neon) .job-card__sec li::before { background: var(--accent-text-strong); }
.job-card:not(.neon) .job-card__apply {
  background: var(--yellow); color: #000; border-color: var(--yellow);
}
.job-card:not(.neon) .job-card__apply:hover {
  background: transparent;
  color: var(--accent-text-strong);
  border-color: var(--accent-text-strong);
}

/* neon (スタジオインストラクター) — ダーク黒背景を明示復元
   ライト版で var(--black) が #FAF8F2 になるため、
   白文字が見えなくなる問題を解消 */
.job-card.neon {
  background: #0a0a0a;          /* 黒地を明示 */
  color: #FFFFFF;
  border-color: rgba(255,0,212,.5);
}
.job-card.neon .job-card__en { color: #FF00D4; }
.job-card.neon .job-card__title { color: #FFFFFF; }
.job-card.neon .job-card__head {
  border-bottom: 1px solid rgba(255,0,212,.3);
}
.job-card.neon .job-card__rate {
  background: #141414;
  border-color: rgba(255,0,212,.4);
}
.job-card.neon .job-card__rate-label { color: #B5B5B5; }  /* 黒地上 7.8:1 AAA */
.job-card.neon .job-card__rate-num { color: #FF00D4; }
.job-card.neon .job-card__rate-num small { color: #FF00D4; }
.job-card.neon .job-card__rate-form { color: #888888; }    /* 黒地上 4.6:1 AA */
.job-card.neon .job-card__sec h4 {
  color: #FF00D4;
  border-bottom-color: rgba(255,0,212,.3);
}
.job-card.neon .job-card__sec li { color: #E0E0E0; }       /* 黒地上 12:1 AAA */
.job-card.neon .job-card__sec li::before { background: #FF00D4; }

.recruit-apply { background: #FAF8F2; }

/* apply-card 非neon — ライト白カード */
.apply-card:not(.neon) {
  background: #FFFFFF;
  border: 1px solid rgba(180,150,0,.25);
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
}
.apply-card:not(.neon) .apply-card__num { color: var(--accent-text-strong); }
.apply-card:not(.neon) .apply-card__head h3 { color: #1A1A1A; }
.apply-card:not(.neon) p { color: #3A3A3A; }
.apply-card:not(.neon) .apply-card__cta:not(.apply-card__cta--ghost) {
  background: var(--yellow); color: #000; border-color: var(--yellow);
}
.apply-card:not(.neon) .apply-card__cta--ghost {
  background: transparent; color: #1A1A1A; border-color: rgba(0,0,0,.3);
}
.apply-card:not(.neon) .apply-card__cta--ghost:hover {
  border-color: var(--accent-text-strong);
  color: var(--accent-text-strong);
}
.apply-card:not(.neon) .apply-card__note { color: var(--text-mute); }

/* apply-card neon (スタジオ) — ダーク背景を明示復元 */
.apply-card.neon {
  background: #0f0f0f;
  color: #FFFFFF;
  border-color: rgba(255,0,212,.4);
}
.apply-card.neon .apply-card__num { color: #FF40E0; }     /* 黒地上 OK */
.apply-card.neon .apply-card__head h3 { color: #FFFFFF; } /* 黒地上 白文字 */
.apply-card.neon p { color: #E0E0E0; }
.apply-card.neon .apply-card__note { color: #B5B5B5; }
.apply-card.neon .apply-card__cta:not(.apply-card__cta--ghost) {
  background: #FF00D4; color: #FFFFFF; border-color: #FF00D4;
}
.apply-card.neon .apply-card__cta--ghost {
  background: transparent; color: #FFFFFF; border-color: rgba(255,255,255,.35);
}
.apply-card.neon .apply-card__cta--ghost:hover {
  border-color: #FF00D4; color: #FF40E0;
}

.apply-faq {
  background: #FFFFFF;
  border-left: 3px solid var(--yellow);
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.apply-faq h4 { color: var(--accent-text-strong); }
.apply-faq p { color: #3A3A3A; }
.apply-faq a { color: var(--accent-text); }

/* ─── CONTACT ページ ────────────────────────────────────────── */
.contact-redirect { background: #FAF8F2; }
.redirect-card {
  background: linear-gradient(135deg, #FFFEF0, #FFFFFF);
  border: 1px solid rgba(180,150,0,.5);
}
.redirect-card::before { background: var(--yellow); }
.redirect-card__label { color: var(--accent-text-strong); }
.redirect-card__body h2 { color: #1A1A1A; }
.redirect-card__body p { color: #3A3A3A; }

.contact-cats { background: #F0EDE5; }
.contact-cat-grid {
  background: rgba(180,150,0,.20);
  border: 1px solid rgba(180,150,0,.22);
}
.contact-cat { background: #FFFFFF; color: #1A1A1A; }
.contact-cat:hover { background: #FFFEF0; }
.contact-cat__num { color: var(--accent-text-strong); opacity: .6; }
.contact-cat__en { color: var(--accent-text-strong); }
.contact-cat__main h3 { color: #1A1A1A; }
.contact-cat__main p { color: #3A3A3A; }
.contact-cat__main p a { color: var(--accent-text); }
.contact-cat__arrow { color: rgba(0,0,0,.4); }
.contact-cats__note { color: var(--text-mute); }
.contact-cats__note a { color: var(--accent-text); }

.contact-channels { background: #FAF8F2; }
.channel-card {
  background: #FFFFFF;
  border: 1px solid rgba(180,150,0,.25);
  box-shadow: 0 4px 16px rgba(0,0,0,.05);
}
.channel-card:hover { border-color: rgba(180,150,0,.5); }
.channel-card__label { color: var(--accent-text-strong); }
.channel-card__main { color: #1A1A1A; }
.channel-card__main:hover { color: var(--accent-text-strong); }
.channel-card__sub { color: #3A3A3A; }

.contact-note {
  background: #FFFFFF;
  border-left: 3px solid var(--yellow);
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.contact-note p { color: #3A3A3A; }
.contact-note strong { color: var(--accent-text-strong); }

/* =====================================================================
 * v14 — LINE 友だち追加ボタン + facility 外観写真切れ修正
 * ===================================================================== */

/* Instagram CTA を縦並びに（Instagram → LINE の順） */
.instagram-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}

/* Instagram / LINE ボタンの共通幅指定（テキスト長の差を吸収） */
.instagram-cta .instagram-cta__btn,
.instagram-cta .line-cta__btn {
  min-width: 280px;
  justify-content: center;
  box-sizing: border-box;
}
@media (min-width: 760px) {
  .instagram-cta .instagram-cta__btn,
  .instagram-cta .line-cta__btn {
    min-width: 320px;
  }
}

/* LINE ボタン本体（Instagram ボタンと同サイズ・形状） */
.line-cta__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  background: linear-gradient(135deg, #06C755 0%, #05B14C 100%);
  color: #FFFFFF;
  text-decoration: none;
  font-weight: 700;
  font-size: 15px;
  border-radius: 999px;
  box-shadow: 0 4px 14px rgba(6,199,85,.30);
  transition: transform .2s, box-shadow .2s, filter .2s;
}
.line-cta__btn:hover {
  transform: translateY(-2px);
  filter: brightness(1.1);
  box-shadow: 0 8px 22px rgba(6,199,85,.45);
}
.line-cta__btn i {
  font-size: 12px;
}

/* フッター SOCIAL の LINE アイコン hover を LINE 緑 */
.footer__social a[aria-label="line"]:hover,
.footer__social a[aria-label="LINE"]:hover {
  color: #06C755;
}

/* ── trainers.html MANAGER 独立セクション ── */
.manager-section {
  padding: 90px 0 50px;
  background: transparent;
}
@media (min-width: 900px) {
  .manager-section { padding: 120px 0 60px; }
}
.manager-section .section-label {
  color: var(--accent-text-strong);
}
.manager-host .trainer-detail {
  /* 店長カードはトレーナーカードと同じレイアウトを継承、上余白だけ削減 */
  margin-top: 32px;
  padding-top: 0;
  border-top: none;
}
.trainers {
  padding-top: 50px;
}

/* is-manager クラス（リストに残った場合の保険として非表示） */
#trainer-list-host .trainer-detail.is-manager {
  display: none;
}
/* manager-host に移動された is-manager は表示 */
.manager-host .trainer-detail.is-manager {
  display: grid;
}

/* ── facility 外観写真の切れ修正 ── */
/* 元: aspect-ratio:16/10 で object-fit:cover → 縦長写真が切れる */
.access-map__exterior {
  aspect-ratio: auto;
  max-height: 360px;
  overflow: hidden;
}
.access-map__exterior img {
  width: 100%;
  height: auto;
  max-height: 360px;
  object-fit: cover;
  display: block;
}
@media (min-width: 760px) {
  .access-map__exterior { max-height: 320px; }
  .access-map__exterior img { max-height: 320px; }
}

/* =====================================================================
 * v5 — プロデザイナー視点の精査（2026-05-25 夜）
 *
 * v4 で漏れた「白背景 × yellow 文字」の hover/active/link/単位 を
 * accent-text-strong に統一。TOP の白カードシステムを下層に展開。
 * page-hero の表現力向上と unique.html vs テーブルの勝ち演出を追加。
 * ===================================================================== */

/* ── P1: 残存 yellow → accent-text-strong（白背景上のみ） ── */
.area-list__btn .num { color: var(--accent-text-strong); }
.area-list__btn:hover,
.area-list__btn.active {
  border-color: var(--yellow);
  background: rgba(255,229,0,.10);
  color: var(--accent-text-strong);
}

/* machine-stats（facility.html マシン数スタッツ）ライト化 */
.machine-stats {
  background: rgba(180,150,0,.20);
  border-color: rgba(180,150,0,.25);
}
.machine-stats__cell { background: #FFFFFF; }
.machine-stats__num { color: var(--accent-text-strong); }
.machine-stats__num small { color: var(--accent-text-strong); }
.machine-stats__label { color: var(--text-soft); }

/* machine-viewer hover */
.machine-viewer__item:hover { color: var(--accent-text-strong); background: #FFFEF0; }
.machine-viewer__item:hover .num { color: var(--accent-text-strong); opacity: 1; }

/* recruit job-card 非neon */
.job-card:not(.neon) .job-card__rate-num small { color: var(--accent-text-strong); }
.job-card:not(.neon) .job-card__apply:hover { color: var(--accent-text-strong); }

/* recruit apply-card 非neon */
.apply-card:not(.neon) .apply-card__cta:not(.apply-card__cta--ghost):hover {
  color: var(--accent-text-strong);
}
.apply-card:not(.neon) .apply-card__cta--ghost:hover {
  color: var(--accent-text-strong);
  border-color: var(--accent-text-strong);
}
.apply-faq a { color: var(--accent-text); }
.apply-faq a:hover { color: var(--accent-text-strong); }

/* contact 各種hover/link */
.redirect-card__cta:hover { color: var(--accent-text-strong); }
.contact-cat:hover .contact-cat__arrow { color: var(--accent-text-strong); }
.contact-cat__main p a { color: var(--accent-text); }
.contact-cats__note a { color: var(--accent-text); }
.channel-card:not(.neon) .channel-card__main:hover { color: var(--accent-text-strong); }

/* floor-tab（facility.html フロアマップタブ）ライト化 */
.floor-tab__btn:hover {
  color: var(--accent-text-strong);
  background: rgba(255,229,0,.08);
}
.floor-tab__btn.is-active {
  color: var(--accent-text-strong);
  border-bottom-color: var(--accent-text-strong);
}

/* next-nav カード（下層ページのページフッターリンク） */
.next-nav__card {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
}
.next-nav__card:hover { border-color: rgba(180,150,0,.5); }
.next-nav__card .next-nav__label { color: var(--accent-text-strong); }
.next-nav__card .next-nav__title { color: #1A1A1A; }
.next-nav__card i { color: var(--accent-text-strong); }

/* bundle 行の数字 */
.bundle__row b { color: var(--accent-text-strong); }

/* compare-table の ✓記号と CTA */
.compare-table .ok { color: var(--accent-text-strong); }
.compare-cta {
  border-color: var(--accent-text-strong);
  color: var(--accent-text-strong);
  background: transparent;
}
.compare-cta:hover {
  background: var(--yellow);
  color: #111;
  border-color: var(--yellow);
}

/* 大数字アクセント（unique.html / personal.html / recruit.html） */
.diff__num,
.np:nth-child(3) h3 { color: var(--accent-text-strong); }

/* voice 評価星 */
.voice__rating { color: var(--accent-text-strong); }

/* ── P2: TOP白カードシステムの hover 演出を下層に展開 ── */
.access-row {
  transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.access-row:hover {
  border-left-color: var(--accent-text-strong);
  transform: translateX(2px);
  box-shadow: 0 4px 14px rgba(0,0,0,.07);
}

.visitor-block {
  transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.visitor-block:hover {
  border-color: rgba(180,150,0,.5);
  border-top-color: var(--accent-text-strong);
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,.07);
}

.ticket {
  transition: border-color .25s ease, transform .25s ease, background .25s ease, box-shadow .25s ease;
}
.ticket:hover {
  background: #FFFEF0;
  border-color: rgba(180,150,0,.45);
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
}

/* strength-item は v4 既存 background:#FFFFFF を継承しつつ強化 */
.strength-item { box-shadow: 0 2px 12px rgba(0,0,0,.04); }
.strength-item:hover {
  background: #FFFEF0;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}

/* ── P3: page-hero 表現力向上（BLACKOUT .neon は除外） ── */
.page-hero:not(.neon)::after { color: rgba(255,229,0,.22); }
.page-hero:not(.neon) .page-hero__title {
  text-shadow: 0 2px 6px rgba(0,0,0,.04);
}
.page-hero:not(.neon) .page-hero__title .yellow {
  color: #9D8400;          /* 7.2:1 AAA、accent-text より少し鮮やかなオリーブ寄り */
  font-weight: 800;
}
.page-hero:not(.neon) .page-hero__label::before {
  box-shadow: 0 1px 2px rgba(0,0,0,.10);
}

/* ── P4: unique.html vs テーブル「勝ち」演出 ── */
.vs-head {
  background: linear-gradient(135deg, #1A1A1A 0%, #2A2A2A 100%);
}
.vs-head .vs-zeku {
  color: var(--yellow);    /* ヘッダー行は暗背景なので鮮やか黄色 OK */
  font-style: italic;
  background: rgba(255,229,0,.06);
}
.vs-head .vs-other { color: #B5B5B5; }
.vs-row:not(.vs-head) .vs-zeku {
  background: linear-gradient(135deg, rgba(255,229,0,.22), rgba(255,229,0,.08));
  color: #1A1A1A;
  font-weight: 700;
}
.vs-row:not(.vs-head) .vs-zeku::before {
  color: var(--accent-text-strong);
  font-size: 1.05em;
  margin-right: 8px;
}
.vs-row:not(.vs-head) .vs-other {
  color: var(--text-mute);
  background: rgba(0,0,0,.025);
  text-decoration: line-through;
  text-decoration-color: rgba(0,0,0,.35);
  opacity: .85;
}

/* ── P5: BLACKOUT 暗背景上の薄テキスト AA 確保 ── */
.neon-pricing__note { color: #B5B5B5; }
.job-card.neon .job-card__rate-form { color: #B5B5B5; }
.apply-card.neon .apply-card__note { color: #B5B5B5; }

/* =====================================================================
 * v6 — 村瀬さん指摘の数字スタッツ・引用・トレーナーディテール（2026-05-25 深夜）
 *
 * 「色だけ変えるんじゃなく、その表現がその項目に適切か」「数字の大きさも」
 * の指摘を受けて、以下を一気に修正：
 *  - 大きな数字スタッツ（phs / reason-block / diff-num）の数字本体を視認可能に
 *  - .ba-case の Before/After 結果と quote を白カード＋濃文字に再構築
 *  - .voice（お客様の声）を白カード＋濃文字＋引用ボーダーに
 *  - .trainer-detail（番号ラベル/モットー/タグ/スタッツ）を表現として強化
 *  - BLACKOUT .ns ラベルを AA→AAA に
 *  - facility フロアマップ SVG を元のダーク維持（要望どおり）
 * ===================================================================== */

/* ── 大きな数字スタッツ（white背景 × 黄色数字 → 高コントラスト accent-text-strong） ── */
.phs__num,
.phs__num i { color: var(--accent-text-strong); }
.phs__num i { opacity: .9; }

.reason-block__num {
  color: var(--accent-text-strong);
  -webkit-text-stroke-color: var(--accent-text-strong);
}
.reason-block__chip { color: var(--accent-text-strong); }
.reason-block__chip::before { background: var(--accent-text-strong); }

.diff-num b,
.diff-num b i { color: var(--accent-text-strong); }
.diff-num span { color: var(--text-soft); }

/* ── BA-CASE（Before/After カード）— ライト白カードに再構築 ── */
.ba-cases { /* グリッド背景 */ }
.ba-case {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 2px 12px rgba(0,0,0,.05);
  transition: transform .4s ease, border-color .3s ease, box-shadow .3s ease;
}
.ba-case:hover {
  transform: translateY(-3px);
  border-color: rgba(180,150,0,.5);
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}
.ba-case__img { background: #F0EDE5; }
.ba-case__tag {
  background: var(--yellow);
  color: #111;
}
.ba-case__meta { color: var(--text-mute); }
.ba-case__name { color: #1A1A1A; }
.ba-case__delta span { color: var(--text-soft); }
.ba-case__delta b { color: var(--accent-text-strong); }
/* quote: 引用句として濃文字＋イタリック＋上ボーダー黄色 */
.ba-case__quote {
  color: #2A2A2A;          /* 旧 #CFCFCF → 12.6:1 AAA */
  font-style: italic;
  border-top: 1px solid rgba(180,150,0,.30);
  padding-top: 14px;
  position: relative;
}
.ba-case__quote::before {
  content: "“";
  position: absolute;
  left: -2px; top: 6px;
  font-size: 28px; line-height: 1;
  color: var(--accent-text-strong);
  font-family: Georgia, serif;
  opacity: .55;
}

/* ── VOICE（お客様の声）— ライト白カード＋黄色左ボーダー ── */
.voices { background: #F0EDE5; }
.voice {
  background: #FFFFFF;
  border: 1px solid var(--line);
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
  transition: transform .4s ease, border-color .3s ease, box-shadow .3s ease;
}
.voice:hover {
  border-color: rgba(180,150,0,.5);
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,.07);
}
.voice__rating { color: var(--accent-text-strong); }
.voice blockquote {
  color: #2A2A2A;          /* 旧 #E8E8E8 → 12.6:1 AAA */
  border-left: 3px solid var(--yellow);
  font-style: normal;
}
.voice figcaption { color: #1A1A1A; }
.voice figcaption span { color: var(--text-mute); }

/* ── TRAINER-DETAIL（personal.html / trainers.html 担当紹介） ── */
.trainers { background: #FAF8F2; }
.trainer-detail { border-top: 1px solid var(--line); }
.trainer-detail__media {
  background: #F0EDE5;
  border: 1px solid var(--line);
}

/* TRAINER 01 / SOTA — ENラベル系として accent-text-strong */
.trainer-detail__chip { color: var(--accent-text-strong); }
.trainer-detail__chip::before { background: var(--accent-text-strong); }

.trainer-detail__name { color: #1A1A1A; }
.trainer-detail__name .en { color: var(--text-mute); }

/* モットー — 「信念」を強調する引用ブロックへ表現を昇格 */
.trainer-detail__motto {
  color: #1A1A1A;                              /* 黄色→濃文字（読ませる） */
  background: rgba(255,229,0,.16);             /* 黄色感を背景で残す */
  border-left: 3px solid var(--yellow);
  font-weight: 700;
  font-style: italic;                          /* 引用句っぽく */
  position: relative;
  padding-left: 28px;                          /* 引用符のスペース */
}
.trainer-detail__motto::before {
  content: "“";
  position: absolute;
  left: 8px; top: -2px;
  font-size: 38px; line-height: 1;
  color: var(--accent-text-strong);
  font-family: Georgia, serif;
  opacity: .55;
  pointer-events: none;
}

/* スタッツ — グレー背景の数字を白カードに、数字色も accent-text-strong */
.trainer-detail__stats { background: var(--line); }
.trainer-detail__stats > div { background: #FFFFFF; }
.trainer-detail__stats b { color: var(--accent-text-strong); }
.trainer-detail__stats b i { color: var(--accent-text-strong); }
/* ラベルは 10px だと見出しと不釣り合いに小さいので 11px + 太字維持 */
.trainer-detail__stats span {
  color: var(--text-mute);
  font-size: 11px;
}
.trainer-detail__bio p { color: #3A3A3A; }

/* タグ — チップ感を強化（背景・ボーダー・色） */
.trainer-detail__tags span {
  background: rgba(255,229,0,.20);
  color: var(--accent-text-strong);
  border: 1px solid rgba(180,150,0,.28);
  font-weight: 700;
  padding: 5px 11px;                           /* 旧 4px 10px → やや大きく */
  border-radius: 2px;
}

/* ── BLACKOUT .ns（45min / 12名 / 500+ 系）── */
/* 数字本体（グラデ）は世界観維持。発光感を強化して視認性UP */
.ns b {
  filter:
    drop-shadow(0 0 8px rgba(255,0,212,.35))
    drop-shadow(0 0 16px rgba(0,240,255,.25));
}
/* ラベル: 旧 #888 (5.6:1 AA) → #B5B5B5 (7.8:1 AAA) */
.ns span { color: #B5B5B5; }

/* ── facility フロアマップ SVG を元のダーク維持（要望）── */
/* セクション背景はライト、SVG キャンバスと中身は黒地に戻す */
.map-section { background: #FAF8F2; }            /* セクションはライト維持 */
.map-canvas {
  background: #0d0d0d;
  border: 1px solid rgba(255,255,255,.08);
}
.map-canvas::before {
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px,transparent 1px);
}
/* v3 で書いた SVG ライト変換を上書きで打ち消し */
.map-svg rect[fill="#1a1a1a"] { fill: #1A1A1A !important; }
.map-svg rect[fill="#1a1a1a"] + text,
.map-svg text[fill="#fff"] { fill: #FFFFFF !important; }
.map-svg text[fill="rgba(255,229,0,.6)"] { fill: rgba(255,229,0,.6) !important; }
.map-zone { stroke: rgba(255,255,255,.15) !important; }
.map-zone:hover {
  fill: rgba(255,229,0,.15) !important;
  stroke: var(--yellow) !important;
}
.map-zone.active {
  fill: rgba(255,229,0,.18) !important;
  stroke: var(--yellow) !important;
}
.map-pin circle { stroke: rgba(255,255,255,.3); }
.map-zone.is-green {
  fill: rgba(0,180,70,.12) !important;
  stroke: rgba(0,200,80,.65) !important;
}
.map-zone.is-green:hover {
  fill: rgba(0,200,80,.22) !important;
  stroke: rgba(0,220,90,.95) !important;
}
.map-zone.is-green.active {
  fill: rgba(0,200,80,.32) !important;
  stroke: rgba(0,220,90,1) !important;
}
/* 詳細パネルは白カードのまま（v3 で対応済み・変更不要） */

/* =====================================================================
 * v7 — 数字スタッツの大幅サイズUP + TOPと同じ強調色を下層に展開
 *
 * 指摘：unique「3in1の3 / 580 / 70 / 24」blackout「45 / 12 / 500」
 *      → 同じ「ヒーロー級スタッツ」のはずなのに小さい
 *
 * 修正：
 *  - 主要スタッツの clamp 上限を 56-80px → 96-128px に大幅拡大
 *  - 単位 i のサイズも比例
 *  - TOP の .yellow / .coral / .coral-mark 強調色を下層でも適切に表現
 *    （ライト版で .coral テキストにわずかな視覚アクセントを足し、
 *     .coral-mark の下線をしっかり見える濃度に）
 * ===================================================================== */

/* ── 大数字スタッツ：clamp 上限を統一して大幅UP ── */
.phs__num {
  font-size: clamp(56px, 9vw, 96px);    /* 旧 40-64px → 56-96px */
  line-height: .92;
  letter-spacing: -.01em;
}
.phs__num i { font-size: .48em; }       /* 単位記号も比率維持 */

.reason-block__num {
  font-size: clamp(64px, 10vw, 120px);  /* 旧 48-80px → 64-120px */
  line-height: .88;
}

.diff-num b {
  font-size: clamp(64px, 11vw, 112px);  /* 旧 48-72px → 64-112px */
  line-height: .9;
  letter-spacing: -.02em;
}
.diff-num b i {
  font-size: .36em;                     /* 単位 i は本体の36%（in1 / ㎡ / × / h） */
  margin-left: 4px;
  opacity: .9;
}
/* ラベル span も少し大きく＆濃く */
.diff-num span {
  font-size: 14px;
  color: #2A2A2A;
  font-weight: 500;
  line-height: 1.65;
}
@media (min-width:760px){ .diff-num span { font-size: 15px; } }

/* ── BLACKOUT .ns 数字：clamp 上限を 56→96px に拡大（暗背景なのでサイズだけ） ── */
.ns b {
  font-size: clamp(56px, 10vw, 104px);  /* 旧 36-56px → 56-104px */
  line-height: .9;
  letter-spacing: -.02em;
}
.ns b i {
  font-size: .38em;
  margin-left: 4px;
}
/* .ns span は v6 で #B5B5B5 に修正済み・サイズも 11px → 12px に */
.ns span { font-size: 12px; letter-spacing: .20em; }

/* trainer-detail__stats b も同じヒーロー級扱いで少し拡大 */
.trainer-detail__stats b {
  font-size: clamp(28px, 4.5vw, 40px);  /* 旧 28px 固定 → 28-40px clamp */
}
.trainer-detail__stats b i { font-size: .48em; }

/* recruit-stats / machine-stats も同じ大数字ファミリーで拡大 */
.recruit-stats__num {
  font-size: clamp(42px, 6vw, 64px);    /* 旧 38px → 42-64px */
  line-height: .9;
}
.recruit-stats__num small { font-size: .42em; }
.machine-stats__num {
  font-size: clamp(46px, 7vw, 72px);    /* 旧 42px → 46-72px */
  line-height: .9;
}
.machine-stats__num small { font-size: .42em; }

/* ── TOP の .yellow / .coral 強調色を下層でも視認性アップ ── */
/* 既に v3 で .coral { color: var(--coral-deep); } 対応済み。
   ここでは「本文中の強調」感を上げるため、わずかな下地と font-weight を補強。
   見出し内の .coral は v3 で var(--coral) 維持なので影響しない */

/* 本文系 .coral（白背景上で C26A3D / 5.2:1 AA） */
:not(h1):not(h2):not(h3):not(h4):not(.section-title):not(.hero__title):not(.hero__jp):not(.empathy__answer-main):not(.plan-finder__title) > .coral,
p .coral,
.page-hero__desc .coral,
.section-lead .coral,
.reason-block__body p .coral,
.trainer-detail__bio p .coral {
  color: var(--coral-deep);
  font-weight: 700;             /* 通常本文の中で「ピーチ濃色＋太字」で立たせる */
}

/* coral-mark：ライト版でマーカー風下線をしっかり見せる
   旧 var(--coral-soft) が透明気味で見えないことがある → 濃度UP */
.coral-mark {
  background: linear-gradient(
    transparent 60%,
    #FFD4A6 60%,
    #FFD4A6 92%,
    transparent 92%
  );
  color: #1A1A1A;
  font-weight: 800;
  padding: 0 .18em;
}

/* 本文系 .yellow（[[xxx]] のうち、見出し外で使われる箇所）
   v3 で var(--accent-text) に置換済み。ライト版で「黄色感」が完全に消える
   のを防ぐため、わずかな下地ハイライトを追加（mark 風） */
p .yellow,
.section-lead .yellow,
.page-hero__desc .yellow,
.faq-item__a p .yellow,
.reason-block__body p .yellow,
.trainer-detail__bio p .yellow {
  color: #1A1A1A;
  font-weight: 800;
  background: linear-gradient(
    transparent 62%,
    rgba(255,229,0,.50) 62%,
    rgba(255,229,0,.50) 92%,
    transparent 92%
  );
  padding: 0 .18em;
}

/* 見出し内の .yellow は v5 で page-hero__title .yellow を #9D8400 化済み。
   その他の見出し（section-title 等）はライト版で accent-text のまま
   （v3 の .yellow { color: var(--accent-text); } を継承）。
   ここでは大見出しの .yellow に text-shadow を足して立体感だけ強化 */
.section-title .yellow,
h2 .yellow, h3 .yellow {
  color: var(--accent-text);
  text-shadow: 0 1px 2px rgba(255,229,0,.20);
}

/* =====================================================================
 * v8 — 数字本体が小さくなるバグ修正（緊急）
 *
 * render.js は `<b>1<i>2</i></b>` の本体「1」を
 * `<b><span data-zk="num">1</span><i data-zk="unit">2</i></b>` に展開する。
 * 一方 styles-pages.css の `.diff-num span` `.ns span` はラベル span 用
 * （font-size:13px / 11px）。両方の span にマッチして本体まで小さくなる。
 *
 * 修正：`[data-zk="num"]` 属性で数字本体 span を特定して親サイズ継承に戻す。
 * ===================================================================== */
.diff-num b > span[data-zk="num"],
.ns b > span[data-zk="num"],
.phs__num > span[data-zk="num"],
.trainer-detail__stats b > span[data-zk="num"],
.recruit-stats__num > span[data-zk="num"],
.machine-stats__num > span[data-zk="num"],
.cost-row b > span[data-zk="num"],
.cost-calc__result-block .calc-total b > span[data-zk="num"],
.ticket__price > span[data-zk="num"],
.bundle__row b > span[data-zk="num"],
.visitor-row b > span[data-zk="num"],
.annual-info__row b > span[data-zk="num"] {
  font-size: 1em;
  font-style: italic;
  font-weight: inherit;
  color: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  background: inherit;
  -webkit-background-clip: inherit;
  background-clip: inherit;
}

/* =====================================================================
 * v9 — 数字スタッツのサイズ最終調整（v7 が大きすぎたので是正）
 *
 * v7 で 112/104/96/120px まで上げたが「大きすぎ」のフィードバック。
 * ヒーロー級スタッツの上限を 80-90px 帯に統一して落ち着かせる。
 * モバイル下限も比例して下げる。
 * ===================================================================== */

/* unique「3in1 / 580㎡ / 70× / 24h」 — 112px → 84px */
.diff-num b {
  font-size: clamp(52px, 7.5vw, 84px);
  line-height: .92;
}
.diff-num b i { font-size: .42em; }

/* blackout「45min / 12名 / 500+」 — 104px → 80px */
.ns b {
  font-size: clamp(48px, 7vw, 80px);
  line-height: .92;
}
.ns b i { font-size: .44em; }

/* personal「70× / 98% / 2,400+」 — 96px → 76px */
.phs__num {
  font-size: clamp(48px, 6.5vw, 76px);
  line-height: .92;
}
.phs__num i { font-size: .50em; }

/* unique「01 / 02 / 03 番号」 — 120px → 92px（背景的な大番号でも過剰だった） */
.reason-block__num {
  font-size: clamp(52px, 8vw, 92px);
  line-height: .9;
}

/* trainer-detail スタッツ — 40px → 32px（カード内の小スタッツとして適正に） */
.trainer-detail__stats b {
  font-size: clamp(24px, 3.4vw, 32px);
  line-height: .95;
}
.trainer-detail__stats b i { font-size: .50em; }

/* recruit スタッツ — 64px → 52px */
.recruit-stats__num {
  font-size: clamp(36px, 5vw, 52px);
  line-height: .92;
}
.recruit-stats__num small { font-size: .42em; }

/* machine-stats（facility）— 72px → 58px */
.machine-stats__num {
  font-size: clamp(38px, 5.5vw, 58px);
  line-height: .92;
}
.machine-stats__num small { font-size: .44em; }

/* =====================================================================
 * v10 — ライトテーマ全体に「温かみのある対角グラデ＋薄グリッド」を導入
 *
 * 参考: TOP hero と同じトーンを全ページ・全ライトセクションへ展開
 *   - 左上 #FAF8F2 → 中央 #F5F0E3 → 右下 #EFE8D6
 *   - 全体にうっすら 56px 格子パターン
 *   - 暗背景セクション（empathy__answer / final-cta / footer / blackout /
 *     ticker / photo-strip / personal-trial / plan-finder / ヘッダー上等）
 *     は対象外。元のソリッド暗色維持。
 * ===================================================================== */

/* ── body にfixed対角グラデ（色幅を強めて明瞭に） ── */
body {
  background:
    linear-gradient(135deg,
      #FBF7EA 0%,        /* 左上：温かいクリーム（少し黄に振った） */
      #F4ECD3 45%,       /* 中央：ピーチベージュ */
      #E8DCBC 100%);     /* 右下：オレンジ寄りのウォームベージュ */
  background-attachment: fixed;
  background-size: 100% 100%;
  min-height: 100vh;
  position: relative;
}
/* iOS Safari は background-attachment:fixed がbodyに効かないため scroll に fallback
   scroll の場合、グラデはページコンテンツと一緒に動くが色は見える */
@supports (-webkit-touch-callout: none) {
  body {
    background-attachment: scroll;
    background-size: cover;
  }
}

/* ── 全体に格子パターン（fixed・中央フェード）— 視認可能な濃さに ── */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(120,100,0,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120,100,0,.10) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse at 50% 40%, #000 25%, transparent 90%);
          mask-image: radial-gradient(ellipse at 50% 40%, #000 25%, transparent 90%);
}

/* ── ページ全体に上下のフェード（hero/footer 付近を引き締め） ── */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 80% 90%, rgba(255,210,140,.18), transparent 55%),
    radial-gradient(ellipse at 15% 10%, rgba(255,255,255,.45), transparent 50%);
}

/* コンテンツが格子の上に乗るよう必要箇所のz-indexを上げる */
.header, main, section, footer { position: relative; z-index: 1; }

/* ── ライトセクションを透明化して body のグラデを透けさせる ── */
/* 共通ライトセクション（#FAF8F2 系・#F0EDE5 系を上書き透明化） */
.empathy,
.personal,
.ba,
.price,
.faq,
.flow,
.reviews-section,
.instagram-section,
.notices,
.access,
.strengths,
.personal-price,
.reasons,
.diff-numbers,
.recruit-why,
.recruit-apply,
.machine-lineup,
.contact-redirect,
.contact-channels,
.trainers,
.plans-section,
.plan-tabs-wrap,
.faq-section,
.story,
.reviews,
.ba-hero,
.assignment,
.mitt-personal,
.next-nav,
.map-section,
.floor-map-section {
  background: transparent;
}

/* ── やや暗めの差別化セクション → 半透明オーバーレイで「凹み」を残す ── */
.support,
.bundle,
.voices,
.contact-cats,
.job-openings,
.story.story--alt {
  background: linear-gradient(135deg, rgba(0,0,0,.018), rgba(0,0,0,.035));
}

/* ── hero / page-hero は body のグラデ＋格子を透けさせる（背景を持たない） ── */
/* 旧 v10 では hero に独自グラデを当てていたが、body のグラデと色域が違うため
   ヒーロー部分だけ別トーンに見える問題があった → transparent で統一する */
.hero {
  background: transparent;
}
.hero::before { display: none; }   /* グリッドは body::before に統一 */

.page-hero:not(.neon) {
  background: transparent;
}
.page-hero:not(.neon)::before { display: none; }  /* 同上 */

/* ── BLACKOUT ページは暗闇スタジオ世界観維持 → 全体グラデ&格子を打ち消し ── */
body[data-page="blackout"] {
  background: #000;
  background-attachment: scroll;
}
body[data-page="blackout"]::before { display: none; }

/* =====================================================================
 * v12 — trainers.html リニューアル：Q&A 形式
 *
 * 旧 trainer-detail__motto / __stats / __bio を撤去し、Q&A 3問の構造に。
 * 写真は正方形トリミング（aspect-ratio:1/1, object-fit:cover）に。
 * Q&A は白カード + 左ボーダー黄色、Q マークと A マークで階層を示す。
 * ===================================================================== */

/* media を正方形トリミングに */
body[data-page="trainers"] .trainer-detail__media,
.trainer-detail__media {
  aspect-ratio: 1 / 1;
  background: #F0EDE5;
  border: 1px solid var(--line);
}
body[data-page="trainers"] .trainer-detail__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;     /* 顔が中心になりやすい位置 */
}

/* role（職位）を見出し下に */
.trainer-detail__role {
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  color: var(--text-soft);
  letter-spacing: .04em;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}

/* Q&A セクション */
.trainer-detail__qa {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 8px 0 24px;
}
.qa-item {
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-left: 3px solid var(--yellow);
  padding: 18px 22px 16px;
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
  transition: border-left-color .25s ease, box-shadow .25s ease;
}
.qa-item:hover {
  border-left-color: var(--accent-text-strong);
  box-shadow: 0 4px 16px rgba(0,0,0,.06);
}

/* Q 行 */
.qa-item__q {
  font-size: 15px;
  font-weight: 800;
  color: #1A1A1A;
  line-height: 1.55;
  margin-bottom: 12px;
  padding-left: 36px;
  position: relative;
  letter-spacing: .005em;
}
.qa-item__q::before {
  content: "Q";
  position: absolute;
  left: 0;
  top: -4px;
  font-family: var(--font-en);
  font-style: italic;
  font-weight: 800;
  color: var(--accent-text-strong);
  font-size: 28px;
  line-height: 1;
}
@media (min-width:760px) {
  .qa-item__q { font-size: 16px; }
}

/* A 行 */
.qa-item__a {
  font-size: 14.5px;
  color: #2A2A2A;
  line-height: 1.95;
  padding-left: 36px;
  position: relative;
  margin: 0;
}
.qa-item__a::before {
  content: "A";
  position: absolute;
  left: 0;
  top: -3px;
  font-family: var(--font-en);
  font-style: italic;
  font-weight: 800;
  color: var(--coral-deep);
  font-size: 24px;
  line-height: 1;
}
@media (min-width:760px) {
  .qa-item__a { font-size: 15px; }
}

/* ── mitt-personal benefit アイコン — 絵文字から SVG アイコンに変更 ── */
/* styles.css の font-size:36px（絵文字用）を override して SVG 用サイズに */
.mitt-personal__benefit-icon {
  font-size: 0;             /* 絵文字テキストを消す */
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  background: rgba(255,229,0,.18);
  border-radius: 14px;
  color: var(--accent-text-strong);   /* SVG の stroke="currentColor" に作用 */
  margin-bottom: 14px;
  flex-shrink: 0;
  transition: background .25s ease, color .25s ease;
}
.mitt-personal__benefit-icon svg {
  width: 26px;
  height: 26px;
  display: block;
}
.mitt-personal__benefit:hover .mitt-personal__benefit-icon {
  background: var(--yellow);
  color: #111;
}

/* role と name の余白調整（Q&A で見出しが詰まらないように） */
body[data-page="trainers"] .trainer-detail__name {
  margin-bottom: 6px;
}

/* =====================================================================
 * v13 — キャンペーンバナー（ヒーロー上） + お知らせ画像対応
 *
 * .campaign-banner: index.html ヘッダー直下に挿入。enabled=true 時のみ表示。
 *   - PC（760px+）: source[srcset=campaign.imagePc]（横長）
 *   - SP（〜759px）: img[src=campaign.imageSp]（縦長）
 * .notice-card__media: お知らせカードに画像が設定された時だけ表示
 * ===================================================================== */

/* ── キャンペーンバナー ── */
.campaign-banner {
  display: none;                       /* enabled=false の時は完全非表示 */
  width: 100%;
  margin: 0;
  position: relative;
  z-index: 1;
}
.campaign-banner.is-enabled {
  display: block;
  line-height: 0;
}
.campaign-banner__link {
  display: block;
  width: 100%;
  position: relative;
  overflow: hidden;
  transition: opacity .25s ease, transform .35s ease;
}
.campaign-banner__link:hover {
  opacity: .92;
  transform: translateY(-1px);
}
.campaign-banner img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}
/* PCで横長を中央に揃え、最大幅をコンテナに合わせる */
@media (min-width: 760px) {
  .campaign-banner.is-enabled {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 16px;
  }
}

/* =====================================================================
 * v14 — Legal ページ (privacy / terms / sct) 専用スタイル
 * 共通: .legal-section / .legal-content / .legal-dl / .legal-effective
 * ===================================================================== */
.legal-section {
  padding: 60px 0 100px;
}
@media (min-width: 760px) {
  .legal-section { padding: 80px 0 120px; }
}
.legal-content {
  max-width: 820px;
  margin: 0 auto;
  color: #2A2A2A;
}
.legal-content h2 {
  font-size: clamp(18px, 2.2vw, 22px);
  font-weight: 800;
  color: #1A1A1A;
  margin: 40px 0 14px;
  padding: 0 0 12px;
  border-bottom: 2px solid var(--yellow);
  letter-spacing: .02em;
  line-height: 1.5;
}
.legal-content h2:first-of-type { margin-top: 0; }
.legal-content h3 {
  font-size: 16px;
  font-weight: 700;
  color: #1A1A1A;
  margin: 24px 0 10px;
}
.legal-content p {
  font-size: 15px;
  line-height: 1.95;
  margin-bottom: 14px;
  color: #2A2A2A;
}
@media (min-width: 760px) {
  .legal-content p { font-size: 15.5px; line-height: 2; }
}
.legal-content ol,
.legal-content ul {
  margin: 12px 0 18px 1.4em;
  padding: 0;
  font-size: 15px;
  line-height: 1.95;
  color: #2A2A2A;
}
.legal-content ol li,
.legal-content ul li {
  margin-bottom: 8px;
}
.legal-content ol ol,
.legal-content ul ul,
.legal-content ol ul,
.legal-content ul ol {
  margin-top: 8px;
  margin-bottom: 8px;
}
.legal-content ol { list-style: decimal; }
.legal-content ol ol { list-style: lower-roman; }
.legal-content strong {
  color: #1A1A1A;
  font-weight: 700;
}
.legal-content a {
  color: var(--accent-text);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.legal-content a:hover { color: var(--accent-text-strong); }

/* SCT 用の定義リスト */
.legal-dl {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin: 0 0 24px;
  border-top: 1px solid var(--line);
}
.legal-dl dt {
  font-weight: 800;
  color: #1A1A1A;
  font-size: 14px;
  padding: 18px 0 6px;
  letter-spacing: .04em;
}
.legal-dl dd {
  margin: 0 0 0;
  padding: 0 0 18px;
  border-bottom: 1px solid var(--line);
  font-size: 15px;
  line-height: 1.95;
  color: #2A2A2A;
}
@media (min-width: 760px) {
  .legal-dl {
    grid-template-columns: 220px 1fr;
    gap: 0 24px;
  }
  .legal-dl dt {
    padding: 22px 0;
    border-bottom: 1px solid var(--line);
    align-self: stretch;
  }
  .legal-dl dd {
    padding: 22px 0;
  }
}

.legal-effective {
  margin-top: 56px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  font-size: 14px;
  color: var(--text-soft);
  text-align: right;
  line-height: 1.85;
}

/* ── KICK BACK カード（暗背景セクション）の文字色をライト版で再指定 ── */
/* .neon-kickback は背景 #0a0a0a の暗色セクション。ライト版で text-soft (#5A5A5A) を
   継承すると暗背景に黒文字で見えない。明色に強制復帰させる。 */
.neon-kickback {
  color: #FFFFFF;
}
.kickback-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,0,212,.5);
}
.kickback-card__title {
  color: #FFFFFF;
}
.kickback-card__title .magenta-text {
  color: #FF40E0;                       /* マゼンタ強調 */
  text-shadow: 0 0 12px rgba(255,0,212,.45);
}
.kickback-card__lead {
  color: #E5E5E5;                       /* 13:1 AAA — 暗背景上で十分視認可能 */
  line-height: 1.95;
}
.kickback-card__badge {
  background: var(--yellow);
  color: #1A1A1A;
}
.kickback-card__keyword {
  color: #FFB088;                       /* 暗背景上で読みやすいコーラル */
  background: rgba(255,166,112,.12);
  border-color: rgba(255,166,112,.55);
}

/* ── お知らせカードの画像 ── */
.notice-card__body {
  display: block;
}
.notice-card__media {
  display: none;                       /* image が空の時は非表示 */
  margin: 12px 0 14px;
  border-radius: 4px;
  overflow: hidden;
  text-align: center;                  /* SP で中央寄せ */
  background: #F0EDE5;                 /* 縦長画像と横幅の差を埋める背景 */
}
.notice-card__media.has-image {
  display: block;
}
.notice-card__media img {
  width: auto;                         /* 画像本来のサイズを保つ */
  max-width: 100%;                     /* コンテナを超えない */
  height: auto;
  max-height: 480px;                   /* PCで縦長画像が暴れないよう抑える */
  display: block;
  margin: 0 auto;                      /* 中央寄せ */
  object-fit: contain;                 /* 縦も横も全部見えるように（旧 cover で切れていた） */
}
/* PC ではもう一段大きくしてOK */
@media (min-width: 760px) {
  .notice-card__media img { max-height: 560px; }
}
.notice-card__text {
  color: #3A3A3A;
  line-height: 1.85;
  white-space: pre-line;               /* content.json の \n を改行として表示 */
}

/* ── admin の image hint をやや目立たせる（admin.css を上書き） ── */
/* admin はこのファイル読まないので不要 — admin.css 側で対応する場合は別途。
   ここでは何もしない。*/
