@charset "utf-8";
/* ==========================================================================
   템플릿 데모 뷰어 — 상품 상세 "데모 체험" 탭
   ========================================================================== */
.bz-demo{margin:8px 0 28px}

.bz-demo__bar{display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:wrap;margin-bottom:14px}
.bz-demo__label{margin:0;font-size:var(--fs-sm);color:var(--bz-muted);font-weight:600}
.bz-demo__actions{display:flex;gap:8px;flex-wrap:wrap}
.bz-demo__actions .bz-btn{min-height:40px;padding:0 18px;font-size:var(--fs-xs)}

/* 기기 프레임
   ※ iframe에 직접 width를 주면 공통 이미지 크기 조절 스크립트가 되돌린다.
      래퍼(.bz-demo__screen)의 폭을 바꾸고 iframe은 100%로 두는 방식이 안전하다. */
/* ※ flex 컨테이너 안의 iframe은 최소 크기를 강제해 인라인 width가 무시된다.
      (flex:none, min-width:0 으로도 안 됨) 그래서 block + margin:auto 로 간다. */
.bz-demo__stage{display:block;padding:20px;
  border:1px solid var(--bz-line);border-radius:var(--bz-radius);
  background:var(--bz-soft);overflow:hidden}
.bz-demo__screen{width:100%;max-width:100%;margin:0 auto;
  transition:width .35s cubic-bezier(.16,1,.3,1)}
.bz-demo__frame{display:block;width:100%;height:660px;border:0;
  border-radius:10px;background:#fff;box-shadow:var(--bz-shadow-lg)}
.bz-demo__note{margin:12px 2px 0;font-size:var(--fs-xs);color:var(--bz-muted);line-height:1.7}

@media (max-width:768px){
  .bz-demo__frame{height:480px}
  .bz-demo__screen{width:100%!important}
  .bz-demo__stage{padding:12px}
  .bz-demo__bar{justify-content:center}
}

/* 상세 상단 — 가격/CTA 영역 보강 */
.bz-item-cta{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.bz-item-notice{margin-top:18px;padding:16px 18px;border-radius:var(--bz-radius-sm);
  background:#FFF8E6;border:1px solid #F5E3B3}
.bz-item-notice h4{margin:0 0 8px;font-size:var(--fs-sm);font-weight:800;color:#7A5A00}
.bz-item-notice ul{margin:0;padding-left:16px}
.bz-item-notice li{font-size:var(--fs-xs);color:#6B5518;line-height:1.85}