/*
Theme Name: WAN Theme
Theme URI: https://wildandnative.com/
Author: WILD AND NATIVE
Author URI: https://wildandnative.com/
Description: WILD AND NATIVE 公式テーマ。サバイバル・アウェアネスの学校のブランドサイト。全テキスト・画像は外観→カスタマイズから編集できます。
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wan-theme
*/

/* ============================================================
   WILD AND NATIVE — wan-theme 静的プレビュー
   DESIGN-SPEC.md Ver.1.0 準拠 / mobile-first
   ============================================================ */

/* ---------- 1. デザイントークン ---------- */
:root {
  /* 地（夜の土） */
  --soil:       #1F1A14;
  --soil-deep:  #15110C;
  --soil-soft:  #2C251D;
  /* 火（弁柄） */
  --bengara:      #9A3B26;
  --bengara-deep: #7C2F1E;
  --hi:           #D08A52;
  /* 紙 */
  --washi:    #F5F0E6;
  --washi-2:  #ECE5D6;
  --line:     #D9D1BF;
  --line-dark:#3B332A;
  /* テキスト */
  --text:        #2B241C;
  --text-muted:  #6E6557;
  --on-dark:       #EFE8DA;
  --on-dark-muted: #A89D8B;
  /* 家族の金 */
  --family-gold: #C2A15E;
  /* 補助 */
  --moss: #5C6B4E;         /* 苔。役割縮小: 送信完了など「成功」の意味色のみ */

  /* === 水（青碧）— ブランドカラー #67A1B9 とその派生（COLOR-UPDATE-SPEC §2 / Ver1.4） === */
  --mizu:       #67A1B9;   /* ブランド原色 rgb(103,161,185)。ダーク面の文字・リンク／面・装飾用（soil上 6.06:1）。ライト面の文字には使わない（washi上 2.51:1） */
  --mizu-deep:  #2F6981;   /* ライト面のリンク・構造色。同色相 H≈198°。washi 5.35 / washi-2 4.84 / mizu-wash 5.19 / 入力欄白 5.97 — 全ライト面でAA */
  --mizu-ink:   #295B70;   /* --mizu-deep のhover・強調（washi上 6.55:1） */
  --mizu-wash:  #E4EFF4;   /* 「空・沢」の面。青系の紙色。セクション面・構造パネル・タグ塗り（text 13.1:1 / text-muted 4.9:1） */
  --mizu-line:  #C2D6DE;   /* mizu-wash面上の罫線・video-frame額装・パネル枠 */

  /* 書体 */
  --font-display: 'Zen Old Mincho', 'Hiragino Mincho ProN', serif;
  --font-body:    'Zen Kaku Gothic New', 'Hiragino Sans', sans-serif;
  --font-en:      'Marcellus', 'Times New Roman', serif;

  /* タイプスケール */
  --fs-hero:    clamp(1.9rem, 5.5vw, 3.25rem);
  --fs-h2:      clamp(1.5rem, 3.8vw, 2.3rem);
  --fs-h3:      clamp(1.18rem, 2.4vw, 1.45rem);
  --fs-lead:    clamp(1rem, 1.8vw, 1.15rem);
  --fs-body:    1rem;
  --fs-small:   .85rem;
  --fs-eyebrow: .72rem;

  /* 余白 */
  --s1: 8px;  --s2: 16px; --s3: 24px; --s4: 40px;
  --s5: 64px; --s6: 96px;
  --section-pad: clamp(80px, 12vw, 150px);
  --maxw: 1120px;
  --maxw-narrow: 740px;
  --gutter: clamp(20px, 5vw, 56px);

  --radius: 2px;
  --scrim: linear-gradient(180deg, rgba(21,17,12,.28), rgba(21,17,12,.66));
}

/* ---------- 2. リセット・ベース ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font: 400 var(--fs-body)/2.0 var(--font-body);
  letter-spacing: .02em;
  color: var(--text);
  background: var(--washi);
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--mizu-deep); text-decoration-thickness: 1px; text-underline-offset: .25em; }
a:hover { color: var(--mizu-ink); }
ul, ol { list-style: none; }
figure { margin: 0; }
:focus-visible { outline: 2px solid var(--mizu-deep); outline-offset: 2px; }
.sec--dark :focus-visible, .site-footer :focus-visible, .drawer :focus-visible { outline-color: var(--mizu); }

.container { max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }
.container--narrow { max-width: var(--maxw-narrow); margin-inline: auto; padding-inline: var(--gutter); }

.visually-hidden {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}

/* 写真の統一処理（控えめ） */
.photo, .page-header__img, .hero__img { filter: saturate(.92) contrast(1.02); }

/* ---------- 3. タイポグラフィ部品 ---------- */
.eyebrow {
  display: block;
  font: 400 var(--fs-eyebrow)/1 var(--font-en);
  text-transform: uppercase;
  letter-spacing: .30em;
  color: var(--mizu-deep);   /* 英字ラベル＝構造の色（水）。全セクション見出しに青の一線を通す */
}
.eyebrow::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--bengara); display: inline-block;   /* 粒は火のまま（不可侵） */
  margin-right: .9em; vertical-align: 2px;
}
.sec--dark .eyebrow, .cta-band .eyebrow { color: var(--mizu); }   /* ダーク面の英字ラベルも水（soil上 6.06:1） */
.sec--dark .eyebrow::before, .cta-band .eyebrow::before { background: var(--hi); }

.section-head { margin-bottom: var(--s4); }
.section-head h2 {
  font: 700 var(--fs-h2)/1.5 var(--font-display);
  letter-spacing: .06em;
  margin-top: var(--s2);
}
/* 見出し下の水の一線（面ではないが全セクション共通の青アクセント） */
.section-head h2::after {
  content: ""; display: block; width: 44px; height: 2px;
  background: var(--mizu-deep); margin-top: var(--s2);
}
.sec--dark .section-head h2::after { background: var(--mizu); }
.section-head--center h2::after { margin-inline: auto; }
.section-head .lead {
  font-size: var(--fs-lead); line-height: 2.0; letter-spacing: .03em;
  color: var(--text-muted); max-width: 32em; margin-top: var(--s3);
}
.sec--dark .section-head .lead { color: var(--on-dark-muted); }
.section-head--center { text-align: center; }
.section-head--center .lead { margin-inline: auto; }

h3 { font: 400 var(--fs-h3)/1.6 var(--font-display); letter-spacing: .04em; }

.small, small { font-size: var(--fs-small); line-height: 1.7; letter-spacing: .04em; }
.muted { color: var(--text-muted); }

.en-num { font-family: var(--font-en); }

/* 火の粒リスト */
.fire-list li {
  position: relative; padding-left: 1.4em; margin-bottom: .55em;
}
.fire-list li::before {
  content: ""; position: absolute; left: 0; top: .85em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--bengara);
}
.sec--dark .fire-list li::before { background: var(--hi); }

/* 注記（※要確認） */
.note-check { font-size: .78rem; color: var(--text-muted); letter-spacing: .04em; }

/* ---------- 4. ボタン ---------- */
.btn {
  display: inline-block;
  font: 500 .85rem/1 var(--font-body);
  letter-spacing: .1em;
  padding: 1.05em 2.4em;
  border-radius: var(--radius);
  border: 0;
  text-decoration: none;
  cursor: pointer;
  transition: background .3s ease, color .3s ease, border-color .3s ease;
}
.btn-fire { background: var(--bengara); color: #fff; }
.btn-fire:hover { background: var(--bengara-deep); color: #fff; }
/* 副ボタン＝水の面。淡い空色のチップ（火ボタンとの主従を色でも分ける） */
.btn-quiet { background: var(--mizu-wash); border: 1px solid var(--mizu-line); color: var(--mizu-deep); }
.btn-quiet:hover { background: var(--mizu-wash); border-color: var(--mizu-deep); color: var(--mizu-ink); }
.sec--dark .btn-quiet, .cta-band .btn-quiet { background: transparent; border-color: var(--mizu); color: var(--on-dark); }
.sec--dark .btn-quiet:hover, .cta-band .btn-quiet:hover { background: transparent; border-color: var(--mizu); color: var(--mizu); }

/* テキストリンク（→付き） */
.text-link { font-weight: 500; letter-spacing: .06em; }
.link-next { display: block; text-align: right; margin-top: var(--s5); }

/* ---------- 5. ヘッダー ---------- */
.site-header {
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  transition: background .35s ease, box-shadow .35s ease;
}
.site-header__inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--s3);
  padding: 14px var(--gutter);
  max-width: 1400px; margin-inline: auto;
}
.brand { display: inline-flex; align-items: center; }
.brand img { width: 44px; height: 44px; object-fit: contain; transition: filter .35s ease; }

.global-nav { display: none; }
.header-cta { display: none; }

/* スクロール後 */
.site-header.is-scrolled {
  background: rgba(245,240,230,.94);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 1px 0 var(--line);
}
.site-header.is-scrolled .brand img { filter: brightness(0) saturate(100%) opacity(.85); }

/* 写真ヒーローを持たないページ: 最初から solid */
.header-solid .site-header {
  background: rgba(245,240,230,.94);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 1px 0 var(--line);
}
.header-solid .site-header .brand img { filter: brightness(0) saturate(100%) opacity(.85); }

