/* look 1.0.x */
.scc { position: relative; margin: 1.25rem 0; --scc-gap: 1rem; --scc-cols: var(--scc-d, 4); }
.scc-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:.6rem; }
.scc-title { margin:0; font-size: clamp(1rem, .9rem + .5vw, 1.25rem); font-weight:700; letter-spacing:.2px; }
.scc-items { display:grid; gap: var(--scc-gap); }
.scc.layout-grid .scc-items { grid-template-columns: repeat( var(--scc-cols), minmax(0,1fr) ); }
.scc.layout-carousel .scc-items { display:flex; gap:var(--scc-gap); overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; scroll-behavior:smooth; padding:.25rem 0 .5rem; mask-image:linear-gradient(to right, transparent, #000 12px, #000 calc(100% - 12px), transparent); }
.scc.layout-carousel .scc-item { flex:0 0 calc(100% / var(--scc-cols)); scroll-snap-align:start; scroll-snap-stop:always; min-width:0; }
.scc-fallback { border-radius:14px; overflow:hidden; box-shadow:0 6px 18px rgba(0,0,0,.06); background:#fff; transition:transform .18s ease, box-shadow .18s ease; }
.scc-fallback:hover { transform:translateY(-2px); box-shadow:0 10px 26px rgba(0,0,0,.10); }
.scc-fallback .scc-thumb img { width:100%; height:clamp(160px,28vw,220px); object-fit:cover; display:block; }
.scc-fallback .scc-entry { margin:.55rem .75rem .8rem; font-weight:700; font-size:clamp(.95rem, .9rem + .2vw, 1.05rem); }
.scc-nav { position:absolute; top:45%; transform:translateY(-50%); border:0; background:rgba(255,255,255,.85); border:1px solid rgba(0,0,0,.12); padding:.45rem .55rem; cursor:pointer; line-height:1; border-radius:999px; backdrop-filter:blur(2px); box-shadow:0 4px 14px rgba(0,0,0,.08); }
.scc-prev { left:.25rem; } .scc-next { right:.25rem; }
@media (max-width: 768px){ .scc { --scc-cols: var(--scc-t, 2); } .scc-nav { top:40%; } }
@media (max-width: 480px){ .scc { --scc-cols: var(--scc-m, 1); } .scc-nav{ display:none; } }