/* Nhóm trang tem (tem_*) — chỉ bố cục riêng của nhóm; mọi khối còn lại dùng component trong components.css.
   Nạp qua {% block page_css %} (trước components.css). */

/* Hai ảnh điện thoại cạnh nhau (tem_chong_hang_gia): không kéo giãn, mỗi ảnh tối đa 360px cao */
.vn-tem-phones { display: flex; align-items: center; justify-content: center; gap: var(--vn-space-4); }
.vn-split__media .vn-tem-phones img { min-width: 0; border-radius: 0; width: calc(50% - var(--vn-space-2)); height: auto; max-height: 360px; object-fit: contain; } /* contain: không méo khi chiều cao bị giới hạn */

/* "Tính năng nổi trội": các khối chia đôi xếp dọc, cách nhau space-7 (space-8 từ 992px) */
.vn-tem-zigzag { display: grid; gap: var(--vn-space-7); }
@media (min-width: 992px) {
  .vn-tem-zigzag { gap: var(--vn-space-8); }
}

/* Sơ đồ quy trình có chữ nằm trong ảnh (tem_chong_tran_vung): không phóng quá cỡ gốc */
.vn-tem-diagram { margin: 0; overflow-x: auto; } /* dưới 768px: ảnh giữ ≥ 640px và cuộn ngang trong khung để đọc được chữ trong sơ đồ */
.vn-tem-diagram img { display: block; width: auto; min-width: 640px; max-width: 100%; height: auto; margin-inline: auto; border-radius: var(--vn-radius-md); box-shadow: var(--vn-shadow-sm); }
@media (min-width: 768px) {
  .vn-tem-diagram img { min-width: 0; }
}

/* Dải kêu gọi "Cùng trở thành nhà bán hàng thành công" (tem_chong_tran_vung, tem_loyalty): hai H2 + một nút */
.vn-tem-banner { text-align: center; }
.vn-tem-banner__title { margin: 0; color: var(--vn-text-on-dark); font-size: var(--vn-fs-h2); }
.vn-tem-banner__title + .vn-tem-banner__title { margin-top: var(--vn-space-2); color: var(--vn-text-on-dark-muted); font-size: var(--vn-fs-h3); font-weight: var(--vn-fw-regular); }
.vn-tem-banner .vn-btn { margin-top: var(--vn-space-5); }

/* Khối dòng chữ giới thiệu ngắn dưới tiêu đề căn giữa (vd. "Giải pháp dành cho doanh nghiệp, hợp tác xã…") */
.vn-tem-lead { max-width: 65ch; margin: var(--vn-space-3) auto 0; color: var(--vn-text-heading); font-weight: var(--vn-fw-semibold); text-align: center; }

/* Hàng logo khách hàng tĩnh (tem_loyalty): 4 logo cũ, giữ trong ô trắng */
.vn-tem-logos { margin-bottom: var(--vn-space-6); }

/* Hai dải chạy liền nhau (tem mẫu rồi logo khách hàng) cách nhau space-3 */
.vn-logo-marquee + .vn-logo-marquee { margin-top: var(--vn-space-3); }