/* ==========================================================================
   破産リアル — Site-wide Styles (記事ページ・カテゴリ・固定ページ共通)
   Theme: SWELL child theme
   Place at: wp-content/themes/swell_child/assets/css/hasan-real-site.css
   全ページ読み込み — 記事・カテゴリ・固定ページにブランドを統一
   ========================================================================== */

:root {
  --hr-paper:  #f4efe4;
  --hr-paper-2:#ece5d5;
  --hr-ink:    #1f1a14;
  --hr-red:    #9c3028;
  --hr-mute:   rgba(31,26,20,.72);
  --hr-line:   rgba(31,26,20,.12);
  --hr-link:   #1a0dab;
  --hr-serif:  "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --hr-sans:   -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Noto Sans JP", system-ui, sans-serif;
}

/* ─── Body / Background ─── */
body { background: var(--hr-paper) !important; color: var(--hr-ink) !important; font-family: var(--hr-serif) !important; }

/* ─── Header ─── */
.l-header,
#header,
.l-header__bar { background: var(--hr-paper) !important; border-bottom: 1px solid var(--hr-line) !important; box-shadow: none !important; }
.l-header .c-headerNavSp__inner,
.p-spMenu { background: var(--hr-paper) !important; }
.c-gnav a,
.c-gnav__item > a,
.l-header__nav a { font-family: var(--hr-serif) !important; color: var(--hr-ink) !important; letter-spacing: .04em; }
.c-gnav a:hover { color: var(--hr-red) !important; }

/* ─── Article Page Title (h1) ─── */
.p-postTitle,
.c-pageTitle,
.entry-title,
.p-articleTitle__ttl,
article h1.entry-title {
  font-family: var(--hr-serif) !important;
  font-weight: 500 !important;
  font-size: clamp(22px, 3.4vw, 34px) !important;
  line-height: 1.55 !important;
  letter-spacing: .04em !important;
  color: var(--hr-ink) !important;
  border: none !important;
  background: none !important;
  padding: 0 !important;
}

/* メタ情報（投稿日・更新日・カテゴリー） */
.p-postList__meta,
.c-postTimes,
.c-postMeta,
.p-articleMeta {
  font-family: var(--hr-sans) !important;
  font-size: 11px !important;
  letter-spacing: .15em !important;
  color: rgba(31,26,20,.55) !important;
}

/* ─── Headings inside post content ─── */
.post_content h2,
.entry-content h2,
.p-postContent h2 {
  font-family: var(--hr-serif) !important;
  font-weight: 500 !important;
  font-size: clamp(20px, 2.6vw, 26px) !important;
  line-height: 1.6 !important;
  letter-spacing: .04em !important;
  color: var(--hr-ink) !important;
  background: none !important;
  border: none !important;
  border-top: 1px solid var(--hr-ink) !important;
  border-bottom: none !important;
  padding: 24px 0 0 !important;
  margin: 72px 0 22px !important;
  position: relative;
}
.post_content h2::before,
.entry-content h2::before,
.p-postContent h2::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  width: 48px;
  height: 3px;
  background: var(--hr-red);
}

.post_content h3,
.entry-content h3,
.p-postContent h3 {
  font-family: var(--hr-serif) !important;
  font-weight: 500 !important;
  font-size: clamp(17px, 2.1vw, 20px) !important;
  line-height: 1.6 !important;
  letter-spacing: .03em !important;
  color: var(--hr-ink) !important;
  background: none !important;
  border: none !important;
  border-left: 3px solid var(--hr-red) !important;
  padding: 4px 0 4px 16px !important;
  margin: 40px 0 16px !important;
}

.post_content h4,
.entry-content h4 {
  font-family: var(--hr-serif) !important;
  font-weight: 600 !important;
  font-size: clamp(15px, 1.8vw, 17px) !important;
  color: var(--hr-ink) !important;
  background: none !important;
  border: none !important;
  margin: 32px 0 12px !important;
  padding: 0 !important;
}

