﻿/* =====================================================================
   钃夊煄宀侀泦 路 杞诲姩鏁堝眰
   鍙仛浣嶇Щ/閫忔槑搴?缂╂斁锛屼笉鏀瑰浐瀹氱増寮忥紱?shot=1 涓?reduced-motion 鍏ㄩ儴鍏抽棴
   ===================================================================== */

html.motion-on body {
  animation: mPageIn .55s cubic-bezier(.22, .8, .3, 1) both;
}
@keyframes mPageIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* 椤堕儴婊氬姩杩涘害 */
.m-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1200;
  width: 0;
  height: 2px;
  background: #ff5a1f;
  box-shadow: 0 0 10px rgba(255, 90, 31, .35);
  pointer-events: none;
  transition: width .12s linear;
}

/* 瀵艰埅婊氬姩鐘舵€?*/
.site-head.is-scrolled {
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 8px 30px rgba(17, 17, 17, .06);
}

/* 杩涘叆瑙嗗彛 */
.m-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity .8s cubic-bezier(.22, .8, .3, 1),
    transform .8s cubic-bezier(.22, .8, .3, 1);
  transition-delay: var(--m-delay, 0s);
  will-change: opacity, transform;
}
.m-reveal.in {
  opacity: 1;
  transform: translateY(0);
}

/* 鍥剧墖杞诲井鏀惧ぇ / 娴捣 */
.card-s__media,
.pdp__thumb,
.ext__thumb {
  overflow: hidden;
}
.card-s__media img,
.pdp__thumb img,
.ext__thumb {
  transition: transform .8s cubic-bezier(.22, .8, .3, 1);
}
.card-s:hover .card-s__media img,
.pdp__thumb:hover img {
  transform: scale(1.045);
}
.card-s {
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}

/* 鎸夐挳涓庢枃瀛楃澶?*/
.btn {
  transition: transform .25s ease, background-color .2s ease, color .2s ease, border-color .2s ease, box-shadow .25s ease;
}
.btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(17, 17, 17, .12);
}
.btn--line:hover {
  box-shadow: none;
}
.tlink .arw {
  display: inline-block;
  transition: transform .25s ease;
}
.tlink:hover .arw {
  transform: translateX(4px);
}
.brand__mark {
  transition: transform .45s cubic-bezier(.22, .8, .3, 1);
}
.brand:hover .brand__mark {
  transform: rotate(-6deg) scale(1.04);
}

/* 棣栧睆鍥剧墖鏋佽交娴姩 */
.hero__card img {
  animation: heroDrift 9s ease-in-out infinite alternate;
}
@keyframes heroDrift {
  from { transform: scale(1.005) translateY(0); }
  to { transform: scale(1.018) translateY(-5px); }
}

/* 鏀粯浜岀淮鐮佹壂鎻忕嚎 */
.pay-qr {
  position: relative;
  overflow: hidden;
}
.pay-layer.on .pay-qr::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  top: 16px;
  height: 2px;
  background: linear-gradient(90deg, transparent, #ff5a1f, transparent);
  box-shadow: 0 0 10px rgba(255, 90, 31, .45);
  animation: qrScan 2.2s ease-in-out infinite;
}
@keyframes qrScan {
  0% { transform: translateY(0); opacity: 0; }
  12% { opacity: 1; }
  88% { opacity: 1; }
  100% { transform: translateY(178px); opacity: 0; }
}

/* 鍥炲埌椤堕儴 */
.m-top {
  position: fixed;
  right: 26px;
  bottom: 88px;
  z-index: 1100;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid #e6e6e6;
  background: rgba(255, 255, 255, .92);
  color: #111;
  font: 500 16px/1 var(--sans);
  box-shadow: 0 8px 24px rgba(17, 17, 17, .08);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease, background-color .2s ease;
}
.m-top.on {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
.m-top:hover {
  background: #111;
  color: #fff;
  border-color: #111;
}

/* 鎵嬫満绔交閲忕増 */
@media (max-width: 500px) {
  .m-reveal { transform: translateY(16px); }
  .m-top { right: 16px; bottom: 88px; width: 38px; height: 38px; }
}

/* 鎴浘 / 鍑忓皯鍔ㄦ€?*/
html.is-shot body,
html.is-shot .m-reveal,
html.is-shot .hero__card img,
html.is-shot .pay-layer.on .pay-qr::after {
  animation: none !important;
  transition: none !important;
  opacity: 1 !important;
  transform: none !important;
}
html.is-shot .m-progress,
html.is-shot .m-top {
  display: none !important;
}
@media (prefers-reduced-motion: reduce) {
  html.motion-on body,
  .hero__card img,
  .pay-layer.on .pay-qr::after {
    animation: none !important;
  }
  .m-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  * {
    scroll-behavior: auto !important;
  }
}

html.motion-on{scroll-behavior:smooth;}


/* 设置里关闭动效 */
html.motion-off .m-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
html.motion-off .hero__card img, html.motion-off .pay-layer.on .pay-qr::after { animation: none !important; }
html.motion-off .m-progress, html.motion-off .m-top { display: none !important; }

/* 编辑条默认隐藏，?edit=1 才显示 */
html:not(.edit-on) .editbar { display: none !important; }
html.edit-on .editbar { display: flex !important; }
