/* Nissan Skyline GT-R R34 — v28 page-specific presentation fixes. */

/* Retain the cinematic shade while restoring detail in the body and wheels. */
.feature-r34 .feature-hero-shade {
  background:
    linear-gradient(270deg, rgba(0, 0, 0, .64) 0%, rgba(0, 0, 0, .34) 39%, rgba(0, 0, 0, .025) 72%),
    linear-gradient(0deg, rgba(0, 0, 0, .50), transparent 60%);
}

@media (max-width: 1024px) {
  /* Mobile already uses tighter crops, so its shade can be lighter still. */
  .feature-r34 .feature-hero-shade {
    background:
      linear-gradient(270deg, rgba(0, 0, 0, .44) 0%, rgba(0, 0, 0, .20) 42%, rgba(0, 0, 0, .01) 72%),
      linear-gradient(0deg, rgba(0, 0, 0, .34), transparent 58%);
  }

  /* Let the native 3:2 photographs define their height; fixed legacy frames
     exposed the figures' #111 background below both images. */
  .feature-r34 .story-duo {
    align-items: start;
  }

  .feature-r34 .story-duo figure:first-child,
  .feature-r34 .story-duo figure:last-child {
    block-size: auto !important;
    min-block-size: 0 !important;
    aspect-ratio: auto !important;
    background: transparent;
  }

  .feature-r34 .story-duo img {
    display: block;
    inline-size: 100% !important;
    block-size: auto !important;
    min-block-size: 0 !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    transform: none !important;
  }
}

@media (max-width: 1024px) and (orientation: landscape) {
  /* Preserve the accepted rear composition. */
  .feature-r34 .story-full.rear {
    block-size: auto !important;
    min-block-size: 0 !important;
    aspect-ratio: 16 / 9 !important;
  }

  .feature-r34 .story-full.rear > img {
    object-position: 50% 68% !important;
  }

  /* The motion source is portrait. A taller frame retains the existing roof
     crop while revealing real pavement below the car for the caption. */
  .feature-r34 .story-full.motion {
    block-size: auto !important;
    min-block-size: 0 !important;
    aspect-ratio: 4 / 3 !important;
  }

  .feature-r34 .story-full.motion > img {
    object-position: 50% 72.5% !important;
  }

  .feature-r34 .story-full.motion .story-full-copy {
    align-items: flex-start;
    justify-content: flex-end;
    text-align: left;
    padding: 0 0 clamp(1.25rem, 3vw, 1.75rem);
  }
}