/*
Theme Name:   Astra Child — 板橋区武術太極拳連盟
Theme URI:    https://itabashi-wushu.example.com
Description:  Astra 子テーマ。深紺×金色で「誠実・清潔・信頼」を表現。
Author:       Itabashi Wushu
Template:     astra
Version:      1.1.2
Text Domain:  astra-child
*/

/* ==========================================================================
   1. CSS カスタムプロパティ（デザイントークン）
   ========================================================================== */

:root {
  /* --- Color: Navy --- */
  --navy-900: #0F2044;
  --navy-700: #1B3A6B;
  --navy-500: #2C5282;
  --navy-100: #DBEAFE;
  --navy-50:  #EFF6FF;

  /* --- Color: Gold --- */
  --gold-600: #B7862E;
  --gold-400: #D4A84B;
  --gold-50:  #FDF8EC;

  /* --- Color: Gray --- */
  --gray-900: #1A1A2E;
  --gray-600: #4B5563;
  --gray-300: #D1D5DB;
  --gray-100: #F3F4F6;
  --gray-50:  #F9FAFB;
  --white:    #FFFFFF;

  /* --- Color: Event Tags --- */
  --tag-tournament-bg:   #DBEAFE;
  --tag-tournament-text: #1B3A6B;
  --tag-workshop-bg:     #D1FAE5;
  --tag-workshop-text:   #065F46;
  --tag-exam-bg:         #FEF3C7;
  --tag-exam-text:       #92400E;
  --tag-news-bg:         #F3F4F6;
  --tag-news-text:       #374151;

  /* --- Color: State --- */
  --color-success: #059669;
  --color-warning: #D97706;
  --color-error:   #DC2626;
  --color-focus:   #3B82F6;

  /* --- Typography --- */
  --font-body:    'Noto Sans JP', 'Hiragino Sans', 'Yu Gothic', sans-serif;
  --font-heading: 'Noto Sans JP', 'Hiragino Sans', sans-serif;
  --font-mono:    'Courier New', monospace;

  /* --- Spacing (8px base) --- */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-16: 64px;
  --space-20: 80px;

  /* --- Border --- */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:  12px;
  --radius-full: 9999px;

  --border-default: 1px solid #D1D5DB;
  --border-strong:  1px solid #9CA3AF;
  --border-navy:    2px solid #1B3A6B;
  --border-gold:    2px solid #B7862E;

  /* --- Shadow --- */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07), 0 2px 4px rgba(0, 0, 0, 0.05);
  --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.08), 0 4px 6px rgba(0, 0, 0, 0.04);

  /* --- Transition --- */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);

  /* --- Layout --- */
  --container-max:     1080px;
  --container-narrow:   760px;
  --container-padding:   20px;

  /* --- Breakpoints (参照用) --- */
  --bp-sm:  480px;
  --bp-md:  768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;
}

/* ==========================================================================
   2. ベーススタイル
   ========================================================================== */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 112.5%; /* ルートフォントサイズ: 1rem = 18px（高齢者配慮） */
}

body {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.85;
  color: var(--gray-900);
  background-color: var(--white) !important;
  -webkit-font-smoothing: antialiased;
}

/* Astra が独自スタイルで上書くケースに備えた白背景の強制 */
html,
#page,
#content,
#primary,
.ast-separate-container,
.ast-plain-container,
.main-container,
.site-content,
.ast-blog-layout-1,
.ast-blog-layout-2,
.ast-blog-layout-3 {
  background-color: var(--white) !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  line-height: 1.35;
  color: var(--gray-900);
}

h1 { font-size: 2rem;    font-weight: 700; line-height: 1.3; }
h2 { font-size: 1.5rem;  font-weight: 700; }
h3 { font-size: 1.25rem; font-weight: 600; line-height: 1.4; }

a {
  color: var(--navy-700);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color var(--transition-fast);
}
a:hover { color: var(--navy-500); }

img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* アクセシビリティ: フォーカスリング */
:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 2px;
}

/* スキップリンク */
.skip-link {
  position: absolute;
  top: -100%;
  left: var(--space-4);
  background: var(--navy-700);
  color: var(--white);
  padding: var(--space-2) var(--space-4);
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  font-weight: 600;
  z-index: 9999;
  text-decoration: none;
}
.skip-link:focus {
  top: 0;
}

/* ==========================================================================
   3. コンテナ
   ========================================================================== */

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

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

/* ==========================================================================
   4. ナビゲーション
   ========================================================================== */

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--white);
  border-bottom: 1px solid var(--gray-300);
  box-shadow: var(--shadow-sm);
}

.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-padding);
}

/* ロゴ */
.site-logo {
  font-family: var(--font-heading);
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--navy-700);
  text-decoration: none;
  letter-spacing: 0.02em;
  line-height: 1.3;
}
.site-logo:hover {
  color: var(--navy-500);
  text-decoration: none;
}

/* ナビメニュー（PC） */
.global-nav {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

.global-nav__list {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: var(--space-1);
}

.global-nav__item a {
  display: block;
  padding: var(--space-2) var(--space-4);
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--gray-600);
  text-decoration: none;
  border-radius: var(--radius-sm);
  transition: color var(--transition-fast), background-color var(--transition-fast);
  white-space: nowrap;
}

.global-nav__item a:hover {
  color: var(--navy-700);
  background-color: var(--navy-50);
}

/* アクティブページ */
.global-nav__item.current-menu-item > a,
.global-nav__item.current-page-ancestor > a {
  color: var(--navy-700);
  border-bottom: 2px solid var(--navy-700);
  border-radius: 0;
  padding-bottom: calc(var(--space-2) - 2px);
}

/* ハンバーガーボタン（モバイル） */
.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--space-2);
  border-radius: var(--radius-sm);
}

.nav-toggle__bar {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--navy-700);
  border-radius: 2px;
  transition: transform var(--transition-slow), opacity var(--transition-slow);
}

/* ハンバーガー → × 変形 */
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(2) {
  opacity: 0;
}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* モバイルメニュー（オーバーレイ） */
.mobile-nav {
  display: none;
  position: fixed;
  inset: 64px 0 0;
  background: var(--white);
  z-index: 99;
  overflow-y: auto;
  padding: var(--space-4) var(--container-padding) var(--space-10);
  border-top: 1px solid var(--gray-300);
}

.mobile-nav.is-open {
  display: block;
}

.mobile-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mobile-nav__item {
  border-bottom: var(--border-default);
}

.mobile-nav__item a {
  display: block;
  padding: var(--space-4) var(--space-2);
  font-size: 1rem;
  font-weight: 500;
  color: var(--gray-900);
  text-decoration: none;
  transition: color var(--transition-fast);
}

.mobile-nav__item.current-menu-item > a {
  color: var(--navy-700);
  font-weight: 700;
}

.mobile-nav__item a:hover {
  color: var(--navy-700);
}

/* ==========================================================================
   5. ヒーローセクション
   ========================================================================== */

.hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 420px;
  background-color: var(--navy-900);
  background-size: cover;
  background-position: center;
  overflow: hidden;
}

/* オーバーレイ */
.hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(15, 32, 68, 0.55);
}

.hero__content {
  position: relative;
  z-index: 1;
  max-width: var(--container-max);
  margin-inline: auto;
  padding: var(--space-20) var(--container-padding);
  width: 100%;
}

.hero__title {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--white);
  line-height: 1.25;
  margin-bottom: var(--space-4);
}

.hero__subtitle {
  font-size: 1.125rem;
  color: var(--navy-100);
  margin-bottom: var(--space-8);
  max-width: 560px;
}

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
}

/* ==========================================================================
   6. ボタン
   ========================================================================== */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: 12px 24px;
  border-radius: 6px;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: background-color var(--transition-fast), transform var(--transition-fast),
              color var(--transition-fast), border-color var(--transition-fast);
  border: none;
  min-height: 44px;
}

/* Primary */
.btn--primary {
  background: var(--navy-700);
  color: var(--white);
}
.btn--primary:hover {
  background: var(--navy-500);
  color: var(--white);
  text-decoration: none;
}
.btn--primary:active {
  transform: scale(0.98);
}

/* Secondary */
.btn--secondary {
  background: transparent;
  color: var(--navy-700);
  border: 2px solid var(--navy-700);
  padding: 10px 24px;
}
.btn--secondary:hover {
  background: var(--navy-50);
  text-decoration: none;
}

/* ==========================================================================
   7. セクション共通
   ========================================================================== */

.section {
  padding-block: var(--space-16);
}

.section--gray {
  background: var(--gray-100);
}

.section--white {
  background: var(--white);
}

.section--navy {
  background: var(--navy-50);
}

/* セクション見出し */
.section-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--gray-900);
  padding-left: 14px;
  border-left: 4px solid var(--gold-600);
  margin-bottom: var(--space-8);
  line-height: 1.35;
}

/* スクロール入場アニメーション */
.fade-in {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity var(--transition-slow), transform var(--transition-slow);
}
.fade-in.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ==========================================================================
   8. 行事予定セクション
   ========================================================================== */

.events-section {
  background: var(--white);
}

.events-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.event-item {
  display: flex;
  gap: var(--space-4);
  padding: 14px 0;
  border-bottom: 1px solid var(--gray-100);
  align-items: flex-start;
}

.event-item:last-child {
  border-bottom: none;
}

/* 日付ボックス */
.event-date {
  flex-shrink: 0;
  min-width: 56px;
  text-align: center;
  border: var(--border-default);
  border-radius: 6px;
  padding: 4px 6px;
  background: var(--white);
}

.event-date__month {
  display: block;
  font-size: 0.75rem;
  line-height: 1.4;
  color: var(--gray-600);
  font-family: var(--font-mono);
}

.event-date__day {
  display: block;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.2;
  color: var(--navy-700);
  font-family: var(--font-heading);
}

.event-date__weekday {
  display: block;
  font-size: 0.75rem;
  line-height: 1.4;
  color: var(--gray-600);
}

/* イベント情報 */
.event-body {
  flex: 1;
  min-width: 0;
}

.event-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  margin-bottom: var(--space-1);
}

.event-tag {
  display: inline-block;
  padding: 2px 10px;
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.6;
}

.event-tag--tournament {
  background: var(--tag-tournament-bg);
  color: var(--tag-tournament-text);
}

.event-tag--workshop {
  background: var(--tag-workshop-bg);
  color: var(--tag-workshop-text);
}

.event-tag--exam {
  background: var(--tag-exam-bg);
  color: var(--tag-exam-text);
}

.event-tag--news {
  background: var(--tag-news-bg);
  color: var(--tag-news-text);
}

.event-title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--gray-900);
  margin-bottom: var(--space-1);
  line-height: 1.5;
}

.event-title a {
  color: inherit;
  text-decoration: none;
}
.event-title a:hover {
  color: var(--navy-700);
  text-decoration: underline;
}

.event-meta {
  font-size: 0.8125rem;
  color: var(--gray-600);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}

.event-meta__item {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

/* Gold アクセントカード（行事カード変形） */
.card--gold-accent {
  background: var(--white);
  border: var(--border-default);
  border-left: 4px solid var(--gold-600);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  padding: var(--space-5) var(--space-6);
  padding-left: var(--space-5);
  transition: box-shadow var(--transition-base), border-color var(--transition-base);
}

.card--gold-accent:hover {
  box-shadow: var(--shadow-md);
  border-color: var(--border-strong);
}

/* 「すべての行事を見る」リンク */
.events-footer {
  margin-top: var(--space-6);
  text-align: left; /* 左寄せ */
}

/* ==========================================================================
   9. フッター
   ========================================================================== */

.site-footer {
  background: var(--navy-900);
  color: #E5E7EB;
  padding: 48px 0 24px;
  border-top: 3px solid var(--gold-600);
}

.site-footer__inner {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-padding);
}

.site-footer__grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: var(--space-10);
  margin-bottom: var(--space-10);
}

/* フッターロゴ・説明 */
.footer-brand__logo {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--white);
  text-decoration: none;
  display: block;
  margin-bottom: var(--space-4);
}

.footer-brand__desc {
  font-size: 0.9375rem;
  color: #9CA3AF;
  line-height: 1.7;
}

/* フッターナビ */
.footer-nav__heading {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--white);
  letter-spacing: 0.05em;
  margin-bottom: var(--space-4);
  text-transform: uppercase;
}

.footer-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.footer-nav__list a {
  font-size: 0.9375rem;
  color: #93C5FD;
  text-decoration: none;
  transition: color var(--transition-fast);
}

.footer-nav__list a:hover {
  color: var(--white);
  text-decoration: underline;
}

/* コピーライト */
.site-footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: var(--space-6);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
}

.site-footer__copyright {
  font-size: 0.875rem;
  color: #9CA3AF;
}

.site-footer__legal-links {
  display: flex;
  gap: var(--space-5);
  list-style: none;
  margin: 0;
  padding: 0;
}

.site-footer__legal-links a {
  font-size: 0.875rem;
  color: #9CA3AF;
  text-decoration: none;
  transition: color var(--transition-fast);
}

.site-footer__legal-links a:hover {
  color: var(--white);
}

/* ==========================================================================
   10. 標準カード
   ========================================================================== */

.card {
  background: var(--white);
  border: var(--border-default);
  border-radius: var(--radius-md);
  padding: var(--space-5) var(--space-6);
  transition: box-shadow var(--transition-base), border-color var(--transition-base);
}

.card:hover {
  box-shadow: var(--shadow-md);
  border-color: #9CA3AF;
}

/* ==========================================================================
   11. テーブル
   ========================================================================== */

.data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9375rem;
}

.data-table th {
  background: var(--navy-900);
  color: var(--white);
  padding: 12px 16px;
  text-align: left;
  font-weight: 600;
}

