:root{
  --text:#2b2f36;
  --wine:#9b2c2c;
  --accent:#b34a4a;
  --yellow:#ffcc00;
  --radius:1rem;
}
html,body{background:#fff;color:var(--text);font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;}
.container-narrow{max-width:980px;margin:0 auto;}
a{color:var(--accent);text-decoration:none;border-bottom:1px dashed transparent;transition:all .15s}
a:hover{border-bottom:1px dashed var(--accent)}
.shadow-soft{box-shadow:0 8px 30px rgba(0,0,0,.06);}
.card-soft{border:1px solid #eee;border-radius:var(--radius);padding:1.25rem}
.video-frame{border:1px solid #eee;border-radius:1rem;overflow:hidden;background:#000}
.btn-primary{padding:.8rem 1.25rem;border-radius:.8rem;font-weight:600}
.btn-link-like{background:transparent;border:1px solid #e5e7eb;border-radius:.8rem;padding:.7rem 1rem}
.muted{color:#64748b}
.hero{padding:48px 0 20px}
.hero-title{font-weight:800;letter-spacing:-.02em;line-height:1.12;margin:0}
.hero-sub{font-weight:800;letter-spacing:-.02em;margin:.35rem 0 0}
.hero-sub .hl{background:linear-gradient(180deg,transparent 70%, #f4f6ff 0);padding:.05em .2em;border-radius:.3em;}
.hero-price{color:var(--wine);font-weight:800;margin:.5rem 0 0}
@media (min-width: 992px){
  .hero-title{font-size:2.5rem}
  .hero-sub{font-size:2rem}
  .hero-price{font-size:1.4rem}
}
@media (max-width: 991.98px){
  .hero-title{font-size:1.8rem}
  .hero-sub{font-size:1.35rem}
  .hero-price{font-size:1.05rem}
}
.section{padding:48px 0}
.how h3{font-weight:800;text-align:center;margin-bottom:18px}
.how .steps{display:grid;gap:12px}
@media (min-width:768px){ .how .steps{grid-template-columns:repeat(4,1fr)} }
@media (max-width:767.98px){ .how .steps{grid-template-columns:repeat(2,1fr)} }
.step{border:1px solid #eee;border-radius:1rem;padding:14px;text-align:center}
.step h5{margin:.4rem 0 .2rem;font-weight:700}
.accent-wine{color:var(--wine);font-weight:700}
.price-old{color:var(--wine);text-decoration:line-through;font-weight:700;margin-right:.5rem}
.price-new{font-weight:800;font-size:1.5rem}
.pricing .table{--bs-table-bg:#fff}
.pricing .table thead{background:#111827;color:#fff}
.pricing .table th,.pricing .table td{vertical-align:middle}
.pricing .table.table-sm> :not(caption)>*>*{padding:.55rem .65rem}
.per-video{color:#94a3b8}
@media (max-width:575.98px){
  .per-video{display:none}
  .pkg{width:38%} .vms{width:18%} .prc{width:44%}
}
.banner-bonus{border:2px dashed var(--yellow);border-radius:1rem;padding:1rem 1.25rem;background:#fffdf4}
.footer-min{padding:32px 0;color:#94a3b8;font-size:.95rem;text-align:center}
/* WORKFLOW */
.workflow .wf-list{list-style:none;padding-left:0;margin:0;display:grid;gap:12px}
@media (min-width:768px){ .workflow .wf-list{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:992px){ .workflow .wf-list{ grid-template-columns:repeat(3,1fr); } }
.workflow .wf-item{display:flex;align-items:flex-start;gap:12px;border:1px solid #eee;border-radius:1rem;padding:14px}
.workflow .num{flex:0 0 auto;width:34px;height:34px;line-height:34px;text-align:center;border-radius:999px;font-weight:800;color:#fff;background:var(--wine)}
.workflow .txt{color:var(--text)}
.workflow .txt em{color:#64748b;font-style:normal}


/* Вертикальные видео 9:16 */
.ratio-9x16 { --bs-aspect-ratio: 177.7777%; } /* Bootstrap ratio helper */
.examples .grid { display:grid; gap:12px; }
@media (min-width: 768px){ .examples .grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1200px){ .examples .grid { grid-template-columns: repeat(3,1fr); } }