/* hocvothuat — canh đều/gọn theo mockup (10-11; _canh/apply.py). Ảnh người cắt lại từ .raw đủ đầu (canh_hook.py + recut.json). */
/* "Đồ tập võ": MỘT banner liền nền (card_split) — nền thẻ = đúng màu nền ảnh (227,234,244), ảnh không khung, mép ảnh mờ dần vào nền */
.vh-gear > div { background: rgb(227, 234, 244); position: relative; }
.vh-gear img { mix-blend-mode: normal; border: 0; border-radius: 0; box-shadow: none;
  -webkit-mask-image: radial-gradient(ellipse 72% 70% at 50% 50%, #000 62%, transparent 100%); mask-image: radial-gradient(ellipse 72% 70% at 50% 50%, #000 62%, transparent 100%); }
/* ảnh tròn "Lợi ích": giữ đỉnh đầu */
img[src*="hv-ben"] { object-position: 50% 12% !important; }
img[src*="hv-clb-"] { object-position: 50% 28% !important; }
img[src*="hv-mon-"] { object-position: 50% 18% !important; }
img[src*="hv-av-"] { object-position: 50% 12% !important; }
.hv-fee p { margin-bottom: 0; }
.vh-btn, .hv-btn, a.vh-tbl-b, .vh-tbl a { background-color: #0a8fc9 !important; border-color: #0a8fc9 !important; }
@media (min-width: 850px) {
  .vh-gear > div { padding: 22px 0 22px 34px; min-height: 240px; }
  .vh-gear > div > div:first-child { flex: 0 0 42%; }
  .vh-gear h3 { white-space: nowrap; font-size: 30px; }
  .vh-hd-c h2 { font-size: 36px; }
  .hv-art-b p { font-size: 15.5px; line-height: 1.5; }
  /* "Đồng hành cùng con": như mockup — mục canh giữa, số + icon trên một hàng, đường nối giữa các bước */
  .hv-steps-i > div { text-align: center; }
  .hv-steps-i > div:not(:last-child)::after { content: ""; position: absolute; top: 29px; left: calc(50% + 72px); right: calc(-50% + 40px); border-top: 2px solid #cfe3f1; }
  .hv-steps-i i { margin-right: 8px; }
  .hv-steps-i img { width: 58px; height: 58px; }
  .hv-steps-i b { margin-top: 10px; }
  .hv-steps-i span { display: block; max-width: 230px; margin: 0 auto; }
  .vh-mon-sec, section.vh-mon-sec { padding-bottom: 34px !important; }
  .vh-gear img { width: 58%; max-width: none; align-self: stretch; object-fit: contain; }
  /* footer gọn như mockup (cao ~264px) */
  .b9-ft-in { padding: 28px 20px 16px; }
  .b9-ft li { margin-bottom: 5px; }
  .b9-ft-copy { padding: 10px 20px 12px; }
}
@media (max-width: 849px) {
  .vh-gear > div { flex-direction: column; align-items: flex-start; }
  .vh-gear img { width: 100%; max-width: none; margin-top: 10px; }
  .vh-gear .vh-btn { white-space: nowrap; }
}
