#view-articles .moon-demo-banner {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  isolation: isolate;
}

#view-articles .moon-demo-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgb(3 12 15 / 48%), transparent 52%);
  pointer-events: none;
}

#view-articles .moon-demo-banner__copy {
  position: absolute;
  top: 8%;
  left: 6%;
  right: 6%;
  z-index: 2;
  color: #f6f5ed;
  text-shadow: 0 2px 16px rgb(0 0 0 / 45%);
}

#view-articles .moon-demo-banner__label {
  display: block;
  margin-bottom: 9px;
  font: 500 clamp(8px, .75vw, 11px)/1.3 ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: #ccdfd7;
}

#view-articles .moon-demo-banner__title {
  display: block;
  font: 550 clamp(29px, 3.1vw, 45px)/1.05 system-ui, -apple-system, sans-serif;
  letter-spacing: -.055em;
  white-space: nowrap;
}

#view-articles .moon-demo-banner__year {
  margin-left: .3em;
  font-weight: 350;
  color: #ccdfd7;
}

@media (max-width: 850px) {
  #view-articles .moon-demo-banner__label { font-size: clamp(8px, 1.7vw, 11px); }
  #view-articles .moon-demo-banner__title { font-size: clamp(27px, 6vw, 45px); }
}