/* ==========================================================================
   英雄区「大型背景图」轮播 —— 堆叠淡入
   由 page.html 输出 .hero--rot + [data-rot]，main.js 驱动切换。
   ========================================================================== */

.hero--rot .hero__media{ position:absolute; inset:0 }
.hero--rot .hero__media .hero__frame{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center 42%;
  opacity:0; animation:none;                 /* 关掉 layout.css 的 heroZoom，改由本文件控制 */
  transition:opacity 1500ms cubic-bezier(.22,1,.36,1);
  will-change:opacity;
}
.hero--rot .hero__media .hero__frame.is-on{ opacity:1 }

/* 进度指示：细横线，与全站 u-mono 标签语言一致 */
.hero__dots{
  position:absolute; right:var(--pad-x); bottom:clamp(72px,9vw,110px);
  display:flex; gap:8px; z-index:4;
}
.hero__dot{
  width:26px; height:2px; padding:0; border:0; cursor:pointer;
  background:rgba(244,241,234,.26);
  transition:background .45s var(--ease),transform .45s var(--ease);
}
.hero__dot:hover{ background:rgba(244,241,234,.6) }
.hero__dot.is-on{ background:var(--gold); transform:scaleY(1.6) }

/* 低配 / 减少动效：只显示第一张 */
@media(prefers-reduced-motion:reduce){
  .hero--rot .hero__media .hero__frame{ transition:none }
  .hero--rot .hero__media .hero__frame:not(.is-on){ display:none }
}
@media(max-width:900px){
  .hero__dots{ display:none }
}
