/* Marketplace promotion belongs below the title summary, not beside it. */
.title-hero-grid {
  grid-template-columns:260px minmax(0,1fr);
}

.zz-native-ad.title-hero-market-ad {
  position:relative;
  isolation:isolate;
  grid-column:1/-1;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:20px;
  min-height:132px;
  margin-top:8px;
  padding:20px 22px;
  overflow:hidden;
  border:1px solid rgba(129,238,202,.28);
  border-radius:18px;
  color:#f7f7fb;
  background-color:#151021;
  background-image:
    linear-gradient(90deg,rgba(13,9,23,.98) 0%,rgba(18,12,31,.94) 48%,rgba(18,12,31,.54) 72%,rgba(12,8,22,.84) 100%),
    var(--zz-native-poster,none),
    radial-gradient(circle at 84% 18%,rgba(129,238,202,.24),transparent 29%),
    radial-gradient(circle at 20% 90%,rgba(135,83,238,.34),transparent 38%);
  background-repeat:no-repeat;
  background-position:center,right 18% center,center,center;
  background-size:100% 100%,420px auto,100% 100%,100% 100%;
  box-shadow:0 18px 48px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.04);
  text-decoration:none;
}

.zz-native-ad.title-hero-market-ad>span:first-child {
  justify-self:start;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  color:#d7d1df;
  background:rgba(10,7,17,.46);
  font-size:8px;
  font-weight:900;
  letter-spacing:.14em;
}

.zz-native-ad.title-hero-market-ad>div {
  display:grid;
  gap:6px;
  min-width:0;
}

.zz-native-ad.title-hero-market-ad>div b {
  max-width:620px;
  overflow:visible;
  font-size:clamp(20px,2.2vw,29px);
  line-height:1;
  letter-spacing:-.045em;
  white-space:normal;
}

.zz-native-ad.title-hero-market-ad>div small {
  max-width:650px;
  overflow:visible;
  color:#bbb5c4;
  font-size:11px;
  line-height:1.45;
  white-space:normal;
}

.zz-native-ad.title-hero-market-ad>strong {
  display:inline-flex;
  min-height:44px;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  border-radius:12px;
  color:#10151b;
  background:linear-gradient(105deg,#b9ff61,#70e5d5);
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
  transition:filter .18s,transform .18s;
}

.zz-native-ad.title-hero-market-ad:hover>strong {
  filter:brightness(1.06);
  transform:translateY(-1px);
}

.zz-native-ad.title-hero-market-ad .zz-native-ad-art {
  display:none;
}

@media (max-width:1180px) {
  .title-hero-grid {
    grid-template-columns:210px minmax(0,1fr);
  }

  .zz-native-ad.title-hero-market-ad {
    min-height:124px;
    background-size:100% 100%,350px auto,100% 100%,100% 100%;
  }
}

@media (max-width:760px) {
  .title-hero-grid {
    grid-template-columns:116px minmax(0,1fr);
  }

  .zz-native-ad.title-hero-market-ad {
    grid-template-columns:1fr auto;
    gap:10px 14px;
    min-height:128px;
    margin-top:6px;
    padding:16px;
    background-image:
      linear-gradient(90deg,rgba(13,9,23,.99),rgba(18,12,31,.82)),
      var(--zz-native-poster,none),
      radial-gradient(circle at 92% 12%,rgba(129,238,202,.2),transparent 34%),
      radial-gradient(circle at 20% 90%,rgba(135,83,238,.3),transparent 42%);
    background-position:center,right center,center,center;
    background-size:100% 100%,250px auto,100% 100%,100% 100%;
  }

  .zz-native-ad.title-hero-market-ad>span:first-child {
    grid-column:1/-1;
  }

  .zz-native-ad.title-hero-market-ad>div b {
    font-size:17px;
  }

  .zz-native-ad.title-hero-market-ad>div small {
    display:none;
  }

  .zz-native-ad.title-hero-market-ad>strong {
    min-height:40px;
    padding:0 13px;
    font-size:9px;
  }
}

@media (max-width:430px) {
  .title-hero-grid {
    grid-template-columns:100px minmax(0,1fr);
  }

  .zz-native-ad.title-hero-market-ad {
    grid-template-columns:1fr;
    min-height:154px;
    background-size:100% 100%,220px auto,100% 100%,100% 100%;
  }

  .zz-native-ad.title-hero-market-ad>strong {
    width:100%;
  }
}

@media (prefers-reduced-motion:reduce) {
  .zz-native-ad.title-hero-market-ad>strong {
    transition:none;
  }
}