/* ko-ver3 메인 미리보기 3차(2026-11-05 · index.preview.html 만 읽음) — 병원 피드백 7가지.
   2차 css/p-v3b.css 위에 얹는 층. 생성 ~/tmp/renewal-src/build/ver3-1105/make_v3c.py(이 파일을 css/p-v3c.css 로 복사). 모든 규칙은 body.v3 안.
   1 콘텐츠 최대 폭 1440 → 1680px(1920 화면 양옆 여백 240 → 120px, 1440 화면은 양옆 40px 그대로)
   2 큰 영문 윤곽 제목: 후기 ‘REVIEWS’ 와 같은 모양을 나머지 섹션에도(.v3c-bgt)
   3 왜 재식술은: 카드 가로 넓게 · 높이 낮게
   4 미친 치과의사: 사진(이미지 11)을 섹션 전체에, 예전 사진과 같은 구도로 자름(img/v3c-doc*.jpg — doc_v3c.py)
   5 머리 배너: 어두운 그라데이션은 글자 자리에만, 사진은 가장자리를 어둡게 하지 않음(img/v3c-hero*.jpg — hero_v3c.py)
   6 자주 묻는 질문: 그림을 돋보기로 다시 · 질문 굵게 · 답 글자 크게 · 글자색 흰색 */
body.v3 { --maxw: 1680px; }

/* 1 · 폭 — 자기 최대 폭을 따로 가진 칸도 같은 비율로 */
@media (min-width: 1024px) {
  body.v3 .faq .faq__in { max-width: calc(var(--maxw) + var(--gut) * 2); }
}
body.v3 .r4-ba__views { max-width: 1500px; }

/* 2 · 큰 영문 윤곽 제목 — 후기의 .r23-rv__bgt(css/p-r23.css)와 같은 크기 · 굵기 · 선. 소제목 바로 위에서 시작(제자리 + 위로 .42em) */
body.v3 .v3c-bgt { position: absolute; margin: -0.42em 0 0 -0.03em; font-size: clamp(80px, 9vw, 170px); line-height: 1; font-weight: 800; letter-spacing: .02em;
  color: transparent; -webkit-text-stroke: 1px rgba(53, 87, 107, .16); pointer-events: none; white-space: nowrap; }
