/* =============================================================
   motion-reduced.css — 動きを減らす設定のときの打ち消し
   media: (prefers-reduced-motion: reduce)
   -------------------------------------------------------------
   出典: 上流 components.css の @media (prefers-reduced-motion: reduce) 全ブロック（生成物）。
   CSS ファイル内に @media を書かず media 属性で読み分ける規約に従って切り出した。
   幅ではなくユーザー設定の軸なので bands/ には置かない。
   ============================================================= */

.tile-grid > .tile-photo { transition: none; }
.tile-grid > .tile-photo:is(:hover, :focus-within) {
  scale: none; box-shadow: var(--shadow-card);
}

.media-card { transition: none; }
.media-card:is(:hover, :focus-within) { scale: none; box-shadow: var(--shadow-card); }

.motion-ready :is(.tile-photo, .tile-utility) > .wrap > *,
.motion-ready .environment-quote-card > *,
.motion-ready .faq-group {
  opacity: 1; transform: none; transition: none; will-change: auto;
}
.motion-ready .card-row > .media-card,
.motion-ready .tile-grid > .tile-photo {
  opacity: 1; translate: none; transition: none; will-change: auto;
}
/* ヒーローの寄りも止める。動かない静止画として置く */
.motion-ready .tile-photo.is-hero > .tile-bg { animation: none; scale: 1; }
/* 複数枚のヒーローも回さない。1 枚目だけを出したまま動かさない */
.motion-ready .tile-photo.is-slideshow > .tile-bg { transition: none; }