/* =========================================================
   WordPress 由来のコンテンツ用スタイル
   （エディタ本文・記事一覧・ページネーション）

   静的サイトには存在しなかった要素のみをここで定義する。
   既存トークン（--ink / --hair / --accent 等）を必ず使い、
   個別の hex を書かないこと。css/style.css は編集しない。
   ========================================================= */

/* ---------- エディタ本文 ---------- */
.wp-content {
  max-width: 860px;
  margin-inline: auto;
  font-size: 0.95rem;
  line-height: 2.1;
  letter-spacing: 0.04em;
  color: var(--ink-soft);
}
.wp-content > * + * { margin-top: 1.6em; }

.wp-content h2,
.wp-content h3,
.wp-content h4 {
  color: var(--ink-strong);
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.6;
}
.wp-content h2 {
  font-size: clamp(1.25rem, 2.2vw, 1.6rem);
  margin-top: 2.4em;
  padding-bottom: 0.6em;
  border-bottom: 1px solid var(--hair);
}
.wp-content h3 { font-size: clamp(1.1rem, 1.8vw, 1.3rem); margin-top: 2em; }
.wp-content h4 { font-size: 1rem; margin-top: 1.8em; }

.wp-content a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 0.2em;
  transition: opacity 0.3s var(--ease);
}
.wp-content a:hover { opacity: 0.7; }

.wp-content strong { color: var(--ink-strong); font-weight: 700; }

.wp-content ul,
.wp-content ol { padding-left: 1.4em; }
.wp-content ul { list-style: disc; }
.wp-content ol { list-style: decimal; }
.wp-content li + li { margin-top: 0.5em; }
.wp-content li::marker { color: var(--accent); }

.wp-content blockquote {
  padding: 1.2em 1.6em;
  border-left: 2px solid var(--accent);
  background: var(--panel);
}

.wp-content img,
.wp-content iframe { max-width: 100%; height: auto; }

.wp-content table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}
.wp-content th,
.wp-content td {
  padding: 0.9em 1em;
  border: 1px solid var(--hair);
  text-align: left;
  vertical-align: top;
}
.wp-content th { color: var(--ink-strong); font-weight: 700; background: var(--panel); }

.wp-content hr { border: 0; border-top: 1px solid var(--hair); margin: 2.4em 0; }

.wp-content__pagination { display: flex; gap: 12px; margin-top: 2.4em; }

/* ---------- 記事一覧 ---------- */
.post-list { list-style: none; max-width: 860px; margin-inline: auto; }
.post-list__item { border-bottom: 1px solid var(--hair); }
.post-list__item:first-child { border-top: 1px solid var(--hair); }

.post-list__link {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 28px;
  padding: 26px 4px;
  transition: opacity 0.3s var(--ease);
}
.post-list__link:hover { opacity: 0.6; }

.post-list__date {
  flex: 0 0 auto;
  font-family: var(--font-en);
  font-size: 0.82rem;
  letter-spacing: 0.1em;
  color: var(--ink-mute);
}
.post-list__title {
  flex: 1 1 260px;
  color: var(--ink-strong);
  font-size: 0.98rem;
  line-height: 1.8;
}

.post-single__date {
  max-width: 860px;
  margin: 0 auto clamp(20px, 3vw, 32px);
  font-family: var(--font-en);
  font-size: 0.82rem;
  letter-spacing: 0.1em;
  color: var(--ink-mute);
}

/* ---------- ページネーション ---------- */
.pagination {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: clamp(40px, 5vw, 64px);
}
.pagination .page-numbers {
  display: grid;
  place-items: center;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  border: 1px solid var(--hair);
  font-family: var(--font-en);
  font-size: 0.85rem;
  letter-spacing: 0.06em;
  color: var(--ink-strong);
  transition: background 0.3s var(--ease), color 0.3s var(--ease);
}
a.page-numbers:hover { background: var(--dark-band); color: #fff; }
.pagination .page-numbers.current { background: var(--dark-band); color: #fff; border-color: var(--dark-band); }
.pagination .page-numbers.dots { border-color: transparent; }

/* ---------- ダークセクション内での反転 ---------- */
.section--dark .wp-content th { background: rgba(255, 255, 255, 0.06); }

/* ---------- プラグインフォーム（Contact Form 7 等）の受け皿 ---------- */
.form--plugin .wpcf7-form-control-wrap { display: block; }
.form--plugin .wpcf7-not-valid-tip { color: var(--accent); font-size: 0.8rem; }
