/* 카드: 기존 틀(span.pv-num 위 · h3 아래, 세로 간격 12px)은 그대로 두고 번호+제목만 누르게 버튼으로 감쌈.
   all:unset으로 버튼 기본 테두리·배경을 지워 보기엔 전과 같고, 포커스 표시만 더함. */
.pv-card{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:12px;width:100%;box-sizing:border-box;}
.pv-card:focus-visible{outline:2px solid var(--troon-ink,#232726);outline-offset:4px;border-radius:2px;}
/* 스크립트가 돌 때만 설명(<p>)을 카드에서 숨김 — 위젯이 유일한 자리가 됨.
   스크립트가 안 돌면(이 클래스가 안 붙음) 설명이 지금처럼 카드 안에 그대로 보인다. */
html.js-pv-widget-active .pv-benefit-grid li>p{display:none;}

/* ── 위젯(dialog) ── */
.pv-widget{border:0;padding:0;margin:auto;background:var(--troon-ivory,#F4F1EA);color:var(--troon-ink,#232726);
 width:min(560px,calc(100% - 40px));max-height:min(80svh,640px);border-radius:14px;overflow:hidden;
 box-shadow:0 30px 70px -24px rgba(10,12,10,.5);}
.pv-widget[open]{display:flex;flex-direction:column;}
.pv-widget::backdrop{background:rgba(18,20,17,.58);}
.pv-widget-close{align-self:flex-end;flex:none;margin:14px 14px 0 0;padding:8px 14px;font-size:13px;
 background:transparent;border:1px solid var(--troon-line,var(--troon-stone));border-radius:999px;
 color:var(--troon-ink,#232726);cursor:pointer;}
.pv-widget-close:hover{background:rgba(35,39,38,.06);}
.pv-widget-body{overflow-y:auto;-webkit-overflow-scrolling:touch;padding:4px clamp(24px,5vw,48px) clamp(32px,5vw,48px);}

/* 위젯 제목 = 그 카드의 번호+제목(복제), 그 아래 그 항목 설명(복제) — 새 글 없음 */
.pv-widget-desc .pv-num{display:block;font-family:var(--font-heading,serif);font-size:32px;color:#a9875f;line-height:1;margin:0 0 10px;}
.pv-widget-desc h2{font-family:var(--font-heading,serif);font-weight:400;font-size:clamp(22px,2.6vw,28px);line-height:1.3;margin:0 0 18px;}
.pv-widget-desc p{font-size:15px;line-height:1.9;margin:0;color:inherit;}

@media(max-width:640px){
 .pv-widget{width:calc(100% - 24px);max-height:88svh;}
}