/*
Theme Name: Hana Journal
Template: twentytwentyfive
Description: 妊活専門ブログ「Hana Journal」— Twenty Twenty-Five 子テーマ
Version: 1.0
Author: Hana Journal
Text Domain: hana-journal
*/

/* ===== Google Fonts ===== */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;400;700&family=Noto+Sans+JP:wght@300;400;500&display=swap');

/* ===== CSS Variables ===== */
:root {
  --rose:         #F2C4CE;
  --rose-deep:    #D4768A;
  --rose-light:   #FDF0F3;
  --rose-border:  #EAD8DC;
  --sage:         #A8C5A0;
  --sage-light:   #EEF5EC;
  --cream:        #FBF7F0;
  --warm-gray:    #8A7E76;
  --text-dark:    #3D2B2F;
  --text-mid:     #6B5058;
  --gold:         #D4A843;
  --font-serif:   'Noto Serif JP', serif;
  --font-sans:    'Noto Sans JP', sans-serif;
}

/* ===== Global Reset / Base ===== */
body {
  font-family: var(--font-sans);
  background-color: var(--cream);
  color: var(--text-dark);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-serif);
  color: var(--text-dark);
}

a {
  color: var(--rose-deep);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
  text-decoration-color: var(--rose);
}

/* ===== Site Header ===== */
.wp-block-template-part.header,
.site-header,
header.wp-block-template-part {
  background: #fff !important;
  border-bottom: 1px solid var(--rose-border);
  padding: 0 2rem;
  position: sticky;
  top: 0;
  z-index: 100;
}

.wp-block-site-title a {
  font-family: var(--font-serif) !important;
  font-weight: 700 !important;
  font-size: 20px !important;
  color: var(--rose-deep) !important;
  letter-spacing: 0.05em;
}

/* ===== Navigation ===== */
.wp-block-navigation {
  font-family: var(--font-sans);
  font-size: 13px;
  letter-spacing: 0.05em;
}

.wp-block-navigation a {
  color: var(--text-mid) !important;
  font-weight: 500;
}

.wp-block-navigation a:hover {
  color: var(--rose-deep) !important;
}

/* CTA ボタン風リンク（最後のナビ項目） */
.wp-block-navigation-item:last-child .wp-block-navigation-item__content {
  background: var(--rose-deep);
  color: #fff !important;
  padding: 6px 18px;
  border-radius: 20px;
  font-size: 12px;
}

/* ===== Hero / Cover Block ===== */
.hana-hero.wp-block-cover {
  background-color: #fff !important;
  border-bottom: 1px solid var(--rose-border);
  padding: 4rem 2rem 3rem;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.hana-hero .wp-block-cover__inner-container {
  max-width: 640px;
  margin: 0 auto;
}

.hana-hero h1,
.hana-hero .wp-block-heading {
  font-family: var(--font-serif);
  font-size: clamp(26px, 4vw, 36px);
  font-weight: 700;
  line-height: 1.65;
  color: var(--text-dark);
  margin-bottom: 1rem;
}

.hana-hero p {
  font-size: 14px;
  color: var(--warm-gray);
  line-height: 1.9;
  margin-bottom: 2rem;
}

/* 統計バー */
.hana-stats {
  display: flex;
  justify-content: center;
  gap: 3rem;
  margin-top: 2rem;
  flex-wrap: wrap;
}

.hana-stat {
  text-align: center;
}

.hana-stat-num {
  font-family: var(--font-serif);
  font-size: 28px;
  font-weight: 700;
  color: var(--rose-deep);
  display: block;
}

.hana-stat-label {
  font-size: 11px;
  color: var(--warm-gray);
  letter-spacing: 0.05em;
  display: block;
  margin-top: 2px;
}

/* ===== Section / Page Layout ===== */
.wp-block-post-content,
.entry-content,
.wp-block-group.is-layout-constrained {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  padding: 2rem 1.5rem;
}

/* ===== Category Pills ===== */
.hana-pills {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}

.hana-pill {
  padding: 8px 20px;
  border-radius: 24px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  border: 1px solid var(--rose-border);
  background: #fff;
  color: var(--text-mid);
  transition: all 0.2s ease;
  display: inline-block;
}

.hana-pill:hover,
.hana-pill.is-active {
  background: var(--rose-deep);
  color: #fff;
  border-color: var(--rose-deep);
  text-decoration: none;
}

/* ===== Article / Post Cards ===== */
.wp-block-post-template {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 16px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.wp-block-post {
  background: #fff;
  border-radius: 12px;
  border: 1px solid var(--rose-border);
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.wp-block-post:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(212, 118, 138, 0.12);
}

.wp-block-post .wp-block-post-featured-image img {
  width: 100%;
  height: 160px;
  object-fit: cover;
  display: block;
}

/* アイキャッチなしのカードプレースホルダー */
.wp-block-post .wp-block-post-featured-image:not(:has(img)) {
  height: 140px;
  background: var(--rose-light);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 48px;
}

.wp-block-post .wp-block-post-title a {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-dark) !important;
  line-height: 1.6;
  display: block;
  padding: 12px 16px 4px;
  text-decoration: none;
}

.wp-block-post .wp-block-post-title a:hover {
  color: var(--rose-deep) !important;
}

/* カテゴリ表示 */
.wp-block-post .wp-block-post-terms {
  font-size: 10px;
  color: var(--rose-deep);
  font-weight: 500;
  letter-spacing: 0.08em;
  padding: 4px 16px;
  text-transform: uppercase;
}

/* 日付・メタ */
.wp-block-post .wp-block-post-date {
  font-size: 11px;
  color: var(--warm-gray);
  padding: 4px 16px 14px;
  display: block;
}

/* ===== Featured / Special Post Banner ===== */
.hana-featured {
  background: #fff;
  border: 1px solid var(--rose-border);
  border-radius: 16px;
  padding: 1.5rem 2rem;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 2rem;
  transition: box-shadow 0.2s;
}

.hana-featured:hover {
  box-shadow: 0 6px 24px rgba(212, 118, 138, 0.1);
}

.hana-featured-icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: var(--rose-light);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 36px;
  flex-shrink: 0;
}

