/* 자체 호스팅 글꼴(T-4a · PM 승인 10-15): 한글 Pretendard 1.3.9 KS X 1001 부분 집합(400 · 600) · 제목 라틴 Fraunces 600 — OFL-1.1(/assets/fonts/OFL-*.txt) */
@font-face{font-family:"Pretendard";font-weight:400;font-style:normal;font-display:swap;src:url(/assets/fonts/Pretendard-Regular.subset.woff2) format("woff2")}
@font-face{font-family:"Pretendard";font-weight:600;font-style:normal;font-display:swap;src:url(/assets/fonts/Pretendard-SemiBold.subset.woff2) format("woff2")}
@font-face{font-family:"Fraunces";font-weight:600;font-style:normal;font-display:swap;src:url(/assets/fonts/fraunces-latin-600-normal.woff2) format("woff2")}
/* 가격 비교 서비스(가격비교/T-3) — 승인된 시안 v1(D-67)의 screens.css 에서 옮김. 브랜드 v3 · 시스템 글꼴 · 외부 요청 없음.
   방향(왼쪽→오른쪽 · 오른쪽→왼쪽) 모두 되게 논리 속성(inline-start/end)만 쓴다. */
:root{
  --font:"Pretendard","Apple SD Gothic Neo","Noto Sans KR","Segoe UI",-apple-system,BlinkMacSystemFont,sans-serif;
  /* 팔레트 P3 아쿠아 · 피치(대표 결정 10-15 19:2x "로고는 p3c로해" → "색도 P3 아쿠아·피치" → "응 아쿠아피치로 가자" · P1 코랄 · 민트를 거둠).
     변수 이름은 옛 것 그대로 두고 값만 역할에 맞게 — 다음에 색이 바뀌어도 이 두 :root 만 고치면 된다:
     --plum = 주색 진(단추 · 링크 글자 #0d5c63) · --berry = 최저가(표시 바탕 · 가격 글자 #c93652) · --rose · --mint-strong = 주색(#22b8cf · 장식 · 글자로 쓰지 않음) · --peach = 보조 피치(#ffb4a2)
     팔레트에 없던 값(흐린 글자 · 선 · 옅은 칸)은 대비 기준에 맞춰 정했다(scripts/check-contrast.mjs · tests/price-palette.test.mjs) */
  --bg:#eef9fa;--surface:#fff;--ink:#14323a;--muted:#4a6268;--line:#d3e9ec;--soft:#eef9fa;
  --plum:#0d5c63;--plum-ink:#0a4a50;--rose:#22b8cf;--low:#fdeef1;
  --babi:#2f6fa8;--unni:#c0457a;--cash:#2c8a66;
  --stale-bg:#fff2d9;--stale:#7a4f00;--warn-bg:#fff1ee;
  --r-s:6px;--r-m:12px;--r-l:20px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 var(--font);letter-spacing:-.1px;-webkit-font-smoothing:antialiased}
h1,h2,h3{line-height:1.25;margin:0;text-wrap:balance;font-weight:600}
p{margin:0}
a{color:var(--plum)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--plum);outline-offset:2px;border-radius:4px}
.wrap{max-width:1200px;margin-inline:auto;padding-inline:24px}
.muted{color:var(--muted)}
.small{font-size:13px}
.nw{white-space:nowrap}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
s{color:var(--muted);text-decoration-thickness:1px}
.c-num,.stats dd,.offer-price,.prod-price,.rail-mark b,.rail-axis{font-variant-numeric:tabular-nums}

.mock-banner{background:var(--ink);color:#fff;font-size:12px;text-align:center;padding:4px 16px}

/* 머리 */
.top{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.top-in{display:flex;align-items:center;gap:28px;height:64px}
.brand{display:flex;align-items:center;gap:8px;color:var(--ink);text-decoration:none;flex:none;direction:ltr}   /* 로고 짜임(물방울 → 글자)은 아랍어에서도 뒤집지 않는다(#121 검토) */
.brand-mark img{display:block;width:17px;height:32px}
.brand-name{font:600 22px/1 "Fraunces",var(--font);letter-spacing:-.3px;color:var(--ink)}
.nav{display:flex;gap:22px;font-size:15px;font-weight:550}
.nav a{color:var(--ink);text-decoration:none;padding:6px 0;border-bottom:2px solid transparent}
.nav a[aria-current]{border-color:var(--plum)}
.top-actions{margin-inline-start:auto;display:flex;align-items:center;gap:10px}
.lang{position:relative}
.lang summary{list-style:none;display:flex;align-items:center;gap:6px;cursor:pointer;font-size:14px;font-weight:550;padding:8px 12px;border:1px solid var(--line);border-radius:999px}
.lang summary::-webkit-details-marker{display:none}
.lang-menu{position:absolute;inset-inline-end:0;top:calc(100% + 8px);width:300px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);box-shadow:0 12px 32px rgba(20,50,58,.12);padding:8px;display:grid;gap:2px}
.lang-note{font-size:12px;color:var(--muted);padding:6px 8px 8px;border-bottom:1px solid var(--line);margin-bottom:4px}
.lang-menu .lang-opt{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:8px;border-radius:var(--r-s);font-size:15px;color:var(--ink);text-decoration:none}
.lang-menu .lang-opt small{font-size:11px;color:var(--muted)}
.lang-menu .lang-opt:hover,.lang-menu .lang-opt[aria-current]{background:var(--soft)}
.lang-menu button{all:unset;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:8px;border-radius:var(--r-s);font-size:15px}
.lang-menu button small{font-size:11px;color:var(--muted)}
.lang-menu button:hover,.lang-menu button[aria-pressed="true"]{background:var(--soft)}
.lang-menu button:focus-visible{outline:3px solid var(--plum)}
.lang-code{display:none;font-size:12px}
.btn-block{display:flex;justify-content:center;margin-top:8px}
.c-rate{font-size:13px;min-width:120px}
.btn-chat{display:flex;align-items:center;gap:6px;font:600 14px var(--font);color:#fff;background:var(--plum);border:0;border-radius:999px;padding:9px 14px;cursor:pointer}

/* 공통 조각 */
.btn{display:inline-flex;align-items:center;gap:6px;background:var(--plum);color:#fff;text-decoration:none;font-weight:600;border:0;border-radius:999px;padding:12px 20px;font-size:15px;cursor:pointer;font-family:inherit}
.tag{display:inline-block;font-size:12px;font-weight:600;line-height:1.4;padding:2px 8px;border-radius:999px;background:var(--soft);color:var(--plum-ink);white-space:nowrap}
.tag.low{background:var(--berry);color:#fff}
.tag.low-other{background:var(--soft);color:var(--berry);box-shadow:inset 0 0 0 1px var(--berry);white-space:normal;max-width:100%}
.tag.stale{background:var(--stale-bg);color:var(--stale)}
.sw{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none}
.sw.p-babi,.dot.p-babi,.bars .p-babi{background:var(--babi)}
.sw.p-unni,.dot.p-unni,.bars .p-unni{background:var(--unni)}
.sw.p-cash,.dot.p-cash,.bars .p-cash{background:var(--cash)}
.plat{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;white-space:nowrap}
.vat{font-size:13px;white-space:nowrap}
.vat.v-excluded{color:var(--stale);font-weight:600}
.vat.v-not_stated{color:var(--unni);font-weight:600}
.ext{display:inline-flex;align-items:center;gap:4px;min-height:28px;font-weight:600;font-size:14px;white-space:nowrap}
.ext svg{width:14px;height:14px}
[dir="rtl"] .ext svg{transform:scaleX(-1)}
.rating b{font-weight:650}
.note{font-size:13px;margin-top:12px;max-width:80ch}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:56px 0 16px}
.sec-head h2{font-size:22px}
.sec-head p{font-size:14px}
.crumbs{display:flex;gap:8px;font-size:14px;padding-top:20px;color:var(--muted)}
.crumbs a{color:var(--muted);display:inline-flex;align-items:center;min-height:28px}
.crumbs [aria-current]{color:var(--ink);font-weight:550}

/* 가격 축 — 이 시안의 기억에 남을 한 가지: 관찰한 모든 가격을 한 줄에 */
.rail{margin:0;padding:84px 4px 0;position:relative}
.rail-track{position:relative;height:2px;background:var(--ink);margin-inline:8px}
.dot{position:absolute;width:10px;height:10px;border-radius:50%;margin-inline-start:-5px;margin-bottom:6px;box-shadow:0 0 0 1.5px var(--bg)}
.dot.is-low{width:14px;height:14px;margin-inline-start:-7px;box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--berry)}
.rail-mark{position:absolute;bottom:-80px;transform:translateX(-50%);display:grid;justify-items:center;font-size:12px;color:var(--muted);white-space:nowrap}
[dir="rtl"] .rail-mark{transform:translateX(50%)}
.rail-mark::before{content:"";width:1px;height:30px;background:currentColor;margin-bottom:2px}
.rail-mark b{font-size:14px;color:var(--ink)}
.rail-mark.low b{color:var(--berry)}
.rail-axis{position:relative;height:20px;margin:6px 8px 0;font-size:11px;color:var(--muted)}
.rail-axis span{position:absolute;transform:translateX(-50%)}
[dir="rtl"] .rail-axis span{transform:translateX(50%)}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;margin-top:64px}
.legend span{display:inline-flex;align-items:center;gap:6px}
.rail-compact{padding-top:72px}

/* 시술 비교 */
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;padding-top:12px}
.head h1{font-size:clamp(28px,4vw,40px);letter-spacing:-.8px}
.lead{color:var(--muted);margin-top:8px;max-width:62ch}
.stats{display:flex;gap:28px;margin:0}
.stats div{display:grid}
.stats dt{font-size:13px;color:var(--muted)}
.stats dd{margin:0;font-size:22px;font-weight:650}
.stats dd span{display:block;font-size:13px;font-weight:400;color:var(--muted)}
.stats div:first-child dd{color:var(--berry)}
.tools{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:28px}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chips button{display:inline-flex;align-items:center;gap:6px;font:550 14px var(--font);color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:7px 14px;cursor:pointer}
.chips a{display:inline-flex;align-items:center;gap:6px;font:550 14px var(--font);color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:7px 14px;text-decoration:none;min-height:36px}
.chips a[aria-current]{background:var(--ink);color:#fff;border-color:var(--ink)}
.sort button{font:600 14px var(--font);border:1px solid var(--line);border-radius:var(--r-s);background:var(--surface);padding:7px 12px;cursor:pointer}
.chips button[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.sort{font-size:14px;color:var(--muted);display:flex;align-items:center;gap:8px}
.sort select{font:550 14px var(--font);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-s);padding:7px 10px;background:var(--surface)}
/* 번역 글이 긴 언어(아랍어 375px 넘침 388 실측)에서 정렬 칸 · 선택 상자가 줄을 밀지 않게 */
.tools>*{min-width:0;max-width:100%}.sort{flex-wrap:wrap}.sort select{max-width:100%;min-width:0}
.howto{margin-top:16px;font-size:14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);padding:10px 14px}
.howto summary{cursor:pointer;font-weight:600;display:flex;align-items:center;gap:6px}
.howto ul{margin:10px 0 4px;padding-inline-start:20px;display:grid;gap:6px;max-width:90ch}
.table-wrap{margin-top:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden}
.ledger{width:100%;border-collapse:collapse;font-size:14px}
.ledger th{font-size:12px;font-weight:600;color:var(--muted);text-align:start;padding:10px 12px;border-bottom:1px solid var(--line);background:var(--soft);white-space:nowrap}
.ledger td{padding:12px;border-bottom:1px solid var(--line);vertical-align:top}
.ledger tr:last-child td{border-bottom:0}
.ledger .c-num{text-align:end}
.ledger td.c-num{white-space:nowrap}
.c-clinic{min-width:190px}
.c-clinic a{font-weight:650;color:var(--ink);text-decoration:none;display:block}
.c-clinic a[href="hospital.html"]{text-decoration:underline;text-decoration-color:var(--rose);text-underline-offset:3px}
.c-clinic .muted{font-size:13px;display:block}
.c-clinic .tag{margin-top:6px;margin-inline-end:4px}
.c-sale{font-weight:600}
.c-total b{display:block;font-size:16px}
.c-total .muted{display:block;font-size:12px}
.c-unit{white-space:nowrap}
.conds{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px;white-space:normal}
/* 긴 조건 꼬리표(예: subtitle_lists_multiple)는 칸 안에서 줄을 바꾼다 — 줄바꿈 금지 칸(.c-unit) 안이라 375px 에서 380px 로 넘쳤다(PM 검토 10-14) */
.conds .tag,.card-conds .tag{white-space:normal;max-width:100%}
/* 띄어쓰기 없는 긴 로마자 병원 이름(예: Jeideobeulyujeongwon…)이 375px 에서 380px 로 넘쳤다 — 어디서든 끊는다 */
.clinic-head h1,.lead,.card-name{overflow-wrap:anywhere}
.c-seen{font-size:13px;color:var(--muted);min-width:118px}
.c-link .orig{display:block;font-size:12px;margin-top:4px;max-width:200px}
.ledger tr.is-low td{background:var(--low)}
.ledger tr.is-low td:first-child{box-shadow:inset 4px 0 0 var(--berry)}
[dir="rtl"] .ledger tr.is-low td:first-child{box-shadow:inset -4px 0 0 var(--berry)}

