/* 2026-10-03 모바일 3건 (khan-listings-v3 / khan-listfilter-v8 / khan-home-ui 뒤에 로드해서 덮어쓴다)
   1) 매물 카드: 모바일(≤639) 1행 1열, 카드 비율 16:9
   2) 매물목록 '전체 지역' 시트: 다른 필터(kh-fpanel)와 같은 아래→위 등장
   3) 메인 상단 퀵메뉴: 4열 3행 고정 그리드(2026-10-04, 슬라이드 폐기) */

/* ───── 1. 매물 카드 1열 ─────
   2026-10-03 2차: 제목 1줄 말줄임, 정보명·정보값 13px 통일(색만 구분)
   3차: 고정 16:9 대신 내용 높이(약 150px). 권리금·원생·면적·보증금/월세를 한 줄 왼쫽 정렬(길면 다음 줄로 자연 줄바꿈).
   구조: 링크를 flex-wrap 행으로 두고 지역·제목·푸터는 100% 폭, facts 는 display:contents 로 풀어 권리금과 같은 줄에 놓는다. */
@media(max-width:639px){
  .kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kp-list .kp-grid,.kd-page .kd-related-grid{grid-template-columns:minmax(0,1fr);gap:12px}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card{height:auto;aspect-ratio:auto;display:flex;flex-direction:column}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card>.kh-card__link{flex:1 1 auto;display:flex;flex-direction:row;flex-wrap:wrap;align-items:baseline;align-content:flex-start;column-gap:10px;row-gap:0;min-height:0;padding:14px 14px 12px;overflow:hidden}
  /* 1줄: 지역 · 업종 */
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__where{flex:0 0 100%;display:block;min-height:0;padding-right:36px;font-size:13px;line-height:18px;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card__where>span:first-child{display:inline;padding:0}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__category{display:inline;font-size:13px;line-height:18px;letter-spacing:-.02em;color:#6b7280}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__category::before{content:"·";margin-right:6px;color:#b4b9c3}
  /* 2줄: 제목 한 줄 말줄임 */
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__title{flex:0 0 100%;display:block;-webkit-line-clamp:unset;min-height:0;max-height:none;margin:5px 0 0;font-size:15.5px;line-height:22px;letter-spacing:-.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* 3줄: 권리금 · 원생 · 면적 · 보증금/월세 — 한 줄, 왼쪽 정렬. 2026-10-04: 이름 13px 회색, 값 13px/600 (권리금 값도 같은 크기·굵기, 색만 보라) */
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__price{flex:0 0 auto;display:inline-flex;align-items:baseline;gap:4px;margin:10px 0 0;padding:0;white-space:nowrap}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__price>span{font-size:13px;line-height:18px;color:#6b7280;letter-spacing:-.02em}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__price>strong{font-size:13px;line-height:18px;font-weight:600;letter-spacing:-.02em}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts{display:contents}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__tags,:is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__area,:is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__lease{flex:0 0 auto;display:inline-flex;flex-direction:row;flex-wrap:nowrap;align-items:baseline;gap:4px;grid-column:auto;min-height:0;margin:10px 0 0;padding:0;white-space:nowrap}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__tags span,:is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__area span,:is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__lease span{display:inline;font-size:13px;line-height:18px;font-weight:400;color:#6b7280;letter-spacing:-.02em}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__tags strong,:is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__area strong,:is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__lease strong{display:inline;font-size:13px;line-height:18px;font-weight:600;color:#222630;letter-spacing:-.02em}
  /* 4줄: 매물번호 · 등록일 · 배지 */
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__foot{flex:0 0 100%;display:flex;align-items:center;gap:8px;min-height:0;margin-top:9px;padding-top:8px;border-top:1px solid #EEF0F4}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card__meta{flex-direction:row;align-items:baseline;gap:8px;margin-left:0;font-size:12px;line-height:16px;color:#8b95a1}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card__meta time::before{content:"·";margin:0 2px 0 0;color:#c3c8d1}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__status{margin-left:auto;font-size:11px}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__fav{top:6px;right:6px}
}
/* 좁은 폰(≤359): 글자만 한 단계 ↓ */
@media(max-width:359px){
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__title{font-size:15px;line-height:21px}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__price>strong{font-size:12px}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card>.kh-card__link{column-gap:10px}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__tags span,:is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__area span,:is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__lease span,:is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__tags strong,:is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__area strong,:is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts .kh-card__lease strong,:is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__price>span{font-size:12px}
}

/* ───── 2. 전체 지역 시트: 아래 → 위 ───── */
@media(max-width:767px){
  .kh-rmodal[open]{animation:kh-rsheet .22s cubic-bezier(.2,.7,.2,1)}
  .kh-rmodal[open]::backdrop{animation:kh-rsheet-dim .22s ease-out}
  .kh-rmodal__panel{box-shadow:0 -6px 24px rgba(16,24,40,.18)}
}
@keyframes kh-rsheet{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes kh-rsheet-dim{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.kh-rmodal[open],.kh-rmodal[open]::backdrop{animation:none}}

/* ───── 3. 메인 상단 퀵메뉴: 4열 3행 고정 그리드 ─────
   2026-10-04: 가로 슬라이드(끝 잘림)를 버리고 11개 업종 + 전체보기 = 12칸을 4열 3행으로 모두 보이게.
   390px 폰 기준 칸 폭 약 89px, 아이콘 56px, 글자 13px. 2차 분류(cat-sub)는 모바일에서 숨긴다. */
@media(max-width:767px){
  body[data-page="home"] .kh-home-categories{padding-top:10px} /* 2026-10-04 검색창~퀵메뉴 간격 28→10px */
  body[data-page="home"] .kh-home-categories .cats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 6px;margin:0;padding:2px 0 4px;overflow:visible}
  body[data-page="home"] .kh-home-categories .cat{flex:none;min-width:0;width:auto}
  body[data-page="home"] .kh-home-categories .cat-main,body[data-page="home"] .kh-home-categories .cat.all{min-height:0;gap:7px;padding-top:2px}
  body[data-page="home"] .kh-home-categories .cat img,body[data-page="home"] .kh-home-categories .cat.all i{width:56px;height:56px;border-radius:15px}
  body[data-page="home"] .kh-home-categories .cat.all svg{width:24px;height:24px}
  body[data-page="home"] .kh-home-categories .cat span{display:block;width:100%;font-size:13px;line-height:18px;font-weight:500;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.02em}
  body[data-page="home"] .kh-home-categories .cat-sub{display:none!important}
}
@media(max-width:359px){
  body[data-page="home"] .kh-home-categories .cats-grid{gap:12px 4px}
  body[data-page="home"] .kh-home-categories .cat img,body[data-page="home"] .kh-home-categories .cat.all i{width:50px;height:50px;border-radius:13px}
  body[data-page="home"] .kh-home-categories .cat span{font-size:12px}
}

/* ───── 4. 2026-10-04 모바일 로고·히어로·글자 크기 한 단계 ↓ (≤767) ─────
   - 헤더 로고 156×32 → 120×24.5
   - 메인 히어로: hero-sub 문구 삭제(home.php), 헤더~타이틀 여백 24 → 44px
   - 제목류는 약 15~20%, 본문·버튼류는 1px 정도 줄인다. 데스크톱·태블릿(768+)은 그대로. */
@media(max-width:767px){
  body[data-page] .kh-header-logo{flex:0 1 120px}
  body[data-page] .kh-header-logo>.kh-logo{width:120px;max-width:100%}

  body[data-page="home"] .hero{padding-top:44px}
  body[data-page] .hero h1{font-size:30px;line-height:1.2}
  body[data-page] .hero h1+.kh-home-search,body[data-page] .hero h1+form,body[data-page] .hero h1+div{margin-top:24px}

  /* 메인 */
  body[data-page] .pb h3{font-size:19px;line-height:1.3}
  body[data-page] .kh-rail-heading h2{font-size:18px}
  body[data-page] .sec-h h2{font-size:20px}
  body[data-page] .fc b{font-size:16px}
  body[data-page] .kh-rank-number{font-size:17px}
  body[data-page] .bcards .bcard h3{font-size:15px;line-height:1.4}
  /* 2026-10-04 매수자 카드: 희망 권리금 줄 위 간격 margin 20→10, padding 16→10 */
  body[data-page] .bcards .bcard-budget{margin-top:10px;padding-top:10px}
  body[data-page] .bcard-budget strong{font-size:17px}
  body[data-page] .step h3{font-size:16px}
  body[data-page] .faq summary{font-size:15px}
  body[data-page] .faq .a{font-size:14px}
  body[data-page] .cta h2{font-size:22px}
  body[data-page] .cta-in p{font-size:14px}

  /* 목록·공통 페이지 제목 */
  body[data-page] .kh-page-head .kh-page-title{font-size:24px;line-height:1.3}

  /* 매물 상세 */
  /* 2026-10-04 지역·분류 줄(제목 위)이 제목보다 눈에 띄게: 20px/800, 제목 17px/600 */
  body[data-page] .kd-page .kd-where{font-size:20px;margin-bottom:6px}
  body[data-page] .kd-page .kd-where__cat::before{margin:0 10px}
  body[data-page] .kd-page .kd-overview .kd-title{font-size:17px;line-height:1.5}
  body[data-page] .kd-page .kd-highlights dd,body[data-page] .kd-page .kd-highlights .kd-premium dd{font-size:16px;line-height:23px}
  body[data-page] .kd-section-head h2{font-size:16.5px;line-height:24px}
  body[data-page] .kd-page .kd-facts>.kd-fact--key dd{font-size:15px}
  body[data-page] .kd-contact h2{font-size:16px;line-height:24px}
  body[data-page] .kd-contact .kd-call strong{font-size:18px}
  body[data-page] .kd-contact .kd-buyer-cta{font-size:14px}
  body[data-page] .kd-related-head h2{font-size:18px;line-height:26px}
  body[data-page] .kd-related-head h2 span{font-size:13px}
  body[data-page] .kd-upsell h2{font-size:16px;line-height:24px}
  body[data-page] .kd-upsell .kd-upsell__btn{font-size:14px}
}

/* ───── 5. 2026-10-04 메인 '학원 매물' 탭 띠: 화면 좌우 끝까지 ─────
   기존엔 컨테이너 안쪽(16~374px)에서 잘려 끝이 딱 끊겨 보였다. 띠를 컨테이너 여백(16px) 밖 화면 끝까지 늘려
   오른쪽 탭이 화면 가장자리에서 잘려 보이게 한다(= 옆으로 더 있음). 첫 탭 시작 위치(16px)는 그대로.
   끝 여백은 ::after 10px + gap 6px = 16px(사파리는 flex 스크롤 컨테이너의 오른쪽 padding 을 스크롤 영역에 넣지 않음). */
@media(max-width:767px){
  body[data-page="home"] #home-listings .tabs{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:0;scroll-padding-inline:16px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  body[data-page="home"] #home-listings .tabs{gap:6px}
  body[data-page="home"] #home-listings .tabs::after{content:"";flex:0 0 10px}
  /* 탭 좌우 패딩 16→12px: 390px 폰에서 4개 + 5번째가 화면 끝에서 약 1/4 잘려 보인다 */
  body[data-page="home"] #home-listings .tabs .tab{flex:0 0 auto;padding-left:12px;padding-right:12px}
}

/* ───── 6. 2026-10-04 메인 '비밀중개 절차' 카드 폭 ─────
   카드가 화면의 66%(236px)인데 내용은 아이콘 46px + 제목 최대 72px 뿐이라 빈 공간이 컸다.
   카드 폭 140px 고정(안쪽 여백 18/16). khan-home-ui.css 의 3개 선택자(.step / .step+.step / .step:first-child)와 같은 특이도로 덮는다 → 390px 폰에서 2장 + 3번째 절반이 보여 옆으로 더 있다는 신호도 유지. */
@media(max-width:767px){
  body[data-page="home"] .steps .step,body[data-page="home"] .steps .step+.step,body[data-page="home"] .steps .step:first-child{flex:0 0 140px;width:140px;min-width:0;padding:18px 16px 18px}
}

/* ───── 7. 2026-10-04 메인 '조건별로 빠르게 찾기' 카드 줄: 화면 좌우 끝까지 ─────
   학원 매물 탭 띠와 같은 방식. 첫 카드 시작은 16px 그대로, 카드 폭도 전과 같게(컨테이너 폭의 85%),
   두 번째 카드가 화면 끝에서 잘려 보인다. 끝 여백 = ::after 4px + gap 12px. 화살표 이동 기준은 scroll-padding-left(khan-home-ui.js). */
@media(max-width:767px){
  body[data-page="home"] .kh-feature-rail .feat-row{margin-left:-16px;margin-right:-16px;padding:2px 0 10px 16px;scroll-padding-left:16px;scroll-padding-right:0}
  body[data-page="home"] .kh-feature-rail .feat-row::after{content:"";flex:0 0 4px}
  body[data-page="home"] .kh-feature-rail .fc{flex:0 0 calc((100vw - 32px) * .85);min-width:0}
}

/* ───── 8. 2026-10-04 매물목록 필터 칩 띠(.kh-fchips) + 초기화 버튼 ─────
   1) 띠를 화면 좌우 끝까지: 컨테이너 여백 안에서 딱 끊기던 것을 화면 가장자리에서 잘려 보이게(옆으로 밀 수 있음). 끝 여백 = ::after 10px + gap 6px.
   2) 초기화: 조건이 하나라도 걸려 있으면(.is-active) 띠 맨 앞으로 옮기고 '↻ 초기화' 글자 알약으로 보이게(선택된 칩의 검정 톤과 맞춤).
      조건이 없으면 모바일에서는 숨김. 데스크톱은 그대로(글자 숨김). */
.kh-freset__txt{display:none}
@media(max-width:767px){
  body[data-page] .kh-listfilter--v8 .kh-fchips{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:0;scroll-padding-inline:16px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  body[data-page] .kh-listfilter--v8 .kh-fchips::after{content:"";flex:0 0 10px}
  body[data-page] .kh-listfilter--v8 .kh-freset.is-active{order:-1;width:auto;height:36px;margin:0 2px 0 0;padding:0 13px 0 11px;gap:4px;border:1px solid #24272E;border-radius:999px;background:#fff;color:#24272E;font-size:13.5px;font-weight:600;letter-spacing:-.01em;white-space:nowrap}
  body[data-page] .kh-listfilter--v8 .kh-freset.is-active svg{width:15px;height:15px}
  body[data-page] .kh-listfilter--v8 .kh-freset.is-active .kh-freset__txt{display:inline}
  /* 조건이 없으면 되돌릴 게 없으니 모바일에서는 숨김(2026-10-04 사용자 결정) */
  body[data-page] .kh-listfilter--v8 .kh-freset:not(.is-active){display:none}
}

/* ───── 9. 2026-10-04 매물목록 필터 시트 뒤 배경: 전체 메뉴(aside)와 같은 어둡게 + blur ─────
   권리금·원생·정렬 시트(.kh-fsheet-backdrop, khan-listfilter-v8.js 가 만듦)와 '전체 지역' 시트(dialog.kh-rmodal::backdrop) 모두.
   열릴 때 0.3초 동안 흐려지며 들어온다. blur 미지원 브라우저는 조금 더 어둡게만. */
@media(max-width:767px){
  body[data-page] .kh-fsheet-backdrop{background:rgba(15,23,42,.32);-webkit-backdrop-filter:blur(10px) saturate(120%);backdrop-filter:blur(10px) saturate(120%);animation:kh-blur-in .3s ease-out}
  body[data-page] .kh-rmodal::backdrop{background:rgba(15,23,42,.32);-webkit-backdrop-filter:blur(10px) saturate(120%);backdrop-filter:blur(10px) saturate(120%)}
  body[data-page] .kh-rmodal[open]::backdrop{animation:kh-blur-in .3s ease-out}
}
/* 2026-10-04 버벅임 개선: blur 반경은 고정, 불투명도만 0→1 (blur 반경 애니메이션은 매 프레임 전체 화면 재계산) */
@keyframes kh-blur-in{from{opacity:0}to{opacity:1}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  @media(max-width:767px){body[data-page] .kh-fsheet-backdrop,body[data-page] .kh-rmodal::backdrop{background:rgba(15,23,42,.5)}}
}
@media(max-width:767px) and (prefers-reduced-motion:reduce){body[data-page] .kh-fsheet-backdrop,body[data-page] .kh-rmodal[open]::backdrop{animation:none}}

/* ───── 10. 2026-10-04 PC·태블릿(640+) 매물 카드 정보줄: 모바일처럼 권리금도 원생·면적·보증금/월세와 같은 크기 ─────
   항목명 13px 회색 / 값 13px 600(권리금 값만 보라). 왼쪽부터 한 줄로 이어 붙이고, 폭이 모자라면 다음 줄로(4열 PC 카드는 보증금/월세가 아랫줄).
   구조는 모바일(섹션 1)과 같다: 링크를 flex-wrap 행으로, facts 는 display:contents 로 풀어 권리금과 같은 줄에 놓는다. */
@media(min-width:640px){
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card>.kh-card__link{flex-direction:row;flex-wrap:wrap;align-items:baseline;align-content:flex-start;column-gap:10px;row-gap:0}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card :is(.kh-card__where,.kh-card__title,.kh-card__foot){flex:0 0 100%}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__price{flex:0 0 auto;display:inline-flex;align-items:baseline;gap:4px;margin:10px 0 0;padding:0;white-space:nowrap}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__price>span{font-size:13px;line-height:18px;font-weight:400;color:#6b7280;letter-spacing:-.02em}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__price>strong{font-size:13px;line-height:18px;font-weight:600;letter-spacing:-.02em}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts{display:contents}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts :is(.kh-card__tags,.kh-card__area,.kh-card__lease){flex:0 0 auto;display:inline-flex;flex-direction:row;flex-wrap:nowrap;align-items:baseline;gap:4px;grid-column:auto;min-height:0;margin:10px 0 0;padding:0;white-space:nowrap}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts :is(.kh-card__tags,.kh-card__area,.kh-card__lease) span{display:inline;font-size:13px;line-height:18px;font-weight:400;color:#6b7280;letter-spacing:-.02em}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__facts :is(.kh-card__tags,.kh-card__area,.kh-card__lease) strong{display:inline;font-size:13px;line-height:18px;font-weight:600;color:#222630;letter-spacing:-.02em}
  :is(.kh-cards-grid,.kh-cards-grid--4,.kh-home-cards,.kp-grid,.kd-related-grid) .kh-card .kh-card__foot{margin-top:auto;padding-top:14px}
}

/* 2026-10-05 햄버거 버튼 반응성: 히트 영역 48px(오른쪽 여백까지), 누르는 순간 배경 피드백, 300ms 탭 지연 방지 */
@media (max-width: 1023px) {
  .kh-header-burger { width: 48px; height: 48px; margin-right: -8px; border-radius: 12px; touch-action: manipulation; -webkit-tap-highlight-color: transparent; cursor: pointer; transition: background-color .12s ease; }
  .kh-header-burger:active, .kh-header-burger.is-pressed { background: rgba(105, 59, 242, .1); }
  .kh-mobile-close { touch-action: manipulation; -webkit-tap-highlight-color: transparent; border-radius: 10px; }
  .kh-mobile-close:active { background: rgba(105, 59, 242, .1); }
  .kh-mobile-panel a, .kh-mobile-panel button { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
}

/* ═══════════ 2026-10-05 모바일 버벅임 개선 ═══════════
 * 진단(390px): 카드 글로우 <i> 192개가 will-change 레이어 + 48개 무한 opacity 애니메이션, 배지 테두리 스윕 8개 무한, CTA 드리프트 2개,
 * 하단 바 backdrop blur 16px(스크롤 매 프레임 비용), 폰트 2MB(→ 동적 서브셋으로 교체, app.php).
 * 폰·태블릿에서는 장식용 무한 애니메이션과 레이어를 끄고, 그라디언트 테두리 같은 정적 장식만 남긴다. */
@media (max-width: 1023px) {
  .kh-card__glow { display: none !important; }
  .kh-card.kh-card--glow > .kh-card__link { box-shadow: 0 0 10px rgba(0, 0, 0, .06); }
  :is(.kh-card, .kd-overview) .kh-card__status.is-recommended::before,
  :is(.kh-card, .kd-overview) .kh-card__status.is-urgent::before,
  :is(.kh-card, .kd-overview) .kh-card__status.is-exclusive::before { animation: none !important; }
  .cta::before, .cta::after, .cta > .kh-drift, [class*="kh-drift"] { animation: none !important; } /* CTA 배경 빛 덩어리 떠다니기(kh-drift) 정지 */
  .kh-border-sweep { animation-duration: 6s; }
}
@media (max-width: 767px) {
  /* 하단 바: 유리 blur 대신 거의 불투명한 흰색(스크롤 중 매 프레임 blur 계산 제거) */
  .kh-fixed-cta.kh-glass-dock {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 -1px 0 rgba(16, 24, 40, .08), 0 -6px 20px rgba(16, 24, 40, .06) !important;
  }
}

/* ═══════════ 2026-10-05 모바일 메뉴 '학원매물' 아코디언 ═══════════ */
.kh-mobile-acc__btn { display: flex; align-items: center; justify-content: space-between; width: 100%; background: none; border: 0; border-bottom: 1px solid var(--line); text-align: left; cursor: pointer; font: inherit; font-size: 16px; font-weight: 600; color: var(--ink); padding: 12px 0; min-height: 44px; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.kh-mobile-acc__arrow { width: 20px; height: 20px; color: var(--muted, #8b8a95); transition: transform .24s cubic-bezier(.2, .7, .2, 1); flex: none; }
.kh-mobile-acc__btn[aria-expanded="true"] .kh-mobile-acc__arrow { transform: rotate(180deg); color: var(--brand, #693BF2); }
.kh-mobile-acc__btn[aria-expanded="true"] { border-bottom-color: transparent; }
.kh-mobile-acc__wrap { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .34s cubic-bezier(.2, .7, .2, 1); }
.kh-mobile-acc__wrap.is-open { grid-template-rows: 1fr; }
.kh-mobile-acc__inner { min-height: 0; overflow: hidden; opacity: 0; transform: translateY(-6px); transition: opacity .26s ease, transform .34s cubic-bezier(.2, .7, .2, 1); }
.kh-mobile-acc__wrap.is-open .kh-mobile-acc__inner { opacity: 1; transform: none; }
.kh-mobile-acc__panel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 10px; padding: 2px 0 12px 12px; border-bottom: 1px solid var(--line); }
@media (prefers-reduced-motion: reduce) { .kh-mobile-acc__wrap, .kh-mobile-acc__inner, .kh-mobile-acc__arrow { transition: none; } }
.kh-mobile-sublink { display: block; padding: 9px 4px; font-size: 14px; font-weight: 500; color: #3f3d4a; border-radius: 8px; min-height: 40px; line-height: 22px; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.kh-mobile-sublink:active { background: rgba(105, 59, 242, .08); }
.kh-mobile-sublink--all { grid-column: 1 / -1; color: var(--brand, #693BF2); font-weight: 600; }