.fire-hero {
  background: url(../img/fire-fv_img.png);
  background-repeat: no-repeat; /* ← リピートを止める */
  background-size: cover; /* ← 領域いっぱいに拡大(object-fit: cover の背景版) */
  background-position: center; /* ← 中央基準で表示 */
}

.sp-none {
  display: block;
}

@media (max-width: 980px) {
  .sp-none {
    display: none;
  }
}
@media (max-width: 485px) {
  .hero__deco {
    top: 189px;
  }
}
/* ============================================================
  薪ストーブの魅力
  =========================================================== */

.appeal {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 500px); /* oven の左右反転 */
  align-items: center;
  gap: clamp(40px, 4vw, 120px);
  padding: 150px 0;
  padding-right: max(20px, calc((100% - 1400px) / 2 + 20px));

  /* 左は0のまま=画像が画面左端にべったり */
}

.appeal__img {
  min-width: 0;
}

.appeal__img img {
  width: 100%;
  height: 100%;
  max-height: 559px;
  object-fit: cover;
}

.appeal__content {
  min-width: 0;
}

/* ---------- レスポンシブ ---------- */
@media (max-width: 980px) {
  .appeal {
    grid-template-columns: 1fr;
    gap: 0px;
    padding: 80px 0 0px;
    padding-right: 0;
  }
  /* ↓ 追加:表示順を入れ替え */
  .appeal__content {
    order: 1; /* テキストを先(上)に */
  }
  .appeal__content {
    padding: 0 20px;
  }

  .appeal__img {
    order: 2;
  }
}

/* ============================================================
  陽だまりの暖かさ
  =========================================================== */

.warmth__inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0px 20px 150px;
}

/* ---------- 2カラム(上下線+中央仕切り) ---------- */
.warmth__list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin-top: 80px;

  /* 上下の横線 */
  border-top: 1px solid var(--color-text);
  border-bottom: 1px solid var(--color-text);
}

.warmth__item {
  padding: 60px 50px;
  display: flex;
  flex-direction: column;
}
.warmth__list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin-top: 80px;
  border-top: 1px solid var(--color-text);
  border-bottom: 1px solid var(--color-text);
  position: relative; /* ← 追加:縦線の基準にする */
}

/* 中央の縦線(上下に40pxずつ隙間) */
.warmth__list::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 40px; /* ← 上の隙間 */
  bottom: 40px; /* ← 下の隙間 */
  width: 1px;
  background: var(--color-text);
}

/* ---------- 帯見出し(2色) ---------- */
.warmth__label {
  margin: 0;
  padding: 10px 24px;
  display: inline-block;
  color: var(--color-text-light);
  line-height: 1;
  font-weight: 400;
  font-size: clamp(1.8rem, 1.6vw, 2.4rem);
}

.warmth__label--gold {
  background: var(--color-accent); /* #C58B21 */
  width: 100%;
}

.warmth__label--brown {
  background: #4a2416; /* デザインの焦げ茶。ブランドカラー変数があれば差し替え */
  width: 100%;
}

/* ---------- 本文 ---------- */
.warmth__text {
  margin-top: 40px;
}

/* ---------- 図版 ---------- */
.warmth__figure {
  margin-top: auto; /* 残り空間を上に押しやり、図版を最下部へ */
  padding-top: 50px; /* 本文との最低限の間隔は確保 */
}

.warmth__figure img {
  width: 100%;
  height: auto;
}

/* ---------- レスポンシブ ---------- */
@media (max-width: 980px) {
  .warmth__inner {
    padding: 80px 20px 55px;
  }

  .warmth__list::before {
    content: none; /* ← これで縦線が消える */
  }

  .warmth__list {
    grid-template-columns: 1fr;
    margin-top: 0px;
    border-top: none;
    border-bottom: none;
  }
  .warmth__lead {
    padding-bottom: 25px;
  }
  .warmth__item {
    padding: 25px 0;
  }
}

/* ============================================================
焚きつけの楽しさ
  =========================================================== */

.joy-kindling {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 500px); /* oven の左右反転 */
  align-items: center;
  gap: clamp(60px, 4vw, 120px);
  padding: 0px 20px 150px 0;

  /* 左は0のまま=画像が画面左端にべったり */
}
.appeal__text {
  padding-bottom: 80px;
}

.joy-kindling__img {
  min-width: 0;
}

.joy-kindling__img img {
  width: 100%;

  height: 100%;
  max-height: 800px;
  object-fit: cover;
}

/* ---------- レスポンシブ ---------- */
@media (max-width: 980px) {
  .joy-kindling {
    grid-template-columns: 1fr;
    padding: 0px 0px 100px 0;
  }

  /* ↓ 追加:テキストを上、写真を下に */
  .joy-kindling__content {
    /* テキスト側のクラス名に合わせて */
    order: 1;
  }

  .joy-kindling__img {
    /* 画像側のクラス名に合わせて */
    order: 2;
  }
  .appeal__text {
    padding-bottom: 60px;
  }
  /* ↓ 追加:表示順を入れ替え */
  .appeal__content {
    order: 1; /* テキストを先(上)に */
  }
  .appeal__content {
    padding: 0 20px;
  }
}