.data-table td {
  padding: 12px 16px;
  border-bottom: 1px solid #E5E7EB;
}

.data-table tr:nth-child(even) td {
  background: var(--gray-50);
}

.data-table tr:hover td {
  background: var(--navy-50);
}

/* ==========================================================================
   12. フォーム
   ========================================================================== */

.form-label {
  display: block;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--gray-900);
  margin-bottom: 6px;
}

.form-input,
.form-textarea,
.form-select {
  width: 100%;
  border: var(--border-default);
  border-radius: 6px;
  padding: 10px 14px;
  font-size: 1rem;
  font-family: var(--font-body);
  color: var(--gray-900);
  background: var(--white);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.form-input:focus,
.form-textarea:focus,
.form-select:focus {
  outline: none;
  border-color: var(--navy-700);
  box-shadow: 0 0 0 3px rgba(27, 58, 107, 0.15);
}

/* ==========================================================================
   13. The Events Calendar — デフォルトクラス上書き
   ========================================================================== */

/*
 * .tribe-events-calendar-list  リスト全体ラッパー
 * .tribe-event                 各イベント行
 * .tribe-event-date-start      日付テキスト
 * .tribe-events-event-meta     場所・時間メタ情報
 */

/* リスト全体: Astra のデフォルト余白をリセットしてデザインに合わせる */
.tribe-events-calendar-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 各イベント行 */
.tribe-events-calendar-list .tribe-event {
  display: flex;
  gap: var(--space-4);
  padding: 14px 0;
  border-bottom: 1px solid var(--gray-100);
  align-items: flex-start;
  /* Astra が設定するデフォルトの border / margin をリセット */
  border-top: none;
  margin: 0;
}

.tribe-events-calendar-list .tribe-event:last-child {
  border-bottom: none;
}

/* ----- 日付ボックス ----- */
/*
 * TEC は .tribe-event-date-start に日付文字列をそのまま出力するため、
 * flex-shrink で幅を固定し、日付ボックス風に整形する。
 */
.tribe-events-calendar-list .tribe-event__date-tag {
  flex-shrink: 0;
  min-width: 56px;
  text-align: center;
  border: var(--border-default);
  border-radius: 6px;
  padding: 4px 6px;
  background: var(--white);
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* 月（abbr タグで出力される） */
.tribe-events-calendar-list .tribe-event__date-tag-month {
  display: block;
  font-size: 0.75rem;
  line-height: 1.4;
  color: var(--gray-600);
  font-family: var(--font-mono);
  text-transform: uppercase;
}

/* 日（数字） */
.tribe-events-calendar-list .tribe-event__date-tag-daynum {
  display: block;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.2;
  color: var(--navy-700);
  font-family: var(--font-heading);
}

/* 曜日 */
.tribe-events-calendar-list .tribe-event__date-tag-weekday {
  display: block;
  font-size: 0.75rem;
  line-height: 1.4;
  color: var(--gray-600);
}

/* 日付文字列（フォールバック: .tribe-event-date-start） */
.tribe-events-calendar-list .tribe-event-date-start {
  font-size: 0.75rem;
  color: var(--navy-700);
  font-weight: 700;
}

/* ----- イベント本文エリア ----- */
.tribe-events-calendar-list .tribe-event__body {
  flex: 1;
  min-width: 0;
}

/* イベントタイトル */
.tribe-events-calendar-list .tribe-event__title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--gray-900);
  margin: 0 0 var(--space-1);
  line-height: 1.5;
}

.tribe-events-calendar-list .tribe-event__title a {
  color: inherit;
  text-decoration: none;
  transition: color var(--transition-fast);
}

.tribe-events-calendar-list .tribe-event__title a:hover {
  color: var(--navy-700);
  text-decoration: underline;
}

/* カテゴリバッジ（.tribe-event-categories） */
.tribe-events-calendar-list .tribe-event__categories {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  margin-bottom: var(--space-1);
  list-style: none;
  padding: 0;
}

.tribe-events-calendar-list .tribe-event__categories a {
  display: inline-block;
  padding: 2px 10px;
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.6;
  text-decoration: none;
  /* デフォルト: お知らせ配色 */
  background: var(--tag-news-bg);
  color: var(--tag-news-text);
  transition: opacity var(--transition-fast);
}

.tribe-events-calendar-list .tribe-event__categories a:hover {
  opacity: 0.8;
}

/* カテゴリ別配色（実際の slug: contest / seminar / examination）*/
/* 大会 */
.tribe-events-calendar-list .tribe-event__categories .cat-contest a {
  background: var(--tag-tournament-bg);
  color: var(--tag-tournament-text);
}

/* 講習会 */
.tribe-events-calendar-list .tribe-event__categories .cat-seminar a {
  background: var(--tag-workshop-bg);
  color: var(--tag-workshop-text);
}

/* 検定 */
.tribe-events-calendar-list .tribe-event__categories .cat-examination a {
  background: var(--tag-exam-bg);
  color: var(--tag-exam-text);
}

/* ----- メタ情報（場所・時間）----- */
.tribe-events-calendar-list .tribe-events-event-meta {
  font-size: 0.8125rem;
  color: var(--gray-600);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: var(--space-1);
  /* TEC が付けるデフォルト margin / padding をリセット */
  margin-left: 0;
  padding: 0;
  background: none;
}

.tribe-events-calendar-list .tribe-events-event-meta dt {
  /* TEC は定義リストを使う場合がある — 非表示に */
  display: none;
}

.tribe-events-calendar-list .tribe-events-event-meta dd,
.tribe-events-calendar-list .tribe-events-event-meta .tribe-venue,
.tribe-events-calendar-list .tribe-events-event-meta .tribe-event-schedule-details {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  margin: 0;
  font-size: 0.8125rem;
  color: var(--gray-600);
}

/* TEC ページネーション */
.tribe-events .tribe-events-calendar-list__nav {
  display: flex;
  justify-content: space-between;
  margin-top: var(--space-6);
  padding-top: var(--space-4);
  border-top: var(--border-default);
}

.tribe-events .tribe-events-calendar-list__nav a {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--navy-700);
  text-decoration: none;
  transition: color var(--transition-fast);
}

.tribe-events .tribe-events-calendar-list__nav a:hover {
  color: var(--navy-500);
  text-decoration: underline;
}

/* TEC「イベントなし」メッセージ */
.tribe-events .tribe-events-calendar-list--no-events {
  padding: var(--space-8) 0;
  text-align: center;
  color: var(--gray-600);
  font-size: 0.9375rem;
}

/* ==========================================================================
   14. ブログカード（.post-card）
   ========================================================================== */

.post-card {
  display: flex;
  flex-direction: column;
  background: var(--white);
  border: var(--border-default);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: box-shadow var(--transition-base), border-color var(--transition-base),
              transform var(--transition-base);
  text-decoration: none;
  color: inherit;
}

.post-card:hover {
  box-shadow: var(--shadow-lg);
  border-color: #9CA3AF;
  transform: translateY(-2px);
  text-decoration: none;
  color: inherit;
}

/* サムネイル */
.post-card__thumbnail {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--gray-100);
  flex-shrink: 0;
}

.post-card__thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition-slow);
}

.post-card:hover .post-card__thumbnail img {
  transform: scale(1.04);
}

/* サムネイルなしのプレースホルダー */
.post-card__thumbnail--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--navy-50);
  color: var(--navy-100);
}

/* カード本文 */
.post-card__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: var(--space-5) var(--space-5) var(--space-6);
}

/* カテゴリバッジ */
.post-card__category {
  display: inline-block;
  padding: 2px 10px;
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.6;
  background: var(--navy-100);
  color: var(--navy-700);
  margin-bottom: var(--space-2);
  text-decoration: none;
  align-self: flex-start;
  transition: opacity var(--transition-fast);
}

.post-card__category:hover {
  opacity: 0.8;
  text-decoration: none;
}

/* タイトル */
.post-card__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--gray-900);
  line-height: 1.5;
  margin-bottom: var(--space-2);
  /* 3行で省略 */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 抜粋テキスト */
.post-card__excerpt {
  font-size: 0.9375rem;
  color: var(--gray-600);
  line-height: 1.7;
  flex: 1;
  margin-bottom: var(--space-4);
  /* 3行で省略 */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* メタ情報（投稿日・著者） */
.post-card__meta {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  font-size: 0.8125rem;
  color: var(--gray-600);
  margin-top: auto;
  padding-top: var(--space-4);
  border-top: var(--border-default);
}

.post-card__meta-item {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

/* カードグリッド（3カラム） */
.post-card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-6);
}

/* カードグリッド（2カラム） */
.post-card-grid--2col {
  grid-template-columns: repeat(2, 1fr);
}

/* ==========================================================================
   15. Astra ナビゲーション上書き
   ========================================================================== */

/*
 * Astra が出力するヘッダークラスを CSS 変数で統一する。
 * カスタムヘッダー (.main-header-bar) と標準ヘッダー (#masthead) の両方を対象。
 */

/* ヘッダーバー本体 */
.main-header-bar,
#masthead.site-header {
  background: var(--white);
  border-bottom: 1px solid var(--gray-300);
  box-shadow: var(--shadow-sm);
}

/* スティッキー時は影を強める */
.ast-header-sticked .main-header-bar,
.ast-sticky-active .main-header-bar {
  box-shadow: var(--shadow-md);
}

/* サイトタイトル（テキストロゴ） */
.site-title a,
.site-title a:visited {
  font-family: var(--font-heading);
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--navy-700);
  text-decoration: none;
  letter-spacing: 0.02em;
}

.site-title a:hover {
  color: var(--navy-500);
  text-decoration: none;
}

/* カスタムロゴ */
.custom-logo-link {
  text-decoration: none;
}

.custom-logo-link:hover {
  opacity: 0.85;
}

/* ===== PC ナビゲーション ===== */

/* メインナビ全体 */
.ast-nav-menu,
#ast-hf-menu-1.ast-nav-menu {
  display: flex;
  align-items: center;
  gap: 0;
}

/* ナビリンク */
.ast-nav-menu > .menu-item > a,
.ast-nav-menu > li > a {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--gray-600);
  text-decoration: none;
  padding: 8px 16px;
  border-radius: var(--radius-sm);
  transition: color var(--transition-fast), background-color var(--transition-fast);
  white-space: nowrap;
  display: block;
}

.ast-nav-menu > .menu-item > a:hover,
.ast-nav-menu > li > a:hover {
  color: var(--navy-700);
  background-color: var(--navy-50);
}

/* アクティブページ・現在のページ */
.ast-nav-menu > .current-menu-item > a,
.ast-nav-menu > .current-menu-ancestor > a,
.ast-nav-menu > .current_page_item > a,
.ast-nav-menu > .current_page_ancestor > a {
  color: var(--navy-700);
  /* 下線をボーダーで実装し、padding を微調整して位置を合わせる */
  border-bottom: 2px solid var(--navy-700);
  border-radius: 0;
  padding-bottom: 6px;
  background: transparent;
}

/* Astra がデフォルトで付ける下線や色を打ち消す */
.ast-nav-menu > .menu-item > a::after,
.ast-nav-menu > .menu-item > a::before {
  display: none !important;
}

/* ===== モバイルナビゲーション（Astra ハンバーガー） ===== */

/* Astra モバイルメニューの背景・テキスト色 */
.ast-mobile-popup-wrapper,
.ast-header-break-point .ast-mobile-header-wrap {
  background: var(--white);
}

.ast-header-break-point .ast-mobile-nav-wrap .menu-item a,
.ast-mobile-popup-wrapper .menu-item a {
  color: var(--gray-900);
  font-size: 1rem;
  font-weight: 500;
  border-bottom: var(--border-default);
  padding: var(--space-4) var(--space-4);
  text-decoration: none;
  transition: color var(--transition-fast);
}

.ast-header-break-point .ast-mobile-nav-wrap .menu-item a:hover,
.ast-mobile-popup-wrapper .menu-item a:hover {
  color: var(--navy-700);
}

.ast-header-break-point .ast-mobile-nav-wrap .current-menu-item > a,
.ast-mobile-popup-wrapper .current-menu-item > a {
  color: var(--navy-700);
  font-weight: 700;
}

/* Astra ハンバーガーアイコン色 */
.ast-mobile-menu-trigger-fill .menu-toggle-icon,
.ast-mobile-menu-trigger-minimal .menu-toggle-icon {
  background: var(--navy-700);
}

/* ==========================================================================
   16. ヒーローセクション — .wp-block-cover（カバーブロック）
   ========================================================================== */

/*
 * Gutenberg のカバーブロックをヒーローとして使う場合の上書き。
 * オーバーレイ: rgba(15,32,68,0.55) / min-height: 420px
 * タイトル: 白 2.5rem / サブタイトル: navy-100 1.125rem
 */

.wp-block-cover {
  min-height: 420px !important;
  background-color: var(--navy-900); /* 画像未設定時のフォールバック */
}

/* Gutenberg 生成のオーバーレイ要素 */
.wp-block-cover .wp-block-cover__background,
.wp-block-cover .wp-block-cover__gradient-background {
  /* エディター側で opacity を設定した場合も色を統一 */
  background-color: var(--navy-900) !important;
  opacity: 0.55 !important;
}

/* has-background-dim 旧 API（WP 5.6 以前互換） */
.wp-block-cover.has-background-dim:not(.has-background-gradient)::after {
  background: rgba(15, 32, 68, 0.55);
  opacity: 1;
}

/* 内側コンテンツ */
.wp-block-cover__inner-container {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-padding);
}