/* ハンバーガー */
.nav-toggle {
  display: inline-flex; flex-direction: column; justify-content: center; gap: 7px;
  width: 48px; height: 48px; padding: 12px;
  background: transparent; border: 0; cursor: pointer;
}
.nav-toggle span {
  display: block; width: 100%; height: 1px; background: var(--on-dark);
  transition: transform .3s ease, opacity .3s ease, background .35s ease;
}
.site-header.is-scrolled .nav-toggle span,
.header-solid .nav-toggle span { background: var(--text); }
.nav-toggle[aria-expanded="true"] span { background: var(--on-dark); }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* ドロワー（モバイル全画面） */
.drawer {
  position: fixed; inset: 0; z-index: 90;
  background: var(--soil); color: var(--on-dark);
  display: flex; flex-direction: column; justify-content: center;
  padding: var(--s6) var(--gutter) var(--s5);
  opacity: 0; visibility: hidden; transition: opacity .35s ease, visibility .35s ease;
  box-shadow: 0 24px 48px rgba(21,17,12,.18);
}
.drawer.is-open { opacity: 1; visibility: visible; }
.drawer__nav li { border-bottom: 1px solid var(--line-dark); }
.drawer__nav a {
  display: block; padding: 14px 4px; min-height: 48px;
  color: var(--on-dark); text-decoration: none;
  font: 500 1.05rem/1.6 var(--font-body); letter-spacing: .08em;
}
.drawer__nav a span { font: 400 var(--fs-eyebrow)/1 var(--font-en); letter-spacing: .3em; text-transform: uppercase; color: var(--on-dark-muted); margin-left: 1em; }
.drawer__nav a:hover { color: var(--mizu); }
.drawer__sns { margin-top: var(--s4); display: flex; gap: var(--s3); }
.drawer__sns a { color: var(--on-dark-muted); font-size: var(--fs-small); letter-spacing: .08em; }

@media (min-width: 900px) {
  .nav-toggle, .drawer { display: none; }
  .global-nav { display: block; }
  .global-nav ul { display: flex; gap: clamp(16px, 2.4vw, 34px); }
  .global-nav a {
    font: 500 .82rem/1 var(--font-body); letter-spacing: .12em;
    color: var(--on-dark); text-decoration: none; padding: 8px 2px;
    border-bottom: 1px solid transparent; transition: color .3s, border-color .3s;
  }
  .global-nav a:hover, .global-nav a[aria-current="page"] { border-bottom-color: var(--mizu-deep); }
  .site-header.is-scrolled .global-nav a,
  .header-solid .global-nav a { color: var(--text); }
  .header-cta {
    display: inline-block;
    font: 500 .8rem/1 var(--font-body); letter-spacing: .1em;
    color: var(--on-dark); text-decoration: none; white-space: nowrap;
  }
  .header-cta::before {
    content: ""; width: 6px; height: 6px; border-radius: 50%;
    background: var(--hi); display: inline-block; margin-right: .7em; vertical-align: 2px;
  }
  .header-cta:hover { color: var(--mizu); }
  .site-header.is-scrolled .header-cta,
  .header-solid .header-cta { color: var(--text); }
  .site-header.is-scrolled .header-cta::before,
  .header-solid .header-cta::before { background: var(--bengara); }
  .site-header.is-scrolled .header-cta:hover,
  .header-solid .header-cta:hover { color: var(--mizu-deep); }
}

/* ---------- 6. ヒーロー（トップ・縦書き） ---------- */
.hero {
  position: relative; height: 100svh; min-height: 560px;
  background: var(--soil);
  overflow: hidden;
}
.hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero::after { content: ""; position: absolute; inset: 0; background: var(--scrim); }
.hero__inner { position: absolute; inset: 0; z-index: 2; }
.hero-copy {
  position: absolute; top: 18svh; right: var(--gutter);
  writing-mode: vertical-rl;
  font: 700 var(--fs-hero)/1.9 var(--font-display);
  letter-spacing: .14em;
  color: var(--on-dark);
  text-shadow: 0 2px 24px rgba(0,0,0,.35);
  max-height: 72svh;
}
.hero__foot {
  position: absolute; left: var(--gutter); bottom: clamp(24px, 5svh, 48px);
  display: flex; flex-direction: column; gap: var(--s2);
}
.hero__foot img { width: 64px; height: 64px; object-fit: contain; }
.hero__tagline {
  font: 400 var(--fs-eyebrow)/1.6 var(--font-en);
  letter-spacing: .30em; text-transform: uppercase;
  color: var(--on-dark-muted);
}
.scroll-cue {
  position: absolute; left: 50%; bottom: 0; z-index: 2;
  width: 1px; height: 60px; overflow: hidden;
}
.scroll-cue::before {
  content: ""; position: absolute; left: 0; top: -30px;
  width: 1px; height: 30px; background: var(--on-dark);
  animation: cue 2.2s ease-in-out infinite;
}
@keyframes cue { 0% { transform: translateY(0); } 100% { transform: translateY(90px); } }

/* ---------- 7. ページヘッダー（下層） ---------- */
.page-header {
  position: relative;
  height: clamp(240px, 40vw, 420px);
  background: var(--soil);
  display: flex; align-items: flex-end;
  overflow: hidden;
}
.page-header--low { height: clamp(200px, 30vw, 320px); }
.page-header--tall { height: 60vh; min-height: 420px; }
.page-header__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.page-header::after { content: ""; position: absolute; inset: 0; background: var(--scrim); }
.page-header__inner {
  position: relative; z-index: 2;
  width: 100%; max-width: var(--maxw); margin-inline: auto;
  padding: 0 var(--gutter) clamp(28px, 4vw, 48px);
}
.page-header .eyebrow { color: var(--on-dark-muted); }
.page-header .eyebrow::before { background: var(--hi); }
.page-header h1 {
  font: 700 clamp(1.6rem, 4.5vw, 2.6rem)/1.5 var(--font-display);
  letter-spacing: .06em; color: var(--on-dark);
  margin-top: var(--s2);
  text-shadow: 0 2px 24px rgba(0,0,0,.35);
}
.page-header__lead { color: var(--on-dark); margin-top: var(--s2); max-width: 36em; text-shadow: 0 1px 12px rgba(0,0,0,.4); }
.breadcrumb {
  margin-top: var(--s2);
  font-size: var(--fs-small); color: var(--on-dark-muted); letter-spacing: .04em;
}
.breadcrumb a { color: var(--on-dark-muted); }
.breadcrumb a:hover { color: var(--on-dark); }

/* 写真なしページヘッダー（コラム・404） */
.page-header--plain {
  position: relative; height: auto; background: var(--washi); display: block;
  padding-top: calc(66px + var(--s6));
}
.page-header--plain::after { display: none; }
.page-header--plain .page-header__inner { padding-bottom: 0; }
.page-header--plain .eyebrow { color: var(--text-muted); }
.page-header--plain .eyebrow::before { background: var(--bengara); }
.page-header--plain h1 { color: var(--text); text-shadow: none; }
.page-header--plain .breadcrumb { color: var(--text-muted); }
.page-header--plain .breadcrumb a { color: var(--text-muted); }
.page-header--plain .breadcrumb a:hover { color: var(--text); }

/* ---------- 8. セクション ---------- */
.sec { padding-block: var(--section-pad); background: var(--washi); }
.sec--washi2 { background: var(--washi-2); }
.sec--dark { background: var(--soil); color: var(--on-dark); }
.sec--dark h2, .sec--dark h3 { color: var(--on-dark); }
.sec--dark a { color: var(--mizu); }
.sec--dark .muted { color: var(--on-dark-muted); }

/* 2カラム（画像:テキスト） */
.two-col { display: grid; gap: var(--s4); align-items: start; }
.two-col figure { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.two-col figure img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.two-col__body > * + * { margin-top: 1.4em; }
@media (min-width: 900px) {
  .two-col { grid-template-columns: 5fr 7fr; gap: var(--s5); align-items: center; }
  .two-col--rev { grid-template-columns: 7fr 5fr; }
  .two-col--rev figure { order: 2; }
}

/* 動画枠（Presto Player想定） */
.video-frame {
  position: relative;
  border: 1px solid var(--line); border-radius: var(--radius);
  aspect-ratio: 16 / 9; background: var(--soil);
  display: flex; align-items: center; justify-content: center;
}
.video-frame__ph {
  color: var(--on-dark-muted); font-size: var(--fs-small);
  letter-spacing: .08em; text-align: center; padding: var(--s3);
}
.video-frame__ph::before {
  content: ""; display: block; width: 54px; height: 54px;
  margin: 0 auto var(--s2); border: 1px solid var(--on-dark-muted); border-radius: 50%;
  background:
    linear-gradient(var(--on-dark-muted), var(--on-dark-muted)) no-repeat center / 0 0;
}
.video-frame__ph b {
  display: block; font-weight: 400;
}
.video-frame__play {
  position: absolute; inset: 0; margin: auto;
  width: 0; height: 0;
}
.video-frame figcaption { position: absolute; left: 0; right: 0; bottom: -2.2em; text-align: center; color: var(--text-muted); font-size: var(--fs-small); }

/* ---------- 9. トップ: 学びの入り口3枚 ---------- */
.entry-cards { display: grid; gap: var(--s3); }
.entry-card {
  display: grid; grid-template-columns: 120px 1fr; gap: var(--s2);
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--washi); overflow: hidden;
  text-decoration: none; color: var(--text);
  transition: border-color .3s ease;
}
.entry-card:hover { border-color: var(--mizu-deep); color: var(--text); }
.entry-card figure { overflow: hidden; height: 100%; max-height: 140px; }
.entry-card figure img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.entry-card:hover figure img { transform: scale(1.03); }
.entry-card__body { padding: var(--s2) var(--s2) var(--s2) 0; }
.entry-card__body .eyebrow { margin-bottom: 2px; }
.entry-card__body h3 { font-size: 1.1rem; }
.entry-card__body p { font-size: var(--fs-small); color: var(--text-muted); margin-top: 4px; }
.entry-card__more { display: inline-block; margin-top: 6px; font-size: var(--fs-small); font-weight: 500; color: var(--mizu-deep); letter-spacing: .06em; }
@media (min-width: 900px) {
  .entry-cards { grid-template-columns: repeat(3, 1fr); gap: var(--s4); }
  .entry-card { display: block; }
  .entry-card figure { height: auto; max-height: none; aspect-ratio: 16 / 10; }
  .entry-card figure img { height: 100%; }
  .entry-card__body { padding: var(--s3); }
}