/* ─── Body text ─── */
.post_content,
.entry-content,
.p-postContent {
  font-family: var(--hr-serif) !important;
  font-size: clamp(14.5px, 1.6vw, 16px) !important;
  line-height: 2.0 !important;
  color: var(--hr-ink) !important;
  letter-spacing: .02em;
}
.post_content p,
.entry-content p { margin: 0 0 1.5em !important; }

/* ─── Links ─── */
.post_content a,
.entry-content a { color: var(--hr-link) !important; text-decoration: underline !important; text-underline-offset: 3px; }
.post_content a:hover { opacity: .8; }

/* ─── Blockquote ─── */
.post_content blockquote,
.entry-content blockquote {
  background: var(--hr-paper-2) !important;
  border: none !important;
  border-left: 3px solid var(--hr-ink) !important;
  padding: 20px 24px !important;
  margin: 28px 0 !important;
  font-family: var(--hr-serif) !important;
  font-size: 14.5px !important;
  line-height: 1.95 !important;
  color: rgba(31,26,20,.82) !important;
}
.post_content blockquote::before { display: none !important; }

/* ─── Lists ─── */
.post_content ul,
.post_content ol { margin: 1em 0 1.5em 1.5em !important; }
.post_content li { margin-bottom: .5em !important; line-height: 1.95 !important; }

/* ─── Code / inline ─── */
.post_content code,
.post_content pre {
  background: var(--hr-paper-2) !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important;
  font-size: 13px !important;
}

/* ─── Tables ─── */
.post_content table {
  border-collapse: collapse !important;
  border-top: 1px solid var(--hr-ink) !important;
  border-bottom: 1px solid var(--hr-ink) !important;
}
.post_content table th,
.post_content table td {
  border: none !important;
  border-bottom: 1px dotted var(--hr-line) !important;
  padding: 12px 14px !important;
  font-size: 14px !important;
}
.post_content table th { background: var(--hr-paper-2) !important; color: var(--hr-ink) !important; font-weight: 500 !important; }

/* ─── Buttons (SWELL class) ─── */
.post_content .swell-block-button a,
.wp-block-button__link {
  background: var(--hr-ink) !important;
  color: var(--hr-paper) !important;
  border-radius: 0 !important;
  border: none !important;
  font-family: var(--hr-sans) !important;
  font-size: 14px !important;
  letter-spacing: .05em !important;
  padding: 14px 28px !important;
  text-decoration: none !important;
}

/* ─── Related posts / Pickup / Card list ─── */
.p-postList__title,
.c-postThumb__title,
.p-relatedPosts__title,
.p-postCard__title {
  font-family: var(--hr-serif) !important;
  font-weight: 500 !important;
  letter-spacing: .03em !important;
  color: var(--hr-ink) !important;
}

.p-relatedPosts > .p-relatedPosts__ttl,
.p-relatedPosts__ttl,
.p-recentPosts__ttl,
.p-pickupPosts__ttl,
section[class*="__ttl"] {
  font-family: var(--hr-serif) !important;
  font-weight: 500 !important;
  font-size: clamp(18px, 2.4vw, 22px) !important;
  border: none !important;
  border-top: 2px solid var(--hr-ink) !important;
  padding-top: 24px !important;
  position: relative;
}

/* ─── Sidebar widgets ─── */
.p-sideWidget__title,
.widget-title,
.c-widget__title {
  font-family: var(--hr-serif) !important;
  font-weight: 500 !important;
  font-size: 15px !important;
  border: none !important;
  border-bottom: 1px solid var(--hr-ink) !important;
  padding-bottom: 8px !important;
  letter-spacing: .05em !important;
}

/* ─── Category page header ─── */
.p-archiveTitle,
.c-pageTitle--archive,
.p-archive__ttl {
  font-family: var(--hr-serif) !important;
  font-weight: 500 !important;
  font-size: clamp(22px, 3vw, 30px) !important;
  border: none !important;
  background: none !important;
  letter-spacing: .04em !important;
  padding: 40px 0 24px !important;
}

