/* 10 Nov 2026 (James: "do a next level ... the new cell phone version"): the same phone view as the pest showcase.
   The sharp computer pictures (no stretched phone versions), no panning (James 10 Nov: the side-to-side movement
   looked bad on pest). Deck cards on phones: black card, the picture full width at 4:3 so it is big and sharp, and the
   heading in the black space above it, never over the picture. One swipe = one screen is in nl-phone.js.
   Computers are not touched. */
@media (max-aspect-ratio:3/4){
  html,body{overflow-x:clip}
  .mv-card.nlfull{background:#000!important}
  .mv-card.nlfull img,.mv-card.nlfull video{position:absolute!important;inset:auto!important;left:0!important;top:calc(50% - 37.5vw + 9vh)!important;width:100%!important;height:75vw!important;aspect-ratio:4/3!important;object-fit:cover!important;object-position:50% 50%!important}
  .mv-card.nlfull .dcap{top:auto!important;bottom:calc(50% + 37.5vw - 9vh + 10px)!important;width:94%!important;padding:0!important;background:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .mv-card.nlfull .dcap p{margin:0 0 8px!important}
  .mv-card.nlfull .dcap h2{font-size:clamp(30px,9vw,40px)!important}
}
/* the turning picture (Home, Pricing): full width at 4:3, heading in the black above it, not squeezed over a small picture */
@media (max-aspect-ratio:3/4){
  .mv-turnbox{width:100vw!important;height:auto!important;aspect-ratio:auto!important;display:flex!important;flex-direction:column!important}
  .mv-turnbox .dcap{position:static!important;order:-1;transform:none!important;width:94%!important;margin:0 auto 16px!important;padding:0!important;background:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .mv-turnbox .dcap p{margin:0 0 8px!important}
  .mv-turnbox .dcap h2{font-size:clamp(30px,9vw,40px)!important}
  .mv-turnbox .mv-turn{position:relative!important;inset:auto!important;width:100%!important;height:75vw!important;aspect-ratio:auto!important;border-radius:0!important;margin:0!important}
  .mv-turnbox .mv-turn img{width:100%!important;height:100%!important;object-fit:cover!important}
}

/* 10 Nov 2026 (James: "mostly black screens"): behind the sharp 4:3 picture, the same picture blurred and darkened fills the phone screen */
@media (max-aspect-ratio:3/4){
  .mv-card.nlfull{overflow:hidden}
  .mv-card.nlfull::before{content:"";position:absolute;inset:-60px;background:#000 var(--nlbg) center/cover no-repeat;filter:blur(26px) brightness(.45) saturate(1.2);transform:translateZ(0);pointer-events:none}
}