/* ---------- 10. 権威セクション（記録リスト） ---------- */
.record-grid { display: grid; gap: var(--s4); }
@media (min-width: 900px) {
  .record-grid { grid-template-columns: 4fr 6fr; gap: var(--s6); align-items: start; }
}
.record-grid > figure {
  border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden;
}
.record-grid > figure img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.record-grid > figure figcaption { font-size: var(--fs-small); color: var(--text-muted); padding: .6em .9em; border-top: 1px solid var(--line); }
.record-body > p + p { margin-top: 1.4em; }
.record-list { margin-top: var(--s4); border-top: 1px solid var(--line); }
.record-list > div {
  display: grid; grid-template-columns: 1fr; gap: 2px;
  padding: var(--s2) 0; border-bottom: 1px solid var(--line);
}
.record-list dt {
  font: 400 var(--fs-small)/1.6 var(--font-body); font-weight: 500;
  color: var(--text-muted); letter-spacing: .06em;
}
.record-list dt span { font-family: var(--font-en); text-transform: uppercase; letter-spacing: .22em; font-size: .7rem; margin-right: .8em; }
.record-list dd { font-size: .95rem; }
@media (min-width: 600px) {
  .record-list > div { grid-template-columns: 200px 1fr; gap: var(--s3); }
}

/* ---------- 11. スクール相関図 ---------- */
.schools {
  position: relative; background: var(--soil); color: var(--on-dark);
  overflow: hidden;
}
.schools__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .35; filter: saturate(.92) contrast(1.02); }
.schools::before { content: ""; position: absolute; inset: 0; background: rgba(21,17,12,.72); }
.schools__inner { position: relative; z-index: 2; }

.mother-node {
  background: var(--washi); color: var(--text);
  border-radius: var(--radius);
  padding: clamp(28px, 5vw, var(--s5));
  text-align: center;
  max-width: 640px; margin-inline: auto;
}
.mother-node__label {
  font: 400 var(--fs-eyebrow)/1 var(--font-en);
  letter-spacing: .30em; text-transform: uppercase; color: var(--bengara);
}
.mother-node__label::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--bengara); display: inline-block; margin-right: .9em; vertical-align: 2px;
}
.mother-node__logo { width: min(240px, 60%); margin: var(--s3) auto var(--s2); filter: brightness(0) saturate(100%) opacity(.85); }
.mother-node p { font-size: var(--fs-small); color: var(--text-muted); }

.school-card {
  background: var(--washi); color: var(--text);
  border-radius: var(--radius);
  padding: var(--s3);
  text-align: center;
}
.school-card img { width: min(150px, 70%); margin: 0 auto var(--s2); }
.school-card h3 { font: 500 .95rem/1.5 var(--font-body); letter-spacing: .04em; }
.school-card p { font-size: var(--fs-small); color: var(--text-muted); margin-top: 6px; text-align: left; }
.school-card a { display: inline-block; margin-top: var(--s2); font-size: var(--fs-small); font-weight: 500; color: var(--mizu-deep); }

.earthcraft-band {
  border: 1px solid var(--family-gold); border-radius: var(--radius);
  padding: var(--s3);
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3);
}
.earthcraft-band img { width: 120px; background: var(--washi); padding: 8px; border-radius: var(--radius); }
.earthcraft-band p { font-size: var(--fs-small); color: var(--on-dark-muted); flex: 1 1 220px; }
.earthcraft-band a { font-size: var(--fs-small); font-weight: 500; color: var(--mizu); white-space: nowrap; }

/* モバイル: 縦の系譜（左に金の縦線） */
.school-tree { margin-top: var(--s5); }
.school-tree__children {
  margin-top: 0; padding-top: var(--s4); padding-left: var(--s4);
  border-left: 1px solid var(--family-gold);
  display: grid; gap: var(--s3);
  margin-left: var(--s2);
}
.school-tree__children > li { position: relative; }
.school-tree__children > li::before {
  content: ""; position: absolute; left: calc(-1 * var(--s4)); top: 50%;
  width: var(--s4); height: 1px; background: var(--family-gold);
}
.mother-node { position: relative; }
.school-tree__mother { position: relative; padding-bottom: var(--s4); margin-left: var(--s2); border-left: 1px solid var(--family-gold); }
.school-tree__mother .mother-node { margin-left: calc(-1 * var(--s2)); }
.earthcraft-band { margin-top: var(--s4); }

@media (min-width: 900px) {
  /* PC: 樹形図 */
  .school-tree__mother { border-left: 0; margin-left: 0; padding-bottom: 0; }
  .school-tree__mother .mother-node { margin-left: auto; }
  .school-tree__mother::after {
    content: ""; display: block; width: 1px; height: var(--s5);
    background: var(--family-gold); margin: 0 auto;
  }
  .school-tree__children {
    border-left: 0; padding: 0; margin: 0;
    grid-template-columns: repeat(3, 1fr); gap: var(--s4);
    position: relative;
    padding-top: var(--s5);
  }
  /* 水平線 */
  .school-tree__children::before {
    content: ""; position: absolute; top: 0;
    left: calc(100% / 6); right: calc(100% / 6);
    height: 1px; background: var(--family-gold);
  }
  /* 各カードへの縦線 */
  .school-tree__children > li::before {
    left: 50%; top: calc(-1 * var(--s5)); width: 1px; height: var(--s5);
  }
  .earthcraft-band { margin-top: var(--s5); }
}

/* ---------- 12. CTAバンド ---------- */
.cta-band { background: var(--soil); color: var(--on-dark); text-align: center; padding-block: var(--section-pad); }
.cta-band h2 { font: 700 var(--fs-h2)/1.6 var(--font-display); letter-spacing: .06em; }
.cta-band p { color: var(--on-dark-muted); margin-top: var(--s3); }
.cta-band__btns { display: flex; flex-wrap: wrap; gap: var(--s3); justify-content: center; margin-top: var(--s4); }

/* ---------- 13. FAQ アコーディオン ---------- */
.faq details { border-bottom: 1px solid var(--line); }
.faq details:first-of-type { border-top: 1px solid var(--line); }
.sec--dark .faq details { border-color: var(--line-dark); }
.faq summary {
  display: flex; align-items: baseline; gap: var(--s2);
  padding: var(--s3) var(--s5) var(--s3) 0;
  min-height: 48px;
  cursor: pointer; list-style: none;
  font: 400 var(--fs-h3)/1.6 var(--font-display); letter-spacing: .04em;
  position: relative;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::before {
  content: "Q"; font: 400 1rem/1 var(--font-en); color: var(--mizu-deep);
  flex: 0 0 auto; transform: translateY(-.1em);
}
.faq summary::after {
  content: ""; position: absolute; right: 8px; top: 50%;
  width: 15px; height: 15px; transform: translateY(-50%);
  background:
    linear-gradient(var(--text-muted), var(--text-muted)) no-repeat center / 15px 1px,
    linear-gradient(var(--text-muted), var(--text-muted)) no-repeat center / 1px 15px;
  transition: background .25s ease;
}
.faq details[open] summary::after {
  background:
    linear-gradient(var(--text-muted), var(--text-muted)) no-repeat center / 15px 1px;
}
.faq .faq__a { padding: 0 0 var(--s3) calc(1rem + var(--s2)); color: var(--text); }
.faq .faq__a > * + * { margin-top: 1em; }
.faq .faq__a ul li { position: relative; padding-left: 1.4em; }
.faq .faq__a ul li::before {
  content: ""; position: absolute; left: 0; top: .85em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--bengara);
}

/* ---------- 14. Schedule（Events Manager 想定） ---------- */
.month-head {
  display: flex; align-items: baseline; gap: var(--s2);
  padding-bottom: var(--s2); margin-bottom: 0;
  border-bottom: 1px solid var(--line);
}
.month-head + .month-head { margin-top: var(--s6); }
.month-head .num { font: 400 2rem/1 var(--font-en); }
.month-head .num small { font-size: .72rem; letter-spacing: .22em; text-transform: uppercase; color: var(--text-muted); margin-left: .6em; }
.month-head .wa { font: 400 1rem/1 var(--font-body); color: var(--text-muted); letter-spacing: .06em; }

.event-row {
  display: block;
  border-bottom: 1px solid var(--line);
  text-decoration: none; color: var(--text);
  padding: var(--s3) var(--s1);
  transition: background .3s ease;
}
.event-row:hover { background: var(--mizu-wash); color: var(--text); }   /* 回遊に水が差す */
.event-row__inner { display: grid; gap: var(--s2); }
.event-row__date { display: flex; align-items: center; gap: var(--s2); }
.event-row__date .d { font: 400 1.35rem/1.2 var(--font-en); letter-spacing: .04em; }
.event-tag {
  font-size: .72rem; letter-spacing: .08em; line-height: 1;
  padding: .5em .9em; border-radius: var(--radius);
  background: var(--mizu-wash); color: var(--mizu-deep);
  border: 1px solid var(--line);
  white-space: nowrap;
}
.event-row:hover .event-tag { background: var(--washi); }
.event-row__body h3 { font-size: 1.05rem; line-height: 1.7; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.event-row__place {
  margin-top: 6px; font-size: var(--fs-small); color: var(--text-muted);
  position: relative; padding-left: 1.3em;
}
.event-row__place::before {
  content: ""; position: absolute; left: 0; top: .55em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--bengara);
}
.event-row__cat { margin-top: 8px; display: inline-block; }
@media (min-width: 700px) {
  .event-row { padding: var(--s3) var(--s2); }
  .event-row__inner { grid-template-columns: 190px 1fr; gap: var(--s4); align-items: start; }
  .event-row__date { flex-direction: column; align-items: flex-start; gap: 10px; }
  .event-row__date .d { font-size: 1.6rem; }
}

