/* 動畫：慢、輕、不搶戲。節奏統一 0.7–1.1 秒、緩出、位移 12–16px、不彈跳。
   類別由 motion.js 加上；系統開了「減少動態效果」就全部不動。 */
:root {
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
}

@media (prefers-reduced-motion: no-preference) {
  /* 捲到才浮現 */
  .rv {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out);
    transition-delay: var(--d, 0ms);
  }
  .rv.in {
    opacity: 1;
    transform: none;
  }

  /* 標題下的金線：從中間往兩側畫開 */
  .rv-line {
    transform: scaleX(0);
    transition: transform 1.1s var(--ease-out) 0.25s;
  }
  .rv-line.in {
    transform: scaleX(1);
  }

  /* 首頁主視覺：文字依序淡入，宅院緩緩浮上、陰影漸深 */
  .hero-in {
    animation: rv-up 1.1s var(--ease-out) both;
    animation-delay: var(--d, 0ms);
  }
  .hero-house {
    animation: rv-house 1.6s var(--ease-out) 0.35s both;
  }
  @keyframes rv-up {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: none; }
  }
  @keyframes rv-house {
    from { opacity: 0; transform: translateY(28px); filter: drop-shadow(0 6px 8px rgba(37, 65, 87, 0)); }
    to { opacity: 1; transform: none; filter: drop-shadow(0 24px 28px rgba(37, 65, 87, 0.16)); }
  }

  /* 商品圖框：滑過時微微上浮、陰影變深 */
  .lift {
    transition: transform 0.6s var(--ease-out), box-shadow 0.6s var(--ease-out), border-color 0.6s var(--ease-out);
  }
  .lift:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 32px rgba(37, 65, 87, 0.1);
  }
}

/* 滑鼠點擊後不留藍色外框；鍵盤操作仍保留 */
a:focus:not(:focus-visible), button:focus:not(:focus-visible) {
  outline: none;
}