.ss-wrap{width:100%}
.ss-grid{display:grid;grid-template-columns:repeat(var(--ss-cols,3),minmax(0,1fr));gap:var(--ss-gap,20px)}
.ss-item{min-width:0}
.ss-card{position:relative;background:#fff}
.ss-card img{display:block;width:100%;height:auto;max-width:100%}
.ss-title{margin:10px 0 0;font-size:1.05rem;padding:0 4px 8px}

/* Masonry: row-span technique (keeps left-to-right order, works with appended items) */
.ss-layout-masonry .ss-grid{grid-auto-rows:1px;row-gap:0}
.ss-layout-masonry .ss-item{align-self:start}

/* Slider */
.ss-slider{position:relative}
.ss-viewport{overflow:hidden;transition:height .3s ease}
.ss-track{display:flex;align-items:flex-start;transition:transform .4s ease;will-change:transform}
.ss-slide{flex:0 0 100%;min-width:0}
.ss-nav{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border:0;border-radius:50%;background:rgba(0,0,0,.5);color:#fff;font-size:22px;line-height:1;cursor:pointer;padding:0;opacity:0;transition:opacity .2s;z-index:2}
.ss-slider:hover .ss-nav,.ss-nav:focus{opacity:1}
.ss-prev{left:8px}.ss-next{right:8px}
.ss-dots{position:absolute;left:0;right:0;bottom:8px;display:flex;justify-content:center;gap:6px;z-index:2}
.ss-dot{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.6);cursor:pointer}
.ss-dot.is-active{background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.3)}
@media (hover:none){.ss-nav{opacity:1}}

/* Loader */
.ss-sentinel{height:40px;text-align:center;margin-top:20px;visibility:hidden}
.ss-wrap.is-loading .ss-sentinel{visibility:visible}
.ss-wrap.is-done .ss-sentinel{display:none}
.ss-spinner{display:inline-block;width:28px;height:28px;border:3px solid #ddd;border-top-color:#333;border-radius:50%;animation:ss-spin .7s linear infinite}
@keyframes ss-spin{to{transform:rotate(360deg)}}
