/* 聖地巡礼・ロケ誘致レポート ブログ固有スタイル（旅の絵はがき・ハンコ・土茶） */
/* ヘッダー/フッター/ナビ/ヒーロー帯/表・免責の基本CSSは ../styles.css を利用（ここには書かない） */

/* ---------- 一覧ページ ---------- */
.index-stack {
  padding-top: 56px;
  padding-bottom: 88px;
}

.index-stack > section:first-child { margin-bottom: 52px; }

.index-stack > section > h2 {
  font-size: 1.6rem;
  margin: 0 0 6px;
  padding-left: 16px;
  border-left: 5px solid var(--accent);
}
.index-stack > section > h2::after {
  content: "";
  display: block;
  height: 3px;
  width: 44px;
  background: var(--accent-2);
  margin-top: 10px;
}

.index-stack .section-lead {
  color: var(--muted);
  font-size: .92rem;
  margin: 0;
}

/* ---------- 記事一覧カード: POST番号付きのはがき風カード ---------- */
.blog-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.blog-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 2px solid var(--accent);
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.blog-card img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; display: block; }
.blog-card .card-body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.blog-card time { font-family: var(--font-mono); font-size: 0.76rem; color: var(--accent-ink); }
.blog-card h2, .blog-card h3 { margin: 0; font-size: 1.06rem; }
.blog-card p { margin: 0; font-size: 0.88rem; color: var(--muted); }
.blog-cards .card-thumb { position: relative; overflow: hidden; }
.blog-cards .card-thumb::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 4px;
  background: var(--card-rule);
  opacity: .55;
}
.blog-cards .card-num {
  display: block;
  font-family: var(--font-mono);
  font-size: .68rem;
  letter-spacing: .2em;
  color: var(--accent-ink);
}
.blog-cards .blog-card > a { display: block; color: inherit; text-decoration: none; height: 100%; }
.blog-cards .blog-card > a:hover h3 { color: var(--accent-ink); text-decoration: underline; }
.blog-cards .blog-card > a:hover { border-color: var(--accent); }

/* ---------- 記事ページ ---------- */
.article > h1 {
  font-size: clamp(1.55rem, 2.9vw, 2.15rem);
  line-height: 1.6;
  letter-spacing: .04em;
  margin: 0 0 24px;
}

.article > .source-note { margin: 0 0 26px; }

.article-content { font-size: 0.97rem; }
.article-content section { margin: 0 0 34px; }
.article-content h2 { font-size: 1.4rem; padding-left: 12px; border-left: 5px solid var(--accent); scroll-margin-top: calc(66px + 20px); }
.article-content h3 { font-size: 1.08rem; }
.article-content p { margin: 0 0 1.4em; }
.article-content ul, .article-content ol { padding-left: 22px; }

.post-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 0.84rem; color: var(--muted); margin-bottom: 12px; }
.post-meta span { border: 1px solid var(--line); border-radius: 3px; padding: 1px 10px; background: var(--surface); }

.article-eyecatch { border: 1px solid var(--line); border-radius: 4px; overflow: hidden; margin: 18px 0; background: var(--postcard-ink); }
.article-eyecatch img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }

/* ---------- シェアボックス ---------- */
.article > .share-box {
  margin: 44px 0 34px;
  padding: 20px 22px;
  border: 1px solid var(--line);
  border-top: 3px solid var(--accent);
  background: var(--surface);
}
.article > .share-box h2 { font-size: 1.05rem; margin: 0 0 10px; }
.share-links { display: flex; flex-wrap: wrap; gap: 12px; }
.share-links a { border: 1px solid var(--accent-2); border-radius: 4px; padding: 6px 16px; font-size: 0.86rem; }
.share-links a:hover { background: var(--accent-2); color: #fff; }

/* ---------- 目次・サイドバー ---------- */
.content-layout .sidebar { position: static; }

/* ---------- モバイル ---------- */
@media (max-width: 1023px) {
  .blog-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 800px) {
  .index-stack { padding-top: 40px; padding-bottom: 64px; }
}
@media (max-width: 600px) {
  .blog-cards { grid-template-columns: 1fr; }
}

/* デプロイQAゲート必須: article-content の左右パディング（短縮形不可） */
@media (max-width:768px){ .article-content { padding-left:16px; padding-right:16px; } }

/* HEADING-WRAP:START 見出し最終行孤立文字対策 */
h1,h2,h3,h4,.hero-title,.page-title,.card-title{ text-wrap:balance; word-break:auto-phrase; line-break:strict; overflow-wrap:break-word; }
/* HEADING-WRAP:END */

/* ADSENSE-ANNO:BEGIN */
/* Neutralize Google AdSense auto-annotation links that break text flow */
.article-body a.google-anno,
.article-body a[data-google-vignette],
.main a.google-anno,
.content a.google-anno,
a.google-anno,
a[data-google-vignette] {
  color: inherit !important;
  text-decoration: none !important;
  border-bottom: 0 !important;
  pointer-events: none;
  cursor: text;
}
/* ADSENSE-ANNO:END */