.ns-section { padding: 2rem 0; }
.ns-outer { position: relative; padding: 0 44px; }
.ns-wrap { overflow: hidden; }
.ns-track { display: flex; gap: 16px; transition: transform 0.4s cubic-bezier(.4,0,.2,1); }

.ns-card { flex: 0 0 calc(33.333% - 11px); background: #fff; border: 1px solid #e8e8e8; border-radius: 10px; overflow: hidden; }
.ns-card a { display: block; text-decoration: none; color: inherit; }
.ns-card a:hover .ns-title { text-decoration: underline; }

.ns-thumb img { width: 100%; height: 180px; object-fit: cover; display: block; }
.ns-no-img { width: 100%; height: 180px; background: #f3f3f3; }

.ns-body { padding: 12px 14px 16px; }
.ns-cat { display: inline-block; font-size: 11px; font-weight: 700; color: #0070c0; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 6px; }
.ns-title { font-size: 14px; font-weight: 600; line-height: 1.5; margin: 0 0 8px; }
.ns-date { font-size: 12px; color: #999; }

.ns-btn { position: absolute; top: 50%; transform: translateY(-50%); background: #fff; border: 1px solid #ddd; border-radius: 50%; width: 36px; height: 36px; font-size: 22px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.ns-btn:hover { background: #f5f5f5; }
.ns-prev { left: 0; }
.ns-next { right: 0; }

.ns-dots { display: flex; justify-content: center; gap: 6px; margin-top: 16px; }
.ns-dots .dot { width: 6px; height: 6px; border-radius: 50%; background: #ccc; cursor: pointer; transition: .2s; border: none; padding: 0; }
.ns-dots .dot.active { background: #555; width: 18px; border-radius: 3px; }

@media (max-width: 768px) {
  .ns-card { flex: 0 0 calc(50% - 8px); }
}
@media (max-width: 480px) {
  .ns-outer { padding: 0 32px; }
  .ns-card { flex: 0 0 100%; }
}