/* The store rows on a phone hold and stack as the page scrolls: each row stops just under the bar at the top and the
   next row slides up over it; scrolling back up lifts each one off again. Nothing fades or slides in. The script beside
   this sheet sets each row's holding line and switches the class on, so without it the rows stand as plain rows; with
   motion turned off nothing here applies. */
@media (max-width: 900px) and (prefers-reduced-motion: no-preference) {
  /* a row can only hold to the screen when the band around it is not a scroll box: clip cuts the same overflow
     without making one (the phone sheet does the same at 640 px and down) */
  .a3-phone-page .composition:has(.a3-store.a3-stack-on) {
    overflow: clip;
  }
  /* each row: held at the line the script measured for it, opaque, a soft shadow on the row it covers */
  .a3-phone-page .a3-store.a3-stack-on .a3-store-row {
    position: sticky;
    z-index: 1;
    background: var(--black, #000);
    box-shadow: 0 -20px 40px -18px rgba(0, 0, 0, 0.85);
    opacity: 1;
    transform: none;
    translate: none;
    transition: none;
  }
  /* the picture and the words arrive whole: no fade, no rise */
  .a3-phone-page .a3-store.a3-stack-on .a3-store-row > * {
    animation: none;
    opacity: 1;
    translate: none;
    transform: none;
  }
}