/* ---------- 15. フォーム（CF7想定） ---------- */
.wpcf7 p { margin-bottom: var(--s3); }
.wpcf7 label { display: block; font-weight: 500; margin-bottom: 8px; letter-spacing: .04em; }
.required-tag {
  display: inline-block; font-size: .7rem; font-weight: 500; line-height: 1;
  color: #fff; background: var(--bengara);
  padding: .35em .7em; border-radius: var(--radius);
  margin-left: .7em; vertical-align: .15em; letter-spacing: .1em;
}
.wpcf7-form-control-wrap { display: block; }
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea {
  width: 100%;
  font: 400 1rem/1.7 var(--font-body);
  color: var(--text);
  background: #FFFDF8;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: .9em 1em;
  transition: border-color .3s ease;
}
.wpcf7 input:focus,
.wpcf7 textarea:focus {
  border-color: var(--mizu-deep);
  outline: 2px solid rgba(47,105,129,.18);
}
.wpcf7 textarea { min-height: 200px; resize: vertical; }
.form-note {
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: var(--s3);
  font-size: var(--fs-small); color: var(--text-muted);
  margin-bottom: var(--s4);
}
.form-note p + p { margin-top: .8em; }
.wpcf7 .consent { display: flex; align-items: flex-start; gap: 10px; font-size: .95rem; }
.wpcf7 .consent input { width: 18px; height: 18px; margin-top: .5em; accent-color: var(--mizu-deep); }
.wpcf7 .submit-row { text-align: center; }
.wpcf7 .submit-row .btn { width: 100%; }
.wpcf7-not-valid-tip { color: var(--bengara); font-size: var(--fs-small); margin-top: 4px; display: block; }
.wpcf7-response-output { border: 1px solid var(--bengara); color: var(--bengara); border-radius: var(--radius); padding: .9em 1em; margin-top: var(--s3); font-size: .95rem; }
@media (min-width: 700px) {
  .wpcf7 .submit-row { text-align: right; }
  .wpcf7 .submit-row .btn { width: auto; }
}

/* ---------- 16. 料金表 ---------- */
.price-table-wrap { margin-top: var(--s3); }
.price-table { width: 100%; border-collapse: collapse; border: 1px solid var(--line); background: var(--washi); }
.price-table caption { text-align: left; font: 400 var(--fs-h3)/1.6 var(--font-display); margin-bottom: var(--s2); }
.price-table th, .price-table td { border: 1px solid var(--line); padding: .9em 1em; text-align: left; vertical-align: top; }
.price-table thead th { background: var(--mizu-wash); font-weight: 500; font-size: .9rem; letter-spacing: .06em; }   /* 表頭＝水の面（text 13:1） */
.price-table .num { font-family: var(--font-en); text-align: right; white-space: nowrap; }
.price-table tbody th { font-weight: 500; background: var(--washi); }
.table-notes { margin-top: var(--s2); }
.table-notes li { font-size: var(--fs-small); color: var(--text-muted); padding-left: 1.2em; text-indent: -1.2em; }

/* モバイル: 定義リスト型に組み替え */
@media (max-width: 699px) {
  .price-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .price-table, .price-table tbody, .price-table tr, .price-table th, .price-table td { display: block; }
  .price-table { border: 0; }
  .price-table tr { border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: var(--s2); background: var(--washi); }
  .price-table th, .price-table td { border: 0; border-bottom: 1px solid var(--line); padding: .8em 1em; }
  .price-table tr > *:last-child { border-bottom: 0; }
  .price-table tbody th { background: var(--washi-2); }
  .price-table td::before {
    content: attr(data-label);
    display: block;
    font-size: .72rem; font-weight: 500; letter-spacing: .1em;
    color: var(--text-muted); margin-bottom: 2px;
  }
  .price-table .num { text-align: left; white-space: normal; }
}

/* ---------- 17. 導入タイムライン ---------- */
.timeline { position: relative; margin-top: var(--s4); }
.timeline li {
  position: relative;
  padding: 0 0 var(--s4) calc(var(--s4) + 6px);
  border-left: 1px solid var(--line);
  margin-left: 3px;
}
.timeline li:last-child { padding-bottom: 0; }
.timeline li::before {
  content: ""; position: absolute; left: -3.5px; top: .6em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--bengara);
}
.timeline .step-num {
  font: 400 .8rem/1 var(--font-en); letter-spacing: .22em;
  color: var(--text-muted); display: block; margin-bottom: 4px;
}
.timeline h3 { font-size: 1.1rem; }
.timeline p { font-size: .95rem; color: var(--text-muted); margin-top: 4px; }

/* ---------- 18. 3つのサイクル / 課題カード ---------- */
.cycle-cards, .issue-cards { display: grid; gap: var(--s3); margin-top: var(--s4); }
.cycle-card, .issue-card {
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: var(--s3); background: var(--washi);
}
.cycle-card .step-num {
  font: 400 1.3rem/1 var(--font-en); color: var(--mizu-deep);
  display: block; margin-bottom: var(--s2);
}
.cycle-card h3 { font-size: 1.1rem; }
.cycle-card .en { display: block; font: 400 .72rem/1 var(--font-en); letter-spacing: .22em; text-transform: uppercase; color: var(--text-muted); margin-top: 6px; }
.cycle-card p { font-size: .95rem; margin-top: var(--s2); }
.issue-card h3 { font: 500 1rem/1.7 var(--font-body); }
.issue-card p { font-size: .95rem; color: var(--text-muted); margin-top: 8px; }
@media (min-width: 700px) {
  .cycle-cards { grid-template-columns: repeat(3, 1fr); }
  .issue-cards { grid-template-columns: repeat(2, 1fr); gap: var(--s3); }
}

/* 依頼先テキストグリッド */
.client-grid {
  display: grid; grid-template-columns: 1fr; margin-top: var(--s3);
  border-top: 1px solid var(--line);
}
.client-grid li { border-bottom: 1px solid var(--line); padding: var(--s2) 4px; font-size: .95rem; letter-spacing: .04em; }
@media (min-width: 600px) {
  .client-grid { grid-template-columns: 1fr 1fr; column-gap: var(--s4); }
}

/* ---------- 19. Method 2枚カード（About） ---------- */
.method-cards { display: grid; gap: var(--s3); }
.method-card { border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(24px, 4vw, var(--s4)); background: var(--washi); }
.method-card .en {
  display: block; font: 400 .78rem/1.4 var(--font-en);
  letter-spacing: .26em; text-transform: uppercase; color: var(--mizu-deep);
}
.method-card h3 { margin-top: var(--s2); }
.method-card > p { margin-top: var(--s2); font-size: .95rem; }
.method-card .fire-list { margin-top: var(--s3); }
.method-card .fire-list li { font-size: .95rem; margin-bottom: .4em; }
@media (min-width: 700px) { .method-cards { grid-template-columns: 1fr 1fr; gap: var(--s4); } }

/* ---------- 20. Profile（ダーク面） ---------- */
.profile-grid { display: grid; gap: var(--s4); }
@media (min-width: 900px) { .profile-grid { grid-template-columns: 4fr 6fr; gap: var(--s6); align-items: start; } }
.profile-grid > figure { border: 1px solid var(--line-dark); border-radius: var(--radius); overflow: hidden; }
.profile-grid > figure img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 20%; }
.profile-grid > figure figcaption { font-size: var(--fs-small); color: var(--on-dark-muted); padding: .6em .9em; border-top: 1px solid var(--line-dark); }
.profile-name { font: 700 var(--fs-h3)/1.6 var(--font-display); }
.profile-name .en { font: 400 .78rem/1 var(--font-en); letter-spacing: .26em; text-transform: uppercase; color: var(--on-dark-muted); margin-left: 1em; }
.title-list { margin-top: var(--s3); border-top: 1px solid var(--line-dark); }
.title-list li { border-bottom: 1px solid var(--line-dark); padding: 10px 4px; font-size: .95rem; letter-spacing: .04em; }
.profile-bio { margin-top: var(--s4); }
.profile-bio p + p { margin-top: 1.4em; }
.profile-sub { margin-top: var(--s4); }
.profile-sub h3 { font-size: 1.05rem; color: var(--on-dark); }
.book-list { margin-top: var(--s2); }
.book-list li { position: relative; padding-left: 1.4em; margin-bottom: .4em; font-size: .95rem; }
.book-list li::before {
  content: ""; position: absolute; left: 0; top: .85em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--hi);
}

/* ---------- 21. コラム ---------- */
.post-list { border-top: 1px solid var(--line); }
.post-item { border-bottom: 1px solid var(--line); }
.post-item > a {
  display: grid; grid-template-columns: 120px 1fr; gap: var(--s3);
  padding: var(--s3) var(--s1);
  text-decoration: none; color: var(--text);
  transition: background .3s ease;
}
.post-item > a:hover { background: var(--mizu-wash); color: var(--text); }   /* 回遊に水が差す */
.post-item figure { width: 120px; }
.post-item figure img { width: 120px; height: 90px; object-fit: cover; border-radius: var(--radius); }
.post-item__cat {
  display: inline-block; font-size: .72rem; letter-spacing: .08em; line-height: 1;
  padding: .5em .9em; border-radius: var(--radius);
  background: var(--mizu-wash); border: 1px solid var(--line); color: var(--mizu-deep);
}
.post-item > a:hover .post-item__cat { background: var(--washi); }
.post-item h3 { font-size: 1.05rem; line-height: 1.7; margin-top: 8px; }
.post-item time { display: block; font-size: var(--fs-small); color: var(--text-muted); margin-top: 6px; font-family: var(--font-en); letter-spacing: .08em; }