/* ヒーロータイトル（h1 / h2） */
.wp-block-cover__inner-container > h1,
.wp-block-cover__inner-container > h2,
.wp-block-cover__inner-container .wp-block-cover__inner-container h1,
.wp-block-cover h1,
.wp-block-cover h2 {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--white) !important;
  line-height: 1.25;
  margin-bottom: var(--space-4);
  text-shadow: none;
}

/* サブタイトル（p タグ） */
.wp-block-cover__inner-container > p,
.wp-block-cover p {
  font-size: 1.125rem;
  color: var(--navy-100) !important;
  max-width: 560px;
  line-height: 1.7;
  text-shadow: none;
}

/* ボタングループ（ヒーロー内） */
.wp-block-cover .wp-block-buttons {
  margin-top: var(--space-8);
}

/* ==========================================================================
   17. ページタイトル非表示
   ========================================================================== */

/*
 * 固定ページ（page）のエントリータイトル h1 を非表示にする。
 * ヒーローブロックをタイトル代わりに使うため。
 * - .page テンプレート
 * - フロントページ
 * - カスタムページテンプレート
 * 投稿一覧ページ・個別投稿のタイトルはそのまま表示する。
 */

.page .entry-title,
.page-template-default .entry-title,
.page-template .entry-title {
  display: none;
}

/* フロントページ兼ブログページのタイトルも非表示 */
.home .entry-title,
.front-page .entry-title {
  display: none;
}

/* ==========================================================================
   18. フッター — Astra クラス上書き
   ========================================================================== */

/*
 * Astra は #colophon, .footer-widget-area, .ast-small-footer 等を出力する。
 * すべてに navy-900 背景・白テキスト・gold-600 のトップラインを適用する。
 */

/* フッター全体 */
#colophon.site-footer,
.site-footer {
  background: var(--navy-900);
  color: #E5E7EB;
  border-top: 3px solid var(--gold-600);
  padding-top: 0;                    /* Astra が付与する上余白を除去 */
}

/* フッター直下の最初の子要素の余白をリセット */
.site-footer > *:first-child {
  margin-top: 0;
  padding-top: 0;
}

/* Astra フッターウィジェットエリア */
.footer-widget-area,
.ast-footer-widget-area {
  background: var(--navy-900);
  color: #E5E7EB;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* フッター内の見出し */
.footer-widget-area .widget-title,
.ast-footer-widget-area .widget-title {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--white);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-bottom: var(--space-4);
  border-left: none; /* セクション見出しの gold ラインを上書き */
  padding-left: 0;
}

/* フッター内リンク */
#colophon a,
.site-footer a,
.footer-widget-area a,
.ast-footer-widget-area a {
  color: #93C5FD;
  text-decoration: none;
  transition: color var(--transition-fast);
}

#colophon a:hover,
.site-footer a:hover,
.footer-widget-area a:hover,
.ast-footer-widget-area a:hover {
  color: var(--white);
  text-decoration: underline;
}

/* Astra コピーライトバー（.ast-small-footer） */
.ast-small-footer,
.ast-small-footer-wrap {
  background: var(--navy-900);
  color: #9CA3AF;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

/* コピーライトテキスト */
.ast-footer-copyright,
.ast-small-footer-section {
  font-size: 0.875rem;
  color: #9CA3AF;
}

.ast-footer-copyright a {
  color: #9CA3AF;
}

.ast-footer-copyright a:hover {
  color: var(--white);
}

/* ── フッターメニュー（astra_footer_content_top フックで注入）──── */
/*
 * <footer> 内の先頭（astra_footer_content_top）に注入。
 * container: 'nav', container_class: 'footer-nav'
 * menu_class: 'footer-nav-list'
 */
.footer-nav {
  padding: 32px 0;                   /* 上下均等（Astra の余分な空白を吸収） */
  margin: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-nav-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer-nav-list li {
  margin: 0;
}

.footer-nav-list a {
  font-size: 0.875rem;
  color: #93C5FD;                   /* blue-300 相当 */
  text-decoration: none;
  transition: color var(--transition-fast);
}

.footer-nav-list a:hover {
  color: #FFFFFF;
}

/* ==========================================================================
   19. ボタン — .wp-block-button（ブロックエディター）
   ========================================================================== */

/*
 * Gutenberg ボタンブロック。
 * スタイルバリエーション:
 *   デフォルト（Fill）→ プライマリー navy-700 背景・白テキスト
 *   is-style-outline  → セカンダリー 透明背景・navy-700 ボーダー
 */

/* ===== プライマリー（Fill / デフォルト） ===== */
.wp-block-button:not(.is-style-outline) .wp-block-button__link {
  background-color: var(--navy-700) !important;
  color: var(--white) !important;
  border: none;
  border-radius: 6px;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  padding: 12px 24px;
  min-height: 44px;
  text-decoration: none;
  transition: background-color var(--transition-fast), transform var(--transition-fast);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
  background-color: var(--navy-500) !important;
  color: var(--white) !important;
  text-decoration: none;
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link:active {
  transform: scale(0.98);
}

/* ===== セカンダリー（Outline） ===== */
.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link:not(:hover) {
  background-color: transparent !important;
  color: var(--navy-700) !important;
  border: 2px solid var(--navy-700) !important;
  border-radius: 6px;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  padding: 10px 24px;
  min-height: 44px;
  text-decoration: none;
  transition: background-color var(--transition-fast), color var(--transition-fast);
  display: inline-flex;
  align-items: center;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background-color: var(--navy-50) !important;
  color: var(--navy-700) !important;
  text-decoration: none;
}

/* ===== ヒーロー内ボタン（白背景で視認性を確保） ===== */
.wp-block-cover .wp-block-button:not(.is-style-outline) .wp-block-button__link {
  background-color: var(--white) !important;
  color: var(--navy-700) !important;
}

.wp-block-cover .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
  background-color: var(--navy-100) !important;
}

.wp-block-cover .wp-block-button.is-style-outline .wp-block-button__link {
  border-color: var(--white) !important;
  color: var(--white) !important;
}

.wp-block-cover .wp-block-button.is-style-outline .wp-block-button__link:hover {
  background-color: rgba(255, 255, 255, 0.15) !important;
}

/* ===== ボタングループ整列 ===== */
.wp-block-buttons {
  gap: var(--space-4);
}

/* ===== フォーカスリング（アクセシビリティ） ===== */
.wp-block-button__link:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 2px;
}

/* ==========================================================================
   21. TOPページ — カラムブロック・お知らせリスト・最新記事グリッド
   ========================================================================== */

/*
 * 対象ブロック:
 *   .wp-block-columns          カラムブロック（左70% / 右30%）
 *   .wp-block-latest-posts     最新の投稿ブロック
 *     :not(.is-grid)           → リスト表示（右列 お知らせ）
 *     .is-grid                 → グリッド表示（最新記事カード）
 *
 * 「一覧 →」リンクの配置:
 *   エディターで グループブロック > レイアウト「行」を作成し、
 *   そのグループブロックに追加 CSS クラス「section-header」を付与すること。
 *
 * カテゴリバッジ:
 *   core/latest-posts はカテゴリを出力しないため、
 *   .post-category-badge ユーティリティクラスを用意。
 *   段落ブロックや HTML ブロックで <span class="post-category-badge">カテゴリ名</span>
 *   として使用すること。
 */

/* ── .section-heading ──────────────────────────────────────────── */
/* 既存 .section-title のスタイルを流用するエイリアス。
   エディター カスタム CSS クラス欄に「section-heading」と入力して使用。 */

.section-heading,
h1.section-heading,
h2.section-heading,
h3.section-heading {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--gray-900);
  padding-left: 14px;
  border-left: 4px solid var(--gold-600);
  margin-bottom: var(--space-8);
  line-height: 1.35;
}

/* ── セクションヘッダー（見出し + 「一覧 →」横並び）──────────────── */
/*
 * 使い方 A（推奨）:
 *   グループブロック（行レイアウト）に CSS クラス「section-header」を付与。
 *   その中に 見出しブロック + リンク を配置する。
 *
 * 使い方 B（現在の実装）:
 *   段落ブロックに CSS クラス「section-header」を付与して見出しとして使い、
 *   同じグループ内の別ブロックに「一覧 →」リンクを置く。
 *   この場合、グループ自体の is-layout-flex が横並びを担当する。
 *   → p.section-header に gold ボーダー見出しスタイルを適用する。
 */

/* --- A: グループ div が section-header の場合 --- */
div.section-header,
.wp-block-group.section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-8);
}

/* ヘッダー内の見出しは margin-bottom をリセット */
div.section-header .section-heading,
div.section-header .section-title,
div.section-header h1,
div.section-header h2,
div.section-header h3 {
  margin-bottom: 0;
}

/* --- B: p / 見出し要素が section-header の場合（gold ボーダー見出し）--- */
p.section-header,
h1.section-header,
h2.section-header,
h3.section-header {
  display: block;                     /* flex を解除して通常ブロック要素に */
  font-family: var(--font-heading);
  font-size: 1.375rem;                /* 22px — 左列 ::before と統一 */
  font-weight: 700;
  color: var(--gray-900);
  padding-left: 14px;
  border-left: 4px solid var(--gold-600);
  margin: 0;                          /* margin はグループ側で管理 */
  line-height: 1.3;                   /* 左列 ::before と統一 */
}

/* --- B: p.section-header の親グループを space-between に補正 ---
 * :has() を使って「p.section-header を直接子として含む flex グループ」を対象にする。
 * Modern browsers (Chrome 105+, Safari 15.4+, Firefox 121+) でサポート。
 */
.wp-block-group-is-layout-flex:has(> p.section-header),
.is-layout-flex:has(> p.section-header) {
  justify-content: space-between !important;
  align-items: flex-start;             /* center → flex-start: margin 込み中央揃えのずれを防止 */
  margin-bottom: var(--space-8);
  gap: var(--space-4);
}

/* columns-section 右列: 見出しグループの margin-bottom をリセットして
   左列のコンテンツ開始位置と揃える（左列 ::before は margin-bottom: 8px のみ） */
.columns-section .wp-block-column:last-child .wp-block-group-is-layout-flex:has(> p.section-header),
.columns-section .wp-block-column:last-child .is-layout-flex:has(> p.section-header) {
  margin-bottom: 0;
}

/* 「一覧 →」リンク共通 */
.section-header a,
.wp-block-group-is-layout-flex:has(> p.section-header) a,
.view-all-link {
  display: inline-flex;
  align-items: center;
  font-size: 0.8125rem;                /* 13px — .section-more-link と統一 */
  font-weight: 600;
  color: var(--navy-700);
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  line-height: 1.8rem;                 /* 見出し ::before の高さに合わせて縦位置を揃える */
  transition: color var(--transition-fast);
}

.section-header a:hover,
.wp-block-group-is-layout-flex:has(> p.section-header) a:hover,
.view-all-link:hover {
  color: var(--navy-500);
  opacity: 0.75;
  text-decoration: underline;
}

/* ── カラムブロック（.wp-block-columns）────────────────────────── */
/*
 * 特定のカラムブロックにのみ白背景・パディングを適用するため、
 * エディターでカスタム CSS クラス「columns-section」を付与すること。
 * 全サイトの .wp-block-columns に一律適用しない。
 */
.columns-section.wp-block-columns,
.wp-block-columns.columns-section {
  background: var(--white);
  padding-block: var(--space-16); /* 64px */
  padding-inline: var(--container-padding);
  max-width: var(--container-max);
  margin-inline: auto;
}

/* カラム間のデフォルト gap を調整 */
.columns-section.wp-block-columns .wp-block-column {
  padding: 0 var(--space-4);
}

/* 左カラム（70%想定）: 右にボーダー・section-more-link の絶対配置基点 */
.columns-section.wp-block-columns .wp-block-column:first-child {
  position: relative;
  padding-left: 0;
  border-right: var(--border-default);
  padding-right: var(--space-8);
}

/* 右カラム（30%想定） */
.columns-section.wp-block-columns .wp-block-column:last-child {
  padding-left: var(--space-8);
  padding-right: 0;
}

/* ── 「直近の予定」見出し（::before）────────────────────────────── */
/*
 * 「すべて見る →」リンクは JS（wp_footer）で DOM 挿入する。
 * → functions.php Section 11: astra_child_section_more_links()
 */

/* 「直近の予定」見出し */
.columns-section > .wp-block-column:first-child::before {
  content: '直近の予定';
  display: block;
  font-family: var(--font-heading);
  font-size: 1.375rem;               /* 22px */
  font-weight: 700;
  color: var(--gray-900);
  padding-left: 14px;
  border-left: 4px solid var(--gold-600);
  margin-bottom: 8px;
  line-height: 1.3;
}

/* ── .section-more-link（JS で挿入するリンク共通スタイル）──────── */
/*
 * 絶対配置で ::before 見出しと同じ行の右端に配置する。
 * 親要素（.wp-block-column:first-child / .articles-section）に
 * position: relative が必要。
 */
.section-more-link {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 0.8125rem;              /* 13px */
  font-weight: 600;
  color: var(--navy-700);
  text-decoration: underline;        /* 常時下線 */
  text-underline-offset: 3px;
  line-height: 1.8rem;               /* 1.375rem × 1.3 ≒ 28.6px に近い値で縦位置を揃える */
}

.section-more-link:hover {
  opacity: 0.75;
}

/* 左列「すべて見る →」: 中央ボーダーとの間に余白 */
.columns-section > .wp-block-column:first-child .section-more-link {
  right: 24px;
}