/* B안 카드 */
.offers{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.offer{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);padding:16px;display:grid;gap:4px}
.offer.is-low{border:2px solid var(--berry);background:var(--low)}
.offer-top{display:flex;justify-content:space-between;align-items:center}
.offer-price b{font-size:24px}
.offer-sub{font-size:13px;color:var(--muted)}
.offer-clinic{font-weight:650;margin-top:6px}
.offer .muted{font-size:13px}
.offer-foot{display:flex;justify-content:space-between;align-items:center;margin-top:8px;border-top:1px solid var(--line);padding-top:8px}

/* 홈 */
.hero{background:var(--soft);border-bottom:1px solid var(--line)}
.hero-in{padding-top:56px;padding-bottom:48px}
.hero h1{font-size:clamp(32px,5vw,56px);letter-spacing:-1.6px;font-weight:600;max-width:18ch}
.hero .lead{font-size:18px;margin-top:14px}
.search{display:flex;align-items:center;gap:8px;margin-top:28px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:6px 6px 6px 18px;max-width:760px;box-shadow:0 8px 28px rgba(20,50,58,.06)}
[dir="rtl"] .search{padding:6px 18px 6px 6px}
.search svg{color:var(--muted)}
.search input{flex:1;min-width:0;border:0;font:16px var(--font);padding:10px 4px;background:none;color:var(--ink)}
.search input:focus{outline:none}
.search select{border:0;border-inline-start:1px solid var(--line);font:550 15px var(--font);padding:8px 10px;background:none;color:var(--ink)}
.search button{font:600 15px var(--font);color:#fff;background:var(--plum);border:0;border-radius:999px;padding:12px 20px;cursor:pointer;white-space:nowrap}
.spot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:40px;align-items:center;margin-top:48px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);padding:28px 32px 24px}
.spot h2{font-size:24px}
.spot p{color:var(--muted);margin:10px 0 18px}
.spot p b{color:var(--plum)}
.pop{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.pop a{display:grid;gap:2px;padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);text-decoration:none;color:var(--ink)}
.pop a:hover{border-color:var(--plum)}
.pop b{font-size:17px}
.pop .muted{font-size:13px}
.bars{display:flex;height:6px;border-radius:3px;overflow:hidden;background:var(--soft);margin-top:10px}
.areas{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.areas a{display:grid;gap:2px;padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);text-decoration:none;color:var(--ink)}
.areas svg{color:var(--rose);width:22px;height:22px;margin-bottom:6px}
.areas b{font-size:18px}
.areas .muted{font-size:13px}
.areas .n{font-size:14px;font-weight:600;margin-top:8px;color:var(--plum)}
.how{margin-top:56px}
.how h2{font-size:22px;margin-bottom:16px}
.how ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:s}
.how li{counter-increment:s;display:grid;gap:4px;border-top:2px solid var(--ink);padding-top:12px}
.how li::before{content:counter(s);font-size:13px;font-weight:650;color:var(--plum)}
.how li span{color:var(--muted);font-size:15px}
.srcs ul{list-style:none;margin:48px 0 0;padding:20px 0 0;border-top:1px solid var(--line);display:flex;gap:32px;flex-wrap:wrap;font-size:14px}
.srcs li{display:flex;align-items:center;gap:8px}

/* 병원 상세 */
.clinic-head{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:32px;align-items:start;padding-top:12px}
.clinic-head h1{font-size:clamp(30px,4vw,42px);letter-spacing:-.8px}
.addr{display:flex;align-items:center;gap:6px;margin-top:12px;font-size:15px}
.addr svg{color:var(--rose)}
.match{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);padding:16px}
.match ul{list-style:none;margin:10px 0;padding:0;display:grid;gap:8px}
.match li{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:14px}
.match li .ext{margin-inline-start:auto}
.clinic-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:32px;align-items:start}
.prods{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.prod{display:grid;grid-template-columns:96px minmax(0,1fr) auto;grid-template-areas:"img main price" "img meta meta";gap:6px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);padding:14px}
.thumb{grid-area:img;margin:0;width:96px}
.thumb img{display:block;width:96px;height:96px;object-fit:cover;border-radius:var(--r-s);background:var(--soft)}
.thumb figcaption{font-size:10px;color:var(--muted);margin-top:2px}
.thumb.none{height:96px;border-radius:var(--r-s);background:var(--soft);display:grid;place-items:center;text-align:center;font-size:11px;color:var(--muted);padding:6px}
.prod-main{grid-area:main;min-width:0}
.prod-title{font-weight:650;font-size:16px;margin-top:4px}
.mt{font-size:12px}
.flag{display:flex;gap:6px;align-items:flex-start;font-size:13px;background:var(--warn-bg);color:#8f2a1c;border-radius:var(--r-s);padding:6px 8px;margin-top:8px}
.prod-price{grid-area:price;display:grid;justify-items:end;align-content:start;text-align:end}
.prod-price b{font-size:20px}
.prod-price .muted{font-size:12px}
.prod-meta{grid-area:meta;display:flex;gap:16px;align-items:center;flex-wrap:wrap;font-size:13px;border-top:1px solid var(--line);padding-top:8px;margin-top:4px}
.prod-meta .ext{margin-inline-start:auto}
.request{position:sticky;top:84px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);padding:20px;margin-top:56px}
.request h2{font-size:20px}
.request>p{font-size:14px;margin:6px 0 14px}
.request form{display:grid;gap:12px}
.request label{display:grid;gap:4px;font-size:14px;font-weight:550}
.request input:not([type]),.request input[inputmode]{font:16px var(--font);border:1px solid var(--line);border-radius:var(--r-s);padding:10px;color:var(--ink)}
.request fieldset{border:0;padding:0;margin:0}
.request legend{font-size:14px;font-weight:550;margin-bottom:6px}
.ch-row{display:flex;flex-wrap:wrap;gap:6px}
.ch-opt{display:inline-flex!important;grid-auto-flow:column;align-items:center;gap:6px!important;border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-weight:550}
.ch-opt:has(input:checked){border-color:var(--plum);background:var(--soft)}
.check{display:flex!important;gap:8px!important;align-items:flex-start;font-weight:400!important}
.request .btn{justify-content:center}