.pagination { display: flex; justify-content: center; gap: var(--s2); margin-top: var(--s5); }
.pagination a, .pagination span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px; min-height: 44px;
  font: 400 1rem/1 var(--font-en);
  text-decoration: none; color: var(--text);
  border-radius: var(--radius);
}
.pagination .current { position: relative; color: var(--mizu-ink); }
.pagination .current::after {
  content: ""; position: absolute; bottom: 4px; left: 50%; transform: translateX(-50%);
  width: 6px; height: 6px; border-radius: 50%; background: var(--bengara);
}
.pagination a:hover { background: var(--mizu-wash); }   /* ページ送り＝回遊。水が差す */

/* 記事本文 */
.article { padding-block: var(--s5) var(--section-pad); }
.article__head { margin-bottom: var(--s5); }
.article__head h1 { font: 700 clamp(1.5rem, 4vw, 2.1rem)/1.7 var(--font-display); letter-spacing: .04em; margin-top: var(--s2); }
.article__meta { display: flex; flex-wrap: wrap; gap: var(--s2); align-items: center; margin-top: var(--s3); }
.article__meta time { font-family: var(--font-en); font-size: var(--fs-small); color: var(--text-muted); letter-spacing: .08em; }
.article__eyecatch { margin: var(--s4) 0 0; }
.article__eyecatch img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius); }
.article__eyecatch figcaption { font-size: var(--fs-small); color: var(--text-muted); text-align: center; margin-top: .8em; }

.article-body { font-size: 1.0625rem; line-height: 2.0; }
.article-body > p { margin-bottom: 1.6em; }
.article-body h2 {
  font: 700 var(--fs-h3)/1.7 var(--font-display); letter-spacing: .04em;
  margin: var(--s5) 0 var(--s3);
  padding-top: var(--s3); border-top: 1px solid var(--line);
}
.article-body h3 { margin: var(--s4) 0 var(--s2); }
.article-body strong { font-weight: 700; }
.article-body a { color: var(--mizu-deep); }
.article-body blockquote { border-left: 3px solid var(--mizu-deep); background: var(--mizu-wash); padding: var(--s2) var(--s3); color: var(--text-muted); margin-bottom: 1.6em; }   /* 引用＝水の面。左罫は水脈 */
.article-body figure { margin: var(--s4) 0; }
.article-body figcaption { font-size: var(--fs-small); color: var(--text-muted); text-align: center; margin-top: .8em; }

/* 目次 */
.toc {
  border: 1px solid var(--mizu-line); border-radius: var(--radius);
  background: var(--mizu-wash);   /* 目次＝回遊の地図。水の面に置く */
  padding: var(--s3);
  margin-bottom: var(--s5);
}
.toc summary {
  cursor: pointer; list-style: none;
  font: 400 var(--fs-eyebrow)/1 var(--font-en);
  letter-spacing: .30em; text-transform: uppercase; color: var(--text-muted);
}
.toc summary::-webkit-details-marker { display: none; }
.toc summary::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--bengara); display: inline-block; margin-right: .9em; vertical-align: 2px;
}
.toc ol { margin-top: var(--s2); counter-reset: toc; }
.toc ol li { counter-increment: toc; padding: 6px 0; }
.toc ol li::before {
  content: counter(toc, decimal-leading-zero);
  font: 400 .8rem/1 var(--font-en); color: var(--mizu-deep);
  margin-right: 1em; letter-spacing: .1em;
}
.toc ol a { color: var(--text); text-decoration: none; }
.toc ol a:hover { color: var(--mizu-ink); }

/* 著者ボックス */
.author-box {
  display: grid; grid-template-columns: 88px 1fr; gap: var(--s3); align-items: center;
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: var(--s3); margin-top: var(--s6);
}
.author-box img { width: 88px; height: 88px; object-fit: cover; border-radius: 50%; }
.author-box .eyebrow { margin-bottom: 4px; }
.author-box h2 { font: 700 1.1rem/1.6 var(--font-display); }
.author-box p { font-size: var(--fs-small); color: var(--text-muted); margin-top: 4px; }
.author-box a { font-size: var(--fs-small); font-weight: 500; }

.related { margin-top: var(--s6); }
.related h2 { font: 700 var(--fs-h3)/1.6 var(--font-display); margin-bottom: var(--s3); }
.article-cta { text-align: center; margin-top: var(--s6); }

/* ---------- 22. 404 ---------- */
.notfound { padding-block: calc(var(--section-pad) * .8) var(--section-pad); }
.notfound h1 { font: 700 var(--fs-h2)/1.6 var(--font-display); letter-spacing: .06em; margin-top: var(--s2); }
.notfound__msg { color: var(--text-muted); margin-top: var(--s3); }
.notfound__links { margin-top: var(--s5); border-top: 1px solid var(--line); }
.notfound__links li { border-bottom: 1px solid var(--line); }
.notfound__links a {
  display: block; padding: var(--s2) 4px; min-height: 48px;
  text-decoration: none; color: var(--text); font-weight: 500; letter-spacing: .06em;
  transition: background .3s ease;
}
.notfound__links a:hover { background: var(--washi-2); }
.notfound__links a::after { content: " →"; color: var(--mizu-deep); }
.search-form { display: flex; gap: var(--s2); margin-top: var(--s4); }
.search-form input[type="search"] {
  flex: 1;
  font: 400 1rem/1.7 var(--font-body);
  background: #FFFDF8; border: 1px solid var(--line); border-radius: var(--radius);
  padding: .7em 1em; color: var(--text);
}
.search-form input[type="search"]:focus { border-color: var(--mizu-deep); outline: 2px solid rgba(47,105,129,.18); }

/* ---------- 23. ページ内リンク罫線リスト（Program等） ---------- */
.anchor-list { border-top: 1px solid var(--line); margin-top: var(--s4); }
.anchor-list li { border-bottom: 1px solid var(--line); }
.anchor-list a {
  display: block; padding: var(--s2) 4px; min-height: 48px;
  color: var(--text); text-decoration: none; font-weight: 500; letter-spacing: .06em;
  transition: background .3s ease;
}
.anchor-list a:hover { background: var(--washi-2); }
.anchor-list a::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--bengara); display: inline-block; margin-right: .9em; vertical-align: 2px;
}
.anchor-list a::after { content: " ↓"; color: var(--text-muted); font-size: .85em; }

.btn-row { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s3); }

/* 実績2枚並び */
.photo-pair { display: grid; gap: var(--s3); margin-top: var(--s4); }
.photo-pair figure { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.photo-pair img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.photo-pair figcaption { font-size: var(--fs-small); color: var(--text-muted); padding: .6em .9em; border-top: 1px solid var(--line); }
@media (min-width: 700px) { .photo-pair { grid-template-columns: 1fr 1fr; } }

/* ---------- 24. フッター ---------- */
.site-footer { background: var(--soil-deep); color: var(--on-dark-muted); padding: var(--s6) 0 var(--s4); }
.site-footer a { color: var(--on-dark-muted); text-decoration: none; transition: color .3s ease; }
.site-footer a:hover { color: var(--on-dark); }
.footer-brand img { width: 52px; height: 52px; }
.footer-brand p { font: 400 var(--fs-eyebrow)/1.6 var(--font-en); letter-spacing: .3em; text-transform: uppercase; margin-top: var(--s2); }
.footer-cols { display: grid; gap: var(--s4); margin-top: var(--s5); }
.footer-cols h2 { font: 400 var(--fs-eyebrow)/1 var(--font-en); letter-spacing: .3em; text-transform: uppercase; color: var(--on-dark-muted); margin-bottom: var(--s2); }
.footer-cols li { padding: 5px 0; font-size: .9rem; letter-spacing: .04em; }
.footer-cols .ext::after { content: " ↗"; font-size: .8em; }
@media (min-width: 700px) { .footer-cols { grid-template-columns: repeat(3, 1fr); } }
.footer-bottom {
  margin-top: var(--s5);
  border-top: 1px solid var(--family-gold);
  padding-top: var(--s3);
  display: flex; flex-wrap: wrap; gap: var(--s2) var(--s4); justify-content: space-between;
  font-size: var(--fs-small);
}
.footer-bottom .copyright { font-family: var(--font-en); letter-spacing: .1em; }

/* ---------- 25. reveal ---------- */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s ease; }
.reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .reveal { opacity: 1; transform: none; }
  .scroll-cue { display: none; }
}

/* ---------- 26. 追記（Schedule月区切り・コラム抜粋） ---------- */
/* 月見出し: 直前のイベント行との間に地層的な余白 */
.event-row + .month-head { margin-top: var(--s6); }

