/* ==========================================================
   intro.css : 병원소개 공통 머리 + 메뉴 탭 (page/include/intro_nav.php)
========================================================== */
.mintro-head {
	--ink: #121212; --text: #4b4b52; --muted: #8b8b94; --line: #e9e7ee; --accent: #844ad7;
	padding-top: clamp(36px, 5vw, 72px);
	font-family: 'Pretendard Variable', Pretendard, sans-serif;
	color: var(--ink);
	word-break: keep-all;
}
.mintro-wrap { max-width: calc(var(--wrap, 1200px) + var(--gutter, 40px) * 2); margin: 0 auto; padding: 0 var(--gutter, 20px); box-sizing: border-box; }
.mintro-crumb { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: clamp(18px, 2.4vw, 28px); font-size: 13px; color: var(--muted); }
.mintro-crumb a { color: inherit; text-decoration: none; }
.mintro-crumb span:before, .mintro-crumb strong:before { content: '/'; margin-right: 8px; color: #cfcbd6; }
.mintro-crumb strong { font-weight: 600; color: var(--text); }
.mintro-label { margin: 0 0 10px; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.mintro-title { margin: 0; font-size: clamp(30px, 4vw, 48px); line-height: 1.2; font-weight: 800; letter-spacing: -.04em; }
.mintro-desc { max-width: 640px; margin: 14px 0 0; font-size: clamp(15px, 1.4vw, 17px); line-height: 1.7; color: var(--text); }

/* 병원소개 메뉴 탭 */
.mintro-nav { margin-top: clamp(28px, 3.6vw, 44px); border-bottom: 1px solid var(--line); }
.mintro-nav ul { display: flex; gap: clamp(18px, 2.6vw, 34px); margin: 0; padding: 0; list-style: none; overflow-x: auto; scrollbar-width: none; }
.mintro-nav ul::-webkit-scrollbar { display: none; }
.mintro-nav li { flex: 0 0 auto; }
.mintro-nav a { display: block; margin-bottom: -1px; padding: 14px 0 16px; border-bottom: 2px solid transparent; font-size: 15px; font-weight: 600; color: var(--muted); text-decoration: none; white-space: nowrap; transition: color .2s, border-color .2s; }
.mintro-nav a:hover { color: var(--ink); }
.mintro-nav a.is-current { color: var(--ink); border-bottom-color: var(--ink); }

/* 머리 아래 본문 첫 섹션 간격 정리 */
.mintro-head + .proc-section, .mintro-head + .mpr, .mintro-head + .mvd { padding-top: clamp(40px, 5vw, 72px) !important; }

@media screen and (max-width: 767px) {
	.mintro-wrap { padding: 0 16px; }
	.mintro-nav { margin-left: -16px; margin-right: -16px; }
	.mintro-nav ul { gap: 22px; padding: 0 16px; }
	.mintro-nav a { padding: 12px 0 14px; font-size: 14px; }
}

/* ----------------------------------------------------------
   병원소개 본문 (.proc--compact) : 닥터디자이너 소개 페이지 톤
   각진 사진, 섹션 머리 한 줄(제목 | 설명), 넓은 여백, 조용한 상담 띠
---------------------------------------------------------- */
.proc--compact { --section-y: clamp(80px, 10vw, 150px); }
.proc--compact :is(.proc-btext__image, .proc-btext__image img, .proc-bcards > li, .proc-bcards__image, .proc-bcards__image img,
	.proc-doc__photo, .proc-bimage img, .proc-btable__col, .mmap__map, .mmap__info, .proc-show__stage, .proc-show__thumb) { border-radius: 0 !important; }
.proc--compact .proc-eyebrow:before { display: none; }
.proc--compact .proc-eyebrow { margin-bottom: 10px; font-size: 15px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.proc--compact .proc-head { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: clamp(32px, 6vw, 88px); align-items: end; max-width: none; margin-bottom: clamp(36px, 4.4vw, 64px); }
.proc--compact .proc-head .proc-eyebrow { grid-column: 1 / -1; }
.proc--compact .proc-head .proc-h2 { grid-column: 1; font-size: clamp(26px, 2.6vw, 36px); }
.proc--compact .proc-head .proc-head__desc { grid-column: 2; margin: 0 0 .35em; font-size: 16px; }

/* 상담 유도 : 은은한 띠 + 각진 버튼 하나 */
.proc--compact .proc-section--tight { padding: 0; }
.proc--compact .proc-section--tight > .proc-wrap { max-width: none; padding: 0; }
.proc--compact .proc-cta {
	border-radius: 0;
	padding: clamp(72px, 9vw, 128px) var(--gutter, 20px);
	background: linear-gradient(115deg, #eef0f7 0%, #f5f2fa 45%, #eaeef6 100%);
	color: var(--ink);
}
.proc--compact .proc-cta .proc-eyebrow { justify-content: center; color: var(--accent); }
.proc--compact .proc-cta__title { font-size: clamp(22px, 2.4vw, 32px); font-weight: 700; }
.proc--compact .proc-cta__desc { color: var(--text); }
.proc--compact .proc-cta .proc-btn { height: 52px; border-radius: 0; box-shadow: none; transform: none; }
.proc--compact .proc-cta .proc-btn--primary { background: var(--ink); color: #fff; }
.proc--compact .proc-cta .proc-btn--primary:hover { background: var(--accent); }
.proc--compact .proc-cta .proc-btn--glass { background: transparent; color: var(--ink); border: 1px solid #cfccd8; }
.proc--compact .proc-cta .proc-btn--glass:hover { background: #fff; border-color: var(--ink); }

@media screen and (max-width: 767px) {
	.proc--compact .proc-head { grid-template-columns: 1fr; }
	.proc--compact .proc-head .proc-head__desc { grid-column: 1; margin-top: 10px; }
}

/* 머리 가운데 정렬 (닥터디자이너 소개 페이지처럼 제목만 간결하게) */
.mintro-head { text-align: center; }
.mintro-crumb { justify-content: center; }
.mintro-desc { margin-left: auto; margin-right: auto; }
.mintro-nav ul { justify-content: center; }
@media screen and (max-width: 1024px) { .mintro-nav ul { justify-content: flex-start; } }

/* 메뉴 탭 없이 : 머리 높이 줄여 본문이 첫 화면에 보이게 */
.mintro-head { padding-top: clamp(28px, 3.6vw, 52px); padding-bottom: clamp(8px, 1.4vw, 20px); }
.mintro-crumb { margin-bottom: 14px; }
.mintro-title { font-size: clamp(28px, 3.2vw, 40px); }
.mintro-desc { margin-top: 10px; }
.mintro-head + .proc-section, .mintro-head + .mpr, .mintro-head + .mvd, .mintro-head + .mev { padding-top: clamp(28px, 3.6vw, 48px) !important; }