/* Preserve the complete generated composition rather than cropping its edges. */
figure.project-art.generated-art {
  position: relative;
  isolation: isolate;
  height: auto;
  min-height: 0;
  aspect-ratio: 3 / 2;
  margin: 0;
  background: #080f1d;
  overflow: hidden;
}
.featured figure.project-art.generated-art {
  height: auto;
  min-height: 420px;
  aspect-ratio: auto;
  align-self: stretch;
}
.generated-art img {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.generated-art::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, #080e1a99, transparent 24%, transparent 76%, #080e1aaa);
  pointer-events: none;
}
.generated-art .art-caption,
.generated-art .art-bottom {
  z-index: 2;
  color: #d2d6ed;
  text-shadow: 0 2px 8px #000;
}
.generated-art .art-caption>span:last-child { color: #bbc6e6; }
.generated-art .art-bottom {
  font-size: .75rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.project-art.generated-art.art-cinematic { background: #12120f; }
.art-cinematic.generated-art::after {
  background: linear-gradient(180deg, #100e0ab3, transparent 24%, transparent 76%, #100e0acc);
}
.art-cinematic.generated-art .art-caption,
.art-cinematic.generated-art .art-caption>span:last-child,
.art-cinematic.generated-art .art-bottom { color: #f6e5c8; }
.project-art.generated-art.art-editorial { background: #f2ecdf; }
.art-editorial.generated-art::after { display: none; }
.art-editorial.generated-art .art-caption,
.art-editorial.generated-art .art-caption>span:last-child,
.art-editorial.generated-art .art-bottom {
  color: #14283a;
  text-shadow: none;
}
.project-art.generated-art.art-cartographic { background: #284839; }
.art-cartographic.generated-art::after {
  background: linear-gradient(180deg, #17342699, transparent 22%, transparent 78%, #173426aa);
}
.art-cartographic.generated-art .art-caption,
.art-cartographic.generated-art .art-caption>span:last-child,
.art-cartographic.generated-art .art-bottom { color: #f7ecd2; }
.art-cartographic.generated-art .research-badge {
  background: #193e2ee6;
  border-color: #9a9d71;
}
@media (max-width: 800px) {
  .featured figure.project-art.generated-art {
    height: auto;
    min-height: 0;
    aspect-ratio: 3 / 2;
  }
}

/* Complete the gallery with a distinct visual language for each remaining project. */
.project-art.generated-art.art-ceramic { background: #28172b; }
.art-ceramic.generated-art::after {
  background: linear-gradient(180deg, #21112688, transparent 22%, transparent 78%, #21112699);
}
.art-ceramic.generated-art .art-caption,
.art-ceramic.generated-art .art-caption>span:last-child,
.art-ceramic.generated-art .art-bottom { color: #f4e8f0; }
.project-art.generated-art.art-blueprint { background: #002c33; }
.art-blueprint.generated-art::after {
  background: linear-gradient(180deg, #00262b88, transparent 22%, transparent 78%, #00262b99);
}
.art-blueprint.generated-art .art-caption,
.art-blueprint.generated-art .art-caption>span:last-child,
.art-blueprint.generated-art .art-bottom { color: #d6eee5; }
.project-art.generated-art.art-archive { background: #eee0c5; }
.art-archive.generated-art::after { display: none; }
.art-archive.generated-art .art-caption,
.art-archive.generated-art .art-caption>span:last-child,
.art-archive.generated-art .art-bottom {
  color: #233c4a;
  text-shadow: none;
}
.project-meta .mini-icon { color: #b19add; }
.etl-card .project-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media (max-width: 480px) {
  .generated-art .art-caption { top: 15px; left: 16px; right: 16px; }
  .generated-art .art-caption>span:last-child { font-size: .75rem; letter-spacing: .05em; }
  .generated-art .art-bottom { bottom: 14px; font-size: .75rem; letter-spacing: .04em; }
}