/* コラム一覧: 冒頭段落の抜粋（2行で省略） */
.post-item__excerpt {
  font-size: var(--fs-small); color: var(--text-muted);
  margin-top: 6px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ---------- 27. 印刷（企業研修LPのみ） ---------- */
@media print {
  .page-kk .site-header, .page-kk .drawer, .page-kk .scroll-cue,
  .page-kk .site-footer, .page-kk .cta-band .btn,
  .page-kk .page-header .btn, .page-kk form .btn { display: none !important; }
  body.page-kk { background: #fff !important; color: #000 !important; }
  .page-kk .sec, .page-kk .sec--washi2 { background: #fff !important; color: #000 !important; }
  .page-kk .sec--dark, .page-kk .cta-band { background: #fff !important; color: #000 !important; }
  .page-kk .sec--dark h2, .page-kk .sec--dark h3, .page-kk .cta-band h2 { color: #000 !important; }
  .page-kk .page-header { height: auto; background: #fff; }
  .page-kk .page-header__img { display: none; }
  .page-kk .page-header::after { display: none; }
  .page-kk .page-header h1, .page-kk .page-header__lead { color: #000; text-shadow: none; }
  .page-kk .reveal { opacity: 1 !important; transform: none !important; }
  .page-kk .sec { padding-block: 24px; }
}

/* ---------- ロゴ差し替え（透過正方ロゴ + 文字ロゴ） ---------- */
.brand { gap: 10px; text-decoration: none; }
.brand img { display: block; filter: brightness(0) invert(1) opacity(.95); transition: filter .35s ease; }
.brand__name { font: 400 .9rem/1 var(--font-en); letter-spacing: .22em; color: var(--on-dark); transition: color .35s ease; white-space: nowrap; }
.site-header.is-scrolled .brand img,
.header-solid .site-header .brand img { filter: brightness(0) opacity(.85); }
.site-header.is-scrolled .brand__name,
.header-solid .site-header .brand__name { color: var(--text); }
.brand--footer img { filter: brightness(0) invert(1) opacity(.9); }
.brand--footer .brand__name { color: var(--on-dark); }
.footer-brand .brand { display: inline-flex; align-items: center; }
.mother-node__logo { width: 110px; height: auto; }
.hero__foot img,
.hero__brand img { filter: brightness(0) invert(1) opacity(.95); }
/* ============================================================
   28. WordPress統合（テーマ変換にともなう追加CSS）
   ============================================================ */

/* ---------- 28-1. 管理バー（ログイン時）と固定ヘッダーの重なり回避 ---------- */
body.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) {
  body.admin-bar .site-header { top: 46px; }
}

/* WP標準のスクリーンリーダー用クラス */
.screen-reader-text {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}

/* ---------- 28-2. Contact Form 7 実出力向け ---------- */
/* CF7の送信ボタンは input[type="submit"] で出力されるため、.btn-fire と同じ見た目に */
.wpcf7 input[type="submit"],
.wpcf7 .wpcf7-submit {
  display: inline-block;
  font: 500 .85rem/1 var(--font-body);
  letter-spacing: .1em;
  padding: 1.05em 2.4em;
  border-radius: var(--radius);
  border: 0;
  cursor: pointer;
  background: var(--bengara); color: #fff;
  transition: background .3s ease;
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
}
.wpcf7 input[type="submit"]:hover,
.wpcf7 .wpcf7-submit:hover { background: var(--bengara-deep); }
@media (min-width: 700px) {
  .wpcf7 input[type="submit"],
  .wpcf7 .wpcf7-submit { width: auto; }
}
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 input[type="number"],
.wpcf7 input[type="date"],
.wpcf7 select {
  width: 100%;
  font: 400 1rem/1.7 var(--font-body);
  color: var(--text);
  background: #FFFDF8;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: .9em 1em;
  transition: border-color .3s ease;
}
.wpcf7 .wpcf7-spinner { display: block; margin: var(--s2) auto 0; }
.wpcf7 .wpcf7-list-item { margin-left: 0; }
.wpcf7 .wpcf7-acceptance .wpcf7-list-item { margin: 0; }
.wpcf7 .wpcf7-acceptance .wpcf7-list-item label { display: flex; align-items: flex-start; gap: 10px; font-size: .95rem; font-weight: 400; }
.wpcf7 .wpcf7-acceptance input[type="checkbox"] { width: 18px; height: 18px; margin-top: .5em; accent-color: var(--mizu-deep); }
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--moss); color: var(--moss); }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output { border-color: var(--bengara); color: var(--bengara); }

/* CF7ショートコード未設定時の案内 */
.form-pending {
  border: 1px dashed var(--line); border-radius: var(--radius);
  padding: var(--s4); text-align: center; color: var(--text-muted); font-size: var(--fs-small);
}

/* ---------- 28-3. Events Manager（開催スケジュール） ---------- */
/* 「イベントリスト書式」で .event-row 構造を出力する前提（THEME-NOTES.md 参照）。
   ここでは EM が自動で付けるラッパー類の癖を消し、テーマの見た目に馴染ませる。 */
.em-events-list, ul.em-events-list, .em-list { border: 0; margin: 0; padding: 0; list-style: none; }
.em-events-list li, .em-list li, .em-item { list-style: none; margin: 0; padding: 0; background: transparent; border: 0; }
.entry-content .em-events-list li::before, .entry-content .em-list li::before { display: none; }
.entry-content .em-events-list li, .entry-content .em-list li { padding-left: 0; }
.em-view-container, .em-events-list-grouped { background: transparent; }
/* 月ごとのグループ見出し（EMの「日付でグループ化」出力）を month-head 相当に */
.em-events-list-grouped h2,
.entry-content h2.em-group-title {
  display: flex; align-items: baseline; gap: var(--s2);
  font: 400 1.15rem/1.4 var(--font-body); color: var(--text-muted); letter-spacing: .06em;
  padding-bottom: var(--s2); margin: var(--s6) 0 0;
  border-top: 0; border-bottom: 1px solid var(--line);
}
/* イベントが1件もない時のメッセージ */
.em-events-list .em-no-events, p.em-no-events {
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: var(--s3); color: var(--text-muted); font-size: var(--fs-small);
}
/* EMのページ送りをテーマの pagination に寄せる */
.em-pagination { display: flex; justify-content: center; gap: var(--s2); margin-top: var(--s5); }
.em-pagination a, .em-pagination span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px; min-height: 44px;
  font: 400 1rem/1 var(--font-en);
  text-decoration: none; color: var(--text); border-radius: var(--radius);
}
.em-pagination a:hover { background: var(--washi-2); }
.em-pagination .page-numbers.current { color: var(--mizu-ink); }
/* the_content 内に貼られた .event-row（書式断片）の下線・見出し余白を打ち消し */
.entry-content a.event-row { text-decoration: none; }
.entry-content .event-row h3 { margin: 0; }
.entry-content .month-head { border-top: 0; margin-top: var(--s6); }
.entry-content .month-head:first-child { margin-top: 0; }

/* ---------- 28-4. 記事本文（the_content / .entry-content） ---------- */
.entry-content > * + * { margin-top: 1.6em; }
.entry-content h2 {
  font: 700 var(--fs-h3)/1.7 var(--font-display); letter-spacing: .04em;
  margin-top: var(--s5); margin-bottom: var(--s3);
  padding-top: var(--s3); border-top: 1px solid var(--line);
}
.entry-content h3 { margin-top: var(--s4); margin-bottom: var(--s2); }
.entry-content h4 { font: 500 1.05rem/1.7 var(--font-body); margin-top: var(--s4); margin-bottom: var(--s2); }
.entry-content strong { font-weight: 700; }
.entry-content a { color: var(--mizu-deep); }
.entry-content ul, .entry-content ol { margin-bottom: 1.6em; }
.entry-content ul li {
  position: relative; padding-left: 1.4em; margin-bottom: .55em;
}
.entry-content ul li::before {
  content: ""; position: absolute; left: 0; top: .85em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--bengara);
}
.entry-content ol { counter-reset: entry-ol; }
.entry-content ol li { counter-increment: entry-ol; position: relative; padding-left: 2em; margin-bottom: .55em; }
.entry-content ol li::before {
  content: counter(entry-ol, decimal-leading-zero);
  position: absolute; left: 0; top: 0;
  font: 400 .85em/2.2 var(--font-en); color: var(--mizu-deep); letter-spacing: .08em;
}
.entry-content blockquote {
  border-left: 3px solid var(--mizu-deep); background: var(--mizu-wash);
  padding: var(--s2) var(--s3);   /* 引用＝水の面 */
  color: var(--text-muted); margin-bottom: 1.6em;
}
.entry-content table { width: 100%; border-collapse: collapse; border: 1px solid var(--line); background: var(--washi); }
.entry-content th, .entry-content td { border: 1px solid var(--line); padding: .8em 1em; text-align: left; vertical-align: top; }
.entry-content thead th { background: var(--mizu-wash); font-weight: 500; }   /* 表頭＝水の面 */
.entry-content img { border-radius: var(--radius); }
.entry-content figure { margin: var(--s4) 0; }
.entry-content figcaption, .entry-content .wp-caption-text {
  font-size: var(--fs-small); color: var(--text-muted); text-align: center; margin-top: .8em;
}
.entry-content iframe, .entry-content video { max-width: 100%; }
.entry-content .wp-block-embed iframe { width: 100%; }
.entry-content hr { border: 0; border-top: 1px solid var(--line); margin: var(--s5) 0; }
.entry-content pre {
  background: var(--washi-2); border: 1px solid var(--line); border-radius: var(--radius);
  padding: var(--s3); overflow-x: auto; font-size: var(--fs-small); line-height: 1.7;
}
.entry-content .aligncenter { margin-left: auto; margin-right: auto; display: block; }
.entry-content .alignleft { float: left; margin: 0 var(--s3) var(--s2) 0; max-width: 50%; }
.entry-content .alignright { float: right; margin: 0 0 var(--s2) var(--s3); max-width: 50%; }
.entry-content::after { content: ""; display: block; clear: both; }
.entry-content .wp-caption { max-width: 100%; }

/* 目次プラグイン（Easy Table of Contents / Table of Contents Plus 等）を
   テーマの .toc と同じトーンに寄せる */
.entry-content #toc_container,
.entry-content .ez-toc-container {
  width: 100% !important;
  border: 1px solid var(--mizu-line) !important; border-radius: var(--radius);
  background: var(--mizu-wash) !important;   /* 目次＝回遊の地図。水の面 */
  padding: var(--s3) !important;
  margin-bottom: var(--s5);
  font-size: 1rem;
}
.entry-content #toc_container li::before,
.entry-content .ez-toc-container li::before { display: none; }
.entry-content #toc_container li,
.entry-content .ez-toc-container li { padding-left: 0; }
.entry-content #toc_container a,
.entry-content .ez-toc-container a { color: var(--text); text-decoration: none; }
.entry-content #toc_container a:hover,
.entry-content .ez-toc-container a:hover { color: var(--mizu-ink); }

/* ---------- 28-5. Presto Player（動画枠） ---------- */
.video-frame .wp-block-video, .video-frame video, .video-frame iframe,
.video-frame .presto-player-wrapper, .video-frame figure { width: 100%; height: 100%; }
.video-frame iframe { border: 0; }
.video-frame:has(.presto-player-wrapper), .video-frame:has(iframe), .video-frame:has(video) { display: block; }

/* ---------- 28-6. コメント（最小限） ---------- */
.comments-area { margin-top: var(--s6); border-top: 1px solid var(--line); padding-top: var(--s4); }
.comments-area .comments-title { font: 700 var(--fs-h3)/1.6 var(--font-display); margin-bottom: var(--s3); }
.comments-area .comment-list > li { border-bottom: 1px solid var(--line); padding: var(--s3) 0; }
.comments-area .comment-meta { font-size: var(--fs-small); color: var(--text-muted); }
.comments-area .avatar { border-radius: 50%; }
.comments-area .comment-form label { display: block; font-weight: 500; margin-bottom: 8px; }
.comments-area .comment-form input[type="text"],
.comments-area .comment-form input[type="email"],
.comments-area .comment-form input[type="url"],
.comments-area .comment-form textarea {
  width: 100%; font: 400 1rem/1.7 var(--font-body); color: var(--text);
  background: #FFFDF8; border: 1px solid var(--line); border-radius: var(--radius); padding: .9em 1em;
}
.comments-area .comment-form .submit {
  font: 500 .85rem/1 var(--font-body); letter-spacing: .1em;
  padding: 1.05em 2.4em; border-radius: var(--radius); border: 0; cursor: pointer;
  background: var(--bengara); color: #fff;
}
.comments-area .comment-form .submit:hover { background: var(--bengara-deep); }

/* ---------- 28-7. 検索フォーム・一覧の細部 ---------- */
.search-form .btn { flex: 0 0 auto; }
/* 一覧サムネイル無し時のプレースホルダ */
.post-item figure.is-empty {
  width: 120px; height: 90px; border-radius: var(--radius);
  background: var(--washi-2); border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
}
.post-item figure.is-empty img { width: 44px; height: 44px; object-fit: contain; filter: brightness(0) opacity(.35); }

/* ---------- 29. 動画セクション（トップ）「フィールドの空気」 COLOR-UPDATE-SPEC §6 ---------- */
::selection { background: rgba(103,161,185,.35); }
.sec--field { background: var(--mizu-wash); padding-block: var(--section-pad); }
.sec--field .container-field { max-width: 880px; margin-inline: auto; padding-inline: var(--gutter); }
.sec--field .eyebrow { color: var(--text-muted); }
.sec--field .eyebrow::before { background: var(--bengara); }
.sec--field h2 { font: 700 var(--fs-h2)/1.5 var(--font-display); letter-spacing: .06em; color: var(--text); margin-top: var(--s2); }
.sec--field .field-lead { font-size: var(--fs-lead); line-height: 2; color: var(--text-muted); margin-top: var(--s2); }
.sec--field .video-frame {
  border: 1px solid var(--mizu-line); border-radius: var(--radius);
  aspect-ratio: 16 / 9; background: var(--soil); overflow: hidden;
  margin-top: var(--s4);
}
.sec--field figcaption { font-size: var(--fs-small); color: var(--text-muted); margin-top: var(--s2); letter-spacing: .04em; }
@media (max-width: 600px) {
  .sec--field h2 + .field-lead { margin-top: var(--s2); }
  .sec--field .video-frame { margin-top: var(--s3); }
}
/* 静的プレビュー用のプレースホルダ（テーマではPresto Playerが入る） */
.video-frame .video-placeholder {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: 100%; height: 100%; color: var(--on-dark-muted); text-align: center; gap: 12px;
}
.video-frame .video-placeholder::before {
  content: ""; width: 64px; height: 64px; border: 1px solid var(--on-dark-muted); border-radius: 50%;
  background: linear-gradient(0deg, transparent, transparent); position: relative;
  display: block;
}
.video-frame .video-placeholder span { font-size: var(--fs-small); letter-spacing: .1em; }

/* ============================================================
   30. イベント個別ページ（single-event.php / Events Manager 7.4）
   28-3（一覧のラッパー・月見出し・0件表示・ページ送り）を前提に、
   個別LPの部品と、EM 7.4 デフォルト出力の行レベル整形を持つ。
   使用トークンは既存のみ。新色・新フォント・影・グラデは使わない。
   ============================================================ */

/* ---------- 30-1. 開催概要ボックス ---------- */
.event-summary {
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--washi);
  padding: 0 var(--s3);
  margin-bottom: var(--s4);
}
.event-summary__row {
  display: grid; grid-template-columns: 1fr; gap: 2px;
  padding: var(--s2) 0;
  border-bottom: 1px solid var(--line);
}
.event-summary__row:last-child { border-bottom: 0; }
.event-summary dt {
  font: 500 var(--fs-small)/1.6 var(--font-body);
  color: var(--text-muted); letter-spacing: .06em;
}
.event-summary dt span {
  font-family: var(--font-en); text-transform: uppercase;
  letter-spacing: .22em; font-size: .7rem; margin-right: .8em;
}
.event-summary dd { font-size: .95rem; line-height: 1.9; }
.event-summary__num { font-family: var(--font-en); font-size: 1.15rem; letter-spacing: .04em; line-height: 1.7; }
.event-summary__sub { display: block; font-size: var(--fs-small); color: var(--text-muted); }
@media (min-width: 600px) {
  .event-summary { padding: 0 var(--s4); }
  .event-summary__row { grid-template-columns: 160px 1fr; gap: var(--s3); align-items: baseline; }
}

/* ---------- 30-2. 申込アンカー・申込エリア・戻るリンク ---------- */
.event-apply { margin-bottom: var(--s5); }
.event-apply .btn { display: block; width: 100%; text-align: center; }
@media (min-width: 700px) {
  .event-apply .btn { display: inline-block; width: auto; }
}
.event-body { margin-bottom: var(--s6); }
#booking { scroll-margin-top: 96px; }
.event-booking { border-top: 1px solid var(--line); padding-top: var(--s4); }
.event-contact-note { margin-top: var(--s3); font-size: var(--fs-small); color: var(--text-muted); }
.event-back { margin-top: var(--s5); }
.event-back a { font-weight: 500; letter-spacing: .06em; text-decoration: none; }
.event-back a:hover { text-decoration: underline; }

/* ---------- 30-3. 開催中止の帯（警告=弁柄・静かな1px枠） ---------- */
.event-cancelled-band {
  border: 1px solid var(--bengara); border-radius: var(--radius);
  color: var(--bengara);
  padding: var(--s2) var(--s3);
  font-size: .95rem; letter-spacing: .04em;
  margin-bottom: var(--s4);
}
.event-cancelled-band__label { font-weight: 700; margin-right: 1em; }
/* EM自身が出す通知（予約完了・エラー・一覧のキャンセル表示等） */
.em-notice {
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--washi);
  padding: .9em 1em; margin: var(--s3) 0;
  font-size: .95rem;
}
.em-notice.em-notice-error, .em-notice.em-event-cancelled { border-color: var(--bengara); color: var(--bengara); }
.em-notice.em-notice-success, .em-notice.em-notice-confirm { border-color: var(--moss); color: var(--moss); }

