/* ===== 전국 법원 찾기 ===== */
/* 모바일 우선 · 고령자 포함 전 국민 UX: 큰 글씨, 고대비, 큰 터치 영역 */
/* 테마: 차분한 네이비 + 버건디 포인트 */

:root {
  --c-primary: #1f3a63;       /* 네이비 */
  --c-primary-dark: #142a49;
  --c-accent: #7a1f2b;        /* 버건디 (강조·경고성 링크) */
  --c-bg: #f5f6f8;
  --c-card: #ffffff;
  --c-text: #111417;
  --c-text-sub: #40474f;
  --c-line: #d4d9e0;
  --c-green: #1a7f37;
  --c-blue: #0b5cad;
  --c-sky: #1f7fbf;
  --c-purple: #6f42c1;
  --c-orange: #b54a00;
  --c-red: #b02a37;
  --c-call: #1a7f37;
  --fs-base: 18px;
  --fs-name: 23px;
  --fs-tab: 21px;
}

/* 글자 크게 모드 (JS로 body에 부여) */
body.font-lg {
  --fs-base: 21px;
  --fs-name: 26px;
  --fs-tab: 23px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--c-bg);
  color: var(--c-text);
  font-family: -apple-system, BlinkMacSystemFont, "Malgun Gothic", "맑은 고딕",
    "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;
  font-size: var(--fs-base);
  line-height: 1.55;
  -webkit-text-size-adjust: 100%;
  /* 더블탭 확대가 버튼 탭을 삼키지 않도록 (핀치 확대는 그대로 가능) */
  touch-action: manipulation;
}

/* 데스크톱 전용 커스텀 커서: 법봉(gavel) 실루엣 — 점잖은 단색 */
@media (pointer: fine) {
  body {
    cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'><g fill='%232e3a4d'><rect x='16.5' y='4' width='7' height='14' rx='3' transform='rotate(-45 20 11)'/><rect x='11.3' y='11' width='3.4' height='16' rx='1.7' transform='rotate(45 13 19)'/><rect x='4' y='27' width='15' height='3.2' rx='1.4'/></g></svg>") 6 6, auto;
  }
  a, button, [role="button"], select, input, .map-sido, .sub-sgg { cursor: pointer; }
  input[type="search"], input[type="text"] { cursor: text; }
}

