/* Match the archive's photographic cards: copy and numbering sit on the image. */
.home-page .access-jdm,
.collection-page .collection-card-jdm {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  grid-column: 1 / -1;
  block-size: auto !important;
  min-block-size: 0 !important;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  isolation: isolate;
}
.home-page .access-jdm > *,
.collection-page .collection-card-jdm > * {
  grid-column: 1;
  grid-row: 1;
}
.home-page .access-jdm .jdm-panel-media,
.collection-page .collection-card-jdm .collection-card-media {
  position: static !important;
  align-self: stretch;
  display: block;
  inline-size: 100%;
  block-size: 100%;
  min-inline-size: 0;
  min-block-size: 0;
  overflow: hidden;
}
.home-page .access-jdm .jdm-panel-media img,
.collection-page .collection-card-jdm .collection-card-media img {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover !important;
  object-position: 50% 50% !important;
  transform: none !important;
}
.home-page .access-jdm .panel-shade,
.collection-page .collection-card-jdm .collection-card-shade {
  background:
    linear-gradient(180deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.62) 25%, rgba(0,0,0,.12) 42%, transparent 56%);
}
.home-page .access-jdm .panel-copy,
.collection-page .collection-card-jdm .collection-card-copy {
  position: static !important;
  align-self: start;
  justify-self: start;
  inline-size: min(62%, 43rem);
  max-inline-size: none;
  margin: clamp(1.5rem, 3.5vw, 3.5rem) 0 0 4vw;
  padding: 0;
  background: none;
  text-align: left;
  z-index: 2;
}
.home-page .access-jdm .panel-copy h3,
.collection-page .collection-card-jdm .collection-card-copy h3 {
  margin: .8rem 0 1rem;
  font-size: clamp(3rem, 5vw, 5.5rem);
  font-weight: 400;
  line-height: .91;
  letter-spacing: -.045em;
}
.home-page .access-jdm .panel-copy > p:not(.kicker),
.collection-page .collection-card-jdm .collection-card-copy > p:not(.kicker) {
  max-inline-size: 38rem;
  color: rgba(255,255,255,.78);
}
.home-page .access-jdm .panel-index,
.collection-page .collection-card-jdm .collection-card-number {
  position: static !important;
  align-self: start;
  justify-self: end;
  margin: clamp(1.25rem, 3vw, 2.4rem) 4vw 0 0;
  z-index: 3;
}
/* A wide group photograph needs a shallow phone frame to keep all four cars.
   The title uses the upper background; compact cards follow the archive's
   existing mobile treatment by hiding their description and read link. */
@media (max-width: 1024px) {
  .home-page .access-jdm,
  .collection-page .collection-card-jdm {
    aspect-ratio: 4 / 3;
  }
  .home-page .access-jdm .panel-shade,
  .collection-page .collection-card-jdm .collection-card-shade {
    background: linear-gradient(180deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.49) 25%, rgba(0,0,0,.03) 44%, transparent 62%);
  }
  .home-page .access-jdm .panel-copy,
  .collection-page .collection-card-jdm .collection-card-copy {
    align-self: start;
    inline-size: 78%;
    margin: 4.5vw 0 0 4.5vw;
  }
  .home-page .access-jdm .panel-copy .kicker,
  .collection-page .collection-card-jdm .collection-card-copy .kicker {
    font-size: clamp(.45rem, 1.65vw, .65rem);
    line-height: 1.5;
    letter-spacing: .2em;
  }
  .home-page .access-jdm .panel-copy h3,
  .collection-page .collection-card-jdm .collection-card-copy h3 {
    margin: .5rem 0 0;
    font-size: clamp(1.5rem, 7.6vw, 4.5rem);
    line-height: .94;
  }
  .home-page .access-jdm .panel-copy > p:not(.kicker),
  .home-page .access-jdm .panel-link,
  .collection-page .collection-card-jdm .collection-card-copy > p:not(.kicker),
  .collection-page .collection-card-jdm .collection-card-link {
    display: none;
  }
  .home-page .access-jdm .panel-index,
  .collection-page .collection-card-jdm .collection-card-number {
    margin: 4.5vw 4.5vw 0 0;
  }
}

/* The title belongs in the upper background in both phone orientations. */
@media (orientation: landscape) and (max-height: 600px) and (max-width: 1100px) {
  .home-page .access-jdm,.collection-page .collection-card-jdm {
    aspect-ratio:auto; block-size:max(260px, calc(100svh - 84px)) !important;
  }
  .home-page .access-jdm .panel-copy,.collection-page .collection-card-jdm .collection-card-copy { margin:16px 0 0 4vw; inline-size:70%; }
  .home-page .access-jdm .panel-copy .kicker,.collection-page .collection-card-jdm .collection-card-copy .kicker { font-size:8px; }
  .home-page .access-jdm .panel-copy h3,.collection-page .collection-card-jdm .collection-card-copy h3 { margin-top:6px; font-size:28px; line-height:.96; }
  .home-page .access-jdm .panel-copy > p:not(.kicker),.home-page .access-jdm .panel-link,
  .collection-page .collection-card-jdm .collection-card-copy > p:not(.kicker),.collection-page .collection-card-jdm .collection-card-link { display:none; }
  .home-page .access-jdm .panel-index,.collection-page .collection-card-jdm .collection-card-number { margin:16px 4vw 0 0; }
  .home-page .access-jdm .panel-shade,.collection-page .collection-card-jdm .collection-card-shade { background:linear-gradient(180deg,#000b, #0005 26%,transparent 47%); }
}