/* ---------- 30-4. 予約フォーム（EM 7.4 .em-booking-form）— CF7 と同じ流儀 ---------- */
.event-booking .em-booking-form p { margin-bottom: var(--s3); }
.event-booking .em-booking-form label {
  display: block; font-weight: 500; margin-bottom: 8px; letter-spacing: .04em;
}
.event-booking .em-booking-section { margin-bottom: var(--s4); }
.event-booking .em-booking-section-title {
  font: 700 var(--fs-h3)/1.6 var(--font-display); letter-spacing: .04em;
  margin-bottom: var(--s3);
}
.event-booking .em-booking-form input[type="text"],
.event-booking .em-booking-form input[type="email"],
.event-booking .em-booking-form input[type="tel"],
.event-booking .em-booking-form input[type="number"],
.event-booking .em-booking-form input[type="date"],
.event-booking .em-booking-form input[type="password"],
.event-booking .em-booking-form select,
.event-booking .em-booking-form textarea {
  width: 100%;
  font: 400 1rem/1.7 var(--font-body);
  color: var(--text);
  background: #FFFDF8;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: .9em 1em;
  transition: border-color .3s ease;
}
.event-booking .em-booking-form input:focus,
.event-booking .em-booking-form select:focus,
.event-booking .em-booking-form textarea:focus {
  border-color: var(--mizu-deep);
  outline: 2px solid rgba(47,105,129,.18);
}
.event-booking .em-booking-form textarea { min-height: 120px; resize: vertical; }
.event-booking .em-booking-form input[type="checkbox"],
.event-booking .em-booking-form input[type="radio"] {
  width: 18px; height: 18px; accent-color: var(--mizu-deep);
}
.event-booking .em-login-trigger { font-size: var(--fs-small); color: var(--text-muted); margin-bottom: var(--s3); }
/* チケット行（1px罫線で立てる。カード影なし） */
.event-booking .em-ticket {
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--washi);
  padding: var(--s2) var(--s3);
  margin-bottom: var(--s2);
}
.event-booking .em-ticket .ticket-price { display: flex; justify-content: space-between; gap: var(--s2); align-items: baseline; }
.event-booking .em-ticket .ticket-price label { margin-bottom: 0; }
.event-booking .em-ticket .ticket-price strong { font-family: var(--font-en); letter-spacing: .04em; }
.event-booking .em-ticket .ticket-desc { font-size: var(--fs-small); color: var(--text-muted); }
.event-booking .em-tickets-spaces { font-size: var(--fs-small); color: var(--text-muted); }
/* 送信ボタン = btn-fire 流（決断は火）。エラー・必須は弁柄（30-3の .em-notice で対応） */
.event-booking .em-booking-form input[type="submit"],
.event-booking .em-booking-form .em-booking-submit,
.event-booking .em-booking-form .em-form-submit {
  display: inline-block;
  font: 500 .85rem/1 var(--font-body);
  letter-spacing: .1em;
  padding: 1.05em 2.4em;
  border-radius: var(--radius);
  border: 0;
  cursor: pointer;
  background: var(--bengara); color: #fff;
  transition: background .3s ease;
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
}
.event-booking .em-booking-form input[type="submit"]:hover,
.event-booking .em-booking-form .em-booking-submit:hover,
.event-booking .em-booking-form .em-form-submit:hover { background: var(--bengara-deep); }
.event-booking .em-booking-form-buttons { text-align: center; }
@media (min-width: 700px) {
  .event-booking .em-booking-form-buttons { text-align: right; }
  .event-booking .em-booking-form input[type="submit"],
  .event-booking .em-booking-form .em-booking-submit,
  .event-booking .em-booking-form .em-form-submit { width: auto; }
}

