/* Hallmark · macrostructure: Conversational FAQ (approved regional continuation) · tone: calm-playful-local · anchor hue: Setouchi blue
 * pre-emit critique: P5 H5 E5 S5 R5 V4 · genre: playful · theme: studied-DNA (source: approved Chugoku comp) · enrichment: generated regional hero
 * contrast: pass (40–41) · nav: preserved project chrome · footer: preserved · slop: pass (42–45)
 * honest: pass (46) · chrome: pass (47) · tokens: pass (48) · responsive: pass (34, 49, 50–57) · icons: pass (30)
 */
.water-heater-chugoku-page,
.water-heater-chugoku-page main{background:var(--color-page)}

.water-heater-chugoku-page .heater-hero{background:var(--color-setouchi-soft)}
.water-heater-chugoku-page .heater-hero-media{object-position:center}
.water-heater-chugoku-page .heater-hero-shade{background:linear-gradient(180deg,color-mix(in oklch,var(--color-page) 76%,transparent) 0%,color-mix(in oklch,var(--color-page) 28%,transparent) 48%,color-mix(in oklch,var(--color-setouchi-deep) 16%,transparent) 100%)}
.water-heater-chugoku-page .heater-area-label{border-color:var(--color-setouchi);color:var(--color-setouchi-deep)}
.water-heater-chugoku-page .heater-hero h1{color:var(--color-setouchi-deep)}

.heater-chugoku-area-card{width:clamp(11rem,19vw,15rem);border-color:var(--color-coast-sand-deep)}
.heater-area-card .heater-chugoku-map{display:block;width:100%;height:auto;aspect-ratio:635/646;object-fit:contain;border-radius:var(--radius-lg);background:var(--color-setouchi-soft)}
.heater-area-card .heater-chugoku-area-copy{display:grid;gap:var(--space-1);padding:var(--space-2) var(--space-1) 0;text-align:center}
.heater-chugoku-area-copy b{font-size:var(--text-base)}
.heater-chugoku-area-copy span{color:var(--color-setouchi-deep);font-size:.68rem;line-height:1.5}

.water-heater-chugoku-page .heater-reviews{background:var(--color-setouchi-soft)}
.water-heater-chugoku-page .heater-products{background:var(--color-coast-sand)}
.water-heater-chugoku-page .heater-symptoms{background:color-mix(in oklch,var(--color-coast-sand) 76%,var(--color-page))}
.water-heater-chugoku-page .heater-estimate{background:color-mix(in oklch,var(--color-setouchi-soft) 84%,var(--color-page))}
.water-heater-chugoku-page .heater-case-section--install{background:var(--color-coast-sand)}
.water-heater-chugoku-page .heater-case-section--repair{background:var(--color-setouchi-soft)}

.heater-region-cards{padding-block:var(--space-10);border-bottom:var(--rule);background:var(--color-setouchi-soft);color:var(--color-ink)}
.heater-region-cards .heater-section-heading p{margin-top:var(--space-2)}
.heater-prefecture-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--space-3);margin:var(--space-6) 0 0;padding:0;list-style:none}
.heater-prefecture-grid li{min-width:0}
.heater-prefecture-grid a{display:grid;grid-template-rows:7.5rem auto auto;min-width:0;min-height:13rem;overflow:hidden;border:1px solid var(--color-aqua);border-radius:var(--radius-md);background:var(--color-page);color:var(--color-setouchi-deep);text-decoration:none;box-shadow:0 5px 0 color-mix(in oklch,var(--color-setouchi) 20%,transparent);transition:border-color var(--dur-fast) var(--ease-out),transform 100ms var(--ease-out),box-shadow var(--dur-fast) var(--ease-out)}
.heater-prefecture-view{display:block;background-image:linear-gradient(180deg,color-mix(in oklch,var(--color-page) 4%,transparent),color-mix(in oklch,var(--color-setouchi-deep) 28%,transparent)),url("../assets/water-heater-chugoku-hero.webp");background-repeat:no-repeat;background-size:auto,340% auto;background-color:var(--color-setouchi-soft)}
.heater-prefecture-view--tottori{background-position:center,13% 63%}
.heater-prefecture-view--shimane{background-position:center,30% 58%}
.heater-prefecture-view--okayama{background-position:center,47% 64%}
.heater-prefecture-view--hiroshima{background-position:center,70% 62%}
.heater-prefecture-view--yamaguchi{background-position:center,90% 59%}
.heater-prefecture-grid b{padding:var(--space-3) var(--space-3) var(--space-1);font-size:var(--text-lg)}
.heater-prefecture-grid small{display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-3) var(--space-4);color:var(--color-muted);font-weight:700;white-space:nowrap}
.heater-prefecture-grid a:active{transform:translateY(1px)}

@media(hover:hover) and (pointer:fine){
  .heater-prefecture-grid a:hover{border-color:var(--color-setouchi);box-shadow:0 7px 0 color-mix(in oklch,var(--color-setouchi) 24%,transparent);transform:translateY(-2px)}
}

@media(max-width:64rem){
  .heater-prefecture-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media(max-width:52rem){
  .water-heater-chugoku-page .heater-hero-media{object-position:center}
  .heater-prefecture-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:40rem){
  .water-heater-chugoku-page .heater-hero-media{object-position:51% center}
  .heater-chugoku-area-card{width:9.5rem}
  .heater-area-card .heater-chugoku-area-copy{display:none}
  .heater-prefecture-grid a{grid-template-rows:6.25rem auto auto;min-height:11.75rem}
  .heater-prefecture-grid b{font-size:var(--text-base)}
  .heater-prefecture-grid small{font-size:.68rem}
}

@media(max-width:22rem){
  .heater-prefecture-grid{grid-template-columns:minmax(0,1fr)}
}

@media(prefers-reduced-motion:reduce){
  .heater-prefecture-grid a{transition-duration:0ms}
}