/* 취급품목 (products.html, p-*.html) — 카드형 상세 구성 */

/* 히어로 카드 보정: 첫 줄 보통 굵기, 둘째 줄 파랑 굵게 */
.ppage .sub-hero .sh-lead{font-weight:500;color:var(--ink)}
.ppage .sub-hero .sh-lead em{font-weight:800}
.ppage .sh-btns{align-items:center}
.ppage .sh-btns .btn{font-size:14px;padding:11px 20px}
.pbtn-o{border-color:#fff!important;box-shadow:var(--sh1);color:var(--brand-dark)!important}
.pbtn-o:hover{background:var(--brand-tint)!important}
.phero-status{flex-basis:100%;font-size:12.5px;color:var(--ink3);margin-top:6px}
.ppage .crumb a{color:inherit}

/* 본문 폭 */
.pw{max-width:1100px;margin:0 auto;padding:0 var(--gutter)}

/* 수령 안내 띠 */
.pnote-bar{margin:20px 0 0;background:var(--brand-tint);border:1px solid var(--brand-tint-line);color:var(--brand-dark);border-radius:12px;padding:13px 18px;font-size:14.5px;line-height:1.6}
.pnote-bar b{font-weight:800}
.pnote-bar a{display:inline-flex;align-items:center;gap:3px;font-weight:700;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}

/* 섹션 + 왼쪽 정렬 제목 */
.psec{padding-top:44px}
.psec-hd{margin-bottom:16px}
.psec-hd h2{font-size:clamp(20px,2.8vw,25px);font-weight:800;letter-spacing:-.03em;line-height:1.35}
.psec-hd p{margin-top:6px;color:var(--ink2);font-size:14.5px}
.psec-hd p a{display:inline-flex;align-items:center;gap:3px;font-weight:700;color:var(--brand)}
.psec-hd-row{display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.psec-hd-row a{display:inline-flex;align-items:center;gap:4px;font-size:14px;font-weight:700;color:var(--brand);white-space:nowrap}

/* 알약 검색 */
.psearch{display:flex;align-items:center;gap:8px;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:9px 16px;margin-bottom:14px;box-shadow:var(--sh1);color:var(--ink2)}
.psearch:focus-within{border-color:var(--brand)}
.psearch input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-family:inherit;font-size:15px;color:var(--ink)}
.psearch-cnt{flex:none;font-size:12.5px;font-weight:700;color:var(--brand-dark);white-space:nowrap}

/* 번호 품목 카드 */
.pitems{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.pitem{display:flex;flex-direction:column;background:#fff;border:1.5px solid var(--line);border-radius:16px;transition:transform .15s,box-shadow .15s,border-color .15s}
.pitem:hover{transform:translateY(-2px);box-shadow:var(--sh2)}
.pitem[hidden]{display:none}
.pitem-hd{display:flex;align-items:center;justify-content:center;min-height:60px;padding:10px 12px;font-size:15px;font-weight:800;letter-spacing:-.02em;line-height:1.35;text-align:center;background:var(--brand-tint);color:var(--brand-dark);border-radius:14.5px 14.5px 0 0}
.pitem-hd u{text-decoration:none;opacity:.65;margin-right:4px;font-size:13.5px}
.pitem-th{margin:8px 8px 0;aspect-ratio:4/3;border-radius:10px;background:#fff center/contain no-repeat}
.pitem-ft{margin-top:auto;padding:9px 12px 11px;border-top:1px solid var(--tint);margin-top:8px}
.pitem-r1{display:flex;align-items:center;justify-content:space-between;gap:6px}
.pitem-r1 em{font-style:normal;font-size:14.5px;font-weight:800;color:var(--brand);letter-spacing:-.02em}
.pitem-r1 a{flex:none;display:inline-flex;align-items:center;gap:3px;font-size:11.5px;font-weight:700;color:var(--brand-dark);background:var(--brand-tint);border-radius:999px;padding:3px 9px}
.pitem-r1 a:hover{background:#dce8fc}
.pitem-ft p{margin-top:3px;font-size:12px;font-weight:700;color:var(--ink2);line-height:1.45}
.pitem-ft p.q{color:var(--ink3);font-weight:600}
.pitem-ft small{font-size:11px;font-weight:600;color:var(--ink3)}
.pempty{margin-top:12px;background:#fff;border:1px dashed var(--line);border-radius:12px;padding:18px;text-align:center;color:var(--ink2);font-size:14.5px}
.pempty a,.pfoot-note a{font-weight:700;color:var(--brand)}
.pfoot-note{margin-top:14px;font-size:13.5px;color:var(--ink2)}

/* 주문 전 확인 5단계 박스 */
.psteps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.pstep{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 14px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px}
.pstep span{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:var(--brand-tint);color:var(--brand-dark);font-size:12px;font-weight:800;margin-bottom:4px}
.pstep b{font-size:15px;font-weight:800;letter-spacing:-.02em;line-height:1.35}
.pstep small{font-size:13px;color:var(--ink2)}
.pcaution{margin:16px 0 0;padding-left:1.15em;display:flex;flex-direction:column;gap:5px;font-size:13.5px;color:var(--ink2)}
.pstep-act{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}

/* 납품 카드 (공용 dcard) 열 수 */
.ppage .psec .dlv{gap:12px}

/* 상품형 카드 (목록 · 다른 품목 공용) */
.pgoods-sec{padding:56px 0 64px}
.pgoods-wrap{max-width:1280px}
.pfind{display:flex;align-items:center;gap:12px;max-width:640px;height:56px;margin:0 auto 22px;padding:5px 5px 5px 21px;border:1px solid var(--line);border-radius:30px;background:#fff;box-shadow:0 3px 10px rgba(35,68,107,.05);color:#7b8796}
.pfind:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px rgba(47,111,228,.12)}
.pfind input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-family:inherit;font-size:16px;color:var(--ink)}
.pfind input::-webkit-search-cancel-button{cursor:pointer}
.pfind button{display:flex;align-items:center;justify-content:center;gap:7px;flex:none;min-width:92px;height:44px;padding:0 20px;border:0;border-radius:26px;background:var(--brand);color:#fff;font-family:inherit;font-size:15px;font-weight:700;cursor:pointer}
.pfind button:hover{background:var(--brand-dark)}
.pchips{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:28px}
.pchip{border:1px solid var(--line);background:#fff;color:var(--ink2);font-family:inherit;font-size:15px;font-weight:600;padding:9px 19px;border-radius:999px;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.pchip:hover{background:var(--tint)}
.pchip.on{background:var(--brand);border-color:var(--brand);color:#fff}
.pgoods{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.3vw,20px)}
.pgood{display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;color:var(--ink);transition:transform .15s,box-shadow .15s,border-color .15s}
.pgood:hover{transform:translateY(-3px);box-shadow:var(--sh2);border-color:transparent}
.pgood[hidden]{display:none}
.pgood-th{display:block;aspect-ratio:4/3;background:#fff center/contain no-repeat}
.pgood-bd{display:flex;flex-direction:column;flex:1;padding:14px 16px 16px}
.pgood-tag{align-self:flex-start;font-size:12px;font-weight:700;color:var(--brand-dark);background:var(--brand-tint);border-radius:6px;padding:1px 7px;margin-bottom:7px}
.pgood-nm{font-size:clamp(16px,1.1vw,18px);font-weight:800;letter-spacing:-.03em;line-height:1.4}
.pgood-it{margin-top:6px;font-size:13px;color:var(--ink2);line-height:1.55}
.pgood-go{margin-top:auto;padding-top:12px;display:inline-flex;align-items:center;gap:4px;font-size:13.5px;font-weight:700;color:var(--brand)}
.pgood-sm .pgood-bd{padding:10px 12px 12px}
.pgood-sm .pgood-tag{font-size:10.5px;padding:1px 6px;margin-bottom:5px}
.pgood-sm .pgood-nm{font-size:14px}
.pothers{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px}
.pspace{height:56px}

/* 떠 있는 견적 바구니 버튼은 catalog.css (.cq-fab) */

@media (max-width:1000px){
  .pitems{grid-template-columns:repeat(3,minmax(0,1fr))}
  .psteps{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pgoods{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pothers{grid-template-columns:repeat(4,minmax(0,1fr))}
  .pgoods-sec{padding:44px 0 52px}
}
@media (max-width:560px){
  .pitems{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .pitem-hd{font-size:13.5px;min-height:52px;padding:8px}
  .pitem-ft{padding:8px 10px 10px}
  .psteps{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .pstep:last-child{grid-column:1/-1}
  .pgoods{gap:10px}
  .pgood-bd{padding:12px 12px 14px}
  .pgood-it{display:none}
  .pothers{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pfind{height:50px;padding-left:16px}
  .pfind button{min-width:44px;width:44px;padding:0}
  .pfind button span{display:none}
  .pchips{gap:6px}
  .pchip{font-size:14px;padding:7px 14px}
  .psec-hd-row{flex-wrap:wrap}
}