/* Preserve the authored type scale in mobile WebViews; pinch zoom stays enabled. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

/* The technical artwork belongs in the document flow, above its controls. */
@media (max-width: 760px) {
  .af-story-technical .af-lab-stage {
    position: relative; top: auto; z-index: auto; box-shadow: none;
  }
  .af-story-technical button { scroll-margin-top: 70px; }
}
.af-flag-detail-card .af-story-diag-note { min-height: 0; }

/* Normalize the visible circumference, rather than the transparent source canvas. */
.cv-route-story > .cv-route-icon {
  position: relative; display: block; flex: none; overflow: hidden;
  width: 90px; height: 90px; margin-bottom: 28px;
}
.cv-route-icon img { position: absolute; max-width: none; height: auto; }
@media (max-width: 1100px) {
  .cv-route-story > .cv-route-icon { width: 64px; height: 64px; margin-bottom: 20px; }
}
@media (max-width: 760px) {
  .cv-route-story > .cv-route-icon {
    position: absolute; right: 0; top: 0; width: 52px; height: 52px; margin: 0;
  }
}

/* A flex item without an auto start margin remains centered at every screen width. */
.winter-case .w-capsule-overview { margin-inline: auto; }
.winter-case .w-capsule-overview img { display: block; margin-inline: auto; }
.w-kuper-world .w-tabs--route .w-tab-panel figure > img:first-child {
  width: 100%; aspect-ratio: 1.5; height: auto; object-fit: cover;
}

/* Keep the approved sky artwork full bleed, including on large monitors. */
body[data-portfolio-case='aeroflot-toys'] .hero-collection { width: 100%; max-width: none; }
body[data-portfolio-case='aeroflot-toys'] .hero-collection img {
  display: block; width: 100%; height: auto; max-height: none; margin: 0; object-fit: cover;
}

/* A steady carousel viewport; complete artwork is inspected in the dialog. */
.portfolio-home .dg-stage {
  --dg-art-height: 360px;
  position: relative; gap: 0; align-items: stretch; height: auto !important;
  scroll-snap-type: x mandatory; scroll-padding: 0; transition: none;
}
.portfolio-home .dg-stage > .dg-item {
  box-sizing: border-box; flex: 0 0 100%; width: 100%; min-width: 0;
  margin: 0 !important; scroll-snap-align: start; scroll-snap-stop: always;
}
.portfolio-home .dg-stage > .dg-item > a {
  display: flex; justify-content: center; align-items: center;
  width: 100%; height: var(--dg-art-height); overflow: hidden;
}
.portfolio-home .dg-stage > .dg-item picture { display: contents; }
.portfolio-home .dg-stage > .dg-item img,
.portfolio-home .dg-stage > .dg-item[data-digital-email] img {
  display: block; width: auto; height: auto; max-width: 100%;
  max-height: var(--dg-art-height); object-fit: contain; margin: 0;
}
.portfolio-home .dg-stage > .dg-item figcaption { min-height: 48px; }
@media (max-width: 700px) {
  .portfolio-home .dg-stage { --dg-art-height: 300px; }
  .portfolio-home .dg-stage > .dg-item figcaption { min-height: 76px; }
}
.dg-lightbox { overscroll-behavior: contain; }
.dg-lightbox { padding: 16px 24px 24px; }
.dg-lightbox[data-email] { width: 820px; overflow: auto; }
.dg-lightbox[data-email] > img { width: 100%; height: auto; max-height: none; object-fit: contain; }
.dg-lightbox-actions {
  position: sticky; top: 0; left: 0; z-index: 2; display: flex; justify-content: flex-end;
  gap: 10px; padding: 0 0 14px; background: #fff;
}
.dg-lightbox-actions button {
  min-height: 44px; padding: 8px 16px; border: 1px solid #9a9d9a;
  border-radius: 24px; background: #fff; color: #252825; font: inherit;
}
.dg-lightbox-actions button[hidden] { display: none; }
.dg-lightbox[data-email][data-zoom] > img { width: 100%; min-width: 760px; max-width: none; }

#kuper-route-panel-3 figure { position:relative; aspect-ratio:1.5; overflow:hidden; }
.w-kuper-world #kuper-route-panel-3 figure > img:first-child {
  position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:115.2%; max-width:none; height:auto; aspect-ratio:1448 / 1086;
}