/* 右列・section-header 内の「一覧 →」も常時下線 */
.section-header a,
.wp-block-group-is-layout-flex:has(> p.section-header) a {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ── お知らせリスト（リスト表示 / 右列）────────────────────────── */

/* リセット: Astra・WP デフォルトの余白を除去 */
.wp-block-latest-posts:not(.is-grid) {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 各 <li> 行 */
.wp-block-latest-posts:not(.is-grid) li {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: 12px 0;
  border-bottom: 1px solid var(--gray-100); /* 区切り線 */
}

.wp-block-latest-posts:not(.is-grid) li:last-child {
  border-bottom: none;
}

/* 投稿タイトル（リンク） */
.wp-block-latest-posts:not(.is-grid) .wp-block-latest-posts__post-title {
  font-size: 0.875rem;           /* 14px */
  font-weight: 500;
  color: var(--gray-900);
  text-decoration: none;
  line-height: 1.5;
  transition: color var(--transition-fast);
}

.wp-block-latest-posts:not(.is-grid) .wp-block-latest-posts__post-title:hover {
  color: var(--navy-700);        /* hover 時 navy-700 */
  text-decoration: none;
}

/* 投稿日付 */
.wp-block-latest-posts:not(.is-grid) .wp-block-latest-posts__post-date {
  font-size: 0.75rem;            /* 12px */
  color: var(--gray-600);
  line-height: 1.4;
  display: block;
  order: -1;                     /* 日付をタイトルの上に表示 */
}

/* アイキャッチ（リスト表示時は非表示が多いが念のため） */
.wp-block-latest-posts:not(.is-grid) .wp-block-latest-posts__featured-image {
  display: none;
}

/* ── 最新記事グリッド（is-grid）─────────────────────────────────── */

/* グリッドラッパー自体: gray-100 背景・全幅3列固定 */
.wp-block-latest-posts.is-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  width: 100% !important;
  gap: 24px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: var(--gray-100);
  box-sizing: border-box;
}

/* columns-N クラスは columns-3 固定を上書きしない（3列を維持）
   2列・4列指定時のみ個別に対応 */
.wp-block-latest-posts.is-grid.columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.wp-block-latest-posts.is-grid.columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }

/* 各カード（<li>）*/
.wp-block-latest-posts.is-grid li {
  width: auto !important;
  min-width: 0 !important;
  background: var(--white);           /* 白背景 */
  border: 1px solid var(--gray-300); /* border gray-300 */
  border-radius: var(--radius-md);   /* radius 8px */
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow var(--transition-base), border-color var(--transition-base);
}

.wp-block-latest-posts.is-grid li:hover {
  box-shadow: var(--shadow-md);
  border-color: #9CA3AF;
}

/* アイキャッチ画像（上部・角丸付き・height 固定）
 * WordPress は デフォルトで 150×150 サムネイルを出力するため、
 * CSS で width:100% / height:200px / object-fit:cover を強制する。
 * 画質を上げたい場合はブロックエディターで画像サイズを "medium" 以上に変更すること。
 */
.wp-block-latest-posts.is-grid .wp-block-latest-posts__featured-image {
  width: 100% !important;
  margin: 0 !important;
  flex-shrink: 0;
  line-height: 0;              /* img 下の隙間を消す */
  overflow: hidden;
  height: 200px !important;   /* 固定高さ */
  /* 上部角丸（カード border-radius と合わせる）*/
  border-radius: var(--radius-md) var(--radius-md) 0 0;
}

.wp-block-latest-posts.is-grid .wp-block-latest-posts__featured-image img {
  width: 100% !important;
  height: 200px !important;   /* HTML 属性 width/height を CSS で上書き */
  object-fit: cover !important;
  object-position: center top; /* 上部を優先して切り抜き */
  display: block;
  border-radius: 0;
  transition: transform var(--transition-slow);
}

.wp-block-latest-posts.is-grid li:hover .wp-block-latest-posts__featured-image img {
  transform: scale(1.04);
}

/* カード内テキストエリア */
.wp-block-latest-posts.is-grid .wp-block-latest-posts__post-title,
.wp-block-latest-posts.is-grid .wp-block-latest-posts__post-date {
  padding-inline: var(--space-4);
}

.wp-block-latest-posts.is-grid .wp-block-latest-posts__post-title {
  padding-top: var(--space-3);
  padding-bottom: var(--space-1);
}

.wp-block-latest-posts.is-grid .wp-block-latest-posts__post-date {
  padding-bottom: var(--space-4);
  margin-top: auto;
}

/* タイトルリンク */
.wp-block-latest-posts.is-grid .wp-block-latest-posts__post-title {
  font-size: 0.875rem;         /* 14px */
  font-weight: 600;
  color: var(--gray-900);
  text-decoration: none;
  line-height: 1.5;
  display: block;
  /* 2行で省略 */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color var(--transition-fast);
}

.wp-block-latest-posts.is-grid .wp-block-latest-posts__post-title:hover {
  color: var(--navy-700);
}

/* 日付 */
.wp-block-latest-posts.is-grid .wp-block-latest-posts__post-date {
  font-size: 0.75rem;          /* 12px */
  color: var(--gray-600);
  display: block;
  line-height: 1.4;
}

/* 抜粋テキスト（3行省略）*/
.wp-block-latest-posts.is-grid .wp-block-latest-posts__post-excerpt {
  font-size: 0.8125rem;        /* 13px */
  color: var(--gray-600);
  line-height: 1.6;
  padding-inline: var(--space-4);
  padding-bottom: var(--space-2);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ── カテゴリバッジ（ユーティリティ）──────────────────────────── */
/*
 * core/latest-posts にカテゴリ出力はないため、ユーティリティクラスを提供。
 * 使用例: <span class="post-category-badge">カテゴリ名</span>
 * カスタム HTML ブロックや paragraph ブロックから使用できる。
 */
.post-category-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.6;
  background: var(--navy-50);    /* #EFF6FF */
  color: var(--navy-700);        /* #1B3A6B */
  text-decoration: none;
  margin-bottom: var(--space-2);
}

/* グリッドカード内カテゴリ */
.wp-block-latest-posts.is-grid .post-category-badge {
  margin: var(--space-3) var(--space-4) 0;
  display: inline-block;
}

/* ── articles-section（最新記事 ul.wp-block-latest-posts.is-grid）── */
/*
 * articles-section は <ul> 要素に直接付与されている（グループブロックではない）。
 * display:grid のグリッドコンテナ内で ::before / ::after を使うため、
 * ::before には grid-column: 1 / -1 を指定して全幅見出しとして表示する。
 */

/* グリッドコンテナ（.articles-section = ul.wp-block-latest-posts.is-grid）*/
/* フルワイド・グレー背景を維持しつつ内側コンテンツをコンテナ幅に収める */
.articles-section {
  position: relative;
  width: 100%;
  padding-top: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 40px;
}

/* ::before は JS 挿入の .articles-section-header に置き換え済み → 無効化 */
.articles-section::before {
  content: none !important;
}

/* ヘッダー行（見出し + 「もっと見る →」）: コンテナ幅に制限 */
.articles-section-header {
  max-width: var(--container-max, 1080px);
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  padding: 40px 20px 16px !important; /* 上余白・左右余白・下余白 */
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box !important;
  grid-column: 1 / -1;             /* grid-item として全幅にまたがる */
}

/* 「最新記事」見出しテキスト */
.articles-section-title {
  font-family: var(--font-heading);
  font-size: 1.375rem;             /* 22px */
  font-weight: 700;
  color: var(--gray-900);
  padding-left: 14px;
  border-left: 4px solid var(--gold-600);
  line-height: 1.3;
}

/* .articles-section-header 内の「もっと見る →」: 絶対配置を解除して flex で並べる */
.articles-section .section-more-link {
  position: static;
  line-height: 1.3;                /* 見出しと同じ line-height で垂直中心を揃える */
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* 3列グリッド強制 + コンテナ幅センタリング
 * .articles-section 自体がグリッドコンテナ。
 * padding-left/right でカードの左右余白を確保し、背景はフルワイドのまま維持。
 */
.articles-section.wp-block-latest-posts.is-grid,
.articles-section .wp-block-latest-posts.is-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
  width: 100% !important;
  max-width: var(--container-max, 1080px);
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
  box-sizing: border-box !important;
}

.articles-section.wp-block-latest-posts.is-grid li,
.articles-section .wp-block-latest-posts.is-grid li {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  /* WP flex 時代の nth-child margin-right が JS 挿入の header div により
     ずれて中央 li にのみ margin:0 が当たり、左右 li が ~24px 狭くなる問題を修正 */
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* ── レスポンシブ（カラムブロック・グリッド）──────────────────── */
/*
 * 768px 以下: カラム縦積み・グリッド1カラム化
 * ここでは @media を使わず、後段の responsive セクションに追記する。
 */

/* ==========================================================================
   22. The Events Calendar V2 — フロントエンド出力クラス
   ========================================================================== */

/*
 * 対象: TEC フリー版 6.x の Views V2 テンプレートが実際に出力するクラス名。
 * テンプレートパス: plugins/the-events-calendar/src/views/v2/list/
 *
 * HTML 構造（実測）:
 *   ul.tribe-events-calendar-list
 *   └─ li.tribe-events-calendar-list__month-separator   ← 月ヘッダー（月のみ、日付タグに月はない）
 *   └─ li.tribe-common-g-row.tribe-events-calendar-list__event-row
 *       ├─ div.tribe-events-calendar-list__event-date-tag.tribe-common-g-col
 *       │   └─ time.tribe-events-calendar-list__event-date-tag-datetime
 *       │       ├─ span.tribe-events-calendar-list__event-date-tag-weekday  ← 曜日（DOM順: 1番目）
 *       │       └─ span.tribe-events-calendar-list__event-date-tag-daynum   ← 日数字（DOM順: 2番目）
 *       └─ div.tribe-events-calendar-list__event-wrapper.tribe-common-g-col
 *           └─ article.tribe-events-calendar-list__event
 *               └─ div.tribe-events-calendar-list__event-details
 *                   └─ header.tribe-events-calendar-list__event-header
 *                       ├─ h4.tribe-events-calendar-list__event-title
 *                       │   └─ a.tribe-events-calendar-list__event-title-link
 *                       ├─ div.tribe-events-calendar-list__event-datetime-wrapper
 *                       │   └─ time.tribe-events-calendar-list__event-datetime
 *                       ├─ address.tribe-events-calendar-list__event-venue
 *                       │   ├─ span.tribe-events-calendar-list__event-venue-title
 *                       │   └─ span.tribe-events-calendar-list__event-venue-address
 *                       └─ div.tec-events-calendar-list__event-categories
 *                           └─ div.tec-events-calendar-list__category
 *                                   .tribe-events-calendar__category--{slug}
 *
 * ナビゲーション: nav.tribe-events-c-nav > ul.tribe-events-c-nav__list
 *   > li > a.tribe-events-c-nav__prev / .tribe-events-c-nav__next / .tribe-events-c-nav__today
 */

/* ----- 1. イベントリスト全体のコンテナ余白・背景 ----- */

/* /events/ ページの内側コンテナ余白
 * TEC デフォルト: padding-top 64-96px → 縮小してナビ直下との一貫性を確保 */
.tribe-events .tribe-events-l-container,
.tribe-events-l-container {
  padding-top: var(--space-4) !important;     /* 16px — archive ページと統一 */
  padding-bottom: var(--space-10) !important;  /* 40px */
  background: var(--white) !important;
}

/* TEC 関連の外側ラッパーをすべて白に統一 */
.tribe-events-view,
.tribe-common,
#tribe-events-pg-template,
.tribe-events-pg-template {
  background: var(--white) !important;
}

/* ul リセット（Astra や TEC のデフォルト余白を除去） */
.tribe-events .tribe-events-calendar-list,
ul.tribe-events-calendar-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* ----- 2. 月セパレーター ----- */

.tribe-events-calendar-list__month-separator {
  padding: var(--space-6) 0 var(--space-3);
  border-bottom: var(--border-gold); /* gold-600 の 2px ライン */
  margin-bottom: var(--space-2);
}

.tribe-events-calendar-list__month-separator-text {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--gray-900);
  font-style: normal;
  letter-spacing: 0.02em;
}

/* ----- 区切り線（6. イベント行の border-bottom）----- */

.tribe-events .tribe-events-calendar-list__event-row,
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-list__event-row,
.tribe-events .tribe-events-calendar-list__event-row:last-child,
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-list__event-row:last-child {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--gray-300) !important; /* gray-300 区切り線 */
}

/* 月セパレーター直後のイベント行だけ少し余白を残す */
.tribe-events .tribe-events-calendar-list__month-separator + .tribe-events-calendar-list__event-row,
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-list__month-separator + .tribe-events-calendar-list__event-row {
  margin-top: var(--space-2) !important; /* 8px */
}

/* 最後の行は区切り線なし */
.tribe-events-calendar-list__event-row:last-of-type {
  border-bottom: none;
}

/* イベント行内部の余白リセット（Astra 動的 CSS の上書き） */
.tribe-events .tribe-events-calendar-list__event-row > .tribe-common-g-col,
.tribe-events .tribe-events-calendar-list__event {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-right: 0 !important;
}

/* 最初の g-col（日付カラム）は左パディングも除去 */
.tribe-events .tribe-events-calendar-list__event-row > .tribe-common-g-col:first-child {
  padding-left: 0 !important;
}

