:root {
  --navy: #14274e;
  --navy-2: #1d3566;
  --blue: #1f5fd6;
  --blue-soft: #e9f0fc;
  --ink: #1f2937;
  --muted: #475569;
  --link: #1d4ed8;
  --line: #dde3ee;
  --soft: #f5f7fb;
  --white: #ffffff;
  --high: #1f5fd6;
  --mid: #4b6a9b;
  --low: #4b5563;
  --radius: 12px;
  --font: "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", system-ui, -apple-system, sans-serif;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--white);
  color: var(--ink);
  font-family: var(--font);
  font-size: 17px;
  line-height: 1.6;
  word-break: keep-all;
}
a { color: var(--link); }
.wrap { width: 100%; max-width: 1160px; margin: 0 auto; padding: 0 16px; }
.mono { font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; letter-spacing: .02em; }
.muted { color: var(--muted); }
.small { font-size: 15px; line-height: 1.6; }

/* header */
.site-header { background: var(--navy); color: var(--white); }
.header-inner { display: flex; align-items: center; min-height: 60px; }
.logo { display: inline-flex; align-items: center; gap: 10px; color: var(--white); text-decoration: none; font-weight: 700; font-size: 18px; }
.logo-mark { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: var(--blue); }

/* hero & search */
.hero { padding: 28px 0 8px; }
.hero h1 { font-size: 24px; line-height: 1.4; margin: 0 0 10px; color: var(--navy); letter-spacing: -0.02em; }
.lead { margin: 0 0 20px; color: var(--muted); font-size: 16px; }
.br-md { display: none; }

