/* assets/css/sections/pain.css — 问题陈述：把读者正在经历的麻烦摆出来，再给方案。
   与 capabilities 区共用 .card-grid，这里只补"每条问题都指向一个后果"的排版。 */

.pain .sec-head{ margin-bottom:44px; }
.pain-grid{ align-items:stretch; }

/* 问题卡：左侧一条朱砂竖线，视觉上比能力卡更"警告" */
.pain-card{
  position:relative; padding:26px 24px 24px 26px;
  background:var(--surface); border:1px solid var(--line);
}
.pain-card::before{
  content:""; position:absolute; left:-1px; top:-1px; bottom:-1px; width:3px;
  background:var(--cinnabar);
}
.pain-card h3{ font-size:17.5px; font-weight:700; }
.pain-card p{ margin-top:12px; font-size:14.5px; color:var(--muted); }
.pain-card .pain-cost{
  display:block; margin-top:16px; padding-top:14px;
  border-top:1px solid var(--line); font-size:13px; color:var(--cinnabar);
}

@media (max-width:1020px){
  .pain-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:680px){
  .pain-grid{ grid-template-columns:1fr; }
}