/* time 要素の余分な縦 padding のみリセット（外枠 div の padding は維持） */
.tribe-events .tribe-events-calendar-list__event-date-tag-datetime {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* 日付タグをイベント情報に対して垂直中央揃え */
.tribe-events .tribe-events-calendar-list__event-row,
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-list__event-row {
  align-items: center !important;
}

/* イベント行のフローティング（hover shadow/transform）を無効化 */
.tribe-events .tribe-events-calendar-list__event-row,
.tribe-events .tribe-events-calendar-list__event-row *,
.tribe-events .tribe-events-calendar-list__event-row:hover,
.tribe-events .tribe-events-calendar-list__event-row:hover * {
  box-shadow: none !important;
  text-shadow: none !important;
  transform: none !important;
}

/* 日付タグ内の子要素から border を除去（外枠 div は除外して枠線を維持） */
.tribe-events .tribe-events-calendar-list__event-date-tag *,
.tribe-events .tribe-events-calendar-list__event-date-tag::before,
.tribe-events .tribe-events-calendar-list__event-date-tag::after,
.tribe-events .tribe-events-calendar-list__event-date-tag *::before,
.tribe-events .tribe-events-calendar-list__event-date-tag *::after {
  border: none !important;
  box-shadow: none !important;
  background-color: transparent !important;
  outline: none !important;
}

/* フィーチャードイベントは左に gold ライン */
.tribe-events-calendar-list__event-row--featured {
  border-left: 4px solid var(--gold-600);
  padding-left: var(--space-3);
  margin-left: calc( var(--space-3) * -1 );
}

/* ----- 2. 日付ボックス（month-separator で月を、date-tag で日・曜を表示）----- */

/* date-tag 外枠 */
.tribe-events-calendar-list__event-date-tag {
  flex-shrink: 0;
  min-width: 56px;
  text-align: center;
  border: var(--border-default);
  border-radius: 6px;
  padding: 4px 6px;
  background: var(--white);
}

/* TEC 本体 CSS (specificity 0,2,0) を確実に上書き — 枠線・背景・余白・幅を強制 */
.tribe-events .tribe-events-calendar-list__event-date-tag {
  border: var(--border-default) !important;
  border-radius: 6px !important;
  background: var(--white) !important;
  padding: 4px 6px !important;
  width: auto !important;
  min-width: 56px !important;
}

/* .tribe-common--breakpoint-medium 付与時 (0,3,0) も上書き — TEC の 90px/grid 幅を無効化 */
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-list__event-date-tag {
  width: auto !important;
  min-width: 56px !important;
}

/* g-col の padding リセット (0,3,0)/(0,4,0) を date-tag だけ除外して 4px 6px を回復
   → specificity (0,4,0): .tribe-events + event-row + date-tag + g-col = 4 classes */
.tribe-events .tribe-events-calendar-list__event-row > .tribe-events-calendar-list__event-date-tag.tribe-common-g-col {
  padding: 4px 6px !important;
}

/* TEC views-full.css が weekday の font/color/transform を上書きするため再設定 */
.tribe-events .tribe-events-calendar-list__event-date-tag-weekday {
  font-family: var(--font-body) !important;
  font-size: 0.75rem !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  color: var(--gray-600) !important;
  text-transform: none !important;
  margin-bottom: 0 !important;
}

/* TEC views-skeleton.css の daynum 負マージンを無効化（念のため） */
.tribe-events .tribe-events-calendar-list__event-date-tag-daynum {
  font-family: var(--font-heading) !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  color: var(--navy-700) !important;
  margin-bottom: 0 !important;
}

/* time 要素（flex 縦並び）*/
.tribe-events-calendar-list__event-date-tag-datetime {
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1;
}

/* 日数字 — navy-700、大きめ。DOM 上は 2番目だが CSS order で上に出す */
.tribe-events-calendar-list__event-date-tag-daynum {
  display: block;
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.2;
  color: var(--navy-700); /* navy-700 */
  order: 1;
  margin-top: 0;
}

/* 曜日 — gray-600、小さめ。DOM 上は 1番目だが CSS order で下に出す */
.tribe-events-calendar-list__event-date-tag-weekday {
  display: block;
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.6;
  color: var(--gray-600);
  order: 2;
}

/* 年月（子テーマ override で追加）— gray-600、小さめ。order 0 で最上段に表示 */
.tribe-events-calendar-list__event-date-tag-yearmonth {
  display: block;
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.4;
  color: var(--gray-600);
  order: 0;
}

/* ----- 4. イベントタイトル ----- */

/* h4 本体：TEC の tribe-common-h6 サイズを上書き */
.tribe-events-calendar-list__event-title {
  font-family: var(--font-heading);
  font-size: 0.9375rem !important; /* 15px、tribe-common-h6 の上書き */
  font-weight: 600 !important;
  color: var(--gray-900);
  margin: 0 0 var(--space-1);
  line-height: 1.5;
}

/* タイトルリンク */
.tribe-events-calendar-list__event-title-link {
  color: inherit;
  text-decoration: none;
  transition: color var(--transition-fast);
}

.tribe-events-calendar-list__event-title-link:hover {
  color: var(--navy-700); /* hover 時 navy-700 */
  text-decoration: none;
}

/* ----- 5. 場所・時間のメタ情報（gray-600 / font-size 14px）----- */

/* 日時 wrapper（tribe-common-b2 の上書き）*/
.tribe-events-calendar-list__event-datetime-wrapper {
  font-size: 0.875rem !important; /* 14px */
  color: var(--gray-600) !important;
  margin-top: var(--space-1);
  line-height: 1.55;
}

/* time 要素内テキスト */
.tribe-events-calendar-list__event-datetime {
  color: inherit;
  font-size: inherit;
}

/* 会場（address タグのデフォルト italic を解除）*/
.tribe-events-calendar-list__event-venue {
  font-style: normal;
  font-size: 0.875rem !important; /* 14px */
  color: var(--gray-600) !important;
  margin-top: var(--space-1);
  line-height: 1.55;
}

.tribe-events-calendar-list__event-venue-title {
  font-weight: 600;
  color: var(--gray-600);
}

.tribe-events-calendar-list__event-venue-address {
  color: var(--gray-600);
}

/* ----- 3. カテゴリタグ（DESIGN.md セマンティックカラー）----- */

/* タグ外ラッパー */
.tec-events-calendar-list__event-categories {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  margin-top: var(--space-2);
}

/* タグ共通ベース */
.tec-events-calendar-list__category {
  display: inline-block;
  padding: 2px 10px;
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.6;
  /* デフォルト: お知らせ配色 */
  background: var(--tag-news-bg);
  color: var(--tag-news-text);
}

/* 大会 — 実際のslug: contest */
.tribe-events-calendar__category--contest {
  background: var(--tag-tournament-bg) !important; /* #DBEAFE */
  color: var(--tag-tournament-text) !important;    /* #1B3A6B */
}

/* 講習会 — 実際のslug: seminar */
.tribe-events-calendar__category--seminar {
  background: var(--tag-workshop-bg) !important;  /* #D1FAE5 */
  color: var(--tag-workshop-text) !important;     /* #065F46 */
}

/* 検定 — 実際のslug: examination */
.tribe-events-calendar__category--examination {
  background: var(--tag-exam-bg) !important;      /* #FEF3C7 */
  color: var(--tag-exam-text) !important;         /* #92400E */
}

/* ----- イベントなし メッセージ ----- */

.tribe-events-calendar-list--no-events,
.tribe-events-notices,
.tribe-events .tribe-events-notices {
  padding: var(--space-8) 0;
  text-align: center;
  font-size: 0.9375rem;
  color: var(--gray-600);
}

/* ----- 7. ナビゲーション（「前へ」「次へ」「今日」）非表示 -----
 * TOP ページのショートコード出力では不要なため CSS でも非表示にする。
 * JS（DOMContentLoaded）でも除去済み。
 */
.tribe-events-c-nav,
.tribe-events__nav-pagination,
.events-footer,
.tribe-events-calendar-list__nav-link-wrapper {
  display: none !important;
}

/* nav 全体（/events/ ページ用スタイルは残す） */
.tribe-events-calendar-list-nav,
.tribe-events-c-nav {
  margin-top: var(--space-6);
  padding-top: var(--space-6);
  border-top: var(--border-default);
}

/* ul リスト */
.tribe-events-c-nav__list {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
}

/* 「前へ」「次へ」共通 — navy-700 のアウトラインボタン */
.tribe-events-c-nav__prev,
.tribe-events-c-nav__next {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-body);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--navy-700);
  background: transparent;
  border: 2px solid var(--navy-700);
  border-radius: 6px;
  padding: 8px 18px;
  min-height: 44px;
  text-decoration: none;
  transition: background-color var(--transition-fast), color var(--transition-fast);
}

.tribe-events-c-nav__prev:hover,
.tribe-events-c-nav__next:hover {
  background: var(--navy-50);
  color: var(--navy-700);
  text-decoration: none;
}

/* SVG アイコン色 */
.tribe-events-c-nav__prev-icon-svg,
.tribe-events-c-nav__next-icon-svg {
  fill: currentColor;
  width: 16px;
  height: 16px;
}

/* 非活性状態（disabled）*/
.tribe-events-c-nav__prev--disabled,
.tribe-events-c-nav__next--disabled {
  border-color: var(--gray-300);
  color: var(--gray-300);
  pointer-events: none;
}

/* 「今日」ボタン */
.tribe-events-c-nav__today {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--navy-700);
  text-decoration: none;
  padding: 8px var(--space-4);
  border-radius: 6px;
  transition: background-color var(--transition-fast);
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

.tribe-events-c-nav__today:hover {
  background: var(--navy-50);
  text-decoration: none;
}

/* 非活性 */
.tribe-events-c-nav__today--disabled {
  color: var(--gray-300);
  pointer-events: none;
}

/* ----- TEC が出力する tribe-common-* ユーティリティの上書き ----- */

/* Astra が margin: 0 を h4 に設定していない場合の保険 */
.tribe-events .tribe-common-h6 {
  margin: 0;
}

/* TEC 独自フォントサイズ変数を無効化（Noto Sans JP を使用） */
.tribe-events,
.tribe-events * {
  font-family: var(--font-body);
}

.tribe-events h1,
.tribe-events h2,
.tribe-events h3,
.tribe-events h4 {
  font-family: var(--font-heading);
}

/* ==========================================================================
   20. レスポンシブ（WordPress/Astra 固有クラス）
   ========================================================================== */

@media (max-width: 1024px) {
  /* ブログカード: 3カラム → 2カラム */
  .post-card-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  /* ナビゲーション（カスタムクラス） */
  .global-nav {
    display: none;
  }

  .nav-toggle {
    display: flex;
  }

  /* ヒーロー */
  .hero {
    min-height: 260px;
  }

  .hero__title {
    font-size: 1.75rem;
  }

  .hero__subtitle {
    font-size: 1rem;
  }

  .hero__content {
    padding-block: var(--space-10);
  }

  /* セクション */
  .section {
    padding-block: var(--space-10);
  }

  /* フッターグリッド → 1カラム */
  .site-footer__grid {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }

  .site-footer__bottom {
    flex-direction: column;
    align-items: flex-start;
  }

  /* テーブル横スクロール */
  .table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* TEC イベント行: 縦積みにしない（日付ボックスはそのまま横並び） */
  .tribe-events-calendar-list .tribe-event {
    gap: var(--space-3);
  }

  /* TEC V2 ネイティブ: コンテナ余白縮小 */
  .tribe-events .tribe-events-l-container,
  .tribe-events-l-container {
    padding-top: var(--space-4) !important;
    padding-bottom: var(--space-8) !important;
  }

  /* TEC V2 ナビゲーション: ボタンを縮小 */
  .tribe-events-c-nav__prev,
  .tribe-events-c-nav__next {
    padding: 8px 12px;
    font-size: 0.875rem;
  }

  /* ブログカード: 2カラム → 1カラム */
  .post-card-grid,
  .post-card-grid--2col {
    grid-template-columns: 1fr;
  }

  /* 最新記事グリッド: 3カラム → 1カラム */
  .wp-block-latest-posts.is-grid,
  .articles-section.wp-block-latest-posts.is-grid,
  .articles-section .wp-block-latest-posts.is-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 480px) {
  /* カバーブロック: SP 最小高さ・フォントサイズ縮小 */
  .wp-block-cover {
    min-height: 260px !important;
  }

  .wp-block-cover h1,
  .wp-block-cover h2 {
    font-size: 1.25rem;
  }

  /* カバーブロック サブタイトル（p）*/
  .wp-block-cover__inner-container > p,
  .wp-block-cover p {
    font-size: 1rem;
  }

  /* ボタンブロック: 全幅に */
  .wp-block-buttons.is-layout-flex {
    flex-direction: column;
  }

  .wp-block-button__link {
    width: 100%;
    justify-content: center;
  }

  .hero__title {
    font-size: 1.5rem;
  }

  .hero__actions {
    flex-direction: column;
  }

  .btn {
    width: 100%;
    justify-content: center;
  }

  /* TEC V2 ネイティブ: ナビゲーションを縦積み */
  .tribe-events-c-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-3);
  }

  .tribe-events-c-nav__prev,
  .tribe-events-c-nav__next,
  .tribe-events-c-nav__today {
    justify-content: center;
    width: 100%;
  }

  /* TEC V2 ネイティブ: スマホでも date-tag を表示（サイズ縮小） */
  .tribe-events-calendar-list__event-date-tag {
    min-width: 44px;
    padding: 3px 5px;
  }
  .tribe-events-calendar-list__event-date-tag-daynum {
    font-size: 1.25rem;
  }

  /* TEC カスタムショートコード: スマホでも date-tag を表示（サイズ縮小） */
  .tribe-events-calendar-list .tribe-event__date-tag {
    min-width: 44px;
    padding: 4px 5px;
  }
  .tribe-events-calendar-list .tribe-event__date-tag-daynum {
    font-size: 1.25rem;
  }

  .tribe-events-calendar-list .tribe-events-event-meta {
    flex-direction: column;
    gap: var(--space-1);
  }
}

/* ==========================================================================
   21. 下層ページ（投稿・固定ページ・アーカイブ）用スタイル
   ========================================================================== */

/* ── 21.1 汎用コンテナ・幅 ── */

/* Astra コンテナの基準幅を --container-max に強制設定 */
.ast-container {
  max-width: var(--container-max) !important;
}