.search {
  display: grid; grid-template-columns: 1fr; gap: 12px;
  padding: 16px; background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius);
}
.field label { display: block; font-size: 14px; font-weight: 600; color: var(--navy); margin-bottom: 4px; }
.opt { font-weight: 400; color: var(--muted); }
select, input[type="search"] {
  width: 100%; min-height: 48px; padding: 10px 12px; font: inherit; font-size: 16px;
  color: var(--ink); background: var(--white); border: 1px solid #c3cbdb; border-radius: 8px;
}
select:disabled { background: #eef1f6; color: var(--muted); }
select:focus, input:focus, .btn:focus-visible, a:focus-visible { outline: 3px solid rgba(31, 95, 214, .35); outline-offset: 1px; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 18px;
  font: inherit; font-size: 16px; font-weight: 600; border-radius: 8px; border: 1px solid transparent;
  text-decoration: none; cursor: pointer;
}
.btn-primary { background: var(--blue); color: var(--white); }
.btn-primary:hover { background: #184fb5; }
.btn-outline { background: var(--white); color: var(--navy); border-color: #b9c4d8; }
.btn-outline:hover:not([disabled]) { border-color: var(--navy); }
.btn[disabled] { color: #5b6475; background: #f2f4f8; border-color: var(--line); cursor: not-allowed; }
.btn-small { min-height: 40px; padding: 0 14px; font-size: 15px; }
.btn-search { width: 100%; }

.stats { list-style: none; padding: 0; margin: 16px 0 4px; display: grid; grid-template-columns: 1fr; gap: 8px; }
.stats li { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 10px; }
.stat-label { color: var(--muted); font-size: 15px; }
.stats strong { color: var(--navy); font-size: 18px; }
.stats-note { margin: 4px 0 0; font-size: 14px; color: var(--muted); }

/* results */
.results { padding: 24px 0 8px; }
.results-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.results-head h2 { margin: 0; font-size: 20px; color: var(--navy); }
.count { display: inline-block; margin-left: 6px; padding: 2px 10px; border-radius: 999px; background: var(--blue-soft); color: var(--blue); font-size: 16px; }
.sort-form { display: flex; align-items: center; gap: 8px; }
.sort-form label { font-size: 15px; color: var(--muted); white-space: nowrap; }
.sort-form select { min-height: 42px; width: auto; }
.mix-note { margin: 8px 0 14px; font-size: 15px; color: var(--muted); }

.cards { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr; gap: 14px; }
.card { display: flex; flex-direction: column; gap: 12px; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); }
.card-name { margin: 0; font-size: 19px; line-height: 1.35; }
.card-name a { color: var(--ink); text-decoration: none; }
.card-name a:hover { color: var(--blue); text-decoration: underline; }
.card-region { margin: 2px 0 0; color: var(--muted); font-size: 15px; }

.index-box { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding: 12px 14px; background: var(--soft); border-radius: 10px; }
.index-label { width: 100%; font-size: 14px; font-weight: 600; color: var(--navy-2); }
.index-value { font-size: 34px; font-weight: 800; line-height: 1.1; color: var(--navy); letter-spacing: -0.02em; }
.index-value small { font-size: 17px; font-weight: 600; margin-left: 2px; }
.index-none { font-size: 20px; color: var(--muted); font-weight: 700; }

.band { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 14px; font-weight: 600; border: 1px solid currentColor; }
.band-high { color: var(--high); }
.band-mid { color: var(--mid); }
.band-low { color: var(--low); }

.score-table { width: 100%; border-collapse: collapse; font-size: 16px; }
.score-table th { text-align: left; font-weight: 500; color: var(--muted); padding: 5px 0; }
.score-table td { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; padding: 5px 0; }
.score-table tr + tr { border-top: 1px dashed var(--line); }
.grade { display: inline-block; min-width: 28px; padding: 0 8px; border-radius: 6px; background: var(--navy); color: var(--white); text-align: center; }

.card-meta { margin: 0; font-size: 15px; color: var(--muted); }
.tag { display: inline-block; padding: 1px 8px; margin-right: 4px; border-radius: 6px; font-size: 14px; font-weight: 600; }
.tag-regular { background: var(--blue-soft); color: var(--blue); }
.tag-adhoc { background: #eef0f4; color: #374151; }
.card-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: auto; }

.empty { padding: 28px 18px; text-align: center; background: var(--soft); border: 1px dashed #c3cbdb; border-radius: var(--radius); }
.empty p { margin: 4px 0; }

.pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 22px 0 4px; }
.pager a, .pager span { display: inline-grid; place-items: center; min-width: 44px; min-height: 44px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--line); text-decoration: none; color: var(--navy); }
.pager .cur { background: var(--navy); color: var(--white); border-color: var(--navy); font-weight: 700; }
.pager .off { color: #64748b; }
.pager .gap { border: 0; min-width: 20px; }
.pager-info { text-align: center; font-size: 15px; color: var(--muted); margin: 4px 0 0; }
.band-note { margin: 22px 0 0; padding: 12px 14px; font-size: 15px; color: var(--muted); background: var(--soft); border-radius: 10px; }

/* detail */
.back { margin: 16px 0 0; }
.back a { text-decoration: none; font-weight: 600; }
.detail-head h1 { margin: 8px 0 2px; font-size: 26px; color: var(--navy); line-height: 1.35; overflow-wrap: anywhere; }
.detail-region { margin: 0 0 14px; color: var(--muted); }
.panel { margin: 0 0 16px; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); }
.panel h2 { margin: 0 0 12px; font-size: 19px; color: var(--navy); }
.panel h2 .sub { display: block; margin-top: 4px; font-size: 15px; line-height: 1.5; font-weight: 500; color: var(--muted); }
.info { margin: 0; display: grid; grid-template-columns: 1fr; }
.info > div { display: grid; grid-template-columns: 96px 1fr; gap: 10px; padding: 8px 0; border-top: 1px solid var(--line); }
.info > div:first-child { border-top: 0; }
.info dt { color: var(--muted); font-size: 16px; }
.info small, .hist small, .panel p small { font-size: 15px; }
.info dd { margin: 0; }
.detail-actions { margin-top: 12px; }
.detail-actions .btn { width: 100%; }

.dual { display: grid; grid-template-columns: 1fr; gap: 10px; }
.dual-box { display: flex; flex-direction: column; gap: 4px; padding: 14px; border-radius: 10px; }
.dual-box.official { border: 2px solid var(--navy); }
.dual-box.custom { background: var(--soft); }
.dual-label { font-size: 15px; font-weight: 600; color: var(--navy-2); }
.dual-label small { font-weight: 400; color: var(--muted); font-size: 14px; }
.dual-value { font-size: 34px; font-weight: 800; color: var(--navy); line-height: 1.15; }
.dual-value small { font-size: 17px; }
.dual-sub { font-size: 15px; color: var(--muted); }
.dual-box .band { align-self: flex-start; }

.bars-title { margin: 20px 0 8px; font-size: 17px; color: var(--navy); }
.bars-title small { font-weight: 400; color: var(--muted); font-size: 14px; }
.bars { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.bars li { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "label value" "track track"; gap: 4px 10px; align-items: center; }
.bar-label { grid-area: label; font-size: 16px; }
.bar-value { grid-area: value; font-weight: 700; font-variant-numeric: tabular-nums; }
.bar-track { grid-area: track; display: block; height: 12px; border-radius: 999px; background: #e8ecf3; overflow: hidden; }
.bar-fill { display: block; height: 100%; background: var(--blue); border-radius: 999px; }
.bar-fill.alt { background: var(--mid); }
.source { margin: 14px 0 0; font-size: 15px; line-height: 1.6; color: var(--muted); }

.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--line); border-radius: 10px; }
.history { width: 100%; min-width: 980px; border-collapse: collapse; font-size: 14px; }
.history th, .history td { padding: 9px 10px; text-align: right; white-space: nowrap; border-bottom: 1px solid var(--line); font-variant-numeric: tabular-nums; }
.history th:first-child, .history td:first-child, .history th:nth-last-child(2), .history td:nth-last-child(2) { text-align: left; }
.history thead th { background: var(--soft); color: var(--navy); font-weight: 600; }
.history tr.is-latest td { background: #f3f7ff; }
.history tbody tr:last-child td { border-bottom: 0; }
.empty-page { margin-top: 24px; }

/* footer */
.site-footer { margin-top: 36px; padding: 28px 0 36px; background: var(--soft); border-top: 1px solid var(--line); font-size: 14px; line-height: 1.6; color: var(--muted); }
.notice { margin: 0; display: grid; gap: 14px; }
.notice dt { font-weight: 700; font-size: 15px; color: var(--navy); }
.notice dd { margin: 2px 0 0; color: #334155; }
.footer-mail { font-weight: 600; overflow-wrap: anywhere; }
.footer-links { display: flex; flex-wrap: wrap; gap: 4px 20px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.footer-links a { display: inline-flex; align-items: center; min-height: 44px; font-size: 15px; font-weight: 600; text-underline-offset: 3px; }
.contact-mail { margin: 0 0 6px; font-size: 18px; font-weight: 700; overflow-wrap: anywhere; }

@media (min-width: 640px) {
  .hero h1 { font-size: 30px; }
  .stats { grid-template-columns: repeat(3, 1fr); }
  .stats li { flex-direction: column; align-items: flex-start; gap: 2px; }
  .dual { grid-template-columns: 1fr 1fr; }
  .info > div { grid-template-columns: 120px 1fr; }
  .detail-actions .btn { width: auto; }
}

@media (min-width: 900px) {
  .hero { padding-top: 40px; }
  .hero h1 { font-size: 34px; }
  .br-md { display: inline; }
  .search { grid-template-columns: 1fr 1fr 1.4fr auto; align-items: end; padding: 18px; }
  .btn-search { width: auto; min-width: 128px; }
  .cards { grid-template-columns: 1fr 1fr; }
  .cards.cards-single { grid-template-columns: 1fr; }
}

/* ===================== v2: 지도·상세 개선 ===================== */
.results-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.view-toggle { display: inline-flex; border: 1px solid #b9c4d8; border-radius: 10px; overflow: hidden; }
.view-toggle a { display: inline-flex; align-items: center; min-height: 42px; padding: 0 16px; font-weight: 600;
  font-size: 15px; color: var(--navy); text-decoration: none; background: var(--white); }
.view-toggle a + a { border-left: 1px solid #b9c4d8; }
.view-toggle a.on { background: var(--navy); color: var(--white); }

.card-addr { margin: 4px 0 0; font-size: 15px; color: var(--muted); }
.tel-num { font-weight: 500; font-size: 15px; margin-left: 4px; }
.btn-ghost { background: var(--blue-soft); color: var(--blue); border-color: transparent; grid-column: 1 / -1; }
.btn-ghost[disabled] { background: #f2f4f8; }
.card.is-selected { border-color: var(--blue); box-shadow: 0 0 0 2px var(--blue) inset; }

/* 지도 보기 레이아웃 (모바일 기본: 지도 중심, 목록 숨김) */
.map-layout { display: grid; grid-template-columns: 1fr; gap: 16px; }
.view-map .map-list { display: none; }
.map-scope { margin: 0 0 10px; font-size: 15px; color: var(--muted); }
.map-pane { display: flex; flex-direction: column; gap: 10px; }
.map-canvas { width: 100%; height: 58vh; min-height: 320px; border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--soft); overflow: hidden; position: relative; }
.map-detail { height: 320px; min-height: 260px; }
.map-status { margin: 0; font-size: 15px; color: var(--muted); }
.map-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; height: 100%;
  min-height: 160px; padding: 20px; text-align: center; font-weight: 600; color: var(--navy); background: var(--soft);
  border: 1px dashed #c3cbdb; border-radius: var(--radius); }
.map-canvas .map-empty { border: 0; border-radius: 0; }
.map-empty small { font-weight: 400; color: var(--muted); font-size: 15px; }
.back-to-list { width: 100%; }
.map-selected { border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; background: var(--white); }
.sel-name { margin: 0; font-size: 18px; font-weight: 700; color: var(--navy); }
.sel-region { margin: 2px 0 10px; font-size: 15px; color: var(--muted); }
.sel-scores { margin: 0 0 12px; display: grid; gap: 6px; }
.sel-scores > div { display: flex; justify-content: space-between; gap: 10px; border-top: 1px dashed var(--line); padding-top: 6px; }
.sel-scores dt { color: var(--muted); font-size: 15px; }
.sel-scores dt small { font-size: 14px; }
.sel-scores dd { margin: 0; font-weight: 700; }
.sel-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sel-list { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; }
.sel-list button { width: 100%; min-height: 44px; text-align: left; padding: 0 12px; font: inherit; border: 1px solid var(--line);
  border-radius: 8px; background: var(--white); cursor: pointer; }

/* 지도 마커 (HTML 아이콘) */
.mk { display: grid; place-items: center; min-width: 32px; height: 32px; padding: 0 8px; border-radius: 999px;
  font-size: 13px; font-weight: 700; color: var(--white); background: var(--navy); border: 2px solid var(--white);
  box-shadow: 0 1px 4px rgba(20, 39, 78, .35); cursor: pointer; white-space: nowrap; }
.mk-on { background: var(--blue); transform: scale(1.18); }
.mk-cluster { min-width: 44px; height: 44px; background: #4b6a9b; }
.mk-cluster.on, .mk.cluster.on { background: var(--blue); }

/* 상세 페이지 */
.detail-head .detail-actions { margin: 4px 0 16px; }
.detail-grid { display: grid; grid-template-columns: 1fr; gap: 0; }
.location .loc-addr { margin: 0 0 10px; font-weight: 600; }
.loc-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 8px; }
.loc-links .btn { flex: 1 1 160px; }
.eval-title { margin-bottom: 2px !important; }
.eval-sub { margin: 0 0 14px; font-size: 15px; color: var(--muted); }
.dual-label small { display: inline; }
.info.staff > div { grid-template-columns: 120px 1fr; }

/* 평가 이력: 기본 5개 항목 + 펼쳐서 세부 점수 */
.hist { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
/* 좁은 화면: 평가일 / 평가 구분 / 등급·총점·비교지수 / '영역별 점수 보기' 버튼을 줄마다 나눠 겹치지 않게 */
.hist-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 12px; padding: 12px 14px; font-variant-numeric: tabular-nums; }
.hist-head { display: none; background: var(--soft); color: var(--navy); font-weight: 600; font-size: 15px; }
.hist-item + .hist-item, .hist-head + .hist-item { border-top: 1px solid var(--line); }
.hist-item > summary { cursor: pointer; list-style: none; }
.hist-item > summary::-webkit-details-marker { display: none; }
.hist-item > summary > .hist-date, .hist-item > summary > .hist-type, .hist-item > summary > .hist-more { grid-column: 1 / -1; }
.hist-item > summary > .hist-date { white-space: nowrap; }
.hist-item > summary > .hist-date::before { content: attr(data-label) ": "; color: var(--muted); }
.hist-item > summary > .hist-num { min-width: 0; overflow-wrap: anywhere; }
.hist-item > summary > .hist-num::before { content: attr(data-label); display: block; color: var(--muted); font-size: 14px; }
.hist-more { display: flex; align-items: center; justify-content: center; min-height: 48px; padding: 6px 12px; text-align: center;
  font-weight: 600; color: var(--link); background: var(--white); border: 1px solid #b9c4d8; border-radius: 8px; }
.hist-item > summary:hover .hist-more { border-color: var(--link); }
.hist-item > summary:focus-visible { outline: 3px solid var(--link); outline-offset: -3px; }
.hist-more-open, .hist-item[open] .hist-more-closed { display: none; }
.hist-item[open] .hist-more-open { display: inline; }
.hist-item.is-latest > summary { background: #f3f7ff; }
.hist-detail { margin: 0; padding: 4px 14px 14px; display: grid; grid-template-columns: 1fr; gap: 0; background: #fbfcfe; }
.hist-detail > div { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-top: 1px dashed var(--line); }
.hist-detail dt { color: var(--muted); font-size: 15px; }
.hist-detail dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }

@media (min-width: 860px) {
  .hist-row { grid-template-columns: 1.1fr 1.6fr .8fr .8fr .8fr 190px; align-items: center; }
  .hist-head { display: grid; }
  .hist-item > summary > .hist-date, .hist-item > summary > .hist-type, .hist-item > summary > .hist-more { grid-column: auto; }
  .hist-item > summary > .hist-date::before, .hist-item > summary > .hist-num::before { content: none; }
  .hist-more { min-height: 44px; white-space: nowrap; }
  .hist-detail { grid-template-columns: 1fr 1fr; column-gap: 24px; }
}

@media (min-width: 900px) {
  .view-map .map-list { display: block; max-height: 78vh; overflow-y: auto; padding-right: 6px; }
  .map-layout { grid-template-columns: minmax(340px, 1fr) 1.35fr; align-items: start; }
  .map-pane { position: sticky; top: 12px; }
  .map-canvas { height: 72vh; }
  .map-detail { height: 340px; }
  .back-to-list { display: none; }
  .detail-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .detail-grid > .panel { margin-bottom: 16px; }
  .detail-head .detail-actions .btn { width: auto; }
}

/* hidden 속성이 display 규칙에 덮이지 않도록 */
[hidden] { display: none !important; }
/* 지도 영역 밖(주소 없음 등)의 안내 박스는 고정 높이 */
.location > .map-empty { height: auto; min-height: 180px; }

/* ── 상단 메뉴 ── */
.header-inner { justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.site-nav { display: flex; gap: 4px; }
.site-nav a { color: #d6def0; text-decoration: none; font-size: 15px; padding: 8px 10px; border-radius: 8px; }
.site-nav a:hover, .site-nav a[aria-current="page"] { color: var(--white); background: var(--navy-2); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ── 홈 비용 안내 연결(요양원·요양병원) ── */
.home-cost { margin: 24px 0 8px; }
.home-cost h2 { margin: 0 0 6px; font-size: 19px; color: var(--navy); }
.home-cost > p { margin: 0 0 14px; font-size: 15px; }
.home-cost-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 12px; }
.home-cost-cards li { display: flex; min-width: 0; }
.home-cost-card {
  display: flex; flex-direction: column; gap: 6px; width: 100%; min-height: 44px; padding: 16px 18px;
  border: 2px solid var(--blue); border-radius: var(--radius); text-decoration: none; color: var(--ink); background: var(--white);
  transition: background-color .15s ease;
}
.home-cost-title { color: var(--navy); font-size: 18px; font-weight: 700; line-height: 1.4; }
.home-cost-kind { align-self: flex-start; padding: 2px 10px; border-radius: 999px; background: var(--blue-soft); color: var(--navy);
  font-size: 14px; font-weight: 700; }
.home-cost-sum { color: #4a5366; font-size: 15px; line-height: 1.6; }
.home-cost-go { margin-top: auto; padding-top: 2px; color: var(--blue); font-size: 15px; font-weight: 600; }
.home-cost-card:hover { background: var(--blue-soft); }
.home-cost-card:hover .home-cost-go { text-decoration: underline; }
.home-cost a:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; border-radius: 6px; }
@media (min-width: 640px) { .home-cost-cards { grid-template-columns: 1fr 1fr; } }

/* ── Phase C-5: 방문요양 비용 안내 연결(메인·센터 상세) ── */
.home-vcost { margin: 24px 0 0; }
.home-vcost-card {
  display: flex; flex-direction: column; gap: 6px; width: 100%; min-height: 44px; padding: 16px 18px;
  border: 2px solid var(--navy); border-radius: var(--radius); text-decoration: none; color: var(--ink); background: var(--blue-soft);
}
.home-vcost-card:hover .home-cost-go { text-decoration: underline; }
.home-vcost a:focus-visible, .vcost-entry a:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; border-radius: 6px; }
.vcost-entry { margin: 12px 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; }
.vcost-entry a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.vcost-entry__desc { font-size: 14px; color: var(--muted); }

/* ── Phase C-5: 방문요양 한 달 비용 알아보기(/visiting-care/cost) ── */
.vc-page { padding-bottom: 24px; }
.vc-h1 { font-size: 24px; line-height: 1.4; margin: 6px 0 12px; color: var(--navy); letter-spacing: -0.02em; }
.vc-h2 { font-size: 19px; margin: 0 0 10px; color: var(--navy); }
.vc-h3 { font-size: 16px; margin: 16px 0 8px; color: var(--navy); }
.vc-small { font-size: 14px; color: var(--muted); }
.vc-help { font-size: 14px; color: var(--muted); margin: 4px 0 0; }
.vc-tag { display: inline-block; font-size: 13px; font-weight: 700; padding: 1px 8px; border-radius: 999px; background: var(--blue-soft); color: var(--navy); vertical-align: middle; }
.vc-hero { border: 2px solid var(--navy); border-radius: var(--radius); padding: 16px; margin: 0 0 16px; background: var(--white); }
.vc-hero__label { margin: 0; font-weight: 700; }
.vc-hero__amount { margin: 4px 0; font-size: clamp(28px, 8vw, 36px); font-weight: 800; line-height: 1.2; color: var(--navy); }
.vc-hero__exact { margin: 0; font-weight: 600; }
.vc-hero__cond { margin: 8px 0 0; font-size: 14px; color: var(--muted); }
.vc-hero__note { margin: 10px 0 0; background: #fff6e0; border-left: 4px solid #c98a00; padding: 6px 10px; border-radius: 4px; }
.vc-hero[data-vc-status="ineligible"] .vc-hero__amount, .vc-hero[data-vc-status="unsupported"] .vc-hero__amount,
.vc-hero[data-vc-status="invalid"] .vc-hero__amount { font-size: 22px; color: #a30000; }
.vc-limit { margin: 12px 0 0; }
.vc-limit__line { margin: 0 0 6px; }
.vc-bar { width: 100%; height: 14px; accent-color: var(--navy); }
.vc-notice { background: #fff6e0; border-left: 4px solid #c98a00; padding: 8px 12px; border-radius: 4px; margin: 10px 0; }
.vc-form { margin: 0 0 16px; padding: 16px; background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius); }
.vc-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
.vc-field { display: flex; flex-direction: column; min-width: 0; border: 0; padding: 0; margin: 0; }
.vc-field > label, .vc-field legend { font-weight: 600; font-size: 15px; margin-bottom: 4px; padding: 0; }
.vc-field select, .vc-field input[type="number"], .vc-field input[type="text"] { width: 100%; min-height: 44px; font: inherit; padding: 8px 10px; border: 1px solid #8a949e; border-radius: 8px; background: #fff; }
.vc-stepper { display: flex; gap: 6px; align-items: stretch; }
.vc-stepper input { flex: 1 1 auto; text-align: center; }
.vc-step { min-width: 44px; min-height: 44px; font-size: 20px; font-weight: 700; border: 1px solid var(--navy); border-radius: 8px; background: #fff; color: var(--navy); cursor: pointer; }
.vc-check { display: flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 400 !important; }
.vc-check input { width: 20px; height: 20px; margin: 0; flex: none; }
.vc-err { color: #a30000; font-size: 14px; font-weight: 600; margin: 4px 0 0; }
.vc-err:empty { display: none; }
.vc-page [aria-invalid="true"] { border-color: #a30000 !important; border-width: 2px !important; }
.vc-more { margin-top: 12px; }
.vc-more > summary { min-height: 44px; display: flex; align-items: center; font-weight: 600; cursor: pointer; color: var(--navy); }
.vc-section { margin: 0 0 16px; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); }
.vc-scroll { overflow-x: auto; }
.vc-table { width: 100%; border-collapse: collapse; margin: 6px 0 10px; font-size: 15px; }
.vc-table caption { text-align: left; font-weight: 600; padding: 4px 0; }
.vc-table th, .vc-table td { border-bottom: 1px solid var(--line); padding: 8px 6px; text-align: left; }
.vc-table td:last-child { text-align: right; white-space: nowrap; }
.vc-sel { background: var(--blue-soft); font-weight: 700; }
.vc-dl { margin: 0 0 10px; }
.vc-dl > div { display: grid; grid-template-columns: 1fr; padding: 6px 0; border-top: 1px solid var(--line); }
.vc-dl dt { font-weight: 600; color: var(--muted); font-size: 14px; }
.vc-dl dd { margin: 0; font-weight: 700; }
.vc-list { margin: 6px 0; padding-left: 20px; }
.vc-list li { margin: 4px 0; }
.vc-sources a { overflow-wrap: anywhere; }
.vc-tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.vc-page a:focus-visible, .vc-page button:focus-visible, .vc-page select:focus-visible, .vc-page input:focus-visible,
.vc-page summary:focus-visible, .vc-scroll:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }
@media (min-width: 720px) {
  .vc-grid { grid-template-columns: 1fr 1fr; }
  .vc-field--wide { grid-column: 1 / -1; }
  .vc-dl > div { grid-template-columns: 220px 1fr; }
}
@media print {
  .vc-form, .vc-tools, .svc-nav, .site-nav, .back { display: none !important; }
  .vc-section, .vc-hero { break-inside: avoid; }
}

/* ── 홈 FAQ 섹션 (검색보다 눈에 덜 띄게) ── */
.home-faq { margin: 32px 0 8px; padding-top: 24px; border-top: 1px solid var(--line); }
.home-faq h2 { margin: 0 0 6px; font-size: 19px; color: var(--navy); }
.home-faq > p { margin: 0 0 14px; font-size: 15px; }
.home-faq-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 12px; }
.home-faq-cards li { display: flex; }
.home-faq-card {
  display: flex; flex-direction: column; gap: 8px; width: 100%; min-height: 168px; padding: 18px 18px 16px;
  border: 1px solid var(--line); border-radius: var(--radius); text-decoration: none; color: var(--ink); background: var(--white);
  transition: background-color .15s ease, border-color .15s ease;
}
.home-faq-q { color: var(--navy); font-size: 17px; font-weight: 700; line-height: 1.45; letter-spacing: -0.01em; }
.home-faq-sum {
  color: #4a5366; font-size: 15px; line-height: 1.6;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.home-faq-go { margin-top: auto; padding-top: 4px; color: var(--blue); font-size: 15px; font-weight: 600; }
.home-faq-card:hover { background: var(--blue-soft); border-color: #9db8ea; }
.home-faq-card:hover .home-faq-go { text-decoration: underline; }
.home-faq-more { margin: 14px 0 0; font-weight: 600; }

/* FAQ 영역 키보드 초점 표시 */
.home-faq a:focus-visible, .faq-page a:focus-visible, .faq-page button:focus-visible,
.faq-page select:focus-visible, .faq-list summary:focus-visible, .faq-cats a:focus-visible,
.faq-bottom a:focus-visible, .center-faq a:focus-visible {
  outline: 3px solid var(--blue); outline-offset: 2px; border-radius: 6px;
}

/* ── FAQ 목록 (기존 정렬·너비 유지) ── */
.crumbs { margin: 18px 0 0; font-size: 15px; color: var(--muted); }
.crumbs a { color: var(--muted); }
.faq-hero { padding: 12px 0 4px; }
.faq-hero h1, .faq-article h1 { font-size: 24px; line-height: 1.4; margin: 6px 0 8px; color: var(--navy); letter-spacing: -0.02em; }
.faq-cats { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 18px; }
.faq-cats a { padding: 8px 14px; border: 1px solid var(--line); border-radius: 999px; text-decoration: none; color: var(--navy); font-size: 16px; }
.faq-cats a:hover { border-color: var(--blue); background: var(--blue-soft); }
.faq-cats a span { color: var(--muted); }
.faq-group { scroll-margin-top: 16px; }
.faq-group h2 { font-size: 19px; color: var(--navy); margin: 26px 0 12px; }
.faq-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.faq-item { border: 1px solid var(--line); border-radius: 10px; background: var(--white); }
.faq-item summary { cursor: pointer; padding: 16px 18px; list-style: none; display: flex; gap: 10px; font-size: 17px; font-weight: 700; line-height: 1.5; color: var(--ink); }
.faq-item summary:hover { background: var(--soft); border-radius: 10px; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item[open] summary { border-bottom: 1px solid var(--line); border-radius: 10px 10px 0 0; }
.faq-no { color: var(--blue); flex: none; }
.faq-a { padding: 14px 18px 18px; }
.faq-a p { margin: 0 0 12px; font-size: 16px; line-height: 1.7; color: #334155; }
.faq-a .btn { min-height: 40px; }
.faq-bottom { margin-top: 28px; }

/* ── FAQ 상세 (이 페이지에만 본문 폭 760px) ── */
.faq-page { max-width: 760px; margin: 0 auto; }
.faq-article { font-size: 16px; line-height: 1.75; }
.faq-cat { margin: 14px 0 0; color: var(--blue); font-weight: 600; font-size: 15px; }
.faq-article h2 { font-size: 19px; color: var(--navy); margin: 30px 0 10px; line-height: 1.4; }
.faq-article h3 { font-size: 16px; color: var(--navy-2); margin: 18px 0 6px; }
.faq-short { padding: 18px 20px; background: var(--blue-soft); border-radius: var(--radius); }
.faq-short h2 { margin: 0 0 6px; font-size: 16px; }
.faq-short p { margin: 0; font-size: 17px; line-height: 1.75; }
.faq-actions { margin-top: 18px; padding: 16px 20px; border: 1px solid var(--line); border-radius: var(--radius); }
.faq-actions h2 { margin: 0 0 8px; font-size: 17px; }
.faq-actions ol { margin: 0; padding: 0; list-style: none; counter-reset: act; }
.faq-actions li { counter-increment: act; position: relative; padding: 8px 0 8px 40px; border-top: 1px dashed var(--line); font-weight: 600; }
.faq-actions li:first-child { border-top: 0; }
.faq-actions li::before {
  content: counter(act); position: absolute; left: 0; top: 7px; width: 28px; height: 28px; border-radius: 50%;
  background: var(--navy); color: var(--white); font-size: 14px; display: grid; place-items: center;
}
.faq-ask { margin-top: 18px; padding: 16px 20px; background: var(--soft); border-left: 4px solid var(--blue); border-radius: 0 var(--radius) var(--radius) 0; }
.faq-ask h2 { margin: 0 0 4px; font-size: 17px; }
.faq-ask-lead { margin: 0 0 8px; font-size: 16px; color: var(--muted); }
.faq-ask ul { margin: 0; padding-left: 0; list-style: none; }
.faq-ask li { padding: 8px 0 8px 28px; position: relative; font-weight: 600; border-top: 1px solid var(--line); }
.faq-ask li:first-child { border-top: 0; }
.faq-ask li::before { content: "Q"; position: absolute; left: 4px; color: var(--blue); font-weight: 800; }
.faq-next h2 { margin-bottom: 8px; }
.faq-insight { margin-top: 26px; padding: 18px 20px; border: 1px solid var(--line); border-radius: var(--radius); }
.faq-insight > h2 { margin-top: 0; font-size: 18px; }
.insight-meta { margin: 0 0 6px; font-size: 15px; color: var(--muted); display: grid; gap: 4px; }
.insight-meta div { display: grid; grid-template-columns: 88px 1fr; gap: 8px; }
.insight-meta dt { font-weight: 600; color: var(--navy-2); }
.insight-meta dd { margin: 0; line-height: 1.6; }
.insight-note { font-size: 15px; color: var(--muted); margin-bottom: 0; }
.grade-dist { list-style: none; padding: 0; margin: 10px 0; display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 16px; }
.faq-body ul, .faq-body ol, .faq-checks ul, .faq-insight ul { padding-left: 22px; }
.faq-body li, .faq-checks li, .faq-insight li { margin: 4px 0; }
.table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.faq-table { width: 100%; border-collapse: collapse; margin: 10px 0; font-size: 15px; }
.faq-table caption { text-align: left; font-size: 15px; color: var(--muted); padding-bottom: 6px; }
.faq-table th, .faq-table td { border-bottom: 1px solid var(--line); padding: 8px 6px; text-align: left; }
.faq-table td:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.faq-table thead th { color: var(--muted); font-weight: 600; font-size: 15px; }
.table-note { font-size: 15px; color: var(--muted); margin-top: 0; }
.faq-checks { margin-top: 24px; padding: 14px 20px; background: var(--soft); border-radius: var(--radius); }
.faq-checks h2 { margin-top: 0; font-size: 17px; }
.faq-caution { margin: 18px 0 0; padding: 12px 14px; border-left: 4px solid var(--mid); background: var(--soft); font-size: 15px; line-height: 1.65; }
.faq-caution strong { display: block; color: var(--navy); }
.faq-cta { padding: 16px; border: 1px solid #c7d6f3; border-radius: var(--radius); background: var(--white); }
.faq-cta-title { margin: 0 0 10px; font-size: 15px; color: var(--ink); }
.faq-cta-fields { display: grid; grid-template-columns: 1fr; gap: 10px; }
.faq-cta .muted { margin: 10px 0 0; line-height: 1.6; }
/* 근거 자료: 본문보다 덜 강조 */
.faq-src h2 { font-size: 16px; color: var(--muted); }
.faq-sources { padding-left: 18px; font-size: 15px; line-height: 1.6; color: #334155; }
.faq-sources li { margin: 10px 0; }
.faq-sources small { display: block; font-size: 14px; }
.faq-src .small { font-size: 15px; }
.src-org { font-weight: 600; margin-right: 4px; }
.src-basis { color: var(--muted); }
.faq-related ul { padding-left: 20px; }
.faq-related li { margin: 12px 0; line-height: 1.55; }
.center-faq ul { padding-left: 20px; margin: 0; }
.center-faq li { margin: 12px 0; line-height: 1.55; }
.center-faq a, .faq-related a { font-weight: 600; text-underline-offset: 3px; }

@media (min-width: 720px) {
  .home-faq-cards { grid-template-columns: repeat(3, 1fr); }
  .faq-cta-fields { grid-template-columns: 1fr 1fr auto; align-items: end; }
}

/* ===================== 센터 비교 (최대 4곳) ===================== */
/* 검색 결과 카드의 '비교에 추가' 토글 */
.btn-compare { grid-column: 1 / -1; background: var(--white); color: var(--navy); border: 1px dashed #8fa3c7; }
.btn-compare:hover { border-style: solid; border-color: var(--navy); }
.btn-compare.is-on { background: var(--blue-soft); border: 2px solid var(--blue); color: var(--navy); }
.btn-compare[aria-disabled="true"] { color: #5b6475; background: #f2f4f8; border-color: var(--line); cursor: not-allowed; }

/* 하단 비교 바 (선택이 있을 때만 표시, 아이폰 하단 안전영역 고려) */
.cmp-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; background: var(--white);
  border-top: 2px solid var(--navy); box-shadow: 0 -4px 16px rgba(20, 39, 78, .12);
  padding: 10px 0 calc(10px + env(safe-area-inset-bottom, 0px)); }
.cmp-bar-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; }
.cmp-bar-info { min-width: 0; flex: 1 1 180px; }
.cmp-bar-count { margin: 0; font-size: 16px; color: var(--navy); }
.cmp-bar-count strong { font-size: 20px; }
.cmp-bar-names { display: none; margin: 0; font-size: 14px; color: var(--muted); overflow-wrap: anywhere; }
.cmp-bar-hint { margin: 0; font-size: 14px; color: var(--muted); }
.cmp-bar-hint:empty { display: none; }
.cmp-bar-hint.is-alert { color: #9a3412; font-weight: 700; }
.cmp-bar-actions { display: flex; gap: 8px; flex: 0 0 auto; }
.cmp-bar-actions .btn { min-height: 48px; }
.cmp-bar-actions [aria-disabled="true"] { background: #e5e9f0; color: #5b6475; pointer-events: auto; cursor: not-allowed; }
@media (min-width: 768px) { .cmp-bar-names { display: block; } }

/* 비교 화면 */
.cmp-page { padding-bottom: 8px; }
.cmp-title { margin: 8px 0 6px; font-size: 26px; line-height: 1.35; color: var(--navy); }
.cmp-title .count { font-size: 16px; vertical-align: middle; }
.cmp-lead { margin: 0 0 14px; font-size: 16px; color: var(--muted); }
.cmp-alert { margin: 0 0 14px; padding: 12px 14px; border: 1px solid #f0c48a; background: #fff8ee; border-radius: 10px; font-size: 15px; }
.cmp-alert p { margin: 2px 0; overflow-wrap: anywhere; }
.cmp-empty h2 { font-size: 19px; }
.cmp-notes:empty { display: none; }
.cmp-notes { margin: 0 0 14px; }
.cmp-note { margin: 0 0 8px; padding: 12px 14px; border-left: 4px solid var(--mid); background: var(--soft); font-size: 15px; line-height: 1.6; }
.cmp-pick { margin: 0 0 12px; padding: 14px; background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius); }
.cmp-pick-help { margin: 0 0 10px; font-size: 15px; color: var(--muted); }
.cmp-pick-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cmp-pick select { min-height: 48px; font-size: 16px; text-overflow: ellipsis; }
.cmp-pick label { font-size: 15px; }

.cmp-scroll { width: 100%; }
.cmp { width: 100%; border-collapse: collapse; }
.cmp th, .cmp td { text-align: left; vertical-align: top; overflow-wrap: anywhere; word-break: keep-all; }
.cmp-name { font-weight: 700; font-size: 17px; color: var(--navy); line-height: 1.4; }
.cmp-region { display: block; margin-top: 2px; font-size: 14px; color: var(--muted); }
.cmp-remove { margin-top: 6px; min-height: 40px; padding: 0 10px; font: inherit; font-size: 14px; color: var(--navy);
  background: var(--white); border: 1px solid #b9c4d8; border-radius: 8px; cursor: pointer; }
.cmp-label { display: block; font-weight: 700; color: var(--navy); }
.cmp-desc { display: block; margin-top: 2px; font-size: 14px; font-weight: 400; color: var(--muted); line-height: 1.5; }
.cmp-num { display: block; font-size: 19px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ink); }
.cmp-none { color: var(--muted); font-size: 15px; }
.cmp-sub { display: block; margin-top: 4px; font-size: 14px; color: var(--muted); }
.cmp-grade { font-size: 18px; padding: 2px 12px; }
.cmp-meter { display: block; height: 10px; margin-top: 6px; border-radius: 999px; background: #e8ecf3; overflow: hidden; }
.cmp-meter > span { display: block; height: 100%; background: var(--navy-2); border-radius: 999px; }
.cmp-addr { font-size: 15px; }
.cmp-tel { width: 100%; flex-direction: column; gap: 0; line-height: 1.3; padding: 6px 10px; }
.cmp-telnum { font-size: 15px; font-weight: 500; }
.cmp-link { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
.cmp-sec th { padding-top: 22px !important; font-size: 18px; color: var(--navy); border-bottom: 2px solid var(--navy); }
.cmp-sec small { font-size: 14px; font-weight: 400; color: var(--muted); }
.cmp-explain td { font-size: 14px; color: var(--muted); line-height: 1.6; }
/* 비교 화면 하단: 주요 버튼(새 비교) + 보조 버튼(돌아가기·링크 복사) */
.cmp-tools { display: flex; flex-direction: column; gap: 10px; margin: 24px 0 0; }
.cmp-new { width: 100%; min-height: 52px; font-size: 17px; }
.cmp-tools-sub { display: flex; flex-wrap: wrap; gap: 8px; }
.cmp-tools-sub .btn { flex: 1 1 150px; min-height: 48px; }
.cmp-tools-help { margin: 0; font-size: 14px; color: var(--muted); line-height: 1.6; }
@media (min-width: 768px) {
  .cmp-tools { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .cmp-new { width: auto; padding-left: 28px; padding-right: 28px; }
  .cmp-tools-sub .btn { flex: 0 0 auto; }
  .cmp-tools-help { flex-basis: 100%; }
}
.cmp-copy-status { margin: 0; align-self: center; font-size: 14px; overflow-wrap: anywhere; }

/* 평가영역 해설 (영역마다 한 번, 기본은 접힘) */
.cmp-help-btn { display: inline-flex; align-items: center; min-height: 40px; margin-top: 6px; padding: 0 10px; font: inherit;
  font-size: 14px; font-weight: 600; color: var(--link); background: var(--white); border: 1px solid #b9c4d8; border-radius: 8px; cursor: pointer; }
.cmp-help-btn::after { content: " ▾"; }
.cmp-help-btn.is-open::after { content: " ▴"; }
.cmp-help-box > summary { cursor: pointer; display: list-item; padding: 10px 0; font-size: 15px; font-weight: 600;
  color: var(--link); list-style-position: inside; }
.has-help-js .cmp-help-box > summary { display: none; }
.has-help-js .cmp tr.cmp-help td { padding-top: 0; padding-bottom: 0; }
.has-help-js .cmp tr.cmp-help { padding: 0; }
.cmp-help-box[open] .cmp-help-body { margin-top: 8px; }
.cmp-help-close { margin-top: 12px; min-height: 44px; }
.cmp-help-box > summary small { margin-left: 4px; font-size: 14px; font-weight: 400; color: var(--muted); }
.cmp-help-body { padding: 4px 14px 12px; margin-bottom: 4px; background: var(--soft); border-radius: 10px; font-size: 15px; line-height: 1.65; }
.cmp-help-body h4 { margin: 14px 0 4px; font-size: 16px; color: var(--navy); }
.cmp-help-body h4 small { font-size: 14px; font-weight: 400; color: var(--muted); }
.cmp-help-body p { margin: 4px 0; }
.cmp-help-body ul, .cmp-help-body ol { margin: 4px 0; padding-left: 26px; }
.cmp-help-body li { margin: 4px 0; }
.cmp-ind li::marker { font-weight: 700; color: var(--navy); }
.cmp-kind { display: inline-block; margin-right: 4px; padding: 0 8px; font-size: 14px; font-weight: 700; color: var(--white);
  background: var(--navy); border-radius: 6px; }
.cmp-kind-alt { color: var(--navy); background: var(--white); border: 1px solid var(--navy); }
.cmp-help-sub { margin-top: 8px !important; font-weight: 700; color: var(--navy); }
.cmp-help-sub small { font-weight: 400; color: var(--muted); font-size: 14px; }
.cmp-help-note { margin-top: 10px !important; padding: 8px 10px; border-left: 4px solid var(--mid); background: var(--white); font-size: 14px; }
.cmp-explain p { margin: 4px 0; }

/* 1023px 이하: 두 센터씩 2열 (항목명은 두 값 위에 한 번) */
@media (max-width: 1023.98px) {
  .cmp, .cmp thead, .cmp tbody { display: block; }
  .cmp tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 12px; row-gap: 6px;
    padding: 12px 0; border-top: 1px solid var(--line); }
  .cmp th, .cmp td { display: block; padding: 0; min-width: 0; }
  .cmp th[scope="row"], .cmp .cmp-sec th, .cmp .cmp-explain td, .cmp .cmp-help td { grid-column: 1 / -1; }
  .cmp tr.cmp-help { border-top: 0; padding-top: 0; }
  .cmp th[scope="row"] { font-size: 16px; font-weight: 700; color: var(--navy); }
  .cmp .cmp-corner { display: none; }
  .cmp .off { display: none; }
  .cmp thead tr { border-top: 0; padding-top: 4px; }
  .cmp thead th { padding: 10px; background: var(--soft); border-radius: 10px; }
  .cmp thead th[data-slot]::before { content: "센터 " attr(data-slot); display: inline-block; margin-bottom: 4px; padding: 0 8px;
    font-size: 14px; font-weight: 700; color: var(--white); background: var(--navy); border-radius: 6px; }
  .cmp .cmp-sec { border-top: 0; padding-bottom: 0; }
  .cmp .cmp-sec th { padding-top: 14px !important; padding-bottom: 6px; }
}

/* 작은 화면 전용: 스크롤을 따라오는 기관명 헤더 · 센터별 기본정보 카드 */
.cmp-sticky { position: fixed; top: 0; left: 0; right: 0; z-index: 40; background: var(--white);
  border-bottom: 2px solid var(--navy); box-shadow: 0 2px 10px rgba(20, 39, 78, .12);
  padding: 6px 0 6px; padding-top: calc(6px + env(safe-area-inset-top, 0px)); cursor: pointer; }
.cmp-sticky-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 12px; }
.cmp-sticky-name { margin: 0; min-width: 0; font-size: 15px; font-weight: 700; line-height: 1.35; color: var(--navy); }
.cmp-sticky-text { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.cmp-sticky.is-expanded .cmp-sticky-text { display: block; -webkit-line-clamp: unset; }
.cmp-slot { display: inline-block; margin-right: 4px; padding: 0 8px; font-size: 14px; font-weight: 700; line-height: 1.6;
  color: var(--white); background: var(--navy); border-radius: 6px; vertical-align: 1px; }
.cmp-slot:empty { display: none; }
.cmp-sticky .cmp-slot { margin-bottom: 2px; }
.cmp-cards { display: none; }
@media (max-width: 1023.98px) {
  .cmp tr.cmp-basic { display: none; }
  .cmp-cards { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; }
  .cmp-cards-title { margin: 14px 0 0; padding-bottom: 6px; font-size: 18px; color: var(--navy); border-bottom: 2px solid var(--navy); }
  .cmp-card { padding: 16px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); }
  .cmp-card.off { display: none; }
  .cmp-card-title { margin: 0 0 10px; font-size: 17px; line-height: 1.45; overflow-wrap: anywhere; }
  .cmp-card-title a { color: var(--navy); }
  .cmp-card-info > div { grid-template-columns: 96px minmax(0, 1fr); }
  .cmp-card-info dd { overflow-wrap: anywhere; }
  .cmp-card-tel { width: 100%; }
  .cmp-card-detail { width: 100%; margin-top: 12px; }
}
@media (max-width: 400px) {
  .cmp-card-info > div { grid-template-columns: 1fr; gap: 2px; }
  .cmp-card-info dt { font-size: 15px; }
}

/* 1024px 이상: 선택한 2~4곳을 열 단위 표로 */
@media (min-width: 1024px) {
  .cmp-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--line); border-radius: var(--radius); }
  .cmp { table-layout: fixed; min-width: 760px; }
  .cmp th, .cmp td { padding: 12px 14px; border-top: 1px solid var(--line); }
  .cmp thead th { position: sticky; top: 0; z-index: 1; background: var(--soft); border-top: 0; border-bottom: 2px solid var(--navy); }
  .cmp .cmp-corner { width: 210px; color: var(--muted); font-size: 15px; font-weight: 600; }
  .cmp th[scope="row"] { width: 210px; font-size: 16px; font-weight: 700; color: var(--navy); background: #fbfcfe; }
  .cmp .off { display: table-cell; }
  .cmp .cmp-sec th { background: var(--white); }
  .cmp .cmp-explain td { background: var(--white); }
  .cmp tr.cmp-help td { border-top: 0; padding-top: 0; background: var(--white); }
  .cmp-tel { width: auto; }
}

/* ---------------- Phase D-1: 검색 결과 화면·결과 카드 (공식 평가와 자체 지표를 나란히, 카드 높이 축소) ---------------- */
/* 검색 결과 화면에서는 소개·통계를 숨기고 검색 폼만 남겨 결과가 첫 화면 안에서 시작하게 한다(홈 화면은 그대로). */
.hero--result { padding: 12px 0 0; }
.hero--result h1 { font-size: 18px; margin: 0 0 8px; }
.hero--result .br-md { display: none; }
.hero--result .lead, .hero--result .stats, .hero--result .stats-note { display: none; }
@media (max-width: 899.98px) {
  /* 6칸 격자: 1줄 = 시도(3칸)·시군구(3칸), 2줄 = 기관명(4칸)·검색 버튼(2칸) */
  .hero--result .search { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; padding: 12px; }
  .hero--result .search > div:nth-of-type(1) { grid-column: 1 / 4; }
  .hero--result .search > div:nth-of-type(2) { grid-column: 4 / 7; }
  .hero--result .search > .field-wide { grid-column: 1 / 5; }
  .hero--result .btn-search { grid-column: 5 / 7; width: auto; align-self: end; padding: 0 8px; }
}
@media (min-width: 900px) {
  .hero--result { padding-top: 16px; }
  .hero--result h1 { font-size: 22px; }
}

/* 결과 카드 */
.card { gap: 10px; padding: 16px; }
.card-addr { margin-top: 2px; }
.eval-pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
.eval-official, .eval-pair .index-box { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px 12px; border-radius: 10px; }
/* 공식 평가: 흰 바탕 + 남색 2px 테두리(상세 화면의 공식 등급 상자와 같은 규칙) */
.eval-official { background: var(--white); border: 2px solid var(--navy); }
/* 자체 지표: 연한 바탕 + 점선 테두리 = '이 서비스가 계산한 값' */
.eval-pair .index-box { flex-wrap: nowrap; background: var(--soft); border: 1px dashed #8fa3c7; }
.eval-label, .eval-pair .index-label { font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--navy-2); }
.index-kind { display: inline-block; margin-left: 2px; padding: 0 6px; font-size: 13px; font-weight: 600; color: var(--muted);
  border: 1px dashed #8fa3c7; border-radius: 6px; white-space: nowrap; }
.eval-grade .grade { font-size: 28px; font-weight: 800; line-height: 1.35; padding: 0 12px; border-radius: 8px; }
.grade-none { display: inline-block; font-size: 17px; font-weight: 700; line-height: 1.4; color: var(--muted); }
.eval-sub { font-size: 14px; color: var(--muted); }
.eval-sub strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.eval-pair .index-value { font-size: 24px; }
.eval-pair .index-value small { font-size: 15px; }
.eval-pair .index-none { font-size: 18px; }
.eval-pair .band { font-size: 13px; padding: 0 8px; }
.eval-pair .score-table { margin-top: 2px; font-size: 14px; }
.eval-pair .score-table th, .eval-pair .score-table td { padding: 2px 0; }
.eval-pair .score-table th { padding-right: 6px; }
.eval-pair .score-table td { white-space: nowrap; }
@media (max-width: 359.98px) { .eval-pair { grid-template-columns: 1fr; } }
/* 전화번호가 '02- / 996- / 9900' 으로 꺾이지 않게: 좁은 화면에서는 '전화하기' 아래 한 줄로 */
.tel-num { white-space: nowrap; }
@media (max-width: 639.98px) {
  .card-actions .btn[data-phone] { flex-direction: column; gap: 0; line-height: 1.25; padding: 6px 10px; }
  .card-actions .btn[data-phone] .tel-num { margin-left: 0; }
}

/* ---------------- Phase D-2: 방문요양 상세 평가 요약 띠 ---------------- */
.eval-band { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; margin: 4px 0 12px; }
.eval-band__official, .eval-band__derived { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px 12px; border-radius: 10px; }
.eval-band__official { background: var(--white); border: 2px solid var(--navy); }
.eval-band__derived { background: var(--soft); border: 1px dashed #8fa3c7; }
.eval-band__main { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.eval-band .grade { font-size: 28px; font-weight: 800; line-height: 1.35; padding: 0 12px; border-radius: 8px; }
.eval-band__total { font-size: 15px; color: var(--muted); }
.eval-band__total strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.eval-band__value { font-size: 24px; font-weight: 800; line-height: 1.2; color: var(--navy); font-variant-numeric: tabular-nums; }
.eval-band__value small { font-size: 15px; font-weight: 600; margin-left: 2px; }
.eval-band__more { grid-column: 1 / -1; font-size: 15px; font-weight: 600; }
.eval-band__none { grid-column: 1 / -1; margin: 0; padding: 12px 14px; border: 1px dashed #b9c4d8; border-radius: 10px; background: var(--soft); color: var(--ink); }
@media (max-width: 359.98px) { .eval-band { grid-template-columns: 1fr; } }

/* ---------------- Phase D-3: 세 서비스 공통 헤더·Footer (HOMIE) ---------------- */
/* 좁은 화면: 1줄 서비스 메뉴 / 2줄 로고 / 3줄 고유 메뉴. 넓은 화면(900px~): 로고·서비스 메뉴·고유 메뉴 한 줄. */
.header-inner { flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 0 12px; min-height: 0; padding-top: 0; padding-bottom: 0; }
.header-inner > .svc-nav { order: -1; flex: 1 0 100%; border-bottom: 1px solid #24396a; }
.logo { gap: 8px; min-height: 44px; font-size: 17px; }
.logo-mark { width: 30px; height: 30px; border-radius: 8px; }
.logo-text { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 0 6px; }
.logo-brand { font-size: 19px; font-weight: 800; letter-spacing: .03em; }
.logo-dot { color: #9db8ea; }
.logo-svc { font-weight: 600; color: #d6def0; }
.site-nav { flex-wrap: wrap; }
.site-nav a { display: inline-flex; align-items: center; min-height: 44px; }
@media (min-width: 900px) {
  .header-inner { flex-wrap: nowrap; gap: 16px; min-height: 64px; padding-bottom: 0; }
  .header-inner > .svc-nav { order: 0; flex: 0 1 auto; border-bottom: 0; }
  .site-nav { margin-left: auto; }
}
.site-footer { padding: 24px 0 16px; }
.footer-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.footer-brand p { margin: 2px 0; }
.footer-logo { font-size: 18px; font-weight: 800; letter-spacing: .03em; color: var(--navy); }
.footer-tagline { font-weight: 600; color: var(--ink); }
.footer-op { color: var(--ink); }
.footer-copy { margin: 4px 0 0; font-size: 13px; color: var(--muted); }
@media (min-width: 900px) { .footer-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 2.4fr); gap: 32px; } }

/* ---------------- Phase H-5: 세 서비스 공통 서비스 메뉴(방문요양·요양원·요양병원) ---------------- */
.svc-nav { background: transparent; }
.svc-nav__list { list-style: none; margin: 0; padding: 2px 0; display: flex; flex-wrap: wrap; gap: 4px; }
.svc-nav__list li { margin: 0; }
.svc-nav__list a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: 8px; font-size: 15px;
  font-weight: 600; color: #d6def0; text-decoration: none; white-space: nowrap; }
.svc-nav__list a:hover { background: var(--navy-2); color: #ffffff; }
.svc-nav__list a[aria-current="true"] { background: var(--navy-2); color: #ffffff; text-decoration: underline; text-decoration-thickness: 2px;
  text-underline-offset: 5px; }
.svc-nav__list a:focus-visible { outline: 3px solid #ffd166; outline-offset: 2px; }
@media print { .svc-nav { display: none !important; } }