/* 2026-09-27：插圖參與版面配置，避免被快速入口遮擋。 */
.hero {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,clamp(500px,43vw,650px));
  gap:clamp(20px,4vw,64px);
  min-height:0;
  padding-top:24px;
  padding-bottom:52px;
}
.hero .hero-copy { min-width:0; max-width:none; }
.hero .care-hero-image {
  display:block;
  position:relative;
  inset:auto;
  justify-self:center;
  width:100%;
  max-width:650px;
  height:auto;
  max-height:none;
  aspect-ratio:3 / 2;
  object-fit:contain;
  opacity:1;
  filter:none;
  z-index:1;
}
.site-update {
  display:flex;
  flex-wrap:wrap;
  gap:4px 20px;
  width:calc(100% - 48px);
  max-width:1552px;
  margin:16px auto 0;
  color:var(--muted);
  font-size:13px;
  line-height:1.7;
}
.site-update span { display:inline-flex; flex-wrap:wrap; gap:0 6px; }
.site-update time,.site-credit time { font-variant-numeric:tabular-nums; white-space:nowrap; }
.site-credit { flex-wrap:wrap; row-gap:6px; }
.site-credit .maker-credit { color:var(--text); font-size:13px; font-weight:700; letter-spacing:.03em; white-space:nowrap; }
body.map-mode > .site-update { display:none; }
@media(min-width:1200px) {
  .hero { grid-template-columns:minmax(0,1fr) minmax(0,min(54vw,800px)); gap:clamp(24px,3vw,48px); }
  .hero .care-hero-image { max-width:800px; }
}
@media(min-width:701px) and (max-width:1023px) {
  .hero { grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:24px; padding-bottom:48px; }
  .hero .care-hero-image { max-width:450px; }
}
@media(max-width:700px) {
  .hero { grid-template-columns:minmax(0,1fr); gap:12px; padding:22px 20px 40px; }
  .hero .care-hero-image { width:min(68vw,250px); max-width:100%; }
  .hero h1 { font-size:clamp(22px,5.5vw,28px); margin:0; }
  .hero .hero-copy p { margin-bottom:0; }
  .site-update { width:calc(100% - 24px); margin-top:12px; font-size:12px; gap:2px 16px; }
  .start-action { min-height:48px; }
  .data-guide summary { flex-wrap:wrap; row-gap:6px; }
}
@media print {
  .hero { display:block; }
  .hero .care-hero-image { display:none; }
}