/* ─── Footer ─── */
.l-footer,
.l-footer__inner,
.p-footerWidgetArea,
.p-copyright {
  font-family: var(--hr-serif) !important;
  background: var(--hr-ink) !important;
  color: var(--hr-paper) !important;
}
.l-footer a { color: var(--hr-paper) !important; opacity: .85; }
.l-footer a:hover { opacity: 1; }
.p-copyright { font-family: var(--hr-sans) !important; font-size: 11px !important; letter-spacing: .25em !important; opacity: .6; }

/* ─── Pagination ─── */
.p-pagination a,
.p-pagination span {
  font-family: var(--hr-sans) !important;
  border-radius: 0 !important;
  border: 1px solid var(--hr-ink) !important;
  background: transparent !important;
  color: var(--hr-ink) !important;
}
.p-pagination .current { background: var(--hr-ink) !important; color: var(--hr-paper) !important; }

/* ─── Mark / strong ─── */
.post_content mark,
.entry-content mark {
  background: linear-gradient(transparent 60%, rgba(156,48,40,.25) 60%) !important;
  padding: 0 2px !important;
  color: var(--hr-ink) !important;
}
.post_content strong,
.entry-content strong { color: var(--hr-red) !important; font-weight: 600 !important; }

/* ==========================================================================
   UX / 回遊改善 — Phase 2
   ========================================================================== */

/* ─── ヘッダー右上のRSSアイコン非表示 ─── */
.l-header__rss,
.c-iconLink--rss,
.c-headerTools__rss,
a[href*="/feed/"]:not(.no-hide-feed) { display: none !important; }

/* ─── パンくずリストの白いライン削除 + デザイン統一 ─── */
.p-breadcrumb,
.c-breadcrumb,
.l-breadcrumb {
  background: transparent !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  padding: 16px 0 !important;
  font-family: var(--hr-sans) !important;
  font-size: 11px !important;
  letter-spacing: .15em !important;
  color: rgba(31,26,20,.55) !important;
  box-shadow: none !important;
}
.p-breadcrumb a,
.c-breadcrumb a { color: rgba(31,26,20,.7) !important; text-decoration: none !important; }
.p-breadcrumb a:hover { color: var(--hr-red) !important; }
.p-breadcrumb__list { background: transparent !important; }

/* ─── アイキャッチプレースホルダー対策（格子柄が出るやつ） ─── */
/* 通常のno-imageを和紙色のシンプルなブロックに */
.p-postList__imgBox img[src*="noimage"],
.p-postList__imgBox img[src*="no-image"],
.p-postList__imgBox img[src*="placeholder"],
.c-postThumb__figure img[src*="noimage"],
img.no-image,
.no-img {
  display: none !important;
}
/* no-image時の代替表示 */
.p-postList__imgBox:has(img[src*="noimage"]),
.p-postList__imgBox:empty,
.c-postThumb__figure:has(img[src*="noimage"]) {
  background: var(--hr-paper-2) !important;
  position: relative;
}
.p-postList__imgBox:has(img[src*="noimage"])::before,
.c-postThumb__figure:has(img[src*="noimage"])::before {
  content: "破";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--hr-serif);
  font-size: 48px;
  font-weight: 700;
  color: rgba(156,48,40,.25);
}

/* ─── 投稿サムネイル全体: 格子柄が出る場合は見えなくする ─── */
.post_content > figure:first-child img[src*="placeholder"],
.p-articleContent > figure:first-child img[src*="placeholder"] { display: none !important; }

/* ==========================================================================
   目次デザイン (SWELL Table of Contents)
   ========================================================================== */
.swell-toc,
.p-tableOfContents,
#toc_container,
.ez-toc-container {
  background: var(--hr-paper-2) !important;
  border: 1px solid rgba(31,26,20,.18) !important;
  border-left: 4px solid var(--hr-red) !important;
  border-radius: 0 !important;
  padding: 28px 32px !important;
  margin: 36px 0 !important;
  font-family: var(--hr-serif) !important;
  position: relative;
  box-shadow: none !important;
}
.swell-toc::before,
.p-tableOfContents::before {
  content: "目  次  ·  TABLE OF CONTENTS";
  display: block;
  font-family: var(--hr-sans);
  font-size: 10px;
  letter-spacing: .35em;
  color: var(--hr-red);
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px dotted rgba(31,26,20,.25);
}
.swell-toc__title,
.p-tableOfContents__ttl,
#toc_container .toc_title { display: none !important; }