/* アーカイブ・ブログページの site-content / #content / #page 上部余白をリセット
 * ast-separate-container のページ全体のマージンも統一 */
.archive .site-content,
.blog .site-content,
.archive #content,
.blog #content,
.ast-separate-container .site-content,
.ast-separate-container #content {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

body.ast-separate-container,
body.archive,
body.blog,
body.post-type-archive {
  padding-top: 0 !important;
}

body.ast-separate-container #page,
body.archive #page,
body.post-type-archive #page {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* アーカイブ・ブログページのコンテンツ上部余白を最小化
 * #content 内に限定（ヘッダー内 .ast-container への誤適用を防止） */
.archive #content > .ast-container,
.blog #content > .ast-container {
  padding-top: var(--space-4) !important;   /* 16px */
}

/* Astra 静的CSS: .ast-separate-container #primary { margin: 4em 0; padding: 4em 0; }
 * → アーカイブ・ブログで #primary の margin/padding を全てリセット */
.archive #primary,
.blog #primary,
.ast-separate-container #primary,
.ast-separate-container.ast-right-sidebar #primary,
.ast-separate-container.ast-left-sidebar #primary {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* layout-2 使用時に生成される ast-archive-entry-banner の余白を除去。
 * layout-1（デフォルト）では archive-banner.php が呼ばれず要素は生成されないが、
 * layout-2 に切り替えた場合の保険として残す。 */
.ast-archive-entry-banner {
  display: none !important;
}

/* その他のAstra自動生成バナー類の余白もリセット */
.archive .ast-page-hero-section,
.blog .ast-page-hero-section,
.archive .ast-breadcrumbs-wrapper,
.blog .ast-breadcrumbs-wrapper {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* 固定ページ（サイドバーなし）はコンテナ幅を絞る */
.page.no-sidebar .site-content > .ast-container {
  max-width: var(--container-narrow) !important;
}

/* 2fr + 1fr のレイアウト設定（PC） */
@media (min-width: 769px) {
  .right-sidebar #primary {
    width: 66.666% !important;
    padding-right: var(--space-10);
  }
  .right-sidebar #secondary {
    width: 33.333% !important;
    padding-left: 0;
  }
}

@media (max-width: 768px) {
  /* モバイル時は 1カラム */
  .right-sidebar #primary,
  .right-sidebar #secondary {
    width: 100% !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  
  .right-sidebar #secondary {
    margin-top: var(--space-10);
  }
}

/* ── 21.2 ページ・投稿タイトル ── */

.ast-archive-title,
.ast-single-post .entry-title {
  font-family: var(--font-heading);
  font-size: 2rem;
  font-weight: 700;
  color: var(--navy-900);
  margin-bottom: var(--space-6);
  line-height: 1.3;
}

/* アーカイブページタイトル: top3.pngのセクション見出しに合わせて縮小 */
.ast-archive-title {
  padding-left: 14px;
  border-left: 4px solid var(--gold-600);
  font-size: 1.375rem !important;  /* top3 の「最新記事」見出しと同サイズ */
  margin-bottom: var(--space-5) !important;
}

/* アーカイブページヘッダーエリア: 余白を最小限に絞り、カード左端に揃える */
/* Astra 静的CSS: .ast-separate-container .ast-archive-description { padding: 5em 6.67em 3.33333em }
 * Astra 動的CSS: body.archive .ast-archive-description { padding-top: 3em; padding-left: 3em; ... }
 * → これらを全て 0 に上書き */
body.archive .ast-archive-description,
body.blog .ast-archive-description,
.ast-separate-container .ast-archive-description,
.ast-archive-description,
.archive .page-header,
.ast-archive-description-wrapper {
  margin: 0 !important;
  padding: 0 !important;
  margin-bottom: var(--space-5) !important;
  color: var(--gray-600);
  font-size: 1.0625rem;
}

/* タイトル自体の左位置も揃える */
.ast-archive-title {
  margin-left: 0 !important;
}

/* メタ情報（日付・著者・親カテゴリなど） */
.entry-meta,
.ast-archive-description .ast-archive-meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  font-size: 0.9375rem;
  color: var(--gray-600);
  margin-bottom: var(--space-8);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--gray-300);
}

.entry-meta a {
  color: var(--navy-700);
  text-decoration: none;
}

.entry-meta a:hover {
  text-decoration: underline;
}

/* ── 21.3 本文（.entry-content）のデザイン ── */

.entry-content {
  font-size: 1.0625rem;
  line-height: 1.85;
  color: var(--gray-900);
}

.entry-content p {
  margin-bottom: var(--space-6);
}

/* 見出し h2 */
.entry-content h2 {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--gray-900);
  margin-top: var(--space-16);
  margin-bottom: var(--space-6);
  padding-left: 14px;
  border-left: 4px solid var(--gold-600);
  line-height: 1.35;
}

/* 記事先頭の h2 は上余白を減らす */
.entry-content > h2:first-child {
  margin-top: 0;
}

/* 見出し h3 */
.entry-content h3 {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--gray-900);
  margin-top: var(--space-10);
  margin-bottom: var(--space-4);
  padding-bottom: 8px;
  border-bottom: 1px solid var(--gray-300);
  line-height: 1.4;
}

/* 見出し h4 */
.entry-content h4 {
  font-family: var(--font-heading);
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--navy-700);
  margin-top: var(--space-8);
  margin-bottom: var(--space-2);
}

/* リスト */
.entry-content ul,
.entry-content ol {
  margin-bottom: var(--space-6);
  padding-left: var(--space-6);
}

.entry-content li {
  margin-bottom: var(--space-2);
}

/* 引用（blockquote） */
.entry-content blockquote {
  margin: var(--space-8) 0;
  padding: var(--space-4) var(--space-6);
  background: var(--navy-50);
  border-left: 4px solid var(--navy-500);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  color: var(--gray-600);
  font-style: normal;
}

.entry-content blockquote p:last-child {
  margin-bottom: 0;
}

/* ── 21.4 サイドバー・ウィジェット ── */

#secondary .widget-area {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

/* .widget 内の余白を初期化し、.card の設定にゆだねる */
#secondary .widget {
  margin-bottom: 0; /* flex gap で管理 */
}

/* サイドバー見出し: 22.4 の !important ルールに統一 → ここでは削除済み */

/* サイドバー内のリストリセット（WPデフォルトウィジェット対応） */
#secondary .widget ul:not([class*="wp-block"]) {
  list-style: none;
  margin: 0;
  padding: 0;
}

#secondary .widget ul:not([class*="wp-block"]) li {
  padding: var(--space-2) 0;
  border-bottom: 1px solid var(--gray-100);
}

#secondary .widget ul:not([class*="wp-block"]) li:last-child {
  border-bottom: none;
}

#secondary .widget ul:not([class*="wp-block"]) li a {
  color: var(--gray-900);
  text-decoration: none;
  font-size: 0.9375rem;
  transition: color var(--transition-fast);
}

#secondary .widget ul:not([class*="wp-block"]) li a:hover {
  color: var(--navy-700);
}

/* 最新記事ウィジェット（.wp-block-latest-posts）のアジャスト */
#secondary .widget .wp-block-latest-posts {
  padding-left: 0;
}
#secondary .widget .wp-block-latest-posts li {
  padding: var(--space-3) 0;
}

/* 行事カレンダーウィジェットのアジャスト */
#secondary .widget .tribe-events-calendar-list .tribe-event {
  gap: var(--space-3) !important;
  flex-wrap: nowrap;
  padding: var(--space-3) 0;
  margin: 0;
}

#secondary .widget .tribe-events-calendar-list .tribe-event__date-tag {
  min-width: 48px; /* サイドバー用に縮小 */
  padding: 4px 6px;
}

#secondary .widget .tribe-events-calendar-list .tribe-event__date-tag-daynum {
  font-size: 1.25rem;
}

#secondary .widget .tribe-events-calendar-list .tribe-event__title {
  font-size: 0.8125rem !important; /* 少し小さく */
  margin-bottom: 2px;
}

#secondary .widget .tribe-events-calendar-list .tribe-event__categories a {
  font-size: 0.6875rem;
  padding: 1px 6px;
}

/* ==========================================================================
   22. 下層ページ・課題解決用追加スタイル（Typography & 構造レイアウト）
   ========================================================================== */

/* ── 22.1 タイポグラフィの強制リセット ── */
/* Astraやブラウザの標準明朝体が露出しないように、強力にゴシック体を適用 */
body, p, span, a, div, li, td, th {
  font-family: var(--font-body);
}

h1, h2, h3, h4, h5, h6, 
.ast-archive-title, 
.page-title, 
.entry-title, 
.entry-title a,
.widget-title, 
#secondary .widget .widget__title.section-title,
#secondary .widget .widget-title,
.tribe-events .tribe-events-header__title {
  font-family: var(--font-heading) !important;
}

/* フォーム・ボタン等 */
button, input, select, textarea {
  font-family: inherit;
}

/* ── 22.2 レイアウトの異常な広がりの抑制 ── */
/* フル幅レイアウトになっている一部の下層ページ（アーカイブやカレンダー）を強制的に1080pxに収める */
body:not(.home) .site-content > .ast-container,
.tribe-events-view,
#tribe-events-pg-template {
  max-width: var(--container-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* モバイル対応：余白の追加 */
@media (max-width: 768px) {
  body:not(.home) .site-content > .ast-container,
  .tribe-events-view,
  #tribe-events-pg-template {
    padding-left: var(--space-4) !important;
    padding-right: var(--space-4) !important;
  }
}

/* ── 22.3 アーカイブ用「記事カード」のデザイン ── */
/* top3.png の最新記事カードと同じ印象に揃える */
.ast-article-post,
.ast-post-format-standard {
  background: var(--white);
  border-radius: var(--radius-md);   /* 8px（top3と統一） */
  box-shadow: none;
  margin-bottom: var(--space-6);
  overflow: hidden;
  border: var(--border-default);     /* 1px solid gray-300（より明確な境界線） */
  transition: box-shadow var(--transition-base), border-color var(--transition-base),
              transform var(--transition-base);
}

/* ホバー時の浮き上がり */
.ast-article-post:hover {
  box-shadow: var(--shadow-md);
  border-color: #9CA3AF;
  transform: translateY(-2px);
}

/* サムネイルとコンテンツの余白 */
.ast-article-post .ast-blog-featured-section {
  margin-bottom: 0;
}

/* カード内テキストエリアの余白（top3 と同じコンパクト余白）*/
.ast-article-post .ast-post-format-,
.ast-article-post .ast-post-format-standard,
.ast-article-post .entry-content-wrap,
.ast-article-post .ast-blog-post-inner {
  padding: var(--space-3) var(--space-4) var(--space-4) !important;
}
@media (max-width: 768px) {
  .ast-article-post .ast-post-format-,
  .ast-article-post .ast-post-format-standard,
  .ast-article-post .entry-content-wrap,
  .ast-article-post .ast-blog-post-inner {
    padding: var(--space-3) var(--space-4) !important;
  }
}

/* サムネイル: 16:9 でクロップ（top3 のカードと統一） */
.ast-article-post .ast-blog-featured-section img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center top;
  display: block;
}

/* アーカイブ一覧での記事タイトル
   top3.png と揃える: 0.875rem / font-weight 600 / 2行省略 */
