/* Just As It Was v9.7 — editorial triptych hard fix.
   The three photographs are one independent row. The three memory cards are a
   second independent row below it. Intrinsic image dimensions are explicitly
   neutralised so CSS Grid cannot enlarge the tracks and push the photos under
   the cards on high-DPI / 4K layouts. */

@media (min-width:1101px){
  body.jaiw-reference-home .editorial-sequence{
    position:relative!important;
    padding-top:clamp(92px,6.25vw,160px)!important;
    padding-bottom:clamp(130px,6vw,230px)!important;
    overflow:visible!important;
  }

  body.jaiw-reference-home .sequence-images{
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(0,1.15fr) minmax(0,.83fr) minmax(0,1.2fr)!important;
    gap:clamp(4px,.22vw,8px)!important;
    width:100%!important;
    height:clamp(440px,30.5vw,680px)!important;
    min-width:0!important;
    min-height:0!important;
    align-items:center!important;
    overflow:hidden!important;
    background:var(--paper)!important;
  }

  body.jaiw-reference-home .sequence-images>img{
    position:relative!important;
    display:block!important;
    min-width:0!important;
    min-height:0!important;
    max-width:100%!important;
    max-height:100%!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    object-fit:cover!important;
    object-position:center center!important;
    transform:none!important;
  }

  body.jaiw-reference-home .sequence-images>img:nth-child(1),
  body.jaiw-reference-home .sequence-images>img:nth-child(3){
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    align-self:stretch!important;
  }

  body.jaiw-reference-home .sequence-images>img:nth-child(2){
    height:67%!important;
    min-height:0!important;
    max-height:67%!important;
    align-self:center!important;
  }

  /* Do not use a negative margin / overlap treatment here.  The transparent
     top padding is the measured visual gap between the photographs and cards. */
  body.jaiw-reference-home .sequence-copy{
    position:relative!important;
    inset:auto!important;
    z-index:1!important;
    float:none!important;
    clear:both!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:clamp(12px,.65vw,25px)!important;
    width:60vw!important;
    max-width:none!important;
    margin:0 auto!important;
    padding:clamp(54px,3.1vw,84px) 0 0!important;
    transform:none!important;
    overflow:visible!important;
  }

  body.jaiw-reference-home .sequence-copy>p{
    position:relative!important;
    inset:auto!important;
    float:none!important;
    min-width:0!important;
    margin:0!important;
    transform:none!important;
  }
}

@media (min-width:2200px){
  body.jaiw-reference-home .editorial-sequence{padding-top:6.25vw!important}
  body.jaiw-reference-home .sequence-images{height:30.5vw!important}
  body.jaiw-reference-home .sequence-copy{padding-top:3.1vw!important}
}

@media (max-width:1100px){
  body.jaiw-reference-home .editorial-sequence{padding-top:64px!important}
  body.jaiw-reference-home .sequence-images{
    height:260px!important;
    min-height:0!important;
    align-items:center!important;
    overflow:hidden!important;
  }
  body.jaiw-reference-home .sequence-images>img{
    min-width:0!important;
    min-height:0!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:cover!important;
  }
  body.jaiw-reference-home .sequence-images>img:nth-child(1),
  body.jaiw-reference-home .sequence-images>img:nth-child(3){height:100%!important;max-height:100%!important}
  body.jaiw-reference-home .sequence-images>img:nth-child(2){height:72%!important;max-height:72%!important;align-self:center!important}
  body.jaiw-reference-home .sequence-copy{position:relative!important;transform:none!important;margin:0 auto!important;padding-top:28px!important}
}
