/* 상단 헤더 */
.site-header{ background:#fff; border-bottom:1px solid #eaeef2; }
.site-header .container{ max-width:1200px; margin:0 auto; padding:10px 16px; display:flex; align-items:center; gap:16px; }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:#111; font-weight:700; }
.brand img{ height:28px; width:auto; display:block; }
.brand-text{ letter-spacing:-0.2px; }
.menu{ margin-left:auto; display:flex; gap:24px; }
.menu a{ color:#111; text-decoration:none; padding:18px 0; font-weight:600; }
.menu a[aria-current="page"]{ color:#5b47d8; }
.burger{ margin-left:8px; width:40px; height:40px; background:transparent; border:0; display:none; }
.burger span{ display:block; height:2px; margin:6px 8px; background:#111; }
@media (max-width:900px){
  .menu{ display:none; position:absolute; right:16px; top:56px; background:#fff; border:1px solid #eee; border-radius:12px; padding:12px; flex-direction:column; gap:10px; }
  .menu.open{ display:flex; }
  .burger{ display:inline-block; }
}

/* 페이지 헤더 */
.dm-products{--maxw:1200px;--gap:clamp(12px,2vw,20px);--r:16px;--b:#e5e7eb;--ink:#111827;--muted:#6b7280;--bg:#f8fafc;--card:#fff;--shadow:0 6px 24px rgba(0,0,0,.08)}
.dm-products .wrap{max-width:var(--maxw);margin-inline:auto;padding:24px 16px 48px}
.page-hd{ margin:0 0 12px; }
.page-hd h1{ margin:0 0 12px; font-size:32px; font-weight:900; letter-spacing:-.3px; }
.tabs{ display:flex; gap:8px; flex-wrap:wrap; }
.tabs a{ padding:6px 12px; border:1px solid var(--b); border-radius:999px; background:#fff; color:#333; text-decoration:none; }
.tabs a.active{ background:#ece8ff; color:#4a2dbf; border-color:#e2ddff; }

/* 미디어 카드 */
.media-grid{ display:grid; gap:20px; }
@media(min-width:960px){ .media-grid{ grid-template-columns:repeat(3,1fr) } }
.media-card{ background:#fff; border:1px solid var(--b); border-radius:16px; box-shadow:var(--shadow); overflow:hidden; display:flex; flex-direction:column }
.media-card .video{ position:relative; aspect-ratio:16/9; background:#000 }
.media-card iframe{ position:absolute; inset:0; width:100%; height:100%; border:0 }
.media-card .bd{ padding:14px 16px }
.media-card h3{ margin:0 0 6px; font-size:16px }
.media-card p{ margin:0; color:#374151; line-height:1.6 }
.btn{ padding:10px 14px; border-radius:10px; border:1px solid #0ea5e9; color:#fff; background:#0ea5e9; font-weight:600; text-decoration:none }
.cta{ display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:18px; flex-wrap:wrap }