/* ============================================================
   商品卡片简介（2026-09-21 新增）
   「菲区代充 · 质保 1 个月」这类卖点要在首页列表上就能看到，
   只写在详情页等于白写。按约定单独成文件，不动 liuneng.v2.css。
   ============================================================ */

.ln-card-desc {
  margin: -4px 0 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--muted, #6b7280);
  /* 限两行：简介长度不可控，放开会把同一行的卡片撑得参差不齐 */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ------------------------------------------------------------
   同行卡片等高（2026-10-07）
   简介是 1 行还是 2 行不可控，卡片高度就会差一行（实测 337 vs 357），
   库存和价格整行跟着往下错位。
   根因不在 .ln-card —— 它已经有 flex:1 + margin-top:auto 了；
   而是栅格与卡片之间夹了一层 <div class="ln-col">：grid 把 .ln-col
   拉伸到了行高，但卡片没填满它，拉伸就断在这一层。
   ------------------------------------------------------------ */
.ln-goods-grid > .ln-col { display: flex; }
.ln-goods-grid > .ln-col > .ln-card { width: 100%; }

/* ============================================================
   商品详情页 · 描述区排版（2026-10-09）
   原来是一堆裸 <p>：三步操作的 <ol> 序号根本不显示（主题全局压掉了
   列表符号，之前在发货邮件和微信横幅上已经踩过两次），小标题和正文
   一样粗细，链接也没样式，整块读起来就是一片字。
   这里给描述区单独做排版，作用域锁在 .ln-desc 内，不影响其它卡片。
   ============================================================ */

.ln-desc .card-header h5{ font-size:15px; font-weight:800; margin:0; color:var(--ink,#0b0b0c); }
.ln-desc .card-body{ padding:20px 22px 22px; font-size:14.5px; line-height:1.85; color:#374151; }
.ln-desc .card-body > *:first-child{ margin-top:0; }
.ln-desc .card-body > *:last-child{ margin-bottom:0; }
.ln-desc p{ margin:0 0 12px; }
.ln-desc b{ font-weight:700; color:var(--ink,#0b0b0c); }

/* 小标题：加一条品牌色竖线，和正文拉开层级 */
.ln-desc h4{
  margin:22px 0 10px; font-size:14.5px; font-weight:800; color:var(--ink,#0b0b0c);
  padding-left:10px; border-left:3px solid #0b0b0c; line-height:1.4;
}
.ln-desc h4:first-child{ margin-top:0; }

/* 带编号徽章的步骤列表：不依赖 list-style，主题压不掉 */
.ln-desc ol{ counter-reset:lnstep; list-style:none; margin:0 0 14px; padding:0; }
.ln-desc ol > li{
  counter-increment:lnstep; position:relative;
  padding:0 0 0 30px; margin:0 0 9px; line-height:1.8;
}
.ln-desc ol > li::before{
  counter-increment:none; content:counter(lnstep);
  position:absolute; left:0; top:4px;
  width:20px; height:20px; border-radius:50%;
  background:#0b0b0c; color:#fff;
  font-size:11.5px; font-weight:700; line-height:20px; text-align:center;
}
/* 无序要点用圆点 */
.ln-desc ul{ list-style:none; margin:0 0 14px; padding:0; }
.ln-desc ul > li{ position:relative; padding-left:16px; margin:0 0 7px; }
.ln-desc ul > li::before{
  content:""; position:absolute; left:3px; top:11px;
  width:5px; height:5px; border-radius:50%; background:#9ca3af;
}

/* 提示块：重要但不吓人 */
.ln-desc .ln-tip{
  margin:14px 0; padding:12px 14px; border-radius:12px;
  background:#f8fafc; border:1px solid #e7e9ee; color:#334155; font-size:13.5px; line-height:1.75;
}
.ln-desc .ln-tip-warn{ background:#fffbeb; border-color:#fde68a; color:#92400e; }

/* 底部操作链接做成胶囊按钮 */
.ln-desc .ln-acts{ display:flex; flex-wrap:wrap; gap:10px; margin:16px 0 12px; }
.ln-desc .ln-acts a{
  display:inline-flex; align-items:center; gap:6px;
  padding:9px 16px; border-radius:999px; font-size:13.5px; font-weight:600;
  text-decoration:none; transition:.18s ease;
}
.ln-desc .ln-acts a.primary{ background:#0b0b0c; color:#fff; }
.ln-desc .ln-acts a.primary:hover{ opacity:.88; }
.ln-desc .ln-acts a.ghost{ background:#fff; color:#0b0b0c; border:1px solid #e7e9ee; }
.ln-desc .ln-acts a.ghost:hover{ border-color:#c8ccd4; }

/* 落款（质保、售后那行） */
.ln-desc .ln-foot{
  margin:16px 0 0; padding-top:14px; border-top:1px solid #eff1f5;
  font-size:13px; color:#6b7280; line-height:1.8;
}

@media (max-width:480px){
  .ln-desc .card-body{ padding:16px 15px 18px; font-size:14px; }
  .ln-desc .ln-acts a{ flex:1 1 100%; justify-content:center; }
}