/* 横幅报价计算器 —— 中国红 · 飘带 */
.c60{
  --a:#b91c1c;
  --a2:#f87171;
  --a-soft:rgba(185,28,28,.10);
  --a-line:rgba(185,28,28,.26);
}

.c60-hero{
  background:
    radial-gradient(700px 300px at 12% 0%, rgba(255,255,255,.8), transparent 60%),
    repeating-linear-gradient(115deg, rgba(185,28,28,.05) 0 2px, transparent 2px 12px),
    linear-gradient(135deg,#fef2f2 0%,#fee2e2 46%,#fff8f8 100%);
}
:root[data-theme="dark"] .c60-hero{
  background:
    radial-gradient(700px 300px at 12% 0%, rgba(185,28,28,.2), transparent 60%),
    repeating-linear-gradient(115deg, rgba(248,113,113,.06) 0 2px, transparent 2px 12px),
    linear-gradient(135deg,#1d0708 0%,#28090b 48%,#0b1322 100%);
}

.bn-art{min-height:200px;}
.bn-ribbon{
  position:relative;
  width:230px;
  height:74px;
  display:grid;
  place-items:center;
  border-radius:6px;
  background:linear-gradient(135deg,#dc2626,#991b1b 72%);
  color:#fef3c7;
  font-size:20px;
  font-weight:900;
  letter-spacing:4px;
  transform:rotate(-3deg);
  box-shadow:0 18px 34px rgba(153,27,27,.32);
  border:2px solid rgba(254,243,199,.55);
}
.bn-ribbon i,
.bn-ribbon b{
  position:absolute;
  top:8px;
  width:38px;
  height:62px;
  background:linear-gradient(180deg,#dc2626,#991b1b);
  z-index:-1;
}
.bn-ribbon i{left:-30px;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,58% 50%);}
.bn-ribbon b{right:-30px;clip-path:polygon(0 0,100% 0,58% 50%,100% 100%,0 100%);}
.bn-art .chip{white-space:nowrap;}
.bn-art .chip.c1{top:6px;left:-4px;}
.bn-art .chip.c2{bottom:4px;right:-8px;}
.bn-art .chip b{color:#b91c1c;}

.c60-metric.is-hero{
  background:linear-gradient(135deg,#dc2626,#7f1d1d 78%);
  box-shadow:0 16px 34px rgba(185,28,28,.3);
}
.c60-segbtn.on{color:#b91c1c;}
.c60-chip.on{background:rgba(185,28,28,.12);border-color:#b91c1c;color:#b91c1c;}
.c60-bar-row .bf{background:linear-gradient(90deg,#f87171,#b91c1c);}

/* 飘带预览 SVG */
.bn-svg{margin-top:16px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--soft);overflow-x:auto;}
.bn-svg svg{display:block;width:100%;height:auto;min-width:300px;}
.bn-svg .bn-cap{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px;font-size:12px;font-weight:800;color:var(--muted);}
.bn-svg .bn-cap span:last-child{color:var(--ink2);}
.bn-svg .bn-cloth{fill:url(#bnClothGrad);stroke:#991b1b;stroke-width:1.4;}
.bn-svg .bn-text{font-size:26px;font-weight:900;fill:#fef3c7;letter-spacing:6px;}
.bn-svg .bn-dim{stroke:#f87171;stroke-width:1.2;}
.bn-svg .bn-dimtext{font-size:11px;fill:#64748b;font-weight:700;}
.bn-svg .bn-tail{fill:#b91c1c;}

/* 材质对比 */
#bnCompareTable tbody tr:nth-child(even) td{background:rgba(185,28,28,.035);}
#bnCompareTable td:first-child{font-weight:800;color:var(--ink);}
#bnCompareTable td{font-variant-numeric:tabular-nums;}
.bn-badge{display:inline-block;padding:1px 7px;border-radius:999px;background:rgba(185,28,28,.1);color:#b91c1c;font-size:11px;font-weight:800;}
#bnBatchInput{min-height:96px;}

@media (max-width:640px){
  .bn-ribbon{width:180px;height:62px;font-size:16px;letter-spacing:2px;}
  .bn-svg{padding:10px;}
  .bn-svg .bn-cap{flex-direction:column;gap:2px;}
  .bn-art{display:none;}
}
