@charset "utf-8";
/* 564379992@qq.com */
:root {
    --animation-primary: 0.4s cubic-bezier(0.4, 0, 0.2, 1); /* 缓动更自然 */
    --reversed-link-gap: min(100%, 1.35em); /* 下划线垂直偏移（适配响应式） */
    --primary: #705899;
    --primary-gradient: linear-gradient(90deg, #5b6ebf 0%, #825298 100%);
    --text-gray: #6e6e73;
    --border-color: #d2d2d7;
    --bg-gray: #f5f5f7;
    --price-old: #a1a1a6;
    --footer-bg: #232328;
    --footer-text: #86868b;
}
* { margin: 0; padding: 0; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); box-sizing: border-box; -webkit-box-sizing: border-box; }
body { padding: 0; padding-top:84px; font-family: "Microsoft Yahei","Helvetica Neue",Helvetica Neue,Helvetica,Arial,Lantinghei SC,Hiragino Sans GB,sans-serif,Times New Roman; font-size: 12px; color: #424242; position: relative; background: #fff; -webkit-text-size-adjust: none; }
ul, li, p, span, h1, h2, h3, h4, dl, dt, dd, form, input, textarea, select { margin: 0px; padding: 0px; }
input, textarea, select { color: #666; font-family: "Microsoft Yahei","Helvetica Neue",Helvetica Neue,Helvetica,Arial,Lantinghei SC,Hiragino Sans GB,sans-serif,Times New Roman; }
i, em { display: inline-block; font-style: normal; }
*:focus { outline: none }
img { max-width: 100%; }
ul, li { list-style-type: none; }
a { color: #424242; text-decoration: none; outline: none; transition: all 0.3s ease; }
a:hover { color: #765186; }
.clear { clear: both; content: ''; overflow: hidden; }
.fl { float: left; }
.fr { float: right; }
.wrap{ max-width:1262px; padding:0 12px; margin:0 auto; }

input[type=checkbox]{ -webkit-appearance:none; width:15px; height:15px; border-radius:2px; cursor:pointer; transition:all 0.3s ease; border:1px solid #ddd; background-position:2px 1px; vertical-align:-3px; margin-right:5px;}
input[type=checkbox]:hover{ border-color:#765186;}
input[type=checkbox]:checked{ background:#765186 url(../images/mem/gou.png) no-repeat 2px 2px; background-size:10px auto; border-color:#765186;}
input[type=radio]{ -webkit-appearance:none; width:16px; height:16px; border-radius:50%; position: relative; cursor:pointer; transition:all 0.3s ease; border:1px solid #ddd; background-position:center center; vertical-align:-3px; margin-right:5px;}
input[type=radio]:checked{  border-color:#765186;}
input[type=radio]:checked:after{ width:8px; height:8px; background:#765186; content:''; border-radius:50%; position: absolute; left:0; right:0; margin:auto; top:50%; transform: translateY(-50%);}
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color:#bfbfbf;}

/***按钮***/
.btn{ height:56px; padding:0 28px; cursor:pointer; border:0; background: linear-gradient( 270deg, #765186 25%, #495ABF 100%); position: relative; overflow: hidden;
    box-shadow: 0px 8px 32px 0px rgba(118,81,134,0.2); border-radius: 50em; color:#fff !important; font-size:16px; }
.btn img{ margin-left:5px; position: relative; transition: all 0.3s ease; position: relative; }
.btn span{ position: relative; z-index:2; }
.btn:hover{ box-shadow: 0px 8px 32px 0px rgba(118,81,134,0.4); }
.btn:hover img{ transform: translateX(-2px); z-index:2;}
.btn::after { content: ""; position: absolute; top:0;  left:0;  width: 0; height:100%; background: #000; transition: all 0.5s ease;}
.btn:hover::after { width:100%; }
.btn.b2{  border-radius: 999px; border: 3px solid transparent;  background: linear-gradient(#fff, #fff) padding-box, linear-gradient(135deg, rgba(74, 90, 191, 1), rgba(119, 82, 134, 1)) border-box; }
.btn.b2 span{-webkit-background-clip: text; color: transparent; background-image: linear-gradient(90deg, #6a4c93, #4361ee);}
.btn.b2:hover span{ background-image: linear-gradient(90deg, #fff, #fff); }
.btn.b2::after{ background:linear-gradient(135deg, rgba(74, 90, 191, 1), rgba(119, 82, 134, 1)); }

.flex{ display: flex; align-items: center;}
.center{ display: flex; justify-content: center; align-items: center; }
.between{ display: flex; justify-content: space-between; align-items: center; }
.flex-1{ flex:1; }
.line{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.line2{ word-break: break-all; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
/***下划线链接动画***/
.link-ani { text-decoration: none; cursor: pointer; background: linear-gradient(to left, currentColor, currentColor) 0 var(--reversed-link-gap) / 0 1px no-repeat;
    background-position-x: left; transition:background-size var(--animation-primary),color var(--animation-primary); }
.link-ani:hover{ background-size:100% 1px; }
/***输入框动画***/
.input-field{ position: relative;}
.input-field .place{ position: absolute; pointer-events: none; top:50%; transform: translateY(-50%); font-size:14px; color:#86909C; left:20px; transition:var(--animation-primary); }
.input-field .intxt:focus + .place{ transform: translateY(-130%); font-size:11px;}
.font-16{ font-size:16px;}
.font-14{ font-size:14px;}
.font-18{ font-size:18px;}
.text-main{ color:#765186;}
.text-black{ color:#1D2129;}
.text-gray{ color:#4E5969; }
.text-center{ text-align: center; }
.font-bold{ font-weight: bold; }

/***顶部***/
.header-inner{ position: fixed; width:100%; background:#fff; height:84px; top:0; left:0; z-index:22; box-shadow: rgba(0,0,0,0.03) 0 0 10px 0;}
.header-inner .wrap{ height: 100%; }
.header-inner .logo{ width:155px;}
.header-inner .logo img{ width:100%; }
.header-inner .nav li{ margin:0 6px;}
.header-inner .nav li > a{ position: relative; line-height:40px; display: block; overflow: hidden; height:40px;}
.header-inner .nav li > a span{ padding:0 20px;  height:100%; width:100%; display: block; border-radius: 50em; font-size:16px; color:#5D5D5B; transition: all 0.3s ease; }
.header-inner .nav li > a .s2{ position: absolute; left:0; top:0; transform: translateY(100%) scale(0.8); opacity:0; background:#765186; color:#fff; }
.header-inner .nav li > a:hover .s1{ transform: translateY(-10px) scale(0.7); }
.header-inner .nav li > a:hover .s2{ transform: translateY(0) scale(1); opacity:1; }
.header-inner .h-link a{ margin-left:24px; position: relative; }
.header-inner .h-link a:hover{ transform: scale(0.9); opacity:0.9; }
.header-inner .h-link img{ width:32px; height:32px;}
.header-inner .h-link a em{ padding:2px; position: absolute; right:-5px; top:-5px; font-size:11px; min-width:20px; height:20px; background:red; border-radius:50%; color:#fff;  }

/***banner图***/
.banner{ text-align: center; background:url(../images/banner-bg.png) no-repeat center center; background-size:cover; }
.banner .text{ padding-top:30px; }
.banner .text h2{ font-size:50px; font-family: Arial, sans-serif; font-weight:bold; -webkit-background-clip: text; color: transparent; background-image: linear-gradient(90deg, #6a4c93, #4361ee);}
.banner .text h2 span{ color:#000; }
.banner .text p{ font-size:20px; color:#666; margin-top:20px;}
.banner .timg{ margin-top:15px; }
.banner .timg img{ margin:0 15px; }
.banner .img{ display: block; max-width:700px; margin:0 auto;}

/***产品***/
.explore-products{ background:#F6F5F7;  overflow: hidden }
.title{ padding-bottom:30px; }
.title h2{ text-align: center; font-weight:bold; font-size:42px; color:#1D2129; }
.title p { max-width:505px; margin:0 auto; text-align: center; margin-top:15px; font-size:16px;}
.explore-products .button-prevnext{ cursor: pointer; width:82px; height:82px; background:#fff; border-radius:50%;}
.explore-products .button-prevnext img{ opacity:0.5; transition: all 0.3s ease; }
.explore-products .button-prevnext.prev{ transform: rotate(180deg); }
.explore-products .button-prevnext:hover { box-shadow: rgba(0,0,0,0.05) 0 0 20px 0; }
.explore-products .button-prevnext:hover img{ opacity:1; transform: scale(1.05) }
.explore-products .swiper{ flex:1; margin:0 32px; }
.explore-products .swiper-slide{ display: flex; align-items: center; }
.explore-products .swiper-slide .img{ max-width:550px; }
.explore-products .swiper-slide .text{ flex:1; flex-direction: column; align-items: flex-start;}
.explore-products .swiper-slide .text .price{ color:#765186; font-size:16px; }
.explore-products .swiper-slide .text h3 { font-size:40px; font-weight:bold; padding:12px 0; }
.explore-products .swiper-slide .text .sm{ font-size:16px; color:#666; line-height:24px; }
.explore-products .swiper-slide .text .pcolor{ margin-top:20px;}
.explore-products .swiper-slide .text .btn{ margin-top:20px; }
.explore-products .swiper-pagination-bullet{ width:50px; height:5px; border-radius:0; background:#D9D9D9; border-radius:5px;}
.explore-products .swiper-pagination-bullet.swiper-pagination-bullet-active{ background:#765186; }
.pcolor i{ width:20px; height:20px; cursor:pointer; margin-right:15px; border-radius:50%; box-shadow: inset 0px 1px 2px 0px rgba(0,0,0,0.4); }

.pd50{ padding:50px 0;}

/***适应场景***/
.scenes{ padding:50px 24px;}
.scenes .swiper{ width: 100%; margin: 0 auto; --gap: 24px; --rows: calc(50% - calc(var(--gap) / 2));}
@media screen and (max-width: 768px) {
   .scenes .swiper { height: 300px; --gap: 10px; --rows: calc(50% - calc(var(--gap) / 2)); }
}
.scenes .swiper .swiper-wrapper { display: flex; align-items: stretch; padding: 28px 0; }
.scenes .swiper .slide_1 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: var(--rows) var(--rows); gap: var(--gap); height: auto; }
.scenes .swiper .slide_2 { display: grid; grid-template-columns: 1fr; grid-template-rows: var(--rows) var(--rows); gap: var(--gap); height: auto; }
.scenes .swiper .slide_3 { display: grid; grid-template-columns: var(--rows) var(--rows); grid-template-rows: 1rf; gap: var(--gap); height: auto; }
.scenes .swiper .slide_single { height: auto; }
.scenes .swiper img { height: 100%; -o-object-fit: cover; cursor:pointer; object-fit: cover; width: 100%; border-radius:20px; }
.scenes .swiper .swiper-scrollbar-drag { display: block !important; cursor: pointer; }

/**features***/
.features{ background:#F6F5F7; }
.features ul{ display: grid; grid-template-columns: repeat(3, 1fr); gap:40px;}
.features ul li{ background:#fff; border-radius:20px; padding:40px; transition: all 0.5s ease; }
.features ul li .img{ width:72px; height:72px; display: flex; align-items: center; justify-content: center; border-radius:50%; background:#F6F5F7; }
.features ul li .img img{ width:40px;}
.features ul li h3{ font-size:18px; font-weight:bold; margin-top:20px; transition: all 0.5s ease;}
.features ul li p{ font-size:14px; color:#666; margin-top:15px; line-height:20px; transition: all 0.5s ease;}
.features ul li:hover{ box-shadow: rgba(0,0,0,0.1) 0 0 20px 0; transform: translateY(-10px); }
.features ul li:hover h3{ transform: translateY(-5px);}
.features ul li:hover p{ transform: translateY(-5px); transition-delay: 0.1s; }

/***lovedby***/
.lovedby{ }
.lovedby .swiper{ padding-bottom:40px; }
.lovedby .swiper .swiper-slide .swiper-con{ display: grid; grid-template-columns: repeat(3, 1fr); gap:40px;}
.lovedby .swiper .swiper-slide .card{ background:#fff; border-radius:20px; border:1px solid #ddd; overflow: hidden; }
.lovedby .swiper .swiper-slide .card .ht{ padding:22px; }
.lovedby .swiper .swiper-slide .card .ht .star{ display: flex; }
.lovedby .swiper .swiper-slide .card .ht .star img{ margin-right:5px; width:30px; height:30px;}
.lovedby .swiper .swiper-slide .card .ht .note{ font-size:16px; color:#4E5969; line-height:22px; margin-top:12px;}
.lovedby .swiper .swiper-slide .card .hm{ padding:22px; background:#f6f6f6; }
.lovedby .swiper .swiper-slide .card .hm img{ width:54px; height:54px; border-radius:50%; margin-right:12px;}
.lovedby .swiper .swiper-slide .card .hm .text{ flex:1;}
.lovedby .swiper .swiper-slide .card .hm .text h3{ font-size:18px; font-weight:bold; color:#1D2129;}
.lovedby .swiper .swiper-slide .card .hm .text p{ font-size:16px; color:#4E5969; margin-top:3px;}
.lovedby .swiper .swiper-pagination-bullet{ width:50px; height:5px; bottom:0; background:#D9D9D9; border-radius:5px;}
.lovedby .swiper .swiper-pagination-bullet.swiper-pagination-bullet-active{ background:#765186; }

/***adv***/
.simgift{ background:#f6f6f6;}
.simgift .text{ flex:1;}
.simgift .text h2{ font-size:38px; font-weight:bold; color:#1D2129; }
.simgift .text p{ font-size:16px; color:#4E5969; line-height:24px; margin-top:10px; max-width:500px; }

/***faq***/
.faq{}
.title.between h2{ text-align: left;}
.title a{ font-size:16px;}
.title a img{ width:16px; height:16px; margin-left:5px;}
.faqlist dl{ border-bottom:1px solid #ddd;}
.faqlist dl:nth-child(1){ border-top:1px solid #ddd;}
.faqlist dl dt{ padding:26px 0; display: flex; justify-content: center; align-items: center; cursor:pointer;}
.faqlist dl dt .tit{ flex:1; font-size:18px; font-weight:bold; color:#1D2129; }
.faqlist dl dt .opt{ width:30px; height:30px; margin-left:5px; }
.faqlist dl dt .opt img{ transition: all 0.3s ease;}
.faqlist dl dd{ font-size: 16px; color: #4E5969; line-height:24px; display:none; padding-bottom: 30px;  }
.faqlist dl.open dt .opt img{ transform: rotate(45deg);}
.faqlist dl dd .txt{ opacity:0; transition: all 0.3s ease; transform: translateY(10px) }
.faqlist dl.open dd .txt{ opacity:1; transform: translateY(0px); transition-delay: 0.2s; }

/***news***/
.newslist{ display: flex; flex-wrap: wrap; margin-left:-40px; }
.newslist li{ width: calc(100% / 3 - 40px); margin-left: 40px; }
.newslist li .pic{ width:100%; height:300px; overflow: hidden; border-radius:20px; }
.newslist li .pic img{ width:100%; height:100%; -o-object-fit: cover; object-fit: cover; transition: all 0.3s ease; }
.newslist li .date{ font-size:14px; color:#4E5969; margin-top:20px; }
.newslist li .date img{ width:16px; margin-right:5px;}
.newslist li h3{ font-size:18px; font-weight:bold; margin-top:15px; height:60px; color:#1a1a17; }
.newslist li p{ font-size:14px; color:#4E5969; line-height:22px; margin-top:12px; height:44px; }
.newslist li .readmore{ margin-top:18px; }
.newslist li .readmore span{ text-decoration: underline; font-weight: bold; font-size: 14px; color:#1a1a17;  }
.newslist li:hover .pic img{ transform: scale(1.1); }
.newslist li:hover h3{ color:#765186;}
.newslist li .readmore:hover span{ color:#765186;}

/***footer***/
.foot-three{ background:#F5F5F7; padding:50px 0;}
.foot-three ul{ display: flex; flex-wrap: wrap;}
.foot-three ul li{ flex:1; text-align: center; padding:0 30px; border-right:1px solid #ddd;}
.foot-three ul li:last-child{ border-right:none;}
.foot-three ul li img{ display: block; margin:0 auto; height:40px;}
.foot-three ul li h3{ font-size:16px; color:#1D2129; margin-top:15px;}
.foot-three ul li p{ font-size:13px; color:#4E5969; line-height:22px; margin-top:10px;}
.footer-columns{ background:#252127; padding:45px 0; }
.footer-columns .wrap{ display: flex; flex-wrap: wrap;}
.footer-columns .fl{ display: flex; flex:1; }
.footer-columns .fl .column{ flex:1; }
.footer-columns .fl .column ul li{ display: block; color:#86909C; margin-bottom:16px;}
.footer-columns .fl .column ul li a{ color:#86909C; font-size:14px;}
.footer-columns .fl .column ul li a:hover{ color:#fff; }
.footer-columns h4{ font-size:16px; color:#C9CDD4; font-weight: bold; padding-bottom:16px;}
.footer-columns .fcons{ width:400px; padding-left:100px; border-left:1px solid #3c3b3e;}
.footer-columns .fcons form{ position: relative; margin-bottom:40px; }
.footer-columns .fcons form .intxt{ border:0; height:48px; display: block; width:100%; font-size:14px; padding:15px 50px 0 20px; background:#fff; border-radius:48px; }
.footer-columns .fcons form .btn{ width:36px; padding:0; height:36px; cursor: pointer; border-radius:50%; border:0; position: absolute; right:10px; top:50%; transform: translateY(-50%); }
.footer-columns .fcons form .btn img{ margin:0; width:16px; height:16px; position: relative; z-index: 2;}
.follow-link{ margin-top:20px; display: flex;}
.follow-link a{ font-size:26px; color:#86909C; margin-right:30px;}
.follow-link a:hover{ color:#fff; }
.copyright{ background:#252127; padding:30px 0; text-align: center; color:#86909C; font-size:14px; border-top:1px solid #3c3b3e;}

/***products***/
.pro-top{ display: flex; margin-top:50px; overflow: hidden; }
.pro-top .pro-img{ flex:1; overflow: hidden; }
.pro-top .pro-img .main-swiper{ width:100%; overflow: hidden; border-radius:20px;}
.pro-top .pro-img .main-swiper .swiper-button-prev.swiper-button-disabled{ opacity:0; }
.pro-top .pro-img .main-swiper .swiper-button-next.swiper-button-disabled{ opacity:0; }
.pro-top .pro-img .main-swiper .swiper-button-next{ transition: all 0.3s ease; background:#fff; width:45px; height:45px; border-radius:50%; opacity:0;}
.pro-top .pro-img .main-swiper .swiper-button-prev{ transition: all 0.3s ease; background:#fff; width:45px; height:45px; border-radius:50%; opacity:0;}
.pro-top .pro-img .main-swiper .swiper-button-prev:hover{ background:#000; }
.pro-top .pro-img .main-swiper .swiper-button-next:hover{ background:#000; }
.pro-top .pro-img .main-swiper .swiper-button-prev:hover:after{ color:#fff; }
.pro-top .pro-img .main-swiper .swiper-button-next:hover:after{ color:#fff; }
.pro-top .pro-img .main-swiper:hover .swiper-button-next{ opacity:1; }
.pro-top .pro-img .main-swiper:hover .swiper-button-prev{ opacity:1; }
.pro-top .pro-img .main-swiper:hover .swiper-button-prev.swiper-button-disabled{ opacity:0.5;}
.pro-top .pro-img .main-swiper:hover .swiper-button-next.swiper-button-disabled{ opacity:0.5;}
.pro-top .pro-img .main-swiper .swiper-button-prev:after{ font-size:15px; color:#333;  }
.pro-top .pro-img .main-swiper .swiper-button-next:after{ font-size:15px; color:#333;  }
.pro-top .pro-img .main-swiper .swiper-slide img{width: 100%; height: 100%; object-fit: cover; }
.pro-top .pro-img .thumb-swiper{ height:90px; margin-top:30px;}
.pro-top .pro-img .thumb-swiper .swiper-slide{ border:2px solid #fff; transition:border 0.5s ease; position: relative; cursor:pointer; width:90px; height:90px; border-radius:10px; overflow: hidden;}
.pro-top .pro-img .thumb-swiper .swiper-slide.active{ border:2px solid #765186; }
.pro-top .pro-img .thumb-swiper .swiper-slide img{ width: 100%; height: 100%; object-fit: cover;}
.pro-top .pro-img .thumb-swiper .swiper-button-prev.swiper-button-disabled{ opacity:0; }
.pro-top .pro-img .thumb-swiper .swiper-button-next.swiper-button-disabled{ opacity:0; }
.pro-top .pro-img .thumb-swiper .swiper-button-next{ background:rgba(255,255,255,0.8); height:100%; top:0; margin:0; right:0;}
.pro-top .pro-img .thumb-swiper .swiper-button-prev{ background:rgba(255,255,255,0.8); height:100%; top:0; margin:0; left:0;}
.pro-top .pro-img .thumb-swiper .swiper-button-next:after,.pro-top .pro-img .thumb-swiper .swiper-button-prev:after{ font-size:15px; color:#333;  }
.pro-top .pro-info{ margin-left:60px; width:450px;}
.pro-top .pro-info .pstar img{ width:24px; height:24px; margin-right:3px;}
.pro-top .pro-info .pstar b{ font-size:18px; color:#1D2129; padding-left:5px;}
.pro-top .pro-info .pstar a{ font-size:16px; color:#4E5969;}
.pro-top .pro-info h1{ font-size:40px; color:#1D2129; padding:15px 0 20px 0;}
.pro-top .pro-info .p1{ font-size:18px; color:#765186; }
.pro-top .pro-info .note{ font-size:16px; color:#4E5969; line-height:24px; margin-top:20px; }
.pro-top .pro-info .choose-color{ margin-top:30px;}
.pro-top .pro-info .choose-color .pt{ font-size:14px; color:#4E5969;}
.pro-top .pro-info .choose-color .pt b{ color:#1D2129;}
.pro-top .pro-info .choose-color .color{ display: flex; margin-top:12px;}
.pro-top .pro-info .choose-color .color i{ margin-right:30px; border-radius:50%; cursor:pointer; width:42px; height:42px; border:2px solid #fff; display: flex; align-items: center; justify-content: center;}
.pro-top .pro-info .choose-color .color i em{ box-shadow: inset 0px 1px 2px 0px rgba(0,0,0,0.4); content:''; width:30px; height:30px; border-radius:50%;}
.pro-top .pro-info .choose-color .color i.active{ border:2px solid #765186;}
.pro-top .pro-info .choose-color dl{ margin-top:12px;}
.pro-top .pro-info .choose-color dl dd{ cursor: pointer; transition: all 0.3s ease; border-radius:12px; border:1px solid #e5e6eb; min-height:80px; padding:10px 30px; margin-top:16px;}
.pro-top .pro-info .choose-color dl dd b{ font-size:20px; color:#1D2129;}
.pro-top .pro-info .choose-color dl dd .pl p{ font-size:16px; margin-top:3px; color:#4E5969;}
.pro-top .pro-info .choose-color dl dd .pr i{ font-size:18px; color:#86909C; text-decoration: line-through; padding-right:10px;}
.pro-top .pro-info .choose-color dl dd.active{ border:2px solid #765186; background:#f6f5f7;}
.pro-top .pro-info .pro-btn{ margin-top:30px; margin-left:-22px; }
.pro-top .pro-info .pro-btn .btn{ flex:1; height:66px; margin-left:22px; font-size:18px; font-weight: bold;}
.pro-top .pro-info .pro-ser{ margin-top:30px;}
.pro-top .pro-info .pro-ser dl{ border-bottom:1px solid #eee; }
.pro-top .pro-info .pro-ser dl:nth-child(1){ border-top:1px solid #eee;}
.pro-top .pro-info .pro-ser dl dt{ height:65px; padding:0 15px; cursor: pointer; }
.pro-top .pro-info .pro-ser dl dt .t img{ width:24px; height:24px; margin-right:15px; }
.pro-top .pro-info .pro-ser dl dt .t b{ font-size:14px; color:#1D2129; font-weight: bold;}
.pro-top .pro-info .pro-ser dl dt .opt img{ width:25px; height:25px; transition: all 0.3s ease; }
.pro-top .pro-info .pro-ser dl dd{ display: none; font-size:12px; line-height:20px; color:#999; padding:0px 15px 20px 15px;}
.pro-top .pro-info .pro-ser dl.open dt .opt img{ transform: rotate(45deg);}
.pro-top .pro-info .pro-ser dl dd .txt{ opacity:0; transition: all 0.3s ease; transform: translateY(10px) }
.pro-top .pro-info .pro-ser dl.open dd .txt{ opacity:1; transform: translateY(0px); transition-delay: 0.2s; }

.pro-content{ font-size:15px; color:#1a1a17; line-height:25px; padding:50px 0; }
.pro-content img{ display: block; width:100%;}

.scenes2{ padding:50px 0;}
.scenes2 .swiper{ overflow: hidden; padding-bottom:40px;}
.scenes2 .swiper-wrapper{ height:100%;  display: flex; align-items: stretch;}
.scenes2 .swiper-wrapper .swiper-slide{aspect-ratio: 3/3.2; overflow: hidden;}
.scenes2 .swiper-wrapper .swiper-slide img{ width:100%; height:100%; object-fit: cover;}

/***技术规格***/
.techspec{ background:#F6F5F7;}
.techspec .tech-con{ background:#fff; padding:40px; border-radius:20px; display: grid; grid-template-columns: repeat(2, 1fr); gap:0 40px; }
.techspec .tech-con dl{ height:79px; border-bottom:1px solid #eee; }
.techspec .tech-con dl dt{ font-size: 16px; color:#4E5969;}
.techspec .tech-con dl dd{ font-size: 16px; font-weight: bold; color:#1D2129;}

/***evalute***/
.evalute-box .evalute-point{ background:#F6F5F7; border-radius:20px; padding:30px; display: flex; }
.evalute-box .evalute-point .fl{ flex:1; text-align: center; font-size:16px; color:#4E5969; border-right:1px solid #e9e9e9; }
.evalute-box .evalute-point .fl b{ font-size:40px; font-weight: bold;}
.evalute-box .evalute-point .fl .evstar{ padding:25px 0;}
.evalute-box .evalute-point .fl .evstar img{ width:24px; height:24px; margin:0 2px; }
.evalute-box .evalute-point .fr{ flex:1; flex-direction: column;}
.evalute-box .evalute-point .fr dd{ margin:3px 0; display: flex; align-items: center; font-size:18px; color:#1D2129;}
.evalute-box .evalute-point .fr dd img{ width:24px; height:24px; margin:0 5px;}
.evalute-box .evalute-point .fr dd .bar{ width:200px; height:8px; background: #D9D9D9; border-radius:8px; overflow: hidden; position: relative; margin-right:10px;}
.evalute-box .evalute-point .fr dd .bar i{ position: absolute; left:0; height:100%; background-color: #F19E39;}
.evalute-box .evalute-point .fr dd span{ min-width:50px;}

.evalute-list{ margin-top:20px;}
.evalute-list .item{ border-bottom:1px solid #eee; padding:25px 0;}
.evalute-list .item .evstar{ display: flex;}
.evalute-list .item .evstar img{ width:30px; height:30px; margin-right:5px; }
.evalute-list .item .evalute-user{ margin-top:15px;}
.evalute-list .item .evalute-user img{ width:54px; height:54px; border-radius:50%; margin-right:15px;}
.evalute-list .item .evalute-user p b{ font-size:18px; color:#1D2129;}
.evalute-list .item .evalute-user p:nth-child(2){ margin-top:5px; font-size:16px; color:#4E5969;}
.evalute-list .item h3{ font-size:18px; color:#1D2129; margin-top:10px; }
.evalute-list .item .evalute-content{ font-size:16px; color:#4E5969; line-height:25px; margin-top:10px; }

/***contact***/
.bggray{ background:#f5f5f7;}
.contact-con{ text-align: center; padding:50px 0 10px 0;}
.contact-con h1{ font-size:64px; color:#1D2129;}
.contact-con .text{ font-size:16px; color:#4E5969; margin-top:20px; line-height:28px;}

.contact-list{ display: flex; flex-wrap: wrap; margin-left:-30px;}
.contact-list .item{ transition: all 0.3s ease; text-align: center; padding:30px 12px; background:#fff; border-radius:20px; margin-top:30px; width: calc(100% /4 - 30px); margin-left:30px;}
.contact-list .item .icon{ width:72px; height:72px; background:#F6F3F8; border-radius:50%; margin:0 auto; font-size:35px; color:#765186;}
.contact-list .item .p2{ padding:30px 0 10px 0;}
.contact-list .item .p2 b{ font-size:16px; color:#1D2129; }
.contact-list .item .p3{  font-size:14px; color:#4E5969;}
.contact-list .item:hover{ box-shadow:rgba(0,0,0,0.1) 0 0 20px; background:#765186; transform: translateY(-10px); }
.contact-list .item:hover .p2 b{ color:#fff;}
.contact-list .item:hover .p3{ color:#fff;}

.contact_map{ margin-top:40px; border-radius:20px; padding:22px; background:#fff;}
.contact_map .tit{ font-size:22px; text-align: center; color:#1D2129;}
.contact_map #map{ width:100%; height:300px; margin-top:25px;}
.contact_map .sm{ margin-top:20px; font-size:16px; color:#4E5969; }

.book{ margin-top:40px; border-radius:20px; padding:40px; background:#fff;}
.book .tit{ font-size:22px; text-align: center; color:#1D2129; margin-bottom:25px;}
.book ul{ margin-left:-25px; }
.book ul li{ margin-bottom:25px; flex:1; margin-left:25px;}
.book ul li .pt{ font-size:15px; color:#303133;}
.book ul li .intxt{ transition: all 0.3s ease; height:46px; border:1px solid #DCDFE6; border-radius:6px; margin-top:10px; padding:0 17px; font-size:14px; display: block; width:100%;}
.book ul li .intxt.te{ height:140px; padding:12px 17px;}
.book ul li .intxt:hover{ border-color:#765186; box-shadow:#f4daff 0 0 12px 0; }
.book .btn{ width:100%;}

/***news***/
.new-tit{ padding:70px 0 45px 0;}
.new-tit h2{ font-size:64px; line-height:64px;}
.new-tit p{ margin-top:30px; }
.h50{ height:50px; }

.news-detop{ position: relative; overflow: hidden; height:400px; }
.news-detop .img{ display: block; filter: brightness(0.6); width:100%; height:100%; object-fit: cover; position: absolute; left:0; top:0; }
.news-detop .return{ opacity:0.8; font-size:14px; width:156px; height:40px; border-radius:40px; border:1px solid #fff; color:#fff;}
.news-detop .return:hover{ opacity:1;}
.news-detop .wrap{ position: relative; z-index:2; flex:1; }
.news-detop .date-user{ margin-top:20px; color:#fff; font-size:14px; }
.news-detop .date-user i{ margin-right:5px; }
.news-detop .date-user .fg{ margin:0 12px; height:10px; background:#fff; width:1px; }
.news-detop h1{ color:#fff; font-size:48px; margin-top:20px; }

.news-detail{ display: flex; padding:60px 0;}
.news-detail .fl{ flex:1; margin-right:60px; }
.news-detail .fl .content{ color:#4E5969; font-size:16px; line-height:24px; }
.prevnext{ border-top:1px solid #eee; margin-top:40px; padding-top:40px;}
.prevnext li{ max-width:340px;}
.prevnext li p{ color:#86909C; font-size:12px;}
.prevnext li h3{ font-size:12px; color:#1D2129; margin-top:5px;}
.prevnext li:nth-child(2){ text-align: right; }
.prevnext li a:hover h3{ color:#765186;}
.news-detail .fr{ width:400px; }
.news-detail .fr .search{ height:62px; border-radius:62px; background:#F5F5F7; padding:0 20px; font-size:16px;}
.news-detail .fr .search i{ color:#999; }
.news-detail .fr .search .intxt{ background:none; border:0; flex:1; font-size:16px; margin-left:10px;}
.recent-news{ margin-top:40px;}
.recent-news h2{ font-size:28px; color:#1D2129;}
.recent-news .list li{ border-bottom:1px solid #eee;}
.recent-news .list li a{ display: block; font-weight: bold; font-size:16px; color:#666; line-height:22px; padding:18px 0;}
.recent-news .list li a:hover{ color:#765186;}
.like-news h2{ font-size:42px; color:#1D2129; margin-top:10px; margin-bottom:30px;}

/***服务***/
.server-banner{ background:#F6F5F7; overflow: hidden; height:600px; position: relative;}
.server-banner .wrap{ flex:1;position: relative; }
.server-banner .text{ max-width:652px; }
.server-banner .img{ position: absolute; right:0; top:0; height:100%; }
.server-banner h2{ font-size:32rpx; font-weight: bold; }
.server-banner h1{font-size:50px; padding:10px 0; font-weight:bold; -webkit-background-clip: text; color: transparent; background-image: linear-gradient(90deg, #6a4c93, #4361ee); }
.server-banner p{ font-size:15px; line-height:24px; }
.server-banner .hm{ margin-top:24px; }
.server-banner .hm .btn{ margin-right:11px;}

.services {}
.services .title p{ max-width:100%;}
.services .title .text-main{ font-size:20px; padding-bottom:10px; }
.service-card { overflow:hidden; margin-top:60px; }
.service-card .text { width:50%; padding-right:50px; float:left; margin-top:30px; }
.service-card .text p{ font-size:20px; color:#4E5969; margin-top:20px; line-height:25px; }
.service-card .text h3 { font-size:42px; margin-bottom: 10px; }
.service-card .text .list{ margin-top:10px; }
.service-card .text .list p { margin-top:20px; background:url(../images/hua.png) no-repeat left 3px; padding-left:35px; font-size:16px; line-height: 22px; }
.service-card .img { width:50%; padding-left:50px; float:right; }
.service-card .img img { width: 100%; border-radius: 5px; }
.services .service-card:nth-child(2n) .text { float:right; padding-right:0; padding-left:50px; }
.services .service-card:nth-child(2n) .img { float:left; padding-left:0; padding-right:50px; }

.withus ul{ display: flex; flex-wrap: wrap;}
.withus ul li{ width:calc(100% /4 - 40px); margin-left:40px; background:#f6f5f7; border-radius:20px; padding:40px 25px; text-align: center; }
.withus ul li .img{ width:72px; height:72px; border-radius:50%; background:#765186; border-radius:50%; margin:0 auto;}
.withus ul li h3{ padding:20px 0; font-size:18px; }
.withus ul li p{ font-size:14px; color:#4E5969; line-height:22px;}

/***FAQ***/
.faq-search{ padding:100px 0; text-align: center; background:#f5f5f7;}
.faq-search h1{ font-size:64px; }
.faq-search .input{ max-width:755px; margin:0 auto; background:#fff; margin-top:35px; border:3px solid #765186; height:72px; border-radius:72px; position: relative; padding:0 25px;}
.faq-search .input .intxt{ margin-right:20px; flex:1; border:0; background: no-repeat; font-size:20px; }
.faq-search .input:hover { box-shadow:rgba(0,0,0,0.1) 0 0 25px 0; }
.faq-search p{ margin-top:35px; font-size:16px; }

.faq-box{ display: flex; overflow: hidden;}
.faq-box .fl{ flex:1; margin-right:60px; }
.faq-box .fl .faq-item{ border:1px solid #eee; border-radius:20px; padding:40px; margin-bottom:40px; }
.faq-box .fl .faq-item:nth-child(1){ margin-top:0;}
.faq-box .fl .faq-item .tit h2{ font-size:28px; }
.faq-box .fl .faq-item .tit p{ font-size:16px; margin-top:10px; }
.faq-box .fl .faq-item .faqlist dl:nth-child(1){ border-top:0;}
.faq-box .fl .faq-item .faqlist dl:last-child{ border-bottom:0;}

.faq-box .fr{ width:400px; }
.faq-box .fr .tit h2{  font-size:28px; }
.faq-box .fr .tit p{ font-size:16px; margin-top:10px; }
.faq-box .fr form{ margin-top:45px; }
.faq-box .fr .input-field{ height:62px; background:#f5f5f5; border-radius:12px; margin-bottom:25px; }
.faq-box .fr .input-field .intxt{ border:0; padding:0 20px; padding-top:15px; background: no-repeat; height:62px; display: block;}
.faq-box .fr form .btn{ width:100%; }

/***Download***/
.down-tit{ padding-top:77px; }
.down-tit h1{ font-size:64px; line-height: 64px; }
.down-tit p{ font-size:16px; margin-top:35px; }
.download-box { display: flex; margin-left:-40px; }
.download-box .download-item{ width: calc(100% / 2 - 40px); border-radius:20px; border:1px solid #eee; margin-left:40px; padding:40px; }
.download-box .download-item .tit h2{ font-size:28px;}
.download-box .download-item .tit p{ font-size:16px; margin-top:10px; }
.download-box .download-item .down-list{ margin-top:10px; }
.download-box .download-item .down-list li{ border-bottom:1px solid #eee; padding:20px 0 25px 0;}
.download-box .download-item .text{ flex:1; margin-right:20px;}
.download-box .download-item .text h3{ font-size:20px; }
.download-box .download-item .text p{ font-size:14px; margin-top:10px; }
.download-box .download-item .text p span{ margin-right:40px;}
.download-box .download-item .text p span em{ color:#4E5969; }
.download-box .download-item .fa{ font-size:20px; }

/***about**/
.about-banner { height:600px; color:#fff; overflow: hidden; position: relative;}
.about-banner .wrap{ max-width:716px; position: relative; z-index:2; text-align: center;}
.about-banner img { position: absolute; height:100%; width:100%; object-fit: cover; left:0; top:0; }
.about-banner h1 { font-size: 48px; }
.about-banner p { font-size: 22px; color: #fff; line-height:30px; padding:20px 0 25px 0; }
.about-banner .hero-btn { margin:0 auto; width:180px; height:54px; border-radius:54px; background: #fff; color:#765186; font-size:16px; cursor: pointer; }
.about-banner .hero-btn:hover{ background: #765186; color:#fff;}

/* 品牌故事 */
.our-story {  }
.story-img { width:500px; height:450px; border-radius:20px; object-fit: cover; }
.story-text { flex:1; margin-left:60px; }
.story-text h3{ font-size:20px; color:#765186; }
.story-text h2 { font-size:42px;  margin-top:10px;}
.story-text .text { font-size: 18px; color: #4E5969; line-height:25px; margin-top:25px; }

/* 品牌使命 */
.our-mission { background: #f6f1f8; }
.our-mission .title h3 { font-size: 20px; margin-bottom: 15px; color:#765186; text-align: center; }
.our-mission .title p { max-width:755px; }
.mission-cards { display: flex; flex-wrap: wrap; margin-left:-40px; }
.mission-card { width: calc(100% / 3 - 40px); transition:all 0.3s ease; margin-left:40px; margin-top:20px; background: #fff; padding: 40px; border-radius:20px; }
.mission-card .icon { width: 72px; height: 72px; background: #765186; border-radius: 50%; margin: 0 auto; }
.mission-card h3 { font-size: 18px; padding:25px 0 26px 0; text-align: center; transition:all 0.3s ease;}
.mission-card p { font-size: 14px; color: #666;transition:all 0.3s ease; }
.mission-card:hover { box-shadow: rgba(0,0,0,0.05) 0 0 20px 0; transform: translateY(-10px); }
.mission-card:hover h3 { transform: translateY(-3px); }
.mission-card:hover p { transform: translateY(-3px); }

/* 产品理念 */
.product-philo {}
.product-philo .title h3 { font-size: 20px; margin-bottom: 15px; color:#765186; text-align: center; }
.product-philo .title p{ max-width:608px; }
.product-philo ul{ margin-top:20px; }
.product-philo ul li { overflow: hidden; margin-top:60px; display: flex; align-items: center; }
.product-philo ul li:nth-child(1) { margin-top:0; }
.product-philo ul li .img1{ display: none; padding-right:50px; }
.product-philo ul li .img2{ padding-left:50px; }
.product-philo ul li:nth-child(2n) .img1{ display: block;}
.product-philo ul li:nth-child(2n) .img2{ display: none; }
.product-philo ul li:nth-child(2n) .design-text{ padding-right:0; padding-left:50px;}
.product-philo ul li .design-text { width: 50%; padding-right:50px; }
.product-philo ul li .design-text h3 { font-size: 42px; margin-bottom: 15px; }
.product-philo ul li .design-text p { font-size: 20px; color: #4E5969; line-height:26px; }
.product-philo ul li img{ width: 50%;}

/* 技术核心 */
.tech-core{ background:#F5F5F7;}
.tech-core .title h3 { font-size: 20px; margin-bottom: 15px; color:#765186; text-align: center; }
.tech-core ul{ display: flex; flex-wrap: wrap; margin-left:-40px;}
.tech-core ul li{ width: calc(100% / 3 - 40px); transition: all 0.6s ease; transform-style: preserve-3d; transform-origin: left center; margin-left:40px; border-radius:16px; overflow: hidden; position: relative; }
.tech-core ul li .img{ display: block; width:100%; object-fit: cover; }
.tech-core ul li .msk{ position: absolute; text-align: center; padding:20px; background:rgba(0,0,0,0.5); left:0; top:0; width:100%; height:100%; }
.tech-core ul li .icon{ margin:0 auto; width:72px; height:72px; background: rgba(246,245,247,0.1); border-radius:50%;}
.tech-core ul li h3{ font-size:18px; color:#fff; padding:20px 0 20px 0;}
.tech-core ul li p{  color:#C9CDD4; font-size:14px; line-height:23px; }
.tech-core ul li:hover { transform: rotateX(-10deg) translateZ(20px) scale(1.02); }

/* 合作板块 */
.partner .title p{ max-width:660px;}
.partner .partner-box{ display: flex; margin-top:20px; }
.partner .partner-box dl{ flex:1; margin-right:40px; }
.partner .partner-box dl dd{ display: none; }
.partner .partner-box dl dd img{ width:100%;}
.partner .partner-box .fr{ flex:1; margin-left:40px; }
.partner .partner-box .fr .text{ color:#4E5969; font-size:18px; line-height:25px; }
.partner .partner-box .fr ul{ border-left:3px solid #E3E3E3; margin-top:25px; }
.partner .partner-box .fr ul li{ cursor:pointer; padding:15px 0 15px 22px; position: relative; }
.partner .partner-box .fr ul li h3{ font-size:24px; }
.partner .partner-box .fr ul li p{ margin-top:3px; font-size:16px; color:#4E5969; line-height:23px; }
.partner .partner-box .fr ul li.on h3{ color:#765186;}
.partner .partner-box .fr ul li.on p{ color:#765186;}
.partner .partner-box .fr ul li.on:before{ background: #765186; width: 3px; position: absolute; height:100%; top:0; left:-3px; content:''; z-index:1;}

/* ---------------- Cart Layout ---------------- */
.cart-box-con .cart-title{ text-align: center;  font-size: 48px;  font-weight: 700;  margin: 60px 0;}
.cart-box-con .cart-layout { display: grid; grid-template-columns: 1.8fr 1fr; gap: 60px; margin-bottom: 80px; }

/* 左侧：购物车列表 */
.cart-box-con .cart-item { display: flex; padding-bottom: 40px; margin-bottom: 40px; border-bottom: 1px solid #eee; }
.cart-box-con .item-img-placeholder { width: 120px; height: 120px; background-color: #f2f2f2; border-radius: 12px; display: flex; align-items: center; justify-content: center; color: #999; font-size: 12px; flex-shrink: 0; margin-right: 24px; position: relative; }
.cart-box-con .item-img-placeholder::after { content: attr(data-label); position: absolute; font-weight: bold; opacity: 0.3; }
.cart-box-con .item-details { flex-grow: 1; display: flex; flex-direction: column; justify-content: space-between; }
.cart-box-con .item-header { display: flex; justify-content: space-between; align-items: flex-start; }
.cart-box-con .item-name { font-size: 16px; font-weight: 600; margin-bottom: 8px; }
.cart-box-con .item-color { font-size: 14px; color: var(--text-gray); }
.cart-box-con .item-price-block { text-align: right; }
.cart-box-con .current-price { font-weight: 600; }
.cart-box-con .old-price { text-decoration: line-through; color: var(--price-old); margin-left: 8px; font-size: 14px; }
.cart-box-con .item-actions { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 20px; }
.qty-selector { display: flex; align-items: center; border: 1px solid #e5e5e5; border-radius: 20px; padding: 5px 10px; width: 100px; justify-content: space-between; }
.cart-box-con .qty-btn { background: none; border: none; font-size: 18px; color: #333; cursor: pointer; width: 20px; text-align: center; }
.cart-box-con .qty-val { font-weight: 600; font-size: 14px; }
.cart-box-con .remove-link { font-size: 14px; color: #666; margin-left: 20px; cursor: pointer; }
.cart-box-con .item-total { font-weight: 700; font-size: 16px; }
.cart-box-con .item-total-old { font-size: 14px; color: var(--price-old); text-decoration: line-through; margin-left: 5px; }

/* 推荐区域 */
.recommendation-section { background-color: var(--bg-gray); border-radius: 12px; padding: 30px; margin-top: 20px; }
.recommendation-section .rec-title { font-size: 18px; margin-bottom: 24px; font-weight: 500; }
.recommendation-section .rec-item { display: flex; align-items: center; justify-content: space-between; padding-bottom: 24px; border-bottom: 1px solid #e5e5e5; margin-bottom: 24px; }
.recommendation-section .rec-item:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.recommendation-section .rec-info { display: flex; align-items: center; }
.recommendation-section .rec-img-placeholder { width: 60px; height: 60px; background-color: #fff; border-radius: 50%; margin-right: 20px; display: flex; justify-content: center; align-items: center; font-size: 10px; color: #ccc; border: 1px solid #ddd; }
.recommendation-section .rec-text h4 { font-size: 14px; font-weight: 600; }
.recommendation-section .rec-text p { font-size: 13px; color: var(--text-gray); margin-top: 4px; }
.recommendation-section .rec-action { text-align: right; }
.recommendation-section .rec-price { font-size: 14px; font-weight: 600; margin-bottom: 8px; display: block; }
.recommendation-section .btn-add { background: #fff; border: 1px solid #e5e5e5; padding: 6px 20px; border-radius: 20px; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.2s; }
.recommendation-section .btn-add:hover { border-color: #999; }

/* 右侧：订单摘要 */
.summary-box { background-color: var(--bg-gray); border-radius: 12px; padding: 30px; position: sticky; top: 100px; }
.summary-box .summary-title { font-size: 20px; font-weight: 700; margin-bottom: 24px; }
.summary-box .summary-row { display: flex; justify-content: space-between; margin-bottom: 15px; font-size: 14px; color: #333; }
.summary-box .summary-row.total { margin-top: 20px; padding-top: 20px; border-top: 1px solid #e0e0e0; font-weight: 700; font-size: 16px; }
.summary-box .btn-checkout { width: 100%; background: var(--primary-gradient); color: white; border: none; padding: 15px; border-radius: 8px; font-size: 14px; font-weight: 600; margin-top: 25px; cursor: pointer; letter-spacing: 0.5px; }
.summary-box .disclaimer { margin-top: 20px; font-size: 11px; color: #999; line-height: 1.6; }

@media (max-width: 992px) {
    .cart-layout { grid-template-columns: 1fr; }
    .summary-box { position: static; }
}


/* pay index */
.pay-con .wrap{ display: flex; }
.pay-con .left-column h2{ font-size: 18px; font-weight: 600; margin-bottom: 15px; margin-top: 30px; color: #333; }
.pay-con .left-column h2 a{ font-size:14px; font-weight:normal;  color:#765186;}
.pay-con .left-column { flex:1; padding: 40px; border-right: 1px solid #e1e1e1;}
.pay-con .right-column { width:348px; background-color: #fafafa; padding: 40px; }
.pay-con .btn{ width:100%;  height:54px; margin-top:15px; font-weight: bold;}
/* Express Checkout */
.pay-con .express-checkout { display: flex; gap: 10px; margin-bottom: 20px; }
.pay-con .express-btn { flex: 1; height: 45px; border-radius: 5px; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.pay-con .btn-shop { background: #5a31f4; color: white; font-weight: bold; font-size: 16px; transition: background 0.3s; }
.pay-con .btn-gpay { background: #000; color: white; display: flex; align-items: center; justify-content: center; gap: 5px; font-weight: 500; font-size: 16px; }
.pay-con .or-divider { display: flex; align-items: center; text-align: center; color: #737373; font-size: 12px; margin: 20px 0; }
.pay-con .or-divider::before, .or-divider::after { content: ""; flex: 1; border-bottom: 1px solid #e1e1e1; }
.pay-con .or-divider::before { margin-right: 10px; }
.pay-con .or-divider::after { margin-left: 10px; }

/* Forms Common */
.pay-con .form-group { margin-bottom:20px; position: relative; }
.pay-con .input-icon-label{ position:absolute; top: -7px; left:10px; font-size:10px; background:white; padding:0 5px; color:#737373; }
.pay-con .form-row { display: flex; gap: 12px; margin-bottom: 12px; }
.pay-con .form-col { flex: 1; position: relative }
.pay-con input[type="text"], .pay-con textarea, .pay-con select { width: 100%; padding: 12px; border: 1px solid #d9d9d9; border-radius: 5px; font-size: 14px; color: #333; background: #fff; transition: border 0.2s; }
.pay-con input:focus, .pay-con select:focus, .pay-con textarea:focus { border-color: #5a31f4; box-shadow: 0 0 0 1px #5a31f4; }
.pay-con label.checkbox-label { display: flex; align-items: center; font-size: 14px; color: #555; margin-top: 10px; cursor: pointer; }
.pay-con input[type="checkbox"] { margin-right: 10px; width: 16px; height: 16px; accent-color: #5a31f4; border-radius: 4px; }
.pay-con select { appearance: none; background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right 10px center; background-size: 16px; padding-right: 30px; }
.pay-con .input-icon-right { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: #737373; cursor: pointer; }

/* Shipping Method Box */
.pay-con .shipping-info-box { display: none; background: #f5f5f5; padding: 15px; border-radius: 5px; color: #555; font-size: 14px; text-align: center; margin-bottom: 30px; }
.pay-con .shipping-method-box{ display: none; border:1px solid #eee; padding:15px; border-radius:2px; font-size:14px;  margin-bottom: 30px; }
.pay-con .shipping-method-box b{ font-size:16px; float:right; }

/* Payment Section */
.pay-con .payment-card { border: 1px solid #d9d9d9; border-radius: 5px; overflow: hidden; }
.pay-con .payment-header { background: #f9f9f9; padding: 15px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #d9d9d9; }
.pay-con .radio-group { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500; cursor: pointer; }
.pay-con input[type="radio"] { width: 18px; height: 18px; accent-color: #5a31f4; }
.pay-con .card-icons { display: flex; gap: 5px; }
.pay-con .card-icon { width: 38px; height: 24px; background: white; border: 1px solid #e1e1e1; border-radius: 3px; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: bold; color: #333; }
.pay-con .visa { color: #1a1f71; } .master { color: #eb001b; } .amex { color: #27aee3; }
.pay-con .payment-body { padding: 15px; background: #fff; border-bottom: 1px solid #e1e1e1; }
.pay-con .shop-pay-row { padding: 15px; display: flex; align-items: center; justify-content: space-between; background: white; }
.pay-con .shop-pay-logo { color: #5a31f4; font-weight: 800; font-style: italic; }

/* Right Column (Summary) */
.pay-con .product-item { display: flex; align-items: center; margin-bottom: 20px; }
.pay-con .img-wrapper { position: relative; width: 64px; height: 64px; border:1px solid #eee; box-shadow: rgba(0,0,0,0.06) 0 0 10px 0; padding:2px; border-radius: 8px; background: #fff; margin-right: 15px; }
.pay-con .img-wrapper .badge { position: absolute; top: -8px; right: -8px; background: #737373; color: white; width: 20px; height: 20px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; }
.pay-con .img-wrapper .product-img-div img{ width:100%; height:100%; object-fit: cover; border-radius:8px;}
.pay-con .white-tag { background: #f0f0f0; border: 1px solid #ddd; }
.pay-con .black-card { background: #222; border: 1px solid #000; }
.pay-con .product-info { flex: 1; }
.pay-con .product-name { font-weight: 500; font-size: 14px; color: #333; }
.pay-con .product-variant { font-size: 12px; color: #737373; margin-top: 4px; }
.pay-con .product-cost{ text-decoration: line-through; font-size:12px; color:#737373; text-align:right;}
.pay-con .product-price { font-weight: 500; font-size: 14px; color: #333; }
.pay-con .product-summary{ margin-top: 30px; border-top: 1px solid #e1e1e1; padding-top: 20px; }
.pay-con .summary-line { display: flex; justify-content: space-between; margin-bottom: 10px; font-size: 14px; color: #555; }
.pay-con .summary-line.total { font-size: 18px; font-weight: 600; color: #333; margin-top: 20px; border-top: 1px solid #e1e1e1; padding-top: 20px; align-items: center; }
.pay-con .total-currency { font-size: 12px; color: #737373; margin-right: 5px; font-weight: normal; }

/* Responsive */
@media (max-width: 900px) {
    .right-column { background: #fafafa; border-bottom: 1px solid #e1e1e1; padding: 20px; }
    .left-column { border-right: none; padding: 20px; }
}
@media (max-width: 500px) {
    .pay-con .form-row { flex-direction: column; gap: 12px; }
    .pay-con .footer-grid { grid-template-columns: 1fr; }
}

/***shop页***/
.shop-banner{ height:360px; background:#F6F5F7; overflow: hidden;}
.shop-banner .text{ flex:1; }
.shop-banner .text h1{ font-size:38px; }
.shop-banner .text p{ font-size:16px; line-height:25px; margin-top:10px; }
.shop-banner img{ flex:1; object-fit: cover; }

.goods-list { display: flex; flex-wrap: wrap; }
.goods-list li{ width: calc(100% / 3 - 40px); margin-left:40px; margin-top:40px; text-align: center }
.goods-list li .img{ overflow: hidden;}
.goods-list li .img img{ width:100%; height:100%; object-fit: cover; transition: all .3s; }
.goods-list li .text h3{ font-size:24px; padding:10px 0; }
.goods-list li .text p{ font-size:16px; }
.goods-list li .text p i{ text-decoration: line-through; color:#999; margin-right:5px;}
.goods-list li .text .color{ margin-top:10px; }
.goods-list li .text .color i{ width:16px; height:16px; box-shadow: inset 0px 1px 2px 0px rgba(0,0,0,0.4); border-radius:50%; margin:0 3px;}

/***购物车***/
.overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.4); backdrop-filter: blur(2px); z-index: 998; opacity: 0; pointer-events: none; transition: opacity 0.8s ease; }
.overlay.active { opacity: 1; pointer-events: auto; }
.cart-drawer { position: fixed; transform: translateX(100%); transition:all .5s cubic-bezier(.7,0,.2,1); top: 0; right: 0; width: 100%; max-width: 480px; height: 100%; background: rgba(255, 255, 255, 0.95);  z-index: 999; box-shadow: -10px 0 30px rgba(0,0,0,0.1); display: flex; flex-direction: column;  }
.cart-drawer.active { transform: translateX(0) }
.drawer-header { padding: 30px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(0,0,0,0.05); }
.drawer-title { font-family: 'Playfair Display', serif; font-size: 24px; color: var(--primary); }
.drawer-footer { padding: 30px; background: white; border-top: 1px solid rgba(0,0,0,0.05); }
.drawer-footer .btn { width:100%; text-transform: uppercase }
.cart-drawer .close-btn { background: none; border: none; cursor: pointer; transition: transform 0.3s; }
.cart-drawer .close-btn:hover { transform: rotate(90deg); }
.drawer-body { flex: 1; overflow-y: auto; padding: 0 30px; }
.cart-box .cart-item { display: flex; padding: 25px 0; border-bottom: 1px solid rgba(0,0,0,0.05); animation: fadeIn 0.5s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.cart-box .item-img { width:110px; height:110px; object-fit: cover; margin-right: 20px; box-shadow: 0 5px 15px rgba(0,0,0,0.08); }
.cart-box .item-info { flex: 1; display: flex; flex-direction: column; justify-content: space-between; }
.cart-box .item-name { font-size: 15px; font-weight: 700; color: var(--primary); margin-bottom: 5px; }
.cart-box .item-meta { font-size: 12px; color: #888; margin-bottom:5px; }
.cart-box .item-price { font-weight: 700; color: var(--primary); }
.cart-box .item-actions { display: flex; justify-content: space-between; margin-top:8px; align-items: center; }
.cart-box .qty-control { display: flex; border: 1px solid #ddd; padding: 5px; }
.cart-box .qty-btn { width: 20px; height: 20px; border: none; background: transparent; cursor: pointer; color: #666; }
.cart-box .qty-num { width: 30px; text-align: center; font-size: 14px; line-height: 20px; }
.cart-box .btn-remove { font-size: 12px; color: #999; cursor: pointer; text-decoration: underline; background: none; border: none; }
.cart-box .btn-remove:hover { color: #e74c3c; }
.cart-box .total-row { display: flex; justify-content: space-between; margin-bottom: 20px; font-size: 18px; font-weight: 700; color: var(--primary); }
.empty-cart { height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #ccc; }
.empty-cart i { font-size: 40px; margin-bottom: 15px; opacity: 0.5; }
@media (max-width:750px) { .cart-drawer { max-width: 100%; } }

/*****会员中心********/
/***登录***/
.login-box-body { background-color: #f4f4f4; font-family: 'Segoe UI', Arial, sans-serif; padding: 100px 0; }
.login-box-container { display: flex; gap: 30px; width: 100%; flex-wrap: wrap; justify-content: center; }
.login-box-card { background: #fff; padding: 40px; flex: 1; min-width: 300px; box-shadow: 0 4px 35px rgba(0,0,0,0.03); border-radius: 4px; transition: transform 0.3s ease; }
.login-box-card:hover { transform: translateY(-5px); }
.login-box-title { color: #555; font-size: 20px; margin: 0 0 15px 0; font-weight: 500; letter-spacing: 1px; }
.login-box-divider { height: 1px; background: #eee; margin-bottom: 25px; }
.login-box-form-group { margin-bottom: 20px; }
.login-box-label { display: block; margin-bottom: 8px; color: #666; font-size: 14px; }
.login-box-body .login-box-input { width: 100%; padding:13px 20px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; font-size: 14px; transition: all 0.3s ease; outline: none; }
.login-box-body .login-box-input:focus { border-color: #765186; box-shadow: 0 0 8px rgba(118, 81, 134, 0.2); background-color: #fafafa; }
.login-box-link-container { margin-bottom: 20px; }
.login-box-link { color: #666; text-decoration: underline; font-size: 14px; transition: color 0.3s ease; }
.login-box-link:hover { color: #765186; }
.login-box-body .btn{ height:50px; font-size:14px; min-width:150px; }
@keyframes slideDown { from { transform: translateY(-20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
@media (max-width: 768px) { .login-box-container { flex-direction: column; } .login-box-card { padding: 25px; } }

.member-box-body { background-color: #f8f9fa; margin: 0; padding: 50px 0; color: #333; }
.member-box-container { display: flex; gap: 20px; }
.member-box-sidebar { width: 260px; background: #fff; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,0.05); overflow: hidden; flex-shrink: 0; }
.member-box-menu-title { padding: 20px; font-weight: bold; border-bottom: 1px solid #eee; color: #765186; font-size: 18px; }
.member-box-nav { padding: 10px; }
.member-box-menu-item { display: flex; align-items: center; gap: 12px; padding: 12px 15px; color: #666; text-decoration: none; border-radius: 8px; margin-bottom: 5px; transition: all 0.3s; font-size: 15px; }
.member-box-menu-item:hover { background: #f0ebf2; color: #765186; }
.member-box-menu-item.active { background: #765186; color: #fff; }
.member-box-main { flex: 1; display: flex; flex-direction: column; gap: 20px; }
.member-box-user-header { background: #fff; padding: 30px; border-radius: 12px; display: flex; align-items: center; gap: 20px; box-shadow: 0 4px 12px rgba(0,0,0,0.05); }
.member-box-avatar { width: 80px; height: 80px; border-radius: 50%; object-fit: cover; border: 3px solid #f0ebf2; }
.member-box-nickname { margin: 0; font-size: 22px; color: #765186; }
.member-box-welcome { margin: 5px 0 0 0; color: #999; font-size: 14px; }
.member-box-section-title { font-size: 18px; font-weight: bold; color: #444; min-height:40px; display: flex; align-items:center;}
.member-box-section-title a{ font-weight: normal; font-size:14px;}
.member-box-order-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
.member-box-status-card { background: #fff; padding: 20px; border-radius: 12px; text-align: center; box-shadow: 0 4px 12px rgba(0,0,0,0.05); transition: transform 0.3s; cursor: pointer; position: relative; }
.member-box-status-card:hover { transform: translateY(-5px);  }
.member-box-status-icon { font-size: 24px; color: #765186; margin-bottom: 10px; }
.member-box-status-label { font-size: 14px; color: #666; }
.member-box-status-count { position: absolute; top: 15px; right: 15px; background: #ff4d4f; color: #fff; font-size: 12px; padding: 2px 7px; border-radius: 10px; }
.member-box-stats-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; }
.member-box-stats-card { background: linear-gradient(135deg, #765186 0%, #a07cb1 100%); padding: 25px; border-radius: 12px; color: #fff; display: flex; justify-content: space-between; align-items: center; position: relative; overflow: hidden; box-shadow: 0 4px 15px rgba(118, 81, 134, 0.3); }
.member-box-stats-card:hover{ color:#fff; transform: translateY(-5px)}
.member-box-stats-info { display: flex; flex-direction: column; gap: 5px; z-index: 1; }
.member-box-stats-label { font-size: 15px; opacity: 0.9; }
.member-box-stats-num { font-size: 24px; font-weight: bold; }
.member-box-stats-icon-bg { font-size: 60px; position: absolute; right: -10px; bottom: -10px; opacity: 0.15; z-index: 0; }
@media (max-width: 768px) {
    .member-box-container { flex-direction: column; }
    .member-box-sidebar { width: 100%; }
    .member-box-order-grid { grid-template-columns: repeat(2, 1fr); }
    .member-box-stats-row { grid-template-columns: 1fr; }
    .member-box-body{ padding:12px 0;}
}

/***会员信息***/
.member-box-info-card { background: #fff; padding: 30px; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,0.05); }
.member-box-info-divider { height: 1px; background: #eee; margin: 20px 0 30px 0; }
.member-box-avatar-section { text-align: center; margin-bottom: 30px; }
.member-box-avatar-wrapper { position: relative; width: 100px; height: 100px; margin: 0 auto; }
.member-box-info-avatar { width: 100px; height: 100px; border-radius: 50%; object-fit: cover; border: 4px solid #f0ebf2; }
.member-box-avatar-upload { position: absolute; bottom: 0; right: 0; width: 32px; height: 32px; background: #765186; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; cursor: pointer; border: 2px solid #fff; overflow: hidden; }
.member-box-file-input { position: absolute; font-size: 100px; opacity: 0; cursor: pointer; right: 0; top: 0; }
.member-box-form { max-width: 500px; margin: 0 auto; }
.member-box-form-item { margin-bottom: 20px; }
.member-box-info-label { display: block; margin-bottom: 8px; font-size: 14px; color: #666; font-weight: bold; }
.member-box-info-label i { color: #765186; margin-right: 5px; width: 18px; text-align: center; }
.member-box-info-input { width: 100%; padding: 12px 15px; border: 1px solid #ddd; border-radius: 8px; font-size: 14px; transition: all 0.3s; box-sizing: border-box; outline: none; }
.member-box-info-input:focus { border-color: #765186; box-shadow: 0 0 8px rgba(118, 81, 134, 0.15); }
.member-box-info-input[disabled] { background:#f8f8f8; }
.member-box-btn-group { margin-top: 30px; text-align: center; }
.member-box-save-btn { background: #765186; color: #fff; border: none; padding: 12px 40px; border-radius: 25px; font-size: 16px; cursor: pointer; transition: all 0.3s; display: inline-flex; align-items: center; gap: 8px; box-shadow: 0 4px 15px rgba(118, 81, 134, 0.3); }
.member-box-save-btn:hover { background: #5d3f6a; transform: translateY(-2px); }
@media (max-width: 768px) { .member-box-info-card { padding: 20px; } .member-box-form { width: 100%; } }

/***我的收藏***/
.fav-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding: 0 10px; }
.fav-toolbar .select-all-label { display: flex; align-items: center; font-size: 14px; color: #666; cursor: pointer; }
.fav-toolbar .checkbox-custom { width: 18px; height: 18px; accent-color: #765186; margin-right: 8px; }
.fav-toolbar .batch-del-btn { background: #fff; border: 1px solid #765186; color: #765186; padding: 6px 16px; border-radius: 20px; font-size: 13px; cursor: pointer; transition: all 0.3s; }
.fav-toolbar .batch-del-btn:hover { background: #765186; color: #fff; }
.fav-list { display: flex; flex-direction: column; gap: 15px; }
.fav-list .fav-item { display: flex; align-items: center; padding: 15px; border: 1px solid #f0f0f0; border-radius: 12px; transition: all 0.3s; position: relative; }
.fav-list .fav-item:hover { border-color: #765186; box-shadow: 0 2px 12px rgba(118,81,134,0.08); }
.fav-list .product-link { display: flex; align-items: center; text-decoration: none; flex: 1; min-width: 0; }
.fav-list .product-img { width: 80px; height: 80px; border-radius: 10px; object-fit: cover; background: #f5f5f5; margin-right: 20px; flex-shrink: 0; }
.fav-list .product-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.fav-list .product-name { font-size: 16px; font-weight: 600; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fav-list .fav-time { font-size: 13px; color: #999; display: flex; align-items: center; }
.fav-list .fav-time::before { content: "🕒"; margin-right: 5px; font-size: 12px; }
.fav-list .delete-btn { color: #999; background: none; border: none; font-size: 14px; cursor: pointer; padding: 8px 15px; border-radius: 6px; transition: all 0.2s; }
.fav-list .delete-btn:hover { color: #ff4d4f; background: #fff1f0; }

.nodata{ text-align: center; padding:50px 0;}
.nodata img{ width: 200px; }

/***我的地址***/
@keyframes myAddressFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes myAddressZoom { from { opacity: 0; transform: scale(0.9) translateY(20px); } to { opacity: 1; transform: scale(1) translateY(0); } }
.my-address-add-btn { background: #765186; color: #fff; border: none; padding: 12px; border-radius: 25px; font-size: 14px; cursor: pointer; box-shadow: 0 4px 12px rgba(118,81,134,0.2); transition: all 0.2s; display: flex; align-items: center; gap: 10px; }
.my-address-add-btn:hover { background: #634371; transform: translateY(-2px); }
.my-address-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 20px; }
.my-address-card { border: 1px solid #f0f0f0; border-radius: 12px; padding: 20px; position: relative; transition: all 0.3s ease; display: flex; flex-direction: column; background: #fff; }
.my-address-card:hover { border-color: #765186; box-shadow: 0 4px 15px rgba(118,81,134,0.08); }
.my-address-card.is-default { border-color: #765186; background-color: #fdfbff; border-width: 1.5px; }
.my-address-tag { position: absolute; top: 15px; right: 15px; background: #765186; color: #fff; font-size: 11px; padding: 4px 12px; border-radius: 20px; display: flex; align-items: center; gap: 5px; }
.my-address-name { font-size: 17px; font-weight: 700; color: #333; margin-bottom: 12px; padding-right: 80px; }
.my-address-info-row { font-size: 14px; color: #666; margin-bottom: 8px; line-height: 1.5; display: flex; align-items: flex-start; }
.my-address-label { font-weight: 600; color: #333; width: 90px; flex-shrink: 0; }
.my-address-actions { margin-top: 15px; padding-top: 15px; display: flex; gap: 15px; border-top: 1px dashed #eee; align-items: center; }
.my-address-action-btn { background: none; border: none; font-size: 13px; cursor: pointer; color: #765186; padding: 5px 0; font-weight: 500; display: flex; align-items: center; gap: 6px; transition: opacity 0.2s; }
.my-address-action-btn.delete { color: #ff4d4f; margin-left: auto; }
.my-address-action-btn:hover { opacity: 0.7; }
.my-address-modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); display: none; align-items: center; justify-content: center; z-index: 1000; padding: 15px; box-sizing: border-box; backdrop-filter: blur(2px); animation: myAddressFade 0.3s ease; }
.my-address-modal { background: #fff; width: 100%; max-width: 550px; border-radius: 18px; padding: 30px; box-shadow: 0 15px 45px rgba(0,0,0,0.2); position: relative; max-height: 90vh; overflow-y: auto; animation: myAddressZoom 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); }
.my-address-modal-title { font-size: 18px; font-weight: 700; color: #333; margin-bottom: 25px; display: flex; align-items: center; gap: 12px; }
.my-address-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.my-address-form-item { display: flex; flex-direction: column; gap: 6px; }
.my-address-form-item.full-width { grid-column: span 2; }
.my-address-form-label { font-size: 13px; font-weight: 600; color: #555; }
.my-address-input, .my-address-select { padding: 12px 15px; border: 1px solid #ddd; border-radius: 8px; font-size: 14px; background: #fafafa; transition: all 0.2s; height: 45px; box-sizing: border-box; }
.my-address-input:focus, .my-address-select:focus { outline: none; border-color: #765186; background: #fff; box-shadow: 0 0 0 3px rgba(118,81,134,0.1); }
.my-address-modal-footer { display: flex; justify-content: flex-end; gap: 12px; margin-top: 30px; border-top: 1px solid #f5f5f5; padding-top: 20px; }
.my-address-btn-cancel { background: #f5f5f5; color: #666; border: none; padding: 12px 25px; border-radius: 25px; cursor: pointer; font-weight: 600; display: flex; align-items: center; gap: 8px; }
.my-address-btn-save { background: #765186; color: #fff; border: none; padding: 12px 35px; border-radius: 25px; cursor: pointer; font-weight: 600; box-shadow: 0 4px 12px rgba(118,81,134,0.3); display: flex; align-items: center; gap: 8px; }
@media (max-width: 768px) {
    .my-address-grid { grid-template-columns: 1fr; }
    .my-address-container { padding: 15px; } }
@media (max-width: 480px) {
    .my-address-header { flex-direction: column; align-items: flex-start; }
    .my-address-add-btn { justify-content: center; }
    .my-address-form-grid { grid-template-columns: 1fr; }
    .my-address-form-item.full-width { grid-column: span 1; }
    .my-address-modal { padding: 20px; }
    .my-address-modal-footer { flex-direction: column-reverse; }
    .my-address-btn-save,
    .my-address-btn-cancel { width: 100%; justify-content: center; }
}

/***我的订单***/
.my-order-list { display: flex; flex-direction: column; gap: 20px; }
.my-order-list .order-card { background: #fff; border: 1px solid #f0f0f0; border-radius: 12px; overflow: hidden; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); }
.my-order-list .order-card:hover { transform: translateY(-4px); box-shadow: 0 12px 24px rgba(125, 90, 138, 0.15); border-color: #eaddf5; }
.my-order-list .card-top { display: flex; justify-content: space-between; align-items: center; padding: 15px 24px; background-color: #fafafa; border-bottom: 1px solid #f5f5f5; font-size: 14px; flex-wrap: wrap; gap: 10px; }
.my-order-list .order-no { color: #666; font-weight: 500; }
.my-order-list .order-status { font-weight: 600; }
.my-order-list .status-unpaid { color: #ff9800; }
.my-order-list .status-done { color: #4caf50; }
.my-order-list .product-group { padding: 0 24px; display: flex; flex-direction: column; }
.my-order-list .product-item { display: flex; align-items: flex-start; padding: 20px 0; border-bottom: 1px dashed #eee; transition: background-color 0.2s; }
.my-order-list .product-item:last-child { border-bottom: none; }
.my-order-list .img-box { width: 80px; height: 80px; border-radius: 8px; overflow: hidden; background: #f9f9f9; border: 1px solid #eee; flex-shrink: 0; }
.my-order-list .img-box img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s; }
.my-order-list .order-card:hover .img-box img { transform: scale(1.05); }
.my-order-list .info-box { flex: 1; padding: 0 15px; display: flex; flex-direction: column; gap: 6px; }
.my-order-list .p-name { font-size: 15px; font-weight: 500; color: #333; line-height: 1.4; }
.my-order-list .p-sku { font-size: 13px; color: #999; }
.my-order-list .price-box { text-align: right; min-width: 80px; }
.my-order-list .p-price { font-size: 16px; font-weight: 600; color: #333; }
.my-order-list .p-qty { font-size: 13px; color: #999; margin-top: 4px; }
.my-order-list .card-bottom { padding: 15px 24px; border-top: 1px solid #f5f5f5; display: flex; justify-content: space-between; align-items: center; background: #fff; }
.my-order-list .total-section { font-size: 14px; color: #666; }
.my-order-list .total-price { font-size: 20px; color: #7d5a8a; font-weight: 700; margin-left: 5px; }
.my-order-list .btn-group { display: flex; gap: 12px; }
.o-btn { padding: 8px 20px; border-radius: 6px; font-size: 14px; cursor: pointer; border: none; outline: none; transition: all 0.2s; font-weight: 500; white-space: nowrap; }
.o-btn i{ margin-right:5px;}
.o-btn:active { transform: scale(0.96); }
.o-btn-default { background: #fff; border: 1px solid #e0e0e0; color: #666; }
.o-btn-default:hover { border-color: #7d5a8a; color: #7d5a8a; background: #fdfbff; }
.o-btn-primary { background: #7d5a8a; color: #fff; box-shadow: 0 4px 10px rgba(125, 90, 138, 0.25); }
.o-btn-primary:hover { background: #6a4c75; box-shadow: 0 6px 14px rgba(125, 90, 138, 0.35); }
.o-btn-red{ background: #f21c3b; border: 1px solid #f21c3b; color: #fff !important; }
.o-btn-wc{ background: #21d16b; border: 1px solid #f21c3b; color: #fff !important; }
.o-btn-pj{ background: #f27c1d; border: 1px solid #f27c1d; color: #fff !important; }
.order-filter-bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; gap: 20px; white-space: nowrap; }
.order-tabs { display: flex; align-items: center; gap: 25px; }
.order-tabs .tab-item { font-size: 14px; color: #666; text-decoration: none; position: relative; padding: 8px 0; transition: all 0.3s; }
.order-tabs .tab-item:hover, .order-tabs .tab-item.active { color: #7d5a8a; font-weight: 600; }
.order-tabs .tab-item.active::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background: #7d5a8a; border-radius: 2px; }
.order-search form { display: flex; align-items: center; border: 1px solid #eee; background: #fdfbff; border-radius: 8px; padding: 2px 2px 2px 12px; transition: all 0.3s; }
.order-search form:focus-within { border-color: #7d5a8a; box-shadow: 0 0 0 2px rgba(125, 90, 138, 0.05); }
.order-search input { border: none; outline: none; background: transparent; font-size: 13px; width: 180px; color: #333; }
.order-search input:focus { border:0; box-shadow: none; }
.order-search button { background: #7d5a8a; color: #fff; border: none; width: 30px; height: 30px; border-radius: 6px; cursor: pointer; transition: all 0.3s; display: flex; align-items: center; justify-content: center; }
.order-search button:hover { background: #6a4c75; }
.my-order-list .order-meta { display: flex; align-items: center; gap: 15px; }
.my-order-list .order-time { font-size: 13px; color: #999; font-weight: normal; }
.my-order-list .btn-group { display: flex; gap: 10px; white-space: nowrap; }
.my-order-list .o-btn-default { text-decoration: none; display: inline-flex; align-items: center; justify-content: center; }

/* 手机端响应式样式 (max-width: 768px) */
@media screen and (max-width: 768px) {
    .my-order-list .card-top { padding: 12px 15px; }
    .my-order-list .product-group { padding: 0 15px; }
    .my-order-list .product-item { padding: 15px 0; }
    .my-order-list .img-box { width: 70px; height: 70px; }
    .my-order-list .p-name { font-size: 14px; max-height: 40px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
    .my-order-list .card-bottom { padding: 15px; flex-direction: column; align-items: stretch; gap: 15px; }
    .my-order-list .total-section { text-align: right; padding-bottom: 5px; border-bottom: 1px solid #fafafa; }
    .my-order-list .o-btn-group { width: 100%; display: flex; }
    .my-order-list .o-btn { flex: 1; padding: 10px 0; font-size: 14px; display: flex; justify-content: center; align-items: center; }
    .my-order-list .order-card:hover { transform: none; }
    .order-filter-bar { flex-direction: column; align-items: stretch; gap: 15px; }
    .order-tabs { overflow-x: auto; padding-bottom: 5px; -webkit-overflow-scrolling: touch; }
    .order-tabs::-webkit-scrollbar { display: none; }
    .order-search input { width: 100%; }
}

/* 订单详情页样式 */
.order-detail-box { }
.order-detail-box .od-progress-box { display: flex; justify-content: space-between; align-items: center; position: relative; padding: 10px 0; }
.order-detail-box .od-step { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; flex: 1; }
.order-detail-box .od-step-icon { width: 36px; height: 36px; border-radius: 50%; background: #f5f5f5; color: #ccc; display: flex; align-items: center; justify-content: center; font-size: 18px; margin-bottom: 8px; transition: all 0.3s; border: 2px solid #f5f5f5; }
.order-detail-box .od-step-label { font-size: 13px; color: #999; font-weight: 500; text-align: center; }
.order-detail-box .od-step.active .od-step-icon { background: #7d5a8a; color: #fff; border-color: #7d5a8a; box-shadow: 0 2px 8px rgba(255,80,0,0.3); }
.order-detail-box .od-step.active .od-step-label { color: #333; font-weight: 700; }
.order-detail-box .od-progress-line-bg { position: absolute; top: 28px; left: 12%; width: 76%; height: 2px; background: #eee; z-index: 1; }
.order-detail-box .od-progress-line-active { position: absolute; top: 28px; left: 12%; height: 2px; background: #7d5a8a; z-index: 1; transition: width 0.5s ease; }
.order-detail-box .od-progress-line-active.w_0{ width:0;}
.order-detail-box .od-progress-line-active.w_1{ width:26%;}
.order-detail-box .od-progress-line-active.w_2{ width:50%;}
.order-detail-box .od-progress-line-active.w_3{ width:77%;}
.order-detail-box .od-progress-line-active.w_4{ width:77%;}
.order-detail-box .od-step .time{ margin-top:5px; color:#999;}

.order-detail-box .od-card { background: #fff; border-bottom: 1px solid #eee; padding: 25px 20px; margin-bottom: 0; }
.order-detail-box .od-card:last-child { border-bottom: none; }
.order-detail-box .od-title { font-size: 16px; font-weight: 700; margin-bottom: 18px; color: #333; display: flex; align-items: center; }
.order-detail-box .od-title::before { content: ''; display: inline-block; width: 4px; height: 16px; background: #7d5a8a; border-radius: 2px; margin-right: 10px; }
/* 地址栏 */
.order-detail-box .od-address-card { display: flex; align-items: flex-start; }
.order-detail-box .od-addr-icon { font-size: 24px; color: #7d5a8a; margin-right: 15px; margin-top: 2px; }
.order-detail-box .od-addr-info { flex: 1; }
.order-detail-box .od-addr-info p { margin: 0; line-height: 1.6; color: #666; font-size: 14px; }
.order-detail-box .od-addr-info .user { font-size: 16px; font-weight: 700; color: #333; margin-bottom: 6px; display: flex; align-items: baseline; }
.order-detail-box .od-addr-info .user .phone { font-weight: 400; font-size: 14px; margin-left: 10px; color: #999; }
/* 商品列表 */
.order-detail-box .od-goods-item { display: flex; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px dashed #eee; }
.order-detail-box .od-goods-item:last-child { margin-bottom: 0; border-bottom: none; padding-bottom: 0; }
.order-detail-box .od-goods-img { width: 90px; height: 90px; border-radius: 4px; overflow: hidden; border: 1px solid #f0f0f0; flex-shrink: 0; margin-right: 15px; background: #f9f9f9; }
.order-detail-box .od-goods-img img { width: 100%; height: 100%; object-fit: cover; }
.order-detail-box .od-goods-info { flex: 1; display: flex; flex-direction: column; justify-content: space-between; min-height: 90px; }
.order-detail-box .od-goods-name { font-size: 14px; color: #333; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 5px; font-weight: 500; }
.order-detail-box .od-goods-spec { font-size: 12px; color: #888; background: #f5f5f5; padding: 2px 8px; border-radius: 4px; display: inline-block; align-self: flex-start; margin-bottom: 5px; }
.order-detail-box .od-goods-price-row { display: flex; justify-content: space-between; align-items: flex-end; }
.order-detail-box .od-price { color: #333; font-weight: 700; font-size: 16px; }
.order-detail-box .od-price small { font-size: 12px; }
.order-detail-box .od-qty { color: #999; font-size: 13px; }
/* 信息行 */
.order-detail-box .od-info-row { display: flex; justify-content: space-between; margin-bottom: 12px; font-size: 13px; color: #666; }
.order-detail-box .od-info-row:last-child { margin-bottom: 0; }
.order-detail-box .od-copy-btn { color: #ff5000; cursor: pointer; margin-left: 8px; font-size: 12px; padding: 2px 6px; background: rgba(255,80,0,0.1); border-radius: 3px; }
/* 金额信息 (靠右) */
.order-detail-box .od-amount-row { display: flex; justify-content: flex-end; align-items: center; margin-bottom: 10px; font-size: 14px; color: #666; }
.order-detail-box .od-amount-label { margin-right: 30px; color: #666; }
.order-detail-box .od-amount-val { width: 120px; text-align: right; color: #333; font-family: Arial, sans-serif; font-weight: 500; }
.order-detail-box .od-total-row { margin-top: 15px; padding-top: 15px; border-top: 1px solid #eee; align-items: baseline; }
.order-detail-box .od-total-label { font-size: 15px; font-weight: 700; color: #333; margin-right: 20px; }
.order-detail-box .od-total-price { color: #ff5000; font-size: 28px; font-weight: 700; font-family: Arial, sans-serif; letter-spacing: -0.5px; }
.order-detail-box .od-total-price span { font-size: 16px; margin-right: 2px; }
/* 底部按钮栏 */
.order-detail-box .od-footer { padding:20px 0; display: flex; justify-content: flex-end; gap: 12px;  }

/* 移动端细微调整 */
@media screen and (max-width: 768px) {
    .order-detail-box { padding-bottom: 70px; }
    .order-detail-box .od-card { padding: 20px 15px; border-bottom: 8px solid #f7f8fa;}
    .order-detail-box .od-card:last-child { border-bottom: none; }
    .order-detail-box .od-footer { padding: 10px 15px; }
    .order-detail-box .od-btn { padding: 0 15px; min-width: 80px; font-size: 13px; height: 34px; line-height: 34px; }
    .order-detail-box .od-step-icon { width: 30px; height: 30px; font-size: 14px; }
    .order-detail-box .od-step-label { font-size: 12px; }
    .order-detail-box .od-progress-line-bg, .order-detail-box .od-progress-line-active { top: 25px; }
}

/***支付页面***/
.pay-select-box { background: #ffffff; border: 1px solid #e0e0e0; border-radius:10px; box-shadow: 0 4px 12px rgba(0,0,0,0.03); margin:50px 0; padding:20px; position: relative; }
.pay-select-box .ht { display: flex; align-items: center; margin-bottom: 30px; }
.pay-select-box .icon-box { width: 50px; height: 50px; margin-right: 20px; }
.pay-select-box .icon-box svg { width: 100%; height: 100%; fill: #765186; } /* 使用指定紫色 */
.pay-select-box .h-tit { font-size: 24px; color: #333; font-weight: 500; }
.pay-select-box .info-box { background-color: #fbf5fd; border: 1px solid #efe6f5; padding: 30px 40px; margin-bottom: 40px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; }
.pay-select-box .info-item { display: flex; align-items: center; font-size: 16px; color: #555; }
.pay-select-box .info-label { margin-right: 10px; color: #888; }
.pay-select-box .info-value { font-weight: 700; color: #333; }
.pay-select-box .amount { color: #d32f2f; font-size: 20px; } /* 金额保留显眼的红色或深色 */
.pay-select-box .divider { height: 1px; background-color: #eeeeee; width: 100%; margin-bottom: 40px; }
.pay-select-box .payment-section-title { font-size: 16px; color: #333; margin-bottom: 20px; font-weight: 600; }
.pay-select-box .payment-options { display: flex; gap: 20px; }
.pay-select-box .pay-card {  border: 2px solid #e0e0e0; border-radius: 8px; padding:0px 25px; height:50px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.2s; background: #fff; position: relative; }
.pay-select-box .pay-card:hover { border-color: #bcaaa4; }
.pay-select-box .pay-card svg { height: 32px; max-width: 120px; }
.pay-select-box input[type="radio"] { display: none; }
.pay-select-box input[id="wechat"]:checked ~ .payment-options .card-wechat { border-color: #09BB07; background-color: #f0fdf4; box-shadow: 0 0 0 1px #09BB07 inset; }
.pay-select-box input[id="alipay"]:checked ~ .payment-options .card-alipay { border-color: #1678ff; background-color: #eff6ff; box-shadow: 0 0 0 1px #1678ff inset; }
.pay-select-box input[id="paypal"]:checked ~ .payment-options .card-paypal { border-color: #003087; background-color: #f0f9ff; box-shadow: 0 0 0 1px #003087 inset; }
.pay-select-box .action-area { margin-top: 40px; text-align: right; }

/* 手机端适配 */
@media (max-width: 768px) {
    .pay-select-box { padding:20px 0; border: none; }
    .pay-select-box .info-box { flex-direction: column; align-items: flex-start; padding: 20px; }
    .pay-select-box .info-item { width: 100%; justify-content: space-between; margin-bottom: 10px; }
    .pay-select-box .payment-options { flex-direction: column; }
    .pay-select-box .action-area { text-align: center; }
}

/***订单评价***/
.review-box {  }
.rv-card { background: #fff; padding: 20px; margin-bottom: 15px; border-radius: 8px; border: 1px solid #eef0f4; box-shadow: 0 2px 8px rgba(0,0,0,0.02); }
.rv-order-info { display: flex; flex-direction: column; gap: 5px; font-size: 13px; color: #666; padding-bottom: 5px; }
.rv-order-row { display: flex; justify-content: space-between; }
.rv-order-label { color: #999; }
.rv-order-val { font-weight: 600; color: #333; font-family: Arial, sans-serif; }
.rv-product-header { display: flex; align-items: flex-start; margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid #f9f9f9; }
.rv-prod-img { width: 50px; height: 50px; border-radius: 4px; overflow: hidden; border: 1px solid #f0f0f0; margin-right: 12px; flex-shrink: 0; }
.rv-prod-img img { width: 100%; height: 100%; object-fit: cover; }
.rv-prod-info { flex: 1; }
.rv-prod-title { font-size: 14px; color: #333; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 3px; font-weight: 500; }
.rv-prod-spec { font-size: 12px; color: #999; }
.rv-rating-box { display: flex; align-items: center; margin-bottom: 20px; }
.rv-rating-label { font-size: 14px; font-weight: 600; margin-right: 15px; color: #333; }
.rv-stars { display: flex; gap: 10px; }
.rv-star-item { font-size: 22px; color: #e0e0e0; cursor: pointer; transition: transform 0.2s; }
.rv-star-item.active { color: #ff5000; } /* 橙色高亮 */
.rv-star-item:active { transform: scale(1.2); }
.rv-rating-text { margin-left: 15px; font-size: 13px; color: #999; min-width: 60px; }
.rv-textarea-box { position: relative; margin-bottom: 20px; background: #fcfcfc; border-radius: 6px; border: 1px solid #eee; padding: 12px; transition: border-color 0.3s; }
.rv-textarea-box:focus-within { border-color: #ff5000; background: #fff; }
.rv-textarea { width: 100%; border: none; background: transparent; height: 80px; resize: none; font-size: 14px; outline: none; line-height: 1.5; color: #333; font-family: inherit; }
.rv-textarea::placeholder { color: #ccc; }
.rv-upload-grid { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 15px; }
.rv-upload-item { width: 70px; height: 70px; border-radius: 4px; border: 1px dashed #ddd; display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; background: #fff; color: #999; transition: all 0.2s; }
.rv-upload-item:hover { border-color: #ff5000; color: #ff5000; }
.rv-upload-item i { font-size: 18px; margin-bottom: 4px; }
.rv-upload-item span { font-size: 10px; }
.rv-img-preview { width: 70px; height: 70px; border-radius: 4px; overflow: hidden; position: relative; border: 1px solid #f0f0f0; }
.rv-img-preview img { width: 100%; height: 100%; object-fit: cover; }
.rv-img-del { position: absolute; top: 0; right: 0; background: rgba(0,0,0,0.5); color: #fff; width: 18px; height: 18px; display: flex; align-items: center; justify-content: center; font-size: 10px; cursor: pointer; }
.rv-anonymous { display: flex; align-items: center; font-size: 13px; color: #666; cursor: pointer; justify-content: flex-end; }
.rv-checkbox { width: 16px; height: 16px; border: 1px solid #ddd; border-radius: 50%; margin-right: 6px; display: flex; align-items: center; justify-content: center; color: transparent; transition: all 0.2s; }
.rv-checkbox.checked { background: #ff5000; border-color: #ff5000; color: #fff; }
.rv-checkbox i { font-size: 10px; }
.rv-btn-area { margin-top: 30px; padding: 0 5px; }
.rv-btn-submit { width: 100%; height: 46px; background: linear-gradient(90deg, #ff9000 0%, #ff5000 100%); color: #fff; border: none; border-radius: 4px; font-size: 16px; font-weight: 600; cursor: pointer; box-shadow: 0 4px 12px rgba(255, 80, 0, 0.2); outline: none; transition: all 0.2s; }
.rv-btn-submit:hover { transform: translateY(-1px); box-shadow: 0 6px 15px rgba(255, 80, 0, 0.3); opacity: 0.95; }
.rv-btn-submit:active { transform: translateY(1px); }
@media screen and (max-width: 768px) {
    .review-box { margin: 0; padding: 15px; }
    .rv-card { border-radius: 0; border: none; margin: 0 -15px 10px -15px; padding: 20px; box-shadow: none; border-bottom: 1px solid #eee; }
    .rv-card:last-child { border-bottom: none; margin-bottom: 0; }
    .rv-btn-submit { border-radius: 23px; } /* 手机端圆角更大 */
}