/*
  西宮市地域ページ A案テーマ
  正本の area-page.css は変更せず、西宮市ページの body クラス内だけで色を上書きします。
  レイアウト、サイズ、余白、CTA、機能は変更しません。
*/
body.area-theme-nishinomiya {
  --area-accent: #E29A6E;
  --area-accent-rgb: 226, 154, 110;
  --area-accent-deep: #8B563D;
  --area-soft: #F7E1D4;
  --area-pale: #FDF3EC;
  --area-footer-mid: #F7E6DC;
  --area-footer-end: #F1D4C4;
}

/* ヒーロー：市名下線 */
body.area-theme-nishinomiya .pc-city-underline,
body.area-theme-nishinomiya .sp-city-underline {
  background: linear-gradient(
    90deg,
    rgba(var(--area-accent-rgb), .58),
    rgba(var(--area-accent-rgb), .86),
    rgba(var(--area-accent-rgb), .56)
  ) !important;
  box-shadow: 0 8px 18px rgba(var(--area-accent-rgb), .14) !important;
}

/* ヒーローバッジ前の丸 */
body.area-theme-nishinomiya .pc-feature::before,
body.area-theme-nishinomiya .sp-mini-badge::before {
  background: rgba(var(--area-accent-rgb), .94) !important;
  box-shadow: 0 0 0 3px rgba(var(--area-accent-rgb), .18) !important;
}

/* AREA FEE 左上の淡い装飾 */
body.area-theme-nishinomiya .area-fee-card::before {
  background: rgba(var(--area-accent-rgb), .24) !important;
}

/* AREA FEE 無料バッジ */
body.area-theme-nishinomiya .area-fee-badge {
  background: linear-gradient(145deg, var(--area-soft) 0%, #ffffff 57%, #faf1df 100%) !important;
  box-shadow:
    0 18px 36px rgba(var(--area-accent-rgb), .17),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
  color: #2b4b65 !important;
}

/* 墓地紹介 02〜05の番号（大型メインカードの白い番号は正本どおり維持） */
body.area-theme-nishinomiya .cemetery-mini-card .cemetery-num {
  background: var(--area-soft) !important;
  color: var(--area-accent-deep) !important;
}

/* 料金目安下の案内カード：背景グラデーションと左の丸 */
body.area-theme-nishinomiya .area-price-note {
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.99) 0%, rgba(255,255,255,.72) 30%, transparent 57%),
    radial-gradient(circle at 92% 112%, rgba(var(--area-accent-rgb), .14) 0%, rgba(var(--area-accent-rgb), .055) 31%, transparent 59%),
    linear-gradient(180deg, #ffffff 0%, #fffdfc 50%, var(--area-pale) 100%) !important;
  border-color: rgba(var(--area-accent-rgb), .25) !important;
}
body.area-theme-nishinomiya .area-price-note::before {
  background:
    radial-gradient(circle at 34% 34%, rgba(255,255,255,.94) 0 24%, rgba(255,255,255,0) 25%),
    linear-gradient(145deg, var(--area-soft) 0%, var(--area-accent) 100%) !important;
  box-shadow: 0 0 0 6px rgba(var(--area-accent-rgb), .18) !important;
}
@media (min-width:768px) {
  body.area-theme-nishinomiya .area-price-note::before {
    box-shadow: 0 0 0 3px rgba(var(--area-accent-rgb), .20) !important;
  }
}
@media (max-width:767px) {
  body.area-theme-nishinomiya .area-price-note::before {
    box-shadow: 0 0 0 5px rgba(var(--area-accent-rgb), .20) !important;
  }
  /* スマホ：墓地紹介下の案内カード */
  body.area-theme-nishinomiya .area-cemetery-extra-note-a {
    background:
      radial-gradient(circle at 14% 0%, rgba(255,255,255,.99) 0%, rgba(255,255,255,.76) 30%, transparent 56%),
      radial-gradient(circle at 92% 112%, rgba(var(--area-accent-rgb), .13) 0%, rgba(var(--area-accent-rgb), .05) 30%, transparent 58%),
      linear-gradient(180deg, #ffffff 0%, #fffdfd 57%, var(--area-pale) 100%) !important;
  }
}

/* FAQ Q丸 */
body.area-theme-nishinomiya .area-faq summary::before {
  background: var(--area-soft) !important;
  color: var(--area-accent-deep) !important;
}

/* AREA FEE：スマホのみ「無料／西宮市エリア」バッジを少し下げる
   サイズ・文字・色は変更せず、absolute配置のbottom値だけを調整。 */
@media (max-width: 767px) {
  body.area-theme-nishinomiya .area-fee-badge {
    bottom: 10px !important;
  }
  body.area-theme-nishinomiya .area-fee-card::after {
    bottom: -9px !important;
  }
}

/* 地域ページ最下部のグラデーション
   尼崎市ページと同じ濃度・かけ方へ合わせ、色だけ西宮市A案に置換。 */
body.area-theme-nishinomiya .yui-area-site-footer {
  background:
    radial-gradient(circle at 16% 0%, rgba(255,255,255,.76) 0%, rgba(255,255,255,.36) 24%, transparent 46%),
    radial-gradient(circle at 88% 108%, rgba(var(--area-accent-rgb), .16) 0%, rgba(var(--area-accent-rgb), .07) 24%, transparent 48%),
    linear-gradient(180deg, #fffaf7 0%, #fcf2eb 52%, var(--area-footer-end) 100%) !important;
  border-top-color: rgba(var(--area-accent-rgb), .14) !important;
}


/* =========================================================
   Nishinomiya cemetery section final adjustment v4
   Scope: Nishinomiya page only.
   Goal:
   - PC: remove empty bottom space from 02-05 cards.
   - PC: keep 01 aligned to the total height of the right-side cards, but make it wider and less portrait-like.
   - SP: keep approved one-column 02-05 card layout.
   ========================================================= */

body.area-page--nishinomiya .area-cemetery-wrap {
  width: min(1500px, calc(100% - 32px)) !important;
}

body.area-page--nishinomiya .cemetery-final-layout {
  max-width: 1500px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body.area-page--nishinomiya .cemetery-showcase-grid {
  width: 100% !important;
  max-width: 1500px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.78fr) minmax(0, 1fr) minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  gap: 22px !important;
  align-items: stretch !important;
}

body.area-page--nishinomiya .cemetery-main-card {
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
  position: relative !important;
  height: 100% !important;
  min-height: 0 !important;
  display: block !important;
  overflow: hidden !important;
}

body.area-page--nishinomiya .cemetery-main-card > img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: 58% center !important;
  transform: none !important;
}

body.area-page--nishinomiya .cemetery-main-shade {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background:
    linear-gradient(180deg,
      rgba(10,22,35,.64) 0%,
      rgba(10,22,35,.40) 19%,
      rgba(10,22,35,.14) 40%,
      rgba(10,22,35,0) 62%),
    linear-gradient(180deg,
      rgba(10,22,35,0) 73%,
      rgba(10,22,35,.035) 100%) !important;
}

body.area-page--nishinomiya .cemetery-main-content {
  position: absolute !important;
  z-index: 2 !important;
  top: 22px !important;
  bottom: auto !important;
  left: 24px !important;
  right: 24px !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  transform: none !important;
}

body.area-page--nishinomiya .cemetery-main-content .cemetery-title-row {
  margin-bottom: 12px !important;
}

body.area-page--nishinomiya .cemetery-main-content p {
  max-width: 100% !important;
  margin-top: 0 !important;
  line-height: 1.92 !important;
}

/* PC: 02-05 cards should end near the text, not stretch downward. */
body.area-page--nishinomiya .cemetery-mini-card {
  height: auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-self: start !important;
  overflow: hidden !important;
}

body.area-page--nishinomiya .cemetery-mini-photo {
  height: auto !important;
  flex: 0 0 auto !important;
  aspect-ratio: 16 / 9 !important;
  overflow: hidden !important;
}

body.area-page--nishinomiya .cemetery-mini-photo img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  transform: none !important;
}

