/* HIMMA shop collection rails
   Match the home exhibition: vertical scrolling moves between catalogue
   sections; each artwork row is one native horizontal rail. */

.shop-page #studio-shop .shelf:not(.archive-shelf):not(#sets) .row{
  --shop-row-card:clamp(13.5rem,20vw,15.75rem);
  display:grid!important;
  grid-template-columns:none!important;
  grid-auto-flow:column;
  grid-auto-columns:var(--shop-row-card);
  justify-content:start!important;
  justify-items:stretch;
  align-items:start;
  width:100%;
  max-width:100%;
  min-width:0;
  gap:clamp(.9rem,1.8vw,1.4rem)!important;
  overflow-x:auto;
  overflow-y:hidden;
  padding:.35rem 0 clamp(.8rem,1.8vw,1.2rem);
  scroll-snap-type:x proximity;
  scroll-padding-inline:0;
  overscroll-behavior-inline:auto;
  overscroll-behavior-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  touch-action:pan-x pan-y;
  cursor:grab;
}
.shop-page #studio-shop .shelf:not(.archive-shelf):not(#sets) .row::-webkit-scrollbar{
  display:none;
}
.shop-page #studio-shop .shelf:not(.archive-shelf):not(#sets) .row>.card-wrap{
  width:var(--shop-row-card)!important;
  max-width:none!important;
  min-width:0;
  justify-self:stretch;
  scroll-snap-align:start;
  scroll-snap-stop:normal;
}
.shop-page #studio-shop .shelf:not(.archive-shelf):not(#sets) .row>.card-wrap .card{
  width:100%!important;
  max-width:none!important;
}
.shop-page #studio-shop .shelf:not(.archive-shelf):not(#sets) .row>.card-wrap .art{
  width:100%!important;
}

/* The sticker references are a visual row too, so they use the same grammar
   rather than collapsing into a second grid on compact screens. */
.shop-page .sticker-showcase{
  --shop-study-card:clamp(9.5rem,16vw,11.5rem);
  display:grid!important;
  grid-template-columns:none!important;
  grid-auto-flow:column;
  grid-auto-columns:var(--shop-study-card);
  justify-content:start;
  width:100%!important;
  max-width:100%!important;
  gap:clamp(.65rem,1.5vw,.9rem)!important;
  overflow-x:auto;
  overflow-y:hidden;
  padding:.2rem 0 .7rem;
  scroll-snap-type:x proximity;
  scroll-padding-inline:0;
  overscroll-behavior-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  touch-action:pan-x pan-y;
  cursor:grab;
}
.shop-page .sticker-showcase::-webkit-scrollbar{display:none}
.shop-page .sticker-study{
  width:var(--shop-study-card);
  scroll-snap-align:start;
  scroll-snap-stop:normal;
}

@media(max-width:700px){
  .shop-page #studio-shop .shelf:not(.archive-shelf):not(#sets) .row{
    --shop-row-card:min(76vw,19rem);
    margin-inline:calc(var(--grid-pad,1rem) * -1);
    width:calc(100% + (var(--grid-pad,1rem) * 2));
    max-width:none;
    padding-inline:var(--grid-pad,1rem);
    scroll-padding-inline:var(--grid-pad,1rem);
    scroll-snap-type:x mandatory;
    gap:.8rem!important;
  }
  .shop-page .sticker-showcase{
    --shop-study-card:min(72vw,16rem);
    margin-inline:calc(var(--grid-pad,1rem) * -1);
    width:calc(100% + (var(--grid-pad,1rem) * 2))!important;
    max-width:none!important;
    padding-inline:var(--grid-pad,1rem);
    scroll-padding-inline:var(--grid-pad,1rem);
    scroll-snap-type:x mandatory;
    gap:.8rem!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .shop-page #studio-shop .shelf:not(.archive-shelf):not(#sets) .row,
  .shop-page .sticker-showcase{
    scroll-behavior:auto!important;
  }
}
