/* Give the portrait illustration its own column instead of cropping it as a banner. */
.home-page .feature-image {
  display: grid;
  grid-template-columns: minmax(0, 42%) minmax(0, 58%);
  grid-template-rows: minmax(0, 1fr);
  height: min(740px, calc((100vw - 64px) * .58));
  min-height: 530px;
  overflow: hidden;
  border: 1px solid #44515a;
  background: radial-gradient(ellipse at 70% 45%, #263743, #0b1720 72%);
}
.home-page .feature-image img {
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: contain;
  object-position: center;
  background: #0b141d;
}
.home-page .feature-image::after { display: none; }
.home-page .feature-image > div {
  position: relative;
  left: auto;
  bottom: auto;
  max-width: none;
  padding: clamp(34px, 6vw, 90px);
  align-self: center;
}
.home-page .feature-image > div::before {
  content: '✧';
  display: block;
  width: fit-content;
  color: var(--gold);
  font: 34px/1 var(--serif);
  margin-bottom: 24px;
}
.home-page .feature-image p {
  font: italic clamp(28px, 3vw, 43px)/1.35 var(--serif);
  margin-top: 19px;
}
@media (max-width: 900px) {
  .home-page .feature-image {
    display: block;
    height: auto;
    min-height: 0;
    margin-top: 52px;
  }
  .home-page .feature-image img {
    display: block;
    width: min(100%, 520px);
    height: auto;
    margin-inline: auto;
  }
  .home-page .feature-image > div { padding: 28px clamp(24px, 5vw, 42px) 38px; }
  .home-page .feature-image > div::before { margin-bottom: 15px; }
  .home-page .feature-image p { font-size: clamp(24px, 5vw, 34px); }
}

.home-page .hero-download-total {
  color: #d8c09b;
  font: 600 12px/1.5 var(--sans);
  letter-spacing: .04em;
  margin: 13px 0 0;
}
.home-page .download-options > .download-count {
  color: #6e665b;
  font: 600 12px/1.4 var(--sans);
  letter-spacing: .03em;
  margin: -13px 0 19px 72px;
}

.home-page .support-art {
  display: grid;
  place-items: center;
  height: min(740px, 58vw);
  background: radial-gradient(ellipse at 50% 45%, #223744, #0b1720 75%);
}
.home-page .support-art img {
  min-width: 0;
  min-height: 0;
  object-fit: contain;
}
@media (max-width: 700px) {
  .home-page .support-art {
    height: auto;
    aspect-ratio: 2 / 3;
  }
}