/* APOLLO TOWN 菊名 — 共通 styles.css の上に載せる街ごとの差分。
   主色は菊の山吹(黄土)。小さい文字にも使うので、紙の上で 4.5:1 を満たす濃さ(#96690C=4.81:1)にしてある。元の #A9780F は 3.86:1 で不足。識別子(セクション番号・エリア記号・区画番号)の朱色は共通のまま。 */
:root {
  --teal: #96690c;
  --teal-deep: #6b4a06;
  --teal-pale: #f7eed6;
  --sky: #dcebf2;
}
.about-section .section-index, .about-copy dt { color: #e6c46f; }
.site-footer nav a:hover { color: #e6c46f; }
.hero-status > .status-dot { box-shadow: 0 0 0 4px rgba(169,120,15,.15); }

/* ヒーロー: 妙蓮寺と同じ重ね方(空の上に俯瞰の街を multiply)。絵は Codex と作成(design-lab/hero/README.md)。 */
.hero--kikuna { background: #dcebf2; }
.hero-sky--kikuna { background-image: url("assets/hero-sky.webp"); }
.hero-art--kikuna {
  inset: 24% 0 0;
  height: 76%;
  object-position: 50% 100%;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 22%);
  mask-image: linear-gradient(to bottom, transparent 0, #000 22%);
}
.hero--kikuna .hero-copy { padding-top: 70px; }
.hero--kikuna .hero-kicker { margin-bottom: 40px; }
@media (max-width: 820px) {
  .hero-art--kikuna { inset: 38% -30% 0; width: 160%; height: 62%; object-position: 52% 100%; }
}
@media (max-width: 560px) {
  .hero-art--kikuna { inset: 44% -50% 0; width: 200%; height: 56%; }
  .hero--kikuna .hero-greeting { font-size: .84rem; }
}
.hero--kikuna .hero-kicker, .hero--kikuna h1 { color: #6b4a06; }