.ai-fashion-shell .portfolio-heading h1 {
  font-size: clamp(34px, 5vw, 72px);
}
.ai-fashion-shell .portfolio-heading-aside .portfolio-link {
  display: inline-flex;
  margin-top: 18px;
}
.ai-fashion-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(10px, 1.5vw, 24px);
  padding-bottom: clamp(42px, 6vw, 90px);
}
.ai-fashion-grid a {
  display: block;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border: 1px solid #c3a49b30;
  border-radius: 15px;
  background: #20191c;
  cursor: zoom-in;
}
.ai-fashion-grid img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ai-fashion-grid a:hover,
.ai-fashion-grid a:focus-visible {
  border-color: #d19088;
}
.ai-fashion-viewer {
  width: min(100% - 24px, 1100px);
  max-height: 100dvh;
  margin: auto;
  padding: 12px;
  border: 1px solid #c3a49b52;
  border-radius: 16px;
  background: #130f12;
  color: #fff1eb;
}
.ai-fashion-viewer::backdrop {
  background: #080608e8;
}
.ai-fashion-viewer img {
  display: block;
  width: 100%;
  height: min(78dvh, 950px);
  object-fit: contain;
}
.ai-fashion-viewer-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 10px;
}
.ai-fashion-viewer button {
  width: 42px;
  height: 42px;
  border: 1px solid #c3a49b67;
  border-radius: 50%;
  background: #24171c;
  color: inherit;
}
.ai-fashion-viewer .ai-fashion-close {
  position: absolute;
  inset-block-start: 14px;
  inset-inline-end: 14px;
  font-size: 22px;
}
@media (max-width: 760px) {
  .ai-fashion-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
