/* ══ 金継ぎ追補CSS（soseijisan.com トップ・2026-08-27） ══
   金継ぎ診断の修理一式。外したくなったらこの欄を空にして保存すれば元通り。
   方針: 色は元栓（:root変数）の族で当てる・新色は床のための派生1色だけ */

/* 派生1色（読みやすさの床のための例外）: #9e1b1b の明度だけ上げた赤 */
:root { --kintsugi-red-light: #e15151; }

/* ── 暗い地に沈む赤文字を読みやすさの床に載せる ── */
.hero-subtitle,
.timeline-date,
.cta-button,
section:not(.retro-paper-bg) .section-title,
section:not(.retro-paper-bg) .section-lead { color: var(--color-red-bright); }
.cta-button { border-color: var(--color-red-bright); }
.hero-title { color: var(--color-red-bright); text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6); }
.read-more { color: var(--kintsugi-red-light); }
.contact .info-block p strong { color: var(--kintsugi-red-light); }
.hero-description { color: var(--color-text-light); }
.scroll-indicator span { color: var(--color-text-light); }

/* ヒーローの覆いを少し濃くする（写真の中間調の上に赤文字が乗るため。写真は右側に残す） */
.hero-overlay {
  background: linear-gradient(135deg, rgba(10, 10, 10, 0.95) 0%, rgba(10, 10, 10, 0.9) 55%, rgba(10, 10, 10, 0.5) 100%);
}
@media (max-width: 768px) {
  .hero-overlay {
    background: linear-gradient(135deg, rgba(10, 10, 10, 0.95) 0%, rgba(10, 10, 10, 0.9) 70%, rgba(10, 10, 10, 0.6) 100%);
  }
}
/* 「物語を読む」ボタンは燃える炭火の真上＝文字色では床に届かないため、ボタンにだけ暗い下地を敷く */
.hero .cta-button { background-color: rgba(10, 10, 10, 0.92); }
/* transition: all が文字色まで遷移させるのを外す（hoverの手触りは背景・影・枠で保つ） */
.cta-button { transition-property: background-color, border-color, box-shadow; }

/* ── 似て非なる色の統合（紙地の文字は #1a1a1a へ） ── */
.retro-paper-bg { color: var(--color-black-soft); }
.cta-button.outline { color: var(--color-black-soft); border-color: var(--color-black-soft); }
.news-excerpt { color: var(--color-text-light); }
.footer-container { border-top-color: var(--color-black-soft); }

/* 闇に消えていた「コラム一覧を見る」ボタン（暗い節の outline ボタンは明るい赤へ）
   ※上の .cta-button.outline より後に置いて勝たせる */
.news .cta-button.outline { color: var(--color-red-bright); border-color: var(--color-red-bright); }
.news .cta-button.outline:hover { background-color: var(--color-red-bright); color: #0a0a0a; }

/* ── 文字の段を役割ごとに統合 ──
   見出し(h3〜h6役割): 48px / 20.8px の2段へ
   本文: 16 / 19.2 / 24px の3段へ・ボタン: 16 / 19.2px の2段へ */
h4 { font-size: 1.3rem; }
.timeline-content h4 { font-size: 1.3rem; }
.commitment-text h4 { font-size: 1.3rem; }
.menu-category { font-size: 1.3rem; }
.news-date { font-size: 1rem; }
.contact-note { font-size: 1rem; }
.section-lead { font-size: 1.2rem; }
.read-more { font-size: 1rem; }
.info-block { font-size: 1.2rem; }
.commitment-text p { font-size: 1.2rem; }
.menu-note { font-size: 1rem; }
#wpadminbar * { font-size: 16px; }

/* ── 場当たりなz-indexを3段（1/10/100）へ ── */
header.header { z-index: 100; }
#wpadminbar { z-index: 100; background-color: var(--color-black-soft); }
#wpadminbar .ab-sub-wrapper, #wpadminbar ul, #wpadminbar ul li { z-index: 100; }
#wpadminbar .ab-empty-item, #wpadminbar a.ab-item,
#wpadminbar > #wp-toolbar span.ab-label, #wpadminbar > #wp-toolbar span.noticon { color: var(--color-text-light); }

/* ── スマホの詰まり: 連絡先の2列固定を1列へ（390pxで1行5文字になっていた） ── */
@media (max-width: 767px) {
  .contact-grid { grid-template-columns: 1fr; }
}

/* ── 言葉の泣き別れ（「焼き|鳥」「パソ|コン」等）: 文節で折る（対応ブラウザのみ・無害） ── */
.contact-note p, .timeline-content p, .news-title, .about-text p { word-break: auto-phrase; }