/* ---------- 30-5. EM 7.4 デフォルト一覧出力の整形（.em-list / .em-item） ----------
   「イベントリスト書式」を設定しない場合の素の出力（templates/formats/
   event_list_item_format.php）を、.event-row と同じトーン
   （罫線リスト・Marcellus日付・カード化しない）に寄せる。 */
.em-list .em-event.em-item {
  display: grid; grid-template-columns: 1fr; gap: var(--s2);
  border-bottom: 1px solid var(--line);
  padding: var(--s3) var(--s1);
  transition: background .3s ease;
}
.em-list .em-event.em-item:hover { background: var(--washi-2); }
.em-list .em-item-image img {
  width: 100%; max-width: 220px; height: auto;
  border: 1px solid var(--line); border-radius: var(--radius);
}
/* 画像なし時の日付プレースホルダ → Marcellusの日付ブロックに */
.em-list .em-item-image-placeholder { background: transparent; border: 0; }
.em-list .em-item-image-placeholder .date { display: flex; align-items: baseline; gap: .5em; }
.em-list .em-item-image-placeholder .day { font: 400 1.6rem/1.2 var(--font-en); letter-spacing: .04em; }
.em-list .em-item-image-placeholder .month {
  font: 400 .72rem/1 var(--font-en);
  letter-spacing: .22em; text-transform: uppercase; color: var(--text-muted);
}
.em-list .em-item-title { font: 400 1.05rem/1.7 var(--font-display); letter-spacing: .04em; margin: 0; }
.em-list .em-item-title a { color: var(--text); text-decoration: none; }
.em-list .em-item-title a:hover { color: var(--mizu-ink); }
.em-list .em-item-meta { margin-top: 6px; }
.em-list .em-item-meta-line { font-size: var(--fs-small); color: var(--text-muted); }
.em-list .em-event-meta-datetime { font-family: var(--font-en); letter-spacing: .06em; }
.em-list .em-item-desc { font-size: var(--fs-small); color: var(--text-muted); margin-top: 6px; }
/* カテゴリ・タグは event-tag と同じ小タグ（回遊=水） */
.em-list .em-item-taxonomy a {
  display: inline-block;
  font-size: .72rem; letter-spacing: .08em; line-height: 1;
  padding: .5em .9em; border-radius: var(--radius);
  background: var(--mizu-wash); color: var(--mizu-deep);
  border: 1px solid var(--line);
  text-decoration: none; white-space: nowrap;
}
/* 「詳細」「予約」ボタンは一覧では静かなリンク扱い（火は個別ページの1点のみ） */
.em-list .em-item-actions { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s2); }
.em-list .em-item-actions .button {
  display: inline-block;
  font: 500 .8rem/1 var(--font-body); letter-spacing: .1em;
  padding: .9em 1.6em;
  border: 1px solid currentColor; border-radius: var(--radius);
  background: transparent; color: var(--mizu-deep);
  text-decoration: none;
  transition: color .3s ease;
}
.em-list .em-item-actions .button:hover { color: var(--mizu-ink); }
@media (min-width: 700px) {
  .em-list .em-event.em-item {
    grid-template-columns: 190px 1fr; gap: var(--s4); align-items: start;
    padding: var(--s3) var(--s2);
  }
}

/* ============================================================
   31. Events Manager 一覧（テーマ統一カード .em-wan-card）
   plugins/events-manager/templates/events-list*.php が出力する構造用
============================================================= */
.em-wan { display: block; }
.em-wan-list { display: grid; gap: var(--s4); }

.em-wan-card {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--washi);
  overflow: hidden;
  transition: border-color .3s ease;
}
.em-wan-card:hover { border-color: var(--mizu-deep); }

.em-wan-card__media { display: block; overflow: hidden; background: var(--soil); aspect-ratio: 16 / 9; }
.em-wan-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.em-wan-card:hover .em-wan-card__media img { transform: scale(1.03); }

.em-wan-card__body { padding: var(--s3); }
.em-wan-card__date { font: 400 1rem/1.5 var(--font-en); letter-spacing: .05em; color: var(--text-muted); }
.em-wan-card__date .em-wan-card__time { color: var(--text-muted); }
.em-wan-card__title { margin-top: 6px; font: 700 1.15rem/1.6 var(--font-display); letter-spacing: .02em; }
.em-wan-card__title a { color: var(--text); text-decoration: none; }
.em-wan-card__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; } /* カード全体をクリック可に */
.em-wan-card:hover .em-wan-card__title a { color: var(--mizu-ink); }

.em-wan-card__place { margin-top: 12px; font-size: var(--fs-small); color: var(--text-muted); display: flex; align-items: center; gap: .6em; }
.em-wan-card__place::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--bengara); flex: none; }

.em-wan-card__cats { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px; position: relative; z-index: 2; }
.em-wan-card__cats a {
  font-size: var(--fs-small); line-height: 1; padding: .45em .9em;
  background: var(--mizu-wash); color: var(--mizu-deep);
  border-radius: var(--radius); text-decoration: none; white-space: nowrap;
}
.em-wan-card__cats a:hover { color: var(--mizu-ink); }

.em-wan-card__more { display: inline-block; margin-top: var(--s2); font-size: var(--fs-small); font-weight: 500; color: var(--mizu-deep); letter-spacing: .06em; }
.em-wan-card__cancelled { margin-top: 12px; display: inline-block; font-size: var(--fs-small); color: var(--bengara); border: 1px solid var(--bengara); border-radius: var(--radius); padding: .3em .8em; }
.em-wan-card.is-cancelled .em-wan-card__title a { text-decoration: line-through; }
.em-wan-card.is-cancelled .em-wan-card__media { opacity: .6; }

.em-wan-empty { color: var(--text-muted); padding: var(--s4) 0; font-size: var(--fs-small); }

/* 月グループ見出し */
.em-wan-month { display: flex; align-items: baseline; gap: .8em; margin: var(--s5) 0 var(--s3); padding-bottom: var(--s2); border-bottom: 1px solid var(--line); }
.em-wan-list--grouped > .em-wan-month:first-child { margin-top: 0; }
.em-wan-month .n { font: 400 1.9rem/1 var(--font-en); color: var(--text); letter-spacing: .02em; }
.em-wan-month .en { font: 400 .78rem/1 var(--font-en); letter-spacing: .28em; text-transform: uppercase; color: var(--mizu-deep); }
.em-wan-month .ja { font-size: var(--fs-small); color: var(--text-muted); }

@media (min-width: 700px) {
  .em-wan-card { grid-template-columns: 300px 1fr; }
  .em-wan-card__media { aspect-ratio: auto; height: 100%; min-height: 200px; }
  .em-wan-card__body { padding: var(--s4); align-self: center; }
}

/* ============================================================
   32. イベント個別ページ ヒーロー（single-event.php）
   文字入りチラシ画像を想定し、アイキャッチを「背景」ではなく「ポスター」
   として扱う。タイトル帯（無地・常に可読）＋ ポスター（soil額装・文字は
   重ねない）に分離する。使用トークンは既存のみ（新色・影・グラデなし）。
   ※ 一覧カード（セクション31 .em-wan-card）には一切触れない。
   ============================================================ */
.event-hero {
  background: var(--washi-2);
  border-bottom: 1px solid var(--line);
}

/* 32-1. タイトル帯：無地。画像に重ねないので h1 は常に読める */
.event-hero__band {
  padding-top: calc(66px + var(--s5));   /* 透過ヘッダー分を確保（--plain と同流儀） */
  padding-bottom: var(--s4);
}
.event-hero .eyebrow { color: var(--text-muted); }
.event-hero .eyebrow::before { background: var(--bengara); }  /* 火の粒は不可侵 */
.event-hero__title {
  font: 700 clamp(1.6rem, 4.5vw, 2.6rem)/1.5 var(--font-display);
  letter-spacing: .06em; color: var(--text);
  margin-top: var(--s2);
}
.event-hero .breadcrumb { margin-top: var(--s2); color: var(--text-muted); }
.event-hero .breadcrumb a { color: var(--text-muted); }
.event-hero .breadcrumb a:hover { color: var(--text); }

/* 32-2. ポスター（キービジュアル）：全幅に引き伸ばさず中央・額装。文字は重ねない */
.event-hero__poster { padding-bottom: var(--s6); }
.event-poster {
  max-width: 900px; margin-inline: auto;
  aspect-ratio: 1200 / 630;          /* 推奨アイキャッチ 1200×630（OGP兼用・1.91:1） */
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--soil);           /* 想定外比率でも letterbox が世界観に馴染む */
  overflow: hidden;
}
.event-poster img {
  display: block; width: 100%; height: 100%;
  object-fit: contain;               /* チラシ全体を必ず見せる（トリミングしない） */
}