/* 도큐마인드 제품 쪽(documind.html)에만 쓰는 꾸밈. 공통 부품은 product-page.css */
.pp.is-mind{--p1:#b18cff;--p2:#6a2fe6}
/* 색 띠 배경(위에서부터 1~5) */
.pp-band.bg-1{--bg:#cdb9ff}
.pp-band.bg-2{--bg:#f6f2ff}
.pp-band.bg-3{--bg:#ffe8f4}
.pp-band.bg-4{--bg:#ece9f5}
.pp-band.bg-5{--bg:#1d1534}

/* 도큐마인드 쪽에만 쓰는 꾸밈 */
.dm-lead{margin:-14px 0 24px;font-size:15px;color:var(--x-sub)}
.dm-stat{display:flex;align-items:baseline;gap:14px;margin:26px 0 0 !important;opacity:1 !important}
.dm-stat b{font-size:clamp(34px,4vw,48px);font-weight:800;letter-spacing:-.04em;color:var(--p2)}
.dm-stat i{font-style:normal;font-size:22px;color:var(--x-sub)}
.dm-stat span{font-size:14px;color:var(--x-sub)}

/* 권한 확인 그림(예시) */
.dm-gate{padding:26px;border-radius:20px;background:#fff;box-shadow:0 0 0 1px #6a2fe61f,0 18px 40px #2b155a14}
.pp-band .dm-gate-q{display:flex;gap:10px;align-items:flex-start;padding:14px 16px;border-radius:12px;background:#f4efff;font-size:15px;font-weight:600;color:var(--x-ink);word-break:keep-all}
.dm-gate-q em{flex:0 0 auto;padding:2px 8px;border-radius:6px;background:var(--p2);font-style:normal;font-size:12px;font-weight:700;color:#fff}
.pp-band .dm-gate-step{margin:18px 0 10px;font-size:12.5px;font-weight:700;color:var(--x-sub);opacity:1}
.pp-band .dm-gate ol{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.pp-band .dm-gate li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;background:var(--x-soft);font-size:14px;font-weight:600;color:var(--x-ink)}
.pp-band .dm-gate li b{font-weight:600}
.pp-band .dm-gate li span{flex:0 0 auto;font-size:12.5px;font-weight:700}
.dm-gate .is-ok span{color:#1a7f4b}
.pp-band .dm-gate li.is-no{background:#fff;box-shadow:inset 0 0 0 1px var(--x-line);color:var(--x-sub)}
.dm-gate .is-no b{text-decoration:line-through;text-decoration-color:#0000004d}
.dm-gate .is-no span{color:#c2410c}
.pp-band .dm-gate-a{margin-top:16px;opacity:1;padding:14px 16px;border-radius:12px;background:linear-gradient(90deg,var(--p2),var(--p1));font-size:14.5px;font-weight:700;color:#fff;word-break:keep-all}
.dm-gate small{display:block;margin-top:12px;font-size:12px;color:var(--x-sub);opacity:1}

/* 이런 곳에서 씁니다 */
.dm-audience{margin-top:88px}
.dm-audience-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.dm-audience-grid div{padding:22px 24px;border-radius:14px;background:#f6f2ff}
.dm-audience-grid b{display:block;margin-bottom:6px;font-size:16px;font-weight:800}
.dm-audience-grid span{font-size:14.5px;line-height:1.7;color:var(--x-text);word-break:keep-all}

/* 요금 표 */
.dm-price{min-width:760px}
.dm-price td,.dm-price th{white-space:nowrap}
.dm-price tr>:last-child{text-align:right}
.dm-price .nx-btn{min-height:38px;padding:0 14px;font-size:13.5px}
.dm-trial{background:#f4efff}
.dm-trial h3{color:var(--p2)}

/* 설치 */
.dm-install{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:40px;align-items:start}
.dm-site{display:block;border-radius:18px;box-shadow:0 0 0 1px var(--x-line),0 14px 30px #1113180f;overflow:hidden;transition:transform .2s}
.dm-site:hover{transform:translateY(-3px)}
.dm-site .photo-slot{border-radius:0;background:var(--x-soft)}
.dm-site p{margin:0;padding:12px 16px;font-size:13.5px;font-weight:700;color:var(--x-text);border-top:1px solid var(--x-line)}

@media(max-width:900px){
  .dm-audience-grid{grid-template-columns:1fr 1fr}
  .dm-install{grid-template-columns:1fr}
}
@media(max-width:600px){
  .pp-features h2{word-break:keep-all}
  .dm-price-wrap{overflow:visible;box-shadow:none}
  .dm-price{min-width:0;background:none}
  .dm-price thead{display:none}
  .dm-price,.dm-price tbody{display:block}
  .dm-price tr{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;margin-bottom:10px;padding:16px 18px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px var(--x-line)}
  .dm-price th,.dm-price td{padding:0;border:0 !important;white-space:normal}
  .dm-price tbody th{font-size:16px}
  .dm-price td.is-price{text-align:right}
  .dm-price td[data-l]:not(.is-price){font-size:14px}
  .dm-price td[data-l]:not(.is-price):before{content:attr(data-l) ' ';color:var(--x-sub)}
  .dm-price tr>:last-child{grid-column:1/-1;margin-top:8px;text-align:left}
  .dm-price .nx-btn{width:100%;box-sizing:border-box}
  #specs .pp-table{min-width:0}
  #specs .pp-table th{width:76px;padding-right:8px}
  .dm-audience-grid{grid-template-columns:1fr}
  .dm-gate{padding:18px}
  .pp-band .dm-gate li{flex-direction:column;align-items:flex-start;gap:4px}
}
.dm-lead{text-align:center}