.hana-featured-label {
  font-size: 10px;
  color: var(--rose-deep);
  font-weight: 500;
  letter-spacing: 0.12em;
  margin-bottom: 6px;
  text-transform: uppercase;
}

.hana-featured-title {
  font-family: var(--font-serif);
  font-size: 17px;
  font-weight: 700;
  color: var(--text-dark);
  line-height: 1.6;
  margin-bottom: 8px;
}

.hana-featured-desc {
  font-size: 12px;
  color: var(--warm-gray);
  line-height: 1.8;
}

/* ===== Section Heading ===== */
.hana-section-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 1.5rem;
  padding-bottom: 0.5rem;
}

.hana-section-head h2,
.hana-section-head .section-title {
  font-family: var(--font-serif);
  font-size: 18px;
  font-weight: 700;
  color: var(--text-dark);
  white-space: nowrap;
}

.hana-section-head::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--rose-border);
  margin-left: 12px;
}

/* ===== Sidebar Widgets ===== */
.widget,
.wp-block-group.hana-widget {
  background: #fff;
  border: 1px solid var(--rose-border);
  border-radius: 12px;
  padding: 1.25rem;
  margin-bottom: 1rem;
}

.widget-title,
.wp-block-group.hana-widget h3 {
  font-family: var(--font-serif);
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 1rem;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--rose-border);
}

/* タグクラウド */
.wp-block-tag-cloud a {
  background: var(--rose-light);
  color: var(--rose-deep) !important;
  border: none;
  border-radius: 16px;
  padding: 4px 14px;
  font-size: 12px !important;
  font-weight: 500;
  display: inline-block;
  margin: 3px;
  transition: background 0.2s;
}

.wp-block-tag-cloud a:hover {
  background: var(--rose-deep);
  color: #fff !important;
  text-decoration: none;
}

/* カテゴリリスト */
.wp-block-categories-list,
.wp-block-archives-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.wp-block-categories-list li,
.wp-block-archives-list li {
  border-bottom: 1px solid var(--rose-border);
  padding: 8px 0;
}

.wp-block-categories-list li a,
.wp-block-archives-list li a {
  font-size: 13px;
  color: var(--text-mid);
  display: flex;
  align-items: center;
  gap: 6px;
}

.wp-block-categories-list li a::before {
  content: '🌸';
  font-size: 11px;
}

/* ===== チェックリスト（カスタムHTMLブロック用） ===== */
.hana-checklist {
  list-style: none;
  padding: 0;
  margin: 0;
}

.hana-checklist li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid #F5ECEE;
  font-size: 13px;
  color: var(--text-mid);
}

.hana-check {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1.5px solid var(--rose-border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 11px;
}

.hana-check.done {
  background: var(--rose-deep);
  border-color: var(--rose-deep);
  color: #fff;
}

/* ===== タイムライン（カスタムHTMLブロック用） ===== */
.hana-timeline {
  list-style: none;
  padding: 0;
  margin: 0;
}

.hana-timeline li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
  font-size: 13px;
  color: var(--text-mid);
  line-height: 1.7;
}

.hana-step {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--rose-deep);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 1px;
}

/* ===== Single Post ===== */
.single .entry-header {
  text-align: center;
  padding: 3rem 2rem 2rem;
  background: #fff;
  border-bottom: 1px solid var(--rose-border);
  margin-bottom: 2rem;
}

.single .entry-title,
.single h1.wp-block-post-title {
  font-family: var(--font-serif);
  font-size: clamp(22px, 3.5vw, 32px);
  font-weight: 700;
  line-height: 1.65;
  color: var(--text-dark);
  margin-bottom: 1rem;
  max-width: 740px;
  margin-left: auto;
  margin-right: auto;
}

