/* === Shared clickable card === */
.nba-link {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: inherit;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  position: relative;
  box-shadow: 0 1px 2px rgba(0,0,0,.05);
}
.nba-link:hover {
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
  border-color: #d1d5db;
}
.nba-tag {
  position: absolute;
  top: 6px;
  right: 10px;
  font-size: 10px;
  color: #6b7280;
  background: #f3f4f6;
  padding: 2px 6px;
  border-radius: 6px;
  line-height: 1;
  z-index: 2;
}

/* ===================== 728x90 ===================== */
.nba-banner { box-sizing: border-box; margin: 18px auto; position: relative; }
.nba-inner {
  box-sizing: border-box;
  height: 100%; width: 100%;
  display: flex; align-items: center;
  padding: 8px 10px; gap: 10px;
}
.nba-left {
  flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  width: 86px; height: 66px;
  border: 1px solid #e5e7eb; border-radius: 10px; background: #fff;
}
.nba-logo { max-width: 76px; max-height: 56px; object-fit: contain; }
.nba-mid { min-width: 0; flex: 1 1 auto; line-height: 1.15; }
.nba-brand { font-weight: 700; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nba-domain { font-size: 11px; color: #6b7280; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nba-right { flex: 0 0 auto; }
.nba-cta {
  display: inline-block; font-weight: 600; border-radius: 999px;
  padding: 8px 12px; border: 1px solid #111827;
  transition: transform .08s ease, background .08s ease, color .08s ease;
  font-size: 13px; line-height: 1;
}
.nba-link:hover .nba-cta { transform: translateY(-1px); background: #111827; color: #fff; }

/* No-logo variant for 728x90 */
.nba-banner.no-logo .nba-inner { padding: 10px 14px; gap: 12px; }
.nba-banner.no-logo .nba-brand { font-size: 18px; }
.nba-banner.no-logo .nba-domain { font-size: 12px; }
.nba-banner.no-logo .nba-left { display: none; }

/* Strict sizes for 728x90 */
@media (min-width: 768px) {
  .nba-banner { width: 728px !important; height: 90px !important; }
}
@media (max-width: 767px) {
  .nba-banner { width: 320px !important; height: 100px !important; }
  .nba-left { width: 70px; height: 64px; }
  .nba-logo { max-width: 60px; max-height: 52px; }
  .nba-brand { font-size: 15px; }
  .nba-cta { padding: 7px 11px; font-size: 12px; }
}
@media (max-width: 340px) {
  .nba-banner { width: 300px !important; height: 100px !important; }
}

/* ===================== 300x250 (refined card) ===================== */
.nba-box {
  box-sizing: border-box;
  margin: 18px auto;
  position: relative;
  width: 300px !important;
  height: 250px !important;
  background: radial-gradient(120% 120% at 0% 0%, #ffffff 0%, #fbfbfb 60%, #f7f7f7 100%);
}

/* Default grid (with logo) */
.nba-inner-box {
  box-sizing: border-box;
  height: 100%; width: 100%;
  display: grid;
  grid-template-rows: 94px 22px 16px 1fr 40px; /* logo, brand, domain, tagline, CTA */
  padding: 12px 12px;
  gap: 6px;
}
.nba-logo-wrap {
  display: flex; align-items: center; justify-content: center;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.nba-logo-box { max-width: 120px; max-height: 70px; object-fit: contain; }
.nba-brand-box {
  font-weight: 800; font-size: 18px; line-height: 1.2;
  text-align: center;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.nba-domain-box {
  font-size: 12px; line-height: 1.2; color: #6b7280;
  text-align: center;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.nba-tagline-box {
  font-size: 13px; line-height: 1.35; color: #374151;
  text-align: center;
  margin: 2px 4px 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.nba-cta-row { display: flex; align-items: center; justify-content: center; }
.nba-cta-box {
  display: inline-block; width: 100%; text-align: center;
  font-weight: 700; border-radius: 999px;
  padding: 10px 14px; font-size: 13px; line-height: 1;
  border: 1px solid #111827;
  background: linear-gradient(180deg, #ffffff 0%, #f3f4f6 100%);
  transition: transform .08s ease, background .08s ease, color .08s ease, box-shadow .08s ease;
}
.nba-link:hover .nba-cta-box {
  background: #111827; color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.10);
}

/* No-logo variant for 300x250 */
.nba-box.no-logo .nba-inner-box {
  grid-template-rows: 28px 18px 1fr 44px; /* brand, domain, tagline, CTA */
  padding-top: 16px;
}
.nba-box.no-logo .nba-brand-box { font-size: 20px; }
.nba-box.no-logo .nba-domain-box { font-size: 12px; }