.upcoming {
  background: #062f57;
  color: #fff;
}

.upcoming-copy {
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  gap: clamp(3rem, 7vw, 7rem);
  align-items: end;
  margin-bottom: 3rem;
}

.upcoming h2 {
  color: #fff;
}

.upcoming-details {
  border-top: 1px solid rgba(255,255,255,.25);
  padding-top: 1.5rem;
}

.upcoming-size {
  margin: 0 0 1rem;
  font: 600 clamp(3rem, 5vw, 5rem)/1 Oswald, Impact, sans-serif;
  color: #fff;
}

.upcoming-size span {
  font-size: .35em;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.upcoming-details > p:not(.upcoming-size) {
  margin: 0 0 1.5rem;
  color: #c9d5df;
}

.upcoming-details ul {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.upcoming-details li {
  padding: .55rem .75rem;
  border: 1px solid rgba(255,255,255,.3);
  color: #fff;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.upcoming-rendering {
  margin: 0;
}

.upcoming-rendering img {
  width: 100%;
  aspect-ratio: 24 / 11;
  display: block;
  object-fit: cover;
}

.upcoming-rendering figcaption {
  margin-top: .75rem;
  color: #a9c0d3;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.upcoming-divider {
  height: 1px;
  margin: clamp(5rem, 9vw, 9rem) 0;
  background: rgba(255,255,255,.25);
}

@media (max-width: 960px) {
  .upcoming-copy { grid-template-columns: 1fr; gap: 2.5rem; }
}

@media (max-width: 600px) {
  .upcoming-rendering img { aspect-ratio: 4 / 3; }
}