/* 협력 브랜드(/brands/) 전용 — 공통은 np.css(맨 위 품목 슬라이드 .np-kv 포함)
   2026-10-23 리디자인: 브랜드는 사진 + 글 줄(template-parts/np-rows.php, np-product.css), 이 파일은 생산 현장 영상. 다른 BUSINESS 페이지(np-product.css)·쇼핑몰 '마킹 기술'과 같은 결(제목 28px 800, 모서리 8px) */
.np-brands { --bd-ink: #15181d; --bd-sub: #626872; --bd-sp: clamp(4rem, 7.8vw, 7rem); }
.np-bd-sec { padding-top: var(--bd-sp); }
.np-brands .np-cta { margin-top: var(--bd-sp); }
.np-bd-title { margin: 0 0 28px; color: var(--bd-ink); font-size: 1.75rem; font-weight: 800; line-height: 1.25; letter-spacing: -.03em; }

.np-bd-vid:focus-visible { outline: 2px solid var(--bd-ink); outline-offset: 3px; }

/* 생산 현장 영상: 3개 한 줄 */
.np-bd-videos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; }
.np-bd-vid { display: block; color: inherit; text-decoration: none; }
.np-bd-vid__img { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 8px; background: #eceef1; }
.np-bd-vid__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--np-ease); }
.np-bd-play { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 52px; height: 52px; margin: -26px 0 0 -26px; border-radius: 50%; background: rgba(17, 17, 17, .6); color: #fff; transition: background-color .3s; }
.np-bd-play svg { width: 20px; height: 20px; margin-left: 3px; }
.np-bd-vid__t { display: block; margin-top: 14px; color: var(--bd-ink); font-size: 1.125rem; font-weight: 700; letter-spacing: -.02em; }
@media (hover: hover) { .np-bd-vid:hover .np-bd-vid__img img { transform: scale(1.03); } .np-bd-vid:hover .np-bd-play { background: var(--np-red); } }
@media (prefers-reduced-motion: reduce) { .np-bd-vid__img img { transition: none; } }

@media (max-width: 768px) {
  .np-bd-title { margin-bottom: 20px; font-size: 20px; line-height: 1.35; letter-spacing: -.02em; }
  .np-bd-videos { grid-template-columns: 1fr; gap: 20px; }
  .np-bd-vid__t { margin-top: 10px; font-size: 1rem; }
}
