/* =========================================
   Sticky Header Shell (Hero固定)
   ========================================= */

.hero-sticky-shell {
  position: sticky;
  top: 0;
  z-index: 40;
  margin-top: 0;
  padding-top: max(6px, env(safe-area-inset-top));
  background:
    linear-gradient(
      180deg,
      rgba(241, 242, 246, 0.96) 0%,
      rgba(241, 242, 246, 0.92) 70%,
      rgba(241, 242, 246, 0.84) 100%
    );
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(20, 24, 34, 0.05);
}

/* heroの内側余白を少し整理（固定時に詰まりすぎない） */
.hero-sticky-shell .hero-title-row {
  margin-bottom: 6px;
}

.hero-sticky-shell .hero-sub {
  margin-bottom: 8px;
}

/* 選択中都道府県の下に少し余白 */
.hero-sticky-shell .selected-pref-wrap {
  margin-bottom: 8px;
}

/* スクロール時に見出しがヘッダーに隠れないように */
.section-title[id] {
  scroll-margin-top: 170px;
}

/* 画面幅ごとの微調整 */
@media (max-width: 640px) {
  .hero-sticky-shell {
    padding-top: max(4px, env(safe-area-inset-top));
  }

  .section-title[id] {
    scroll-margin-top: 160px;
  }
}