.single .wp-block-post-terms {
  display: inline-block;
  background: var(--rose-light);
  color: var(--rose-deep);
  font-size: 11px;
  font-weight: 500;
  padding: 4px 14px;
  border-radius: 16px;
  letter-spacing: 0.06em;
  margin-bottom: 1rem;
}

/* 本文 */
.single .entry-content p,
.single .wp-block-post-content p {
  font-size: 15px;
  line-height: 2;
  color: var(--text-dark);
  margin-bottom: 1.5rem;
}

.single .entry-content h2,
.single .wp-block-post-content h2 {
  font-family: var(--font-serif);
  font-size: 20px;
  font-weight: 700;
  color: var(--text-dark);
  margin: 2.5rem 0 1rem;
  padding-left: 14px;
  border-left: 4px solid var(--rose-deep);
}

.single .entry-content h3,
.single .wp-block-post-content h3 {
  font-family: var(--font-serif);
  font-size: 17px;
  font-weight: 700;
  color: var(--text-dark);
  margin: 2rem 0 0.8rem;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--rose-border);
}

/* 引用・ポイントボックス */
.single .wp-block-pullquote,
.single blockquote {
  background: var(--rose-light);
  border-left: 4px solid var(--rose-deep);
  border-radius: 0 8px 8px 0;
  padding: 1rem 1.5rem;
  margin: 2rem 0;
  font-style: normal;
  color: var(--text-mid);
}

/* ポイントボックス（カラーブロック） */
.wp-block-group.hana-point-box {
  background: var(--sage-light);
  border: 1px solid var(--sage);
  border-radius: 12px;
  padding: 1.5rem;
  margin: 2rem 0;
}

.wp-block-group.hana-notice-box {
  background: var(--rose-light);
  border: 1px solid var(--rose);
  border-radius: 12px;
  padding: 1.5rem;
  margin: 2rem 0;
}

/* ===== Buttons ===== */
.wp-block-button__link,
.wp-element-button {
  background-color: var(--rose-deep) !important;
  color: #fff !important;
  border-radius: 24px !important;
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 10px 28px !important;
  border: none !important;
  transition: background 0.2s ease !important;
}

.wp-block-button__link:hover,
.wp-element-button:hover {
  background-color: #C2607A !important;
  text-decoration: none !important;
}

/* アウトラインボタン */
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent !important;
  color: var(--rose-deep) !important;
  border: 2px solid var(--rose-deep) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--rose-light) !important;
}

/* ===== Badges / Tags ===== */
.hana-badge {
  display: inline-block;
  padding: 3px 12px;
  border-radius: 14px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.04em;
}

.hana-badge-new    { background: var(--rose-deep); color: #fff; }
.hana-badge-pop    { background: var(--gold);      color: #fff; }
.hana-badge-cat    { background: var(--rose-light); color: var(--rose-deep); }
.hana-badge-sage   { background: var(--sage-light); color: #3D6B38; }

/* ===== Footer ===== */
.site-footer,
.wp-block-template-part.footer {
  background: var(--text-dark) !important;
  color: #C8B8BB !important;
  padding: 2.5rem 2rem 1.5rem !important;
  text-align: center;
}

.site-footer .wp-block-site-title a,
.wp-block-template-part.footer .wp-block-site-title a {
  font-family: var(--font-serif) !important;
  font-size: 18px !important;
  color: var(--rose) !important;
  font-weight: 700 !important;
}

.site-footer p,
.wp-block-template-part.footer p {
  font-size: 12px;
  color: #8A7E76;
  line-height: 1.8;
}

.site-footer a,
.wp-block-template-part.footer a {
  color: #8A7E76 !important;
  font-size: 12px;
  margin: 0 0.75rem;
}

.site-footer a:hover,
.wp-block-template-part.footer a:hover {
  color: var(--rose) !important;
}

/* フッター注意書き */
.hana-footer-disclaimer {
  font-size: 11px !important;
  color: #5F5058 !important;
  border-top: 1px solid #4A3A3D;
  padding-top: 1rem;
  margin-top: 1rem;
}

/* ===== Utility Classes ===== */
.text-rose   { color: var(--rose-deep); }
.text-sage   { color: #4A8A42; }
.text-center { text-align: center; }
.mt-0 { margin-top: 0; }
.mb-0 { margin-bottom: 0; }

/* ===== Responsive ===== */
@media (max-width: 768px) {
  .hana-featured {
    flex-direction: column;
    text-align: center;
  }

  .hana-stats {
    gap: 1.5rem;
  }

  .wp-block-post-template {
    grid-template-columns: 1fr !important;
  }

  .hana-pills {
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 4px;
  }

  .wp-block-group.is-layout-constrained {
    padding: 1rem;
  }
}
