/* Row cha */
.custom-row {
  display: flex !important;
  flex-wrap: wrap !important;
  margin-left: -15px !important;
  margin-right: -15px !important;
}

/* Column chung */
[class*="custom-col-sm-"] {
  padding-left: 15px !important;
  padding-right: 15px !important;
  box-sizing: border-box !important;
}

/* Chiều rộng trên màn hình >= 576px */
@media (min-width: 576px) {
  .custom-col-sm-8 {
    flex: 0 0 66.6667% !important; /* 8/12 */
    max-width: 66.6667% !important;
  }
  .custom-col-sm-4 {
    flex: 0 0 33.3333% !important; /* 4/12 */
    max-width: 33.3333% !important;
  }
}

/* Trên mobile (<576px) full width */
@media (max-width: 575.98px) {
  .custom-col-sm-8,
  .custom-col-sm-4 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

/* Khung ảnh chung */
.d-block.img {
  width: 478px;
  height: 300px;
  background: #fff; /* nền trắng */
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/* Mặc định ảnh fill khung */
.d-block.img img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* các ảnh khác (menu, banner...) giữ kiểu cũ */
}

/* Riêng ảnh QR code: co lại để hiển thị đủ */
.qrcode-img {
  object-fit: contain !important;
}