/* 챗봇 */
.fab{position:fixed;inset-inline-end:20px;bottom:20px;z-index:30;display:flex;align-items:center;gap:8px;font:600 15px var(--font);color:#fff;background:var(--plum);border:0;border-radius:999px;padding:14px 18px;box-shadow:0 10px 28px rgba(79,56,104,.35);cursor:pointer}
.chat{position:fixed;inset-inline-end:20px;bottom:20px;z-index:40;width:380px;max-height:min(640px,calc(100vh - 40px));display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);box-shadow:0 20px 48px rgba(20,50,58,.22);overflow:hidden}
.chat[hidden]{display:none}
.chat-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line)}
.chat-x{font-size:22px;line-height:1;border:0;background:none;cursor:pointer;color:var(--muted);padding:4px 8px}
.chat-body{padding:16px;display:grid;gap:10px;overflow:auto;font-size:14px}
.bubble{padding:10px 12px;border-radius:14px;max-width:88%}
.bubble.me{background:var(--plum);color:#fff;justify-self:end;border-end-end-radius:4px}
.bubble.bot{background:var(--soft);display:grid;gap:8px;border-end-start-radius:4px}
.bubble .src{font-size:12px;color:var(--muted)}
.chat-channels{padding:12px 16px;border-top:1px solid var(--line);font-size:13px;color:var(--muted);display:grid;gap:8px}
.ch{font-size:13px;font-weight:600;color:var(--ink);text-decoration:none;border:1px solid var(--line);border-radius:999px;padding:6px 12px}
.chat-input{display:flex;gap:8px;padding:12px 16px;border-top:1px solid var(--line)}
.chat-input input{flex:1;min-width:0;font:16px var(--font);border:1px solid var(--line);border-radius:999px;padding:8px 14px}
.chat-input button{font:600 14px var(--font);border:0;border-radius:999px;background:var(--ink);color:#fff;padding:8px 14px}

.foot{margin-top:72px;border-top:1px solid var(--line);background:var(--surface);padding:28px 0 96px;font-size:14px}
.foot p+p{margin-top:8px;font-size:13px}

/* 좁은 화면 */
@media (max-width:1000px){
  .clinic-head,.clinic-grid{grid-template-columns:minmax(0,1fr)}
  .request{position:static;margin-top:32px}
  .spot{grid-template-columns:minmax(0,1fr)}
  .pop,.areas{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .ledger thead{display:none}
  .ledger,.ledger tbody{display:block}
  .ledger tr{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"clinic total" "plat sale" "unit vat" "rate rate" "seen list" "link link";gap:2px 12px;padding:14px 16px;border-bottom:1px solid var(--line)}
  .ledger td{border:0;padding:0;background:none!important;box-shadow:none!important}
  .ledger tr.is-low{background:var(--low);box-shadow:inset 4px 0 0 var(--berry)}
  .c-clinic{grid-area:clinic}.c-rate{grid-area:rate;font-size:12px;min-width:0}.c-total{grid-area:total}.c-plat{grid-area:plat}.c-sale{grid-area:sale;font-size:13px;font-weight:400!important;color:var(--muted)}
  .c-unit{grid-area:unit;font-size:13px}.c-vat{grid-area:vat;text-align:end}.c-seen{grid-area:seen;font-size:12px}.c-list{grid-area:list;font-size:12px}
  .c-link{grid-area:link;display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-top:6px!important;padding-top:8px!important;border-top:1px solid var(--line)!important}
  .c-link .orig{margin:0;text-align:end}
  /* 모바일 카드의 칸 이름은 그 언어로(data-l = 표 머리 문구) — 예전에는 'Sale · List · Seen' 이 모든 언어에서 영어로 나왔다(#177 화면 검토) */
  .ledger .c-sale::before,.ledger .c-list::before,.ledger .c-seen::before{content:attr(data-l) " ";}
}
@media (max-width:640px){
  .wrap{padding-inline:16px}
  .top-in{gap:12px;height:56px}
  .nav{display:none}
  .brand{gap:6px}.brand-mark img{width:13px;height:24px}.brand-name{font-size:18px}
  .lang summary span{display:none}
  .lang-code{display:inline}
  .ledger .c-sale.same{display:none}

  .btn-chat span{display:none}
  .btn-chat{padding:9px}
  .lang-menu{width:min(300px,calc(100vw - 32px))}
  /* 천만 원대 최고가가 들어가면 세 칸이 한 줄에 안 들어간다(385px · PM 검토 10-14) — 넘치면 다음 줄로 */
  .stats{gap:12px 18px;width:100%;justify-content:space-between;flex-wrap:wrap}
  .stats div{min-width:0}
  .stats dd{font-size:18px}
  .search{flex-wrap:wrap;border-radius:var(--r-m);padding:8px}
  .search select{border:0;flex:1}
  .search button{width:100%}
  .spot{padding:20px 16px}
  .pop,.areas{grid-template-columns:minmax(0,1fr)}
  .how ol{grid-template-columns:1fr}
  .prod{grid-template-columns:72px minmax(0,1fr);grid-template-areas:"img main" "img price" "meta meta"}
  .thumb,.thumb img{width:72px;height:72px}
  .thumb.none{height:72px}
  .prod-price{justify-items:start;text-align:start}
  .chat{inset:auto 8px 8px 8px;width:auto}
  .fab span{display:none}
  .fab{padding:14px}
  .rail-mark.mid{display:none}
  .rail-mark.low{transform:translateX(-12px);justify-items:start}
  [dir="rtl"] .rail-mark.low{transform:translateX(12px)}
  .rail-mark.low::before{margin-inline-start:12px}
}
/* 오른쪽→왼쪽에서도 숫자 · 가격 · 평점 · 시각 조각은 왼쪽→오른쪽 한 덩어리로 */
.rating,time,.c-num b,.c-num s,.stats dd,.offer-price,.prod-price b,.prod-price s,.prod-price .muted,.rail-mark b,.legend span,.chips button{unicode-bidi:isolate}
[dir="rtl"] .rating,[dir="rtl"] .c-num b,[dir="rtl"] .stats dd,[dir="rtl"] .prod-price b,[dir="rtl"] .rail-mark b{direction:ltr}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* 서비스에서 더한 것(시안에 없던 조각) */
.pager{display:flex;gap:8px;align-items:center;justify-content:center;margin-top:20px;font-size:14px}
.pager a,.pager span{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:var(--r-s);padding:0 10px;text-decoration:none;background:var(--surface)}
.pager [aria-current]{background:var(--ink);color:#fff;border-color:var(--ink)}
.variants,.tlist,.clist{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.variants a,.tlist a{display:flex;justify-content:space-between;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);padding:14px 16px;text-decoration:none;color:var(--ink)}
.variants a:hover,.tlist a:hover{border-color:var(--plum)}
.variants b,.tlist b{font-size:16px}
.variants .muted,.tlist .muted{font-size:13px}
.v-low{text-align:end;font-variant-numeric:tabular-nums}
.v-low b{color:var(--berry)}
/* 묶음 최저가가 체험가 · 첫 방문 · 1회 한정일 때의 짧은 표시(10-18 S2) — 긴 언어(km · de)는 칸 안에서 줄을 바꾼다 */
.v-low .v-cond{display:inline-block;margin-top:4px;font-size:12px;white-space:normal;max-width:12em;text-align:center}
.tgroup{margin-top:32px}
.tgroup h2{font-size:20px;margin-bottom:12px}
.tlist{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.clist li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);padding:14px 16px}
.clist .muted{font-size:13px}
.empty{background:var(--surface);border:1px dashed var(--line);border-radius:var(--r-m);padding:24px;color:var(--muted)}
.tag.care{background:#e8f3ee;color:#1f6a4c}
.tag.fee{background:var(--stale-bg);color:var(--stale)}
.rep{margin-top:40px}
.notfound{padding-block:64px}

/* 가격 축(SVG) */
.rail-svg{display:block;width:100%;height:auto;overflow:visible}
.rail-svg .track{stroke:var(--ink);stroke-width:2}
.rail-svg .tk{font-size:15px;fill:var(--muted);font-family:var(--font)}
.rail-svg circle{stroke:var(--bg);stroke-width:2}
.rail-svg circle.p-babi{fill:var(--babi)}.rail-svg circle.p-unni{fill:var(--unni)}.rail-svg circle.p-cash{fill:var(--cash)}
.rail-svg circle.is-low{stroke:var(--berry);stroke-width:4}
.rail-svg .mk line{stroke:var(--muted);stroke-width:1.5}
.rail-svg .mk text{font-size:17px;font-weight:650;fill:var(--ink);font-family:var(--font);font-variant-numeric:tabular-nums}
.rail-svg .mk.low text{fill:var(--berry)}
.rail{padding-top:8px}
.legend{margin-top:8px}
.table-wrap{overflow-x:auto}
.c-link .orig{max-width:160px}
@media (max-width:640px){.rail-svg .tk{font-size:26px}.rail-svg .mk text{font-size:30px}}

/* 2차: 병원 이름 · 병원 상세 · 상담 신청 · 이미지 */
.ko-name{display:block;font-weight:650;color:var(--ink)}
.en-name{display:block;font-size:13px;font-weight:500;color:var(--muted)}
.clinic-link{text-decoration:none}
.clinic-link:hover .ko-name,.clinic-link:hover .en-name{text-decoration:underline;text-decoration-color:var(--rose)}
.linknote{display:block;font-size:11px;margin-top:2px;max-width:180px}
.fx{font-size:12px;width:100%;text-align:end}
[dir="rtl"] .fx{text-align:start}
.match li{flex-wrap:wrap}
.gallery{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.gallery figure{margin:0}
.gallery img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--r-s);background:var(--soft)}
.gallery figcaption{font-size:11px;margin-top:2px}
.req-page{position:static;max-width:640px;margin-top:0}
.request textarea{font:16px var(--font);border:1px solid var(--line);border-radius:var(--r-s);padding:10px;color:var(--ink)}
.request input[name]:not([type=radio]):not([type=checkbox]):not([type=hidden]){font:16px var(--font);border:1px solid var(--line);border-radius:var(--r-s);padding:10px;color:var(--ink)}
.errors{background:var(--warn-bg);color:#8f2a1c;border-radius:var(--r-s);padding:10px 14px;margin-bottom:12px;font-size:14px}
.errors ul{margin:6px 0 0;padding-inline-start:18px}

/* R-1 · R-2: 검색 결과 · 필터 */
.filters{margin-top:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);padding:12px 14px}
.filters fieldset{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 16px;align-items:flex-end}
.filters legend{font-size:13px;font-weight:650;margin-bottom:6px;padding:0}
.filters label{display:grid;gap:4px;font-size:13px;color:var(--muted)}
.filters input,.filters select{font:15px var(--font);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-s);padding:7px 10px;background:var(--surface);min-width:120px}
.filters button{font:600 14px var(--font);border:0;border-radius:var(--r-s);background:var(--plum);color:#fff;padding:9px 14px;cursor:pointer}
.filters a{font-size:14px;align-self:center}
.filters p{margin-top:8px}
@media (max-width:640px){.filters label{flex:1 1 140px}.filters input,.filters select{min-width:0;width:100%}}

.tag.ctype{background:#e9f0f8;color:#24527a}
/* 한의원(D-102): 양방 장비 이름 상품도 최저가에 들어가므로 병원 종류가 눈에 띄게 */
.tag.ctype-korean_medicine{background:#fff1dc;color:#7a4300;border:1px solid #e9b872;font-weight:600}

/* 안내 글 단(#268 PM 10-21): 본문을 제목 · 설명과 같은 왼쪽 끝에 — 줄 길이 72ch 는 자식에만(전에는 .wrap 자체를 72ch 로 줄여 가운데로 감) */
.wrap.prose>*{max-width:72ch}
.prose h2{font-size:18px;margin:24px 0 6px}
.prose p{color:var(--ink)}

.foot-links{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:14px;font-size:14px}
.foot-links span{color:var(--muted)}

/* ===== T-3e: 목록 v2(필터 서랍 · 칩 · 정렬 탭 · 이미지 카드 · 별) — 시안 v2(D-74) ===== */
.stars{display:inline-block;position:relative;width:70px;height:13px;vertical-align:-1px;background:#d6e6e9;-webkit-mask:repeating-linear-gradient(90deg,#000 0 12px,transparent 12px 14px);mask:repeating-linear-gradient(90deg,#000 0 12px,transparent 12px 14px)}
.stars-fill{position:absolute;inset:0 auto 0 0;background:#e3a008}
.s0{width:0}.s1{width:10%}.s2{width:20%}.s3{width:30%}.s4{width:40%}.s5{width:50%}.s6{width:60%}.s7{width:70%}.s8{width:80%}.s9{width:90%}.s10{width:100%}
.list-head{padding-top:16px}.list-head h1{font-size:30px}
.list-grid{display:grid;grid-template-columns:250px minmax(0,1fr);gap:24px;margin-top:16px;align-items:start}
.filter-drawer{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);padding:10px 12px}
.filter-drawer>summary{font-weight:650;cursor:pointer;padding:4px 0}
.filters-side{display:grid;gap:4px}
.facet{border:0;border-top:1px solid var(--line);margin:0;padding:10px 0 4px}
.facet legend{font-weight:650;font-size:14px;padding:0}
.facet ul{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:4px}
.facet label{display:flex;gap:6px;align-items:center;font-size:14px;min-height:28px}
.facet .n{margin-inline-start:auto;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.facet-search,.range input{font:14px var(--font);border:1px solid var(--line);border-radius:var(--r-s);padding:6px 8px;width:100%;margin-top:6px;color:var(--ink)}
.range{display:flex;gap:6px;align-items:center}
.filters-side button{font:600 14px var(--font);border:0;border-radius:var(--r-s);background:var(--plum);color:#fff;padding:10px;margin-top:8px;cursor:pointer}
.chips-selected{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:12px}
.chip{background:var(--plum);color:#fff;font-size:13px;font-weight:600;border-radius:999px;padding:4px 12px;text-decoration:none;min-height:28px;display:inline-flex;align-items:center;gap:4px}
.reset{font-size:13px;margin-inline-start:auto}
.sort-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;border-bottom:2px solid var(--ink);padding-bottom:8px}
.sort-tabs{display:flex;gap:4px;flex-wrap:wrap}
.sort-tabs a,.sort-tabs span{font-size:14px;font-weight:600;padding:6px 12px;border-radius:999px;color:var(--ink);text-decoration:none;min-height:32px;display:inline-flex;align-items:center;gap:4px}
.sort-tabs a[aria-current]{background:var(--ink);color:#fff}
.sort-tabs .off{color:#9aa7a8;cursor:not-allowed}
.sort-tabs .off small{font-size:11px;font-weight:500}
.cards{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.card a{display:grid;grid-template-rows:auto 1fr;text-decoration:none;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;height:100%}
.card a:hover{border-color:var(--plum)}
.card-img{margin:0;aspect-ratio:4/3;background:var(--soft);position:relative;overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:cover;display:block}
.card-img figcaption{position:absolute;inset:auto 6px 6px auto;font-size:10px;background:#ffffffe6;padding:1px 6px;border-radius:4px;max-width:90%}
.noimg{display:grid;place-items:center;width:100%;height:100%;min-height:96px;font-size:12px;color:var(--muted);background:repeating-linear-gradient(45deg,var(--soft),var(--soft) 8px,#dcf0f3 8px,#dcf0f3 16px);text-align:center}
.card-body{padding:10px 12px 12px;display:grid;grid-template-columns:minmax(0,1fr);gap:4px;align-content:start}   /* 예비 방어: /list 의 잘림은 꼬리표 줄바꿈(.card-conds .tag)으로 고쳐졌고, 이 칸 규칙만으로 넘치는 자료는 만들지 못했다(PM 검토 10-14 실측) */
.card-name{font-weight:650}
.card-price b{font-size:20px;color:var(--berry)}
.card-conds{display:flex;flex-wrap:wrap;gap:4px}
.card-meta{font-size:13px}
@media (max-width:860px){.list-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){.cards{grid-template-columns:minmax(0,1fr)}.card a{grid-template-columns:120px minmax(0,1fr);grid-template-rows:none}.card-img{aspect-ratio:auto;height:140px}.card-img img{height:140px}.card-img figcaption{font-size:9px}}

/* ===== T-3e(2차): 시술 비교 머리 · 병원별 줄 썸네일 · 병원 사진 묶음 ===== */
.prod-head{display:grid;grid-template-columns:200px minmax(0,1fr) auto;gap:24px;align-items:start}
.prod-img{margin:0;aspect-ratio:1;border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;background:var(--soft);position:relative}
.prod-img img{width:100%;height:100%;object-fit:cover;display:block}
.prod-img figcaption{position:absolute;inset:auto 6px 6px auto;font-size:10px;background:#ffffffe6;padding:1px 6px;border-radius:4px}
.variants-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:12px;min-width:0;max-width:100%}   /* 휴대폰에서 가로로 넘기는 줄이 페이지를 밀지 않게(아랍어 375px 넘침 388 실측) */
.variants-row a{font-size:13px;border:1px solid var(--line);border-radius:var(--r-s);padding:6px 10px;background:var(--surface);text-decoration:none;color:var(--ink);min-height:32px;display:inline-flex;gap:6px;align-items:center}
.clinic-cell{display:flex;gap:10px;align-items:flex-start}
.clinic-cell .thumb{flex:none}
.thumb-img{width:56px;height:56px;object-fit:cover;border-radius:var(--r-s);display:block;background:var(--soft)}
.thumb-initial{display:grid;place-items:center;width:56px;height:56px;border-radius:var(--r-s);background:var(--soft);color:var(--plum);font-size:22px;font-weight:650}
.dept{display:block}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:16px;max-width:760px}
.gallery figure{margin:0;aspect-ratio:1;overflow:hidden;border-radius:var(--r-s);background:var(--soft)}
.gallery figure.g-main{grid-column:span 4;aspect-ratio:21/9}
.gallery img{width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block}   /* 위쪽을 살린다 — 의사 사진의 얼굴 윗부분이 잘렸다(PM 10-14 공개 뒤 점검) */
.gallery .credit{grid-column:1/-1}
.reviews-link{margin:8px 0}
/* 다른 수량 줄의 이름표('ほかの量')는 가로로 넘기는 줄 안에서 줄지 않게(§10-15: 375px 일본어 · 중국어가 한 글자씩 4줄 · 영어도 두 줄로 눌렸다 — 실측) */
@media (max-width:860px){.prod-head{grid-template-columns:120px minmax(0,1fr)}.prod-head .stats{grid-column:1/-1}.variants-row{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px}.variants-row a,.variants-row>span{flex:none}.variants-row>span{white-space:nowrap}.clinic-cell .thumb{display:none}}
/* 후기 본문(T-3f) */
.reviews{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.review{border:1px solid var(--line);border-radius:var(--r-m);padding:14px 16px;background:var(--card,#fff)}
.rv-meta{font-size:13px;color:var(--muted);display:flex;flex-wrap:wrap;align-items:center;gap:4px}
.rv-text{margin-top:6px;white-space:pre-line;overflow-wrap:anywhere;max-width:72ch}
.rv-more{margin-top:12px}
.rv-more summary{cursor:pointer;font-weight:600;color:var(--plum);min-height:28px}
.rv-more .reviews{margin-top:12px}
.rv-count{display:block;margin-top:4px}
/* 상담 접수가 닫힌 동안의 비활성 버튼(T-3i) */
.btn-off{background:var(--soft);color:var(--muted);cursor:default;box-shadow:none}

/* ───────── 사이트 다시 그리기 v3(T-4a 시안 · D-80) ─────────
   흰 바탕 + 파스텔 셋(블러시 · 피치 · 라일락) + 강조 하나(베리 — 최저가 · 버튼). 보라는 글자 · 링크 색으로 남긴다.
   제목은 기기의 세리프(외부 글꼴 없음 — 자체 호스팅은 대표 판단 뒤). 사진 자리는 고르기 전까지 파스텔 칸(.ph) */
:root{
  --blush:#eef9fa;--peach:#ffb4a2;--lilac:#e3f5f8;--mint:#e3f5f8;--mint-strong:#22b8cf;--berry:#c93652;--berry-ink:#a82a43;--coral:#ffb4a2;
  --serif:"Fraunces","Pretendard",ui-serif,Georgia,serif;   /* 라틴은 Fraunces, 한글 글자는 Pretendard 로 넘어간다 */
  --r-xl:22px;--shadow:0 1px 2px rgba(20,50,58,.06),0 8px 24px rgba(20,50,58,.06);
}
/* 베트남어: Fraunces(라틴 기본 글자만)에 성조 글자가 없어 한 낱말 안에서 글꼴이 섞인다(캡처 10-15) — 제목도 본문 글꼴로 */
html[lang="vi"]{--serif:var(--font)}
body{background:#fff}
.top-search{display:flex;align-items:center;border:1px solid var(--line);border-radius:999px;padding:2px 4px 2px 14px;background:var(--bg);min-width:0}
.top-search input{border:0;background:transparent;font:inherit;font-size:14px;width:200px;min-width:0;padding:6px 0;color:var(--ink)}
.top-search input:focus{outline:none}
.top-search:focus-within{outline:3px solid var(--plum);outline-offset:2px}
.top-search button{border:0;background:transparent;color:var(--ink);padding:6px;cursor:pointer;display:flex}
.nav{gap:18px}

/* 사진 자리 */
.ph{position:relative;margin:0;border-radius:var(--r-l);overflow:hidden;aspect-ratio:4/5;display:flex;align-items:flex-end;background:var(--blush)}
.ph-1{background:linear-gradient(160deg,#fde2ea,#f6c9d8)}.ph-2{background:linear-gradient(160deg,#fff0e4,#fbd6bd)}
.ph-3{background:linear-gradient(160deg,#e6f7f5,#bfe9e4)}.ph-4{background:linear-gradient(160deg,#e6f5ef,#c7e8da)}
.ph-5{background:linear-gradient(160deg,#fde8f1,#f2c6dc)}.ph-6{background:linear-gradient(160deg,#fff4dc,#f8dfb2)}
.ph-7{background:linear-gradient(160deg,#fff1ec,#ffd3c6)}.ph-8{background:linear-gradient(160deg,#fbeaea,#f1cdc8)}
.ph-label{position:absolute;inset:12px 12px auto;font:600 15px/1.2 var(--serif);color:var(--ink)}
.ai-note{position:absolute;inset:auto 8px 8px;font-size:12px;line-height:1.3;color:var(--ink);background:rgba(255,255,255,.82);border-radius:6px;padding:2px 6px}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 25%}

/* 히어로 공통 */
.v3-hero h1{font:600 clamp(32px,4.4vw,56px)/1.08 var(--serif);letter-spacing:-.8px;color:var(--ink)}
.v3-hero .lead{font-size:17px;color:var(--muted);margin-top:14px;max-width:46ch}
.v3-search{display:flex;align-items:center;gap:8px;margin-top:22px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 6px 6px 18px;box-shadow:var(--shadow);max-width:560px}
.v3-search input{flex:1;min-width:0;border:0;font:inherit;font-size:16px;padding:10px 0;background:transparent;color:var(--ink)}
.v3-search input:focus{outline:none}
.v3-search:focus-within{outline:3px solid var(--plum);outline-offset:2px}
.v3-search button{border:0;border-radius:999px;background:var(--plum);color:#fff;font:600 15px var(--font);padding:12px 22px;cursor:pointer}
.v3-search button:hover{background:var(--plum-ink)}
.v3-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px}
.v3-chips a{font-size:14px;font-weight:550;text-decoration:none;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 14px;min-height:44px;display:inline-flex;align-items:center}
.v3-chips a:hover{border-color:var(--plum);color:var(--plum)}
.v3-trust{display:flex;flex-wrap:wrap;gap:10px 28px;margin:22px 0 0}
.v3-trust div{display:grid}
.v3-trust dt{font-size:12px;color:var(--muted)}
.v3-trust dd{margin:0;font:600 20px/1.3 var(--font);font-variant-numeric:tabular-nums}

/* 히어로 A: 사진 격자 위에 카드 */
.hero-a{position:relative;background:linear-gradient(180deg,var(--blush),#fff 85%);padding:28px 0 40px;overflow:hidden}
.ha-mosaic{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:12px;padding-inline:24px;max-width:1440px;margin-inline:auto}
.ha-mosaic .ph{aspect-ratio:3/4}
.ha-mosaic .ph:nth-child(even){transform:translateY(28px)}
.ha-card-wrap{position:relative;z-index:2;margin-top:-72px}   /* 행사 사진의 칩이 제목 카드 위로 올라오지 않게(카드가 위) · 칩이 보이게 겹침을 줄임 */
.ha-card{background:rgba(255,255,255,.94);border:1px solid var(--line);border-radius:28px;box-shadow:0 20px 50px rgba(20,50,58,.12);padding:36px 40px;max-width:760px;margin-inline:auto;text-align:center}
.ha-card .lead,.ha-card .v3-search{margin-inline:auto}
.ha-card .v3-chips,.ha-card .v3-trust{justify-content:center}

/* 히어로 B: 왼쪽 글 · 오른쪽 사진 콜라주 */
.hero-b{background:linear-gradient(120deg,var(--blush) 0%,var(--lilac) 100%);padding:48px 0 56px}
.hb-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;align-items:center}
.hb-collage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hb-collage .ph{aspect-ratio:3/4}
.hb-collage .ph:nth-child(3n+2){transform:translateY(28px)}
.hb-collage .ph:nth-child(n+7){display:none}

/* 구역 */
.v3-sec{padding-block:32px 4px}
.v3-sec .sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.v3-sec h2{font:600 clamp(24px,2.6vw,32px)/1.15 var(--serif);letter-spacing:-.4px}
.v3-sec .sec-head p{width:100%}
.more{font-weight:600;font-size:15px}
.v3-band{background:linear-gradient(180deg,var(--lilac),#fff);margin-top:28px;padding-bottom:28px}

/* 카테고리 타일 */
.cat-tiles{list-style:none;margin:0 0 12px;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.cat-tiles a{display:grid;gap:4px;text-decoration:none;color:var(--ink)}
.cat-tiles .ph{aspect-ratio:4/5}
.cat-tiles a:hover .ph{box-shadow:0 0 0 3px var(--plum)}
.ct-name{font:600 17px/1.25 var(--serif);margin-top:6px;overflow-wrap:anywhere}
/* 긴 한 낱말(de 'Gesichtskonturierung' 158px > 타일 108px · kk 'Скинбустерлер' — #220 화면 검토 10-18)이 옆 타일을 덮지 않게. de 는 낱말 사이 줄표로 */
html[lang="de"] .ct-name{hyphens:auto}
.ct-price{font-size:14px;font-weight:650;font-variant-numeric:tabular-nums}

/* 가격 가이드: 라디오 탭(스크립트 없음) */
.pg-tabs{display:grid;grid-template-columns:auto auto 1fr;gap:0 8px}
.pg-tabs input{position:absolute;opacity:0;pointer-events:none}
.pg-tabs label{font-weight:650;padding:8px 18px;border-radius:999px;border:1px solid var(--line);background:#fff;cursor:pointer;margin-bottom:16px}
.pg-tabs input:checked+label{background:var(--ink);color:#fff;border-color:var(--ink)}
.pg-tabs input:focus-visible+label{outline:3px solid var(--plum);outline-offset:2px}
.pg-panel{grid-column:1/-1;display:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
#pg-skin:checked~.pg-p-skin,#pg-surg:checked~.pg-p-surg{display:grid}
.pg-cat{background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:18px 20px;box-shadow:var(--shadow);min-width:0}
.pg-cat h3{font:600 19px/1.25 var(--serif);margin-bottom:8px}
.pg-cat h3 a{color:var(--ink);text-decoration:none}
.pg-table{width:100%;border-collapse:collapse;font-size:14px}
.pg-table th,.pg-table td{padding:7px 6px;border-bottom:1px solid var(--line);text-align:start;vertical-align:middle}
.pg-table thead th{font-size:12px;color:var(--muted);font-weight:600}
.pg-table tbody th{font-weight:550}
.pg-table tbody th a{color:var(--ink)}
.pg-table .c-num{text-align:end;white-space:nowrap;font-variant-numeric:tabular-nums}
.pg-table .c-from{color:var(--berry);font-weight:700}
.rbar{width:120px;height:16px;display:block}
.rb-track{stroke:var(--line);stroke-width:4;stroke-linecap:round}
.rb-span{stroke:#ffb4a2;stroke-width:6;stroke-linecap:round}
.rb-low{fill:var(--berry)}.rb-mid{fill:#fff;stroke:var(--ink);stroke-width:2}
.pg-wide .rbar{width:200px}

/* 많이 비교된 묶음(가로로 넘겨 보기) */
.pc-row{list-style:none;margin:0;padding:0 0 8px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory}
.pc-card{scroll-snap-align:start;min-width:0}
.pc-card a{display:grid;gap:4px;text-decoration:none;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:10px 10px 14px;height:100%}
.pc-img{margin:0;aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:var(--soft);display:grid;place-items:center}
.pc-img img{width:100%;height:100%;object-fit:cover}
.pc-name{font-weight:650;font-size:15px;line-height:1.3;margin-top:6px;overflow-wrap:anywhere}
.pc-price b{color:var(--berry);font-size:18px}

/* 지역 타일 */
.area-tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.area-tiles a{display:grid;gap:4px;text-decoration:none;color:var(--ink)}
.area-tiles .ph{aspect-ratio:16/10}
.at-name{font:600 19px/1.2 var(--serif);margin-top:6px}

/* 병원 카드 */
.clinic-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cc a{display:grid;grid-template-columns:96px minmax(0,1fr);gap:14px;text-decoration:none;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:12px;box-shadow:var(--shadow);height:100%}
.cc-img{margin:0;width:96px;height:96px;border-radius:14px;overflow:hidden;background:var(--peach);display:grid;place-items:center}
.cc-img img{width:100%;height:100%;object-fit:cover;object-position:center 20%}
.cc-initial{font:600 34px var(--serif);color:var(--plum)}
.cc-body{display:grid;gap:2px;min-width:0}
.cc-name{font-weight:650;line-height:1.3;overflow-wrap:anywhere}
.cc-price b{color:var(--berry)}

/* 후기 */
.v3-reviews{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.v3-reviews li{background:var(--peach);border-radius:var(--r-xl);padding:20px;display:grid;gap:8px;align-content:start}
.v3-reviews blockquote{margin:0;font-size:15px;line-height:1.6;overflow-wrap:anywhere}

/* 비교 방법 */
.v3-how ol{list-style:none;counter-reset:s;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.v3-how ol li{counter-increment:s;background:var(--bg);border-radius:var(--r-xl);padding:18px 20px;display:grid;gap:4px}
.v3-how ol li::before{content:counter(s);font:600 26px var(--serif);color:var(--plum)}
.v3-facts{margin:18px 0 10px;padding-inline-start:20px;display:grid;gap:4px;color:var(--ink)}

/* 카테고리 머리 */
.cat-head{background:linear-gradient(120deg,var(--blush),var(--lilac));padding:28px 0}
.ch-in{display:grid;grid-template-columns:220px minmax(0,1fr);gap:32px;align-items:center}
.ch-in h1{font:600 clamp(30px,4vw,48px)/1.1 var(--serif);letter-spacing:-.6px}
.ch-in .v3-chips a{font-size:13px}

/* 병원 찾기 */
.cf-filters{margin-bottom:10px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:12px;align-items:end}
.cf-filters label{display:grid;gap:4px;min-width:0}
.cf-filters select{width:100%;min-width:0}
.cf-list{margin-top:18px}

@media (max-width:1100px){
  .cat-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
  .clinic-cards,.v3-reviews{grid-template-columns:repeat(2,minmax(0,1fr))}
  .top-search input{width:140px}
}
@media (max-width:860px){
  .top-search{display:none}
  .ha-mosaic{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ha-mosaic .ph:nth-child(n+5){display:none}
  .hb-in{grid-template-columns:minmax(0,1fr);gap:24px}
  .hb-collage{order:-1}
  .pg-panel{grid-template-columns:minmax(0,1fr)}
  .area-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v3-how ol{grid-template-columns:minmax(0,1fr)}
  .ch-in{grid-template-columns:120px minmax(0,1fr);gap:18px}
}
@media (max-width:640px){
  .nav{gap:12px;font-size:14px;overflow-x:auto;min-width:0}
  .hero-a{padding-top:16px}
  .ha-mosaic{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding-inline:16px}
  .ha-mosaic .ph:nth-child(n+5){display:flex}   /* 휴대폰: 사진 8장을 두 줄 띠로(기획서 §4 모바일) */
  .ha-mosaic .ph{border-radius:14px}
  .ha-mosaic .ph:nth-child(even){transform:translateY(14px)}
  .ha-mosaic .ph-label,.ha-mosaic .ai-note{display:none}
  .ha-card-wrap{margin-top:4px}
  .ha-card{padding:24px 18px;border-radius:22px}
  .v3-search{padding-inline-start:14px}
  .v3-search button{padding:10px 14px}
  .v3-trust{gap:8px 18px}
  .v3-trust dd{font-size:17px}
  .hb-collage .ph:nth-child(n+4){display:none}
  .cat-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .pc-row{grid-auto-columns:76%}
  .clinic-cards,.v3-reviews{grid-template-columns:minmax(0,1fr)}
  .cf-filters{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cf-filters button{grid-column:1/-1}
  .cc a{grid-template-columns:76px minmax(0,1fr)}
  .cc-img{width:76px;height:76px}
  .rbar{width:72px}
  .pg-wide .rbar{width:72px}
  .pg-table{font-size:13px}
  .pg-table th,.pg-table td{padding:6px 3px}
  .pg-wide thead th:nth-child(2),.pg-wide .c-count{display:none}
  .pg-table th:last-child,.pg-table td:last-child{display:none}   /* 휴대폰: 가격 표의 막대 칸은 숨긴다(눈 카테고리 383px · 홈 가이드 376px 실측) */
  .pg-table tbody th{overflow-wrap:anywhere}
  .ch-in{grid-template-columns:minmax(0,1fr)}
  .ch-in .ph{display:none}
}
@media (prefers-reduced-motion:reduce){.ha-mosaic .ph,.hb-collage .ph{transform:none!important}}

/* 독립 비평(10-14) 반영 */
.m-search{display:none}
.price-strip{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,1fr);gap:10px;overflow-x:auto;scroll-snap-type:x mandatory}
.price-strip a{display:grid;gap:2px;min-height:44px;text-decoration:none;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:16px;padding:10px 14px;box-shadow:var(--shadow);scroll-snap-align:start}
.price-strip a:hover{border-color:var(--plum)}
.ps-cat{font:600 15px/1.2 var(--serif)}
.ps-what{font-size:12px;color:var(--muted);overflow-wrap:anywhere}
.ps-price b{color:var(--berry);font-size:16px}
.ct-what{display:block;overflow-wrap:anywhere}
.pg-amount{display:block;font-weight:400}
.pg-table tbody th a{display:inline-block;min-height:28px}
.ko-keep{word-break:keep-all}
.rb-legend{display:flex;align-items:center;gap:6px;margin-top:8px}
.rb-legend svg{width:12px;height:12px}
.rb-legend svg+*{margin-inline-end:10px}
/* 머리 두 줄(메뉴를 둘째 줄로)은 1120px 이하부터(#115 검토 10-15: 861 ~ 1100px 에서 메뉴 다섯 개가 한 줄에 몰려 러시아어 · 인도네시아어 등 'AI' 항목이 두 줄로 꺾이고 러시아어 첫 화면이 1024px 에서 1043px 로 넓어졌다 — scripts/check-header-fit.mjs 실측). 경계는 1120px(#121 검토: 1101px 인도네시아어 'Semua harga · Konsultasi AI' 가 두 줄) */
@media (max-width:1120px){
  .top-in{flex-wrap:wrap;height:auto;padding-block:8px;row-gap:4px}
  .top-in .nav{display:flex;order:3;width:100%;overflow-x:auto;gap:18px}
  .top-in .nav a{min-height:40px;display:inline-flex;align-items:center;white-space:nowrap}
  /* 첫 화면 시술군 표: 두 칸일 때 칸이 좁아 긴 러시아어 이름 + 막대(120px)가 줄지 못해 문서가 넓어졌다(1024px 러시아어 1043px · 900px 몽골어 942px 실측) — 막대를 줄이고 이름은 꺾는다 */
  .pg-cat .rbar{width:72px}
  .pg-table tbody th{overflow-wrap:anywhere}
}
/* 휴대폰: 메뉴를 가로로 밀지 않고 줄을 바꿔 다 보인다(#115 검토: 375px 아랍어 · 러시아어 등 6개 언어에서 'AI' 항목이 처음 화면 밖이었다 — 밀어야 보이는 줄 몰랐다) */
@media (max-width:640px){
  .top-in .nav{flex-wrap:wrap;overflow-x:visible;column-gap:16px;row-gap:0}
}
@media (max-width:860px){
  .m-search{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;color:var(--ink);border:1px solid var(--line);border-radius:999px}
  .hb-collage{display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,auto);grid-template-columns:none;grid-auto-columns:120px;overflow-x:auto;gap:8px;padding-bottom:4px}
  .hb-collage .ph{aspect-ratio:3/4;transform:none!important}
  .hb-collage .ph:nth-child(n){display:flex}
  .hb-collage .ph-label{font-size:13px}
}
@media (max-width:640px){
  .hb-collage .ph:nth-child(n+4){display:flex}
  .cat-tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .cat-tiles .ph{aspect-ratio:1}
  .cat-tiles .ph-label,.cat-tiles .ai-note{display:none}   /* 다른 병원 그림의 병원 · 가격은 .ct-img-note 로 타일 글 아래에 */
  .ct-name{font-size:15px}
  .ct-price{font-size:12px}
  .ct-price .muted,.ct-what{display:none}
  .price-strip{grid-auto-columns:72%}
  .ch-in .ph{display:flex;aspect-ratio:16/9}
  .ch-in .v3-chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}
  .ch-in .v3-chips a{white-space:nowrap}
  .ko-keep{display:block}
}

/* 상태(T-4a · 상태 관찰표): 검색 없음 · 필터 0 · 그림 자리 · 최근 본 것 */
.no-results{display:grid;gap:10px;margin:8px 0 24px}
.no-results .v3-search{margin-top:4px}
.nr-h{font:600 18px/1.3 var(--serif);margin-top:10px}
.zero{display:grid;gap:8px}
.zero-opts{margin:0;padding-inline-start:20px;display:grid;gap:6px}
.zero-opts a{display:inline-flex;align-items:center;min-height:44px;font-weight:600}
.pc-img,.cc-img,.card-img,.gallery figure,.prod-img,.thumb{background:linear-gradient(135deg,var(--soft),var(--lilac))}   /* 그림을 불러오는 동안 같은 크기의 자리 */
.recent{padding-top:20px}
.recent h2{font-size:20px}
.recent-list{list-style:none;margin:8px 0 0;padding:0;display:flex;gap:10px;overflow-x:auto}
.recent-list a{display:inline-flex;align-items:center;min-height:44px;padding:6px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;white-space:nowrap;text-decoration:none;color:var(--ink);font-size:14px}
.recent-clear{border:0;background:none;color:var(--plum);text-decoration:underline;cursor:pointer;font:inherit;min-height:44px}

/* 2차 비평(4축) 반영 */
:root{--line-strong:#6f8a8f}   /* 누르는 것의 경계(칩 · 입력)는 흰 바탕 3.68:1 · 둘째 바탕 3.43:1 (P3 · 3:1 이상) */
.v3-chips a,.v3-search,.top-search,.price-strip a,.recent-list a,.pg-tabs label,.cf-filters select{border-color:var(--line-strong)}
.v3-chips a{gap:6px}
.chip-n{font-size:12px;font-weight:600;color:var(--muted);background:var(--soft);border-radius:999px;padding:1px 7px}
.ps-h{font:600 15px var(--font);margin:24px 0 0}
.price-strip{margin-top:10px}
.dym{font-size:18px}.dym a{font-weight:700}
.ch-lead{font-size:16px!important}
.cc-name .en-name{display:block;font-size:12px;font-weight:400;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc-card a:hover,.cc a:hover,.cat-tiles a:hover .ct-name{border-color:var(--plum)}
.cc a:hover,.pc-card a:hover{box-shadow:0 0 0 2px var(--plum)}
.pc-img .noimg{background:linear-gradient(135deg,var(--blush),var(--lilac));color:var(--ink);width:100%;height:100%;display:grid;place-items:center;font-size:13px}
.v3-reviews li{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
.rb-legend svg{width:14px;height:14px}
@media (min-width:861px){.price-strip{mask-image:linear-gradient(90deg,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 92%,transparent)}}
@media (max-width:640px){
  .hero-b .hb-text{order:-1}
  .hb-collage{order:0;grid-template-rows:auto;grid-auto-columns:104px}
  .hero-b{padding-top:20px}
  .ct-what{display:block;font-size:11px}
  .pg-table tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;column-gap:8px;border-bottom:1px solid var(--line);padding:6px 0}
  .pg-table tbody th{grid-column:1/-1;border:0;padding:0}
  .pg-table thead th:first-child{grid-column:1/-1}
  .pg-table th,.pg-table td{border:0}
}
.cc-name{overflow:hidden;min-width:0}   /* 로마자 한 줄 말줄임이 카드 폭을 넘지 않게(386px 실측) */
.cc-name .en-name{max-width:100%}
.recent{min-width:0}
/* 목록 격자 안: .wrap 의 margin-inline:auto 때문에 칸이 격자 폭을 따르지 않고 링크 줄 길이(747 · 887px)로 늘었다(헤드리스 실측) — 여백 0 · 격자 폭 */
.list-grid>.recent{grid-column:1/-1;margin-inline:0;padding-inline:0;justify-self:stretch;max-width:100%}
.recent-list{max-width:100%}

/* 고른 히어로 사진(D-81): 사진이 들어간 칸은 이름표를 숨기고 'Illustrative image (AI)' 만 단다 */
.ph.has-img img{z-index:0}
.ph.has-img .ai-note{z-index:1}
.ha-mosaic .ph.has-img .ai-note{display:none}   /* A(비교용)의 작은 격자는 장식 — 표시는 방향 B 에 */
body{font-synthesis-weight:none}   /* 받은 굵기는 400 · 600 뿐 — 650 · 700 은 가장 가까운 600 으로 그리고 가짜 굵기를 만들지 않는다 */

/* 실제 사진(D-82): 행사 · 병원 사진은 칸을 덮고(cover) 출처를 단다. 히어로 행사 사진은 비교 화면으로 잇는 가격 칩 */
.ph.real img{object-position:center}
.ph.ev a{position:absolute;inset:0;display:block;color:var(--ink);text-decoration:none}
.ph.ev a:focus-visible{outline:3px solid var(--plum);outline-offset:-3px}
.ev-chip{position:absolute;inset:8px 8px auto;z-index:1;background:rgba(255,255,255,.94);border-radius:10px;padding:4px 8px;font-size:12px;line-height:1.35;font-weight:600;box-shadow:var(--shadow)}
/* 칩은 두 줄: 가격 / 병원 · 플랫폼(넘치면 … — 전체 글은 그대로 있어 읽기 기계는 다 읽는다) */
/* 가격 줄은 자르지 않는다(좁으면 'Lowest' 와 가격 사이에서만 줄바꿈) · 병원 줄만 … */
.ev-p{display:block;color:var(--ink)}
.ev-c{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ev-c{font-weight:500;color:var(--muted)}
.ev-chip b{color:var(--berry)}
.ph.real .ai-note{font-size:11px}
@media (max-width:640px){.ev-chip{inset:auto 4px 4px;font-size:10px;padding:3px 5px;border-radius:8px}.ev-chip .ev-p b{display:block}}
/* 휴대폰: 행사 사진은 칩이 플랫폼을 이미 밝혀 'Listing image' 표시를 숨긴다(B 콜라주에서 칩을 가렸다 · 10-15 캡처) */
@media (max-width:640px){.ph.ev .ai-note{display:none}}
/* 휴대폰 B 첫 화면(PM 결정 10-15 · 대표 '첫 화면부터 모델이 많고 화사하게'): 제목 → 검색 → 인기 칩 한 줄(가로로 넘김) → 사진 띠 → 숫자.
   글 묶음(.hb-text)을 풀어(display:contents) 사진 띠와 같은 줄에 두고 order 로 세운다 — 선택자는 DOM 부모(.hb-text) 기준이다 */
@media (max-width:640px){
  .hero-b .hb-in{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .hero-b .hb-text{display:contents}
  .hero-b .hb-text>h1{order:1}
  .hero-b .hb-text>.lead{order:2}
  .hero-b .hb-text>.v3-search{order:3}
  .hero-b .hb-text>.v3-chips{order:4;min-width:0;flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;margin-top:12px}
  .hero-b .hb-text>.v3-chips>*{flex:none;white-space:nowrap}
  .hero-b .hb-in>.hb-collage{order:5;margin-top:14px;min-width:0;max-width:100%}
  .hero-b .hb-text>.v3-trust{order:6;margin-top:16px}
}
/* 다른 병원 그림 표시(대표 D-84 '꼬이지 않도록'): 묶음 카드 그림 위 · 휴대폰 카테고리 타일은 그림이 작아 타일 글 아래 한 줄로 */
.pc-img{position:relative}
.pc-img .ai-note{font-size:11px;z-index:1}
.ct-img-note{display:none}
@media (max-width:640px){.ct-img-note{display:block;font-size:11px;line-height:1.3;color:var(--muted);overflow-wrap:anywhere}}
/* 번역 이름 옆 한국어 원문(PM 10-15 — 손님이 병원에 보여 줄 수 있게) */
.ko-orig{font-size:.6em;font-weight:500;color:var(--muted);font-family:var(--font);white-space:nowrap}
/* 예약 요청(T-5b): 숨은 칸(사람에게는 보이지 않고 읽기 기계도 건너뜀 — aria-hidden · tabindex=-1) · 희망 날짜 두 칸 */
/* 봇 걸러내기 숨은 칸(T-5b): 화면 밖으로 밀지 않고 1px 로 잘라 숨긴다 — left:-9999px 는 아랍어(rtl)에서 문서를 1280px → 11,279px · 375px → 10,374px 로 넓혔다(#121 검토 실측) */
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.req-dates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:640px){.req-dates{grid-template-columns:minmax(0,1fr)}}
/* 담당자 상담함(/ops · 운영자용) */
.ops-main{padding-block:24px}.ops-logout{margin-left:auto}.ops-tabs a[aria-current]{font-weight:700}
.ops-table{width:100%;border-collapse:collapse;font-size:14px}.ops-table th,.ops-table td{border-bottom:1px solid var(--line);padding:8px;text-align:left;vertical-align:top}
.ops-badge{display:inline-block;border-radius:999px;padding:2px 8px;font-size:12px;font-weight:600}.ops-badge.warn{background:var(--peach)}.ops-badge.bad{background:#fde2e2;color:#a3121f}
.ops-dl{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 16px}.ops-dl dt{color:var(--muted)}.ops-dl dd{margin:0}.ops-pre{white-space:pre-wrap}
.ops-form{display:grid;gap:8px;max-width:560px;margin:16px 0;padding:12px;border:1px solid var(--line);border-radius:12px}.ops-cancel{display:grid;gap:8px;border:0;padding:0;margin:0}.ops-danger{border-color:#e7a2a2}
.ops-msg{background:var(--lilac);padding:8px 12px;border-radius:8px}.ops-events{font-size:14px}
/* 홍보물 · 행사 그림은 잘리지 않게(대표 10-15 · PM 결정 잘림 0%): 그림 전체(contain) + 빈자리는 같은 그림을 흐리게 깐다(fitImg — 그림 두 장).
   병원 사진(.cc-img · 병원 화면 갤러리) · AI 그림(.ph 의 900×1200)은 cover 그대로 */
.ph img.fit-bg,.pc-img img.fit-bg,.card-img img.fit-bg,.prod-img img.fit-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(16px) saturate(1.1);transform:scale(1.15);opacity:.55;z-index:0}
.ph img.fit,.pc-img img.fit,.card-img img.fit,.prod-img img.fit{width:100%;height:100%;object-fit:contain;object-position:center;z-index:0}
.pc-img img.fit,.card-img img.fit,.prod-img img.fit{position:relative;display:block}
/* AI 상담(T-5c): 대화 줄 · 손님 말은 오른쪽 · 답 아래 카드(가로로 넘김) · 375px 에서 넘치지 않게 */
.chat-page{padding-bottom:32px}
.chat-log{display:grid;gap:12px;margin:8px 0 16px;min-width:0}
.chat-msg{max-width:min(720px,100%);padding:10px 14px;border-radius:14px;background:var(--lilac);min-width:0}
.chat-msg b{display:block;font-size:13px;color:var(--muted);font-weight:600}
.chat-msg p{margin:4px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}
.chat-you{justify-self:end;background:var(--surface);border:1px solid var(--line)}
.chat-wait p{color:var(--muted)}
.chat-extra{margin-top:8px;display:grid;gap:8px;min-width:0}
.chat-cards{list-style:none;margin:0;padding:0;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,240px);gap:8px;overflow-x:auto;overscroll-behavior-x:contain}
.chat-card{display:grid;gap:2px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:inherit;text-decoration:none;height:100%}
.chat-card:hover,.chat-card:focus-visible{border-color:currentColor}
.chat-price{font-weight:700}
/* 답 아래 묶음(예약 단추 · 연락 안내 · 안내 쪽 링크 <p>)의 여백은 말풍선 글 규칙(.chat-ai .chat-bubble p · 위 4px)이 정한다 — 여기서 margin:0 을 주어도 그 규칙에 져서 효과가 없었다(G-1d · 화면 같음) */
.chat-booking{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.chat-form{display:grid;gap:8px;position:sticky;bottom:0;background:var(--bg);padding:8px 0}
/* 휴대폰: 입력칸은 처음부터 아래에 붙인 채(PM 결정 10-18), 첫 인사와 입력칸이 375×812 첫 화면에 함께 들어가게 줄인다.
   붙인 입력칸(165px)이 머리 글이 긴 언어(kk · ru · de · km 등 10개)의 첫 인사를 덮었다 — 목록 아래 여백으로는 첫 화면의 첫 인사 자리가 그대로라 안 됨(#220 재검토 실측).
   상담 화면에서는 떠 있는 견적 단추(.qfab)를 숨긴다 — 입력 줄이 가로를 다 써서 둘 자리가 없고 보내기 단추 · 입력칸을 덮었다(G-1e 실측 375 · 390 · 640 ja · ar · PM 결정 10-22). 641px 이상은 겹치지 않아 그대로.
   첫 답 뒤 나타나는 상담 번호(.chat-no) · 새 대화 단추가 단추 칸(auto 열)을 넓혀 입력칸이 76px 로 줄었다(G-1d 실측 ja · ar 375) → 단추 묶음을 풀어(display:contents) 보내기만 입력칸 옆, 둘은 아래 줄 전체.
   입력칸은 한 줄(48px)로 시작해 쓰면 4줄까지 늘어남(chat.js fit) + 보내기 단추를 옆에 · 상담 머리 제목 22px · 설명 14px(굵게 · 진한 색으로 아래 AI 안내 글과 구분) → 17개 언어 모두 들어감(kk 가장 빠듯 · 14px 남음) */
@media (max-width:640px){.chat-form{grid-template-columns:minmax(0,1fr) auto;align-items:end;column-gap:8px}.chat-form textarea{height:48px;min-height:48px;resize:none}.chat-head h1{font-size:22px}.chat-head .lead{font-size:14px;line-height:1.45;font-weight:600;color:var(--ink)}.chat-head .small{line-height:1.4}.chat-form .chat-actions{display:contents}.chat-form .chat-no,.chat-form .chat-new{grid-column:1/-1;justify-self:start}body:has(#chat-form) .qfab{display:none}}
.chat-form textarea{width:100%;box-sizing:border-box;font:inherit;padding:10px 12px;border:1px solid var(--line-strong);border-radius:12px;resize:vertical}
.chat-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.chat-new{background:none;border:0;padding:4px;text-decoration:underline;cursor:pointer;color:inherit;font:inherit}
/* 서울 구 지도(대표 10-15 · /areas): 병원 수 순위 5단계(밝음 → 짙음) · 병원 0 은 회색 · 구 경계는 흰 선. 지도는 지리 그대로라 rtl 에서도 뒤집지 않는다 */
.gu-map-wrap{padding-block:8px 24px}
.gu-map{margin:0;display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:20px;align-items:center}
.gu-map svg{width:100%;height:auto;display:block;direction:ltr}
.gu-map path{stroke:#fff;stroke-width:1.4;stroke-linejoin:round}
.gu-c1{fill:#e3f5f8}.gu-c2{fill:#b3e4ec}.gu-c3{fill:#6fcbd9}.gu-c4{fill:#1f9fb4}.gu-c5{fill:#0d5c63}.gu-c0{fill:#e8eef0}
.gu-map a.gu{cursor:pointer;outline:none}
.gu-info{font-weight:600;min-height:3em;margin:0 0 8px}
.gu-legend{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;margin:0 0 8px}
.gu-legend span{display:inline-flex;align-items:center;gap:4px}
.gu-legend i{display:inline-block;width:14px;height:14px;border-radius:3px;border:1px solid var(--line)}
.gu-legend i.gu-c1{background:#e3f5f8}.gu-legend i.gu-c2{background:#b3e4ec}.gu-legend i.gu-c3{background:#6fcbd9}.gu-legend i.gu-c4{background:#1f9fb4}.gu-legend i.gu-c5{background:#0d5c63}.gu-legend i.gu-c0{background:#e8eef0}
@media (max-width:760px){.gu-map{grid-template-columns:minmax(0,1fr)}}
/* 구 이름 라벨(PM 결정 10-15): 사이트 글꼴 · 넓은 화면 12 · 760px 이하 18(지도 단위 · 빌드의 labelFont 와 같게) · 375px 은 빌드가 고른 것(gu-l-n)만.
   글씨에 반대 색 테두리(halo · paint-order) — 4단계 칸은 흰 글씨 · 짙은 글씨 모두 칸과 4.5 미만이라 글씨와 테두리 대비(7:1 이상)로 읽힘. 지도 글자는 10개 언어 모두 ltr */
.gu-map .gu-labels{pointer-events:none}.gu-map .gu-labels a.gu-lab{pointer-events:auto;cursor:pointer}
.gu-map text.gu-l-m,.gu-map text.gu-l-n{display:none}
.gu-map text.gu-l{font-family:var(--font);font-size:12px;font-weight:650;text-anchor:middle;dominant-baseline:central;direction:ltr;unicode-bidi:plaintext}
.gu-map text.gu-l{paint-order:stroke fill;stroke-width:3px;stroke-linejoin:round}
.gu-map text.gu-td{fill:#14323a;stroke:#ffffff}.gu-map text.gu-tw{fill:#ffffff;stroke:#14323a}
/* 761 ~ 1000px 는 지도 칸이 좁아 12 이면 8px 남짓으로 작았다(재검토) — 15 로 키우고 그 크기에서 빌드가 정한 라벨(m)만 */
@media (min-width:761px) and (max-width:1000px){.gu-map text.gu-l{font-size:15px}.gu-map text.gu-l-w{display:none}.gu-map text.gu-l-m{display:inline}}
@media (max-width:760px){.gu-map text.gu-l{font-size:18px}.gu-map text.gu-l-w,.gu-map text.gu-l-m{display:none}.gu-map text.gu-l-n{display:inline}}
/* 고른 구 강조(검토 10-15: 뒤에 그린 이웃 구가 앞 구 테두리를 덮어 동대문 26% · 강남 31% 만 보였다) — 맨 끝 강조 전용 경로에 고른 구의 d 를 복사(price.js) */
/* 스크립트가 없을 때의 키보드 초점(이웃 구가 일부를 덮을 수 있어 스크립트가 맨 끝 강조선으로 다시 그림) */
.gu-map a.gu:focus-visible path{stroke:#000;stroke-width:3.2}
.gu-map path.gu-hl{fill:none;stroke:#000;stroke-width:3.2;stroke-linejoin:round;pointer-events:none}
/* 지도 건너뛰기: 화면 밖으로 밀지 않고 1px 로 감춘다(left:-9999px 는 rtl 에서 문서 폭이 10,374px 로 늘었다 — 375px 실측) · 초점이 오면 보임 */
.skip-map{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.skip-map:focus{position:static;width:auto;height:auto;overflow:visible;clip-path:none;display:inline-block;margin-bottom:8px;white-space:normal}
/* 그림 위 표시가 그림 속 글씨를 가리지 않게(#102 검토 · PM 결정 10-15): 홍보물 칸을 세로로 나눠 표시(가격 칩 · 'Listing image' 글)는 흐린 바탕 띠에 두고,
   그림(contain)은 남은 자리에 전체로 넣는다. 칸 크기는 그대로(레이아웃 밀림 0). 흐린 바탕(fit-bg)은 칸 전체에 깔리고, 표시 · 그림은 그 위(z-index 1) */
.ph.real{flex-direction:column;align-items:stretch}
.ph.real>img.fit,.ph.ev a>img.fit{position:relative;inset:auto;flex:1 1 0;min-height:0;height:auto;width:100%;z-index:1}
.ph.ev a{display:flex;flex-direction:column}
.ph.ev .ev-chip{position:relative;inset:auto;margin:8px 8px 0;z-index:1;flex:none}
.ph.real>.ai-note{position:relative;inset:auto;margin:0 8px 8px;z-index:1;flex:none;align-self:flex-start}
@media (max-width:640px){.ph.ev .ev-chip{order:2;margin:0 4px 4px}}
.card-img:has(figcaption),.prod-img:has(figcaption),.pc-img:has(.ai-note){display:flex;flex-direction:column}
.card-img:has(figcaption) img.fit,.prod-img:has(figcaption) img.fit,.pc-img:has(.ai-note) img.fit{flex:1 1 0;min-height:0;height:auto;z-index:1}
.card-img figcaption,.prod-img figcaption,.pc-img .ai-note{position:relative;inset:auto;z-index:1;flex:none;align-self:flex-end;margin:0 6px 6px}
/* 히어로 행사 칸: 가격 칩이 이미 플랫폼을 밝혀 'Listing image' 글은 넓은 화면에서도 숨긴다(휴대폰과 같은 이유 · 링크 밖 아래에 있어 그림 아래 6% 를 가렸다 — 1280px 실측 4칸) */
.ph.ev .ai-note{display:none}
/* 챗봇 캐릭터 Lulu(대표 결정 10-15): 그림 색은 고정 · 둘레는 피치 원(--lulu-bg — 팔레트가 바뀌면 따라감 · 사이트에 다크 모드는 없고, 어두운 바탕이 생겨도 원이 실루엣을 받쳐 줌)
   머리(64) · 대화 줄(40) · 머리 메뉴(20). 'AI' 표시는 머리와 답마다 늘 보인다 */
:root{--lulu-bg:var(--peach)}
.lulu{display:inline-block;flex:none;line-height:0;border-radius:50%;background:var(--lulu-bg)}
.lulu img{display:block;border-radius:50%}
.chat-head{display:flex;gap:16px;align-items:flex-start}
.lulu-head img{width:64px;height:64px}
.chat-who{margin:0 0 4px;display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.ai-badge{display:inline-block;font-size:11px;font-weight:600;line-height:1.4;padding:0 6px;border-radius:999px;background:var(--plum);color:#fff;vertical-align:middle}
.chat-msg.chat-ai{display:flex;gap:8px;align-items:flex-start;background:none;padding:0}
.chat-ai .chat-bubble{max-width:min(720px,100%);padding:10px 14px;border-radius:14px;background:var(--lilac);min-width:0;flex:1 1 auto}
.chat-ai .chat-bubble b{display:block;font-size:13px;color:var(--muted);font-weight:600}
.chat-ai .chat-bubble p{margin:4px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}
.lulu-ava img{width:40px;height:40px}
.nav-chat{display:inline-flex;align-items:center;gap:6px}
.lulu-nav img{width:20px;height:20px}
@media (max-width:640px){.chat-head{gap:12px}.lulu-head img{width:48px;height:48px}}
/* 답부터(GEO · SEO PR-D · D-87 6): 시술 · 비교 · 병원 · 지역 · 카테고리 제목 바로 아래 한두 문장 요약(숫자는 코드 · 설명과 같은 글) */
.answer-first{margin:8px 0 0;max-width:72ch;font-size:15px;line-height:1.55;color:var(--ink)}
/* 비교 방법 질문 · 답(/about · FAQPage 와 같은 글) */
.faq{margin-top:28px}
.faq h2{font:600 clamp(22px,2.4vw,28px)/1.2 var(--serif);margin-bottom:12px}
.faq-item{border-top:1px solid var(--line);padding:14px 0;scroll-margin-top:120px}
.faq-item h3{font-size:16px;margin-bottom:4px}
.faq-item p{margin:0;color:var(--ink);max-width:72ch}
/* 후기 AI 번역(D-86 · PM 10-16): 원문 보기(접힘 · 스크립트 없이) · AI 번역 표시 */
.rv-orig{margin-top:4px}
.rv-orig summary{cursor:pointer;font-size:13px;color:var(--muted)}
.rv-orig .rv-text{margin-top:4px;color:var(--muted)}
.rv-ai{font-size:11px}
/* 병원 사진이 없는 병원 카드의 행사 그림(PM 10-16 · D-82 · D-84): 잘리지 않게 contain + 흐린 바탕 · 표시는 카드 글 쪽 .cc-ev */
.cc-img.promo{position:relative;background:var(--surface)}
.cc-img.promo img.fit-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(12px) saturate(1.1);transform:scale(1.15);opacity:.55}
.cc-img.promo img.fit{position:relative;width:100%;height:100%;object-fit:contain;object-position:center}
.cc-ev{margin:0 0 2px;overflow-wrap:anywhere}

/* 무료 상담 · 견적 입구(D-95 PR-2): 비교 줄 버튼 · 출처는 작게 · 병원 이름 아래 버튼 · 컨시어지 상자 · 양식의 넘어온 가격 */
.btn-sm{padding:7px 12px;font-size:13px}
.quote{white-space:normal;text-align:center;justify-content:center;line-height:1.25}
/* 버튼이 칸을 넓히지 않게 — 최대 폭 안에서 접힌다(mn 'Үнэгүй үнийн санал' 이 칸을 144px 로 넓혔다 · #177 화면 검토) */
.c-total .quote-d{display:flex;margin-top:8px;margin-inline-start:auto;width:max-content;max-width:96px;border-radius:12px;font-size:12px;padding:6px 10px}
.c-link .quote-m{display:none}
.c-link .src{display:block;font-size:12px;color:var(--muted)}
.c-link .src a{font-weight:500}
.clinic-cta{margin:10px 0 4px}
.concierge{background:var(--surface);border:1px solid var(--line);border-inline-start:4px solid var(--plum);border-radius:var(--r-m);padding:16px 18px;margin:16px 0}
.concierge h2{font-size:17px;margin:0 0 8px}
.concierge ul{margin:0;padding-inline-start:18px;display:grid;gap:4px}
.concierge li b{color:var(--plum-ink)}
.concierge .cc-reply{margin:10px 0 0;font-weight:600}
.concierge .btn{margin-top:4px}
.req-picked{background:var(--soft);border-radius:var(--r-m);padding:10px 12px;margin:4px 0 8px}
.req-picked p{margin:2px 0}
.req-date-note{grid-column:1/-1;margin:0}
/* 표가 카드로 바뀌는 너비(860px)와 같게 */
@media (max-width:860px){
  .c-link{flex-wrap:wrap}
  .c-total .quote-d{display:none}
  .c-link .quote-m{display:flex;flex:1 1 100%;margin-bottom:6px}
}
/* 이용 3단계 아래 버튼이 카드 바닥에 붙었다(간격 0 · #177 화면 검토) */
.v3-how>p{margin:16px 0 0}
/* 표 머리 글자는 접힌다 — ru · mn 처럼 머리 낱말이 긴 언어에서 줄바꿈 금지 머리가 표를 넓혀, 'VAT 포함 가격' 칸(가격 · 견적 버튼)이 표 상자 밖으로 밀렸다(#177 화면 검토 · 1280 실측 ru 3px · mn 71px) */
.ledger th{white-space:normal;vertical-align:bottom}
/* 출처 칸도 넓히지 않게(mn 215px · en 183px) — 안내 · 원문 제목은 이 폭 안에서 접힌다 */
.ledger td.c-link{max-width:180px}
.ledger td.c-link .linknote,.ledger td.c-link .orig{max-width:100%}
/* 표 안 꼬리표는 접힌다(mn 병원 칸 276px · en 232px — 진료과 · 병원 종류 꼬리표가 줄바꿈 금지라 넓혔다) */
.ledger td .tag{white-space:normal}
/* 아랍어 날짜: 화면 날짜는 모두 아랍어 달 이름이 든 꼴(dayFmt)이라 ltr 고정을 풀고 한 덩어리로만 묶는다 — ltr 고정이면 '8 2026 أكتوبر' 처럼 섞였다(#177 재검토). 숫자만인 날짜는 지금 화면에 없다 */
[dir="rtl"] time{unicode-bidi:isolate}

/* ── 시안 v4(기획서 v4 · 대표 지시 10-17 13:0x): heroVariant 'v4' 일 때만 쓰이는 칸 ── */
/* 첫 화면: 실제 행사 그림 띠(AI 그림 없음) 위에 약속 카드 */
.v4-hero{position:relative;padding:0 0 8px}
.v4-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(180px,1fr);gap:10px;overflow-x:auto;padding:16px 16px 0;scroll-snap-type:x mandatory}
.v4-strip .ph{aspect-ratio:3/4;scroll-snap-align:start}
.v4-hero-in{margin-top:16px;position:relative}
.v4-hero-card{background:var(--surface);border-radius:var(--r-l);box-shadow:0 16px 40px rgba(20,50,58,.14);padding:24px 24px 20px;max-width:760px}
.v4-hero-card h1{font-size:clamp(26px,3.4vw,38px)}
.v4-hero-card .lead{margin:8px 0 14px}
.v4-hero-cta{margin:14px 0 0}
/* 금주의 베스트 */
.v4-wk{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.v4-wk-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;display:flex;flex-direction:column}
.v4-wk-img{position:relative;display:block;aspect-ratio:1/1;background:var(--soft)}
.v4-wk-img,.v4-card-img{overflow:hidden}
.v4-wk-img img.fit-bg,.v4-card-img img.fit-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(16px) saturate(1.1);transform:scale(1.15)}
.v4-wk-img img.fit,.v4-card-img img.fit{position:relative;display:block;width:100%;height:100%;object-fit:contain}
.v4-badge{position:absolute;inset-inline-start:10px;top:10px;background:var(--berry,#c93652);color:#fff;font-size:12px;font-weight:700;border-radius:999px;padding:3px 10px}
.v4-badge.low{background:var(--berry,#c93652)}
.v4-wk-body{padding:12px 14px 14px;display:grid;gap:4px}
.v4-wk-body p{margin:0}
.v4-wk-t{font-weight:600}
.v4-wk-p b{font-size:20px}
.v4-wk-a{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:6px!important}
/* 이렇게 돕습니다: 그림 아이콘 3단계 + 컨시어지 그림 카드 */
.v4-band{background:var(--surface);border-block:1px solid var(--line)}
.i4{width:28px;height:28px;fill:none;stroke:var(--plum);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.i4-lg{width:44px;height:44px}
.v4-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;counter-reset:s}
.v4-steps li{background:var(--soft);border-radius:var(--r-l);padding:18px;display:grid;gap:6px;align-content:start}
.v4-steps li b{font-size:17px}
.v4-cc{margin-top:18px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:20px;align-items:center;background:linear-gradient(135deg,#e4f7f9,#fff3ef);border-radius:var(--r-l);padding:20px}
.v4-cc-icons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.v4-cc-icons span{background:var(--surface);border-radius:var(--r-m);padding:14px;display:grid;justify-items:center;gap:6px;text-align:center}
.v4-cc-text h3{font-size:20px;margin-bottom:8px}
.v4-cc-text p{margin:6px 0}
.v4-scroll{scroll-snap-type:x mandatory}
/* 휴대폰 .area-tiles 의 2칸 고정(minmax(0,1fr))이 남으면 앞 두 타일이 폭 0 으로 접힌다(10-18 검토 실측) — v4 띠는 칸 고정 없이 */
.area-tiles.v4-scroll{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);overflow-x:auto;gap:16px}
.v4-trust .v3-trust{justify-content:center}
.v4-why{margin-top:12px;font-size:14px}
.v4-why summary{cursor:pointer;color:var(--plum);font-weight:600}
/* 오른쪽 떠 있는 버튼(아랍어는 inset-inline-end 라 왼쪽) — 넓은 화면은 가운데 세로 띠, 휴대폰은 아래 둥근 버튼 둘 */
.qfab{position:fixed;inset-inline-end:16px;top:50%;transform:translateY(-50%);z-index:30;display:grid;gap:10px}
.fab-btn{display:grid;justify-items:center;gap:4px;width:84px;padding:12px 6px;border-radius:18px;background:var(--plum);color:#fff;text-decoration:none;font-size:12px;font-weight:600;line-height:1.25;text-align:center;box-shadow:0 10px 24px rgba(13,92,99,.28)}
.fab-btn svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fab-ai{background:var(--surface);color:var(--plum);border:1px solid var(--line)}
.fab-lulu{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--rose);color:#fff;font-size:11px;font-weight:700}
.fab-btn:focus-visible{outline:3px solid var(--rose);outline-offset:2px}
/* 시술 화면: 오른쪽 고정 필터 판(넓은 화면) · 위 칩과 아래에서 올라오는 판(휴대폰) · 그림 카드 */
.v4-head .lead{margin:6px 0 0}
.v4-q{display:inline-block;margin-top:8px}
.v4-line{margin:8px 0}
.v4-line .v4-q{margin:0 0 0 4px;vertical-align:middle}
.v4-line .v4-q[open]{display:block;margin:8px 0 0}
.v4-line .v4-q summary{width:24px;height:24px;font-size:13px}
.v4-q summary{list-style:none;cursor:pointer;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--plum);font-weight:700}
.v4-q summary::-webkit-details-marker{display:none}
/* 보이는 원(24 · 28px)은 그대로, 누르는 자리만 44px(휴대폰에서 누르기 작음 — PM 10-17) */
.v4-q summary{position:relative}
.v4-q summary::after{content:'';position:absolute;left:50%;top:50%;width:44px;height:44px;translate:-50% -50%}
.v4-q ul{margin:10px 0 0;padding:12px 14px 12px 28px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);font-size:14px;max-width:640px}
.v4-grid{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:24px;align-items:start}
.v4-side{position:sticky;top:84px;min-width:0}
/* 떠 있는 버튼(오른쪽 16px + 너비 84px)이 본문 오른쪽 칸(견적 버튼 · 출처 링크 · 필터 판)을 가리지 않게 — 화면 여백이 모자란 만큼만 본문 오른쪽을 비운다(1440 이상은 그대로 24px) */
body:has(.qfab) main .wrap,body:has(.qfab) .foot .wrap{padding-inline-end:max(24px,calc(116px - (100vw - 1200px) / 2))}
.v4-filters{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);padding:16px;display:grid;gap:10px}
.v4-filters label{display:grid;gap:4px;font-size:13px;font-weight:600}
.v4-filters label.check{display:flex;gap:8px;align-items:flex-start;font-weight:500}
.v4-filters select{width:100%;min-width:0;font:inherit;font-size:14px;padding:8px;border:1px solid var(--line);border-radius:var(--r-s);background:#fff}
.v4-f-h{font-size:16px}
.v4-sheet{display:none}
.v4-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.v4-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600;color:var(--plum);text-decoration:none;cursor:pointer}
.v4-chip.on{background:var(--plum);color:#fff;border-color:var(--plum)}
.v4-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.v4-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;display:flex;flex-direction:column}
.v4-card-img{position:relative;display:block;aspect-ratio:4/3;background:var(--soft)}
.v4-card-body{padding:12px 14px 14px;display:grid;gap:4px}
.v4-card-body p{margin:0}
.v4-card-c{font-weight:600}
.v4-card-p b{font-size:20px}
.v4-card .tag{white-space:normal}
.v4-table{margin:20px 0}
.v4-table summary{cursor:pointer;color:var(--plum);font-weight:600}
@media (max-width:1000px){.v4-wk{grid-template-columns:repeat(2,minmax(0,1fr))}.v4-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){
  .v4-grid{grid-template-columns:minmax(0,1fr)}
  body:has(.qfab) main .wrap,body:has(.qfab) .foot .wrap{padding-inline-end:16px}
  .v4-side{display:none}
  .v4-sheet{display:block;margin:0 0 10px}
  .v4-sheet>summary{list-style:none}
  .v4-sheet>summary::-webkit-details-marker{display:none}
  .v4-sheet[open] .v4-filters{position:fixed;inset:auto 0 0 0;max-height:80vh;overflow:auto;border-radius:var(--r-l) var(--r-l) 0 0;z-index:40;box-shadow:0 -12px 32px rgba(20,50,58,.2)}
  .v4-steps{grid-template-columns:minmax(0,1fr)}
  .v4-cc{grid-template-columns:minmax(0,1fr)}
  .qfab{top:auto;bottom:16px;transform:none;grid-auto-flow:column}
  .fab-btn{width:auto;grid-auto-flow:column;align-items:center;padding:10px 14px;border-radius:999px;font-size:13px}
  /* 휴대폰: 아래 버튼이 첫 화면의 상담 버튼을 가렸다(375 · 667 · 812 실측) — price.js 가 상담 버튼이 화면 위로 나간 뒤(다른 화면은 160px 뒤)에 .on 을 붙인다.
     켜기 전에는 보이지도 눌리지도 않는다(반투명으로 나타나는 동안 누르는 것을 가로챘음 — #193 화면 검토). 스크립트가 없으면 휴대폰에서는 나오지 않는다(머리 메뉴에 AI 상담이 있음) */
  .qfab{opacity:0;visibility:hidden;pointer-events:none;translate:0 16px;transition:opacity .2s,translate .2s,visibility 0s .2s}
  .qfab.on{opacity:1;visibility:visible;pointer-events:auto;translate:0 0;transition:opacity .2s,translate .2s,visibility 0s}
}
@media (max-width:860px) and (prefers-reduced-motion:reduce){.qfab,.qfab.on{transition:none;translate:0 0}}
@media (max-width:640px){
  .v4-strip{grid-auto-columns:62%}
  .v4-hero-card{padding:18px 16px}
  .v4-wk{grid-template-columns:minmax(0,1fr)}
  .v4-cards{grid-template-columns:minmax(0,1fr)}
}
/* 모든 카테고리(운영 실측 10-17 — 타일 밖 카테고리로 오는 링크가 없었다): /procedures 의 칩 줄 · 첫 화면 타일 끝 '전체 카테고리' */
.cat-index{margin:8px 0 24px}
.cat-index h2{font-size:18px;margin:0 0 10px}
.cat-index ul{list-style:none;padding:0}
.ct-all a{display:grid;place-items:center;min-height:100%;border:1px dashed var(--line);border-radius:var(--r-l);padding:16px;text-align:center;color:var(--plum);text-decoration:none;font-weight:600}
/* C 단계(detailV4) 세부 화면: 목록은 필터를 오른쪽 판으로(넓은 화면 · 기획서 v4 §4) — 휴대폰은 지금처럼 위의 접힌 서랍 */
@media (min-width:861px){.list-grid.v4-list{grid-template-columns:minmax(0,1fr) 260px}.list-grid.v4-list>.filter-drawer{grid-column:2;grid-row:1 / span 3;position:sticky;top:84px}.list-grid.v4-list>.results,.list-grid.v4-list>.recent{grid-column:1}}
.v4-clinics{margin-top:12px}
.v4-cmp-head .stats{margin-top:12px}
/* 카테고리 v4: 묶음 카드는 가로 넘김이 아니라 격자(24장까지) · 지역 v4: 오른쪽 판 옆이라 병원 카드는 두 줄 */
.pc-row.v4-pcgrid{grid-auto-flow:row;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-columns:auto;overflow:visible;scroll-snap-type:none}
@media (max-width:1000px){.pc-row.v4-pcgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.pc-row.v4-pcgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.v4-grid .clinic-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:640px){.v4-grid .clinic-cards{grid-template-columns:minmax(0,1fr)}}
/* 지역 화면 '이 지역의 다른 병원(비교 가격 준비 중)' — 가격이 없다는 것과 무료 견적 길이 한 줄에 보이게(PM 10-17) */
.others-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 24px}
.others-list li{padding:8px 0;border-bottom:1px solid var(--line)}
@media (max-width:640px){.others-list{grid-template-columns:minmax(0,1fr)}}
.v4-card-cap{position:absolute;inset:auto 8px 8px 8px;background:rgba(255,255,255,.92);color:var(--ink);font-size:11px;line-height:1.3;padding:3px 6px;border-radius:6px;max-width:calc(100% - 16px)}
/* 휴대폰 비교 화면: 필터 칩 줄은 위에 붙는다(기획서 v4 §4 '휴대폰은 위에 붙는 칩 줄') · 머리 그림은 작게 */
@media (max-width:860px){
  .v4-chipbar{position:sticky;top:var(--top-h,0px);z-index:19;background:var(--bg,#fff);padding:8px 0;margin:0 0 8px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
  .v4-chipbar .v4-sheet{margin:0}
  .v4-chipbar .v4-chips{margin:0}
  .v4-cmp-head{grid-template-columns:72px minmax(0,1fr)}
}
/* 아랍어(RTL)는 화살표를 반대로 */
[dir=rtl] .arr{display:inline-block;transform:scaleX(-1)}
/* 병원 카드 로마자 이름: 이름만 말줄임 · '(auto)' 표시는 남긴다(#211 화면 검토 — 11건 잘림) */
.cc-name .en-name{display:flex;gap:4px;align-items:baseline}
.cc-name .en-name .en-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-name .en-name small{flex:none}
/* 그림 캡션은 한 줄 말줄임 — ru 375 카테고리 캡션이 세 줄로 그림 절반을 덮었다(#211 화면 검토) */
.ai-note,.v4-card-cap{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:calc(100% - 12px)}
/* 카테고리 필터(C 단계 작은 PR): 오른쪽 판 옆이라 묶음 카드는 세 줄 */
.v4-cat .pc-row.v4-pcgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:640px){.v4-cat .pc-row.v4-pcgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 크메르어(PR-5): Pretendard · Fraunces 에 크메르 글자가 없다 — 시스템 크메르 글꼴(받지 않음)로 · 제목도 본문 글꼴(베트남어와 같은 까닭) · 아래 받침 글자가 겹치지 않게 줄 높이를 넉넉히 */
html[lang="km"]{--font:"Noto Sans Khmer","Khmer Sangam MN","Khmer MN","Khmer OS","Leelawadee UI","Pretendard",-apple-system,BlinkMacSystemFont,sans-serif;--serif:var(--font)}
html[lang="km"] body{line-height:1.8}
/* 일본어 · 중국어(#247 화면 · 번역 검토 10-18): 기본 --font 에서 한자 · 가나가 Apple SD Gothic Neo(한국어 글꼴)로 그려졌다(375 · 글꼴 조회 실측 — ja 첫 문단 51자 · zh-Hant 38자).
   Pretendard 부분 글꼴에는 한자 · 가나가 없어(숫자만 그림) 앞에 두고, 그 뒤 · 한국어 글꼴 앞에 그 언어 시스템 글꼴을 둔다(맥 · 윈도우 · 안드로이드 이름 · 받지 않음).
   언어 메뉴의 각 언어 이름(lang 붙은 링크)도 그 언어 글꼴로 */
html[lang="ja"],.lang-opt[lang="ja"]{--font:"Pretendard","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic UI","Yu Gothic","Meiryo","Noto Sans JP","Noto Sans CJK JP","Apple SD Gothic Neo","Noto Sans KR","Segoe UI",-apple-system,BlinkMacSystemFont,sans-serif;--serif:"Fraunces",var(--font)}
html[lang="zh-Hans"],.lang-opt[lang="zh-Hans"]{--font:"Pretendard","PingFang SC","Hiragino Sans GB","Microsoft YaHei UI","Microsoft YaHei","Noto Sans SC","Noto Sans CJK SC","Apple SD Gothic Neo","Noto Sans KR","Segoe UI",-apple-system,BlinkMacSystemFont,sans-serif;--serif:"Fraunces",var(--font)}
html[lang="zh-Hant"],.lang-opt[lang="zh-Hant"]{--font:"Pretendard","PingFang TC","Microsoft JhengHei UI","Microsoft JhengHei","Noto Sans TC","Noto Sans CJK TC","Apple SD Gothic Neo","Noto Sans KR","Segoe UI",-apple-system,BlinkMacSystemFont,sans-serif;--serif:"Fraunces",var(--font)}
.lang-menu .lang-opt[lang]{font-family:var(--font)}
/* 한국어는 낱말 가운데서 줄을 바꾸지 않는다('서비스입|니다' · '병|원' — #220 화면 검토 10-18). 넘칠 때만 끊는다(break-word) —
   anywhere 는 flex 칸의 최소 폭까지 줄여 동의 칸 링크가 '개인정|보' 로 끊겼다(375 · 47px · #220 재검토) */
html[lang="ko"] body{word-break:keep-all;overflow-wrap:break-word}
/* 묶음 카드 안 꼬리표는 줄바꿈 — .tag 기본값(nowrap)이라 한의원 꼬리표가 카드를 넓혀 옆 카드를 덮었다(#211 재검토 · 리프팅 375 en +48 · ru +124 · mn +97px · 글 겹침 9) */
.pc-card .tag{white-space:normal;max-width:100%}
/* 휴대폰 비교 머리 72px 그림의 캡션은 한 줄 말줄임(ru 캡션이 잘림 — #211 재검토) */
/* 72px 칸에서는 캡션이 'Listing im…' 처럼 한 낱말로 잘려 뜻이 없다 — 숨긴다(카테고리 머리와 같음 · #211 검토 의견) */
@media (max-width:860px){.v4-cmp-head .prod-img figcaption{display:none}}
/* 휴대폰 카테고리(v4): 머리 그림은 72px(비교 화면과 같음) — 칩 줄이 첫 화면에 들게(#214 재검토) */
@media (max-width:640px){
  body:has(.v4-cat) .ch-in{grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:start}
  body:has(.v4-cat) .ch-in .ph{display:flex;width:72px;aspect-ratio:1}
  body:has(.v4-cat) .ch-in .ph figcaption{display:none}
  body:has(.v4-cat) .ch-in .v3-chips{grid-column:1/-1}
}
/* 묶음 카드: 이름 · 가격 줄이 같은 줄의 카드끼리 높이가 10 ~ 33px 달랐다 — 위에서부터 채운다(#211 검토 의견) */
.pc-card a{align-content:start}
/* 휴대폰 카테고리: 칩 띠 바로 아래 '많이 비교된' 제목의 위 여백(56px)을 줄임(#211 검토 의견) */
@media (max-width:860px){.v4-cat .v4-chipbar+.sec-head{margin-top:12px}}
/* 한국어 화면 맨 위 안내(D-103) */
.ko-notice{background:var(--soft);border-bottom:1px solid var(--line)}
.ko-notice p{margin:0 auto;padding-block:10px;font-size:14px;color:var(--ink)}