.swell-toc ol,
.swell-toc ul,
.p-tableOfContents ol,
.p-tableOfContents ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  counter-reset: toc-num;
}
.swell-toc li,
.p-tableOfContents li {
  position: relative;
  padding: 10px 0 10px 36px !important;
  border-bottom: 1px dotted rgba(31,26,20,.18) !important;
  counter-increment: toc-num;
  line-height: 1.7 !important;
}
.swell-toc li:last-child,
.p-tableOfContents li:last-child { border-bottom: none !important; }
.swell-toc li::before,
.p-tableOfContents li::before {
  content: counter(toc-num, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 12px;
  font-family: var(--hr-sans);
  font-size: 10px;
  color: var(--hr-red);
  letter-spacing: .15em;
  font-weight: 500;
}
.swell-toc li li,
.p-tableOfContents li li {
  padding-left: 24px !important;
  font-size: 13px;
  color: rgba(31,26,20,.7);
}
.swell-toc li li::before,
.p-tableOfContents li li::before { display: none; }
.swell-toc a,
.p-tableOfContents a {
  color: var(--hr-ink) !important;
  text-decoration: none !important;
  font-size: 14.5px;
  letter-spacing: .03em;
}
.swell-toc a:hover,
.p-tableOfContents a:hover { color: var(--hr-red) !important; }

/* ==========================================================================
   関連記事 / 続けて読む — 記事末尾の回遊CTA
   ========================================================================== */
.hr-continue {
  margin: 64px 0 32px;
  padding: 36px 0 0;
  border-top: 2px solid var(--hr-ink);
  position: relative;
}
.hr-continue::before {
  content: "次  ·  CONTINUE READING";
  display: block;
  font-family: var(--hr-sans);
  font-size: 11px;
  letter-spacing: .4em;
  color: var(--hr-red);
  margin-bottom: 24px;
}
.hr-continue__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 720px) {
  .hr-continue__grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
.hr-continue__card {
  display: block;
  padding: 24px 0 0;
  border-top: 1px solid rgba(31,26,20,.25);
  text-decoration: none !important;
  color: inherit;
  position: relative;
  transition: opacity .15s;
}
.hr-continue__card:hover { opacity: .7; }
.hr-continue__cat {
  font-family: var(--hr-sans);
  font-size: 10px;
  letter-spacing: .25em;
  color: var(--hr-red);
  display: block;
  margin-bottom: 10px;
}
.hr-continue__title {
  font-family: var(--hr-serif);
  font-size: 17px;
  font-weight: 500;
  line-height: 1.55;
  margin: 0 0 10px;
  color: var(--hr-ink);
}
.hr-continue__excerpt {
  font-size: 12.5px;
  line-height: 1.85;
  color: rgba(31,26,20,.65);
  margin: 0;
}
.hr-continue__arrow {
  display: inline-block;
  margin-top: 14px;
  font-family: var(--hr-sans);
  font-size: 11px;
  letter-spacing: .2em;
  color: var(--hr-red);
}

/* 全記事一覧へ */
.hr-allposts {
  margin: 48px 0 64px;
  text-align: center;
}
.hr-allposts a {
  display: inline-flex;
  gap: 12px;
  padding: 16px 32px;
  border: 1px solid var(--hr-ink);
  font-family: var(--hr-sans);
  font-size: 13px;
  letter-spacing: .15em;
  color: var(--hr-ink) !important;
  text-decoration: none !important;
}
.hr-allposts a:hover { background: var(--hr-ink); color: var(--hr-paper) !important; }

/* ==========================================================================
   読了プログレスバー (オプション、JSと連動)
   ========================================================================== */
.hr-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  background: var(--hr-red);
  z-index: 9999;
  width: 0;
  transition: width .1s linear;
  pointer-events: none;
}

