/* 动效层：滚动入场、悬停微交互、弹窗过渡；统一尊重 prefers-reduced-motion */
@media (prefers-reduced-motion: no-preference) {
  /* 1. 首图缓慢漂移，像墨在纸上呼吸 */
  .hero-art {
    animation: inkDrift 26s ease-in-out infinite alternate;
    will-change: transform;
  }
  @keyframes inkDrift {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to   { transform: translate3d(-1.4%, 0.9%, 0) scale(1.035); }
  }

  /* 2. 滚动入场 */
  [data-reveal] {
    opacity: 0;
    transform: translateY(10px);
    filter: blur(2px);
    transition: opacity 1.05s ease, transform 1.05s cubic-bezier(.2, .7, .3, 1), filter 1.05s ease;
    transition-delay: var(--reveal-delay, 0s);
  }
  [data-reveal].is-in {
    opacity: 1;
    transform: none;
    filter: none;
  }

  /* 3. 导航下划线像笔锋划出 */
  header nav a { position: relative; }
  header nav a::after {
    content: "";
    position: absolute;
    left: 0; right: 100%; bottom: -5px;
    height: 1px; background: #a54c38;
    transition: right .34s cubic-bezier(.3, .8, .3, 1);
  }
  header nav a:hover::after { right: 0; }

  /* 4. 按钮：箭头轻推 + 抬升 */
  .button { transition: background .22s, transform .22s, box-shadow .22s; }
  .button:hover { transform: translateY(-1px); box-shadow: 0 10px 22px #214e3f1f; }
  .button span { display: inline-block; transition: transform .26s cubic-bezier(.3, .8, .3, 1); }
  .button:hover span { transform: translateX(4px); }

  /* 5. 文字链接：墨色渐入 */
  .text-link, .header-cta { transition: color .22s, border-color .22s; }

  /* 6. 卡片：抬起 + 阴影 */
  .art-card { transition: transform .3s cubic-bezier(.2, .8, .3, 1), box-shadow .3s; }
  .art-card:hover { transform: translateY(-5px); box-shadow: 0 14px 30px #32472a14; }

  /* 7. 弹窗：淡入 + 微缩放 */
  dialog[open] { animation: dialogIn .34s cubic-bezier(.2, .85, .3, 1); }
  @keyframes dialogIn {
    from { opacity: 0; transform: translateY(14px) scale(.975); }
    to   { opacity: 1; transform: none; }
  }
  dialog::backdrop { animation: backdropIn .3s ease; }
  @keyframes backdropIn { from { opacity: 0; } to { opacity: 1; } }

  /* 8. 提示条：自下而上 */
  #toast { animation: toastIn .3s cubic-bezier(.2, .85, .3, 1); }
  @keyframes toastIn {
    from { opacity: 0; transform: translate(-50%, 14px); }
    to   { opacity: 1; transform: translate(-50%, 0); }
  }

  /* 9. 收尾段落的水墨动图背景 */
  .closing { position: relative; overflow: hidden; }
  .closing > * { position: relative; z-index: 1; }
  .closing::before {
    content: "";
    position: absolute;
    inset: -10% -5% auto auto;
    width: 62%; height: 130%;
    background: url(ink-loop.webp) center / contain no-repeat;
    opacity: .16;
    mix-blend-mode: screen;
    pointer-events: none;
    z-index: 0;
  }

  /* 10. 段落小标题的字距渐开 */
  .section-top .eyebrow, .eyebrow { transition: letter-spacing 1.2s ease; }
  [data-reveal].is-in .eyebrow { letter-spacing: 3.4px; }
}