body.area-page--nishinomiya .cemetery-mini-body {
  flex: 0 0 auto !important;
  min-height: 0 !important;
  display: block !important;
  padding: 12px 18px 16px !important;
}

body.area-page--nishinomiya .cemetery-mini-body .cemetery-title-row {
  margin-bottom: 4px !important;
}

body.area-page--nishinomiya .cemetery-mini-body p {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  font-size: 13px !important;
  line-height: 1.68 !important;
  letter-spacing: .02em !important;
}

/* Smartphone: 01 full-width overlay; 02-05 full-width stacked cards. */
@media (max-width: 767px) {
  body.area-page--nishinomiya .area-cemetery-wrap {
    width: min(100% - 28px, 520px) !important;
  }

  body.area-page--nishinomiya .cemetery-showcase-grid {
    max-width: 520px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: none !important;
    gap: 16px !important;
    align-items: stretch !important;
  }

  body.area-page--nishinomiya .cemetery-main-card {
    grid-column: 1 !important;
    grid-row: auto !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 1 / 1.08 !important;
    display: block !important;
  }

  body.area-page--nishinomiya .cemetery-main-card > img {
    position: absolute !important;
    inset: 0 !important;
    height: 100% !important;
    object-position: 60% center !important;
  }

  body.area-page--nishinomiya .cemetery-main-shade {
    background:
      linear-gradient(180deg,
        rgba(10,22,35,.60) 0%,
        rgba(10,22,35,.36) 20%,
        rgba(10,22,35,.11) 40%,
        rgba(10,22,35,0) 60%),
      linear-gradient(180deg,
        rgba(10,22,35,0) 74%,
        rgba(10,22,35,.03) 100%) !important;
  }

  body.area-page--nishinomiya .cemetery-main-content {
    top: 18px !important;
    left: 18px !important;
    right: 18px !important;
    bottom: auto !important;
    padding: 0 !important;
    transform: none !important;
  }

  body.area-page--nishinomiya .cemetery-main-content p {
    max-width: 100% !important;
    font-size: 14px !important;
    line-height: 1.78 !important;
  }

  body.area-page--nishinomiya .cemetery-mini-card {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    align-self: stretch !important;
  }

  body.area-page--nishinomiya .cemetery-mini-photo {
    height: auto !important;
    flex: 0 0 auto !important;
    aspect-ratio: 4 / 3 !important;
  }

  body.area-page--nishinomiya .cemetery-mini-body {
    padding: 15px 16px 18px !important;
  }

  body.area-page--nishinomiya .cemetery-mini-body .cemetery-title-row {
    margin-bottom: 8px !important;
  }

  body.area-page--nishinomiya .cemetery-mini-body p {
    font-size: 13px !important;
    line-height: 1.76 !important;
  }
}



/* Nishinomiya mobile area-fee decoration lightening v1
   スマホ版のAREA FEE左上装飾だけを少し淡くする。PC版は変更しない。 */
@media (max-width: 767px) {
  body.area-theme-nishinomiya .area-fee-card::before {
    background: rgba(var(--area-accent-rgb), .15) !important;
  }
}


/* Nishinomiya PC flow step04 title alignment v2
   ご依頼の流れ04のみ、番号と見出しだけを少し下げる。
   金線・本文・スマホ表示・他ステップには影響させない。 */
@media (min-width: 768px) {
  body.area-page--nishinomiya .flow-card[data-step="04"] .flow-title-row {
    transform: translateY(9px) !important;
  }
}