/* 8차 미리보기(2026-10-29 · ko-ver2) — 사진 교체 · 보정, 병원 소개 진료 철학 문구, 이야기 검색. 생성 batch-1029/r8.py */

/* 메인 ‘미친 치과의사’ 띠: 이미지 03 — 7차와 같은 가장자리 흐림 */
.r5-dr__ph img[src*="r8-doc-band"] { filter: none;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 30%, #000 86%, transparent), linear-gradient(180deg, transparent, #000 22%);
  -webkit-mask-composite: source-in;
          mask-image: linear-gradient(90deg, transparent, #000 30%, #000 86%, transparent), linear-gradient(180deg, transparent, #000 22%);
          mask-composite: intersect; }

/* 연출 이미지 표시(워커로 만든 진료 장면) */
.r8-staged { position: absolute; right: 10px; bottom: 10px; z-index: 2; padding: 3px 9px; border-radius: 999px; background: rgba(20,18,16,.6); font-size: 12px; line-height: 1.5; letter-spacing: 0; color: rgba(255,255,255,.88); pointer-events: none; }
.r5-sc__ph { position: relative; }

/* 메인 전후 사진: X-ray 한 쌍이 화면 안에 다 들어오게(탭 · 동그라미와 함께 보일 때 아래가 잘리지 않음) */
@media (min-width: 1024px) {
  .r4-ba__fr { height: clamp(320px, calc(100svh - 400px), 540px); }
}

/* 병원 소개 첫 배너(감성 이미지): 모바일은 꽃병 쪽 */
@media (max-width: 1023px) { .bp-hero .shero__bg[src*="r8-about-hero"] { object-position: 72% 50%; } }

/* 병원 소개 진료 철학(8차 문구): 단계 번호 · 짧은 설명 */
.r8-proc .step__img img[src*="r6-doc-clinic"] { object-position: 80% 28%; }
.r8-proc .c-proc__sub { margin-bottom: 0; }

/* 병원 소개 공간 사진: 입구 간판이 가운데 오게 */
.bp-gal__img[src*="r8-gal-entrance"] { object-position: 50% 38%; }
.bp-gal__img[src*="r8-gal-lounge"] { object-position: 50% 60%; }

/* 병원 소개 진료시간: 사진과 글 칸 높이를 같게(PC) */
@media (min-width: 1024px) {
  #hours .c-intro__grid { align-items: stretch; }
  #hours .c-intro__img { aspect-ratio: auto; height: 100%; min-height: 380px; }
}

/* 병원 소개 지도: 출처 */
.c-map .r8-map-src { margin: 10px 0 0; font-size: 12px; color: #8a8378; }

/* 원장 소개 Specialist 띠: 망점 무늬를 걷어 사진이 또렷하게 */
.v7-sp:has(img[src*="r8-dr-spec"])::before { content: none; }
.v7-sp__ph img[src*="r8-dr-spec"] { filter: contrast(1.04); object-position: 36% 22%; }
@media (max-width: 1023px) { .v7-sp__ph img[src*="r8-dr-spec"] { object-position: 30% 14%; } }

/* 원장 소개 약력 사진 출처(CC BY-SA) */
.sb-r__credit { margin: 8px 0 0; font-size: 12px; line-height: 1.5; color: #8a8378; }
.sb-r__credit a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

/* 이식술 X-ray 한 쌍: 잘리지 않게 전체를 보여 줌 */
.bp-way__img.rt-ba { aspect-ratio: 3 / 2; }
.bp-way__img.rt-ba .rt-ba__i img { object-fit: contain; }

/* 무통 마취 수료증: 반듯하게 편 사진을 칸 가운데, 모서리 둥글기 6px 로 정확하게 */
.bp-mc__certph { display: flex !important; align-items: center; justify-content: center; padding: 16px; }
.bp-mc__certph img[src*="r8-cert"] { width: auto !important; height: auto !important; max-width: 100%; max-height: 100%; padding: 0 !important; border-radius: 6px; box-shadow: 0 12px 26px -16px rgba(60,40,20,.55); }

/* 세라믹 ‘이런 경우 상담할 수 있습니다’ 카드: 글을 키우고 카드 높이를 줄여 비율을 맞춤 */
.bp-prom .v7-pc__in { min-height: 300px; }
.bp-prom .v7-pc__t { font-size: clamp(21px, 12px + .85vw, 25px); line-height: 1.45; font-weight: 700; letter-spacing: -0.03em; }
.bp-prom .v7-pc__n { font-size: clamp(44px, 30px + 1.2vw, 56px); }
@media (max-width: 1023px) {
  .bp-prom .v7-pc__in { min-height: 0; }
  .bp-prom .v7-pc__t { font-size: 19px; }
}

/* 이야기(유튜브 · 블로그) 검색 */
.r8-sch { display: flex; align-items: center; gap: 8px; width: min(100%, 420px); }
.r8-sch__in { flex: 1; min-width: 0; height: 48px; padding: 0 16px; border: 1px solid #d6cfc2; border-radius: 0; background: #fff; font: inherit; font-size: 16px; color: var(--ink); }
.r8-sch__in:focus { outline: 2px solid #a9843e; outline-offset: 1px; border-color: #a9843e; }
.r8-sch__btn { flex: none; height: 48px; padding: 0 20px; border: 0; background: #1e1d1b; font: inherit; font-size: 15px; font-weight: 600; color: #fff; cursor: pointer; }
.r8-sch__btn:focus-visible { outline: 2px solid #a9843e; outline-offset: 2px; }
.r8-sch__msg { margin: 18px 0 0; font-size: 15px; color: var(--sub); }
.r8-sch__msg b { color: var(--ink); }
.r8-sch__msg a { margin-left: 10px; color: #a9843e; text-decoration: underline; text-underline-offset: 3px; }
.bp-vlib .r8-sch { margin-top: 16px; }
.r8-empty { margin: 30px 0 0; padding: 40px 20px; border: 1px dashed #d6cfc2; text-align: center; font-size: 16px; color: var(--sub); }
.r8-sr { display: grid; gap: 0; margin: 26px 0 0; padding: 0; list-style: none; border-top: 1px solid #1e1d1b; }
.r8-sr li { border-bottom: 1px solid #e3ddd2; }
.r8-sr a { display: grid; gap: 8px; padding: 24px 4px; color: inherit; }
.r8-sr a:hover .r8-sr__t { color: #a9843e; }
.r8-sr__meta { font-size: 14px; color: #8a8378; }
.r8-sr__t { font-size: 19px; line-height: 1.45; font-weight: 700; color: var(--ink); transition: color .2s; }
.r8-sr__x { font-size: 15.5px; line-height: 1.7; color: #55504a; }
.r8-sr mark, .bp-vc__t mark { padding: 0 1px; background: #f1dfb4; color: inherit; }
@media (max-width: 1023px) {
  .r8-sch { width: 100%; }
  .r5-lp__bar .r8-sch { order: 3; }
  .r8-sr__t { font-size: 17px; }
  .r8-sr__x { font-size: 15px; }
}
.r8-vh { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
