/* VSW-TC-04 · Danh sách nhà tài trợ (bám template) */
.ntt {
  background: var(--vs-ice);
}
.ntt-dau {
  max-width: 760px;
  margin: 0 auto var(--vs-k7);
  text-align: center;
}
.ntt-nhan {
  display: inline-flex;
  align-items: center;
  gap: var(--vs-k2);
  padding: var(--vs-k1) var(--vs-k3);
  border: 1px solid var(--vs-line);
  border-radius: calc(var(--vs-k9) * 100);
  background: var(--vs-trang);
  color: var(--vs-blue);
  font-family: var(--vs-font-nhan);
  font-size: var(--vs-co-nhan);
  font-weight: 700;
  line-height: var(--vs-dong-nhan);
  letter-spacing: var(--vs-gian-nhan);
  text-transform: uppercase;
}
.ntt-nhan-cham {
  flex: none;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--vs-success);
}
.ntt-tieu-de {
  margin: var(--vs-k4) 0 0;
  color: var(--vs-ink);
  font-size: var(--vs-co-h2);
  text-align: center;
  text-wrap: balance;
}
.ntt-tieu-de-nhan {
  color: var(--vs-action);
}
.ntt-mo-ta {
  margin: var(--vs-k3) 0 0;
  color: var(--vs-muted);
  font-family: var(--vs-font-noi-dung);
  font-size: var(--vs-co-noi-dung);
  text-align: center;
  text-wrap: balance;
}
.ntt-to-chuc { display: flex; flex-direction: column; gap: var(--vs-k4); margin-bottom: var(--vs-k5); }
.ntt-to-chuc-logo { display: flex; justify-content: center; }
.ntt-to-chuc-logo-anh { max-width: min(100%, 320px); max-height: 64px; object-fit: contain; }
.ntt-to-chuc-ds { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--vs-k4); }
.ntt-the--to-chuc { align-items: flex-start; }
.ntt-to-chuc-vai-tro { flex: 0 0 auto; white-space: normal; color: var(--vs-blue); }
.ntt-to-chuc-bieu-tuong { background: var(--vs-blue); }
.ntt-to-chuc-corpo { flex: 1; min-width: 0; }
.ntt-to-chuc-ten { margin: 0 0 var(--vs-k1); color: var(--vs-ink); font-family: var(--vs-font-tieu-de); font-size: var(--vs-co-h3); font-weight: 700; }
@media (max-width: 819px) {
  .ntt-to-chuc-ds { grid-template-columns: 1fr; }
  .ntt-the--to-chuc { flex-wrap: wrap; }
  .ntt-to-chuc-vai-tro { flex-basis: 100%; }
}
.ntt-hang-lon {
  display: flex;
  flex-direction: column;
  gap: var(--vs-k3);
  margin-bottom: var(--vs-k3);
}
.ntt-the {
  display: flex;
  align-items: center;
  gap: var(--vs-k5);
  padding: var(--vs-k4) var(--vs-k6);
  border: 1px solid var(--vs-line);
  border-radius: calc(var(--vs-bo-the) * 2);
  background: var(--vs-trang);
  box-shadow: var(--vs-bong-nhe);
}
.ntt-the--kim_cuong { min-height: 140px; }
.ntt-the--bach_kim { min-height: 122px; }
.ntt-the-hang,
.ntt-dong-hang {
  display: flex;
  align-items: center;
  gap: var(--vs-k3);
  margin: 0;
  font-family: var(--vs-font-nhan);
  font-size: var(--vs-co-nhan);
  font-weight: 700;
  line-height: var(--vs-dong-nhan);
  letter-spacing: var(--vs-gian-nhan);
  text-transform: uppercase;
}
.ntt-the-hang {
  flex: 0 0 215px;
  white-space: nowrap;
}
.ntt-the--kim_cuong .ntt-the-hang { color: var(--vs-hang-kim-cuong-chu); }
.ntt-the--bach_kim .ntt-the-hang { color: var(--vs-hang-bach-kim-chu); }
.ntt-the-bieu-tuong,
.ntt-dong-bieu-tuong {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  color: var(--vs-trang);
}
.ntt-the-bieu-tuong { border-radius: var(--vs-bo-the); }
.ntt-the-bieu-tuong svg,
.ntt-dong-bieu-tuong svg {
  width: 18px;
  height: 18px;
}
.ntt-the--kim_cuong .ntt-the-bieu-tuong {
  background: var(--vs-hang-kim-cuong-chu);
}
.ntt-the--bach_kim .ntt-the-bieu-tuong {
  border: 1px solid var(--vs-line);
  background: var(--vs-hang-bach-kim-nen);
  color: var(--vs-hang-bach-kim-chu);
}
.ntt-the-logo {
  flex: 0 0 210px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
}
.ntt-the-logo-anh {
  width: auto;
  height: auto;
  object-fit: contain;
}
.ntt-the--kim_cuong .ntt-the-logo-anh {
  max-width: min(100%, 210px);
  max-height: 78px;
}
.ntt-the--bach_kim .ntt-the-logo-anh {
  max-width: min(100%, 200px);
  max-height: 62px;
}
.ntt-o-cho {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 60px;
  padding: var(--vs-k2) var(--vs-k3);
  border: 1px dashed var(--vs-line);
  border-radius: var(--vs-bo-the);
  background: var(--vs-trang);
  color: var(--vs-muted);
  font-family: var(--vs-font-noi-dung);
  font-size: var(--vs-co-nho);
  font-weight: 600;
  text-align: center;
  text-wrap: balance;
}
.ntt-the-mo-ta {
  flex: 1;
  min-width: 180px;
  margin: 0;
  color: var(--vs-muted);
  font-family: var(--vs-font-noi-dung);
  font-size: var(--vs-co-noi-dung);
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.ntt-the-lien-ket {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--vs-cham-toi-thieu);
  min-height: var(--vs-cham-toi-thieu);
  margin-left: auto;
  border-radius: var(--vs-bo-the);
  color: var(--vs-action);
}
.ntt-the-lien-ket svg {
  width: 22px;
  height: 22px;
}
.ntt-the-lien-ket:hover { background: var(--vs-ice); }
.ntt-the-lien-ket:focus-visible,
.ntt-o-lien-ket:focus-visible {
  outline: var(--vs-k1) solid var(--vs-action);
  outline-offset: var(--vs-k1);
}
.ntt-dong {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--vs-k5);
  padding: var(--vs-k5) 0 var(--vs-k5) var(--vs-k6);
  border-top: 1px solid var(--vs-line);
}
.ntt-dong-hang { min-width: 200px; }
.ntt-dong--vang .ntt-dong-hang { color: var(--vs-hang-vang-chu); }
.ntt-dong--bac .ntt-dong-hang { color: var(--vs-hang-bac-chu); }
.ntt-dong-bieu-tuong { border-radius: 50%; }
.ntt-dong--vang .ntt-dong-bieu-tuong { background: var(--vs-hang-vang-chu); }
.ntt-dong--bac .ntt-dong-bieu-tuong { background: var(--vs-hang-bac-chu); }
.ntt-dong-logo {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  gap: var(--vs-k3);
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ntt-o {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--vs-k2);
  border: 1px solid var(--vs-line);
  border-radius: var(--vs-bo-the);
  background: var(--vs-trang);
}
.ntt-dong--vang .ntt-o { width: 150px; height: 60px; }
.ntt-dong--bac .ntt-o { width: 128px; height: 52px; }
.ntt-o-anh {
  width: auto;
  height: auto;
  max-width: 84%;
  max-height: 80%;
  object-fit: contain;
}
.ntt-o-lien-ket {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: var(--vs-cham-toi-thieu);
  border-radius: var(--vs-bo-the);
  text-decoration: none;
}
.ntt-dong .ntt-o--trong {
  width: auto;
  min-width: 200px;
  border-style: dashed;
}
.ntt-o--trong .ntt-o-lien-ket {
  padding: var(--vs-k2) var(--vs-k3);
  color: var(--vs-muted);
  font-family: var(--vs-font-noi-dung);
  font-size: var(--vs-co-nho);
  font-weight: 600;
  text-align: center;
  text-wrap: balance;
}

@media (max-width: 1023px) {
  .ntt-the {
    flex-wrap: wrap;
    gap: var(--vs-k3);
  }
  .ntt-the-hang { flex-basis: 100%; }
  .ntt-the-logo {
    flex: 0 1 auto;
    max-width: calc(100% - var(--vs-cham-toi-thieu) - var(--vs-k3));
  }
  .ntt-o-cho { max-width: 260px; }
  .ntt-the-mo-ta {
    order: 4;
    flex: 1 1 100%;
  }
}
@media (max-width: 819px) {
  .ntt-dau { margin-bottom: var(--vs-k6); }
  .ntt-the { padding: var(--vs-k4) var(--vs-k5); }
  .ntt-dong {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--vs-k3);
    padding-left: var(--vs-k4);
  }
  .ntt-dong-logo { width: 100%; }
}
