/*
Theme Name: はじめての永代供養 (SWELL子テーマ)
Template: swell
Theme URI: https://example.com/
Author: はじめての永代供養
Description: SWELLを親テーマにした子テーマ。トップページは固定ページ「トップページ」の本文をブロックとして描画するため、WordPressの編集画面から文言を直接修正できます。デザインCSSはトップページのみに読み込まれ、SWELLの他ページには影響しません。
Version: 2.31.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: eitai-swell-child
*/

/* =====================================================
   共通の追加CSS（トップページ以外にも効きます）
   トップページ専用デザインは front-page.php 内の <style> に入っています。
   ===================================================== */

:root {
  --eitai-ai:     #1c3c5e; /* 紺（見出し） */
  --eitai-sage:   #427a6c; /* 深緑（CTA・コントラスト基準対応） */
  --eitai-gold:   #8f6f2a; /* ゴールド（ラベル・コントラスト基準対応） */
  --eitai-kinari: #f5f2ec; /* 生成り（背景） */
  --eitai-teal:   #3f7a6b; /* 深緑（キャッチ） */
  --eitai-line:   #e0dccf;
}

/* -----------------------------------------------------
   施設（斎場・寺院・霊園）カード ─ 地域ページで使う共通パーツ
   ----------------------------------------------------- */
.eitai-fac {
  background: #fff;
  border: 1px solid var(--eitai-line);
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 18px;
}
.eitai-fac__name {
  font-family: "Noto Serif JP", serif;
  font-size: 20px;
  color: var(--eitai-ai);
  margin: 0 0 8px;
}
.eitai-fac__meta {
  font-size: 13.5px;
  color: #6b7278;
  margin: 0 0 10px;
}
.eitai-fac__tag {
  display: inline-block;
  font-size: 11.5px;
  font-weight: 700;
  padding: 4px 11px;
  border-radius: 4px;
  background: #ebe6dc;
  color: var(--eitai-ai);
  border: 1px solid var(--eitai-line);
  margin-right: 6px;
}
.eitai-fac__price {
  font-family: "Noto Serif JP", serif;
  font-weight: 700;
  color: var(--eitai-teal);
}

/* -----------------------------------------------------
   ボタン
   ----------------------------------------------------- */
/* a / button 要素に直接付けたときだけ効かせる。
   （トップページでは wp-block-buttons コンテナのクラス名にも
   eitai-btn を使っているため、素の .eitai-btn だと
   コンテナ自体が巨大なボタンの見た目になってしまう） */
a.eitai-btn,
button.eitai-btn {
  display: inline-block;
  background: var(--eitai-sage);
  color: #fff;
  font-weight: 700;
  padding: 14px 34px;
  border-radius: 50px;
  text-decoration: none;
  box-shadow: 0 6px 18px rgba(66, 122, 108, .30);
  transition: .2s;
}
a.eitai-btn:hover,
button.eitai-btn:hover { background: #35655a; color: #fff; }

/* -----------------------------------------------------
   エリア検索ウィジェット（ショートコード [eitai_area_search]）
   ----------------------------------------------------- */
.eitai-area-search {
  background: var(--eitai-kinari);
  border: 1px solid var(--eitai-line);
  border-radius: 12px;
  padding: 20px;
}
.eitai-area-search__title {
  font-family: "Noto Serif JP", serif;
  font-size: 16px;
  color: var(--eitai-ai);
  margin: 0 0 12px;
}
.eitai-area-search select {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--eitai-line);
  border-radius: 50px;
  background: #fff;
  font-size: 15px;
  margin-bottom: 10px;
}
.eitai-area-search a.eitai-btn { width: 100%; text-align: center; padding: 12px; }

/* -----------------------------------------------------
   SWELLヘッダー（コラム・投稿ページなど）：ロゴ横にサイト名を表示
   トップページは独自ヘッダーのため影響しません。
   ----------------------------------------------------- */
.c-headLogo__link {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}
.c-headLogo__link::after {
  content: "はじめての永代供養";
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-weight: 700;
  font-size: 21px;
  letter-spacing: .05em;
  color: var(--eitai-ai);
  line-height: 1.2;
  white-space: nowrap;
}
@media (max-width: 781px) {
  .c-headLogo__link::after { font-size: 17px; }
}

/* -----------------------------------------------------
   ヘッダー右のCTAボタン
   （外観 → ウィジェット → ヘッダー内部 にカスタムHTMLで設置）
   ----------------------------------------------------- */
.w-header a.eitai-btn {
  padding: 10px 22px;
  font-size: 14px;
  white-space: nowrap;
}

/* スマホ開閉メニュー内のCTAボタン
   （外観 → ウィジェット → スマホ開閉メニュー下 にカスタムHTMLで設置） */
.w-spMenuBottom a.eitai-btn {
  display: block;
  width: calc(100% - 32px);
  margin: 16px auto;
  padding: 14px 20px;
  text-align: center;
  font-size: 15px;
}