.ast-article-post .entry-title {
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  margin-top: var(--space-2) !important;
  margin-bottom: var(--space-2) !important;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* アーカイブカードのタイトルリンク: 下線なし・navy色・hover で下線 */
.ast-article-post .entry-title a,
.ast-article-post .entry-title a:visited {
  color: var(--gray-900);
  text-decoration: none;
}

.ast-article-post .entry-title a:hover {
  color: var(--navy-700);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* 記事メタ情報（日付）: top3と同様の小さいサイズに */
.ast-article-post .entry-meta {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
  font-size: 0.75rem !important;   /* 12px / top3の日付と統一 */
  color: var(--gray-600);
}

/* 抜粋テキスト: top3 と同じサイズ・行数に（Astraの実際のクラスを網羅）*/
.ast-article-post .entry-content,
.ast-article-post .entry-summary,
.ast-article-post .entry-content p,
.ast-article-post .entry-summary p,
.ast-article-post .ast-post-format- p,
.ast-article-post .ast-post-format-standard p,
.archive .entry-summary,
.archive .entry-summary p,
.blog .entry-summary,
.blog .entry-summary p {
  font-size: 0.8125rem !important;  /* 13px / top3 と統一 */
  color: var(--gray-600) !important;
  line-height: 1.6 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  margin-bottom: 0 !important;
}

/* 投稿者情報を非表示 */
.ast-article-post .entry-meta .author,
.ast-article-post .entry-meta .posted-by,
.ast-article-post .entry-meta .ast-meta-divider {
  display: none;
}

/* カテゴリバッジ: navy配色に統一 */
.ast-article-post .entry-header .ast-terms-listing,
.ast-article-post .cat-links a,
.ast-article-post .entry-categories a,
.ast-article-post .post-category,
.ast-article-post .entry-header .ast-category a {
  display: inline-block;
  padding: 2px 10px;
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.6;
  background: var(--navy-100);
  color: var(--navy-700);
  text-decoration: none;
  transition: opacity var(--transition-fast);
}

.ast-article-post .cat-links a:hover,
.ast-article-post .entry-categories a:hover,
.ast-article-post .entry-header .ast-category a:hover {
  opacity: 0.8;
  text-decoration: none;
}

/* ── 22.4 サイドバーウィジェットのデザイン統一 ── */

/* サイドバー全体の縦余白 */
#secondary .widget-area,
#secondary .ast-widget-area {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

/* 各ウィジェットにカードスタイルを適用（Astraウィジェット対応） */
#secondary .widget,
#secondary .ast-widget {
  background: var(--white);
  border: var(--border-default);
  border-radius: var(--radius-md);
  padding: var(--space-5) var(--space-5);
  margin-bottom: 0;
  box-shadow: var(--shadow-sm);
}

/* ウィジェットタイトル: Astra 親テーマ含むあらゆる出力形式に対応したセレクタ群 */
/* クラス指定ルール */
#secondary .widget-title,
#secondary .widgettitle,
#secondary .widget__title,
#secondary .ast-widget-title,
.secondary .widget-title,
.widget-area .widget-title,
/* 要素直下の見出し（クラス不問）*/
#secondary .widget > h1,
#secondary .widget > h2,
#secondary .widget > h3,
#secondary .widget > h4,
#secondary aside > h1,
#secondary aside > h2,
#secondary aside > h3,
#secondary aside > h4,
.secondary .widget > h2,
.secondary .widget > h3 {
  font-family: var(--font-heading) !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  color: var(--gray-600) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  padding-left: 8px !important;
  margin-top: 0 !important;
  margin-bottom: var(--space-3) !important;
  border-left: 2px solid var(--gold-600) !important;
  border-bottom: none !important;
  line-height: 1.35 !important;
}

/* 検索ウィジェット: 横並びの自然なフォームレイアウト */
.widget_search form,
.widget_search .search-form {
  display: flex;
  align-items: stretch;
  gap: var(--space-2);
}

/* ラベル（inputを包む要素）は横に伸びる */
.widget_search label,
.widget_search .search-label {
  flex: 1;
  min-width: 0;
  margin: 0;
  display: flex;
  align-items: center;
  font-size: 0;        /* ラベル直下のテキストノード（「検索:」）を非表示 */
}

/* ラベル内のspanや.screen-reader-textも確実に非表示 */
.widget_search label > span,
.widget_search label > .screen-reader-text,
.widget_search .screen-reader-text {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  position: absolute !important;
}

/* 検索入力欄: 全幅・適切な高さ */
.widget_search input[type="search"],
.widget_search .search-field {
  width: 100% !important;
  border: 1px solid var(--gray-300) !important;
  border-radius: var(--radius-sm) !important;
  padding: 8px 12px !important;
  font-family: var(--font-body) !important;
  font-size: 0.875rem !important;
  color: var(--gray-900) !important;
  background: var(--white) !important;
  height: auto !important;
  box-sizing: border-box !important;
}

.widget_search input[type="search"]:focus,
.widget_search .search-field:focus {
  border-color: var(--navy-700) !important;
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(27, 58, 107, 0.15) !important;
}

/* 検索ボタン: 入力欄と同じ高さ・コンパクト */
.widget_search input[type="submit"],
.widget_search .search-submit,
.widget_search button[type="submit"] {
  flex-shrink: 0 !important;
  background-color: var(--navy-700) !important;
  color: var(--white) !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  padding: 8px 14px !important;
  font-family: var(--font-body) !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  height: auto !important;
  min-height: unset !important;  /* グローバルの min-height: 44px を解除 */
  line-height: 1.4 !important;
  transition: background-color var(--transition-fast) !important;
  white-space: nowrap !important;
}

.widget_search input[type="submit"]:hover,
.widget_search .search-submit:hover,
.widget_search button[type="submit"]:hover {
  background-color: var(--navy-500) !important;
}

/* WP標準リストウィジェット（Recent Postsなど）のリセット強化 */
#secondary .widget ul > li {
  padding: var(--space-2) 0 !important;
  border-bottom: 1px solid var(--gray-100) !important;
  margin-left: 0 !important;
}
#secondary .widget ul > li:last-child {
  border-bottom: none !important;
}

/* ── 22.5 The Events Calendar（行事予定ページ）スタイル統一 ── */

/* TEC ラッパー: body が白になったためカード風ラッパーを解除 */
.tribe-events {
  background: var(--white);
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  margin-top: 0 !important;
  margin-bottom: var(--space-10) !important;
}

/* 「今後のイベント」見出し: セクション見出しスタイルに統一 */
.tribe-events-header__title,
.tribe-events .tribe-events-header__title {
  font-family: var(--font-heading) !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: var(--gray-900) !important;
  padding-left: 14px !important;
  border-left: 4px solid var(--gold-600) !important;
  line-height: 1.35 !important;
}

/* 検索フォーム入力欄 */
.tribe-events-c-search__input {
  border: var(--border-default) !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px 14px !important;
  font-family: var(--font-body) !important;
  font-size: 1rem !important;
  color: var(--gray-900) !important;
}

/* プレースホルダー非表示（ボタンに「イベントを検索」と表記済みのため不要） */
.tribe-events-c-search__input::placeholder {
  color: transparent !important;
}

.tribe-events-c-search__input:focus {
  border-color: var(--navy-700) !important;
  box-shadow: 0 0 0 3px rgba(27, 58, 107, 0.15) !important;
  outline: none !important;
}

/* 検索ボタン（イベントを検索） */
.tribe-events-c-search__button {
  background-color: var(--navy-700) !important;
  color: var(--white) !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  padding: 8px 16px !important;
  min-height: 40px !important;
  cursor: pointer !important;
  transition: background-color var(--transition-fast) !important;
}

.tribe-events-c-search__button:hover {
  background-color: var(--navy-500) !important;
}

/* ビュー切り替えタブ（リスト表示 / カレンダー表示 / 日付）*/
.tribe-events-c-search__view-change,
.tribe-events-c-view-selector__button {
  font-family: var(--font-body) !important;
  font-size: 0.9375rem !important;
  font-weight: 500 !important;
  color: var(--gray-600) !important;
  border-bottom: 2px solid transparent !important;
  padding: var(--space-2) var(--space-3) !important;
  transition: color var(--transition-fast), border-color var(--transition-fast) !important;
}

.tribe-events-c-search__view-change:hover {
  color: var(--navy-700) !important;
  background: var(--navy-50) !important;
  text-decoration: none !important;
}

/* アクティブタブ: navy 下線（デフォルトの黒から変更） */
.tribe-events-c-search__view-change--active,
.tribe-events-c-search__view-change[aria-pressed="true"],
.tribe-events-c-view-selector__button--active {
  color: var(--navy-700) !important;
  border-bottom-color: var(--navy-700) !important;
  font-weight: 700 !important;
}

/* 「今日」ボタン: outline ボタンスタイル */
.tribe-events-c-top-bar__today-button {
  font-family: var(--font-body) !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  color: var(--navy-700) !important;
  background: transparent !important;
  border: 2px solid var(--navy-700) !important;
  border-radius: var(--radius-sm) !important;
  padding: 6px 14px !important;
  min-height: 40px !important;
  cursor: pointer !important;
  transition: background-color var(--transition-fast) !important;
}

.tribe-events-c-top-bar__today-button:hover {
  background: var(--navy-50) !important;
}

/* 「< 前」「次 >」ナビボタン */
.tribe-events-c-top-bar__nav-link {
  font-family: var(--font-body) !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  color: var(--navy-700) !important;
  text-decoration: none !important;
  background: transparent !important;
  border: none !important;
  padding: 6px 10px !important;
  border-radius: var(--radius-sm) !important;
  transition: background-color var(--transition-fast) !important;
}

.tribe-events-c-top-bar__nav-link:hover {
  background: var(--navy-50) !important;
  color: var(--navy-700) !important;
  text-decoration: none !important;
}

/* カレンダー内部のEventタイトルのフォント強制 */
.tribe-common-h3.tribe-events-calendar-list__event-title,
.tribe-events-calendar-list__event-title a {
  font-family: var(--font-heading) !important;
}

/* ==========================================================================
   23. 個別イベントページ（single-event）デザイン
   ========================================================================== */

/* ── 23.1 戻りリンク ──────────────────────────────────────────── */
.tribe-events-single .tribe-events-back {
  margin: 0 0 var(--space-6) !important;
  padding: 0 !important;
}

.tribe-events-single .tribe-events-back a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--navy-700);
  text-decoration: none;
  transition: opacity var(--transition-fast);
}

.tribe-events-single .tribe-events-back a:hover {
  opacity: 0.75;
}

.tribe-events-back-arrow {
  font-size: 1rem;
}

/* ── 23.2 カテゴリバッジ（タイトル上） ────────────────────────── */
.tribe-event-single__categories {
  list-style: none;
  margin: 0 0 var(--space-3) !important;
  padding: 0;
  display: flex;
  gap: var(--space-2);
  flex-wrap: wrap;
}

.tribe-event-single__categories li {
  margin: 0;
  padding: 0;
}

.tribe-event-single__categories li a {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.4;
  padding: 2px 10px;
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: opacity var(--transition-fast);
}

.tribe-event-single__categories li a:hover {
  opacity: 0.8;
}

/* カテゴリ配色 — デフォルト */
.tribe-event-single__categories li a {
  background: var(--tag-news-bg);
  color: var(--tag-news-text);
}

/* カテゴリ配色 — 特定カテゴリ上書き（トップページと統一） */
.tribe-event-single__categories li.cat-taikai a,
.tribe-event-single__categories li.cat-tournament a {
  background: var(--tag-tournament-bg);
  color: var(--tag-tournament-text);
}

.tribe-event-single__categories li.cat-koshukai a,
.tribe-event-single__categories li.cat-workshop a {
  background: var(--tag-workshop-bg);
  color: var(--tag-workshop-text);
}

.tribe-event-single__categories li.cat-kentei a,
.tribe-event-single__categories li.cat-exam a {
  background: var(--tag-exam-bg);
  color: var(--tag-exam-text);
}

/* ── 23.3 イベントタイトル — gold 左ボーダー ─────────────────── */
.tribe-events-single .tribe-events-single-event-title {
  font-family: var(--font-heading) !important;
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  color: var(--gray-900) !important;
  padding-left: 14px !important;
  border-left: 4px solid var(--gold-600) !important;
  line-height: 1.35 !important;
  margin: 0 0 var(--space-4) !important;
}

/* ── 23.4 日時バッジ ──────────────────────────────────────────── */
.tribe-events-single .tribe-events-schedule {
  margin: 0 0 var(--space-6) !important;
  padding: 0 !important;
}

.tribe-events-single .tribe-events-schedule > div {
  display: inline-block;
  background: var(--navy-50);
  color: var(--navy-700);
  font-size: 0.875rem;
  font-weight: 600;
  padding: 6px 16px;
  border-radius: var(--radius-md);
  border: 1px solid var(--navy-100);
  line-height: 1.5;
}

.tribe-events-single .tribe-events-cost {
  display: inline-block;
  background: var(--gold-50);
  color: var(--gold-600);
  font-size: 0.875rem;
  font-weight: 600;
  padding: 6px 16px;
  border-radius: var(--radius-md);
  border: 1px solid var(--gold-400);
  margin-left: var(--space-2);
  line-height: 1.5;
}

/* ── 23.5 イベント本文 ────────────────────────────────────────── */
.tribe-events-single .tribe-events-single-event-description {
  font-size: 1rem;
  line-height: 1.85;
  color: var(--gray-900);
  margin-bottom: var(--space-8) !important;
  padding: 0 !important;
}

/* カレンダーに追加ボタンのスタイル調整 */
.tribe-events-single .tribe-events-cal-links {
  margin-top: var(--space-4);
}

/* ── 23.6 メタ詳細セクション — gold 左ボーダーカード ──────────── */
.tribe-events-single .tribe-events-single-section.tribe-events-event-meta {
  background: var(--gray-50) !important;
  border: 1px solid var(--gray-300) !important;
  border-left: 4px solid var(--gold-600) !important;
  border-radius: 0 var(--radius-md) var(--radius-md) 0 !important;
  padding: var(--space-6) var(--space-8) !important;
  margin: 0 0 var(--space-8) !important;
  display: flex !important;
  flex-wrap: wrap;
  gap: var(--space-8);
}

/* メタグループ（詳細 / 主催者 / 会場） */
.tribe-events-single .tribe-events-meta-group {
  flex: 1 1 200px;
  min-width: 0;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
}

/* セクションタイトル（詳細 / 主催者 / 会場） */
.tribe-events-single .tribe-events-single-section-title {
  font-family: var(--font-heading) !important;
  font-size: 0.8125rem !important;
  font-weight: 700 !important;
  color: var(--navy-700) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  margin: 0 0 var(--space-3) !important;
  padding: 0 0 var(--space-2) !important;
  border-bottom: 1px solid var(--gray-300) !important;
}

/* メタリスト */
.tribe-events-single .tribe-events-meta-list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.tribe-events-single .tribe-events-meta-item {
  margin: 0 0 var(--space-2) !important;
  padding: 0 !important;
}

.tribe-events-single .tribe-events-meta-label {
  display: block;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  color: var(--gray-600) !important;
  margin-bottom: 2px !important;
}

.tribe-events-single .tribe-events-meta-value {
  display: block;
  font-size: 0.875rem !important;
  font-weight: 400 !important;
  color: var(--gray-900) !important;
}

.tribe-events-single .tribe-events-meta-value a {
  color: var(--navy-700);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ── 23.7 前後イベントナビゲーション ──────────────────────────── */
.tribe-events-single #tribe-events-header {
  display: none !important; /* ヘッダー側ナビは非表示（フッターのみ） */
}

.tribe-events-single #tribe-events-footer {
  margin-top: var(--space-8);
  padding-top: var(--space-6);
  border-top: 1px solid var(--gray-300);
}

.tribe-events-single .tribe-events-sub-nav {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  justify-content: space-between;
  gap: var(--space-4);
}

.tribe-events-single .tribe-events-nav-previous,
.tribe-events-single .tribe-events-nav-next {
  flex: 0 1 48%;
  margin: 0 !important;
  padding: 0 !important;
}

