@charset "utf-8";
/* 姓名配对 · 新版样式（复刻 bznmpd 落地页，粉色主题）
   设计稿宽度 750px，1rem = 视口宽/7.5（最大 100px） */

html.pd-html {
  font-size: calc(min(100vw, 750px) * 0.13333);
  -webkit-text-size-adjust: 100%;
}

body.pd-body {
  margin: 0 auto;
  width: 100%;
  max-width: 750px;
  min-height: 100%;
  background-color: #ff99ac;
  color: #4a4a4a;
  font-family: PingFang SC, Lantinghei SC, Helvetica Neue, Helvetica, Arial, Microsoft YaHei, WenQuanYi Micro Hei, sans-serif;
  font-size: 0.32rem;
  overflow-x: hidden;
}
body.pd-body * { box-sizing: border-box; }
body.pd-body img { display: block; max-width: 100%; }
body.pd-body a { color: #ff607e; text-decoration: none; }
body.pd-body p { margin: 0; }
body.pd-body button {
  -moz-appearance: none;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
}

.pd-page {
  position: relative;
  width: 7.5rem;
  margin: 0 auto;
  min-height: 100vh;
  background-color: #ff99ac;
}

/* ---------------- 填写页 ---------------- */
.pd-index {
  position: relative;
  width: 7.5rem;
  margin: 0 auto;
  padding-top: 7.38rem;
  padding-bottom: 0.6rem;
  background-color: #ff99ac;
  background-image: url(images/banner.jpg);
  background-repeat: no-repeat;
  background-size: 100% auto;
}

/* 顶部「最近订单」提示条（有历史订单时才出现，对应参考页 .history） */
.pd-history {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 7.5rem;
  height: 0.8rem;
  margin: 0 auto;
  padding: 0 0.2rem;
  background-color: rgba(84, 64, 28, 0.8);
  color: #fff;
  font-size: 0.26rem;
  z-index: 12;
}
.pd-history .pd-h-left { display: flex; align-items: center; height: 100%; }
.pd-history .pd-h-close {
  width: 0.4rem;
  height: 0.4rem;
  padding: 0;
  border: 0;
  background: transparent;
  line-height: 0;
}
.pd-history .pd-h-left img { width: 0.4rem; height: 0.4rem; }
.pd-history .pd-h-left p { margin-left: 0.2rem; }
.pd-history .pd-h-btn {
  width: 1.7rem;
  height: 0.5rem;
  line-height: 0.53rem;
  border-radius: 0.5rem;
  background-color: #ff607e;
  color: #fff;
  text-align: center;
}

.pd-info1 {
  position: absolute;
  left: 0;
  right: 0;
  top: 2.1rem;
  width: 6.43rem;
  height: 0.71rem;
  margin: auto;
}
.pd-info2 {
  position: absolute;
  left: 0;
  top: 2.9rem;
  width: 100%;
  padding-bottom: 0.2rem;
  color: #fdbfc2;
  font-size: 0.24rem;
  text-align: center;
  opacity: 0.8;
  transform: scale(0.9);
}

.pd-form {
  width: 7.5rem;
  height: 5.3rem;
  overflow: hidden;
  background-image: url(images/form.png);
  background-repeat: no-repeat;
  background-size: 7.5rem 5.3rem;
}
.pd-form input[type="text"] {
  -moz-appearance: none;
  appearance: none;
  -webkit-appearance: none;
  display: block;
  width: 2.5rem;
  height: 0.6rem;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  outline: none;
  background-color: #f2f2f2;
  box-shadow: none;
  font-size: 0.32rem;
  text-align: center;
  transform: translate(0.2rem);
}
.pd-form input[type="text"].pd-name1 { margin-top: 1.64rem; }
.pd-form input[type="text"].pd-name2 { margin-top: 0.75rem; }

.pd-nowgo {
  display: block;
  width: 6.9rem;
  height: 1.17rem;
  margin: 0.25rem auto 0.41rem;
  padding: 0;
  border: 0;
  outline: none;
  background: transparent;
  box-shadow: none;
}
.pd-nowgo:disabled { opacity: 0.75; }
.pd-nowgo img { width: 100%; height: 100%; }

.pd-xieyi {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 0.26rem;
}
.pd-xieyi .pd-radio {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.22rem;
  height: 0.22rem;
  margin-right: 0.1rem;
  padding: 0;
  border: 1px solid #fff;
  border-radius: 0.03rem;
  background-color: transparent;
}
.pd-xieyi .pd-radio.pd-actives { background-color: #fff; }
.pd-xieyi .pd-radio.pd-actives::after {
  content: "";
  display: block;
  width: 0.08rem;
  height: 0.13rem;
  border: solid #000;
  border-width: 0 0.03rem 0.03rem 0;
  transform: rotate(45deg) translate(-0.01rem, -0.01rem);
}
.pd-xieyi a { color: #ff607e; text-decoration: underline; }

/* 白卡片：付款后可看内容 */
.pd-bottom {
  width: 6.9rem;
  margin: 0.3rem auto 0;
  padding-bottom: 0.3rem;
  border-radius: 0.1rem;
  background-color: #fff;
}
.pd-headimg {
  width: 100%;
  height: 0.96rem;
  margin: 0;
  padding: 0;
  color: #e55055;
  font-size: 0.35rem;
  font-weight: normal;
  line-height: 0.96rem;
  text-align: center;
  background-image: linear-gradient(90deg, transparent 0%, rgba(229, 80, 85, 0.14) 18%, rgba(255, 255, 255, 0.86) 50%, rgba(229, 80, 85, 0.14) 82%, transparent 100%), linear-gradient(90deg, transparent 0%, #f7a0a5 28%, #e55055 50%, #f7a0a5 72%, transparent 100%);
  background-size: 100% 0.72rem, 70% 0.02rem;
  background-position: center center, center bottom;
  background-repeat: no-repeat;
}
.pd-namepei {
  position: relative;
  display: flex;
  justify-content: space-between;
  padding: 0.3rem;
}
.pd-namepei .pd-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 2.54rem;
  height: 1.8rem;
  border-radius: 0.13rem;
  font-size: 0.3rem;
  font-weight: 700;
}
.pd-namepei .pd-item img { width: 0.42rem; height: 0.42rem; }
.pd-namepei .pd-item span { margin-top: 0.2rem; }
.pd-namepei .pd-girl { color: #d36271; background: #ffe6e8; }
.pd-namepei .pd-girl img { width: 0.39rem; height: 0.39rem; }
.pd-namepei .pd-boy { color: #5a89da; background: #e3eeff; }
.pd-namepei .pd-cent {
  position: absolute;
  left: 50%;
  top: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%);
}
.pd-namepei .pd-cent img { width: 1.8rem; height: 1.8rem; }
.pd-namepei .pd-cent span {
  position: absolute;
  top: 0.88rem;
  color: #fff;
  font-size: 0.24rem;
}

.pd-con-first,
.pd-con-item {
  width: 6.3rem;
  margin: 0 auto;
  border-radius: 0.26rem;
  background: #f4f4f4;
}
.pd-con-item { position: relative; margin-top: 0.3rem; }
.pd-con-first .pd-title,
.pd-con-item .pd-title {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 0.2rem;
}
.pd-con-first .pd-title span,
.pd-con-item .pd-title span {
  margin: 0 0.25rem;
  color: #d77587;
  font-size: 0.34rem;
  font-weight: 700;
}
.pd-con-first .pd-title img,
.pd-con-item .pd-title img { width: 0.3rem; height: 0.3rem; }
.pd-xinlist {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 1.18rem;
  padding: 0.26rem 0 0.34rem;
  gap: 0.12rem;
}
.pd-xinlist img { width: 0.42rem; height: 0.42rem; padding: 0; }
.pd-con-item .pd-mohu { width: 100%; margin-top: 0.3rem; padding-bottom: 0.3rem; }
.pd-con-item .pd-con-con {
  position: absolute;
  left: 0.31rem;
  top: 1.68rem;
  width: 5.7rem;
  padding: 0.4rem;
  border-radius: 0.13rem;
  background-color: #fff;
  color: #4a4a4a;
  font-size: 0.3rem;
}
.pd-con-item .pd-con-con p { text-align: center; }

/* 底部信息（订单号 → 售后客服 → 诚信/阿里云 → 备案），两页共用，整体居中 */
.pd-icp {
  width: 7.5rem;
  margin: 0 auto;
  padding: 0.26rem 0 0.1rem;
  color: #fff;
  font-size: 0.26rem;
  line-height: 1.7;
  text-align: center;
}
.pd-icp p { text-align: center; }
.pd-icp .pd-oline { font-size: 0.26rem; opacity: 0.95; }
.pd-icp .pd-tips { font-size: 0.26rem; opacity: 0.95; }
.pd-icp .pd-dim { opacity: 0.85; margin-right: 0.04rem; }
body.pd-body .pd-icp a { color: #fff; text-decoration: underline; }
/* 徽标按站内原样尺寸：诚信 100% 宽、阿里云 50% 宽 */
.pd-icp .pd-trust { padding-top: 0.14rem; }
.pd-icp .pd-trust img { display: block; margin: 0 auto; }
.pd-icp .pd-trust .pd-trust-xin { width: 100%; }
.pd-icp .pd-trust .pd-trust-al { width: 50%; margin-top: 0.12rem; }

/* 订单查询悬浮入口（参考页右侧「我的订单」） */
.pd-orders {
  position: fixed;
  right: 0;
  top: 3rem;
  width: 0.52rem;
  height: 2.15rem;
  background-image: url(images/myorder.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  z-index: 20;
}

/* 滚动后出现的底部主按钮（参考页 .scrollBtn） */
.pd-scroll-btn {
  position: fixed;
  left: 50%;
  bottom: 0;
  z-index: 30;
  display: none;
  align-items: center;
  justify-content: center;
  width: 7.5rem;
  height: 1.4rem;
  padding: 0;
  border: 0;
  background-color: rgba(237, 118, 140, 0.8);
  box-shadow: none;
  outline: none;
  transform: translate(-50%);
}
.pd-scroll-btn.pd-show { display: flex; }
.pd-scroll-btn img { width: 6.9rem; height: 1.17rem; margin: 0 auto; }

/* 轻提示 */
.pd-toast {
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 50;
  max-width: 5rem;
  padding: 0.2rem;
  border-radius: 0.15rem;
  background-color: rgba(0, 0, 0, 0.7);
  color: #fff;
  font-size: 0.28rem;
  line-height: 1.4;
  text-align: center;
  transform: translate(-50%, -50%);
}

/* 备案信息（全站输出过滤器自动追加，这里只调成深粉底上的白字） */
#site_beian_footer p,
#site_beian_footer p a,
#site_beian_footer p span { color: rgba(255, 255, 255, 0.85) !important; }

/* 隐私协议弹窗 */
.pd-proto-mask {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 0.3rem;
  background-color: rgba(0, 0, 0, 0.6);
}
.pd-proto-mask.pd-show { display: flex; }
.pd-proto {
  position: relative;
  width: 6.4rem;
  max-height: 80vh;
  padding: 0.5rem 0.4rem 0.3rem;
  border-radius: 0.2rem;
  background-color: #fff;
  color: #4a4a4a;
}
.pd-proto .pd-proto-close {
  position: absolute;
  right: 0.2rem;
  top: 0.15rem;
  width: 0.5rem;
  height: 0.5rem;
  color: #999;
  font-size: 0.4rem;
  line-height: 0.5rem;
  text-align: center;
}
.pd-proto .pd-proto-body {
  max-height: calc(80vh - 0.9rem);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  font-size: 0.26rem;
  line-height: 1.75;
}
.pd-proto .pd-proto-body h2 {
  margin: 0.24rem 0 0.08rem;
  color: #d3546a;
  font-size: 0.3rem;
}
.pd-proto .pd-proto-body h3 {
  margin: 0.16rem 0 0.06rem;
  color: #4a4a4a;
  font-size: 0.28rem;
}
.pd-proto .pd-proto-body p { margin: 0.08rem 0; }
.pd-proto .pd-proto-body em { font-style: normal; color: #d3546a; }

/* ---------------- 下单 / 支付页（复刻 bznmpd /pay） ---------------- */
body.pd-body-pay { background-color: #febcc9; }
.pd-paywrap {
  position: relative;
  width: 7.5rem;
  margin: 0 auto;
  min-height: 100vh;
  padding-bottom: 1.2rem;
  background-color: #febcc9;
}

/* 头部插图 + 白色数据条 */
.pd-head {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 7.5rem;
  height: 4.82rem;
  overflow: hidden;
}
.pd-head > img {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 0;
  width: 100%;
}
.pd-hcontent {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 6.08rem;
  height: 1.16rem;
  margin-bottom: 0.3rem;
  border-radius: 0.13rem;
  background-color: #fff;
  box-shadow: 0 0.06rem 0.16rem rgba(214, 85, 111, 0.1);
  overflow: visible;
}
.pd-hcontent p {
  position: relative;
  z-index: 5;
  width: 100%;
  margin: 0;
  color: #2d3442;
  font-size: 0.26rem;
  line-height: 0.36rem;
  text-align: center;
  white-space: nowrap;
}
.pd-hcontent p span { color: #ff3e61; }
.pd-hcontent .pd-div1,
.pd-hcontent .pd-div2 {
  position: absolute;
  border-radius: 0.13rem;
  background: #fff;
  pointer-events: none;
}
.pd-hcontent .pd-div1 {
  left: -0.4rem;
  width: 6.88rem;
  height: 0.76rem;
  opacity: 0.3;
  z-index: 1;
}
.pd-hcontent .pd-div2 {
  left: -0.21rem;
  width: 6.5rem;
  height: 0.96rem;
  opacity: 0.7;
  z-index: 2;
}

/* 价格 / 倒计时 / 支付按钮卡片 */
.pd-center {
  width: 6.9rem;
  margin: 0 auto;
  padding-bottom: 0.01rem;
  border-radius: 0.1rem;
  background-color: #fff;
}
.pd-headimg--compact {
  height: auto;
  min-height: 0.96rem;
  padding: 0.16rem 0.24rem;
  font-size: 0.27rem;
  line-height: 0.37rem;
}
.pd-timer {
  display: flex;
  justify-content: space-between;
  width: 6.3rem;
  margin: 0.3rem;
  padding-bottom: 0.1rem;
  border-bottom: 1px solid #f1f1f1;
  font-size: 0.24rem;
}
.pd-timer .pd-tleft { flex: 0 1 auto; min-width: 0; margin-right: 0.16rem; text-align: left; }
.pd-timer .pd-tright { flex: 0 0 auto; margin-top: 0.25rem; text-align: right; }
.pd-timer .pd-price {
  display: block;
  margin-bottom: 0.15rem;
  padding: 0.1rem 0.2rem;
  border-radius: 0.13rem;
  background-color: #e55055;
  color: #fff;
  font-size: 0.28rem;
}
.pd-timer .pd-yuan { color: #919ba2; text-decoration: line-through; }
.pd-timer .pd-timetext { color: #4a4a4a; }
.pd-timer .pd-time {
  display: block;
  margin-top: 0.1rem;
  color: #e55055;
  font-size: 0.28rem;
}

body.pd-body a.pd-paybtn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5.7rem;
  margin: 0 auto;
  padding: 0.2rem;
  border-radius: 300px;
  background-color: #2aa339;
  color: #fff;
  font-size: 0.36rem;
  text-decoration: none;
}
body.pd-body .pd-paybtn .pd-wx { width: 0.6rem; margin-right: 0.1rem; }
body.pd-body a.pd-paybtn.pd-paybtn-zfb { margin-top: 0.24rem; background-color: #1677ff; }
body.pd-body .pd-paybtn.pd-paybtn-zfb .pd-wx { display: none; }
.pd-breath {
  overflow: hidden;
  box-shadow: 0 0.12rem 0.28rem rgba(7, 193, 96, 0.32);
  animation: pdBreath 1.45s ease-in-out infinite;
  will-change: transform, box-shadow;
}
.pd-breath::after {
  content: "";
  position: absolute;
  top: -45%;
  bottom: -45%;
  left: -60%;
  width: 46%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.45), transparent);
  transform: rotate(18deg);
  animation: pdShine 2.6s ease-in-out infinite;
  pointer-events: none;
}
@keyframes pdBreath {
  0%, 100% { transform: scale(1); box-shadow: 0 0.12rem 0.28rem rgba(7, 193, 96, 0.32); }
  50% { transform: scale(1.045); box-shadow: 0 0.18rem 0.38rem rgba(7, 193, 96, 0.48); }
}
@keyframes pdShine {
  0% { left: -60%; }
  45%, 100% { left: 125%; }
}

.pd-rz { margin: 0.4rem; }
.pd-rz img { width: 5rem; margin: 0.1rem auto; }
.pd-rz p { color: #00b30d; font-size: 0.24rem; text-align: center; }

/* 付款后可见内容预览卡片 */
.pd-bottom2 {
  width: 6.9rem;
  margin: 0.3rem auto 0;
  padding-bottom: 0.3rem;
  border-radius: 0.1rem;
  background-color: #fff;
}

/* 支付页底部信息：浅粉底上改用深玫红字，保证可读 */
.pd-icp--pay { color: #8c2f45; }
body.pd-body .pd-icp--pay a { color: #8c2f45; }

/* 滚动后的固定支付条 */
.pd-scrollbtn {
  position: fixed;
  left: 50%;
  bottom: 0;
  z-index: 30;
  display: none;
  align-items: center;
  justify-content: center;
  width: 7.5rem;
  height: 1.2rem;
  background: rgba(254, 188, 201, 0.96);
  transform: translateX(-50%);
}
.pd-scrollbtn.pd-show { display: flex; }
.pd-scrollbtn .pd-scrollbtn-inner {
  width: 6.8rem;
  height: 0.9rem;
  border-radius: 100px;
  background: #e55055;
  color: #fff;
  font-size: 0.38rem;
  line-height: 0.9rem;
  text-align: center;
}