/*
Theme Name: 小さなお宿のWEB担当者
Description: yado-webtan.com 公式テーマ。TOP(LP)の紺＋橙デザインを記事ページへ展開する。土台のデザイン変数・共通部品はサイト直下の /style.css（LPと共有）を読み込み、このファイルは記事まわりの追加スタイルのみ持つ。
Version: 1.0.0
Author: NOW OR NEVER合同会社
*/

/* ─────────────────────────────────── */
/* 記事・一覧 共通レイアウト             */
/* ─────────────────────────────────── */
.post-main {
  padding: 64px 0 100px;
}
@media (max-width: 720px) {
  .post-main { padding: 40px 0 64px; }
}

/* ─────────────────────────────────── */
/* 記事ページ                           */
/* ─────────────────────────────────── */
.post-meta {
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: var(--c-mute);
  margin: 0 0 12px;
}
.post-meta a { color: var(--c-accent); }

.post-title {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.02em;
  color: var(--c-primary);
  margin: 0 0 28px;
}
@media (max-width: 720px) {
  .post-title { font-size: 24px; }
}

.post-thumb { margin: 0 0 36px; }
.post-thumb img {
  width: 100%;
  height: auto;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

/* 本文タイポグラフィ */
.post-body {
  line-height: 1.95;
}
.post-body > * { margin: 0 0 1.6em; }
.post-body h2 {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.6;
  color: var(--c-primary);
  border-left: 4px solid var(--c-accent);
  padding-left: 14px;
  margin: 2.4em 0 1em;
}
.post-body h3 {
  font-size: 19px;
  font-weight: 700;
  color: var(--c-primary);
  margin: 2em 0 0.8em;
}
.post-body a {
  color: var(--c-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.post-body strong { color: var(--c-primary); }
.post-body img {
  max-width: 100%;
  height: auto;
  border-radius: var(--radius-sm);
}
.post-body ul, .post-body ol { padding-left: 1.4em; }
.post-body li { margin-bottom: 0.4em; }
.post-body blockquote {
  margin: 0 0 1.6em;
  padding: 18px 22px;
  background: var(--c-bg-alt);
  border-left: 4px solid var(--c-line);
  border-radius: var(--radius-sm);
  color: var(--c-text-soft);
}
.post-body table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
}
.post-body th, .post-body td {
  border: 1px solid var(--c-line);
  padding: 10px 14px;
  text-align: left;
}
.post-body th { background: var(--c-primary-soft); color: var(--c-primary); }

/* 記事下CTA（LPのCTA帯と同じ紺） */
.post-cta {
  margin-top: 72px;
  padding: 44px 32px;
  background: var(--c-bg-cta);
  border-radius: var(--radius);
  text-align: center;
  color: #fff;
}
.post-cta__title {
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 10px;
  color: #fff;
}
.post-cta__lead {
  font-size: 15px;
  margin: 0 0 24px;
  color: rgba(255, 255, 255, 0.85);
}
.post-cta .btn { margin: 0 6px 10px; }

.post-back {
  margin-top: 40px;
  text-align: center;
}

/* ─────────────────────────────────── */
/* 記事一覧                             */
/* ─────────────────────────────────── */
.archive-title {
  font-size: 28px;
  font-weight: 700;
  color: var(--c-primary);
  text-align: center;
  margin: 0 0 12px;
}
.archive-lead {
  text-align: center;
  color: var(--c-text-soft);
  margin: 0 0 48px;
}

.post-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.post-list__item {
  border-bottom: 1px solid var(--c-line);
  padding: 28px 0;
}
.post-list__item:first-child { border-top: 1px solid var(--c-line); }
.post-list__date {
  font-family: var(--font-en);
  font-size: 13px;
  letter-spacing: 0.08em;
  color: var(--c-mute);
  margin: 0 0 6px;
}
.post-list__title {
  font-size: 19px;
  font-weight: 700;
  line-height: 1.6;
  margin: 0 0 8px;
}
.post-list__title a { color: var(--c-primary); }
.post-list__title a:hover { color: var(--c-accent); }
.post-list__excerpt {
  font-size: 15px;
  color: var(--c-text-soft);
  margin: 0;
}

/* ページ送り */
.pagination { margin-top: 48px; text-align: center; }
.pagination .nav-links {
  display: flex;
  justify-content: center;
  gap: 8px;
}
.pagination .page-numbers {
  display: inline-block;
  min-width: 38px;
  padding: 8px 10px;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-sm);
  font-family: var(--font-en);
  font-size: 14px;
  color: var(--c-text-soft);
}
.pagination .page-numbers.current {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: #fff;
}
.pagination a.page-numbers:hover { border-color: var(--c-accent); color: var(--c-accent); }

/* ─────────────────────────────────── */
/* 404                                  */
/* ─────────────────────────────────── */
.notfound {
  text-align: center;
  padding: 40px 0;
}
.notfound__code {
  font-family: var(--font-en);
  font-size: 64px;
  font-weight: 900;
  color: var(--c-primary-soft);
  margin: 0;
  line-height: 1;
}