body.v3 .v3c-bgt--c { left: 50%; margin-left: 0; transform: translateX(-50%); }
body.v3 :is(.r5-why__head, .r4-ba__head, .r5-media__head, .visit__info) { position: relative; }
body.v3 :is(#belief, #doctor, #why, #signature, #before-after, #media, #faq, #visit) { overflow-x: clip; }   /* 윤곽 글자가 화면 밖으로 나가 가로 스크롤이 생기지 않게 */
body.v3 .faq .v3c-bgt { -webkit-text-stroke-color: rgba(255, 255, 255, .2); }
body.v3 .r5-dr .v3c-bgt { -webkit-text-stroke-color: rgba(29, 33, 37, .22); }
body.v3 .r5-dr__bg, body.v3 .r21-sig__bg { display: none; }   /* 예전 흐르는 글자(CRAZY DOCTOR · SIGNATURE)는 같은 모양의 윤곽 제목으로 바꿈 */
@media (max-width: 1023px) {
  body.v3 .faq .faq__head { position: relative; }
  body.v3 .v3c-bgt--long { font-size: min(80px, 11.4vw); }   /* 긴 낱말(BEFORE & AFTER · YOUTUBE · BLOG)과 SIGNATURE 는 화면 폭 안에 */
  body.v3 .r21-sig .v3c-bgt { font-size: min(80px, 16.4vw); }
}

/* 3 · 왜 재식술은: 번호를 카드 왼쪽 위 모서리로, 아이콘 · 여백을 줄여 높이 낮게. 넓은 화면에서는 제목을 한 줄로 */
body.v3 .v3w-list { gap: clamp(14px, 1vw, 20px); }
body.v3 .v3w { padding: 22px clamp(18px, 1.3vw, 28px) 24px; }
body.v3 .v3w__no { position: absolute; left: clamp(18px, 1.3vw, 26px); top: 20px; }
body.v3 .v3w__ic { width: 64px; height: 72px; margin: 0; border-radius: 32px 32px 0 0; }
body.v3 .v3w__ic svg { width: 26px; height: 26px; margin-top: 6px; }
body.v3 .v3w__t { margin-top: 14px; }
body.v3 .v3w__d { margin-top: 6px; }
@media (min-width: 1800px) { body.v3 .v3w__t .br-pc { display: none; } }
@media (max-width: 767px) {
  body.v3 .v3w { display: grid; grid-template-columns: 64px minmax(0, 1fr); column-gap: 18px; align-items: center; padding: 20px 20px 22px; text-align: left; }
  body.v3 .v3w__no { left: auto; right: 18px; top: 18px; }
  body.v3 .v3w__ic { grid-row: 1 / span 2; width: 64px; height: 72px; border-radius: 32px 32px 0 0; }
  body.v3 .v3w__ic svg { width: 26px; height: 26px; }
  body.v3 .v3w__t { margin-top: 0; padding-right: 26px; font-size: 18px; }
  body.v3 .v3w__d { grid-column: 2; margin-top: 4px; font-size: 15px; }
}

/* 4 · 미친 치과의사: 사진이 섹션 전체(예전 .r12-dr 비율 1587:828). 밝은 그라데이션은 글자 자리에만(머리 배너와 같은 방식) — 원장 둘레는 막 없이 선명하게.
   수술실 장비(현미경 · 조명)의 어두운 곳 위에서도 금색 제목이 3:1 이상이 되는 세기. 좁은 PC 에서는 폭의 50% 안에서 끝나 원장에 닿지 않는다 */
@media (min-width: 1024px) {
  body.v3 .r12-dr { width: 100%; aspect-ratio: 1587 / 828; min-height: 560px; }   /* 폭을 정해 두지 않으면 좁은 PC(1024)에서 최소 높이가 폭을 1073px 로 밀어낸다 */
  body.v3 .r9-dr .r5-dr__ph { inset: 0; width: auto; }
  body.v3 .r9-dr .r5-dr__ph img { object-position: 100% 50%; }
  body.v3 .r9-dr .r5-dr__ph::after { display: block; background: linear-gradient(90deg, rgba(244, 247, 249, .84) 0, rgba(244, 247, 249, .8) min(calc(max(var(--gut), (100% - var(--maxw)) / 2) + 500px), 40%),
    rgba(244, 247, 249, .36) min(calc(max(var(--gut), (100% - var(--maxw)) / 2) + 620px), 45%), rgba(244, 247, 249, 0) min(calc(max(var(--gut), (100% - var(--maxw)) / 2) + 720px), 50%)); }
  body.v3 .r5-dr__in > :not(.v3c-bgt) { max-width: calc(44vw - var(--gut, 40px)); }
}
@media (max-width: 1023px) {
  body.v3 .r9-dr .r5-dr__ph { aspect-ratio: 4 / 3; }
  body.v3 .r9-dr .r5-dr__ph img { object-position: 50% 50%; }
}

/* 5 · 머리 배너: 어두운 그라데이션은 글자 자리에만(병원 캡처 z4Pvv6csAl.png 범위). 사진의 나머지는 어둡게 하지 않음 */
body.v3 .hero--ray::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, rgba(16, 13, 10, .62) 0, rgba(16, 13, 10, .54) min(calc(max(var(--gut), (100% - var(--maxw)) / 2) + 400px), 40%),
    rgba(16, 13, 10, .26) min(calc(max(var(--gut), (100% - var(--maxw)) / 2) + 640px), 55%), rgba(16, 13, 10, 0) min(calc(max(var(--gut), (100% - var(--maxw)) / 2) + 860px), 68%)); }
@media (max-width: 1023px) {
  body.v3 .hero--ray::before { background: linear-gradient(180deg, rgba(16, 13, 10, 0) 38%, rgba(16, 13, 10, .46) 54%, rgba(16, 13, 10, .62) 68%, rgba(16, 13, 10, .66) 100%); }
}

/* 6 · 자주 묻는 질문: 질문 굵게 흰색 · 답 글자 크게 흰색 · 돋보기(.v3-mirror 자리 그대로) */
@media (min-width: 1024px) { body.v3 .v3c-loupe { left: max(0px, calc((100% - var(--maxw)) / 2 - 120px)); bottom: 28px; } }   /* 손잡이 끝까지 보이게(예전 거울은 왼쪽 · 아래가 잘림) */
body.v3 .faq .acc summary { font-weight: 700; color: #fff; }
body.v3 .faq .acc details[open] summary { color: #fff; }
body.v3 .faq .acc summary:hover, body.v3 .fm .faq .acc summary:hover, body.v3 .faq .acc details[open] summary:hover { color: #f7e4b4; }
body.v3 .faq .acc__body p, body.v3 .faq .acc :is(p, li) { font-size: clamp(17px, .25vw + 14px, 18px); line-height: 1.78; color: #fff; }
@media (max-width: 1023px) {
  body.v3 .faq .acc summary { font-size: 17px; }
  body.v3 .faq .acc__body p { font-size: 16.5px; }
}