/*
Theme Name: Twenty Twenty-Five Child
Template: twentytwentyfive
Description: 交通事故・むちうち専門ブログ用カスタムテーマ
Version: 1.0
*/

/* === 全体 === */
body {
  font-family: "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  color: #333;
  background-color: #f8f9fa;
  line-height: 1.8;
}

/* === ヘッダー === */
.site-header {
  background: linear-gradient(135deg, #1a5276 0%, #2980b9 100%);
  padding: 1.5rem 2rem;
  color: #fff;
}
.site-header a {
  color: #fff;
  text-decoration: none;
}
.site-header .site-title {
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0;
}
.site-header .site-description {
  font-size: 0.85rem;
  opacity: 0.85;
  margin-top: 0.25rem;
}
.site-header nav a {
  margin-right: 1rem;
  font-size: 0.9rem;
  opacity: 0.9;
}
.site-header nav a:hover {
  opacity: 1;
  text-decoration: underline;
}

/* === 2カラムレイアウト === */
.site-content {
  display: flex;
  gap: 2rem;
  max-width: 1100px;
  margin: 2rem auto;
  padding: 0 1rem;
}
.main-content {
  flex: 1;
  min-width: 0;
}
.blog-home-intro {
  background: #fff;
  border-left: 4px solid #36a534;
  border-radius: 8px;
  padding: 1rem 1.1rem;
  margin-bottom: 1rem;
}
.blog-home-intro h1 {
  margin: 0 0 0.3rem;
  font-size: 1.35rem;
  color: #1a3c34;
  line-height: 1.45;
}
.blog-home-intro p {
  margin: 0;
  color: #555;
  font-size: 0.92rem;
  line-height: 1.7;
}
.sidebar {
  width: 280px;
  flex-shrink: 0;
}

/* === モバイルレスポンシブ === */
@media (max-width: 768px) {
  .site-content {
    flex-direction: column;
  }
  .sidebar {
    width: 100%;
  }
  .site-header {
    padding: 1rem;
  }
  .blog-home-intro h1 {
    font-size: 1.15rem;
  }
  .blog-home-intro p {
    font-size: 0.86rem;
  }
}

/* === 記事カード === */
.post-card {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
  margin-bottom: 1.5rem;
  overflow: hidden;
  transition: box-shadow 0.2s;
}
.post-card:hover {
  box-shadow: 0 3px 10px rgba(0,0,0,0.12);
}
.post-card img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}
.post-card-body {
  padding: 1.25rem;
}
.post-card-body h2 {
  font-size: 1.15rem;
  margin: 0 0 0.5rem;
  line-height: 1.5;
}
.post-card-body h2 a {
  color: #1a5276;
  text-decoration: none;
}
.post-card-body h2 a:hover {
  color: #2980b9;
}
.post-card-body .excerpt {
  font-size: 0.9rem;
  color: #555;
  margin-bottom: 0.5rem;
}
.post-card-body .post-meta {
  font-size: 0.8rem;
  color: #888;
}

/* === サイドバー === */
.sidebar-widget {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
  padding: 1.25rem;
  margin-bottom: 1.5rem;
}
.sidebar-widget h3 {
  font-size: 1rem;
  color: #1a5276;
  border-bottom: 2px solid #2980b9;
  padding-bottom: 0.5rem;
  margin: 0 0 1rem;
}
.sidebar-widget ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.sidebar-widget li {
  padding: 0.4rem 0;
  border-bottom: 1px solid #eee;
}
.sidebar-widget li:last-child {
  border-bottom: none;
}
.sidebar-widget a {
  color: #333;
  text-decoration: none;
  font-size: 0.9rem;
}
.sidebar-widget a:hover {
  color: #2980b9;
}

/* === フッター === */
.site-footer {
  background: #1a5276;
  color: #fff;
  padding: 2rem;
  text-align: center;
  font-size: 0.85rem;
  line-height: 1.8;
}
.site-footer a {
  color: #85c1e9;
}

/* === 不要要素の非表示 === */
.wp-block-loginout,
.wp-block-site-title + .wp-block-navigation .wp-block-page-list,
.meta-nav,
.powered-by-wordpress {
  display: none;
}

