
/* Base */
.sse-wrap{position:relative;font-family:inherit;color:inheritoverflow:visible;}
.sse-slider{width:100%overflow:visible;}

/* Edge fade so slides no se vean medio cortados al borde izquierdo/derecho */
.sse-slider{
  /* sombras siguen visibles gracias al overflow:visible del wrap */
  -webkit-mask-image: linear-gradient(to right, transparent 0, black 28px, black calc(100% - 28px), transparent 100%);
  mask-image: linear-gradient(to right, transparent 0, black 28px, black calc(100% - 28px), transparent 100%);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

.sse-track{padding:0 .5rem; display:flex;gap:1rem;will-change:transformtransition:transform .6s cubic-bezier(.22,.61,.36,1);}
.sse-card{flex:0 0 100%;max-width:100%;background:#F7F5F2;color:#003B5C;border-radius:1.25rem;box-shadow:0 10px 24px rgba(0,59,92,.15);overflow:hidden;transform:translateY(8px);opacity:0;animation:sse-fadeUp .6s ease both}
@keyframes sse-fadeUp{to{transform:translateY(0);opacity:1}}
.sse-media{aspect-ratio:16/9;background:rgba(0,0,0,.05);overflow:hidden}
.sse-media img{width:100%;height:100%;object-fit:cover;display:block}
.sse-body{padding:clamp(16px,2vw,28px)}
.sse-title{margin:0 0 .25em;font:inherit;font-weight:700;line-height:1.2}
.sse-desc{margin:0 0 .75em;font:inherit;color:#8F8F8F}
/* Chips categorías */
.sse-cats{list-style:none;margin:0 0 .5rem;padding:0;display:flex;flex-wrap:wrap;gap:.35rem}
.sse-cats li{display:inline-block;padding:.25em .6em;border-radius:999px;background:#E6ECE0;color:#003B5C;font-size:.85em}
/* Price + Button footer */
.sse-price{display:inline-block;padding:.35em .65em;border-radius:999px;background:#B5C2A1;color:#003B5C;font:inherit}
.sse-button{display:inline-block;text-decoration:none;padding:.75em 1.1em;border-radius:.9rem;background:#003B5C;color:#F7F5F2;transition:transform .2s ease,box-shadow .2s ease,background .2s ease;font:inherit}
.sse-button:hover{transform:translateY(-1px);box-shadow:0 8px 16px rgba(0,59,92,.22);background:#B5C2A1;color:#003B5C}
.sse-footer{display:flex;justify-content:space-between;align-items:center;gap:.75rem;margin-top:.75rem}
/* Slider controls */
.sse-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.95);border:0;width:42px;height:42px;border-radius:999px;box-shadow:0 6px 18px rgba(0,0,0,.15);cursor:pointer}
.sse-prev{left:.5rem}.sse-next{right:.5rem}
.sse-dots{display:flex;gap:.4rem;justify-content:center;margin-top:.75rem}
.sse-dots button{width:8px;height:8px;border-radius:999px;border:0;background:rgba(0,0,0,.25)}
.sse-dots button[aria-current=true]{background:rgba(0,0,0,.65)}

/* Grid 3 cols */
.sse-grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:1rem}
@media (min-width:640px){.sse-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.sse-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.sse-grid .sse-card{flex:initial;max-width:100%}

/* Filtros */
.sse-grid-wrap{display:grid;gap:1rem}
.sse-filters{display:flex;flex-wrap:wrap;gap:.5rem;border-bottom:2px solid #B5C2A1;padding-bottom:.5rem}
.sse-filter{border:0;padding:.5em .8em;border-radius:999px;cursor:pointer;background:#B5C2A1;color:#003B5C;font:inherit}
.sse-filter.is-active{background:#003B5C;color:#F7F5F2}

/* Slider visible items: 1/2/3 */
.sse-slider .sse-card{flex-basis:100%;max-width:100%}
@media (min-width:640px){.sse-slider .sse-card{flex-basis:50%;max-width:50%}}
@media (min-width:1024px){.sse-slider .sse-card{flex-basis:33.3333%;max-width:33.3333%}}

@media (prefers-reduced-motion:reduce){.sse-card{animation:none}}

.sse-readmore{display:inline-block;margin:.35rem 0 .25rem;text-decoration:none}
.sse-readmore:hover{text-decoration:underline}


/* Motion effects on active slides */
.sse-card{transform:translateY(8px) scale(.98); transition:transform .5s cubic-bezier(.22,.61,.36,1), box-shadow .5s;}
.sse-card.is-active{transform:translateY(0) scale(1); box-shadow:0 14px 28px rgba(0,59,92,.18); z-index:2; transform:translateY(0) scale(1.02); box-shadow:0 18px 36px rgba(0,59,92,.22);}
.sse-media img{transition:transform .6s cubic-bezier(.22,.61,.36,1);}
.sse-card.is-active .sse-media img{transform:scale(1.06);}
@media (prefers-reduced-motion: reduce){
  .sse-track{padding:0 .5rem; transition:none !important}
  .sse-card, .sse-media img{transition:none !important}
}
