/* 도큐중계서버 제품 쪽(p2p.html)에만 쓰는 꾸밈. 공통 부품은 product-page.css */
.pp.is-p2p{--p1:#ffab52;--p2:#f2581d}
/* 색 띠 배경(위에서부터 1~5) */
.pp-band.bg-1{--bg:#ffdcb6}
.pp-band.bg-2{--bg:#fff3e6}
.pp-band.bg-3{--bg:#f3f4f6}
.pp-band.bg-4{--bg:#ffffff}
.pp-band.bg-5{--bg:#2a1a10}

/* 도큐중계서버 쪽 전용 */
.pp-band.is-plain li{background:var(--x-soft)}
.pp-band.is-plain .photo-slot{background:var(--x-soft)}
.pp-promo b,.pp-features h2,.pp-section h2,.pp-note{word-break:keep-all}
/* 연결 흐름 3단계 */
.p2p-flow{margin:0;padding:0;list-style:none;display:grid;gap:14px;counter-reset:flow}
.p2p-flow li{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 16px;align-items:start;padding:22px 24px;border-radius:16px;background:#fff;box-shadow:0 10px 26px #f2581d14;counter-increment:flow}
.p2p-flow li:before{content:counter(flow);grid-row:span 2;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--p1),var(--p2));font-size:17px;font-weight:800;color:#fff}
.p2p-flow li+li:after{content:'';position:absolute;left:43px;top:-14px;width:2px;height:14px;background:#f2581d55}
.p2p-flow b{font-size:16.5px;font-weight:800;color:var(--x-ink)}
.p2p-flow span{font-size:14.5px;line-height:1.7;color:var(--x-text);word-break:keep-all}
.p2p-flow em{font-style:normal;font-weight:800;color:var(--p2)}
/* SDK 상자 */
.p2p-sdk{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.p2p-sdk div{padding:22px;border-radius:16px;background:#fff;box-shadow:0 0 0 1px var(--x-line)}
.p2p-sdk .is-wide{grid-column:1/-1}
.p2p-sdk small{display:block;margin:0 0 6px;font-size:12px;font-weight:800;letter-spacing:.04em;color:var(--p2);opacity:1}
.p2p-sdk b{display:block;margin-bottom:6px;font-size:16px;font-weight:800;color:var(--x-ink)}
.p2p-sdk span{display:block;font-size:14px;line-height:1.7;color:var(--x-text);word-break:keep-all}
@media(max-width:600px){.p2p-sdk{grid-template-columns:1fr}}
