/* ==========================================================================
   price-dianzi.html · 商城报价 —— 左右错落堆叠卡
   ========================================================================== */

/* ---------- 页首 ---------- */
.d-hero{padding:140px 0 40px}
.d-hero-in{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center}
.d-hero-copy h1{margin:14px 0 18px}
.d-hero-desc{color:var(--ink-2);font-size:15.5px;max-width:540px}
.d-hero-media img{border-radius:var(--r);box-shadow:var(--shadow);width:100%;height:auto}

/* ---------- 错落堆叠卡 ---------- */
.d-tiers{padding:30px 0 10px}
.d-tier{display:grid;grid-template-columns:240px 1fr;gap:36px;background:var(--card);border:1px solid var(--line-2);border-radius:var(--r);padding:36px 40px;margin-bottom:24px;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.d-tier:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.d-tier-offset{margin-left:64px}
.d-tier-price{border-right:1px dashed var(--line);display:flex;flex-direction:column;justify-content:center}
.d-tier-price b{font-family:var(--font-serif);font-size:42px;color:var(--brown);line-height:1.1}
.d-tier-price span{color:var(--muted);font-size:13.5px}
.d-tier-body h2{font-size:22px;margin-bottom:8px}
.d-tier-for{font-size:14px;color:var(--brown-soft);margin-bottom:16px}
.d-tier-list{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
.d-tier-list li{font-size:14px;color:var(--ink-2);padding-left:16px;position:relative}
.d-tier-list li::before{content:"";position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;background:var(--brown-soft)}
.d-tier-note{text-align:center;color:var(--muted);font-size:13.5px;margin-top:18px}

/* ---------- 功能明细 ---------- */
.d-feats{padding:50px 0 10px}
.d-feats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.d-feat{background:var(--brown-bg);border-radius:var(--r);padding:26px 24px}
.d-feat b{font-family:var(--font-serif);font-size:18px;color:var(--brown-deep);display:block;margin-bottom:8px}
.d-feat p{font-size:14px;color:var(--ink-2)}

/* ---------- 对比表 ---------- */
.d-cmp{padding:50px 0}
.d-cmp-scroll{overflow-x:auto;border-radius:var(--r)}

/* ---------- FAQ ---------- */
.d-faq{padding:20px 0}
.d-faq-in{max-width:860px;margin:0 auto}
.d-faq-list{display:grid;gap:14px}
.d-faq-list details{background:var(--card);border:1px solid var(--line-2);border-radius:var(--r);padding:18px 24px}
.d-faq-list summary{cursor:pointer;font-weight:600;color:var(--brown-deep)}
.d-faq-list p{color:var(--ink-2);font-size:14.5px;margin-top:10px}

/* ---------- CTA ---------- */
.d-cta{background:var(--brown-deep);border-radius:26px;margin:20px 28px 0;padding:60px 28px;text-align:center}
.d-cta h2{color:#fff;margin:0 0 24px}
.d-cta-acts{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:20px}
.d-cta p{color:rgba(255,255,255,.65);font-size:14px}
.d-cta p a{color:#fff;text-decoration:underline;text-underline-offset:3px}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .d-hero-in{grid-template-columns:1fr;gap:30px}
  .d-tier{grid-template-columns:1fr;gap:18px}
  .d-tier-offset{margin-left:0}
  .d-tier-price{border-right:0;border-bottom:1px dashed var(--line);flex-direction:row;align-items:baseline;gap:12px;padding-bottom:14px}
  .d-feats-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .d-feats-grid,.d-tier-list{grid-template-columns:1fr}
  .d-cta{margin:16px 16px 0}
}