
.dsm{position:relative;width:100%}
.dsm *{box-sizing:border-box}
.dsm-track{display:flex;gap:var(--gap);width:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.dsm-track::-webkit-scrollbar{display:none}
.dsm-slide{position:relative;flex:0 0 var(--wd);aspect-ratio:var(--rd);border-radius:var(--rad);overflow:hidden;scroll-snap-align:start;background:#f3f0eb}
.dsm-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.dsm-cover{position:absolute;inset:0;z-index:2;display:block}
.dsm-link-label{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.dsm-copy{
position:absolute;inset:0;z-index:3;
padding:var(--copy-pt) var(--copy-pr) var(--copy-pb) var(--copy-pl);
pointer-events:none;display:flex;flex-direction:column;
}
.dsm-pos-top-left{justify-content:flex-start;align-items:flex-start;text-align:left}
.dsm-pos-top-center{justify-content:flex-start;align-items:center;text-align:center}
.dsm-pos-top-right{justify-content:flex-start;align-items:flex-end;text-align:right}
.dsm-pos-center-left{justify-content:center;align-items:flex-start;text-align:left}
.dsm-pos-center{justify-content:center;align-items:center;text-align:center}
.dsm-pos-center-right{justify-content:center;align-items:flex-end;text-align:right}
.dsm-pos-bottom-left{justify-content:flex-end;align-items:flex-start;text-align:left}
.dsm-pos-bottom-center{justify-content:flex-end;align-items:center;text-align:center}
.dsm-pos-bottom-right{justify-content:flex-end;align-items:flex-end;text-align:right}
.dsm-copy>*{max-width:88%}
.dsm .dsm-title{margin:0!important;font-family:var(--title-f)!important;font-size:var(--title-d)!important;font-weight:var(--title-w)!important;line-height:var(--title-l)!important;color:var(--title-c)!important;letter-spacing:-.03em!important;text-shadow:var(--title-shadow,none)!important}
.dsm .dsm-eyebrow{margin-top:12px!important;font-family:var(--eyebrow-f)!important;font-size:var(--eyebrow-d)!important;font-weight:var(--eyebrow-w)!important;line-height:var(--eyebrow-l)!important;color:var(--eyebrow-c)!important;text-shadow:var(--eyebrow-shadow,none)!important}
.dsm .dsm-text{margin-top:10px!important;font-family:var(--text-f)!important;font-size:var(--text-d)!important;font-weight:var(--text-w)!important;line-height:var(--text-l)!important;color:var(--text-c)!important;max-width:34ch;text-shadow:var(--text-shadow,none)!important}
.dsm-product-grid{position:absolute;left:18px;right:18px;bottom:18px;display:grid;grid-template-columns:1fr 1fr;gap:12px;z-index:4}
.dsm-product{aspect-ratio:1/1;display:block;overflow:hidden;border-radius:14px;background:#fff;transition:transform .09s ease,opacity .09s ease}
.dsm-product:active{transform:scale(.975);opacity:.88}
.dsm-product img{width:100%;height:100%;object-fit:cover;display:block}
.dsm-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:20;width:var(--arrow-size);height:var(--arrow-size);border:0;border-radius:50%;background:var(--arrow-bg);color:var(--arrow-color);box-shadow:0 2px 12px #0002;font-size:calc(var(--arrow-size) * .66);line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.dsm-arrow.prev{left:var(--arrow-offset)}
.dsm-arrow.next{right:var(--arrow-offset)}
.dsm-dots{display:flex;justify-content:center;gap:var(--dot-gap);margin-top:var(--dot-margin)}
.dsm-dot{width:var(--dot-size);height:var(--dot-size);border-radius:50%;background:var(--dot-color);cursor:pointer}
.dsm-dot.active{background:var(--dot-active)}
.dsm-admin-note{padding:12px;background:#fff3cd;border:1px solid #ffe69c}
@media(max-width:767px){
 .dsm-slide{flex-basis:var(--wm);aspect-ratio:var(--rm)}
 .dsm-copy{padding:var(--copy-ptm) var(--copy-prm) var(--copy-pbm) var(--copy-plm)}.dsm-copy>*{max-width:92%}
 .dsm .dsm-title{font-size:var(--title-m)!important}
 .dsm .dsm-eyebrow{font-size:var(--eyebrow-m)!important}
 .dsm .dsm-text{font-size:var(--text-m)!important}
 .dsm-product-grid{left:14px;right:14px;bottom:14px;gap:10px}
 .dsm-arrow{display:none}
}



.dsm-bg-video{object-fit:cover;object-position:center;background:transparent}


/* v0.3.2 — lekki feedback kliknięcia bez skalowania live-video podczas swipe */
.dsm-slide{
	transform:none !important;
	filter:none !important;
}

.dsm-slide::after{
	content:"";
	position:absolute;
	inset:0;
	z-index:5;
	pointer-events:none;
	background:rgba(0,0,0,0);
	transition:background .08s ease;
	border-radius:inherit;
}

.dsm-slide.is-tap-feedback::after{
	background:rgba(0,0,0,.07);
}

/* Wideo jest wyłącznie warstwą wizualną — nie bierze udziału w hit-testingu dotyku */
.dsm-bg-video{
	pointer-events:none !important;
	user-select:none !important;
	-webkit-user-select:none !important;
}


/* v0.4.0 — desktop: slider + stały kafel */
.dsm-shell{width:100%;position:relative}
.dsm-main{position:relative;min-width:0}
.dsm-fixed-tile{display:none;min-width:0}

@media(min-width:768px){
  .dsm.has-fixed-tile .dsm-shell{
    display:grid;
    grid-template-columns:minmax(0,1fr) var(--fixed-width);
    gap:var(--fixed-gap);
    align-items:start;
  }
  .dsm.has-fixed-tile.dsm-fixed-left .dsm-shell{
    grid-template-columns:var(--fixed-width) minmax(0,1fr);
  }
  .dsm.has-fixed-tile.dsm-fixed-left .dsm-main{grid-column:2;grid-row:1}
  .dsm.has-fixed-tile.dsm-fixed-left .dsm-fixed-tile{grid-column:1;grid-row:1}
  .dsm.has-fixed-tile .dsm-fixed-source{display:none!important}
  .dsm.has-fixed-tile .dsm-fixed-tile{display:block;width:var(--fixed-width)}
  .dsm.has-fixed-tile .dsm-fixed-tile .dsm-slide{
    width:100%;max-width:100%;flex:none;
  }
  .dsm.has-fixed-tile .dsm-main>.dsm-dots{width:100%}
}
@media(max-width:767px){
  .dsm-fixed-tile{display:none!important}
  .dsm-fixed-source{display:block!important}
}


/* v0.4.2 — reakcje hover/click dla elementów klikalnych */
.dsm-cover,
.dsm-product[href]{cursor:pointer}

/* Cały podlinkowany kafel: bez transformowania live-video, więc swipe pozostaje płynny. */
@media (hover:hover) and (pointer:fine){
  .dsm-slide:has(> .dsm-cover)::after{
    transition:background .16s ease,box-shadow .16s ease;
  }
  .dsm-slide:has(> .dsm-cover):hover::after{
    background:rgba(0,0,0,.045);
    box-shadow:inset 0 0 0 1px rgba(0,0,0,.035);
  }

  /* Zdjęcia produktów w siatkach reagują niezależnie. */
  .dsm-product[href]{
    transition:transform .16s ease,box-shadow .16s ease,opacity .12s ease;
  }
  .dsm-product[href] img{
    transition:transform .20s ease;
  }
  .dsm-product[href]:hover{
    transform:translateY(-2px);
    box-shadow:0 7px 18px rgba(0,0,0,.14);
  }
  .dsm-product[href]:hover img{
    transform:scale(1.025);
  }
}

/* Klik/tap — wyraźny, ale krótki feedback. */
.dsm-product[href]:active{
  transform:scale(.975)!important;
  opacity:.86;
}