/* -----------------------------------------------------
   コラム記事本文（SWELL投稿ページ）のデザイン統一
   トップページ・地域ページは独自CSSのため影響しません。
   ----------------------------------------------------- */
body .post_content {
  font-size: 16px;
  line-height: 1.95;
  color: #33383d;
}
body .post_content > p { margin: 0 0 1.6em; }

/* 見出し */
body .post_content h2 {
  font-family: "Noto Serif JP", "Yu Mincho", serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--eitai-ai);
  background: var(--eitai-kinari);
  border: 1px solid var(--eitai-line);
  border-left: 5px solid var(--eitai-sage);
  border-radius: 0 8px 8px 0;
  padding: 16px 20px;
  margin: 3em 0 1.2em;
}
body .post_content h3 {
  font-family: "Noto Serif JP", "Yu Mincho", serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--eitai-ai);
  background: none;
  border: none;
  border-bottom: 2px solid var(--eitai-line);
  padding: 0 2px 10px;
  margin: 2.5em 0 1em;
  position: relative;
}
body .post_content h3::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 64px;
  height: 2px;
  background: var(--eitai-sage);
}
body .post_content h4 {
  font-size: 17px;
  font-weight: 700;
  color: var(--eitai-ai);
  background: none;
  border: none;
  border-left: 3px solid var(--eitai-gold);
  padding: 2px 0 2px 14px;
  margin: 2em 0 .8em;
}

/* リンク */
body .post_content a { color: var(--eitai-sage); text-decoration: underline; }
body .post_content a:hover { color: #35655a; }

/* 表 */
body .post_content table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
  line-height: 1.7;
}
body .post_content th {
  background: var(--eitai-ai);
  color: #fff;
  font-weight: 700;
  padding: 12px 14px;
  border: 1px solid #2c4c6e;
  text-align: left;
}
body .post_content td {
  padding: 12px 14px;
  border: 1px solid var(--eitai-line);
  background: #fff;
}
body .post_content tbody tr:nth-child(even) td { background: #faf8f4; }

/* リスト */
body .post_content ul li::marker { color: var(--eitai-sage); }
body .post_content ol li::marker { color: var(--eitai-ai); font-weight: 700; }
body .post_content li { margin-bottom: .5em; }

/* 引用・注記 */
body .post_content blockquote {
  background: var(--eitai-kinari);
  border-left: 4px solid var(--eitai-line);
  border-radius: 0 8px 8px 0;
  padding: 16px 20px;
  color: #55606a;
}

/* -----------------------------------------------------
   コラム一覧（/column/・カテゴリー一覧・関連記事）のデザイン統一
   ----------------------------------------------------- */
/* ページタイトル（「コラム」など） */
body .c-pageTitle {
  font-family: "Noto Serif JP", "Yu Mincho", serif;
  color: var(--eitai-ai);
  letter-spacing: .05em;
}

/* 記事タイトル・抜粋・日付 */
body .p-postList__title {
  color: var(--eitai-ai);
  font-weight: 700;
  line-height: 1.55;
}
body .p-postList__excerpt { color: #5b636b; }
body .p-postList__times,
body .c-postTimes { color: #8a8f94; }

/* カード型レイアウト */
body .p-postList.-type-card .p-postList__item {
  background: #fff;
  border: 1px solid var(--eitai-line);
  border-radius: 12px;
  overflow: hidden;
  transition: box-shadow .2s, transform .2s;
}
body .p-postList.-type-card .p-postList__item:hover {
  box-shadow: 0 10px 24px rgba(28, 60, 94, .12);
  transform: translateY(-2px);
}
body .p-postList.-type-card .p-postList__body { padding: 14px 16px 16px; }

/* リスト型レイアウト */
body .p-postList.-type-list .p-postList__item {
  border-bottom: 1px solid var(--eitai-line);
  padding: 18px 0;
}

/* コラム一覧上の案内ボックス
   （外観 → ウィジェット → トップページ上部 にカスタムHTMLで設置） */
.eitai-column-intro {
  background: var(--eitai-kinari);
  border: 1px solid var(--eitai-line);
  border-radius: 12px;
  padding: 22px 24px;
  margin-bottom: 28px;
  line-height: 1.8;
}
.eitai-column-intro__title {
  font-family: "Noto Serif JP", "Yu Mincho", serif;
  font-size: 18px;
  font-weight: 700;
  color: var(--eitai-ai);
  margin: 0 0 8px;
}
.eitai-column-intro p { margin: 0 0 10px; font-size: 14.5px; color: #4a5158; }
.eitai-column-intro ul { margin: 0; padding: 0; list-style: none; }
.eitai-column-intro li { margin: 0 0 6px; padding-left: 1.2em; position: relative; font-size: 14.5px; }
.eitai-column-intro li::before {
  content: "›";
  position: absolute;
  left: 2px;
  color: var(--eitai-sage);
  font-weight: 700;
}
.eitai-column-intro a { color: var(--eitai-sage); text-decoration: underline; }
.eitai-column-intro a:hover { color: #35655a; }