/* =========================================================
   共通CSS（リセット・カラー変数・タイポグラフィ・共通パーツ）
   どのページ・どのセクションでも使う土台。
   ========================================================= */

/* ===== Reset ===== */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-padding-top: 72px; }

/* ===== カラー・変数 ===== */
:root{
  --green:#5a6e3a;
  --green-dark:#4a5b30;
  --green-light:#7a8b4f;
  --cream:#f6f3ea;
  --cream-2:#efe9da;
  --beige:#e8e2d2;
  --text:#3a3a33;
  --muted:#7d7d72;
}

html{ scroll-behavior:smooth; font-size:112.5%; }
body{
  font-family:"Noto Sans JP", sans-serif;
  color:var(--text);
  background:#fff;
  line-height:1.7;
}
a{ text-decoration:none; color:inherit; }
.serif{ font-family:"Noto Serif JP", serif; }

/* ===== Buttons ===== */
.btn-fill{
  display:inline-block;
  background:var(--green);
  color:#fff;
  padding:.7em 1.6em;
  border-radius:4px;
  font-size:.9rem;
  letter-spacing:.05em;
  transition:.25s;
}
.btn-fill:hover{ background:var(--green-dark); }
.btn-outline-dark{
  display:inline-flex; align-items:center; gap:.6em;
  background:var(--green);
  color:#fff;
  padding:.8em 1.8em;
  border-radius:4px;
  font-size:.95rem;
  letter-spacing:.08em;
  transition:.25s;
}
.btn-outline-dark:hover{ background:var(--green-dark); }
.btn-outline-dark span{ font-size:1.1em; }
.btn-contact{
  display:inline-flex; align-items:center; gap:.5rem;
  background:var(--green);
  color:#fff;
  padding:.7rem 1.4rem;
  border-radius:30px;
  font-size:.9rem;
  transition:.25s;
}
.btn-contact:hover{ background:var(--green-dark); }

/* ===== 共通レイアウト・見出しパーツ ===== */
.lp-section{ padding:3rem 2rem; }

/* セクション見出し行（縦線 + h2 の横並び。margin-bottom は各所で調整） */
.section-head{ display:flex; align-items:center; gap:.8rem; }

/* 白背景の角丸カード（年間スケジュール・FAQ・お問い合わせで共用） */
.section-card{
  max-width:1180px; margin:0 auto;
  background:#fff; border-radius:12px;
  box-shadow:0 4px 18px rgba(0,0,0,.06);
  padding:2rem 2.4rem 2.4rem;
}

/* ===== 空データ／取得エラー表示（在庫・お知らせ・品種・FAQ等で共通利用）
   グリッド内でも全幅を取り、枠なし・文字だけで中央に表示する ===== */
.empty-state{
  text-align:center; color:var(--muted); font-size:.92rem;
  padding:2rem 1rem; width:100%; grid-column:1 / -1;
}
.error-state{
  text-align:center; color:#a14343; font-size:.92rem;
  padding:2rem 1rem; width:100%; grid-column:1 / -1;
}

/* 各セクション見出しの左につく緑の縦線（在庫状況・農園紹介・お知らせ一覧モーダル等で共用） */
.stock-vline{ display:inline-block; width:4px; height:2.8rem; background:var(--green); border-radius:2px; flex-shrink:0; }

/* セクション見出し（h2）の共通サイズ階層 */
.section-heading-large,
.section-heading-medium,
.section-heading-small{
  font-family:"Noto Serif JP",serif;
  font-weight:600;
  letter-spacing:.06em;
  color:var(--green-dark);
}
.section-heading-large{ font-size:2rem; }
.section-heading-medium{ font-size:1.7rem; }
.section-heading-small{ font-size:1.4rem; letter-spacing:.1em; }

/* 本文テキストの共通サイズ階層 */
.body-text{ font-size:1.08rem; line-height:2; color:#4a4a40; }
.body-text-muted{ font-size:1.02rem; line-height:1.9; color:var(--muted); }
.body-text-small{ font-size:.96rem; line-height:1.8; color:var(--muted); }

/* 中央寄せの装飾付き見出し（梨の特徴 等） */
.section-title-center{
  font-family:"Noto Serif JP",serif; font-size:1.6rem;
  color:var(--green-dark); font-weight:600; letter-spacing:.08em;
  display:flex; align-items:center; justify-content:center; gap:1rem;
  margin-bottom:2.4rem;
}
.section-title-center .line{ width:50px; height:1px; background:var(--green-light); }

/* ===== レスポンシブ（複数セクション共通の上書き） ===== */
@media (max-width:600px){
  .lp-section{ padding:2rem 1rem; }
  /* schedule/faq/contact/varietiesのカード余白・見出しサイズ縮小 */
  .section-card{ padding:1.5rem 1.2rem 1.8rem; }
  #schedule h2, #faq h2, #contact h2, #varieties h2 { font-size:1.5rem !important; }
}