/* ==========================================================================
   検索ボックス
   ========================================================================== */
.search-form,
.wp-block-search,
form[role="search"] {
  display: flex !important;
  gap: 0 !important;
  margin: 24px 0 !important;
}
.search-form input[type="search"],
.wp-block-search__input {
  background: var(--hr-paper) !important;
  border: 1px solid var(--hr-ink) !important;
  border-radius: 0 !important;
  padding: 12px 16px !important;
  font-family: var(--hr-serif) !important;
  font-size: 14px !important;
  color: var(--hr-ink) !important;
  flex: 1;
}
.search-form button,
.wp-block-search__button {
  background: var(--hr-ink) !important;
  color: var(--hr-paper) !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 12px 20px !important;
  font-family: var(--hr-sans) !important;
  font-size: 13px !important;
  letter-spacing: .1em !important;
}

/* ==========================================================================
   404ページ
   ========================================================================== */
body.error404 .l-mainContent {
  text-align: center;
  padding: 80px 24px !important;
}
body.error404 .c-pageTitle {
  font-size: clamp(28px, 4vw, 40px) !important;
  margin-bottom: 24px !important;
}

/* ==========================================================================
   コメント欄非表示（体験記録の性格上）
   ========================================================================== */
.c-commentArea,
#comments,
#respond { display: none !important; }

/* ==========================================================================
   シリーズナビ — 記事冒頭に表示する連載目次
   ========================================================================== */
.hr-series {
  margin: 0 0 48px;
  padding: 28px 32px 24px;
  background: var(--hr-paper-2);
  border: 1px solid rgba(31,26,20,.18);
  border-left: 4px solid var(--hr-ink);
  position: relative;
}
.hr-series__head {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 14px;
  padding-bottom: 14px;
  margin-bottom: 16px;
  border-bottom: 1px dotted rgba(31,26,20,.25);
}
.hr-series__label {
  font-family: var(--hr-sans);
  font-size: 10px;
  letter-spacing: .35em;
  color: var(--hr-red);
  font-weight: 500;
}
.hr-series__title {
  font-family: var(--hr-serif) !important;
  font-weight: 600 !important;
  font-size: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
  color: var(--hr-ink) !important;
  flex: 1;
  letter-spacing: .04em;
}
.hr-series__title::before { display: none !important; }
.hr-series__count {
  font-family: var(--hr-sans);
  font-size: 11px;
  letter-spacing: .15em;
  color: rgba(31,26,20,.6);
}
.hr-series__desc {
  font-family: var(--hr-serif);
  font-size: 13px;
  line-height: 1.85;
  color: rgba(31,26,20,.7);
  margin: 0 0 14px;
}
.hr-series__list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  counter-reset: none;
}
.hr-series__item {
  display: flex;
  gap: 14px;
  align-items: baseline;
  padding: 9px 0;
  border-bottom: 1px dotted rgba(31,26,20,.15);
  font-family: var(--hr-serif);
  font-size: 14px;
  line-height: 1.55;
}
.hr-series__item:last-child { border-bottom: none; }
.hr-series__item::before { display: none !important; }
.hr-series__num {
  font-family: var(--hr-sans);
  font-size: 10px;
  letter-spacing: .2em;
  color: var(--hr-red);
  flex-shrink: 0;
  min-width: 24px;
}
.hr-series__item a {
  color: var(--hr-ink) !important;
  text-decoration: none !important;
  transition: opacity .15s;
}
.hr-series__item a:hover { opacity: .65; }
.hr-series__item.is-current { background: rgba(156,48,40,.06); margin: 0 -10px; padding: 9px 10px; }
.hr-series__here {
  color: var(--hr-red);
  font-weight: 500;
}
.hr-series__here::after {
  content: " ← 今ここ";
  font-family: var(--hr-sans);
  font-size: 9px;
  letter-spacing: .2em;
  color: var(--hr-red);
  opacity: .7;
  margin-left: 6px;
}