/* Гайд «Безопасная покупка» (/bezopasnaya-pokupka/).
   Подключается после home-v2.css и guide.css. Здесь только своё: риски, шаги, ошибки. */

/* Кадры из выпусков: лёгкий кроп, чтобы в кадр не попадал интерфейс плеера */
.bz-shot{overflow:hidden;border-radius:var(--r-l);aspect-ratio:16/9;background:var(--soft)}
.bz-shot img{width:100%;height:100%;object-fit:cover}
.bz-shot img[src*="contract-closeup"]{transform:scale(1.2);transform-origin:35% 15%}
.bz-shot--wide{margin-top:20px;border-radius:var(--r-xl);aspect-ratio:2.2}

/* Списки и врезки */
.bz-list{list-style:none;margin:18px 0 0;padding:0}
.bz-list li{position:relative;padding-left:22px;color:var(--muted);font-size:15.5px;line-height:1.6}
.bz-list li+li{margin-top:10px}
.bz-list li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--blue)}
.bz-list strong,.bz-ol strong,.bz-note strong{color:var(--ink);font-weight:600}
.bz-list .bz-mark{color:var(--blue)}
.bz-note{padding:22px 26px;border-radius:var(--r-m);background:var(--ice)}
.bz-note-label{margin-bottom:8px;color:var(--blue);font-size:13px;font-weight:600}
.bz-note p+p,.bz-note--warn p{font-size:15.5px;line-height:1.6}
.bz-note--warn{display:grid;grid-template-columns:24px minmax(0,1fr);gap:14px;align-items:start}
.bz-note--warn svg{width:24px;height:24px;margin-top:1px;fill:none;stroke:var(--blue);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* Риски */
.bz-risks{display:grid;gap:20px}
.bz-risk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);gap:40px;padding:36px;border-radius:var(--r-l);background:#fff}
.bz-num{display:flex;align-items:baseline;gap:8px;margin-bottom:14px;color:var(--muted);font-size:14px;font-weight:600}
.bz-num span{color:var(--blue);font-variant-numeric:tabular-nums}
.bz-risk h3{font-size:clamp(22px,2.2vw,28px);margin-bottom:16px}
.bz-risk-copy>p{color:var(--muted);font-size:16px;line-height:1.65}
.bz-risk-copy>p+p{margin-top:12px}
.bz-risk-side{display:flex;flex-direction:column;gap:16px;min-width:0}
.bz-risk .bz-shot{border-radius:var(--r-m)}

/* Шаги */
.bz-steps{display:grid;gap:20px}
.bz-step{display:grid;grid-template-columns:56px minmax(0,1fr);gap:24px}
.bz-step-dot{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--blue);color:#fff;font-size:20px;font-weight:600;line-height:1}
.bz-step-body{min-width:0;padding:32px 36px;border-radius:var(--r-l);background:var(--soft)}
.bz-step-body>p{margin-top:12px;max-width:760px;color:var(--muted);font-size:16px;line-height:1.65}
.bz-step-body .bz-shot{margin-top:24px;aspect-ratio:2.1}
.bz-step-body .bz-note{margin-top:20px;background:#fff}
.bz-step-body .gd-table-wrap{margin-top:20px}
.bz-ol{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.bz-ol li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:14px;padding:20px 22px;border-radius:var(--r-m);background:#fff;color:var(--muted);font-size:15.5px;line-height:1.6}
.bz-ol-num{display:grid;place-items:center;width:32px;height:32px;border:1px solid #9dbccb;border-radius:50%;color:var(--blue);font-size:14px;font-weight:600;line-height:1}

/* Ошибки */
.bz-mistakes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px}
.bz-mistake{grid-column:span 2;padding:32px;border-radius:var(--r-l);background:#fff}
.bz-mistake:nth-child(n+4){grid-column:span 3}
.bz-mistake h3{margin-bottom:12px}
.bz-mistake p:last-child{color:var(--muted);font-size:15.5px;line-height:1.6}

@media(max-width:900px){
  .bz-risk{grid-template-columns:1fr;gap:24px;padding:28px}
  .bz-ol{grid-template-columns:1fr}
  .bz-mistakes{grid-template-columns:1fr 1fr}
  .bz-mistake,.bz-mistake:nth-child(n+4){grid-column:auto}
  .bz-mistake:last-child{grid-column:1/-1}
}
@media(max-width:720px){
  .bz-shot--wide{margin-top:12px;aspect-ratio:1.6}
  .bz-risks,.bz-steps{gap:12px}
  .bz-risk{padding:24px}
  .bz-step{grid-template-columns:1fr;gap:12px}
  .bz-step+.bz-step{margin-top:12px}
  .bz-step-dot{width:44px;height:44px;font-size:17px}
  .bz-step-body{padding:24px}
  .bz-step-body .bz-shot{aspect-ratio:16/9}
  .bz-step-body .gd-table tr{background:#fff}
  .bz-ol li{padding:18px}
  .bz-mistakes{grid-template-columns:1fr;gap:12px}
  .bz-mistake{padding:24px}
  .bz-note{padding:20px 22px}
}