.tribe-events-single .tribe-events-nav-next {
  text-align: right;
}

.tribe-events-single .tribe-events-sub-nav a {
  display: inline-block;
  text-decoration: none;
  color: var(--navy-700);
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--gray-300);
  border-radius: var(--radius-md);
  transition: all var(--transition-fast);
  max-width: 100%;
}

.tribe-events-single .tribe-events-sub-nav a:hover {
  background: var(--navy-50);
  border-color: var(--navy-100);
}

.tribe-events-single .tribe-events-nav-label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--gray-600);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 2px;
}

.tribe-events-single .tribe-events-nav-title {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--navy-700);
  line-height: 1.4;
}

/* ── 23.8 余白の適正化 ────────────────────────────────────────── */
/* コンテンツ全体のトップ余白を縮小 */
.tribe-events-single {
  max-width: var(--container-max) !important;
  margin-inline: auto !important;
  padding: var(--space-6) var(--container-padding) var(--space-10) !important;
}

/* イベントページの不要な区切り線をリセット */
.tribe-events-single .tribe-events-event-meta.primary {
  border-top: none !important;
}

/* Astra 動的 CSS のパディングリセット */
.single-tribe_events .ast-article-single,
.single-tribe_events .entry-content {
  padding: 0 !important;
  margin: 0 !important;
}

/* アイキャッチ画像 */
.tribe-events-single .tribe-events-event-image {
  margin-bottom: var(--space-6) !important;
  border-radius: var(--radius-md);
  overflow: hidden;
}

.tribe-events-single .tribe-events-event-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* ── 23.9 レスポンシブ ────────────────────────────────────────── */
@media (max-width: 768px) {
  .tribe-events-single .tribe-events-single-event-title {
    font-size: 1.375rem !important;
  }

  .tribe-events-single .tribe-events-single-section.tribe-events-event-meta {
    flex-direction: column !important;
    gap: var(--space-6);
    padding: var(--space-4) var(--space-5) !important;
  }

  .tribe-events-single .tribe-events-sub-nav {
    flex-direction: column;
  }

  .tribe-events-single .tribe-events-nav-previous,
  .tribe-events-single .tribe-events-nav-next {
    flex: 1 1 auto;
    text-align: left;
  }
}

/* ==========================================================================
   24. 個別投稿ページ（お知らせ・記事）デザイン
   ========================================================================== */

/* ── 24.1 全体余白の適正化 ────────────────────────────────────── */
.single-post .ast-article-single {
  padding: 0 !important;
}

.single-post .entry-header {
  margin-bottom: var(--space-6) !important;
  padding: 0 !important;
}

/* ── 24.2 投稿タイトル — gold 左ボーダー ─────────────────────── */
.single-post .entry-title {
  font-family: var(--font-heading) !important;
  font-size: 1.375rem !important;
  font-weight: 700 !important;
  color: var(--gray-900) !important;
  padding-left: 14px !important;
  border-left: 4px solid var(--gold-600) !important;
  line-height: 1.35 !important;
  margin: 0 0 var(--space-3) !important;
}

/* ── 24.3 メタ情報（日付・著者・カテゴリ） ───────────────────── */
.single-post .entry-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  font-size: 0.8125rem !important;
  color: var(--gray-600) !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 日付をバッジ化 */
.single-post .entry-meta .posted-on,
.single-post .entry-meta time.entry-date {
  font-weight: 600;
}

.single-post .entry-meta .posted-on {
  background: var(--navy-50);
  color: var(--navy-700);
  padding: 2px 10px;
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  font-weight: 600;
  border: 1px solid var(--navy-100);
}

/* 著者リンク */
.single-post .entry-meta .posted-by,
.single-post .entry-meta .byline {
  font-size: 0.8125rem;
  color: var(--gray-600);
}

.single-post .entry-meta .posted-by a,
.single-post .entry-meta .byline a {
  color: var(--navy-700);
  text-decoration: none;
  font-weight: 500;
}

.single-post .entry-meta .posted-by a:hover,
.single-post .entry-meta .byline a:hover {
  text-decoration: underline;
}

/* カテゴリリンク */
.single-post .entry-meta .cat-links a {
  display: inline-block;
  background: var(--tag-news-bg);
  color: var(--tag-news-text);
  padding: 2px 10px;
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  font-weight: 600;
  text-decoration: none;
  transition: opacity var(--transition-fast);
}

.single-post .entry-meta .cat-links a:hover {
  opacity: 0.8;
}

/* メタ内の区切り「/」をやさしく */
.single-post .entry-meta > span::before {
  color: var(--gray-300);
}

/* ── 24.4 アイキャッチ画像 ────────────────────────────────────── */
.single-post .post-thumb-img-content {
  margin: var(--space-6) 0 !important;
  border-radius: var(--radius-md);
  overflow: hidden;
  max-height: 400px;
}

.single-post .post-thumb-img-content img {
  width: 100%;
  height: 100%;
  max-height: 400px;
  object-fit: cover;
  display: block;
}

/* ── 24.5 本文エリア ──────────────────────────────────────────── */
.single-post .entry-content {
  font-size: 1rem;
  line-height: 1.85;
  color: var(--gray-900);
  padding: 0 !important;
  margin-bottom: var(--space-8) !important;
}

.single-post .entry-content p {
  margin-bottom: 1.5em;
}

.single-post .entry-content a {
  color: var(--navy-700);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.single-post .entry-content a:hover {
  color: var(--navy-500);
}

/* ── 24.6 前後ナビゲーション — カード型 ──────────────────────── */
.single-post .post-navigation {
  margin-top: var(--space-8) !important;
  padding-top: var(--space-6) !important;
  border-top: 1px solid var(--gray-300) !important;
}

.single-post .post-navigation .nav-links {
  display: flex !important;
  justify-content: space-between !important;
  gap: var(--space-4) !important;
}

.single-post .post-navigation .nav-previous,
.single-post .post-navigation .nav-next {
  flex: 0 1 48%;
}

.single-post .post-navigation .nav-next {
  text-align: right;
}

.single-post .post-navigation a {
  display: inline-block;
  text-decoration: none !important;
  color: var(--navy-700);
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--gray-300);
  border-radius: var(--radius-md);
  transition: all var(--transition-fast);
  max-width: 100%;
}

.single-post .post-navigation a:hover {
  background: var(--navy-50);
  border-color: var(--navy-100);
}

/* ナビラベル（「前の記事」「次の記事」） */
.single-post .post-navigation .ast-post-nav-label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--gray-600);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 2px;
}

/* Astra デフォルトの .ast-post-nav（矢印アイコン付き）を上書き */
.single-post .post-navigation .ast-post-nav {
  display: block;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--gray-600);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 2px;
}

.single-post .post-navigation .ast-post-nav svg {
  display: none; /* 矢印 SVG を非表示 */
}

/* タイトル部分 */
.single-post .post-navigation a p {
  margin: 0 !important;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--navy-700);
  line-height: 1.4;
}

/* ── 24.7 コメントセクション非表示（CSS フォールバック） ──────── */
.single-post #comments,
.single-post .comments-area {
  display: none !important;
}

/* ── 24.8 レスポンシブ ────────────────────────────────────────── */
@media (max-width: 768px) {
  .single-post .entry-title {
    font-size: 1.25rem !important;
  }

  .single-post .post-navigation .nav-links {
    flex-direction: column !important;
  }

  .single-post .post-navigation .nav-previous,
  .single-post .post-navigation .nav-next {
    flex: 1 1 auto;
    text-align: left;
  }
}

/* ==========================================================================
   25. 教室一覧テーブル（固定ページ用）
   ========================================================================== */

.classroom-list {
  max-width: var(--container-max);
  margin-inline: auto;
}

.classroom-list__year {
  display: inline-block;
  background: var(--navy-50);
  color: var(--navy-700);
  font-size: 0.8125rem;
  font-weight: 600;
  padding: 4px 14px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--navy-100);
  margin-bottom: var(--space-5) !important;
}

.classroom-list__table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-bottom: var(--space-6);
}

.classroom-list__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
  line-height: 1.6;
  min-width: 800px;
}

.classroom-list__table thead th {
  background: var(--navy-900);
  color: var(--white);
  font-weight: 600;
  font-size: 0.8125rem;
  padding: 10px 12px;
  text-align: left;
  white-space: nowrap;
  border-right: 1px solid rgba(255,255,255,0.15);
}

.classroom-list__table thead th:last-child {
  border-right: none;
}

.classroom-list__table tbody td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--gray-300);
  vertical-align: top;
  color: var(--gray-900);
}

.classroom-list__table tbody tr:nth-child(even) td {
  background: var(--gray-50);
}

.classroom-list__table tbody tr:hover td {
  background: var(--navy-50);
}

/* 団体名セル */
.classroom-list__table tbody td:first-child {
  white-space: nowrap;
}

.classroom-list__table tbody td:first-child strong {
  font-size: 0.9375rem;
  color: var(--navy-700);
}

/* 電話番号 */
.classroom-list__tel {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--gray-600);
  letter-spacing: 0.02em;
}

/* 小さい補足テキスト */
.classroom-list__table small {
  font-size: 0.75rem;
  color: var(--gray-600);
}

/* セル内区切り線（午前/午後の区切り等） */
.classroom-list__sep {
  border: none;
  border-top: 1px dashed var(--gray-300);
  margin: 4px 0;
}

/* 休会中の行 */
.classroom-list__休会中 td {
  color: var(--gray-600);
}

.classroom-list__notice {
  text-align: center;
  font-style: italic;
  color: var(--gray-600);
}

/* 注釈 */
.classroom-list__note {
  font-size: 0.8125rem;
  color: var(--gray-600);
  margin-top: var(--space-4);
}

/* レスポンシブ: テーブルの横スクロールヒント */
@media (max-width: 768px) {
  .classroom-list__table-wrap {
    position: relative;
  }

  .classroom-list__table-wrap::after {
    content: '← スクロールできます →';
    display: block;
    text-align: center;
    font-size: 0.6875rem;
    color: var(--gray-600);
    padding: var(--space-2) 0;
  }
}

/* ==========================================================================
   26. お問い合わせフォーム（Contact Form 7）
   ========================================================================== */

/* ── 26.1 フォーム全体 ──────────────────────────────────────── */
.wpcf7 {
  max-width: var(--container-narrow);
  margin-inline: auto;
}

/* ── 26.2 フィールドグループ ────────────────────────────────── */
.cf7-field {
  margin-bottom: var(--space-5);
}

.cf7-field label {
  display: block;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--gray-900);
  margin-bottom: 6px;
}

.cf7-required {
  color: #DC2626;
  font-weight: 700;
  margin-left: 2px;
}

/* ── 26.3 入力フィールド ────────────────────────────────────── */
.cf7-field input[type="text"],
.cf7-field input[type="email"],
.cf7-field input[type="tel"],
.cf7-field textarea {
  width: 100%;
  border: 1px solid var(--gray-300);
  border-radius: var(--radius-md);
  padding: 10px 14px;
  font-size: 1rem;
  font-family: inherit;
  color: var(--gray-900);
  background: var(--white);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.cf7-field input[type="text"]:focus,
.cf7-field input[type="email"]:focus,
.cf7-field input[type="tel"]:focus,
.cf7-field textarea:focus {
  outline: none;
  border-color: var(--navy-700);
  box-shadow: 0 0 0 3px rgba(27, 58, 107, 0.15);
}

.cf7-field textarea {
  resize: vertical;
  min-height: 180px;
}

/* プレースホルダー */
.cf7-field input::placeholder,
.cf7-field textarea::placeholder {
  color: var(--gray-300);
  font-size: 0.875rem;
}

/* ── 26.4 送信ボタン ────────────────────────────────────────── */
.cf7-submit {
  margin-top: var(--space-6);
  text-align: center;
}

.cf7-submit .wpcf7-submit,
.cf7-submit input[type="submit"] {
  display: inline-block;
  background: var(--navy-700);
  color: var(--white);
  font-size: 1rem;
  font-weight: 600;
  padding: 12px 48px;
  border: none;
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: background var(--transition-fast);
  letter-spacing: 0.04em;
}

.cf7-submit .wpcf7-submit:hover,
.cf7-submit input[type="submit"]:hover {
  background: var(--navy-500);
}

.cf7-submit .wpcf7-submit:active,
.cf7-submit input[type="submit"]:active {
  transform: scale(0.98);
}

/* 送信中スピナー */
.wpcf7 .wpcf7-spinner {
  margin-left: 8px;
}

/* ── 26.5 バリデーション・メッセージ ────────────────────────── */
.wpcf7-not-valid-tip {
  display: block;
  font-size: 0.8125rem;
  color: #DC2626;
  margin-top: 4px;
}

.wpcf7-not-valid {
  border-color: #DC2626 !important;
}

/* 送信結果メッセージ */
.wpcf7 form .wpcf7-response-output {
  margin: var(--space-5) 0 0;
  padding: 12px 16px;
  border-radius: var(--radius-md);
  font-size: 0.875rem;
  text-align: center;
}

.wpcf7 form.sent .wpcf7-response-output {
  border-color: #059669;
  background: #ECFDF5;
  color: #065F46;
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
  border-color: #DC2626;
  background: #FEF2F2;
  color: #991B1B;
}

.wpcf7 form.invalid .wpcf7-response-output {
  border-color: #D97706;
  background: #FFFBEB;
  color: #92400E;
}

/* ── 26.6 レスポンシブ ──────────────────────────────────────── */
@media (max-width: 768px) {
  .cf7-submit .wpcf7-submit,
  .cf7-submit input[type="submit"] {
    width: 100%;
    padding: 14px 24px;
  }
}