/* === 個別記事 === */
.single-post .entry-content {
  background: #fff;
  border-radius: 8px;
  padding: 2rem;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.single-post .entry-title {
  color: #1a5276;
  font-size: 1.5rem;
  line-height: 1.5;
}

/* === 記事下CTA === */
.post-cta {
  background: linear-gradient(135deg, #fff5eb 0%, #ffecd2 100%);
  border: 2px solid #e67e22;
  border-radius: 12px;
  padding: 2rem;
  margin-top: 2rem;
  text-align: center;
}
.cta-button-phone {
  display: inline-block;
  background: #e67e22;
  color: #fff !important;
  text-decoration: none;
  padding: 0.75rem 2rem;
  border-radius: 8px;
  font-size: 1.1rem;
  font-weight: 700;
  transition: background 0.2s;
}
.cta-button-phone:hover {
  background: #d35400;
}
.cta-button-lp {
  display: inline-block;
  background: #1a5276;
  color: #fff !important;
  text-decoration: none;
  padding: 0.75rem 2rem;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 600;
  transition: background 0.2s;
}
.cta-button-lp:hover {
  background: #2980b9;
}

/* === モバイル固定CTAバー === */
.mobile-sticky-cta {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: #1a5276;
  padding: 0.5rem;
  z-index: 9999;
  box-shadow: 0 -2px 10px rgba(0,0,0,0.2);
}
.mobile-sticky-cta .cta-inner {
  display: flex;
  gap: 0.5rem;
  max-width: 500px;
  margin: 0 auto;
}
.mobile-sticky-cta a {
  flex: 1;
  text-align: center;
  padding: 0.6rem;
  border-radius: 6px;
  text-decoration: none;
  font-weight: 700;
  font-size: 0.9rem;
}
.mobile-sticky-cta .cta-phone {
  background: #e67e22;
  color: #fff;
}
.mobile-sticky-cta .cta-web {
  background: #fff;
  color: #1a5276;
}

@media (max-width: 768px) {
  .mobile-sticky-cta {
    display: block;
  }
  body {
    padding-bottom: 60px;
  }
}

/* ============================================
   LP準拠 見出し・配色 (cmd_188)
   ============================================ */

/* --- h2: 茶系太字 --- */
.entry-content h2,
.wp-block-post-content h2 {
  font-size: 1.6em !important;
  color: #4c2f00 !important;
  line-height: 1.5;
  font-weight: bold !important;
  margin: 2em 0 1em;
  padding: 0;
  background: none !important;
}
@media (min-width: 769px) {
  .entry-content h2,
  .wp-block-post-content h2 {
    font-size: 2.2em !important;
  }
}

/* --- h3: 落ち着いたカード見出し --- */
.entry-content h3,
.wp-block-post-content h3 {
  text-align: left !important;
  padding: 0.85em 1em !important;
  color: #1f4f1f !important;
  font-size: 1.35em !important;
  background: #f3faf3 !important;
  border: 1px solid #d6ead6 !important;
  border-left: 6px solid #36a534 !important;
  margin: 2em 0 1em;
  border-radius: 8px;
  text-shadow: none !important;
}
@media (min-width: 769px) {
  .entry-content h3,
  .wp-block-post-content h3 {
    font-size: 1.55em !important;
  }
}

/* --- h4: 茶系+左ボーダー --- */
.entry-content h4,
.wp-block-post-content h4 {
  font-size: 1.2em !important;
  color: #4d2f00 !important;
  margin: 1.5em 0 1em;
  border-left: 7px solid #d7ba8c !important;
  padding: 6px 0 4px 10px !important;
  line-height: 1.7;
  background: none !important;
}

/* --- 記事本文 行間 --- */
.entry-content,
.wp-block-post-content {
  line-height: 1.8;
  color: #333;
}
.entry-content p,
.wp-block-post-content p {
  line-height: 1.8;
  margin-bottom: 1.5em;
}

/* --- CTAボタン LP準拠グラデーション --- */
.cta-button-phone {
  background: linear-gradient(180deg, #e67e22 0%, #d35400 100%) !important;
  border-radius: 10px !important;
}

/* --- リンク色 --- */
.entry-content a,
.wp-block-post-content a {
  color: #1a5276;
  text-decoration: underline;
}
.entry-content a:hover,
.wp-block-post-content a:hover {
  color: #dd0000 !important;
}

/* --- h1（記事タイトル）--- */
.entry-title,
.wp-block-post-title {
  color: #1a5276 !important;
  font-weight: bold;
  line-height: 1.4;
}

/* ============================================
   cmd_189: ヘッダー緑系統一 + モバイル余白修正
   ============================================ */

/* --- アクセントカラー: 濃紺→緑系に統一 --- */
.site-header {
  background: #fff !important;
  border-bottom: 4px solid #36a534 !important;
}
.site-footer {
  background: #1a3c34 !important;
  border-top: 4px solid #36a534 !important;
}

/* --- サイドバー見出し: 緑系 --- */
.sidebar .sidebar-widget h3 {
  color: #2d8a2c !important;
  border-bottom-color: #36a534 !important;
}

/* --- 記事タイトル: 緑系 --- */
.entry-title,
.wp-block-post-title {
  color: #1a3c34 !important;
}

/* --- リンク色: 緑系 --- */
.entry-content a,
.wp-block-post-content a {
  color: #2d8a2c !important;
}

/* --- CTAボタンLP色: 緑系背景 --- */
.cta-button-lp {
  background: #2d8a2c !important;
}
.cta-button-lp:hover {
  background: #36a534 !important;
}

/* --- モバイルスティッキーCTA: 緑系 --- */
.mobile-sticky-cta {
  background: #1a3c34 !important;
}

/* ============================================
   モバイル余白修正（768px以下）
   ============================================ */
@media (max-width: 768px) {
  .entry-content,
  .wp-block-post-content,
  article {
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .wp-site-blocks {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  .site-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .main-content {
    padding: 1rem 12px !important;
  }
  /* twentytwentyfiveデフォルトの過大なpadding/marginをリセット */
  .has-global-padding {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
  }
}

/* ============================================
   cmd_191: デザイン品質向上 + 二重ボックス修正
   ============================================ */

/* --- グローバル --- */
body {
  font-family: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif !important;
  background: #fafaf8 !important;
  color: #333 !important;
}

/* --- モバイル: 二重ボックス解消 --- */
@media (max-width: 768px) {
  /* 外側コンテナの過剰余白をリセット */
  .wp-site-blocks {
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .wp-site-blocks > * {
    max-width: 100% !important;
  }
  .is-layout-constrained {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
  }
  .has-global-padding {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* 実HTML構造: .site-content > .main-content.single-post > .entry-content > .wp-block-post-content */
  .site-content {
    padding: 0 !important;
    margin: 0 !important;
    background: #fff !important;
    gap: 0 !important;
  }
  .main-content,
  .main-content.single-post {
    padding: 1rem 16px !important;
    margin: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
  }
  .single-post .entry-content,
  .single-post .entry-content.wp-block-post-content,
  .wp-block-post-content {
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
  }
  article {
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* ヘッダー/フッターのモバイル最適化 */
  .site-header > div > div {
    padding: 0 12px !important;
  }
  .site-footer {
    padding: 1rem 12px !important;
  }

  /* サイドバーをモバイルで最適化 */
  .sidebar {
    width: 100% !important;
    padding: 0 16px !important;
    margin: 0 !important;
  }

  /* モバイル横はみ出し対策（右側に不要余白が出る症状を防止） */
  html,
  body {
    overflow-x: hidden;
  }
  .entry-content,
  .wp-block-post-content {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .entry-content img,
  .wp-block-post-content img,
  .entry-content iframe,
  .wp-block-post-content iframe,
  .entry-content video,
  .wp-block-post-content video {
    max-width: 100% !important;
    height: auto !important;
  }
  .entry-content table,
  .wp-block-post-content table,
  .entry-content pre,
  .wp-block-post-content pre {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* --- PC: デザイン洗練化 --- */
.site-content {
  max-width: 1100px;
  margin: 0 auto;
  background: #fff;
}
.main-content {
  background: #fff;
  border-radius: 4px;
}

/* --- サイドバーウィジェット洗練化 --- */
.sidebar-widget {
  background: #fff;
  border: 1px solid #e8e5de;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  padding: 1.25rem !important;
  margin-bottom: 1.25rem;
}
.sidebar-widget h3 {
  font-size: 1rem !important;
  padding-bottom: 0.5rem;
  margin-bottom: 0.75rem;
  border-bottom: 2px solid #36a534 !important;
  color: #333 !important;
  background: none !important;
  text-align: left !important;
  text-shadow: none !important;
}
/* サイドバーのh3はh3緑バーにしない（記事内h3のみ緑バー） */
.sidebar .sidebar-widget h3 {
  background: none !important;
  color: #333 !important;
  padding: 0 0 0.5rem 0 !important;
  text-align: left !important;
  text-shadow: none !important;
}

/* --- カテゴリリスト洗練化 --- */
.sidebar-widget .wp-block-categories-list,
.sidebar-widget ul {
  list-style: none !important;
  padding-left: 0 !important;
}
.sidebar-widget .wp-block-categories-list li,
.sidebar-widget ul li {
  padding: 0.4rem 0;
  border-bottom: 1px solid #f0ede8;
  font-size: 0.78rem !important;
  color: #777 !important;
}
.sidebar-widget .wp-block-categories-list li a,
.sidebar-widget ul li a {
  color: #333 !important;
  font-size: 0.9rem !important;
  text-decoration: none !important;
  transition: color 0.2s;
}
.sidebar-widget .wp-block-categories-list li a:hover,
.sidebar-widget ul li a:hover {
  color: #36a534 !important;
}
.sidebar-widget .wp-block-categories-list .wp-block-categories__post-count,
.sidebar-widget .wp-block-categories-list .post-count {
  font-size: 0.78rem !important;
  color: #777 !important;
}

/* --- 記事メタ情報 --- */
.post-meta,
.wp-block-post-date {
  color: #888 !important;
  font-size: 0.85rem;
}

/* --- サイドバー「最近の投稿」の日付サイズ調整 --- */
.sidebar-widget .wp-block-latest-posts__post-date {
  font-size: 0.72rem !important;
  color: #888 !important;
}

/* --- 記事タイトル洗練化 --- */
.entry-title,
.wp-block-post-title {
  font-size: 1.6rem !important;
  line-height: 1.4 !important;
  margin-bottom: 0.5rem;
}
@media (min-width: 769px) {
  .entry-title,
  .wp-block-post-title {
    font-size: 2rem !important;
  }
}

/* --- 記事下CTA洗練化 --- */
.post-cta {
  border: none !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* --- フッター洗練化 --- */
.site-footer {
  font-size: 0.85rem;
  line-height: 1.6;
}
.site-footer a {
  text-decoration: none;
}

/* ============================================
   cmd_192: フッター幅統一 + ヘッダーボーダー除去
   ============================================ */

/* 共通横幅トークン（コンテンツ/ヘッダー/フッターを一致） */
:root {
  --blog-shell-max: 1100px;
  --blog-shell-pad: 16px;
}

/* --- ページ最上部の不要ライン候補を除去 --- */
html,
body,
.wp-site-blocks,
.wp-site-blocks > header,
.site-header,
.wp-block-template-part:first-child,
body::before,
html::before {
  border-top: none !important;
}

/* cmd_189で有効化したヘッダー下線は維持 */
.site-header {
  border-bottom: 4px solid #36a534 !important;
}

/* --- ヘッダー/コンテンツ/フッターの横幅を統一 --- */
.site-content {
  max-width: var(--blog-shell-max) !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

.site-header > div > div,
.site-footer > div {
  max-width: var(--blog-shell-max) !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--blog-shell-pad) !important;
  padding-right: var(--blog-shell-pad) !important;
  box-sizing: border-box !important;
}

@media (max-width: 768px) {
  .site-header,
  .site-content,
  .site-footer,
  .wp-block-template-part:first-child,
  .wp-block-template-part:last-child {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  .site-header > div > div,
  .site-footer > div {
    padding-left: var(--blog-shell-pad) !important;
    padding-right: var(--blog-shell-pad) !important;
    max-width: 100% !important;
  }
}

.sidebar-cta h3 {
  color: #fff !important;
  border-bottom-color: rgba(255,255,255,0.3) !important;
  text-shadow: none !important;
}

/* ===== cmd_206 施策C: パンくず ===== */
.breadcrumbs { font-size: 0.8rem; color: #888; padding: 0.5rem 0; margin-bottom: 1rem; }
.breadcrumbs a { color: #2980b9; text-decoration: none; }
.breadcrumbs a:hover { text-decoration: underline; }

/* ===== cmd_206 施策D: 関連記事 ===== */
.related-posts { background: #f0f4f8; padding: 1.5rem; border-radius: 8px; margin: 2rem 0; }
.related-posts h3 { font-size: 1.1rem; margin: 0 0 0.75rem; color: #1a5276; }
.related-posts ul { list-style: none; padding: 0; margin: 0; }
.related-posts li { padding: 0.4rem 0; border-bottom: 1px solid #ddd; }
.related-posts li:last-child { border-bottom: none; }
.related-posts a { color: #2980b9; text-decoration: none; }
.related-posts a:hover { text-decoration: underline; }

/* ===== cmd_206 施策E: 自動目次 ===== */
.toc { background: #f8f9fa; border: 1px solid #e0e0e0; border-left: 4px solid #1a5276; padding: 1rem 1.5rem; margin: 1.5rem 0; border-radius: 4px; }
.toc-title { font-weight: bold; font-size: 1rem; margin: 0 0 0.5rem; color: #1a5276; }
.toc ul { list-style: none; padding: 0; margin: 0; }
.toc li { padding: 0.25rem 0; }
.toc li.toc-sub { padding-left: 1.2rem; font-size: 0.9rem; }
.toc a { color: #2980b9; text-decoration: none; }
.toc a:hover { text-decoration: underline; }

/* ===== cmd_207 施策A: カテゴリ説明 ===== */
.category-description { color: #555; font-size: 0.95rem; line-height: 1.6; margin-bottom: 1.5rem; padding: 1rem; background: #f0f4f8; border-radius: 6px; border-left: 4px solid #1a5276; }

/* ===== cmd_207 施策B: 更新日 ===== */
.last-modified { color: #888; font-size: 0.8rem; margin-left: 0.5rem; }

/* ===== cmd_207 施策D: 404ページ ===== */
.error-404-content { max-width: 600px; }
.error-404-content p { font-size: 1.1rem; color: #555; margin-bottom: 2rem; }
.error-404-content h2 { font-size: 1.2rem; color: #1a5276; margin-top: 2rem; }

/* ===== 見出し可読性調整（2026-02-16） ===== */
/* 記事本文のみ対象。サイドバーやカード見出しには影響させない。 */
.single-post .entry-content h2,
.single-post .wp-block-post-content h2 {
  font-size: clamp(1.35rem, 1.12rem + 0.9vw, 1.8rem) !important;
  line-height: 1.45 !important;
  margin: 1.6em 0 0.8em !important;
}

.single-post .entry-content h3,
.single-post .wp-block-post-content h3 {
  font-size: clamp(1.15rem, 1.0rem + 0.6vw, 1.45rem) !important;
  line-height: 1.45 !important;
  padding: 0.6em 0.75em !important;
  margin: 1.4em 0 0.8em !important;
  border-radius: 6px !important;
}

.single-post .entry-content h4,
.single-post .wp-block-post-content h4 {
  font-size: clamp(1.02rem, 0.95rem + 0.35vw, 1.18rem) !important;
  line-height: 1.6 !important;
  margin: 1.2em 0 0.7em !important;
  border-left-width: 5px !important;
  padding: 4px 0 3px 10px !important;
}

/* sidebar-cta見出しの可読性確保（緑背景で白文字を最優先） */
.sidebar .sidebar-widget.sidebar-cta h3 {
  color: #fff !important;
  border-bottom-color: rgba(255, 255, 255, 0.35) !important;
}

/* ===== モバイル右余白の強制解消（2026-02-16） ===== */
@media (max-width: 768px) {
  .site-content {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .main-content,
  .main-content.single-post,
  .single-post .entry-content,
  .single-post .wp-block-post-content {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  .single-post .wp-block-post-content > *,
  .single-post .entry-content > * {
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  .single-post .wp-block-post-content .alignwide,
  .single-post .wp-block-post-content .alignfull {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}