button {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

a { color: var(--c-primary); }

.wrap {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 12px 40px;
}

/* ===== 헤더 ===== */
header.site-head {
  background: var(--c-primary);
  color: #fff;
  padding: 14px 12px 12px;
}
.site-head .head-inner {
  max-width: 760px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.site-title {
  font-size: 20px;
  font-weight: 800;
  margin: 0;
  letter-spacing: -0.5px;
  white-space: nowrap;
}
body.font-lg .site-title { font-size: 22px; }
.site-title a { color:#fff; text-decoration: none; }
.brand-year {
  display: inline-block;
  font-size: 0.72em;
  background: #fff;
  color: var(--c-primary-dark);
  padding: 1px 7px 0;
  border-radius: 8px;
  vertical-align: 2px;
}
@media (min-width: 700px) {
  .site-title { font-size: 24px; }
  body.font-lg .site-title { font-size: 26px; }
}

/* 글자 크기 토글 */
.font-toggle {
  display: flex;
  gap: 6px;
}
.font-toggle button {
  min-width: 52px;
  min-height: 44px;
  border: 2px solid #ffffff;
  background: transparent;
  color: #fff;
  border-radius: 10px;
  font-weight: 700;
  font-size: 17px;
}
.font-toggle button[aria-pressed="true"] {
  background: #fff;
  color: var(--c-primary);
}
.font-toggle .btn-big { font-size: 21px; }

/* ===== 서비스 탭 (단일 서비스라 현재 미사용, 확장 대비 유지) ===== */
nav.service-tabs {
  display: flex;
  background: var(--c-primary);
  padding: 0 12px;
}
nav.service-tabs .tabs-inner {
  max-width: 760px;
  margin: 0 auto;
  width: 100%;
  display: flex;
  gap: 8px;
}
.service-tab {
  flex: 1;
  min-height: 60px;
  font-size: var(--fs-tab);
  font-weight: 800;
  border: none;
  border-radius: 14px 14px 0 0;
  background: var(--c-primary-dark);
  color: #dbe6f5;
}
.service-tab[aria-selected="true"] {
  background: var(--c-bg);
  color: var(--c-primary-dark);
}

/* ===== 하위 탭 (찾기 / 이용 안내) ===== */
nav.sub-tabs { display: flex; margin: 14px 0 4px; }
nav.sub-tabs .tabs-inner {
  width: 100%;
  display: flex;
  gap: 8px;
}
.sub-tab {
  flex: 1;
  min-height: 52px;
  font-size: 19px;
  font-weight: 700;
  border: 2px solid var(--c-primary);
  border-radius: 12px;
  background: #fff;
  color: var(--c-primary-dark);
}
.sub-tab[aria-selected="true"] {
  background: var(--c-primary);
  color: #fff;
}
body.font-lg .sub-tab { font-size: 21px; }

/* ===== 오늘 날짜 ===== */
.today-line {
  text-align: center;
  font-size: 17px;
  font-weight: 600;
  color: var(--c-text-sub);
  margin: 12px 0 0;
}
body.font-lg .today-line { font-size: 19px; }

/* ===== 안내 문구 ===== */
.intro-line {
  text-align: center;
  font-size: var(--fs-base);
  font-weight: 600;
  color: var(--c-text);
  background: #fff8e6;
  border: 1px solid #f0dfae;
  border-radius: 12px;
  padding: 10px 14px;
  margin: 8px 0 10px;
}

/* ===== 검색 ===== */
.search-box { position: relative; margin: 0 0 10px; }
.search-box input {
  width: 100%;
  min-height: 58px;
  font-size: 20px;
  padding: 8px 52px 8px 16px;
  border: 2px solid var(--c-primary);
  border-radius: 14px;
  background: #fff;
}
body.font-lg .search-box input { font-size: 22px; }
.search-box input:focus { outline: 3px solid #9dbdea; }
.search-box .search-icon {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 24px;
  pointer-events: none;
}
.suggest-list {
  position: absolute;
  z-index: 30;
  left: 0; right: 0;
  top: calc(100% + 4px);
  background: #fff;
  border: 2px solid var(--c-primary);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}
.suggest-list button {
  display: block;
  width: 100%;
  text-align: left;
  padding: 13px 16px;
  min-height: 50px;
  border: none;
  border-bottom: 1px solid var(--c-line);
  background: #fff;
  font-size: 19px;
}
.suggest-list button:last-child { border-bottom: none; }
.suggest-list button:hover, .suggest-list button:focus { background: #e8f0fc; }
.suggest-list .sug-type {
  font-size: 15px;
  color: var(--c-text-sub);
  margin-left: 8px;
}

/* ===== 내 주변 법원 버튼 (좌표 채워지면 활성화) ===== */
.near-btn {
  width: 100%;
  min-height: 56px;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  background: var(--c-green);
  border: none;
  border-radius: 14px;
  margin-top: 12px;
}
.near-btn:active { background: #14602a; }

/* ===== 지도 ===== */
.map-area {
  background: var(--c-card);
  border: 1px solid var(--c-line);
  border-radius: 16px;
  padding: 8px;
  transition: max-height .35s ease;
  overflow: hidden;
}
.map-area svg {
  display: block;
  width: 100%;
  height: auto;
}
.map-sido {
  fill: #cfe0f5;
  stroke: #fff;
  stroke-width: 1.5;
  transition: fill .15s;
}
.map-sido:hover, .map-sido:focus, .map-sido.hl {
  fill: #6ea3e6;
  outline: none;
}
.map-sido.selected { fill: var(--c-primary); }
.map-label {
  cursor: pointer;
  font-weight: 800;
  fill: #14243c;
}
.map-label .cnt { font-weight: 600; fill: #33445e; }

/* 축소 상태(목록 표시 중) */
.map-area.mini { padding: 4px; }
.map-area.mini svg { max-height: 210px; }
.map-area.mini .map-sido { fill: #e3eaf3; }
.map-area.mini .map-sido.selected { fill: var(--c-primary); }
.map-area.mini .map-label { display: none; }

/* ===== 시·군·구 지도 (시·도 선택 후) ===== */
.map-area.submap { padding: 6px; }
.map-area.submap svg {
  display: block;
  width: 100%;
  height: auto;
  max-height: 340px;
  margin: 0 auto;
}
.sub-sgg {
  fill: #cfe0f5;
  stroke: #fff;
  stroke-width: 1.5;
  transition: fill .15s;
}
.sub-sgg:hover, .sub-sgg:focus { fill: #6ea3e6; outline: none; }
.sub-sgg.selected { fill: var(--c-primary); }
.sub-sgg.empty { fill: #e8eaee; }
.sub-label {
  cursor: pointer;
  font-weight: 700;
  fill: #14243c;
}
.sub-label.empty { fill: #8a919a; pointer-events: none; }

/* ===== 시·도 큰 버튼 목록 ===== */
.sido-btns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 12px;
}
.sido-btns button {
  min-height: 58px;
  font-size: 19px;
  font-weight: 700;
  background: #fff;
  border: 2px solid var(--c-primary);
  color: var(--c-primary-dark);
  border-radius: 12px;
  line-height: 1.25;
}
.sido-btns button small {
  display: block;
  font-size: 15px;
  font-weight: 600;
  color: var(--c-text-sub);
}
.sido-btns button:active { background: #e8f0fc; }

/* ===== 목록 화면 ===== */
.list-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 14px 0 10px;
}
.back-btn {
  min-height: 52px;
  padding: 0 18px;
  font-size: 19px;
  font-weight: 700;
  background: #fff;
  color: var(--c-primary-dark);
  border: 2px solid var(--c-primary);
  border-radius: 12px;
}
.list-title {
  font-size: 21px;
  font-weight: 800;
  margin: 0;
}
body.font-lg .list-title { font-size: 23px; }

/* 종별 탭 */
.kind-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 4px 0 8px;
  -webkit-overflow-scrolling: touch;
}
.kind-tabs button {
  flex: 0 0 auto;
  min-height: 54px;
  padding: 0 18px;
  font-size: 19px;
  font-weight: 700;
  border: 2px solid var(--c-primary);
  background: #fff;
  color: var(--c-primary-dark);
  border-radius: 27px;
  white-space: nowrap;
}
.kind-tabs button[aria-selected="true"] {
  background: var(--c-primary);
  color: #fff;
}

/* 시·군·구 / 진료과목 필터 칩 */
.chip-row {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 0 8px;
  -webkit-overflow-scrolling: touch;
}
.chip-row-label {
  font-size: 16px;
  font-weight: 700;
  color: var(--c-text-sub);
  margin: 4px 0 2px;
}
.chip-row button {
  flex: 0 0 auto;
  min-height: 46px;
  padding: 0 16px;
  font-size: 17px;
  font-weight: 600;
  border: 1.5px solid var(--c-line);
  background: #fff;
  color: var(--c-text);
  border-radius: 23px;
  white-space: nowrap;
}
.chip-row button[aria-pressed="true"] {
  background: var(--c-text);
  border-color: var(--c-text);
  color: #fff;
}

/* ===== 법원 카드 ===== */
.cards { display: flex; flex-direction: column; gap: 14px; margin-top: 6px; }
.card {
  background: var(--c-card);
  border: 1px solid var(--c-line);
  border-radius: 16px;
  padding: 16px;
}
.card h3 {
  margin: 0 0 6px;
  font-size: var(--fs-name);
  line-height: 1.3;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.badge {
  display: inline-block;
  font-size: 15px;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 8px;
  color: #fff;
  white-space: nowrap;
}
/* 법원 유형 뱃지 (색 + 텍스트 병기) */
.badge.b-daebeop { background: #b8901f; color: #241c00; }  /* 대법원=금색 */
.badge.b-godeung { background: var(--c-purple); }          /* 고등·전문=보라 */
.badge.b-jibang { background: var(--c-blue); }             /* 지방법원=파랑 */
.badge.b-jiwon { background: var(--c-sky); }               /* 지원=하늘 */
.badge.b-sigun { background: var(--c-green); }             /* 시·군법원=초록 */
.badge.b-deunggi { background: var(--c-orange); }          /* 등기소=주황 */
/* 법원 카드 요소 */
.card .court-parent {
  margin: 2px 0;
  font-size: calc(var(--fs-base) - 2px);
  font-weight: 700;
  color: var(--c-primary-dark);
}
.card .court-hours {
  margin: 6px 0;
  font-size: calc(var(--fs-base) - 2px);
  color: var(--c-text-sub);
  background: #eef1f6;
  border-radius: 10px;
  padding: 8px 10px;
}
.card .dist {
  font-size: 17px;
  font-weight: 800;
  color: var(--c-green);
}
.card .depts, .card .addr {
  margin: 4px 0;
  color: var(--c-text-sub);
  font-size: calc(var(--fs-base) - 1px);
  overflow-wrap: anywhere;
}
.card .addr { color: var(--c-text); }
.card .homepage { font-size: calc(var(--fs-base) - 1px); word-break: break-all; }

.card-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 12px;
}
.btn-call {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 60px;
  font-size: 22px;
  font-weight: 800;
  color: #fff !important;
  background: var(--c-call);
  border-radius: 14px;
  text-decoration: none;
}
.btn-call:active { background: #14602a; }
.sub-actions {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
}
.sub-actions a, .sub-actions button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  font-size: 17px;
  font-weight: 700;
  border-radius: 12px;
  text-decoration: none;
  border: 2px solid var(--c-line);
  background: #fff;
  color: var(--c-text);
  white-space: nowrap;
}
.sub-actions .btn-kakao-map { border-color: #f7c600; background: #fee500; color: #191600; }
.sub-actions .btn-naver { border-color: #03c75a; color: #026b32; }
.sub-actions .btn-share { border-color: #b8873b; color: #7a5310; }
/* 더 보기 */
.more-btn {
  width: 100%;
  min-height: 58px;
  margin-top: 14px;
  font-size: 20px;
  font-weight: 800;
  border: 2px solid var(--c-primary);
  background: #fff;
  color: var(--c-primary-dark);
  border-radius: 14px;
}
.more-btn:active { background: #e8f0fc; }
.empty-msg {
  text-align: center;
  padding: 30px 10px;
  color: var(--c-text-sub);
  font-size: 19px;
}

/* ===== 이용 안내 탭 ===== */
.guide-card {
  background: var(--c-card);
  border: 1px solid var(--c-line);
  border-radius: 16px;
  padding: 18px;
  margin: 14px 0;
}
.guide-card h2 {
  margin: 0 0 10px;
  font-size: 22px;
  color: var(--c-primary-dark);
}
body.font-lg .guide-card h2 { font-size: 24px; }
.guide-card p, .guide-card li { font-size: var(--fs-base); }
.guide-card ul { padding-left: 22px; margin: 8px 0; }
.guide-card .stress { font-weight: 800; color: var(--c-red); }
.guide-steps { list-style: none; padding: 0; margin: 0; counter-reset: st; }
.guide-steps li {
  counter-increment: st;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 10px 0;
  border-bottom: 1px dashed var(--c-line);
}
.guide-steps li:last-child { border-bottom: none; }
.guide-steps li::before {
  content: counter(st);
  flex: 0 0 auto;
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--c-primary);
  color: #fff;
  font-weight: 800;
  font-size: 20px;
  display: flex; align-items: center; justify-content: center;
}
.juris-phones { display: grid; grid-template-columns: 1fr; gap: 10px; }
.juris-phones a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 58px;
  padding: 0 18px;
  font-size: 19px;
  font-weight: 700;
  background: var(--c-green);
  color: #fff;
  border-radius: 14px;
  text-decoration: none;
}
.juris-phones a .num { font-size: 21px; }

.guide-card.note-card { background: #f6f7f9; }
.guide-card.note-card p { font-size: 16px; color: var(--c-text-sub); margin: 0; }

/* '법원에 안 가도 되는 일' 강조 카드 */
.guide-card.highlight-card { border: 2px solid var(--c-accent); }
.guide-card.highlight-card h2 { color: var(--c-accent); }
.nogo-list { list-style: none; padding: 0; margin: 8px 0 0; }
.nogo-list li {
  padding: 14px 0;
  border-top: 1px dashed var(--c-line);
  font-size: var(--fs-base);
  line-height: 1.55;
}
.nogo-list li:first-child { border-top: none; }
/* 안내 탭 외부 링크 버튼 (큰 터치 영역) */
.guide-link {
  display: inline-block;
  margin: 8px 8px 0 0;
  padding: 10px 16px;
  min-height: 46px;
  line-height: 26px;
  background: var(--c-primary);
  color: #fff !important;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 700;
  font-size: calc(var(--fs-base) - 2px);
}
.guide-link:active { background: var(--c-primary-dark); }

/* 자주 묻는 질문 */
.faq-list { margin: 0; }
.faq-list dt {
  font-size: var(--fs-base);
  font-weight: 800;
  color: var(--c-primary-dark);
  padding: 14px 0 6px;
  border-top: 1px solid var(--c-line);
}
.faq-list dt:first-child { border-top: none; padding-top: 4px; }
.faq-list dt::before {
  content: "Q. ";
  color: var(--c-green);
  font-weight: 800;
}
.faq-list dd {
  margin: 0 0 8px;
  font-size: var(--fs-base);
  color: var(--c-text-sub);
  line-height: 1.6;
}

/* 광고 슬롯 (이용 안내 하단 전용) — 광고가 실제 채워졌을 때만 노출 */
.ad-slot {
  display: none;
  margin: 20px 0 8px;
  border: 2px dashed var(--c-line);
  border-radius: 12px;
  padding: 16px 12px;
  text-align: center;
  color: #8a919a;
  font-size: 15px;
  background: #fbfcfd;
}
.ad-slot:has(ins.adsbygoogle[data-ad-status="filled"]) { display: block; }
.ad-slot::before {
  content: "광고";
  display: inline-block;
  border: 1px solid #b6bcc4;
  border-radius: 6px;
  padding: 1px 8px;
  font-size: 13px;
  margin-bottom: 6px;
}

/* ===== 푸터 ===== */
footer.site-foot {
  margin-top: 30px;
  padding: 20px 12px 34px;
  border-top: 1px solid var(--c-line);
  text-align: center;
  color: var(--c-text-sub);
  font-size: 15px;
}
.visit-counter { font-size: 15px; margin-top: 6px; }
.visit-counter[hidden] { display: none; }
.region-links { margin: 10px 0 4px; line-height: 2; }
.region-links a { margin: 0 5px; font-size: 15px; color: var(--c-text-sub); }
.region-links.seo-pages { margin-top: 2px; font-size: 12px; color: #9aa1a9; line-height: 1.8; }
.region-links.seo-pages a { font-size: 12px; color: #9aa1a9; margin: 0 3px; }

/* ===== 데스크톱 확장 ===== */
@media (min-width: 700px) {
  .sido-btns { grid-template-columns: repeat(6, 1fr); }
  .card-actions { grid-template-columns: 220px 1fr; align-items: stretch; }
  .btn-call { min-height: 56px; }
  .juris-phones { grid-template-columns: 1fr 1fr; }
  .cards { gap: 16px; }
}

/* 접근성: 화면낭독기 전용 텍스트 */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0;
}

[hidden] { display: none !important; }

/* ============================================================
   iOS 리퀴드 글래스 레이어
   (고령자 가독성 유지: 텍스트 면은 충분히 불투명, 핵심 CTA는 solid)
   - blur+saturate 강화, 반투명 그라데이션 패널,
     상단 스페큘러 하이라이트 엣지, 다층 소프트 섀도우
   ============================================================ */
:root {
  /* blur 값은 성능(구형 스마트폰)과 화질의 균형 — 과하면 저사양 기기에서 끊김 */
  --glass-blur: saturate(180%) blur(16px);
  --glass-blur-strong: saturate(190%) blur(20px);
  /* 유리 면(비텍스트: 지도 등) — 더 투명 */
  --glass-panel: linear-gradient(160deg, rgba(255,255,255,0.60), rgba(255,255,255,0.40));
  /* 텍스트 면(카드·안내·검색) — 가독성 위해 더 불투명 */
  --glass-solid: linear-gradient(160deg, rgba(255,255,255,0.92), rgba(255,255,255,0.80));
  --glass-border: rgba(255,255,255,0.72);
  /* 스페큘러: 위쪽 밝은 엣지 + 은은한 안쪽 테두리 광 */
  --glass-hi: inset 0 1px 0 rgba(255,255,255,0.85), inset 0 0 0 1px rgba(255,255,255,0.22);
  --glass-shadow: 0 12px 34px rgba(16,28,58,0.16), 0 2px 8px rgba(16,28,58,0.08);
  /* 활성(선택) 상태용 네이비 틴트 유리 */
  --glass-tint: linear-gradient(160deg,
      color-mix(in srgb, var(--c-primary) 94%, transparent),
      color-mix(in srgb, var(--c-primary) 76%, transparent));
  --glass-hi-tint: inset 0 1px 0 rgba(255,255,255,0.35);
}

/* 배경: 테마색 그라데이션 메시(블러가 비칠 컬러 바탕). 스킨색(--c-primary) 반영 */
body {
  background-color: #dde5f2;
  background-image:
    radial-gradient(60vw 55vw at 4% -6%, color-mix(in srgb, var(--c-primary) 55%, transparent), transparent 70%),
    radial-gradient(52vw 52vw at 102% 2%, color-mix(in srgb, var(--c-accent) 38%, transparent), transparent 68%),
    radial-gradient(54vw 50vw at 94% 55%, color-mix(in srgb, var(--c-primary) 44%, transparent), transparent 68%),
    radial-gradient(88vw 62vw at 36% 112%, color-mix(in srgb, var(--c-primary) 46%, transparent), transparent 72%),
    radial-gradient(72vw 64vw at 52% 42%, color-mix(in srgb, var(--c-primary) 14%, transparent), transparent 75%);
  background-attachment: fixed;
  background-repeat: no-repeat;
}

/* 상단 헤더·서비스 탭 바: 짙은 네이비 유리 (컨트롤센터 느낌) */
header.site-head,
nav.service-tabs {
  background: linear-gradient(160deg,
      color-mix(in srgb, var(--c-primary) 82%, transparent),
      color-mix(in srgb, var(--c-primary-dark) 82%, transparent));
  -webkit-backdrop-filter: var(--glass-blur-strong);
  backdrop-filter: var(--glass-blur-strong);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.18), 0 6px 22px rgba(16,28,58,0.20);
}
.service-tab { background: transparent; color: rgba(255, 255, 255, 0.78); }
.service-tab[aria-selected="true"] {
  background: var(--glass-solid);
  color: var(--c-primary-dark);
  box-shadow: var(--glass-hi);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}

/* 하위 탭 (찾기 / 이용 안내) */
.sub-tab {
  background: var(--glass-panel);
  border-color: var(--glass-border);
  box-shadow: var(--glass-hi), var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}
.sub-tab[aria-selected="true"] {
  background: var(--glass-tint);
  border-color: transparent;
  color: #fff;
  box-shadow: var(--glass-hi-tint), var(--glass-shadow);
}

/* 검색창 (텍스트 면) */
.search-box input {
  background: var(--glass-solid);
  border-color: var(--glass-border);
  box-shadow: var(--glass-hi), var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}
.suggest-list {
  background: var(--glass-solid);
  border-color: var(--glass-border);
  box-shadow: var(--glass-hi), 0 16px 40px rgba(16,28,58,0.22);
  -webkit-backdrop-filter: var(--glass-blur-strong);
  backdrop-filter: var(--glass-blur-strong);
}
.suggest-list button { background: transparent; }

/* 지도 패널 (비텍스트 → 더 투명한 유리) */
.map-area {
  background: var(--glass-panel);
  border-color: var(--glass-border);
  box-shadow: var(--glass-hi), var(--glass-shadow);
  border-radius: 20px;
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}

/* 시·도 버튼 · 종별 탭 · 뒤로/더보기 (텍스트 면) */
.sido-btns button,
.kind-tabs button,
.back-btn,
.more-btn {
  background: var(--glass-solid);
  border-color: var(--glass-border);
  box-shadow: var(--glass-hi), var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}
.kind-tabs button[aria-selected="true"] {
  background: var(--glass-tint);
  border-color: transparent;
  color: #fff;
  box-shadow: var(--glass-hi-tint), var(--glass-shadow);
}
.chip-row button {
  background: var(--glass-panel);
  border-color: var(--glass-border);
  box-shadow: var(--glass-hi);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}
.chip-row button[aria-pressed="true"] {
  background: linear-gradient(160deg,
      color-mix(in srgb, var(--c-text) 92%, transparent),
      color-mix(in srgb, var(--c-text) 80%, transparent));
  border-color: transparent;
  color: #fff;
  box-shadow: var(--glass-hi-tint);
}

/* 카드 · 안내 카드 (텍스트 면 → 불투명 유리 + 라운드 강화) */
.card,
.guide-card {
  background: var(--glass-solid);
  border-color: var(--glass-border);
  border-radius: 20px;
  box-shadow: var(--glass-hi), var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}

/* 보조 액션 버튼(길찾기·네이버·공유): 반투명 유리 */
.sub-actions a,
.sub-actions button {
  background: var(--glass-solid);
  box-shadow: var(--glass-hi);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}

/* 안내 문구: 옅은 앰버 유리 */
.intro-line {
  background: linear-gradient(160deg,
      color-mix(in srgb, #fff4d6 82%, transparent),
      color-mix(in srgb, #ffe9b8 70%, transparent));
  box-shadow: var(--glass-hi);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}

/* backdrop-filter 미지원 브라우저: 반투명이 과하지 않도록 더 불투명 처리 */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .card, .guide-card, .search-box input, .suggest-list,
  .sido-btns button, .kind-tabs button, .back-btn, .more-btn,
  .sub-actions a, .sub-actions button, .chip-row button,
  .service-tab[aria-selected="true"] { background: #ffffff; }
  .map-area { background: rgba(255, 255, 255, 0.94); }
}