/* ── 병원 상세 개편안 A (src/views/clinic.js .cv2) ──
   시안: docs/mounjaro-price-compare/design/redesign-A/4-clinic-mobile.png · web/w4-clinic.png
   모바일 한 줄 쌓기 → 1024px 부터 2단(왼쪽 본문 / 오른쪽 따라오는 총액 카드) */

/* 노렌 머리가 화면 끝까지 닿게: 이 페이지에서만 가로 넘침 자르기 */
body:has(.cv2){overflow-x:clip}
.cv2{--cv2-gap:12px}

/* ── 남색 노렌 머리 ── */
.cv2-head{margin:0 calc(50% - 50vw) 0;background:var(--ai);color:#fff;position:relative;padding:12px 0 16px}
.cv2-head-in{max-width:1180px;margin:0 auto;padding:0 20px}
.cv2-head-bar{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.cv2-ibtn,.cv2-head .eg-save,.cv2-head .eg-share-btn{width:44px;height:44px;border-radius:14px;background:rgba(255,255,255,.12);border:2px solid rgba(255,255,255,.28);color:#fff;display:inline-grid;place-items:center;padding:0;box-shadow:none;flex:none;text-decoration:none}
.cv2-ibtn svg.i,.cv2-head .eg-save svg.i,.cv2-head .eg-share-btn svg.i{width:20px;height:20px}
.cv2-head .eg-save[aria-pressed=true]{background:#fff;color:var(--shu);border-color:#fff}
.cv2-head .eg-share-btn{font-size:0;gap:0}
.cv2-head .eg-share{position:relative}
.cv2-head .eg-share-menu{color:var(--sumi);right:0;left:auto}
.cv2-head-act{margin-left:auto;display:flex;gap:6px}
.cv2-crumb{display:none;font-size:13px;font-weight:700;color:#D3DCE8}
.cv2-crumb a{color:#fff;text-decoration:none}
.cv2-crumb a:hover{text-decoration:underline}
.cv2-head h1{font-family:'Jua';font-weight:400;font-size:26px;line-height:1.15;word-break:keep-all;overflow-wrap:anywhere}
.cv2-sub{font-size:13px;color:#D3DCE8;font-weight:600;margin-top:4px;line-height:1.5}
.cv2-addr{display:none}
.cv2-verified{margin-top:8px;font-size:12.5px;font-weight:700;color:#D3DCE8}
.cv2-verified .stamp{background:#fff}
/* 노렌 아랫단 톱니 */
.cv2-cut{position:absolute;left:0;right:0;bottom:-9px;display:flex;gap:4px;padding:0 4px;height:10px;overflow:hidden}
.cv2-cut span{flex:1 0 34px;height:10px;background:var(--ai);border-radius:0 0 6px 6px}
.cv2-sample{margin-top:18px}

/* ── 배치 ── */
.cv2-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--cv2-gap);margin-top:20px}
.cv2-desk{display:none!important}

/* ── 사실 4칸 ── */
.cv2-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.cv2-fact{background:#fff;border:2px solid var(--line);border-radius:12px;padding:8px 4px 7px;text-align:center;font-size:12px;line-height:1.25;color:var(--sumi);text-decoration:none;min-width:0}
.cv2-fact svg.i,.cv2-fact .jx-ic,.cv2-fact>svg{width:20px;height:20px;display:block;margin:0 auto 3px;color:var(--ai)}
.cv2-fact b{display:block;font-weight:800;word-break:keep-all}
.cv2-fact small{display:block;font-size:11px;color:var(--sumi-2);font-weight:600;margin-top:1px;word-break:keep-all}
.cv2-fact.unk{border-style:dashed;border-color:var(--tamago-line);background:var(--tamago-soft)}
.cv2-fact.unk svg.i,.cv2-fact.unk>svg{color:var(--tamago-text)}
.cv2-fact.unk small{color:var(--tamago-text);font-weight:700}

/* ── 총액 카드 ── */
.cv2-total{padding:12px 14px 12px;background:var(--card);border:2px solid var(--wood-line);border-radius:18px;box-shadow:0 3px 0 var(--wood-dark)}
.cv2-plates{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.cv2-plate{--pc:#EADBB8;--pd:#C9B58C;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-family:'Jua';font-size:13px;color:var(--sumi);padding:0;
  background:radial-gradient(circle,#FFFDF7 0 48%,var(--pc) 50%);border:0;box-shadow:0 2px 0 var(--pd)}
.cv2-plate.p25{--pc:#EADBB8;--pd:#C9B58C}.cv2-plate.p5{--pc:#F28FA5;--pd:#C9667D}.cv2-plate.p75{--pc:#FFC93C;--pd:#D59E17}
.cv2-plate.p10{--pc:#7DC25A;--pd:#55963A}.cv2-plate.p125{--pc:#5AA7DD;--pd:#3A7FB2}.cv2-plate.p15{--pc:#A77FD8;--pd:#7C58AE}
.cv2-plate.on{box-shadow:0 0 0 2px #FFFDF7,0 0 0 4px var(--shu),0 2px 0 var(--pd)}
.cv2-plate:disabled{opacity:.32;cursor:not-allowed;box-shadow:none}
.cv2-plate:focus-visible{outline:3px solid var(--ai);outline-offset:4px}
.cv2-mode-row{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.cv2-mode{font-size:12.5px;font-weight:800;color:var(--sumi-2);min-width:0}
.cv2-months{margin-left:auto;display:flex;border:2px solid var(--line);border-radius:12px;overflow:hidden;flex:none}
.cv2-months button{min-width:40px;height:40px;padding:0 9px;border:0;background:#fff;font-size:13px;font-weight:800;color:var(--sumi-2)}
.cv2-months button+button{border-left:2px solid var(--line)}
.cv2-months button[aria-checked=true]{background:var(--ai);color:#fff}
.cv2-recv{display:flex;border:2px solid var(--line);border-radius:12px;overflow:hidden;flex:none}
.cv2-recv button{height:40px;padding:0 10px;border:0;background:#fff;font-size:13px;font-weight:800;color:var(--sumi-2);white-space:nowrap}
.cv2-recv button+button{border-left:2px solid var(--line)}
.cv2-recv button[aria-pressed=true]{background:var(--ai-soft);color:var(--ai)}
.cv2-big{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:8px}
.cv2-big b{font-family:'Jua';font-weight:400;font-size:36px;line-height:1.05;grid-row:1 / span 2}
.cv2-big-r{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 8px;min-width:0}
.cv2-big #total-won{font-size:15px;font-weight:800;color:var(--sumi-2);white-space:nowrap}
.cv2-stamp{margin-left:auto;font-size:15px;padding:3px 8px 1px;white-space:nowrap}
.cv2-stamp[hidden]{display:none}
.cv2-lines{margin-top:8px;font-size:12.5px;color:var(--sumi-2);font-weight:600;display:flex;flex-wrap:wrap;gap:2px 10px}
.cv2-lines b{color:var(--sumi);font-weight:800}
.cv2-lines [hidden]{display:none}
.cv2-unk b{color:var(--tamago-text)}
.cv2-alpha{color:var(--tamago-text)}
.cv2-foot{margin-top:8px;padding-top:8px;border-top:1.5px dashed var(--line);font-size:11.5px;color:var(--sumi-2);font-weight:600;line-height:1.6}
.cv2-foot .prep-cta{font-weight:800}
.cv2-noprice{display:flex;gap:12px;align-items:center;font-size:14px;line-height:1.55}
.cv2-noprice svg{flex:none}

/* 데스크톱 카드 아래 버튼(모바일은 하단 바가 대신) */
.cv2-actions{display:none}
.cv2-actions-2{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:10px}
.cv2-actions-2 .eg-save{width:auto;height:48px;border-radius:14px;gap:6px;box-shadow:0 3px 0 var(--line)}
.cv2-actions-2 .btn{height:48px;font-size:15px;padding:0 8px}
.cv2-actions-2 .eg-save::after{content:'찜';font-weight:800;font-size:15px;color:var(--sumi)}
.cv2-cta{width:100%;height:56px;font-size:19px}
.cv2-cta svg.i{width:20px;height:20px}
.cv2-note{margin-top:10px;font-size:12px;color:var(--sumi-2);font-weight:600;line-height:1.55}

/* ── 예약 제보 한 줄(status.js statusLine) ── */
.cv2-report:empty{display:none}

/* ── 화면 안 탭 ── */
.cv2-tabs{display:flex;gap:2px;position:sticky;top:0;z-index:20;background:var(--washi);border-bottom:2px solid var(--line);margin:4px calc(-1 * var(--cv2-bleed,20px)) 0;padding:0 var(--cv2-bleed,20px);overflow-x:auto;scrollbar-width:none}
.cv2-tabs::-webkit-scrollbar{display:none}
.cv2-tabs a{height:46px;display:flex;align-items:center;padding:0 10px;font-size:15px;font-weight:800;color:var(--sumi-2);border-bottom:3px solid transparent;margin-bottom:-2px;white-space:nowrap;text-decoration:none}
.cv2-tabs a[aria-current=true]{color:var(--sumi);border-color:var(--shu)}

/* ── 섹션 ── */
.cv2-sec{padding-top:18px;scroll-margin-top:52px}
.cv2-sec>h2,.cv2-sec-h h2{font-size:19px;font-weight:800;margin:0 0 10px;display:flex;align-items:baseline;gap:8px}
.cv2-sec h2 small{font-size:12.5px;color:var(--sumi-2);font-weight:600}
.cv2-sec-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.cv2-sec-h h2{margin:0;flex:1}
.cv2-sm{height:42px;font-size:15px;padding:0 14px}
.cv2-box{background:var(--card);border:2px solid var(--line);border-radius:16px;padding:12px 14px;font-size:14px;line-height:1.55}
.cv2-sec>.panel,.cv2-sec .panel{margin-top:12px}
.cv2-can{list-style:none;margin:0}
.cv2-can-row{display:flex;gap:10px;align-items:flex-start;padding:6px 0}
.cv2-can-row+.cv2-can-row{border-top:1.5px dashed var(--line)}
.cv2-can-row b{font-weight:700}
.cv2-can-row small{display:block;font-size:12.5px;color:var(--sumi-2);margin-top:2px;line-height:1.5}
.cv2-tag{flex:none;display:inline-flex;align-items:center;gap:3px;min-width:68px;justify-content:center;height:26px;padding:0 8px;border-radius:999px;font-size:12.5px;font-weight:800;margin-top:-1px;white-space:nowrap}
.cv2-tag svg.i{width:13px;height:13px;stroke-width:3}
.cv2-tag.ok{background:var(--wasabi-soft);color:var(--wasabi);border:2px solid var(--wasabi-line)}
.cv2-tag.cond{background:var(--tamago-soft);color:var(--tamago-text);border:2px dashed var(--tamago-line)}
.cv2-tag.no{background:var(--shu-soft);color:var(--shu-dark);border:2px solid #EBB5AC}
.cv2-tag.unk{background:#fff;color:var(--sumi-2);border:2px dashed var(--line)}
.cv2-tag.info{background:var(--ai-soft);color:var(--ai);border:2px solid #C5D2E3}
.cv2-fold{margin-top:10px}
.cv2-online-note{display:flex;gap:8px;align-items:center}
.cv2-online-note svg.i{width:20px;height:20px;color:var(--ai);flex:none}
.cv2-addr-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:12px;font-size:13.5px;font-weight:600;color:var(--sumi-2)}
.cv2-addr-row .fd-maplink{margin-left:auto}
/* 찾아가기(wayfinding.js inline) — 접지 않고 상자 하나로 */
.fd-way.fd-inline{background:var(--card);border:2px solid var(--line);border-radius:16px;padding:12px 14px}
.fd-way.fd-inline .fd-body{padding:0}
.fd-way.fd-inline .fd-peek-inline{display:block;text-align:left;margin:0 0 8px;font-size:13px;font-weight:700;color:var(--sumi-2);margin-bottom:8px}
.cv2-legal{font-size:13px;font-weight:700;color:var(--sumi-2);margin-bottom:10px}
.cv2-send{margin-top:12px;flex-wrap:wrap}
.cv2-reviews{list-style:none}
.cv2-reviews li+li{border-top:1.5px dashed var(--line);margin-top:8px;padding-top:8px}
.cv2-reviews p{margin:4px 0}
.cv2-reviews small{color:var(--sumi-2);font-weight:600}
.cv2-empty{display:flex;gap:12px;align-items:center}
.cv2-empty svg{flex:none}
.cv2-more{margin-top:8px;font-size:14px}
.cv2-src ul{list-style:none;margin:0 0 6px}
.cv2-src li{padding:4px 0;font-size:13.5px;color:var(--sumi-2);line-height:1.55}
.cv2-src li b{color:var(--sumi);margin-right:4px}
.cv2-src li[hidden]{display:none}
.cv2-src q{display:block;font-size:12.5px;color:var(--sumi-2);margin-top:2px;quotes:'「' '」'}
.cv2-src .cf-note{margin:8px 0}
.cv2-links{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13.5px;margin-top:6px;align-items:center}
.cv2-links a{display:inline-flex;align-items:center;gap:4px}
.cv2-links svg.i{width:16px;height:16px}
.cv2 .more{margin-top:12px}

/* ── 모바일 하단 고정 바 ── */
.cv2-bar{z-index:30;align-items:center;gap:8px;margin:16px calc(50% - 50vw) 0;padding:8px max(12px,calc(50vw - 50% + 0px)) 8px;background:#fff;border-top:2px solid var(--line)}
.cv2-bar{padding-inline:12px}
.cv2-bar .cmp-add.compact{width:52px;height:52px;flex:none;justify-content:center;padding:0;border-radius:16px;position:relative}
.cv2-bar .cmp-add.compact svg.i{width:22px;height:22px}
.cv2-bar .cmp-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cv2-bar-sum{flex:1 1 auto;min-width:0;line-height:1.15;padding:0 2px;height:52px;display:flex;flex-direction:column;justify-content:center}
.cv2-bar-sum small{display:block;font-size:11px;color:var(--sumi-2);font-weight:700;white-space:nowrap}
.cv2-bar-sum b{font-family:'Jua';font-weight:400;font-size:20px;white-space:nowrap}
.cv2-bar-sum span{font-size:11.5px;color:var(--sumi-2);font-weight:700;white-space:nowrap}
.sticky-bar.cv2-bar .btn{flex:0 0 auto;height:52px;font-size:17px;padding:0 14px;white-space:nowrap}
.cv2-bar .btn svg.i{width:18px;height:18px}
@media (max-width:374px){
  .cv2-head h1{font-size:23px}
  .cv2-fact{font-size:11px;padding:7px 2px 6px}
  .cv2-fact small{font-size:10px}
  .cv2-plate{width:36px;height:36px;font-size:12px}
  .cv2-plates{gap:5px}
  .cv2-big b{font-size:31px}
  .cv2-months button{min-width:34px;padding:0 6px}
  .cv2-recv button{padding:0 7px;font-size:12px}
  .cv2-big b{font-size:30px}
  .cv2-stamp{font-size:13px}
  .cv2-tabs a{padding:0 8px;font-size:14px}
  .cv2-bar-sum span{display:none}
  .sticky-bar.cv2-bar .btn{font-size:15px;padding:0 10px}
  .cv2-bar .btn svg.i{display:none}
  .cv2-bar .cmp-add.compact{width:46px}
}

/* ── 데스크톱 2단 ── */
@media (min-width:1024px){
  .cv2-head{padding:20px 0 26px}
  .cv2-head-bar{margin-bottom:6px}
  .cv2-crumb{display:block}
  .cv2-back,.cv2-head .eg-save{display:none}
  .cv2-head h1{font-size:34px}
  .cv2-sub{font-size:14px}
  .cv2-addr{display:inline}
  .cv2-grid{grid-template-columns:minmax(0,1fr) 400px;column-gap:32px;row-gap:12px;margin-top:24px;align-items:start}
  .cv2-facts{grid-column:1;grid-row:1;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
  .cv2-fact{padding:10px 6px 9px;font-size:13px}
  .cv2-fact small{font-size:11.5px}
  .cv2-facts .cv2-desk{display:block!important}
  .cv2-tabs .cv2-desk{display:flex!important}
  .cv2-side{grid-column:2;grid-row:1 / span 3;position:sticky;top:16px;align-self:start}
  .cv2-report{grid-column:1;grid-row:2}
  .cv2-main{grid-column:1;grid-row:3;max-width:850px}
  .cv2-tabs{margin:0;padding:0;--cv2-bleed:0}
  .cv2-actions{display:block;margin-top:14px}
  .cv2-sec{padding-top:26px}
  .cv2-sec>h2,.cv2-sec-h h2{font-size:21px}
  .sticky-bar.cv2-bar{display:none}
}

/* 200% 확대(폭 300px 이하): 가로 넘침 없게(WCAG 1.4.10, dead-buttons.md 페르소나 D3). 이 파일은 app.css 뒤에 붙어 여기 둠 */
@media (max-width:300px){
  .cv2{--cv2-bleed:8px}
  .cv2-big{grid-template-columns:minmax(0,1fr)}
  .cv2-big b{grid-row:auto;font-size:26px}
  .cv2-big-r{justify-content:flex-start}
  .cv2-mode-row{flex-wrap:wrap}
  .cv2-months{margin-left:0;flex-wrap:wrap}
  .cv2-bar{flex-wrap:wrap}
  .sticky-bar.cv2-bar .btn{white-space:normal;min-width:0;flex:1 1 auto}
}

/* 찾아가기: 모르는 칸은 한 줄로 낮게(아이콘 · 이름 · 알려주세요) — 큰 빈 칸 4개가 화면을 차지하지 않게 */
.cv2 .fd-unknown{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;justify-items:start;min-height:52px;padding:8px 10px;column-gap:8px;row-gap:0;text-align:left}
.cv2 .fd-unknown>svg{grid-row:span 2}
.cv2 .fd-unknown .fd-cell-l{font-weight:600}
