/*
Theme Name: 호랑이부부한의원 피부클리닉
Theme URI: https://horangyi.mycafe24.com/
Description: 호랑이부부한의원 피부·다이어트 클리닉 독립 커스텀 테마. 변박사한의원 테마(byunbaksa-child)를 포크해 부모 테마(Astra) 의존을 제거하고 호랑이부부용으로 개조. 쿨화이트 미니멀 + 포인트 레드.
Author: 호랑이부부한의원
Version: 1.0.0
Text Domain: horangyi
*/

/* ============================================================
   GLOBAL :ROOT VARIABLES — 5개 페이지 공통
   ============================================================ */
:root {
  /* ★2026-08-11 쿨화이트 미니멀 + 포인트 레드 리컬러 (호랑이부부).
     변수명(navy/blue)은 대량 참조라 유지 — 값만 교체하면 전 페이지 자동 반영.
     navy계열 = 쿨 차콜(주 텍스트·버튼·다크 UI) / blue-accent계열 = 브랜드 레드(소면적 포인트만). */
  --navy: #1A1C20;         /* 주 텍스트·다크 요소 = 쿨 near-black (was #1B2A4A) */
  --navy-deep: #0E0F12;    /* 더 짙은 차콜 */
  --navy-light: #3A3D44;   /* 중간 차콜 */
  --blue-accent: #E4032E;  /* 브랜드 레드 — CTA·링크·점·호버 포인트 (was #3B6CB4) */
  --blue-soft: #FF3B58;    /* 밝은 레드 */
  --blue-pale: #FDECEF;    /* 레드 아주 옅은 배경 틴트 (was #EEF3FB) */
  --accent-ink: #B00020;   /* 짙은 레드 — 주요 CTA 호버/눌림 (tiger_bubu 동일 체계) */
  /* ★tiger_bubu 배너/FAB 컴포넌트 이식용 토큰 별칭 — 우리 쿨화이트+레드 팔레트로 매핑 */
  --ink: var(--navy);              /* 차콜(제목·강조) */
  --accent: var(--blue-accent);    /* 브랜드 레드 */
  --text: var(--text-secondary);   /* 본문 카피 */
  --muted: var(--text-muted);      /* 뮤트 */
  --faint: var(--gray-300);        /* 아주 옅은 */
  --line: var(--gray-200);         /* 경계선 */
  --bg2: var(--gray-100);          /* 옅은 배경 */
  --pad: clamp(20px, 5.5vw, 90px); /* ★라이브 tiger_bubu 섹션 공용 좌우 패딩 */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --white: #FFFFFF;
  --gray-50: #F8F9FB;
  --gray-100: #EFF1F5;
  --gray-200: #D8DCE4;
  --gray-300: #B0B8C8;
  --gray-400: #8892A4;
  --gray-500: #6B7280;
  --text-primary: #1A1C20;
  --text-secondary: #454A52;
  --text-muted: #667085; /* 2026-07-13 대비 개선: #8892A4(2.98:1, WCAG AA 실패) → #667085(~5:1 통과). 밝은 배경 전용 20곳 공통. */
  --shadow-sm: 0 1px 3px rgba(20,22,28,0.06);
  --shadow-md: 0 4px 16px rgba(20,22,28,0.08);
  --shadow-lg: 0 8px 32px rgba(20,22,28,0.10);
  --shadow-float: 0 40px 84px -50px rgba(26,28,32,0.5); /* ★공용 '공중에 뜬' 그림자 — 사진/영상/카드 부양감(access·philosophy 동일) */
  --radius: 12px;
  --radius-lg: 20px;
}

/* ============================================================
   ASTRA OVERRIDES — 부모 테마 기본값 무력화
   ============================================================ */
.byunbaksa-theme * { margin: 0; padding: 0; box-sizing: border-box; }
/* WordPress 어드민 바(#wpadminbar)는 우리 reset에서 제외 — Rank Math 로고 SVG 등이 거대화되는 문제 방지 */
#wpadminbar, #wpadminbar *, #wpadminbar svg, #wpadminbar img, #wpadminbar a, #wpadminbar span {
    margin: revert !important;
    padding: revert !important;
    box-sizing: revert !important;
    width: revert !important;
    height: revert !important;
    max-width: revert !important;
    max-height: revert !important;
}
html { scroll-behavior: smooth; overflow-x: hidden; }   /* ★가로overflow 클립은 html에(body에 두면 body가 스크롤컨테이너가 돼 position:sticky 를 깸) */
/* ★셀렉터 수정(2026-08-12): body 는 클래스를 '직접' 가지므로 '.byunbaksa-theme body'(descendant) 는 매칭 실패 →
   원래 의도한 폰트·배경·overflow·여백이 전부 미적용이었음. 'body.byunbaksa-theme' 로 잡아 정상 적용. */
body.byunbaksa-theme {
  --bb-ease: cubic-bezier(0.16, 1, 0.3, 1);   /* ★2026-08-14 전역화: 기존엔 .evdock/.evbar/.evmodal 에만 스코프돼 그 밖(lineup·spaces·cosmetics·approach)의 var(--bb-ease) transition 이 전부 무효(즉시 "툭")였음. 전역 정의로 일괄 해결. */
  /* ★2026-08-12 Pretendard(라이브 동일, header.php 다이나믹서브셋+swap 로드) 우선 + 시스템폰트 폴백.
     Pretendard 못 받으면 iOS/맥=Apple SD Gothic Neo, 안드로이드=Noto Sans CJK, 윈도우=Malgun 으로 자연 폴백. */
  font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif !important;
  color: var(--text-primary);
  background: var(--gray-50);   /* ★페이지 베이스 = 쿨 오프화이트(#F8F9FB, 푸터와 통일). 카드(#fff)는 위에 살짝 떠보임. 순백 #FFF는 넓은면적서 누렇게 뜨는 착시. */
  line-height: 1.7;
  margin: 0;   /* 브라우저 기본 8px 여백 제거 → 풀블리드(검정 푸터 등) 좌우 100% */
  -webkit-font-smoothing: antialiased;
  /* overflow-x:hidden 은 html 로 이동(위) — body에 두면 sticky 깨짐 */
}
/* Astra가 컨테이너를 강제로 max-width 1200px로 줄이는 걸 무력화 */
.byunbaksa-theme .ast-container,
.byunbaksa-theme .site-content,
.byunbaksa-theme #content,
.byunbaksa-theme .site-content > .ast-container,
.byunbaksa-theme #primary {
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}
.byunbaksa-theme .site-content { padding: 0 !important; }
.byunbaksa-theme .entry-header,
.byunbaksa-theme .entry-content > .ast-container { display: none; }
/* Astra 페이지 타이틀 영역(우리는 자체 hero로 처리) */
.byunbaksa-theme .ast-archive-description,
.byunbaksa-theme .page-title { display: none !important; }
/* Astra가 .entry-content에 padding 넣는 걸 우리가 제어하도록 */
.byunbaksa-theme .entry-content { margin: 0 !important; padding: 0 !important; }
/* Astra가 button에 자기 배경/색을 강제 적용 → 우리 자식테마 button 스타일 무력화 방지.
   우리가 정의한 .btn-primary, .nav-cta, .btn-secondary 등은 더 specific해서 영향 받지 않음. */
.byunbaksa-theme button {
    background: transparent;
    border: none;
    color: inherit;
    font-family: inherit;
    padding: 0;
    box-shadow: none;
    text-shadow: none;
}
.byunbaksa-theme button:hover,
.byunbaksa-theme button:focus { background: transparent; }

/* ============================================================
   NAV — 공통
   ============================================================ */
.byunbaksa-theme .nav { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; background: white; transition: background 0.25s ease, backdrop-filter 0.25s ease; }
.byunbaksa-theme .nav.scrolled { background: rgba(255,255,255,0.72); backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%); }
.byunbaksa-theme .nav-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; height: 72px; display: flex; align-items: center; justify-content: space-between; }
.byunbaksa-theme .nav-logo { font-size: 18px; font-weight: 700; color: var(--navy); letter-spacing: -0.5px; text-decoration: none; }
.byunbaksa-theme .nav-logo span { color: var(--blue-accent); }
.byunbaksa-theme .nav-links { display: flex; gap: 32px; list-style: none; }
.byunbaksa-theme .nav-links a { text-decoration: none; color: var(--text-secondary); font-size: 14px; font-weight: 500; transition: color 0.2s; }
.byunbaksa-theme .nav-links a:hover { color: var(--navy); }
.byunbaksa-theme .nav-cta { background: var(--blue-accent); color: var(--white) !important; padding: 10px 24px; border-radius: 999px; font-size: 14px !important; transition: background 0.2s !important; }
.byunbaksa-theme .nav-cta:hover { background: var(--accent-ink) !important; }

/* ── 진료과목 드롭다운 (PC) ── */
.byunbaksa-theme .nav-has-dropdown { position: relative; }
.byunbaksa-theme .nav-has-dropdown > a { display: inline-flex; align-items: center; gap: 4px; }
.byunbaksa-theme .nav-caret { transition: transform 0.25s ease; opacity: 0.6; }
.byunbaksa-theme .nav-has-dropdown:hover > a,
.byunbaksa-theme .nav-has-dropdown:focus-within > a { color: var(--navy); }
.byunbaksa-theme .nav-has-dropdown:hover .nav-caret,
.byunbaksa-theme .nav-has-dropdown:focus-within .nav-caret { transform: rotate(180deg); opacity: 1; }
.byunbaksa-theme .nav-dropdown {
  position: absolute; top: calc(100% + 14px); left: 50%; transform: translateX(-50%) translateY(8px);
  min-width: 240px; list-style: none; margin: 0; padding: 8px;
  background: rgba(255,255,255,0.88); backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(26, 28, 32,0.08); border-radius: 14px; box-shadow: 0 12px 40px rgba(26, 28, 32,0.14);
  opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s;
}
/* 호버 갭 방지용 투명 브릿지 */
.byunbaksa-theme .nav-dropdown::before { content: ''; position: absolute; top: -14px; left: 0; right: 0; height: 14px; }
.byunbaksa-theme .nav-has-dropdown:hover .nav-dropdown,
.byunbaksa-theme .nav-has-dropdown:focus-within .nav-dropdown {
  opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0);
}
.byunbaksa-theme .nav-dropdown li { list-style: none; }
.byunbaksa-theme .nav-dropdown a {
  display: block; padding: 11px 14px; border-radius: 9px; font-size: 14px; font-weight: 500;
  color: var(--text-secondary); white-space: nowrap; transition: background 0.18s, color 0.18s;
}
.byunbaksa-theme .nav-dropdown a:hover { background: var(--navy); color: var(--white) !important; }

.byunbaksa-theme .nav-mobile-btn { display: none; background: none; border: none; cursor: pointer; width: 32px; height: 32px; position: relative; transition: transform 0.2s ease; }
.byunbaksa-theme .nav-mobile-btn:hover { transform: scale(1.08); }
.byunbaksa-theme .nav-mobile-btn span { display: block; width: 20px; height: 2px; background: var(--navy); position: absolute; left: 6px; transition: background 0.25s, top 0.3s, transform 0.3s, opacity 0.3s; transform-origin: left center; }
.byunbaksa-theme .nav-mobile-btn span:nth-child(1) { top: 10px; }
.byunbaksa-theme .nav-mobile-btn span:nth-child(2) { top: 16px; }
.byunbaksa-theme .nav-mobile-btn span:nth-child(3) { top: 22px; }
.byunbaksa-theme .nav-mobile-btn:hover span { background: var(--blue-accent); }
.byunbaksa-theme .nav-mobile-btn:not(.open) span:nth-child(1) { animation: hamWave 3s ease-in-out infinite 0s; }
.byunbaksa-theme .nav-mobile-btn:not(.open) span:nth-child(2) { animation: hamWave 3s ease-in-out infinite 0.25s; }
.byunbaksa-theme .nav-mobile-btn:not(.open) span:nth-child(3) { animation: hamWave 3s ease-in-out infinite 0.5s; }
@keyframes hamWave { 0%, 60%, 100% { transform: scaleX(1); } 30% { transform: scaleX(0.65); } }
.byunbaksa-theme .nav-mobile-btn.open span:nth-child(1) { top: 16px; transform: rotate(45deg); transform-origin: center; animation: none; }
.byunbaksa-theme .nav-mobile-btn.open span:nth-child(2) { opacity: 0; animation: none; }
.byunbaksa-theme .nav-mobile-btn.open span:nth-child(3) { top: 16px; transform: rotate(-45deg); transform-origin: center; animation: none; }
@media (prefers-reduced-motion: reduce) { .byunbaksa-theme .nav-mobile-btn:not(.open) span { animation: none !important; } }

.byunbaksa-theme .mobile-menu, .byunbaksa-theme .mobile-menu-backdrop { display: none; }

/* ════════════════════════════════════════════════════════════
   FLOATING GLASS PILL HEADER (tiger_bubu 이식 · 레드→네이비)
   구 .nav / .mobile-menu 규칙은 마크업이 .hdr 로 교체되어 비활성(무시됨).
   ════════════════════════════════════════════════════════════ */
.byunbaksa-theme .hdr { position: fixed; top: 14px; left: 0; right: 0; z-index: 1600;
  padding: 0 clamp(14px, 3vw, 30px); transition: top .4s cubic-bezier(0.16,1,0.3,1); pointer-events: none; }
.byunbaksa-theme .hdr-inner { pointer-events: auto; max-width: 1180px; margin: 0 auto;
  background: rgba(255,255,255,.70); backdrop-filter: blur(22px) saturate(180%); -webkit-backdrop-filter: blur(22px) saturate(180%);
  border: 1px solid rgba(255,255,255,.9); border-radius: 16px; padding: 0 24px; overflow: hidden;
  box-shadow: 0 0 0 .5px rgba(26, 28, 32,.15), 0 2px 8px -2px rgba(26, 28, 32,.14), 0 20px 44px -16px rgba(26, 28, 32,.46), inset 0 1px 0 rgba(255,255,255,.8);
  transition: box-shadow .4s cubic-bezier(0.16,1,0.3,1), border-radius .38s cubic-bezier(0.16,1,0.3,1), background .4s; }
.byunbaksa-theme .hdr.solid { top: 8px; }
.byunbaksa-theme .hdr.solid .hdr-inner { background: rgba(255,255,255,.74); box-shadow: 0 0 0 .5px rgba(26, 28, 32,.15), 0 2px 8px -2px rgba(26, 28, 32,.14), 0 22px 48px -16px rgba(26, 28, 32,.48), inset 0 1px 0 rgba(255,255,255,.8); }
.byunbaksa-theme .hdr.dropopen .hdr-inner { border-radius: 20px; box-shadow: 0 0 0 .5px rgba(26, 28, 32,.15), 0 24px 58px -20px rgba(26, 28, 32,.44), inset 0 1px 0 rgba(255,255,255,.7); }
.byunbaksa-theme .hdr.navopen .hdr-inner { background: rgba(255,255,255,.95); border-radius: 20px; box-shadow: 0 0 0 .5px rgba(26, 28, 32,.15), 0 26px 62px -20px rgba(26, 28, 32,.46), inset 0 1px 0 rgba(255,255,255,.8); }
.byunbaksa-theme .hdr-bar { position: relative; height: 60px; display: grid; grid-template-columns: 1.6fr auto 1fr; align-items: center; transition: height .4s cubic-bezier(0.16,1,0.3,1); }
.byunbaksa-theme .hdr.solid .hdr-bar { height: 54px; }
.byunbaksa-theme .hdr-left { justify-self: start; display: flex; align-items: center; gap: 14px; min-width: 0; }
.byunbaksa-theme .hdr-logo { display: flex; align-items: center; flex-shrink: 0; font-size: 19px; font-weight: 700; letter-spacing: -0.5px; color: var(--navy); text-decoration: none; }
.byunbaksa-theme .hdr-logo span { color: var(--blue-accent); }
/* ★2026-08-11 호랑이부부 원형 심볼 로고(data/logo_symbol.png) — tiger_bubu 동일 30px */
.byunbaksa-theme .hdr-logo img { height: 30px; width: auto; display: block; transition: height .3s ease; }
.byunbaksa-theme .hdr.solid .hdr-logo img { height: 27px; }

/* 좌측 회전 티커 (클리닉 라인업 ⟳ 네이버 실시간 진료상태) */
.byunbaksa-theme .hdr-ticker { height: 22px; overflow: hidden; min-width: 0; }
.byunbaksa-theme .hdr-ticker-track { display: flex; flex-direction: column; transition: transform .6s cubic-bezier(0.16,1,0.3,1); }
.byunbaksa-theme .hdr-ticker-item { height: 22px; line-height: 22px; white-space: nowrap;
  font-size: 13px; letter-spacing: -0.01em; color: var(--text-secondary); }
.byunbaksa-theme .hdr-ticker-item b { font-weight: 600; color: var(--blue-accent); }
.byunbaksa-theme .hdr-ticker-item .dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #9A9CA0;
  margin-right: 6px; vertical-align: middle; position: relative; top: -1px; }
.byunbaksa-theme .hdr-ticker-item.st-open  .dot { background: #12B76A; animation: bbStatusPulse 2.4s ease-in-out infinite; }
.byunbaksa-theme .hdr-ticker-item.st-break .dot { background: #F79009; }
.byunbaksa-theme .hdr-ticker-item.st-closed .dot { background: #C3C5C8; }
.byunbaksa-theme .hdr-ticker-item .st { font-weight: 600; color: var(--navy); }
.byunbaksa-theme .hdr-ticker-item.st-closed .st { color: #9A9CA0; font-weight: 500; }
.byunbaksa-theme .hdr-ticker-item .sub { color: #9A9CA0; margin-left: 4px; }
@keyframes bbStatusPulse { 0%{box-shadow:0 0 0 0 rgba(18,183,106,.45);} 70%{box-shadow:0 0 0 5px rgba(18,183,106,0);} 100%{box-shadow:0 0 0 0 rgba(18,183,106,0);} }

.byunbaksa-theme .hdr-nav { justify-self: center; display: flex; gap: clamp(16px, 2vw, 32px); }
.byunbaksa-theme .hdr-nav a { font-size: 15px; font-weight: 500; letter-spacing: -0.01em; color: var(--text-secondary); position: relative; padding: 10px 0; text-decoration: none; white-space: nowrap; }
.byunbaksa-theme .hdr-nav a::after { content:''; position: absolute; left: 0; right: 0; bottom: 6px; height: 1.5px;
  background: var(--blue-accent); transform: scaleX(0); transform-origin: left; transition: transform .4s cubic-bezier(0.16,1,0.3,1); }
.byunbaksa-theme .hdr-nav a:hover::after, .byunbaksa-theme .hdr-nav a.on::after { transform: scaleX(1); }
.byunbaksa-theme .hdr-nav a:hover, .byunbaksa-theme .hdr-nav a.on { color: var(--navy); }
.byunbaksa-theme .hdr-right { justify-self: end; display: flex; align-items: center; }

/* PC 가로 서브메뉴 (아코디언) */
.byunbaksa-theme .hdr-drop { max-height: 0; overflow: hidden; transition: max-height .38s cubic-bezier(0.16,1,0.3,1); border-top: 0 solid #E8E9EC; }
.byunbaksa-theme .hdr.dropopen .hdr-drop { max-height: 72px; border-top: .5px solid #E8E9EC; }
.byunbaksa-theme .hdr-sub { display: none; justify-content: center; flex-wrap: wrap; gap: clamp(20px, 3vw, 40px); padding: 17px 2px 19px; }
.byunbaksa-theme .hdr-sub.show { display: flex; }
.byunbaksa-theme .hdr-sub a { font-size: 13.5px; color: #9A9CA0; letter-spacing: -0.01em; transition: color .25s cubic-bezier(0.16,1,0.3,1); white-space: nowrap; text-decoration: none; }
.byunbaksa-theme .hdr-sub a:hover { color: var(--navy); }

/* 버거 (2줄 → X) */
.byunbaksa-theme .hdr-burger { display: none; width: 26px; height: 14px; position: relative; background: none; border: none; cursor: pointer; padding: 0; }
.byunbaksa-theme .hdr-burger span { position: absolute; left: 0; width: 26px; height: 1.5px; background: var(--navy);
  transition: transform .38s cubic-bezier(0.16,1,0.3,1), opacity .2s; }
.byunbaksa-theme .hdr-burger span:nth-child(1) { top: 3px; }
.byunbaksa-theme .hdr-burger span:nth-child(2) { top: 10px; }
.byunbaksa-theme .hdr.navopen .hdr-burger span:nth-child(1) { top: 6.5px; transform: rotate(45deg); }
.byunbaksa-theme .hdr.navopen .hdr-burger span:nth-child(2) { top: 6.5px; transform: rotate(-45deg); }
@media (max-width: 900px) {
  .byunbaksa-theme .hdr-bar { grid-template-columns: 1fr auto; height: 54px; }
  .byunbaksa-theme .hdr-nav, .byunbaksa-theme .hdr-drop { display: none; }
  .byunbaksa-theme .hdr-burger { display: block; }
}
/* 모바일에서도 티커 유지 — 로고·티커 폰트만 줄여 공간 확보(넘치면 자동 클립). ~360px 이하만 숨김. */
@media (max-width: 600px) { .byunbaksa-theme .hdr-logo { font-size: 17px; } .byunbaksa-theme .hdr-ticker-item { font-size: 12px; } }
@media (max-width: 360px) { .byunbaksa-theme .hdr-ticker { display: none; } }

/* 모바일 2단 패널 (알약이 아래로 늘어남) */
.byunbaksa-theme .hdr-mob { display: none; max-height: 0; overflow: hidden; transition: max-height .42s cubic-bezier(0.16,1,0.3,1); }
.byunbaksa-theme .hdr.navopen .hdr-mob { overflow-y: auto; -webkit-overflow-scrolling: touch; }
.byunbaksa-theme .hdr-mob-cols { display: flex; border-top: 1px solid #E8E9EC; min-height: 300px; }
.byunbaksa-theme .hdr-mob-left { flex: 0 0 44%; border-right: 1px solid #E8E9EC; padding: 10px 0; }
.byunbaksa-theme .hdr-mob-left button { display: flex; align-items: baseline; gap: 8px; width: 100%; text-align: left;
  padding: 13px 6px; font-size: 15.5px; font-weight: 500; letter-spacing: -0.02em; color: #9A9CA0;
  position: relative; transition: color .25s cubic-bezier(0.16,1,0.3,1); background: none; border: none; cursor: pointer; }
.byunbaksa-theme .hdr-mob-left button .en { font-size: 11px; font-weight: 400; letter-spacing: .04em; color: #C3C5C8; }
.byunbaksa-theme .hdr-mob-left button.on { color: var(--navy); }
.byunbaksa-theme .hdr-mob-left button.on::before { content:''; position: absolute; left: -1px; top: 10px; bottom: 10px; width: 2.5px;
  background: var(--blue-accent); border-radius: 2px; }
.byunbaksa-theme .hdr-mob-right { flex: 1; padding: 12px 0 12px 20px; }
.byunbaksa-theme .hdr-mob-sub { display: none; flex-direction: column; }
.byunbaksa-theme .hdr-mob-sub.show { display: flex; }
.byunbaksa-theme .hdr-mob-sub a { padding: 11px 4px; font-size: 14.5px; color: var(--text-secondary); letter-spacing: -0.01em; transition: color .25s cubic-bezier(0.16,1,0.3,1); text-decoration: none; }
.byunbaksa-theme .hdr-mob-sub a:hover { color: var(--blue-accent); }
.byunbaksa-theme .hdr-mob-foot { display: flex; flex-wrap: wrap; gap: 18px; padding: 18px 4px 4px; border-top: 1px solid #E8E9EC;
  font-size: 13px; color: #9A9CA0; }
.byunbaksa-theme .hdr-mob-foot a { color: #9A9CA0; transition: color .25s cubic-bezier(0.16,1,0.3,1); text-decoration: none; }
.byunbaksa-theme .hdr-mob-foot a:hover { color: var(--navy); }
@media (max-width: 900px) { .byunbaksa-theme .hdr-mob { display: block; } }

/* (기존 PC 플로팅 CTA .fab-cta 제거 — 연락 채널이 하단 스티키바로 통합됨) */

.byunbaksa-theme .mobile-menu-close { position: absolute; top: 18px; right: 18px; width: 40px; height: 40px; border: none !important; background: transparent !important; color: var(--navy) !important; cursor: pointer; display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: background 0.2s; z-index: 2; padding: 0; }
.byunbaksa-theme .mobile-menu-close:hover, .byunbaksa-theme .mobile-menu-close:active { background: var(--gray-50) !important; }
.byunbaksa-theme .mobile-menu-close svg { stroke: var(--navy) !important; fill: none !important; pointer-events: none; }

/* ============================================================
   FOOTER — 공통
   ============================================================ */
/* ══ ACCESS (찾아오시는 길) + FOOTER (검정 슬림) — tiger_bubu 이식(2026-08-12). 쿨화이트+차콜+레드 토큰 스코프. ══ */
.byunbaksa-theme .access { background: var(--gray-50); padding: clamp(78px, 11vh, 150px) clamp(20px, 5.5vw, 90px) clamp(64px, 8vh, 96px); }   /* 라이트 푸터(gray-50)로 이어짐 — 과한 하단여백 정상화(2026-08-12) */
.byunbaksa-theme .access-in { max-width: 1180px; margin: 0 auto; }
.byunbaksa-theme .access-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; flex-wrap: wrap; margin-bottom: clamp(46px, 5.5vw, 88px); }   /* ★제목↔사진 여백 넉넉히 */
.byunbaksa-theme .access-kick { font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--blue-accent); display: block; margin-bottom: 20px; }
.byunbaksa-theme .access-h { font-size: clamp(27px, 3.8vw, 46px); font-weight: 600; letter-spacing: -0.045em; color: var(--navy); line-height: 1.32; }   /* ★히어로 제목(볼드 600)과 두께 통일 */
.byunbaksa-theme .access-lead { font-size: 15px; font-weight: 400; color: var(--text-muted); line-height: 1.9; text-align: right; word-break: keep-all; }
.byunbaksa-theme .access-photo { position: relative; border-radius: 20px; overflow: hidden; background: var(--gray-100); box-shadow: 0 40px 84px -50px rgba(26, 28, 32, 0.5); }   /* ★공중에 뜬 느낌 — 변박사 메인 사진(.philosophy-photo)과 동일 그림자 */
.byunbaksa-theme .access-photo img { width: 100%; height: 100%; aspect-ratio: 16 / 9; object-fit: cover; object-position: center 50%; display: block; }
.byunbaksa-theme .access-live { position: absolute; left: clamp(16px, 2vw, 28px); bottom: clamp(16px, 2vw, 28px); display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 100px; font-size: 13px;
  background: rgba(255,255,255,.82); backdrop-filter: blur(14px) saturate(1.6); -webkit-backdrop-filter: blur(14px) saturate(1.6); border: .8px solid rgba(255,255,255,.9); box-shadow: 0 12px 30px -14px rgba(26,28,32,.45); }
.byunbaksa-theme .access-live .dot { width: 7px; height: 7px; border-radius: 50%; background: #C3C5C8; flex-shrink: 0; }
.byunbaksa-theme .access-live .txt { font-weight: 600; color: var(--navy); }
.byunbaksa-theme .access-live .sep { color: #C3C5C8; }
.byunbaksa-theme .access-live .sub { color: var(--text-muted); }
.byunbaksa-theme .access-live.st-open .dot { background: #12B76A; animation: bbEvPulse 2.4s ease-in-out infinite; }
.byunbaksa-theme .access-live.st-open .txt { color: #0E8A50; }
.byunbaksa-theme .access-live.st-break .dot { background: #F79009; }
.byunbaksa-theme .access-live.st-closed .txt { color: var(--text-muted); font-weight: 500; }
.byunbaksa-theme .access-ledger { display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: clamp(24px, 3.4vw, 56px); margin-top: clamp(34px, 4.5vw, 64px); padding-top: clamp(26px, 3vw, 40px); border-top: 1px solid var(--navy); }   /* ★사진↔레저 구분선(라이브 동일) + 여백 */
.byunbaksa-theme .acc-col { display: flex; flex-direction: column; }
.byunbaksa-theme .acc-lb { display: flex; align-items: baseline; gap: 9px; font-size: 11px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--navy); margin-bottom: 18px; }
.byunbaksa-theme .acc-lb i { font-style: normal; font-size: 10.5px; color: var(--accent); letter-spacing: .06em; }   /* ★01·02·03 = 브랜드 레드 */
.byunbaksa-theme .acc-main { font-size: clamp(18px, 1.7vw, 22px); font-weight: 400; letter-spacing: -0.035em; color: var(--navy); line-height: 1.4; }
.byunbaksa-theme .acc-meta { margin-top: 7px; font-size: 13.5px; color: var(--text-muted); }
.byunbaksa-theme .acc-meta b { color: var(--text-secondary); font-weight: 600; }
.byunbaksa-theme .acc-note { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--gray-100); font-size: 13px; color: var(--text-muted); line-height: 1.75; word-break: keep-all; }
.byunbaksa-theme .acc-grp { padding: 11px 0; border-bottom: 1px solid var(--gray-100); }
.byunbaksa-theme .acc-grp:first-of-type { padding-top: 0; }
.byunbaksa-theme .acc-grp:last-of-type { border-bottom: 0; padding-bottom: 0; }
.byunbaksa-theme .acc-row { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; font-size: 14px; color: var(--text-muted); }
.byunbaksa-theme .acc-row em { font-style: normal; color: var(--navy); font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
.byunbaksa-theme .acc-sub { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; position: relative; padding-left: 14px; margin-top: 8px; font-size: 12.5px; color: var(--text-muted); }
.byunbaksa-theme .acc-sub::before { content: ''; position: absolute; left: 0; top: .62em; width: 6px; height: 1px; background: #C3C5C8; }
.byunbaksa-theme .acc-sub em { font-style: normal; color: var(--navy); font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
.byunbaksa-theme .acc-tail { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.byunbaksa-theme .acc-badge { font-size: 11px; font-weight: 600; letter-spacing: .02em; color: var(--text-secondary); border: 1px solid var(--gray-200); padding: 4px 10px; border-radius: 20px; }
.byunbaksa-theme .acc-lo { font-size: 12px; color: var(--text-muted); }

/* FOOTER — 라이트·미니멀(변박사 원본 스타일). 화이트+그레이 기본, 사이트맵·검정배경·reveal 제거(2026-08-12). */
.byunbaksa-theme .footer { background: var(--gray-50); color: var(--text-muted); padding: clamp(46px, 6vh, 64px) clamp(22px, 5.5vw, 90px) 120px; border-top: 1px solid var(--gray-100); }
.byunbaksa-theme .footer-top { max-width: 1180px; margin: 0 auto; }
.byunbaksa-theme .footer-logo { font-size: clamp(15.5px, 1.6vw, 18px); font-weight: 700; color: var(--navy); letter-spacing: -0.02em; }
.byunbaksa-theme .footer-tagline { font-size: clamp(19px, 2.4vw, 26px); font-weight: 400; color: var(--navy); letter-spacing: -0.03em; line-height: 1.4; margin: 12px 0 0; word-break: keep-all; }
.byunbaksa-theme .footer-tagline em { font-style: normal; font-weight: 700; }
.byunbaksa-theme .footer-eeat { font-size: 13.5px; color: var(--text-secondary); line-height: 1.8; margin: 16px 0 0; max-width: 620px; word-break: keep-all; }
.byunbaksa-theme .footer-bottom { max-width: 1180px; margin: clamp(30px, 5vw, 40px) auto 0; padding-top: 26px; border-top: 1px solid var(--gray-100); display: flex; justify-content: space-between; align-items: flex-start; gap: 18px 40px; flex-wrap: wrap; }
.byunbaksa-theme .footer-info { font-size: 12.5px; color: var(--text-muted); line-height: 1.9; word-break: keep-all; }
.byunbaksa-theme .footer-links { display: flex; flex-wrap: wrap; gap: 18px; flex-shrink: 0; }
.byunbaksa-theme .footer-links a, .byunbaksa-theme .footer-links button { color: var(--text-secondary); text-decoration: none; font-size: 13.5px; font-weight: 500; transition: color 0.2s; background: none; border: none; padding: 0; cursor: pointer; font-family: inherit; }
.byunbaksa-theme .footer-links a:hover, .byunbaksa-theme .footer-links button:hover { color: var(--navy); }
.byunbaksa-theme .footer-copy { max-width: 1180px; margin: 18px auto 0; font-size: 12px; color: var(--text-muted); letter-spacing: 0.01em; word-break: keep-all; }
@media (max-width: 760px) {
	.byunbaksa-theme .access-top { align-items: flex-start; flex-direction: column; gap: 14px; }
	.byunbaksa-theme .access-lead { text-align: left; }
	.byunbaksa-theme .access-photo img { aspect-ratio: 4 / 3; }
	.byunbaksa-theme .access-ledger { grid-template-columns: 1fr; gap: 0; }
	.byunbaksa-theme .acc-col { padding: 22px 0; border-bottom: 1px solid var(--gray-100); }
	.byunbaksa-theme .acc-col:first-child { padding-top: 0; }
	.byunbaksa-theme .acc-col:last-child { border-bottom: 0; }
	.byunbaksa-theme .acc-lb { margin-bottom: 14px; }
	.byunbaksa-theme .footer { padding: 46px 22px 110px; }
	.byunbaksa-theme .footer-tagline { font-size: 19px; margin-top: 10px; }
	.byunbaksa-theme .footer-eeat { font-size: 12.5px; margin-top: 13px; max-width: none; }
	.byunbaksa-theme .footer-bottom { flex-direction: column; gap: 16px; margin-top: 30px; padding-top: 22px; }
	.byunbaksa-theme .footer-copy { margin-top: 16px; }
	/* 모바일 사업자정보 = 항목이 줄 중간에 끊기지 않게 · 구분자를 줄바꿈으로(PC는 " · " 인라인 유지) */
	.byunbaksa-theme .footer-info .fi-sep, .byunbaksa-theme .footer-copy .fi-sep { display: block; height: 0; line-height: 0; font-size: 0; }
}

/* ============================================================
   CTA SECTION — 공통
   ============================================================ */
/* 라이트 톤(하이엔드 화이트): CTA=연블루페일 배경. 초록/노랑 알약 → 화이트 버튼+헤어라인+작은 브랜드 마크(색은 마크에만). */
.byunbaksa-theme .cta-section { background: var(--blue-pale); padding: 84px 24px 74px; text-align: center; color: var(--navy); }
/* 글 상세(single)에서만 related-posts 다음 CTA 위 여백 — 다른 페이지는 영향 없음 */
.byunbaksa-theme.single .cta-section { margin-top: 80px; }
.byunbaksa-theme .cta-section h2 { font-size: clamp(24px, 3vw, 32px); font-weight: 400; margin-bottom: 12px; letter-spacing: -0.5px; color: var(--navy); }
.byunbaksa-theme .cta-section p { font-size: 15.5px; color: var(--text-secondary); margin-bottom: 34px; }
.byunbaksa-theme .cta-buttons { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.byunbaksa-theme .cta-btn-naver, .byunbaksa-theme .cta-btn-kakao { display: inline-flex; align-items: center; gap: 10px; background: #fff; color: var(--navy); border: 1px solid var(--gray-200); padding: 14px 26px; border-radius: 12px; font-size: 15px; font-weight: 600; text-decoration: none; transition: transform 0.25s cubic-bezier(.16,1,.3,1), box-shadow 0.25s, border-color 0.25s; box-shadow: 0 10px 26px -16px rgba(26, 28, 32,0.28); }
.byunbaksa-theme .cta-btn-naver:hover, .byunbaksa-theme .cta-btn-kakao:hover { transform: translateY(-2px); border-color: var(--navy); box-shadow: 0 16px 34px -16px rgba(26, 28, 32,0.4); }
.byunbaksa-theme .cta-naver-mark { display: inline-flex; width: 20px; height: 20px; background: #03C75A; color: #fff; font-weight: 800; font-size: 12px; border-radius: 6px; align-items: center; justify-content: center; line-height: 1; }
.byunbaksa-theme .cta-kakao-mark { display: inline-flex; width: 20px; height: 20px; background: #FEE500; color: #3A1D1D; border-radius: 6px; align-items: center; justify-content: center; }
.byunbaksa-theme .cta-kakao-mark svg { display: block; }

/* ============================================================
   REVEAL ANIMATION — 공통
   ============================================================ */
.byunbaksa-theme .reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1); will-change: opacity, transform; }
.byunbaksa-theme .reveal.in-view, .byunbaksa-theme .reveal.in { opacity: 1; transform: translateY(0); will-change: auto; }   /* ★will-change 해제(세션10): in-view 후에도 레이어 승격이 유지되면 내부 <video>가 모바일 GPU에서 색보정을 건너뛰어 "쨍"해지던 것(특히 process 영상=검정 프레임) 차단. 애니 끝난 뒤 합성 레이어에서 내려 색보정 복구. */
.byunbaksa-theme .reveal.d1 { transition-delay: 0.08s; }
.byunbaksa-theme .reveal.d2 { transition-delay: 0.16s; }
.byunbaksa-theme .reveal.d3 { transition-delay: 0.24s; }
.byunbaksa-theme .reveal.d4 { transition-delay: 0.32s; }
.byunbaksa-theme .reveal.d5 { transition-delay: 0.4s; }

/* ============================================================
   ★ MAIN PAGE (front-page.php)
   ============================================================ */
.byunbaksa-theme .hero { padding: 160px 24px 100px; max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; min-height: 90vh; }
.byunbaksa-theme .hero-content { animation: fadeUp 0.8s ease-out; }
@keyframes blink { 0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(59,108,180,0.4); } 50% { opacity: 0.3; box-shadow: 0 0 0 6px rgba(59,108,180,0); } }
.byunbaksa-theme .hero h1 { font-size: 44px; font-weight: 300; line-height: 1.3; letter-spacing: -1.5px; color: var(--navy); margin-bottom: 20px; }
.byunbaksa-theme .hero h1 em { font-style: normal; color: var(--blue-accent); }
.byunbaksa-theme .hero-desc { font-size: 17px; color: var(--text-secondary); line-height: 1.8; margin-bottom: 40px; max-width: 480px; }
.byunbaksa-theme .btn-primary { display: inline-flex; align-items: center; gap: 8px; background: var(--blue-accent); color: var(--white); padding: 16px 32px; border-radius: 999px; font-size: 15px; font-weight: 600; text-decoration: none; transition: all 0.25s; border: none; cursor: pointer; }
.byunbaksa-theme .btn-primary:hover { background: var(--accent-ink); transform: translateY(-1px); box-shadow: var(--shadow-md); }
.byunbaksa-theme .btn-naver { display: inline-flex; align-items: center; gap: 8px; background: #03C75A; color: white; padding: 16px 32px; border-radius: 10px; font-size: 15px; font-weight: 600; text-decoration: none; transition: all 0.25s; border: none; cursor: pointer; }
.byunbaksa-theme .btn-naver:hover { background: #02B14E; transform: translateY(-1px); box-shadow: var(--shadow-md); }
.byunbaksa-theme .btn-naver-n { display: inline-flex; width: 18px; height: 18px; background: white; color: #03C75A; font-weight: 800; font-size: 11px; border-radius: 4px; align-items: center; justify-content: center; line-height: 1; }
.byunbaksa-theme .btn-kakao { display: inline-flex; align-items: center; gap: 8px; background: #FEE500; color: #191919; padding: 16px 32px; border-radius: 10px; font-size: 15px; font-weight: 600; text-decoration: none; transition: all 0.25s; border: none; cursor: pointer; }
.byunbaksa-theme .btn-kakao:hover { background: #F5DC00; transform: translateY(-1px); box-shadow: var(--shadow-md); }
.byunbaksa-theme .btn-secondary { display: inline-flex; align-items: center; gap: 8px; background: var(--white); color: var(--navy); padding: 16px 32px; border-radius: 10px; font-size: 15px; font-weight: 600; font-family: inherit; text-decoration: none; border: 1.5px solid var(--gray-200); transition: all 0.25s; cursor: pointer; }
.byunbaksa-theme .btn-secondary:hover:not(:disabled) { border-color: var(--navy); transform: translateY(-1px); }
.byunbaksa-theme .btn-secondary:disabled { opacity: 0.6; cursor: wait; }

.byunbaksa-theme .hero-visual { display: flex; justify-content: center; align-items: center; animation: fadeUp 0.8s ease-out 0.2s both; }
.byunbaksa-theme .hero-video-wrap { width: 100%; max-width: 540px; aspect-ratio: 16/9; border-radius: var(--radius-lg); position: relative; box-shadow: var(--shadow-lg); background: var(--navy-deep); }
.byunbaksa-theme .hero-video-link { display: block; width: 100%; height: 100%; position: relative; overflow: hidden; border-radius: var(--radius-lg); }
.byunbaksa-theme .hero-video-thumb { width: 100%; height: 100%; object-fit: cover; }
.byunbaksa-theme .hero-video-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 72px; height: 72px; border-radius: 50%; background: rgba(26, 28, 32,0.85); display: flex; align-items: center; justify-content: center; transition: all 0.3s; padding-left: 4px; }
.byunbaksa-theme .hero-video-link:hover .hero-video-play { background: var(--blue-accent); transform: translate(-50%, -50%) scale(1.1); }

.byunbaksa-theme .stats { background: var(--gray-50); border-top: 1px solid var(--gray-100); border-bottom: 1px solid var(--gray-100); }
.byunbaksa-theme .stats-inner { max-width: 1200px; margin: 0 auto; padding: 56px 24px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; }
.byunbaksa-theme .stat-item { text-align: center; }
.byunbaksa-theme .stat-number { font-size: 36px; font-weight: 700; color: var(--navy); letter-spacing: -1px; line-height: 1; margin-bottom: 8px; }
.byunbaksa-theme .stat-number span { color: var(--navy); }
.byunbaksa-theme .stat-label { font-size: 14px; color: var(--text-muted); font-weight: 400; }

.byunbaksa-theme .section { padding: 100px 24px; max-width: 1200px; margin: 0 auto; }
.byunbaksa-theme .section-header { text-align: center; margin-bottom: 64px; }
.byunbaksa-theme .section-tag { font-size: 13px; font-weight: 600; color: var(--blue-accent); text-transform: uppercase; letter-spacing: 2px; margin-bottom: 16px; }
.byunbaksa-theme .section-title { font-size: 34px; font-weight: 400; color: var(--navy); letter-spacing: -1px; line-height: 1.35; margin-bottom: 16px; }
.byunbaksa-theme .section-desc { font-size: 16px; color: var(--text-secondary); max-width: 560px; margin: 0 auto; }

/* ── 진료철학 = 라이트 에디토리얼(다크밴드·이모지 폐기, medicalo/애플 톤). 좌: 리드+넘버 원칙 / 우: 대형 라운드 사진(2행 스팬). ── */
.byunbaksa-theme .philosophy { background: transparent; padding: 120px 24px; }   /* ★body 쿨 오프화이트 통일(순백 밴드 제거) */
.byunbaksa-theme .philosophy-inner { max-width: 1140px; margin: 0 auto; display: grid; grid-template-columns: 1.02fr 0.98fr; column-gap: 72px; row-gap: 44px; align-items: start; }
.byunbaksa-theme .philosophy-lead { grid-column: 1; grid-row: 1; }
.byunbaksa-theme .philosophy-lead .bb-eyebrow { margin-bottom: 20px; }
.byunbaksa-theme .philosophy h2 { font-size: clamp(28px, 3.4vw, 40px); font-weight: 400; line-height: 1.28; letter-spacing: -0.035em; color: var(--navy); margin: 0; word-break: keep-all; }
.byunbaksa-theme .philosophy h2 .l1 { display: block; font-weight: 300; }
.byunbaksa-theme .philosophy h2 .l2 { display: block; font-weight: 800; }
.byunbaksa-theme .philosophy-text { font-size: 16.5px; color: var(--text-secondary); line-height: 1.9; margin: 22px 0 0; max-width: 440px; word-break: keep-all; }
/* 대형 라운드 사진 = 우측, 두 행 스팬(리드+원칙 높이에 맞춰 늘어남) */
.byunbaksa-theme .philosophy-photo-wrap { grid-column: 2; grid-row: 1 / span 2; align-self: stretch; }
.byunbaksa-theme .philosophy-photo { width: 100%; height: 100%; min-height: 460px; max-height: 640px; border-radius: 28px; object-fit: cover; object-position: 60% center; box-shadow: 0 40px 84px -50px rgba(26, 28, 32,0.5); display: block; }
/* 넘버 원칙 리스트(이모지 폐기) — 헤어라인 구분 + 넉넉한 여백 */
.byunbaksa-theme .philosophy-principles { grid-column: 1; grid-row: 2; }
.byunbaksa-theme .pp-item { display: flex; gap: 20px; align-items: flex-start; padding: 22px 0; border-top: 1px solid var(--gray-100); }
.byunbaksa-theme .pp-item:first-child { border-top: none; padding-top: 2px; }
.byunbaksa-theme .pp-num { font-size: 13px; font-weight: 700; color: var(--blue-accent); letter-spacing: 0.06em; line-height: 1.6; flex-shrink: 0; font-variant-numeric: tabular-nums; padding-top: 2px; }
.byunbaksa-theme .pp-txt h3 { font-size: 17px; font-weight: 700; color: var(--navy); margin: 0 0 6px; letter-spacing: -0.4px; }
.byunbaksa-theme .pp-txt p { font-size: 14px; color: var(--text-secondary); line-height: 1.75; margin: 0; word-break: keep-all; }
.byunbaksa-theme .philosophy-ctas { display: flex; gap: 12px; margin-top: 34px; flex-wrap: wrap; }
.byunbaksa-theme .philosophy-cta { display: inline-flex; align-items: center; gap: 10px; padding: 14px 26px; border-radius: 12px; font-size: 14px; font-weight: 600; text-decoration: none; transition: all 0.25s; letter-spacing: -0.2px; }
.byunbaksa-theme .philosophy-cta.primary { background: var(--blue-accent); color: #fff; }
.byunbaksa-theme .philosophy-cta.primary:hover { background: var(--accent-ink); transform: translateY(-1px); box-shadow: 0 14px 30px -12px rgba(176,0,32,0.4); }
.byunbaksa-theme .philosophy-cta.ghost { background: #fff; color: var(--navy); border: 1px solid var(--gray-200); }
.byunbaksa-theme .philosophy-cta.ghost:hover { border-color: var(--navy); transform: translateY(-1px); }
.byunbaksa-theme .philosophy-cta svg { transition: transform 0.25s; }
.byunbaksa-theme .philosophy-cta:hover svg { transform: translateX(3px); }

.byunbaksa-theme .posts-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.byunbaksa-theme .post-card { background: var(--white); border: 1px solid var(--gray-100); border-radius: var(--radius); overflow: hidden; transition: all 0.3s ease; text-decoration: none; color: inherit; display: block; }
.byunbaksa-theme .post-card:hover { box-shadow: var(--shadow-md); transform: translateY(-4px); }
.byunbaksa-theme .post-body { padding: 28px 24px; }
.byunbaksa-theme .post-category { display: inline-block; font-size: 12px; font-weight: 600; color: var(--blue-accent); background: rgba(59,108,180,0.08); padding: 4px 10px; border-radius: 6px; margin-bottom: 12px; }
.byunbaksa-theme .post-title { font-size: 16px; font-weight: 600; color: var(--navy); line-height: 1.5; margin-bottom: 8px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.byunbaksa-theme .post-excerpt { font-size: 13px; color: var(--text-muted); line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

.byunbaksa-theme .review-section { padding: 100px 24px; background: var(--gray-50); overflow: hidden; }
.byunbaksa-theme .review-inner { max-width: 1200px; margin: 0 auto; }

.byunbaksa-theme .video-section { background: var(--gray-50); padding: 100px 24px; }
.byunbaksa-theme .video-inner { max-width: 1200px; margin: 0 auto; }
.byunbaksa-theme .btn-youtube { display: inline-flex; align-items: center; gap: 10px; background: var(--navy); color: #FFFFFF; padding: 14px 28px; border-radius: 10px; font-size: 15px; font-weight: 600; text-decoration: none; transition: all 0.25s; }
.byunbaksa-theme .btn-youtube:hover { background: var(--navy-light); transform: translateY(-1px); box-shadow: 0 4px 16px rgba(26, 28, 32,0.25); }
.byunbaksa-theme .yt-icon { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 17px; background: #FF0000; border-radius: 4px; color: white; }
.byunbaksa-theme .yt-icon svg { display: block; }

.byunbaksa-theme .info-section { padding: 100px 24px; }
.byunbaksa-theme .info-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.byunbaksa-theme .info-card { background: var(--gray-50); border-radius: var(--radius-lg); padding: 48px; }
.byunbaksa-theme .info-card h3 { font-size: 22px; font-weight: 700; color: var(--navy); margin-bottom: 28px; display: flex; align-items: center; gap: 12px; }
.byunbaksa-theme .info-ic { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.byunbaksa-theme .info-card h3 svg { width: 22px; height: 22px; stroke: var(--navy); }
/* 휴무일(네이버 API 동적) — 라벨 1회 + 날짜 세로 스택(개수 무관 깔끔). 값 우측정렬. */
.byunbaksa-theme .info-row.info-closed { align-items: flex-start; }
.byunbaksa-theme .info-closed .value { text-align: right; }
.byunbaksa-theme .info-closed .closed-item { display: block; }
.byunbaksa-theme .info-closed .closed-item + .closed-item { margin-top: 3px; }
.byunbaksa-theme .info-row { display: flex; justify-content: space-between; padding: 14px 0; border-bottom: 1px solid var(--gray-100); font-size: 15px; }
.byunbaksa-theme .info-row:last-child { border-bottom: none; }
.byunbaksa-theme .info-row .label { color: var(--text-muted); }
.byunbaksa-theme .info-row .value { font-weight: 500; color: var(--navy); }
.byunbaksa-theme .info-address { margin-top: 20px; padding: 20px; background: var(--white); border-radius: var(--radius); font-size: 15px; color: var(--text-secondary); line-height: 1.8; }
.byunbaksa-theme .info-address strong { color: var(--navy); display: block; margin-bottom: 4px; }

/* ★ opacity 제거(2026-07-13): 히어로(.hero-content)가 LCP 텍스트라, opacity:0 시작이 LCP 페인트를 지연시킴.
   slide(translateY)만 남겨 텍스트는 즉시 보이게 → LCP 단축, 모션은 유지. */
@keyframes fadeUp { from { transform: translateY(24px); } to { transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

/* ============================================================
   ★ CLINIC HUB (category.php)
   ============================================================ */
.byunbaksa-theme .hub-hero { padding: 120px 24px 60px; background: linear-gradient(180deg, var(--blue-pale) 0%, var(--white) 100%); border-bottom: 1px solid var(--gray-100); }
.byunbaksa-theme .hub-hero-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr; gap: 60px; align-items: end; }
.byunbaksa-theme .breadcrumb { display: flex; gap: 8px; align-items: center; font-size: 13px; color: var(--text-muted); margin-bottom: 24px; flex-wrap: wrap; }
.byunbaksa-theme .breadcrumb a { color: var(--text-muted); text-decoration: none; transition: color 0.2s; }
.byunbaksa-theme .breadcrumb a:hover { color: var(--navy); }
.byunbaksa-theme .breadcrumb .sep { color: var(--gray-300); }
.byunbaksa-theme .breadcrumb .current { color: var(--navy); font-weight: 500; }
.byunbaksa-theme .hub-category-tag { display: inline-flex; align-items: center; gap: 8px; background: var(--white); border: 1px solid var(--gray-200); padding: 6px 14px; border-radius: 100px; font-size: 12px; font-weight: 600; color: var(--blue-accent); margin-bottom: 20px; }
.byunbaksa-theme .hub-category-tag::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--blue-accent); }
.byunbaksa-theme .hub-hero h1 { font-size: 44px; font-weight: 300; line-height: 1.25; letter-spacing: -1.5px; color: var(--navy); margin-bottom: 20px; }
.byunbaksa-theme .hub-hero h1 em { font-style: normal; color: var(--blue-accent); }
.byunbaksa-theme .hub-hero-desc { font-size: 16px; color: var(--text-secondary); line-height: 1.9; max-width: 540px; margin-bottom: 28px; }
.byunbaksa-theme .hub-symptom-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.byunbaksa-theme .chip { padding: 6px 14px; background: var(--white); border: 1px solid var(--gray-200); border-radius: 100px; font-size: 13px; color: var(--text-secondary); font-weight: 500; transition: all 0.2s ease; }
.byunbaksa-theme .chip:hover { transform: translateY(-1px); border-color: var(--blue-accent); color: var(--navy); }
.byunbaksa-theme .hub-doctor-card { background: var(--white); border: 1px solid var(--gray-100); border-radius: var(--radius-lg); padding: 28px; box-shadow: var(--shadow-md); display: flex; gap: 20px; align-items: center; }
.byunbaksa-theme .hub-doctor-photo { width: 80px; height: 80px; border-radius: 50%; object-fit: cover; object-position: center; border: 3px solid var(--blue-pale); flex-shrink: 0; }
.byunbaksa-theme .hub-doctor-info { font-size: 13px; color: var(--text-muted); }
.byunbaksa-theme .hub-doctor-info strong { display: block; font-size: 17px; color: var(--navy); margin-bottom: 4px; font-weight: 700; }
.byunbaksa-theme .hub-doctor-info .tagline { font-size: 12px; color: var(--blue-accent); font-weight: 500; margin-top: 6px; }

.byunbaksa-theme .hub-section-header { margin-bottom: 40px; }
.byunbaksa-theme .hub-section-header.center { text-align: center; }
.byunbaksa-theme .hub-section-tag { font-size: 12px; font-weight: 600; color: var(--blue-accent); text-transform: uppercase; letter-spacing: 2px; margin-bottom: 12px; }
.byunbaksa-theme .hub-section-title { font-size: 28px; font-weight: 400; color: var(--navy); letter-spacing: -0.5px; line-height: 1.4; }
.byunbaksa-theme .hub-section-desc { font-size: 15px; color: var(--text-secondary); margin-top: 8px; }

.byunbaksa-theme .scenario-section { padding: 80px 24px; background: var(--gray-50); border-bottom: 1px solid var(--gray-100); overflow: hidden; }
.byunbaksa-theme .scenario-inner { max-width: 1200px; margin: 0 auto; }
.byunbaksa-theme .scenario-carousel-wrap { position: relative; }
.byunbaksa-theme .scenario-carousel { display: flex; gap: 20px; transition: transform 0.5s ease; }
.byunbaksa-theme .scenario-card { width: calc((100% - 40px) / 3); min-width: calc((100% - 40px) / 3); background: var(--white); border-radius: var(--radius-lg); border: 1px solid var(--gray-100); box-shadow: var(--shadow-sm); flex-shrink: 0; padding: 36px 32px; display: flex; flex-direction: column; gap: 14px; position: relative; min-height: 220px; transition: all 0.3s ease; }
.byunbaksa-theme .scenario-card:hover { border-color: var(--blue-accent); box-shadow: var(--shadow-md); transform: translateY(-3px); }
.byunbaksa-theme .scenario-card::before { content: '"'; position: absolute; top: 16px; right: 26px; font-size: 76px; line-height: 1; color: var(--gray-100); font-family: Georgia, serif; pointer-events: none; font-weight: 700; }
.byunbaksa-theme .scenario-label { font-size: 11px; font-weight: 700; color: var(--blue-accent); letter-spacing: 2px; text-transform: uppercase; }
.byunbaksa-theme .scenario-title { font-size: 19px; font-weight: 600; color: var(--navy); line-height: 1.5; letter-spacing: -0.3px; }
.byunbaksa-theme .scenario-desc { font-size: 14px; color: var(--text-secondary); line-height: 1.8; }
.byunbaksa-theme .scenario-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border-radius: 50%; background: var(--white); border: 1px solid var(--gray-200); box-shadow: var(--shadow-md); display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 2; transition: all 0.2s; color: var(--text-secondary); padding: 0; }
.byunbaksa-theme .scenario-nav:hover { background: var(--navy); color: white; border-color: var(--navy); }
.byunbaksa-theme .scenario-nav svg { stroke: var(--text-secondary) !important; fill: none !important; pointer-events: none; }
.byunbaksa-theme .scenario-nav:hover svg { stroke: #fff !important; }
.byunbaksa-theme .scenario-nav.prev { left: -22px; }
.byunbaksa-theme .scenario-nav.next { right: -22px; }
.byunbaksa-theme .scenario-dots { display: flex; justify-content: center; gap: 8px; margin-top: 28px; }
.byunbaksa-theme .scenario-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gray-200); border: none; cursor: pointer; transition: all 0.3s; padding: 0; }
.byunbaksa-theme .scenario-dot.active { background: var(--navy); width: 24px; border-radius: 4px; }

.byunbaksa-theme .posts-section { padding: 40px 24px 80px; max-width: 1200px; margin: 0 auto; }
.byunbaksa-theme .posts-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; padding: 14px 18px; background: var(--gray-50); border-radius: var(--radius); }
.byunbaksa-theme .toolbar-count { font-size: 14px; color: var(--text-muted); white-space: nowrap; }
.byunbaksa-theme .toolbar-count strong { color: var(--navy); font-weight: 600; }
.byunbaksa-theme .toolbar-search { flex: 1; max-width: 380px; position: relative; display: flex; align-items: center; }
.byunbaksa-theme .toolbar-search svg { position: absolute; left: 14px; color: var(--text-muted); pointer-events: none; }
.byunbaksa-theme .toolbar-search input { width: 100%; padding: 10px 14px 10px 40px; border: 1px solid var(--gray-200); border-radius: 8px; background: var(--white); font-size: 14px; font-family: inherit; color: var(--navy); transition: border-color 0.2s; outline: none; }
.byunbaksa-theme .toolbar-search input:focus { border-color: var(--blue-accent); box-shadow: 0 0 0 3px rgba(59,108,180,0.12); }
.byunbaksa-theme .toolbar-search input::placeholder { color: var(--text-muted); }
.byunbaksa-theme .active-filter { margin-bottom: 16px; padding: 12px 18px; background: var(--blue-pale); border-radius: 8px; font-size: 13px; color: var(--text-secondary); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.byunbaksa-theme .active-filter strong { color: var(--navy); font-weight: 600; }
.byunbaksa-theme .active-filter a { color: var(--blue-accent); text-decoration: none; font-weight: 500; }
.byunbaksa-theme .active-filter a:hover { text-decoration: underline; }
.byunbaksa-theme .no-results { padding: 60px 20px; text-align: center; color: var(--text-muted); font-size: 14px; }
.byunbaksa-theme .hub-posts-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.byunbaksa-theme .hub-post-card { background: var(--white); border: 1px solid var(--gray-100); border-radius: var(--radius); padding: 28px; transition: all 0.25s ease; text-decoration: none; color: inherit; display: flex; flex-direction: column; gap: 12px; }
.byunbaksa-theme .hub-post-card:hover { border-color: var(--blue-accent); box-shadow: var(--shadow-md); transform: translateY(-3px); }
.byunbaksa-theme .hub-post-meta { display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: var(--text-muted); }
.byunbaksa-theme .hub-post-subcat { display: inline-block; font-size: 11px; font-weight: 600; color: var(--blue-accent); background: var(--blue-pale); padding: 3px 10px; border-radius: 4px; letter-spacing: 0.5px; }
.byunbaksa-theme .hub-post-title { font-size: 17px; font-weight: 600; color: var(--navy); line-height: 1.45; letter-spacing: -0.3px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.byunbaksa-theme .hub-post-excerpt { font-size: 13.5px; color: var(--text-secondary); line-height: 1.7; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.byunbaksa-theme .hub-post-readmore { margin-top: auto; padding-top: 12px; font-size: 13px; font-weight: 500; color: var(--blue-accent); display: inline-flex; align-items: center; gap: 4px; transition: gap 0.2s; }
.byunbaksa-theme .hub-post-card:hover .hub-post-readmore { gap: 8px; }

.byunbaksa-theme .pagination { display: flex; justify-content: center; align-items: center; gap: 6px; margin-top: 48px; flex-wrap: wrap; }
.byunbaksa-theme .pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 12px; border-radius: 8px; font-size: 14px; font-weight: 500; color: var(--text-secondary); text-decoration: none; transition: all 0.2s; }
.byunbaksa-theme .pagination a.page-numbers:hover { background: var(--gray-50); color: var(--navy); }
.byunbaksa-theme .pagination .page-numbers.current { background: var(--navy); color: var(--white); }
.byunbaksa-theme .pagination .page-numbers.dots { color: var(--gray-300); }
.byunbaksa-theme .pagination .page-numbers.prev, .byunbaksa-theme .pagination .page-numbers.next { color: var(--text-muted); }

.byunbaksa-theme .approach-section { background: var(--navy-deep); color: rgba(255,255,255,0.85); padding: 96px 24px; }
.byunbaksa-theme .approach-inner { max-width: 880px; margin: 0 auto; }
.byunbaksa-theme .approach-section .hub-section-tag { color: var(--blue-soft); }
.byunbaksa-theme .approach-section .hub-section-title { color: white; }
.byunbaksa-theme .approach-section .hub-section-desc { color: rgba(255,255,255,0.6); }
.byunbaksa-theme .approach-blocks { display: flex; flex-direction: column; margin-top: 40px; }
.byunbaksa-theme .approach-block { display: grid; grid-template-columns: 88px 1fr; gap: 28px; align-items: flex-start; padding: 32px 0; border-bottom: 1px solid rgba(255,255,255,0.08); }
.byunbaksa-theme .approach-block:last-child { border-bottom: none; padding-bottom: 0; }
.byunbaksa-theme .approach-block:first-child { padding-top: 0; }
.byunbaksa-theme .approach-num { font-size: 34px; font-weight: 300; color: var(--blue-soft); letter-spacing: -1px; line-height: 1; opacity: 0.75; }
.byunbaksa-theme .approach-body h3 { font-size: 19px; font-weight: 600; color: white; letter-spacing: -0.3px; margin-bottom: 12px; }
.byunbaksa-theme .approach-body p { font-size: 15px; color: rgba(255,255,255,0.72); line-height: 1.9; }
.byunbaksa-theme .approach-body p em { font-style: normal; color: white; font-weight: 500; background-image: linear-gradient(transparent 58%, rgba(91,143,212,0.38) 58%); background-size: 0% 100%; background-repeat: no-repeat; background-position: 0 0; transition: background-size 0.9s cubic-bezier(0.2, 0.8, 0.2, 1) 0.35s; padding: 0 2px; }
.byunbaksa-theme .approach-block.in-view .approach-body p em { background-size: 100% 100%; }
.byunbaksa-theme .approach-footnote { margin-top: 48px; padding-top: 28px; border-top: 1px solid rgba(255,255,255,0.08); text-align: center; }
.byunbaksa-theme .approach-footnote a { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 500; color: var(--blue-soft); text-decoration: none; padding: 10px 20px; border: 1px solid rgba(91,143,212,0.3); border-radius: 100px; transition: all 0.25s; }
.byunbaksa-theme .approach-footnote a:hover { color: white; border-color: var(--blue-soft); background: rgba(91,143,212,0.1); transform: translateY(-1px); }

.byunbaksa-theme .faq-section { background: var(--gray-50); padding: 80px 24px; border-top: 1px solid var(--gray-100); border-bottom: 1px solid var(--gray-100); }
.byunbaksa-theme .faq-inner { max-width: 880px; margin: 0 auto; }
.byunbaksa-theme .faq-list { display: flex; flex-direction: column; gap: 12px; margin-top: 32px; }
.byunbaksa-theme .faq-item { background: var(--white); border: 1px solid var(--gray-100); border-radius: var(--radius); overflow: hidden; transition: border-color 0.2s; }
.byunbaksa-theme .faq-item.open { border-color: var(--blue-accent); }
.byunbaksa-theme .faq-question { width: 100%; background: none; border: none; padding: 20px 24px; text-align: left; cursor: pointer; display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; font-size: 15px; font-weight: 600; color: var(--navy); font-family: inherit; line-height: 1.55; }
.byunbaksa-theme .faq-question > span:first-child { display: flex; align-items: flex-start; gap: 8px; flex: 1; }
.byunbaksa-theme .faq-question .q-mark { color: var(--blue-accent); font-weight: 700; flex-shrink: 0; }
.byunbaksa-theme .faq-toggle { width: 24px; height: 24px; border-radius: 50%; background: var(--gray-100); display: flex; align-items: center; justify-content: center; color: var(--text-muted); transition: all 0.3s; flex-shrink: 0; }
.byunbaksa-theme .faq-item.open .faq-toggle { background: var(--blue-accent); color: white; transform: rotate(45deg); }
.byunbaksa-theme .faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
.byunbaksa-theme .faq-item.open .faq-answer { max-height: 600px; }
.byunbaksa-theme .faq-answer-inner { padding: 0 24px 20px 52px; font-size: 14px; color: var(--text-secondary); line-height: 1.8; }
/* FAQ 더보기 게이팅 — 숨김 항목은 display:none(크롤러는 소스에서 읽음), 버튼으로 표시 토글 */
.byunbaksa-theme .faq-item.faq-hidden { display: none; }
.byunbaksa-theme .faq-list.faq-expanded .faq-item.faq-hidden { display: block; }
.byunbaksa-theme .faq-more-wrap { text-align: center; margin-top: 28px; }
.byunbaksa-theme .faq-more-btn { display: inline-flex; align-items: center; gap: 10px; background: var(--white); color: var(--navy); border: 1.5px solid var(--gray-200); padding: 13px 26px; border-radius: 100px; font-size: 14px; font-weight: 600; font-family: inherit; cursor: pointer; transition: all 0.2s; }
.byunbaksa-theme .faq-more-btn:hover { border-color: var(--blue-accent); color: var(--blue-accent); }
.byunbaksa-theme .faq-more-icon { width: 20px; height: 20px; border-radius: 50%; background: var(--gray-100); display: flex; align-items: center; justify-content: center; font-size: 14px; line-height: 1; transition: all 0.25s; }
.byunbaksa-theme .faq-more-btn:hover .faq-more-icon { background: var(--blue-accent); color: #fff; }
.byunbaksa-theme .faq-more-btn[aria-expanded="true"] .faq-more-icon { transform: rotate(45deg); }

.byunbaksa-theme .related-section { padding: 80px 24px; max-width: 1200px; margin: 0 auto; }
.byunbaksa-theme .related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 32px; }
.byunbaksa-theme .related-card { background: var(--white); border: 1px solid var(--gray-100); border-radius: var(--radius); padding: 28px 24px; text-decoration: none; color: inherit; transition: all 0.25s; display: flex; align-items: center; gap: 16px; }
.byunbaksa-theme .related-card:hover { border-color: var(--blue-accent); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.byunbaksa-theme .related-icon { width: 44px; height: 44px; border-radius: 10px; background: var(--gray-50); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background 0.2s; }
.byunbaksa-theme .related-card:hover .related-icon { background: var(--navy); }
.byunbaksa-theme .related-card:hover .related-icon svg { stroke: white; }
.byunbaksa-theme .related-text { flex: 1; }
.byunbaksa-theme .related-name { font-size: 15px; font-weight: 600; color: var(--navy); margin-bottom: 2px; }
.byunbaksa-theme .related-desc { font-size: 12px; color: var(--text-muted); }

.byunbaksa-theme .hub-post-card.is-hidden { opacity: 0; pointer-events: none; position: absolute; left: -9999px; width: 0; height: 0; overflow: hidden; margin: 0; padding: 0; border: 0; }

/* ============================================================
   ★ ARTICLE PAGES (page.php — philosophy / how-we-treat)
   ============================================================ */
/* ★2026-08-17 히어로 붉은 그라데이션 제거(사용자 지시) — 변박사 잔재.
   원래는 linear-gradient(180deg, var(--blue-pale) 0%, var(--white) 70%) 였는데,
   테마 리컬러 때 --blue-pale 이 옅은 블루(#EEF3FB)→옅은 레드(#FDECEF)로 바뀌면서
   FAQ·진료비 히어로 상단이 분홍빛으로 깔렸다. §1 하이엔드 미니멀 화이트 원칙대로 순백으로. */
.byunbaksa-theme .article-hero { padding: 150px 24px 52px; background: var(--white); }
.byunbaksa-theme .article-hero-inner { max-width: 960px; margin: 0 auto; }
/* ★2026-07-31 medicalo 톤: 컬러 pill → 순수 kicker(배경 없음, 레터스페이스). 액센트는 이 라벨 한 곳의 '포인트'로만. */
.byunbaksa-theme .article-tag { display: inline-block; font-size: 12px; font-weight: 700; color: var(--blue-accent); background: none; padding: 0; border-radius: 0; letter-spacing: 0.2em; text-transform: uppercase; margin-bottom: 22px; }
/* ★medicalo 톤: 에어리한 라이트 헤드라인(weight 400) + 강조는 '색'이 아니라 '굵기'(em=700, 네이비 모노크롬). */
.byunbaksa-theme .article-hero h1 { font-size: clamp(30px, 4.4vw, 46px); font-weight: 400; line-height: 1.34; letter-spacing: -0.035em; color: var(--navy); margin-bottom: 22px; word-break: keep-all; }
.byunbaksa-theme .article-hero h1 em { font-style: normal; font-weight: 700; color: var(--navy); }
.byunbaksa-theme .article-hero-desc { font-size: 17px; color: var(--text-secondary); line-height: 1.9; max-width: 660px; font-weight: 400; }
.byunbaksa-theme .article-hero-desc strong { color: var(--navy); font-weight: 600; }
.byunbaksa-theme .article-hero-desc em { font-style: normal; color: var(--blue-accent); font-weight: 600; }

/* ★medicalo 원장소개 톤: 히어로와 안 겹치는 독립 카드. 대형 라운드 사각 사진 + 에어리 텍스트 + 옅고 깊은 float. */
.byunbaksa-theme .doctor-card { max-width: 960px; margin: 40px auto 64px; position: relative; background: #fff; border: 1px solid var(--gray-100); box-shadow: 0 34px 64px -44px rgba(26, 28, 32,0.4); border-radius: 24px; padding: 36px 40px; display: grid; grid-template-columns: 176px 1fr; gap: 44px; align-items: center; }
.byunbaksa-theme .doctor-photo { width: 176px; height: 200px; border-radius: 18px; object-fit: cover; object-position: 50% 16%; border: none; box-shadow: 0 18px 38px -20px rgba(26, 28, 32,0.34); }
.byunbaksa-theme .doctor-info-name { font-size: 24px; font-weight: 700; color: var(--navy); letter-spacing: -0.5px; margin-bottom: 4px; }
.byunbaksa-theme .doctor-info-subtitle { font-size: 14px; color: var(--blue-accent); font-weight: 500; margin-bottom: 16px; }
.byunbaksa-theme .doctor-credentials { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px 24px; }
.byunbaksa-theme .doctor-credentials li { font-size: 14px; color: var(--text-secondary); position: relative; padding-left: 14px; line-height: 1.7; }
.byunbaksa-theme .doctor-credentials li::before { content: '·'; position: absolute; left: 2px; top: -2px; color: var(--blue-accent); font-weight: 700; font-size: 18px; }

.byunbaksa-theme .article { max-width: 720px; margin: 0 auto; padding: 20px 24px 100px; }
.byunbaksa-theme .article > p { font-size: 17px; color: var(--text-secondary); line-height: 1.95; margin-bottom: 22px; }
.byunbaksa-theme .article > p strong { color: var(--navy); font-weight: 600; }
.byunbaksa-theme .article h2 { font-size: 28px; font-weight: 700; color: var(--navy); line-height: 1.4; letter-spacing: -0.8px; margin: 64px 0 24px; }
/* pullquote = 라이트 에디토리얼(2026-08-04) — 구 네이비 다크밴드 폐기. 헤어라인 상/하 + 라이트 대형텍스트 + 네이비 굵기강조(색 아닌 weight). */
.byunbaksa-theme .pullquote { background: none; color: var(--navy); padding: 46px 24px; border: none; border-top: 1px solid var(--gray-100); border-bottom: 1px solid var(--gray-100); border-radius: 0; margin: 60px 0; font-size: clamp(22px, 3.1vw, 30px); font-weight: 400; line-height: 1.55; letter-spacing: -0.4px; text-align: center; box-shadow: none; word-break: keep-all; }
.byunbaksa-theme .pullquote em { font-style: normal; color: var(--navy); font-weight: 800; }
.byunbaksa-theme .pullquote .pullquote-small { display: block; margin-top: 18px; font-size: 15px; color: var(--text-muted); font-weight: 400; letter-spacing: 0; line-height: 1.7; }
.byunbaksa-theme .qbox { background: var(--gray-50); border-left: 3px solid rgba(26, 28, 32,0.4); padding: 24px 28px; border-radius: 0 var(--radius) var(--radius) 0; margin: 28px 0; }
.byunbaksa-theme .qbox p { font-size: 16px; color: var(--text-primary); margin-bottom: 14px; line-height: 1.75; font-weight: 500; }
.byunbaksa-theme .qbox p:last-child { margin-bottom: 0; }
/* 서명 = 편지의 사인오프(변성범 드림). 윗줄 헤어라인 제거 — 본문에서 자연스럽게 이어지고, 뒤 .bb-credlist 헤어라인 하나로 저자 바이오 구분(2026-08-04). 직함 중복줄(line1)은 마크업에서 제거됨. */
.byunbaksa-theme .signature { margin-top: 52px; padding-top: 0; border-top: none; text-align: right; }
.byunbaksa-theme .closing .signature { margin-top: 0; } /* .closing 이 상단 간격을 담당 → 이중 간격 방지 */
.byunbaksa-theme .signature-line1 { font-size: 13px; color: var(--text-muted); margin-bottom: 6px; letter-spacing: 0.3px; }
.byunbaksa-theme .signature-line2 { font-size: 20px; font-weight: 600; color: var(--navy); letter-spacing: -0.3px; }

.byunbaksa-theme .premise { max-width: 720px; margin: 60px auto 0; padding: 0 24px; }
.byunbaksa-theme .premise-tools { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 32px; }
.byunbaksa-theme .premise-tools span { background: var(--gray-50); border: 1px solid var(--gray-100); color: var(--navy); font-size: 15px; font-weight: 500; padding: 10px 18px; border-radius: 100px; letter-spacing: -0.3px; }
.byunbaksa-theme .premise-body { text-align: center; }
.byunbaksa-theme .premise-body p { font-size: 17px; color: var(--text-secondary); line-height: 1.85; margin-bottom: 12px; }
.byunbaksa-theme .premise-body p.strong-line { font-size: 22px; font-weight: 600; color: var(--navy); letter-spacing: -0.5px; line-height: 1.5; margin: 20px 0 0; }
.byunbaksa-theme .premise-body p.strong-line em { font-style: normal; color: var(--navy); font-weight: 800; }

/* ── 원장 약력 end-bio (.bb-credlist) — philosophy 퍼널 신뢰(E-E-A-T). 절제된 하이엔드 블록: 본문 뒤 헤어라인+2열 리스트. 상세는 Physician 스키마 병행. ── */
.byunbaksa-theme .bb-credlist { max-width: 720px; margin: 64px auto 0; padding: 34px 0 44px; border-top: 1px solid var(--gray-100); }
.byunbaksa-theme .bb-credlist-head { margin-bottom: 22px; }
.byunbaksa-theme .bb-credlist-eyebrow { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--blue-accent); margin-bottom: 7px; }
.byunbaksa-theme .bb-credlist-name { font-size: 20px; font-weight: 700; color: var(--navy); letter-spacing: -0.5px; }
.byunbaksa-theme .bb-credlist-title { font-size: 13px; font-weight: 500; color: var(--text-muted); letter-spacing: -0.2px; margin-left: 8px; }
/* 저자 설명문(케어 도구 겉틀) — 도구를 설계한 원장 귀속 + 안전 안내(크롤가능=E-E-A-T/AEO). 약력 리스트 위 한 문단. */
.byunbaksa-theme .bb-credlist-note { font-size: 14px; color: var(--text-secondary); line-height: 1.75; margin: 0 0 22px; word-break: keep-all; }
.byunbaksa-theme .bb-credlist-note strong { color: var(--navy); font-weight: 700; }
.byunbaksa-theme .bb-credlist-items { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 32px; }
.byunbaksa-theme .bb-credlist-items li { position: relative; padding-left: 15px; font-size: 14px; color: var(--text-secondary); line-height: 1.7; word-break: keep-all; }
.byunbaksa-theme .bb-credlist-items li::before { content: ''; position: absolute; left: 2px; top: 9px; width: 4px; height: 4px; border-radius: 50%; background: var(--navy); }
/* ★2026-08-07: 케어 도구 페이지는 .bb-credlist 가 <main> 직계(=philosophy 처럼 .article 패딩 래퍼 없음)라
   좌우 여백이 잘리고(패딩0) 폭이 FAQ(820)와 안 맞던 것 교정. 직접자식 결합자(>)로 케어만 스코프 — philosophy/how-we-treat(.article 안)는 미해당. */
.byunbaksa-theme main.site-main > .bb-credlist { max-width: 820px; padding-left: 24px; padding-right: 24px; }

/* ── 케어 도구·허브 공용 FAQ (.bb-faq) — native <details>(JS 0, 항상 크롤가능). byunbaksa_render_faq() 렌더 + FAQPage 스키마 단일소스. ── */
.byunbaksa-theme .bb-faq { max-width: 820px; margin: 72px auto 0; padding: 0 24px; }
.byunbaksa-theme .bb-faq-head { text-align: center; margin-bottom: 30px; }
.byunbaksa-theme .bb-faq-eyebrow { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--blue-accent); margin-bottom: 10px; }
.byunbaksa-theme .bb-faq-title { font-size: 25px; font-weight: 700; color: var(--navy); letter-spacing: -0.9px; margin: 0; word-break: keep-all; }
.byunbaksa-theme .bb-faq-list { display: flex; flex-direction: column; gap: 12px; }
.byunbaksa-theme .bb-faq-item { background: #fff; border: 1px solid var(--gray-100); border-radius: var(--radius); overflow: hidden; transition: border-color 0.2s; }
.byunbaksa-theme .bb-faq-item[open] { border-color: var(--blue-accent); }
.byunbaksa-theme .bb-faq-q { list-style: none; cursor: pointer; padding: 20px 24px; display: flex; align-items: flex-start; gap: 8px; font-size: 15px; font-weight: 600; color: var(--navy); line-height: 1.55; }
.byunbaksa-theme .bb-faq-q::-webkit-details-marker { display: none; }
.byunbaksa-theme .bb-faq-qmark { color: var(--blue-accent); font-weight: 700; flex-shrink: 0; }
.byunbaksa-theme .bb-faq-qtext { flex: 1; }
.byunbaksa-theme .bb-faq-plus { position: relative; width: 16px; height: 16px; flex-shrink: 0; margin-top: 3px; }
.byunbaksa-theme .bb-faq-plus::before, .byunbaksa-theme .bb-faq-plus::after { content: ""; position: absolute; background: var(--text-muted); transition: transform 0.25s ease, background 0.2s; }
.byunbaksa-theme .bb-faq-plus::before { top: 7px; left: 1px; width: 14px; height: 2px; }
.byunbaksa-theme .bb-faq-plus::after { top: 1px; left: 7px; width: 2px; height: 14px; }
.byunbaksa-theme .bb-faq-item[open] .bb-faq-plus::after { transform: rotate(90deg); }
.byunbaksa-theme .bb-faq-item[open] .bb-faq-plus::before, .byunbaksa-theme .bb-faq-item[open] .bb-faq-plus::after { background: var(--blue-accent); }
.byunbaksa-theme .bb-faq-a { padding: 0 24px 20px 52px; font-size: 14px; color: var(--text-secondary); line-height: 1.8; word-break: keep-all; }
@media (max-width: 560px) {
  .byunbaksa-theme .bb-faq { margin-top: 56px; }
  .byunbaksa-theme .bb-faq-title { font-size: 21px; letter-spacing: -0.7px; }
  .byunbaksa-theme .bb-faq-q { padding: 16px 18px; font-size: 14px; }
  .byunbaksa-theme .bb-faq-a { padding: 0 18px 18px 40px; font-size: 13px; }
}

/* ── explainer — 원장 설명 클립(음소거 루프 MP4) + CSS 자막 오버레이 (2026-08-04) ──
   사진 자산 부족 대응: 깨끗한 클립 재활용 + 자막만 교체. 자막=실제 텍스트(figcaption)라 크롤 가능(AEO).
   바=가운데 정렬 / 글씨=좌측 / 폭=내용맞춤(짧으면 좁게, 최대 86%서 랩 → 세로 확장). 탭+박스=한 통(좌측선 정렬). */
.byunbaksa-theme .bb-explainer { margin: 44px auto; max-width: 560px; }
.byunbaksa-theme .bb-explainer-media { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 18px; overflow: hidden; background: var(--navy-deep); box-shadow: 0 3px 10px -4px rgba(26, 28, 32,0.10), 0 30px 56px -34px rgba(26, 28, 32,0.46); }
.byunbaksa-theme .bb-explainer-vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.byunbaksa-theme .bb-explainer-lower { position: absolute; left: 50%; transform: translateX(-50%); bottom: 6%; z-index: 2; width: -webkit-max-content; width: max-content; max-width: 86%; }
.byunbaksa-theme .bb-explainer-tab { display: block; width: -webkit-fit-content; width: fit-content; font-size: 11.5px; font-weight: 700; letter-spacing: -0.2px; padding: 4px 11px; border-radius: 9px 9px 0 0; white-space: nowrap; background: var(--accent-ink); color: #fff; }
.byunbaksa-theme .bb-explainer-box { display: block; width: auto; max-width: 100%; border-radius: 0 12px 12px 12px; padding: 9px 18px; background: rgba(255,255,255,0.82); backdrop-filter: blur(9px) saturate(1.4); -webkit-backdrop-filter: blur(9px) saturate(1.4); box-shadow: 0 8px 24px -10px rgba(0,0,0,0.4); }
.byunbaksa-theme .bb-explainer-cap { margin: 0; font-size: 16.5px; font-weight: 700; line-height: 1.5; letter-spacing: -0.3px; word-break: keep-all; text-align: left; color: var(--navy); }
/* ★자막 p 가 글 본문(.post-body) 안에선 .post-body p:first-of-type(특이도 0,0,3,1)에 눌려 크기·줄높이가 안 먹음
   → 스코프 상향(0,0,4,0)으로 자막 룩 복원. 블로그 글 explainer 전용(허브는 .post-body 밖이라 무관). */
.byunbaksa-theme .post-body .bb-explainer .bb-explainer-cap { margin: 0; font-size: 16.5px; line-height: 1.5; }

.byunbaksa-theme .modalities { max-width: 960px; margin: 80px auto 0; padding: 0 24px; }
.byunbaksa-theme .modalities-header { text-align: center; margin-bottom: 40px; }
.byunbaksa-theme .modalities-tag { font-size: 12px; font-weight: 600; color: var(--blue-accent); letter-spacing: 2px; text-transform: uppercase; margin-bottom: 12px; }
.byunbaksa-theme .modalities-title { font-size: 28px; font-weight: 700; color: var(--navy); letter-spacing: -0.5px; line-height: 1.4; margin-bottom: 12px; }
.byunbaksa-theme .modalities-desc { font-size: 15px; color: var(--text-secondary); max-width: 540px; margin: 0 auto; }
.byunbaksa-theme .modality-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.byunbaksa-theme .modality-card { background: white; border: 1px solid var(--gray-100); border-radius: var(--radius); padding: 24px 20px; text-align: center; transition: all 0.25s; }
.byunbaksa-theme .modality-card:hover { border-color: var(--blue-accent); box-shadow: var(--shadow-md); transform: translateY(-4px); }
.byunbaksa-theme .modality-icon { width: 48px; height: 48px; border-radius: 12px; background: var(--blue-pale); color: var(--blue-accent); display: flex; align-items: center; justify-content: center; margin: 0 auto 14px; font-size: 22px; }
.byunbaksa-theme .modality-name { font-size: 17px; font-weight: 700; color: var(--navy); margin-bottom: 8px; letter-spacing: -0.3px; }
.byunbaksa-theme .modality-desc { font-size: 13px; color: var(--text-secondary); line-height: 1.7; }

.byunbaksa-theme .closing { max-width: 720px; margin: 52px auto 0; padding: 0 24px 100px; }
.byunbaksa-theme .closing > p { font-size: 17px; color: var(--text-secondary); line-height: 1.95; margin-bottom: 22px; }
.byunbaksa-theme .closing > p strong { color: var(--navy); font-weight: 600; }

.byunbaksa-theme .cross-link-section { background: var(--gray-50); padding: 80px 24px; border-top: 1px solid var(--gray-100); }
.byunbaksa-theme .cross-link-inner { max-width: 720px; margin: 0 auto; text-align: center; }
.byunbaksa-theme .cross-link-tag { font-size: 12px; font-weight: 600; color: var(--blue-accent); letter-spacing: 2px; text-transform: uppercase; margin-bottom: 14px; }
.byunbaksa-theme .cross-link-inner > h2 { font-size: 28px; font-weight: 700; color: var(--navy); letter-spacing: -0.5px; line-height: 1.4; margin-bottom: 12px; }
.byunbaksa-theme .cross-link-inner > p { font-size: 15px; color: var(--text-secondary); margin-bottom: 28px; }
.byunbaksa-theme .cross-link-card { display: block; background: white; border: 1px solid var(--gray-100); border-radius: var(--radius-lg); padding: 32px 36px; text-align: left; text-decoration: none; color: inherit; transition: all 0.25s; max-width: 560px; margin: 0 auto; }
.byunbaksa-theme .cross-link-card:hover { border-color: var(--blue-accent); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.byunbaksa-theme .cross-link-label { font-size: 12px; color: var(--blue-accent); font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 8px; }
.byunbaksa-theme .cross-link-title { font-size: 22px; font-weight: 700; color: var(--navy); margin-bottom: 10px; letter-spacing: -0.5px; }
.byunbaksa-theme .cross-link-desc { font-size: 15px; color: var(--text-secondary); line-height: 1.8; }
.byunbaksa-theme .cross-link-arrow { margin-top: 18px; font-size: 14px; font-weight: 600; color: var(--blue-accent); }

/* ============================================================
   ★ 통합 히어로 (.bb-hero) — medicalo 톤 (2026-07-31)
   좌: 브레드크럼+영문 kicker+라이트/볼드 헤드라인+desc / 우: 사진 + 슬림 플로팅 이름택(.bb-nametag).
   대제목 섹션 + 원장 카드를 하나로 통합. 재사용 컴포넌트 → 컬럼 적용 후 메인·타 페이지로 확산.
   ============================================================ */
.byunbaksa-theme .bb-hero { background: linear-gradient(180deg, var(--blue-pale) 0%, var(--white) 82%); }
.byunbaksa-theme .bb-hero-inner { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 56px; align-items: center; max-width: 1140px; margin: 0 auto; padding: 144px 24px 84px; }
.byunbaksa-theme .bb-hero-kick { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: var(--blue-accent); margin: 2px 0 22px; }
.byunbaksa-theme .bb-hero h1 { font-size: clamp(32px, 4.2vw, 52px); font-weight: 400; letter-spacing: -0.035em; line-height: 1.22; color: var(--navy); margin: 0; word-break: keep-all; }
.byunbaksa-theme .bb-hero h1 .l1 { display: block; font-weight: 300; }
.byunbaksa-theme .bb-hero h1 .l2 { display: block; font-weight: 800; }
.byunbaksa-theme .bb-hero-desc { font-size: 17px; color: var(--text-secondary); line-height: 1.85; max-width: 440px; margin-top: 24px; font-weight: 400; word-break: keep-all; }
/* 우측 미디어 + 슬림 플로팅 이름택 (약력 상세는 스키마가 AEO 담당 → 화면엔 이름·직함만) */
.byunbaksa-theme .bb-hero-media { position: relative; }
.byunbaksa-theme .bb-hero-media > img { width: 100%; height: 100%; min-height: 420px; max-height: 500px; object-fit: cover; object-position: 50% 22%; border-radius: 28px; box-shadow: 0 48px 92px -54px rgba(26, 28, 32,0.5); display: block; }
/* 이름택 = 프로스티드 글라스(애플 위젯 톤) + 로고 + 둥둥 애니메이션. 좌상단 사진에 살짝 겹침(PC·모바일 통일). */
.byunbaksa-theme .bb-nametag { position: absolute; top: -16px; left: -16px; z-index: 2; display: inline-flex; align-items: center; gap: 12px; background: rgba(255,255,255,0.66); backdrop-filter: blur(18px) saturate(1.5); -webkit-backdrop-filter: blur(18px) saturate(1.5); border: 1px solid rgba(255,255,255,0.7); border-radius: 16px; padding: 12px 17px; box-shadow: 0 20px 46px -20px rgba(26, 28, 32,0.4), inset 0 1px 0 rgba(255,255,255,0.6); animation: bbFloat 4.5s ease-in-out infinite; }
.byunbaksa-theme .bb-nametag-ic { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; flex-shrink: 0; }
.byunbaksa-theme .bb-nametag-ic img { width: 100%; height: 100%; object-fit: contain; display: block; }
.byunbaksa-theme .bb-nametag-t1 { font-size: 11.5px; color: var(--text-muted); font-weight: 500; }
.byunbaksa-theme .bb-nametag-t2 { display: block; font-size: 15px; color: var(--navy); font-weight: 700; margin-top: 1px; letter-spacing: -0.01em; }
@keyframes bbFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@media (prefers-reduced-motion: reduce) { .byunbaksa-theme .bb-nametag { animation: none; } }
@media (max-width: 900px) {
	.byunbaksa-theme .bb-hero-inner { gap: 40px; padding: 132px 24px 72px; }
}
@media (max-width: 760px) {
	.byunbaksa-theme .bb-hero-inner { grid-template-columns: 1fr; gap: 36px; padding: 120px 20px 60px; }
	.byunbaksa-theme .bb-hero-kick { margin: 16px 0 20px; }
	.byunbaksa-theme .bb-hero h1 { font-size: clamp(28px, 8vw, 38px); line-height: 1.3; }
	.byunbaksa-theme .bb-hero-desc { max-width: none; font-size: 15.5px; line-height: 1.9; margin-top: 22px; }
	.byunbaksa-theme .bb-hero-media > img { min-height: 0; max-height: none; aspect-ratio: 4 / 3.2; }
	.byunbaksa-theme .bb-nametag { top: -12px; left: -12px; padding: 10px 14px; gap: 10px; border-radius: 14px; }
	.byunbaksa-theme .bb-nametag-ic { width: 27px; height: 27px; }
	.byunbaksa-theme .bb-nametag-t2 { font-size: 14px; }
}

/* ★히어로 3블록 재배치(.bb-hero--split) — head/media/body. ★모바일 순서 = 제목(head) → 사진(media) → 설명·칩(body).
   데스크톱은 좌(head 위/body 아래)·우(media 스팬)로 기존 2단과 동일. 클리닉 허브·다이어트 공용(2026-08-05). */
.byunbaksa-theme .bb-hero--split .bb-hero-inner { align-items: start; row-gap: 0; grid-template-areas: "head media" "body media"; }
.byunbaksa-theme .bb-hero--split .bb-hero-head  { grid-area: head; }
.byunbaksa-theme .bb-hero--split .bb-hero-media { grid-area: media; align-self: start; }
.byunbaksa-theme .bb-hero--split .bb-hero-body  { grid-area: body; }
.byunbaksa-theme .bb-hero--split .bb-hero-desc  { margin-top: 24px; }   /* h1(head) → desc(body) 간격(row-gap 0 대체) */
@media (max-width: 760px) {
	.byunbaksa-theme .bb-hero--split .bb-hero-inner { grid-template-areas: "head" "media" "body"; row-gap: 30px; }
	.byunbaksa-theme .bb-hero--split .bb-hero-desc { margin-top: 0; }
}

/* ============================================================
   ★ 공용 카드 시스템 (.bb-*) — 전 페이지 통일 컴포넌트 (2026-07-31)
   기준 = /care/ (page-care.php)의 카드/eyebrow/프로그레스 룩을 재사용 클래스로 승격.
   원칙(사용자 확정): 하이엔드 미니멀 화이트 + 네이비 모노크롬. 카테고리 무지개 컬러바 폐기(구분은 eyebrow 텍스트).
   적용 순서: /column/(파일럿) → front-page → category → 도구 7종. care 는 추후 이 클래스로 이관.
   ============================================================ */
/* ── 섹션 헤더: 영문 eyebrow + 짧은 네이비 틱 (색깔 바 없음) ── */
.byunbaksa-theme .bb-sec-head { margin-bottom: 38px; }
.byunbaksa-theme .bb-eyebrow { display: inline-flex; align-items: center; gap: 9px; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--navy); }
.byunbaksa-theme .bb-eyebrow::before { content: ""; width: 20px; height: 2px; border-radius: 2px; background: var(--navy); }
.byunbaksa-theme .bb-sec-titlerow { display: flex; align-items: center; gap: 14px; margin-top: 15px; }
.byunbaksa-theme .bb-sec-title { font-size: 25px; font-weight: 700; color: var(--navy); letter-spacing: -0.9px; margin: 0; word-break: keep-all; min-width: 0; }
/* eyebrow→title 간격: titlerow(15px)·center(14px)·philosophy(20px)와 달리 바로-title 섹션(Specialties·Reviews·Our Space)만 간격 규칙이 없어 0px로 붙었음 → 자식 결합자로 그 케이스에만 부여(titlerow 중첩 title 제외). */
.byunbaksa-theme .bb-sec-head--home > .bb-sec-title { margin-top: 15px; }
/* 우측 컨트롤: 더보기 텍스트링크 + 데스크톱 미니 원형 화살표(medicalo 시그니처) */
.byunbaksa-theme .bb-sec-nav { margin-left: auto; flex-shrink: 0; display: inline-flex; align-items: center; gap: 16px; }
.byunbaksa-theme .bb-sec-more { flex-shrink: 0; font-size: 13px; font-weight: 600; color: var(--navy); display: inline-flex; align-items: center; gap: 6px; text-decoration: none; white-space: nowrap; transition: gap 0.25s cubic-bezier(.16,1,.3,1), opacity 0.2s; opacity: 0.72; }
.byunbaksa-theme .bb-sec-more:hover { gap: 10px; opacity: 1; }
.byunbaksa-theme .bb-arrows { display: inline-flex; gap: 8px; }
.byunbaksa-theme .bb-arrow { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--gray-200); background: #fff; color: var(--navy); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; transition: background 0.25s cubic-bezier(.16,1,.3,1), color 0.25s, border-color 0.25s, transform 0.25s, opacity 0.25s; }
.byunbaksa-theme .bb-arrow svg { display: block; }
.byunbaksa-theme .bb-arrow:hover { background: var(--navy); color: #fff; border-color: var(--navy); transform: translateY(-1px); }
.byunbaksa-theme .bb-arrow:disabled { opacity: 0.3; cursor: default; background: #fff; color: var(--navy); border-color: var(--gray-200); transform: none; }
.byunbaksa-theme .bb-sec-lead { font-size: 14.5px; color: var(--text-secondary); line-height: 1.75; margin: 16px 0 0; max-width: 720px; word-break: keep-all; }

/* ── 바로가기 칩 (애플/하이엔드: 화이트 + 헤어라인 + 여백 + 모노크롬) ── */
/* 바로가기 = 미니 소프트칩 (알약 아닌 라운드 사각, 개별 경계=아이템). 활성 섹션 칩 = 네이비 채움(스크롤 연동). */
.byunbaksa-theme .bb-jump { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.byunbaksa-theme .bb-jump-chip { font-size: 13px; font-weight: 600; letter-spacing: -0.01em; color: var(--text-secondary); background: var(--gray-50); border: 1px solid var(--gray-100); border-radius: 11px; padding: 10px 16px; text-decoration: none; white-space: nowrap; transition: background 0.25s cubic-bezier(.16,1,.3,1), color 0.25s, border-color 0.25s, transform 0.25s; }
.byunbaksa-theme .bb-jump-chip:hover { background: var(--blue-pale); color: var(--navy); transform: translateY(-1px); }
.byunbaksa-theme .bb-jump-chip.on { background: var(--navy); color: #fff; border-color: var(--navy); }

/* ── 카드 그리드 = 전 너비 가로 스크롤 캐러셀 (medicalo 톤). PC 3장/뷰 + 화살표, 태블릿 2장, 모바일 1+¼ + 프로그레스바. ── */
.byunbaksa-theme .bb-grid { display: flex; gap: 26px; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; scrollbar-width: none; scroll-behavior: smooth; padding: 6px 2px 10px; touch-action: pan-x pan-y; }
.byunbaksa-theme .bb-grid::-webkit-scrollbar { display: none; }
.byunbaksa-theme .bb-grid > .bb-card { flex: 0 0 calc((100% - 78px) / 3.25); scroll-snap-align: start; } /* 데스크톱 3 + ¼ peek(공용): 다음 카드가 ¼ 걸쳐 보여 캐러셀 인지. 메인·컬럼·케어·카테고리 전부 적용 */

/* ── 카드 (텍스트 포워드 + 우하단 원형 화살표). 네이비 모노크롬 + 옅고 깊은 그림자 + hover 리프트 ── */
.byunbaksa-theme .bb-card { --ease: cubic-bezier(0.16, 1, 0.3, 1); position: relative; display: flex; flex-direction: column; min-height: 220px; background: #fff; border: 1px solid var(--gray-100); border-radius: 22px; padding: 36px 32px 30px; text-decoration: none; box-shadow: 0 22px 44px -34px rgba(26, 28, 32,0.38); transition: transform 0.5s var(--ease), box-shadow 0.5s var(--ease), border-color 0.4s var(--ease); }
.byunbaksa-theme a.bb-card:hover { transform: translateY(-6px); border-color: transparent; box-shadow: 0 36px 66px -36px rgba(26, 28, 32,0.5); }
.byunbaksa-theme .bb-card-icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 13px; background: var(--gray-50); color: var(--navy); margin-bottom: 20px; flex-shrink: 0; }
.byunbaksa-theme .bb-card-title { font-size: 18px; font-weight: 700; color: var(--navy); letter-spacing: -0.5px; margin: 0 0 13px; word-break: keep-all; line-height: 1.5; }
.byunbaksa-theme .bb-card-desc { font-size: 13.5px; color: var(--text-secondary); line-height: 1.78; margin: 0; word-break: keep-all; flex-grow: 1; padding-right: 6px; }
/* 우하단 원형 화살표 버튼 (+ 좌측 메타=날짜 옵션) */
.byunbaksa-theme .bb-card-foot { margin-top: 26px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.byunbaksa-theme .bb-card-meta { font-size: 12px; color: var(--text-muted); letter-spacing: 0.02em; min-width: 0; }
.byunbaksa-theme .bb-card-go { margin-left: auto; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; background: var(--gray-50); color: var(--navy); flex-shrink: 0; transition: background 0.3s var(--ease), color 0.3s var(--ease), transform 0.4s var(--ease); }
.byunbaksa-theme .bb-card-go svg { display: block; }
.byunbaksa-theme a.bb-card:hover .bb-card-go { background: var(--navy); color: #fff; transform: translateX(3px); }

@media (max-width: 900px) {
	.byunbaksa-theme .bb-grid { gap: 20px; }
	.byunbaksa-theme .bb-grid > .bb-card { flex: 0 0 calc((100% - 20px) / 2); }
}
/* 모바일: 카드 1장 온전히 + 다음 카드 약 ¼ 미리보기 → "더 있다" 신호. 화살표 숨기고 스와이프+프로그레스바. */
@media (max-width: 640px) {
	.byunbaksa-theme .bb-grid { gap: 15px; padding: 6px 2px 16px; }
	.byunbaksa-theme .bb-grid > .bb-card { flex: 0 0 80%; }
	.byunbaksa-theme .bb-arrows { display: none; }
}

/* ── 진행 표시(모바일 캐러셀 전용): 슬림 프로그레스 바 + 1/N 카운트 ── */
.byunbaksa-theme .bb-progress { display: none; }
.byunbaksa-theme .bb-progress-track { position: relative; flex: none; width: 56px; height: 1px; border-radius: 1px; background: var(--gray-100); overflow: hidden; }
.byunbaksa-theme .bb-progress-fill { position: absolute; left: 0; top: 0; height: 100%; border-radius: 1px; background: var(--navy); width: 0; transition: width 0.3s cubic-bezier(.22,.61,.36,1); }
.byunbaksa-theme .bb-progress-count { font-size: 11px; font-weight: 600; color: var(--text-muted); font-variant-numeric: tabular-nums; letter-spacing: 0.03em; white-space: nowrap; }
.byunbaksa-theme .bb-progress-count b { color: var(--navy); }
@media (max-width: 640px) {
	.byunbaksa-theme .bb-progress { display: flex; align-items: center; justify-content: flex-start; gap: 9px; margin-top: 14px; }
}
@media (prefers-reduced-motion: reduce) { .byunbaksa-theme .bb-progress-fill { transition: none; } }

/* ── [충돌 차단] 검사도구 퀴즈 진행바 — 위 '모바일 캐러셀 전용' 스텝퍼(.bb-progress/.bb-progress-fill)와 클래스명이 겹쳐,
   도구 전용 래퍼(.bb-page) 안에서 스텝퍼의 display:none(PC)·display:flex(모바일)·fill position:absolute 가 새어드는 문제 차단.
   .bb-page 안에서는 얇은 가로 진행바로 되돌린다(높이·색 등 나머지는 각 도구 인라인 CSS가 지정). 체질검사 등 모든 .bb-page 도구 일괄 적용. ── */
.byunbaksa-theme .bb-page .bb-progress { display: block; position: relative; }
.byunbaksa-theme .bb-page .bb-progress-fill { position: static; }

@media (max-width: 560px) {
	.byunbaksa-theme .bb-sec-title { font-size: 21px; letter-spacing: -0.7px; }
}

/* ============================================================
   ★ FRONT-PAGE (front-page.php) — .bb-* 확산 (2026-08-01)
   컬럼 파일럿 .bb-* 재사용 + 메인 전용 소량 규칙만. 히어로 영상 유지 / 후기카드 캐러셀 편입 / 쇼츠 네이비.
   ============================================================ */
/* ── 히어로: 우측 슬롯 = 소개영상 유지(bb-hero-media--video). nametag는 영상 좌상단에 겹침. ── */
.byunbaksa-theme .bb-hero-media--video { display: flex; align-items: center; }
.byunbaksa-theme .bb-hero-media--video .hero-video-wrap { max-width: 100%; margin: 0; box-shadow: 0 40px 84px -50px rgba(26, 28, 32,0.5); }
.byunbaksa-theme .bb-hero-media--video .bb-nametag { top: -16px; left: -16px; }

/* ── 섹션 헤더: 메인은 좌측정렬 에디토리얼(기준=컬럼). 쇼츠·FAQ 처럼 nav 없는 섹션은 중앙정렬. ── */
.byunbaksa-theme .bb-sec-head--home { max-width: 1200px; margin: 0 auto 40px; }
.byunbaksa-theme .bb-sec-head--center { text-align: center; }
.byunbaksa-theme .bb-sec-head--center .bb-eyebrow { justify-content: center; }
.byunbaksa-theme .bb-sec-head--center .bb-eyebrow::before { display: none; }
.byunbaksa-theme .bb-sec-head--center .bb-sec-title { margin-top: 14px; }
.byunbaksa-theme .bb-sec-head--center .bb-sec-lead { margin-left: auto; margin-right: auto; }

/* ── 카드 소량 추가 슬롯: 클리닉 kicker(최신칼럼) / 자세히보기 CTA(클리닉카드) ── */
.byunbaksa-theme .bb-card-kicker { display: inline-block; font-size: 11.5px; font-weight: 700; letter-spacing: 0.01em; color: var(--blue-accent); margin-bottom: 12px; word-break: keep-all; }
.byunbaksa-theme .bb-card-cta { font-size: 12.5px; font-weight: 600; color: var(--text-muted); letter-spacing: -0.01em; transition: color 0.3s cubic-bezier(0.16,1,0.3,1); }
.byunbaksa-theme a.bb-card:hover .bb-card-cta { color: var(--navy); }

/* ── 6대 클리닉 = 세로 그리드(메인 IA=전부 노출). 데스크톱 3열 / 태블릿·모바일 2열. 캐러셀 아님(화살표·프로그레스 없음). ── */
/* ★ minmax(0,1fr): 트랙이 콘텐츠 최소폭(긴 한글 단어) 밑으로도 줄어들게 → 그리드가 뷰포트 넘김 방지(모바일 좌우 흔들림 근본 원인). */
.byunbaksa-theme .bb-cardgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
@media (max-width: 900px) {
	.byunbaksa-theme .bb-cardgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 640px) {
	/* 모바일 2열 = 폭 좁음 → 컴팩트(빽빽 방지: 내부 여백 유지, 설명 3줄 clamp, CTA 텍스트 숨김·화살표만) */
	.byunbaksa-theme .bb-cardgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.byunbaksa-theme .bb-cardgrid > .bb-card { min-width: 0; min-height: 0; padding: 22px 16px 18px; border-radius: 18px; overflow: hidden; }
	.byunbaksa-theme .bb-cardgrid .bb-card-icon { width: 38px; height: 38px; border-radius: 11px; margin-bottom: 14px; }
	.byunbaksa-theme .bb-cardgrid .bb-card-icon svg { width: 20px; height: 20px; }
	.byunbaksa-theme .bb-cardgrid .bb-card-title { font-size: 15px; margin-bottom: 8px; overflow-wrap: anywhere; }
	.byunbaksa-theme .bb-cardgrid .bb-card-desc { font-size: 12px; line-height: 1.62; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
	.byunbaksa-theme .bb-cardgrid .bb-card-foot { margin-top: 16px; }
	.byunbaksa-theme .bb-cardgrid .bb-card-cta { display: none; }
	.byunbaksa-theme .bb-cardgrid .bb-card-go { width: 34px; height: 34px; }
}

/* ── 후기 = 드리프트 월 (PC 3열 / 태블릿·모바일 2열, 천천히 자동 세로 흐름. 안내문구·탭정지 없음, 데스크톱 hover 시 정지).
   기본(무JS·reduced-motion 폴백) = 정적 그리드(전 카드 보임). JS+모션 시 .rw-anim 부여 → 고정높이 창+세로 흐름.
   ★col3(rw-col-pc)=PC 전용 보너스. col1∪col2 = 전 후기(모바일 2열서 전부 노출). blockquote 서버렌더=AEO. ── */
.byunbaksa-theme .review-wall { display: flex; gap: 16px; align-items: flex-start; }
.byunbaksa-theme .rw-col { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.byunbaksa-theme .rw-col-pc { display: none; }
.byunbaksa-theme .rw-card { background: #fff; border: 1px solid var(--gray-100); border-radius: 18px; padding: 22px 20px; box-shadow: 0 16px 34px -30px rgba(26, 28, 32,0.5); }
.byunbaksa-theme .rw-stars { display: block; color: #E0A94A; font-size: 11.5px; letter-spacing: 2.5px; margin-bottom: 12px; }
.byunbaksa-theme .rw-text { font-size: 13.5px; color: var(--text-secondary); line-height: 1.72; margin: 0; word-break: keep-all; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.byunbaksa-theme .rw-foot { margin-top: 14px; }
.byunbaksa-theme .rw-author { font-style: normal; font-size: 13.5px; font-weight: 700; color: var(--navy); letter-spacing: -0.2px; }
.byunbaksa-theme .rw-clinic { display: block; font-size: 12px; color: var(--text-muted); margin-top: 1px; }
/* 애니메이션 모드: JS가 각 열 2배 복제 후 .rw-anim 부여 → 고정높이 창 + 상하 페이드 + 세로 흐름. 안내문구·탭정지 없음. */
.byunbaksa-theme .review-wall.rw-anim { height: 480px; overflow: hidden;
	-webkit-mask-image: linear-gradient(180deg, transparent 0, #000 11%, #000 89%, transparent 100%);
	mask-image: linear-gradient(180deg, transparent 0, #000 11%, #000 89%, transparent 100%); }
@keyframes rwDrift { from { transform: translateY(0); } to { transform: translateY(-50%); } }
/* 열마다 뚜렷이 다른 '체감 속도(px/초)' = organic 레이어감. ★열 높이(카드수)가 달라 duration만으론 안 됨 → 실측 높이 기준으로 보정.
   현재 높이(col1·2=14카드, col3=12카드)에서 col1 40s(빠름 ~43px/s) / col2 68s(느림 ~26) / col3 44s(중간 ~34). */
.byunbaksa-theme .review-wall.rw-anim .rw-col { will-change: transform; animation: rwDrift 40s linear infinite; }
.byunbaksa-theme .review-wall.rw-anim .rw-col:nth-child(2) { animation-duration: 68s; }
.byunbaksa-theme .review-wall.rw-anim .rw-col:nth-child(3) { animation-duration: 44s; }
.byunbaksa-theme .review-wall.rw-anim:hover .rw-col { animation-play-state: paused; }
@media (min-width: 900px) {
	.byunbaksa-theme .rw-col-pc { display: flex; }
	.byunbaksa-theme .review-wall { gap: 18px; }
	.byunbaksa-theme .rw-col { gap: 18px; }
	.byunbaksa-theme .rw-text { font-size: 13.5px; -webkit-line-clamp: 5; }
	.byunbaksa-theme .review-wall.rw-anim { height: 560px; }
}
@media (max-width: 560px) {
	.byunbaksa-theme .review-wall { gap: 12px; }
	.byunbaksa-theme .rw-col { gap: 12px; }
	.byunbaksa-theme .rw-card { padding: 15px 14px; border-radius: 15px; }
	.byunbaksa-theme .rw-stars { font-size: 10px; letter-spacing: 1.5px; margin-bottom: 8px; }
	.byunbaksa-theme .rw-text { font-size: 12px; line-height: 1.58; }
	.byunbaksa-theme .rw-author { font-size: 11.5px; }
	.byunbaksa-theme .rw-clinic { font-size: 10.5px; }
	.byunbaksa-theme .review-wall.rw-anim { height: 440px; }
}
@media (prefers-reduced-motion: reduce) {
	.byunbaksa-theme .review-wall.rw-anim { height: auto; overflow: visible; -webkit-mask-image: none; mask-image: none; cursor: default; }
	.byunbaksa-theme .review-wall.rw-anim .rw-col { animation: none; }
}

/* ── 유튜브 쇼츠 = 실제 썸네일 릴스형 카드 캐러셀(이모지·플립 폐기). .bb-grid 재사용, 세로 9:16. ── */
.byunbaksa-theme .bb-grid.shorts-grid > .short-card { flex: 0 0 21%; scroll-snap-align: start; position: relative; aspect-ratio: 9 / 16; border-radius: 18px; overflow: hidden; display: block; text-decoration: none; background: var(--navy-deep); box-shadow: 0 22px 44px -34px rgba(26, 28, 32,0.42); }
.byunbaksa-theme .short-thumb { width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 0.6s cubic-bezier(0.16,1,0.3,1); }
.byunbaksa-theme .short-card:hover .short-thumb { transform: scale(1.06); }
.byunbaksa-theme .short-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14, 15, 18,0) 38%, rgba(14, 15, 18,0.82) 100%); pointer-events: none; }
.byunbaksa-theme .short-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,0.94); display: flex; align-items: center; justify-content: center; padding-left: 3px; box-shadow: 0 8px 20px -6px rgba(0,0,0,0.35); transition: transform 0.3s cubic-bezier(0.16,1,0.3,1), background 0.3s; }
.byunbaksa-theme .short-play svg { display: block; }
.byunbaksa-theme .short-card:hover .short-play { transform: translate(-50%,-50%) scale(1.1); background: #fff; }
.byunbaksa-theme .short-title { position: absolute; left: 15px; right: 15px; bottom: 15px; color: #fff; font-size: 13.5px; font-weight: 600; line-height: 1.42; letter-spacing: -0.02em; word-break: keep-all; text-shadow: 0 1px 8px rgba(0,0,0,0.3); }
@media (max-width: 900px) {
	.byunbaksa-theme .bb-grid.shorts-grid > .short-card { flex: 0 0 30%; }
}
@media (max-width: 640px) {
	.byunbaksa-theme .bb-grid.shorts-grid > .short-card { flex: 0 0 46%; border-radius: 15px; }
	.byunbaksa-theme .short-title { font-size: 12.5px; left: 12px; right: 12px; bottom: 12px; }
}

/* ── 병원 둘러보기 = 이미지 아코디언(탭하면 확장 · PC 가로/모바일 세로). 적은 사진에 최적, 실제 원내 사진. ── */
.byunbaksa-theme .bb-tour { display: flex; gap: 12px; height: 460px; margin-top: 4px; }
.byunbaksa-theme .bb-tour-item { position: relative; flex: 1; min-width: 0; border: 0; padding: 0; border-radius: 20px; overflow: hidden; cursor: pointer; background: var(--navy-deep); text-align: left; -webkit-tap-highlight-color: transparent; transition: flex 0.6s cubic-bezier(0.16,1,0.3,1); box-shadow: 0 22px 44px -34px rgba(26, 28, 32,0.5); }
.byunbaksa-theme .bb-tour-item.open { flex: 6; }
.byunbaksa-theme .bb-tour-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s cubic-bezier(0.16,1,0.3,1); }
.byunbaksa-theme .bb-tour-item.open .bb-tour-img { transform: scale(1.02); }
.byunbaksa-theme .bb-tour-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14, 15, 18,0.35) 0%, rgba(14, 15, 18,0.15) 45%, rgba(14, 15, 18,0.78) 100%); transition: background 0.5s; }
.byunbaksa-theme .bb-tour-item:not(.open) .bb-tour-shade { background: rgba(14, 15, 18,0.42); }
.byunbaksa-theme .bb-tour-cap { position: absolute; left: 26px; right: 26px; bottom: 24px; color: #fff; opacity: 0; transform: translateY(8px); transition: opacity 0.45s 0.12s, transform 0.45s 0.12s; pointer-events: none; }
.byunbaksa-theme .bb-tour-item.open .bb-tour-cap { opacity: 1; transform: none; }
.byunbaksa-theme .bb-tour-cap b { display: block; font-size: 20px; font-weight: 700; letter-spacing: -0.3px; text-shadow: 0 2px 12px rgba(0,0,0,0.35); }
.byunbaksa-theme .bb-tour-cap span { display: block; font-size: 13px; color: rgba(255,255,255,0.82); margin-top: 5px; text-shadow: 0 1px 8px rgba(0,0,0,0.35); }
@media (max-width: 640px) {
	/* 모바일 세로: 닫힘 슬림 밴드 / 열림 고정 px(≈정사각형). ★flex:none 필수 + 고정 px(vw 트랜지션은 모바일서 깨짐). */
	.byunbaksa-theme .bb-tour { flex-direction: column; height: auto; gap: 9px; }
	.byunbaksa-theme .bb-tour-item { flex: none; height: 74px; border-radius: 14px; transition: height 0.55s cubic-bezier(0.16,1,0.3,1); }
	.byunbaksa-theme .bb-tour-item.open { flex: none; height: 320px; }
	.byunbaksa-theme .bb-tour-cap { left: 20px; right: 20px; bottom: 18px; }
	.byunbaksa-theme .bb-tour-cap b { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
	.byunbaksa-theme .bb-tour-item, .byunbaksa-theme .bb-tour-img, .byunbaksa-theme .bb-tour-cap, .byunbaksa-theme .bb-tour-shade { transition: none; }
}

/* ============================================================
   ★ SINGLE POST (single.php)
   ============================================================ */
.byunbaksa-theme .cat-strip { height: 6px; width: 100%; position: relative; top: 72px; z-index: 1; }
.byunbaksa-theme .cat-strip.cat-headache  { background: linear-gradient(90deg, #3B6CB4, #5B8FD4); }
.byunbaksa-theme .cat-strip.cat-autonomic { background: linear-gradient(90deg, #1B2A4A, #2C4470); }
.byunbaksa-theme .cat-strip.cat-mental    { background: linear-gradient(90deg, #6B4C9A, #9B7FBF); }
.byunbaksa-theme .cat-strip.cat-dizziness { background: linear-gradient(90deg, #2C7A7B, #4FD1C5); }
.byunbaksa-theme .cat-strip.cat-digestive { background: linear-gradient(90deg, #C05621, #ED8936); }
.byunbaksa-theme .cat-strip.cat-metabolism { background: linear-gradient(90deg, #2B6CB0, #63B3ED); }
.byunbaksa-theme .cat-strip.cat-women     { background: linear-gradient(90deg, #B83280, #ED64A6); }
.byunbaksa-theme .cat-strip.cat-pediatric { background: linear-gradient(90deg, #2F855A, #68D391); }
.byunbaksa-theme .cat-strip.cat-immunity  { background: linear-gradient(90deg, #744210, #D69E2E); }
.byunbaksa-theme .cat-strip.cat-diet      { background: linear-gradient(90deg, #2E9E6E, #6BCB77); }

.byunbaksa-theme .post-hero { padding: 100px 24px 50px; background: linear-gradient(180deg, var(--blue-pale) 0%, var(--white) 100%); border-bottom: 1px solid var(--gray-100); }
.byunbaksa-theme .post-hero-inner { max-width: 760px; margin: 0 auto; }
.byunbaksa-theme .post-category-tag { display: inline-block; font-size: 12px; font-weight: 600; color: var(--blue-accent); background: rgba(59,108,180,0.08); padding: 6px 14px; border-radius: 100px; letter-spacing: 1px; margin-bottom: 20px; text-decoration: none; transition: all 0.2s; }
.byunbaksa-theme .post-category-tag:hover { background: var(--blue-accent); color: white; }
.byunbaksa-theme .post-hero h1 { font-size: 36px; font-weight: 300; line-height: 1.3; letter-spacing: -1.2px; color: var(--navy); margin-bottom: 24px; }
.byunbaksa-theme .post-meta { display: flex; gap: 20px; align-items: center; font-size: 14px; color: var(--text-muted); flex-wrap: wrap; }
.byunbaksa-theme .post-meta-item { display: inline-flex; align-items: center; gap: 6px; }
.byunbaksa-theme .post-meta-item svg { opacity: 0.7; }

.byunbaksa-theme .post-body { max-width: 720px; margin: 0 auto; padding: 60px 24px 80px; }
/* 본문 소제목 = .article h2 와 동일 톤(네이비·밑줄 없음). 구 blue-accent 밑줄바 폐기(무지개 제거·모노크롬). 페이드인은 유지(JS가 .in 부여). */
.byunbaksa-theme .post-body h2 { color: var(--navy); font-size: 24px; font-weight: 700; line-height: 1.4; letter-spacing: -0.6px; margin: 58px 0 20px; scroll-margin-top: 96px; word-break: keep-all; opacity: 0; transform: translateY(8px); transition: opacity 0.45s ease-out, transform 0.45s ease-out; }
.byunbaksa-theme .post-body h2.in { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) { .byunbaksa-theme .post-body h2 { opacity: 1; transform: none; transition: none; } }
.byunbaksa-theme .post-body p { font-size: 17px; color: var(--text-secondary); line-height: 1.95; margin: 0; }
.byunbaksa-theme .post-body p strong { color: var(--navy); font-weight: 600; }
.byunbaksa-theme .post-body p:empty { display: none; }
.byunbaksa-theme .post-body p + p { margin-top: 22px; }
.byunbaksa-theme .post-body p + p.break-soft { margin-top: 16px; }
.byunbaksa-theme .post-body p + p.break-hard { margin-top: 32px; }
.byunbaksa-theme .post-body h2 + p { margin-top: 0; }
.byunbaksa-theme .post-body p:first-of-type { font-size: 18px; color: var(--navy); line-height: 1.9; }
.byunbaksa-theme .post-body p:first-of-type strong { color: var(--navy); background: rgba(26, 28, 32,0.06); padding: 1px 6px; border-radius: 4px; }

.byunbaksa-theme .author-intro { max-width: 720px; margin: 0 auto; padding: 28px 24px 0; }
.byunbaksa-theme .author-intro-card { display: flex; gap: 16px; align-items: center; padding: 16px 20px; background: white; border: 1px solid var(--gray-100); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.byunbaksa-theme .author-intro-photo { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; object-position: 50% 15%; border: 1px solid var(--gray-100); flex-shrink: 0; }
.byunbaksa-theme .author-intro-info { flex: 1; min-width: 0; }
.byunbaksa-theme .author-intro-name { font-size: 15px; font-weight: 700; color: var(--navy); letter-spacing: -0.3px; margin-bottom: 2px; }
.byunbaksa-theme .author-intro-title { font-size: 12px; color: var(--text-muted); font-weight: 500; }
.byunbaksa-theme .author-intro-link { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--navy); font-weight: 600; text-decoration: none; padding: 6px 12px; border-radius: 8px; border: 1px solid var(--gray-200); background: white; transition: all 0.2s; flex-shrink: 0; }
.byunbaksa-theme .author-intro-link:hover { border-color: var(--navy); background: var(--navy); color: white; }

/* ============================================================
   SINGLE POST (글 상세) — 2026-08-06 하이엔드 통일 (.bb-* 재사용, 네이비 모노크롬)
   히어로=좌측정렬 텍스트(포트레이트 없음, 글은 '주제'가 주인공) / 메타 / 관련글 그리드 / 이전다음.
   구 무지개 .cat-strip·.post-hero·.related-post-bar 마크업은 폐기됨(해당 CSS는 dead).
   ============================================================ */
.byunbaksa-theme .bb-hero--article .bb-hero-inner { display: block; max-width: 780px; padding: 128px 24px 52px; }
.byunbaksa-theme .bb-hero--article .breadcrumb { margin-bottom: 18px; }
.byunbaksa-theme .bb-hero--article .bb-hero-kick { display: inline-block; text-transform: none; letter-spacing: 0.02em; text-decoration: none; margin: 0 0 16px; transition: color .2s; }
.byunbaksa-theme .bb-hero--article .bb-hero-kick:hover { color: var(--navy); }
.byunbaksa-theme .bb-hero--article h1 { font-size: clamp(27px, 3.4vw, 40px); font-weight: 400; letter-spacing: -0.03em; line-height: 1.32; color: var(--navy); margin: 0; word-break: keep-all; }
.byunbaksa-theme .bb-hero--article h1 em { font-style: normal; font-weight: 800; color: var(--navy); }
/* 메타(날짜·읽기시간) */
.byunbaksa-theme .bb-post-meta { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; margin-top: 22px; font-size: 13.5px; color: var(--text-muted); }
.byunbaksa-theme .bb-post-meta-item { display: inline-flex; align-items: center; gap: 6px; }
.byunbaksa-theme .bb-post-meta-item svg { opacity: 0.7; }

/* 목차(TOC) — ★라이트 에디토리얼(B 톤, 2026-08-06). 화이트+헤어라인+옅은 앰비언트 그림자(관련클리닉 밴드와 동일 언어). */
.byunbaksa-theme .post-toc { margin: 0 0 30px; padding: 18px 22px; background: #fff; border: 1px solid var(--gray-100); border-radius: var(--radius); box-shadow: 0 18px 40px -36px rgba(26, 28, 32,0.34); }
.byunbaksa-theme .post-toc-title { font-weight: 700; color: var(--navy); font-size: 15px; letter-spacing: -0.2px; margin-bottom: 9px; }
.byunbaksa-theme .post-toc-list { margin: 0; padding-left: 1.25em; }
.byunbaksa-theme .post-toc-list li { margin: 5px 0; line-height: 1.55; }
.byunbaksa-theme .post-toc-list li::marker { color: var(--text-muted); }
.byunbaksa-theme .post-toc-list a { color: var(--text-secondary); text-decoration: none; transition: color .15s; }
.byunbaksa-theme .post-toc-list a:hover { color: var(--navy); text-decoration: underline; }

/* 관련글 = .bb-cardgrid + .bb-card. 좌측정렬 .bb-eyebrow 헤더(eyebrow→title 간격). */
.byunbaksa-theme .related-posts .bb-sec-title { margin-top: 14px; }

/* 이전/다음 글 = 네이비 톤(구 --brand 인라인 대체) */
.byunbaksa-theme .post-adjacent { max-width: 960px; margin: 40px auto 0; padding: 0 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.byunbaksa-theme .post-adjacent-link { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px; border: 1px solid var(--gray-100); border-radius: var(--radius); text-decoration: none; background: #fff; transition: border-color .18s, background .18s; }
.byunbaksa-theme .post-adjacent-link:hover { border-color: var(--navy); background: var(--gray-50); }
.byunbaksa-theme .post-adjacent-link.next { text-align: right; }
.byunbaksa-theme .post-adjacent-label { font-size: 12px; font-weight: 600; color: var(--text-muted); }
.byunbaksa-theme .post-adjacent-title { font-size: 14px; font-weight: 600; color: var(--text-secondary); line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

@media (max-width: 768px) {
  .byunbaksa-theme .bb-hero--article .bb-hero-inner { padding: 108px 20px 40px; }
  .byunbaksa-theme .bb-hero--article h1 { font-size: clamp(23px, 6.4vw, 30px); line-height: 1.36; }
  .byunbaksa-theme .post-adjacent { grid-template-columns: 1fr; }
}

/* 관련 클리닉 밴드 = ★라이트 에디토리얼(B, 2026-08-06 사용자 선택). 구 솔리드 네이비 폐기.
   화이트+헤어라인+옅은 앰비언트 그림자 + 우하단 네이비 원형화살표(.bb-card 패밀리와 동일 언어). */
.byunbaksa-theme .related-hub { max-width: 720px; margin: 48px auto 0; padding: 0 24px; }
.byunbaksa-theme .related-hub-card { display: block; background: #fff; color: inherit; border: 1px solid var(--gray-100); border-radius: var(--radius-lg); padding: 32px 36px; text-decoration: none; position: relative; overflow: hidden; box-shadow: 0 18px 40px -36px rgba(26, 28, 32,0.34); transition: transform 0.4s cubic-bezier(0.16,1,0.3,1), box-shadow 0.4s cubic-bezier(0.16,1,0.3,1), border-color 0.3s; }
.byunbaksa-theme .related-hub-card:hover { transform: translateY(-3px); border-color: var(--navy); box-shadow: 0 22px 48px -34px rgba(26, 28, 32,0.42); }
.byunbaksa-theme .related-hub-label { font-size: 12px; color: var(--blue-accent); font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; margin-bottom: 11px; }
.byunbaksa-theme .related-hub-title { font-size: 23px; font-weight: 800; color: var(--navy); margin-bottom: 9px; letter-spacing: -0.5px; line-height: 1.3; word-break: keep-all; }
.byunbaksa-theme .related-hub-desc { font-size: 14px; color: var(--text-secondary); line-height: 1.7; margin-bottom: 18px; max-width: 78%; word-break: keep-all; }
.byunbaksa-theme .related-hub-arrow { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--navy); }
.byunbaksa-theme .related-hub-go { position: absolute; right: 30px; bottom: 30px; width: 40px; height: 40px; border-radius: 50%; background: var(--navy); color: #fff; display: flex; align-items: center; justify-content: center; transition: transform 0.3s; }
.byunbaksa-theme .related-hub-card:hover .related-hub-go { transform: translateX(3px); }

.byunbaksa-theme .related-posts { max-width: 1200px; margin: 80px auto 0; padding: 0 24px; }
.byunbaksa-theme .related-posts-header { text-align: center; margin-bottom: 40px; }
.byunbaksa-theme .related-posts-tag { font-size: 12px; font-weight: 600; color: var(--blue-accent); letter-spacing: 2px; text-transform: uppercase; margin-bottom: 12px; }
.byunbaksa-theme .related-posts-title { font-size: 26px; font-weight: 700; color: var(--navy); letter-spacing: -0.5px; }
.byunbaksa-theme .related-posts-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.byunbaksa-theme .related-post-card { background: white; border: 1px solid var(--gray-100); border-radius: var(--radius); overflow: hidden; text-decoration: none; color: inherit; transition: all 0.25s; display: flex; flex-direction: column; }
.byunbaksa-theme .related-post-card:hover { border-color: var(--blue-accent); box-shadow: var(--shadow-md); transform: translateY(-3px); }
.byunbaksa-theme .related-post-bar { height: 4px; }
.byunbaksa-theme .related-post-bar.cat-headache  { background: linear-gradient(90deg, #3B6CB4, #5B8FD4); }
.byunbaksa-theme .related-post-bar.cat-autonomic { background: linear-gradient(90deg, #1B2A4A, #2C4470); }
.byunbaksa-theme .related-post-bar.cat-mental    { background: linear-gradient(90deg, #6B4C9A, #9B7FBF); }
.byunbaksa-theme .related-post-bar.cat-dizziness { background: linear-gradient(90deg, #2C7A7B, #4FD1C5); }
.byunbaksa-theme .related-post-bar.cat-digestive { background: linear-gradient(90deg, #C05621, #ED8936); }
.byunbaksa-theme .related-post-bar.cat-metabolism { background: linear-gradient(90deg, #2B6CB0, #63B3ED); }
.byunbaksa-theme .related-post-bar.cat-women     { background: linear-gradient(90deg, #B83280, #ED64A6); }
.byunbaksa-theme .related-post-bar.cat-pediatric { background: linear-gradient(90deg, #2F855A, #68D391); }
.byunbaksa-theme .related-post-bar.cat-immunity  { background: linear-gradient(90deg, #744210, #D69E2E); }
.byunbaksa-theme .related-post-bar.cat-diet      { background: linear-gradient(90deg, #2E9E6E, #6BCB77); }
.byunbaksa-theme .related-post-body { padding: 24px 22px; flex: 1; display: flex; flex-direction: column; }
.byunbaksa-theme .related-post-cat { font-size: 12px; font-weight: 600; color: var(--blue-accent); background: rgba(59,108,180,0.08); display: inline-block; padding: 4px 10px; border-radius: 6px; margin-bottom: 12px; align-self: flex-start; letter-spacing: 0.3px; }
.byunbaksa-theme .related-post-title { font-size: 16px; font-weight: 600; color: var(--navy); line-height: 1.5; margin-bottom: 10px; letter-spacing: -0.3px; }
.byunbaksa-theme .related-post-excerpt { font-size: 13px; color: var(--text-muted); line-height: 1.7; flex: 1; }

/* ============================================================
   PRIVACY MODAL — footer.php에 인라인 (privacy-modal.js → CSS 이관)
   ============================================================ */
.byunbaksa-theme .privacy-modal-backdrop { display: none; position: fixed; inset: 0; background: rgba(15,23,42,0.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); z-index: 1100; align-items: center; justify-content: center; padding: 24px; }
.byunbaksa-theme .privacy-modal-backdrop.open { display: flex; }
.byunbaksa-theme .privacy-modal { background: white; width: 100%; max-width: 720px; max-height: 85vh; border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,0.25); display: flex; flex-direction: column; overflow: hidden; }
.byunbaksa-theme .privacy-modal-header { display: flex; align-items: center; justify-content: space-between; padding: 22px 28px; border-bottom: 1px solid #E5E7EB; }
.byunbaksa-theme .privacy-modal-title { font-size: 18px; font-weight: 700; color: #1B2A4A; letter-spacing: -0.3px; }
.byunbaksa-theme .privacy-modal-close { width: 36px; height: 36px; border: none !important; background: transparent !important; color: #475569 !important; cursor: pointer; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: background 0.2s; padding: 0; }
.byunbaksa-theme .privacy-modal-close:hover { background: #F8FAFC !important; color: #1B2A4A !important; }
.byunbaksa-theme .privacy-modal-close svg { stroke: #475569 !important; fill: none !important; pointer-events: none; }
.byunbaksa-theme .privacy-modal-close:hover svg { stroke: #1B2A4A !important; }
.byunbaksa-theme .privacy-modal-body { padding: 24px 28px 32px; overflow-y: auto; color: #475569; font-size: 14px; line-height: 1.75; }
.byunbaksa-theme .privacy-modal-body h3 { color: #1B2A4A; font-size: 15px; font-weight: 700; margin: 22px 0 8px; letter-spacing: -0.2px; }
.byunbaksa-theme .privacy-modal-body h3:first-child { margin-top: 0; }
.byunbaksa-theme .privacy-modal-body p { margin: 0 0 8px; }
.byunbaksa-theme .privacy-modal-body ul { margin: 0 0 8px; padding-left: 18px; }
.byunbaksa-theme .privacy-modal-body li { margin-bottom: 4px; }
.byunbaksa-theme .privacy-modal-body .privacy-meta { margin-top: 24px; padding-top: 16px; border-top: 1px dashed #D8DCE4; font-size: 13px; color: #94A3B8; }

/* ============================================================
   RESPONSIVE — 1024px / 768px / 640px
   ============================================================ */
@media (max-width: 1024px) {
  .byunbaksa-theme .nav-links { gap: 20px; }
  .byunbaksa-theme .hero { grid-template-columns: 1fr; gap: 40px; min-height: auto; padding: 120px 24px 60px; }
  .byunbaksa-theme .hero-visual { order: -1; }
  .byunbaksa-theme .hero-video-wrap { max-width: 100%; }
  .byunbaksa-theme .hero h1 { font-size: 34px; }
  .byunbaksa-theme .philosophy-inner { grid-template-columns: 1fr; column-gap: 0; row-gap: 30px; }
  .byunbaksa-theme .philosophy-lead { grid-column: 1; grid-row: 1; }
  .byunbaksa-theme .philosophy-photo-wrap { grid-column: 1; grid-row: 2; }
  .byunbaksa-theme .philosophy-principles { grid-column: 1; grid-row: 3; }
  .byunbaksa-theme .philosophy-photo { min-height: 0; max-height: none; height: auto; aspect-ratio: 4 / 3.2; }
  .byunbaksa-theme .posts-grid { grid-template-columns: repeat(2, 1fr); }
  .byunbaksa-theme .info-inner { grid-template-columns: 1fr; }
  .byunbaksa-theme .stats-inner { grid-template-columns: repeat(2, 1fr); gap: 24px; }

  .byunbaksa-theme .hub-hero-inner { grid-template-columns: 1fr; gap: 40px; }
  .byunbaksa-theme .hub-doctor-card { max-width: 420px; }
  .byunbaksa-theme .hub-hero h1 { font-size: 34px; }
  .byunbaksa-theme .scenario-card { width: calc((100% - 20px) / 2); min-width: calc((100% - 20px) / 2); }
  .byunbaksa-theme .hub-posts-grid { grid-template-columns: repeat(2, 1fr); }
  .byunbaksa-theme .related-grid { grid-template-columns: 1fr; }

  .byunbaksa-theme .modality-grid { grid-template-columns: repeat(3, 1fr); }
  .byunbaksa-theme .modality-card:nth-child(4), .byunbaksa-theme .modality-card:nth-child(5) { grid-column: auto; }

  .byunbaksa-theme .related-posts-grid { grid-template-columns: repeat(2, 1fr); }
  .byunbaksa-theme .related-posts-grid > :nth-child(3) { display: none; }
}
@media (max-width: 768px) {
  .byunbaksa-theme .nav-links { margin-left: auto; margin-right: 12px; gap: 0; }
  .byunbaksa-theme .nav-links li:not(:last-child) { display: none; }
  .byunbaksa-theme .nav-cta { padding: 8px 16px !important; font-size: 13px !important; }
  .byunbaksa-theme .nav-mobile-btn { display: block; }
  .byunbaksa-theme .article-hero { padding: 100px 20px 60px; }
  .byunbaksa-theme .article-hero h1 { font-size: 28px; }
  .byunbaksa-theme .article-hero-desc { font-size: 16px; }
  .byunbaksa-theme .doctor-card { grid-template-columns: 1fr; text-align: center; padding: 30px 22px; margin: 30px auto 40px; gap: 22px; }
  .byunbaksa-theme .doctor-photo { margin: 0 auto; width: 148px; height: 168px; }
  .byunbaksa-theme .doctor-credentials { grid-template-columns: 1fr; text-align: left; max-width: 300px; margin: 0 auto; }
  .byunbaksa-theme .article { padding: 20px 20px 60px; }
  .byunbaksa-theme .article > p { font-size: 15px; line-height: 1.9; }
  .byunbaksa-theme .article h2 { font-size: 22px; margin: 44px 0 18px; }
  .byunbaksa-theme .pullquote { padding: 36px 16px; margin: 46px 0; }
  .byunbaksa-theme .qbox { padding: 20px 22px; }
  .byunbaksa-theme .qbox p { font-size: 15px; }
  .byunbaksa-theme .bb-credlist { margin-top: 48px; padding-top: 28px; }
  .byunbaksa-theme .bb-credlist-items { grid-template-columns: 1fr; gap: 8px; }
  .byunbaksa-theme .bb-credlist-name { font-size: 18px; }
  .byunbaksa-theme .bb-credlist-title { display: block; margin-left: 0; margin-top: 3px; }
  .byunbaksa-theme .bb-explainer { margin: 34px auto; }
  .byunbaksa-theme .bb-explainer-lower { max-width: 90%; }
  .byunbaksa-theme .bb-explainer-box { padding: 5px 11px; }
  .byunbaksa-theme .bb-explainer-cap,
  .byunbaksa-theme .post-body .bb-explainer .bb-explainer-cap { font-size: 13px; line-height: 1.38; }
  .byunbaksa-theme .bb-explainer-tab { font-size: 10.5px; padding: 3px 10px; }
  .byunbaksa-theme .premise { margin-top: 40px; padding: 0 20px; }
  .byunbaksa-theme .premise-tools span { font-size: 14px; padding: 8px 14px; }
  .byunbaksa-theme .premise-body p { font-size: 15px; }
  .byunbaksa-theme .premise-body p.strong-line { font-size: 18px; }
  .byunbaksa-theme .modalities { margin-top: 60px; padding: 0 20px; }
  .byunbaksa-theme .modality-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .byunbaksa-theme .modality-card:nth-child(5) { grid-column: 1 / -1; }
  .byunbaksa-theme .modality-card { padding: 20px 14px; }
  .byunbaksa-theme .modality-icon { width: 42px; height: 42px; font-size: 18px; margin-bottom: 10px; }
  .byunbaksa-theme .modality-name { font-size: 15px; }
  .byunbaksa-theme .modality-desc { font-size: 12px; }
  .byunbaksa-theme .modalities-title { font-size: 22px; }
  .byunbaksa-theme .closing { margin-top: 60px; padding: 0 20px 60px; }
  .byunbaksa-theme .closing > p { font-size: 15px; line-height: 1.9; }
  .byunbaksa-theme .cross-link-section { padding: 60px 20px; }
  .byunbaksa-theme .cross-link-card { padding: 26px 24px; }
  .byunbaksa-theme .cross-link-title { font-size: 19px; }

  .byunbaksa-theme .post-hero { padding: 90px 20px 40px; }
  .byunbaksa-theme .post-hero h1 { font-size: 22px; line-height: 1.35; }
  .byunbaksa-theme .post-meta { gap: 14px; font-size: 13px; }
  .byunbaksa-theme .post-body { padding: 40px 20px 60px; }
  .byunbaksa-theme .post-body h2 { font-size: 18px; padding: 0 0 6px; margin: 40px 0 16px; border-bottom-width: 2px; }
  .byunbaksa-theme .author-intro { padding: 20px 20px 0; }
  .byunbaksa-theme .author-intro-card { padding: 14px 16px; gap: 12px; }
  .byunbaksa-theme .author-intro-photo { width: 48px; height: 48px; }
  .byunbaksa-theme .author-intro-name { font-size: 14px; }
  .byunbaksa-theme .author-intro-title { font-size: 11px; }
  .byunbaksa-theme .author-intro-link { padding: 5px 10px; font-size: 11px; }
  .byunbaksa-theme .post-body p { font-size: 15px; line-height: 1.9; }
  .byunbaksa-theme .post-body p:first-of-type { font-size: 16px; }
  .byunbaksa-theme .related-hub-card { padding: 26px 22px 60px; }
  .byunbaksa-theme .related-hub-title { font-size: 20px; }
  .byunbaksa-theme .related-hub-desc { max-width: none; margin-bottom: 4px; }
  .byunbaksa-theme .related-hub-go { right: 20px; bottom: 20px; width: 38px; height: 38px; }
  .byunbaksa-theme .related-posts-grid { grid-template-columns: 1fr; }
  .byunbaksa-theme .related-posts-grid > :nth-child(2), .byunbaksa-theme .related-posts-grid > :nth-child(3) { display: block; }
}
@media (max-width: 640px) {
  .byunbaksa-theme .hero { padding: 100px 20px 40px; }
  .byunbaksa-theme .hero h1 { font-size: 28px; }
  .byunbaksa-theme .hero-desc { font-size: 15px; }
  .byunbaksa-theme .hero-video-wrap { max-width: 100%; }
  .byunbaksa-theme .btn-primary, .byunbaksa-theme .btn-secondary, .byunbaksa-theme .btn-kakao, .byunbaksa-theme .btn-naver { justify-content: center; text-align: center; }
  .byunbaksa-theme .section { padding: 64px 20px; }
  .byunbaksa-theme .section-title { font-size: 26px; }
  .byunbaksa-theme .philosophy { padding: 72px 20px; }
  .byunbaksa-theme .philosophy-photo { aspect-ratio: 4 / 3.4; object-position: 60% center; border-radius: 22px; }
  .byunbaksa-theme .philosophy-inner { row-gap: 26px; }
  .byunbaksa-theme .pp-txt h3 { font-size: 16px; }
  .byunbaksa-theme .review-section { padding: 64px 20px; }
  .byunbaksa-theme .posts-grid { grid-template-columns: 1fr; }
  .byunbaksa-theme .stats-inner { grid-template-columns: repeat(2, 1fr); padding: 40px 20px; }
  .byunbaksa-theme .stat-number { font-size: 28px; }
  .byunbaksa-theme .info-card { padding: 28px; }
  .byunbaksa-theme .cta-section { padding: 60px 20px; }
  .byunbaksa-theme.single .cta-section { margin-top: 60px; }
  .byunbaksa-theme .cta-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; max-width: 360px; margin: 0 auto; }
  .byunbaksa-theme .cta-btn-naver, .byunbaksa-theme .cta-btn-kakao { padding: 14px 0; font-size: 15px; justify-content: center; }
  .byunbaksa-theme .cta-section h2 { font-size: 24px; }
  .byunbaksa-theme .footer { padding-bottom: 110px; }

  .byunbaksa-theme .hub-hero { padding: 100px 20px 40px; }
  .byunbaksa-theme .hub-hero h1 { font-size: 26px; }
  .byunbaksa-theme .hub-hero-desc { font-size: 14px; }
  .byunbaksa-theme .hub-doctor-card { padding: 20px; gap: 14px; }
  .byunbaksa-theme .hub-doctor-photo { width: 60px; height: 60px; }
  .byunbaksa-theme .hub-doctor-info strong { font-size: 15px; }
  .byunbaksa-theme .scenario-section { padding: 56px 20px; }
  .byunbaksa-theme .hub-section-title { font-size: 22px; }
  /* 모바일: JS transform 대신 native 가로 스크롤 + scroll-snap (리뷰 캐러셀과 동일 패턴) */
  .byunbaksa-theme .scenario-carousel-wrap > div { overflow-x: auto !important; overflow-y: hidden !important; -webkit-overflow-scrolling: touch; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .byunbaksa-theme .scenario-carousel-wrap > div::-webkit-scrollbar { display: none; }
  .byunbaksa-theme .scenario-carousel { transform: none !important; gap: 12px; padding: 0 4px; }
  .byunbaksa-theme .scenario-card { min-width: calc(100% - 8px); width: calc(100% - 8px); padding: 28px 24px; min-height: 200px; scroll-snap-align: center; }
  .byunbaksa-theme .scenario-card::before { font-size: 54px; top: 10px; right: 20px; }
  .byunbaksa-theme .scenario-nav { display: none; }
  .byunbaksa-theme .scenario-title { font-size: 17px; }
  .byunbaksa-theme .approach-section { padding: 60px 20px; }
  .byunbaksa-theme .approach-block { grid-template-columns: 1fr; gap: 10px; padding: 24px 0; }
  .byunbaksa-theme .approach-num { font-size: 26px; }
  .byunbaksa-theme .approach-body h3 { font-size: 17px; }
  .byunbaksa-theme .approach-body p { font-size: 14px; line-height: 1.8; }
  .byunbaksa-theme .posts-section { padding: 20px 20px 60px; }
  .byunbaksa-theme .posts-toolbar { flex-direction: column; align-items: stretch; padding: 14px; gap: 10px; }
  .byunbaksa-theme .toolbar-search { max-width: none; }
  .byunbaksa-theme .hub-posts-grid { grid-template-columns: 1fr; gap: 14px; }
  .byunbaksa-theme .hub-post-card { padding: 22px 20px; }
  .byunbaksa-theme .hub-post-title { font-size: 16px; }
  .byunbaksa-theme .pagination .page-numbers { min-width: 36px; height: 36px; font-size: 13px; }
  .byunbaksa-theme .faq-section { padding: 56px 20px; }
  .byunbaksa-theme .faq-question { padding: 16px 18px; font-size: 14px; }
  .byunbaksa-theme .faq-answer-inner { padding: 0 18px 18px 40px; font-size: 13px; }
  .byunbaksa-theme .related-section { padding: 56px 20px; }

  .byunbaksa-theme .privacy-modal-backdrop { padding: 16px; align-items: flex-end; }
  .byunbaksa-theme .privacy-modal { max-height: 85vh; border-radius: 16px; }
  .byunbaksa-theme .privacy-modal-header { padding: 18px 20px; }
  .byunbaksa-theme .privacy-modal-body { padding: 20px 20px 28px; font-size: 13.5px; }

  .byunbaksa-theme .mobile-menu-backdrop { display: block; position: fixed; inset: 0; background: rgba(26, 28, 32,0.3); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); z-index: 1001; opacity: 0; pointer-events: none; transition: opacity 0.3s ease; }
  .byunbaksa-theme .mobile-menu-backdrop.open { opacity: 1; pointer-events: auto; }
  .byunbaksa-theme .mobile-menu { display: block; position: fixed; top: 0; right: 0; bottom: 0; width: 75%; max-width: 320px; background: white; z-index: 1002; transform: translateX(100%); transition: transform 0.35s cubic-bezier(.2,.7,.2,1); box-shadow: -8px 0 40px rgba(26, 28, 32,0.15); padding: 72px 24px 80px; overflow-y: auto; }
  .byunbaksa-theme .mobile-menu.open { transform: translateX(0); }
  .byunbaksa-theme .mobile-menu-links { list-style: none; padding: 0; margin: 0; }
  .byunbaksa-theme .mobile-menu-links li { border-bottom: 1px solid var(--gray-100); }
  .byunbaksa-theme .mobile-menu-links li:first-child { border-top: 1px solid var(--gray-100); }
  .byunbaksa-theme .mobile-menu-links a { display: flex; align-items: center; justify-content: space-between; padding: 20px 4px; color: var(--navy); text-decoration: none; font-size: 18px; font-weight: 500; transition: color 0.2s, padding-left 0.2s; }
  .byunbaksa-theme .mobile-menu-links a::after { content: '→'; color: var(--gray-300); font-size: 18px; font-weight: 300; transition: transform 0.2s, color 0.2s; }
  .byunbaksa-theme .mobile-menu-links a:active { color: var(--blue-accent); padding-left: 8px; }
  .byunbaksa-theme .mobile-menu-links a:active::after { color: var(--blue-accent); transform: translateX(4px); }
  /* 진료과목 그룹 라벨 / 구분선 */
  .byunbaksa-theme .mobile-menu-links li.mm-group-label { border: none; padding: 22px 4px 6px; font-size: 13px; font-weight: 700; letter-spacing: 0.04em; color: var(--blue-accent); }
  .byunbaksa-theme .mobile-menu-links li.mm-group-label + li { border-top: 1px solid var(--gray-100); }
  .byunbaksa-theme .mobile-menu-links li.mm-divider { border: none; height: 10px; }
  .byunbaksa-theme .mobile-menu-links li.mm-divider + li { border-top: 1px solid var(--gray-100); }
}

/* prefers-reduced-motion 보호 */
@media (prefers-reduced-motion: reduce) {
  .byunbaksa-theme .reveal, .byunbaksa-theme .reveal.in-view, .byunbaksa-theme .reveal.in { opacity: 1; transform: none; transition: none; }
  .byunbaksa-theme .approach-body p em { background-size: 100% 100% !important; transition: none; }
  .byunbaksa-theme *, .byunbaksa-theme *::before, .byunbaksa-theme *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* ============================================================
   하단 스티키바 (세로 롤 + 연락 채널 통합) + 캐러셀 모달  (tiger_bubu 이식 · 네이비 톤)
   마크업: banner.php + footer.php  ·  데이터: banner-data.php  ·  동작: footer.php 인라인 JS
   캐러셀 = CSS scroll-snap (외부 라이브러리 없음).  플로팅 FAB는 폐기(채널을 바 안으로 통합).
   ============================================================ */
.byunbaksa-theme .evdock, .byunbaksa-theme .evbar, .byunbaksa-theme .evmodal { /* --bb-ease 는 :root 전역 정의(§상단) 사용 — 중복 재정의 제거(세션10) */
  --evbar-bottom: clamp(14px, 2.4vw, 22px); --evbar-h: 56px; --evbar-w: min(640px, calc(100vw - 32px)); }

@keyframes bbEvPulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .5; transform: scale(.82); } }

/* ══ 하단 글라스 도크 = 바(닫힘) → 위로 자라 배너 패널(열림). 바+패널이 한 몸·한 재질. ══ */
.byunbaksa-theme .evdock { position: fixed; z-index: 1004; left: 50%; bottom: var(--evbar-bottom); width: var(--evbar-w);
  display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden;
  transform: translateX(-50%); opacity: 1;  /* ★2026-08-07: 즉시 고정 표시(등장 슬라이드업 제거) — 하단바가 느리게 올라오던 것 해결 + 900ms 지연 페인트 제거(성능) */
  background: rgba(255,255,255,.72); backdrop-filter: blur(22px) saturate(180%); -webkit-backdrop-filter: blur(22px) saturate(180%);
  border: 1px solid rgba(255,255,255,.9); border-radius: 16px;   /* 상단 네비와 동일(16→열림20). 작은 값이라 높이 자라도 반경 흔들림 없음 */
  box-shadow: 0 0 0 .5px rgba(26, 28, 32,.15), 0 2px 8px -2px rgba(26, 28, 32,.14), 0 20px 44px -16px rgba(26, 28, 32,.46), inset 0 1px 0 rgba(255,255,255,.8);
  transition: transform .7s var(--bb-ease), opacity .5s var(--bb-ease), border-radius .4s var(--bb-ease), box-shadow .4s var(--bb-ease), background .4s var(--bb-ease); }
.byunbaksa-theme .evdock.show { transform: translateX(-50%) translateY(0); opacity: 1; }
.byunbaksa-theme .evdock:not(.open):hover { background: rgba(255,255,255,.80);
  box-shadow: 0 0 0 .5px rgba(26, 28, 32,.18), 0 2px 8px -2px rgba(26, 28, 32,.16), 0 24px 52px -16px rgba(26, 28, 32,.50), inset 0 1px 0 rgba(255,255,255,.85); }
/* 열림 = 도크가 위로 자람. 라디우스를 알약(999)→카드(24)로 줄임(상단 네비처럼 커야 늘어나는 결). */
.byunbaksa-theme .evdock.open { z-index: 1605; border-radius: 20px; background: rgba(255,255,255,.90);
  box-shadow: 0 0 0 .5px rgba(26, 28, 32,.16), 0 30px 70px -24px rgba(14, 15, 18,.5), inset 0 1px 0 rgba(255,255,255,.85); }

/* 패널 = 닫힘 시 높이 0 → 열림 시 자람(도크가 위로 늘어남). 별도 배경 없음 = 도크 글라스로 재질 통일. */
.byunbaksa-theme .evpanel { flex: 0 0 auto; height: 0; overflow: hidden; transition: height .55s var(--bb-ease); }
.byunbaksa-theme .evdock.open .evpanel { height: min(76vh, 720px); }
@media (prefers-reduced-motion: reduce) { .byunbaksa-theme .evpanel { transition: none; } }

/* 스크림 (배경 딤 · 탭하면 닫힘) */
.byunbaksa-theme .evscrim { position: fixed; inset: 0; z-index: 1600; background: rgba(14, 15, 18,.42);
  backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); opacity: 0; pointer-events: none; transition: opacity .4s var(--bb-ease); }
.byunbaksa-theme .evscrim.on { opacity: 1; pointer-events: auto; }

/* 바 = 도크 안 하단 고정 행 (position·배경 없음 — 도크가 재질 제공) */
.byunbaksa-theme .evbar { flex: 0 0 auto; width: 100%; height: var(--evbar-h); display: flex; align-items: center; gap: 10px; padding: 0 8px 0 18px; }
.byunbaksa-theme .evbar-closelbl { display: none; flex: 1 1 auto; min-width: 0; align-items: center; gap: 6px;
  font-size: 14px; font-weight: 600; color: var(--navy); letter-spacing: -0.01em; }
.byunbaksa-theme .evbar-closelbl svg { flex: 0 0 auto; }
.byunbaksa-theme .evdock.open .evbar-vp, .byunbaksa-theme .evdock.open .evbar-live { display: none; }
.byunbaksa-theme .evdock.open .evbar-closelbl { display: inline-flex; }

/* 문구 영역(탭 → 열기/닫기, 좌우 스와이프) */
.byunbaksa-theme .evbar-main { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 13px; height: 100%;
  cursor: pointer; user-select: none; -webkit-user-select: none; touch-action: pan-y; border-radius: 999px;
  transition: filter .3s var(--bb-ease), opacity .3s var(--bb-ease); }
.byunbaksa-theme .evbar-main:focus-visible { outline: 2px solid var(--blue-accent); outline-offset: 3px; }
.byunbaksa-theme .evbar-live { width: 7px; height: 7px; border-radius: 50%; background: var(--blue-accent); flex: 0 0 auto; animation: bbEvPulse 2.2s ease-in-out infinite; }
.byunbaksa-theme .evbar-vp { position: relative; flex: 1; height: 22px; overflow: hidden; min-width: 0; }
.byunbaksa-theme .evbar-track { position: absolute; left: 0; right: 0; top: 0; transition: transform .6s var(--bb-ease); }
.byunbaksa-theme .evbar-track.no-anim { transition: none; }
.byunbaksa-theme .evbar-line { height: 22px; display: flex; align-items: center; gap: 8px;
  font-size: 14px; font-weight: 500; color: var(--navy); letter-spacing: -0.01em; white-space: nowrap; overflow: hidden; }
.byunbaksa-theme .evbar-line .tx { overflow: hidden; text-overflow: ellipsis; }
.byunbaksa-theme .evbar-line .aw { color: var(--text-muted); font-weight: 400; flex-shrink: 0; }
/* 슬림 바(배너 0개) 라벨 */
.byunbaksa-theme .evbar-slimlabel { flex: 1 1 auto; min-width: 0; font-size: 14px; font-weight: 500; color: var(--navy);
  letter-spacing: -0.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ══ 연락 채널 (전화 상시 + 네이버·카톡 / 모바일은 ···로 접힘) ══ */
.byunbaksa-theme .evbar-ch { position: relative; flex: 0 0 auto; display: flex; align-items: center; gap: 6px; }
.byunbaksa-theme .evbar-div { width: 0.5px; height: 24px; background: var(--gray-200); margin: 0 4px 0 2px; flex: 0 0 auto; }
/* ★애플식 미니멀 화이트 + 포인트 레드(전화). 채널=무채색 그래파이트 유리 원, 전화만 레드 글리프. */
.byunbaksa-theme .evbar-ico { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%;
  border: 1px solid rgba(0,0,0,.07); color: #48484A; background: rgba(255,255,255,.9); text-decoration: none; flex: 0 0 auto;
  box-shadow: 0 4px 12px -5px rgba(20,22,28,.28), inset 0 1px 0 rgba(255,255,255,.8);
  transition: background .3s var(--bb-ease), color .3s var(--bb-ease), border-color .3s var(--bb-ease), box-shadow .3s var(--bb-ease), transform .15s var(--bb-ease); }
.byunbaksa-theme .evbar-ico:hover { background: #EFEFF2; color: #1D1D1F; border-color: rgba(0,0,0,.08); }
.byunbaksa-theme .evbar-ico:active { transform: scale(.93); }
/* 전화 = 유일한 컬러 포인트. 꽉 찬 레드 원 + 흰 아이콘(예약 CTA로 확 띄움). */
.byunbaksa-theme .evbar-ico--phone { background: var(--accent); color: #fff; border-color: transparent;
  box-shadow: 0 4px 13px -4px rgba(228,3,46,.5), inset 0 1px 0 rgba(255,255,255,.25); }
.byunbaksa-theme .evbar-ico--phone:hover { background: var(--accent-ink); color: #fff; }
.byunbaksa-theme .evbar-net { display: flex; align-items: center; gap: 6px; }
.byunbaksa-theme .evbar-more { display: none; }   /* PC = 채널 상시 노출, ··· 숨김 */

@media (max-width: 560px) {
  .byunbaksa-theme .evbar, .byunbaksa-theme .evmodal { --evbar-bottom: 12px; --evbar-h: 52px; --evbar-w: calc(100vw - 24px); }
  .byunbaksa-theme .evbar { gap: 8px; padding: 0 7px 0 15px; }
  .byunbaksa-theme .evbar-line, .byunbaksa-theme .evbar-slimlabel { font-size: 13px; }
  .byunbaksa-theme .evbar-div { height: 22px; margin: 0 2px; }
  .byunbaksa-theme .evbar-ico { width: 31px; height: 31px; }
  .byunbaksa-theme .evbar-more { display: inline-flex; align-items: center; justify-content: center; width: 31px; height: 31px; border-radius: 50%;
    border: 0.5px solid var(--gray-200); background: rgba(255,255,255,.94); color: var(--navy); cursor: pointer; padding: 0; flex: 0 0 auto;
    box-shadow: 0 3px 10px -4px rgba(14, 15, 18,.32), 0 0 0 .5px rgba(26, 28, 32,.07);
    transition: background .3s var(--bb-ease), color .3s var(--bb-ease), border-color .3s var(--bb-ease), box-shadow .3s var(--bb-ease), transform .18s var(--bb-ease); }
  /* ★활성(배너 열림/··· 누름) = 레드 포인트를 ···로 이동(§1-2 한 화면 1포인트). ···=빨강 채움, 전화기=무채색 글라스로 스왑. */
  /* 부드럽게: bg·shadow 크로스페이드(.3s, 위 transition)에 + ···가 빨강 될 때 살짝 통통 팝(레드 포인트 "착지"감). */
  .byunbaksa-theme .evbar.chopen .evbar-more { background: var(--accent); color: #fff; border-color: transparent;
    box-shadow: 0 4px 13px -4px rgba(228,3,46,.5), inset 0 1px 0 rgba(255,255,255,.25);
    animation: evbarDotPop .34s var(--bb-ease); }
  @keyframes evbarDotPop { 0% { transform: scale(.86); } 55% { transform: scale(1.11); } 100% { transform: scale(1); } }
  .byunbaksa-theme .evbar.chopen .evbar-ico--phone { background: rgba(255,255,255,.9); color: #48484A; border-color: rgba(0,0,0,.07);
    box-shadow: 0 4px 12px -5px rgba(20,22,28,.28), inset 0 1px 0 rgba(255,255,255,.8); }   /* 열림 시 전화 = 네이버·카톡과 같은 무배경 글라스 */
  .byunbaksa-theme .evbar.chopen .evbar-ico--phone:hover { background: #EFEFF2; color: #1D1D1F; }
  /* ★··· 직접 눌러 채널이 열릴 때(배너 닫힘) = 채널 버튼이 좌측 티커("N월 …이벤트") 위로 겹침 → 뒤 티커를 블러+살짝 페이드로 물러나게.
     배너 열림(.evdock.open, 좌측이 '닫기') 상태는 사용자 결정으로 제외. */
  .byunbaksa-theme .evdock:not(.open) .evbar.chopen .evbar-main { filter: blur(2.5px); opacity: .5; }
  /* 네이버·카톡 = ··· 눌리면(배너 열릴 때 자동으로 눌림) 물방울처럼 톡톡 팝. 알약·그림자 없이 전화····와 같은 글라스 톤(일체감). */
  .byunbaksa-theme .evbar-net { position: absolute; right: 80px; top: 50%; transform: translateY(-50%);
    display: flex; align-items: center; gap: 8px; pointer-events: none; }
  .byunbaksa-theme .evbar.chopen .evbar-net { pointer-events: auto; }
  /* 개별 버튼 = 닫힘엔 작은 물방울(scale .25) → 탄성으로 톡. 스타일은 기본 글라스 그대로(전화····와 통일). */
  .byunbaksa-theme .evbar-net .evbar-ico { transform: scale(.25); opacity: 0;
    transition: transform .46s cubic-bezier(.34, 1.32, .5, 1), opacity .28s var(--bb-ease),
      background .2s var(--bb-ease), color .2s var(--bb-ease), border-color .2s var(--bb-ease); }
  .byunbaksa-theme .evbar.chopen .evbar-net .evbar-ico { transform: scale(1); opacity: 1; }
  /* 물방울 스태거(하나씩 톡톡) */
  .byunbaksa-theme .evbar.chopen .evbar-net .evbar-ico:nth-child(1) { transition-delay: .05s; }
  .byunbaksa-theme .evbar.chopen .evbar-net .evbar-ico:nth-child(2) { transition-delay: .13s; }
}
/* 모션 최소화 = 물방울 바운스 끔(페이드만) + ··· 팝 끔(색 크로스페이드만 유지) */
@media (prefers-reduced-motion: reduce) {
  .byunbaksa-theme .evbar-net .evbar-ico { transform: none; transition: opacity .2s var(--bb-ease), background .2s, color .2s, border-color .2s; }
  .byunbaksa-theme .evbar.chopen .evbar-more { animation: none; }
}

/* ══════════════ 배너 패널 내부 (캐러셀) ══════════════ */
/* evmodal = 패널을 꽉 채우는 캐러셀 래퍼. 배경 없음(도크 글라스 위에 얹힘). */
.byunbaksa-theme .evmodal { height: 100%; display: flex; flex-direction: column; }

.byunbaksa-theme .evmodal-row { flex: 1 1 auto; min-height: 0; display: flex; }
.byunbaksa-theme .evmodal-card { flex: 1 1 auto; min-width: 0; display: flex; overflow: hidden; }

.byunbaksa-theme .evtrack { flex: 1 1 auto; min-height: 0; width: 100%; display: flex; overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory; scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; }
.byunbaksa-theme .evtrack::-webkit-scrollbar { display: none; }

.byunbaksa-theme .evslide { flex: 0 0 100%; scroll-snap-align: start; min-width: 0; position: relative; height: 100%; display: flex; flex-direction: column; }

/* 상단 고정 헤더 = 킥커 + 제목 + (링크 있으면) 원형 화살표. 본문 스크롤해도 안 사라짐. */
.byunbaksa-theme .evslide-head { flex: 0 0 auto; padding: 24px 30px 16px; border-bottom: 1px solid var(--gray-200); }
.byunbaksa-theme .evslide-kick { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; color: var(--blue-accent); }
.byunbaksa-theme .evslide-kick--notice { color: var(--text-muted); }
.byunbaksa-theme .evslide-kick--alert  { color: #C8322B; }
.byunbaksa-theme .evslide-titlerow { display: flex; align-items: flex-start; gap: 14px; margin-top: 10px; }
.byunbaksa-theme .evslide-title { flex: 1 1 auto; min-width: 0; margin: 0; font-size: clamp(18px, 2.2vw, 22px); font-weight: 600;
  letter-spacing: -0.035em; color: var(--navy); line-height: 1.4; text-wrap: balance; word-break: keep-all; }
.byunbaksa-theme .evslide-go { flex: 0 0 auto; margin-top: 1px; width: 36px; height: 36px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center; text-decoration: none;
  background: var(--white); border: 1px solid var(--gray-200); color: var(--navy); font-size: 16px; font-weight: 600;
  transition: transform .3s var(--bb-ease), background .3s var(--bb-ease), border-color .3s var(--bb-ease); }
.byunbaksa-theme .evslide-go:hover { background: var(--blue-accent); color: #fff; border-color: var(--blue-accent); transform: translateX(2px); }
.byunbaksa-theme .evslide-go:focus-visible { outline: 2px solid var(--blue-accent); outline-offset: 2px; }

/* 스크롤 영역 = 이미지(가로 꽉·원본 비율) + 본문이 블로그처럼 한 덩어리 */
.byunbaksa-theme .evslide-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; }
.byunbaksa-theme .evslide-scroll::-webkit-scrollbar { display: none; }
.byunbaksa-theme .evslide-img { display: block; width: 100%; background: var(--gray-100); font-size: 0; }
.byunbaksa-theme .evslide-img img { width: 100%; height: auto; display: block; }
.byunbaksa-theme .evslide-img--vid { line-height: 0; }
.byunbaksa-theme .evslide-vid { width: 100%; height: auto; display: block; background: var(--gray-100); }
.byunbaksa-theme .evslide-body { margin: 0; padding: 20px 30px 36px; font-size: 14px; color: var(--text-secondary); line-height: 1.9; }

/* 더 보기(스크롤) 힌트 — 내용 넘칠 때만 페이드+화살표 */
.byunbaksa-theme .evslide-more { position: absolute; left: 0; right: 0; bottom: 0; z-index: 6; height: 46px; pointer-events: none;
  display: flex; align-items: flex-end; justify-content: center; padding-bottom: 6px;
  background: linear-gradient(to top, var(--white) 30%, rgba(255,255,255,0));
  opacity: 0; transition: opacity .3s var(--bb-ease); }
.byunbaksa-theme .evslide.has-more .evslide-more { opacity: 1; }
.byunbaksa-theme .evslide-more-btn { pointer-events: auto; width: 34px; height: 22px; border: none; background: transparent; box-shadow: none;
  color: var(--text-muted); cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: color .2s var(--bb-ease); animation: evbounce 1.5s ease-in-out infinite; }
.byunbaksa-theme .evslide-more-btn:hover { color: var(--blue-accent); }
.byunbaksa-theme .evslide-more-btn svg { width: 20px; height: 20px; }
@keyframes evbounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(4px); } }
@media (prefers-reduced-motion: reduce) { .byunbaksa-theme .evslide-more-btn { animation: none; } }

.byunbaksa-theme .evmodal-side { flex: 0 0 auto; width: 244px; display: flex; flex-direction: column;
  background: var(--gray-50); border-left: 1px solid var(--gray-200); overflow: hidden; }
.byunbaksa-theme .evmodal-side-h { flex: 0 0 auto; font-size: 11px; font-weight: 700; letter-spacing: .1em; color: var(--text-muted); padding: 16px 18px 11px; }
.byunbaksa-theme .evmodal-side-h span { color: var(--blue-accent); }
.byunbaksa-theme .evmodal-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; scrollbar-width: none; -ms-overflow-style: none; }
.byunbaksa-theme .evmodal-list::-webkit-scrollbar { display: none; }
.byunbaksa-theme .evmodal-item { width: 100%; border: none; border-bottom: 1px solid var(--gray-200); background: transparent; cursor: pointer;
  display: flex; flex-direction: column; align-items: flex-start; gap: 5px; padding: 13px 18px; text-align: left; transition: background .2s var(--bb-ease); }
.byunbaksa-theme .evmodal-item:hover { background: var(--gray-100); }
.byunbaksa-theme .evmodal-item:focus-visible { outline: 2px solid var(--blue-accent); outline-offset: -2px; }
.byunbaksa-theme .evmodal-item-kick { flex: 0 0 auto; font-size: 9.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--text-secondary); }   /* 평소 그래파이트 · 선택 시만 레드(아래 .on) */
.byunbaksa-theme .evmodal-item-kick--notice { color: var(--text-muted); }
.byunbaksa-theme .evmodal-item-kick--alert { color: #C8322B; }
.byunbaksa-theme .evmodal-item-tx { min-width: 0; font-size: 13.5px; line-height: 1.4; letter-spacing: -0.02em; color: var(--text-secondary);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.byunbaksa-theme .evmodal-item.on { background: var(--blue-pale); }   /* 선택 = 옅은 레드 틴트만 (좌측 바 없음) · 킥이 레드로 켜져 선택 표시 */
.byunbaksa-theme .evmodal-item.on .evmodal-item-kick { color: var(--blue-accent); }   /* 선택된 것만 킥 레드 */
.byunbaksa-theme .evmodal-item.on .evmodal-item-tx { color: var(--navy); font-weight: 600; }
.byunbaksa-theme .evmodal-item.on:hover { background: rgba(228,3,46,.10); }   /* 선택 호버 = 살짝 진한 틴트 */

@media (max-width: 720px) {
  .byunbaksa-theme .evdock.open .evpanel { height: min(76vh, 600px); }
  .byunbaksa-theme .evmodal-row { flex-direction: column; }
  .byunbaksa-theme .evmodal-side { width: 100%; flex-direction: row; border-left: none; border-top: 1px solid var(--gray-200);
    overflow-x: auto; overflow-y: hidden; padding: 11px 12px; scrollbar-width: none; }
  .byunbaksa-theme .evmodal-side::-webkit-scrollbar { display: none; }
  .byunbaksa-theme .evmodal-side-h { display: none; }
  .byunbaksa-theme .evmodal-list { flex-direction: row; gap: 8px; overflow: visible; }
  .byunbaksa-theme .evmodal-item { width: 150px; flex: 0 0 auto; border: 1px solid var(--gray-200); border-radius: 12px; padding: 9px 11px; gap: 4px; }
  /* 모바일 선택 칩 = 틴트만(회색 테두리 유지·레드 테두리 없음). 배경은 기본 .on 규칙(--blue-pale)이 적용. */
}

/* ═══════════════════════════════════════════════════════════════
   클리닉 허브(category.php) 통일+보강 — 2026-08-04
   /care/·/column/ 기준(하이엔드 미니멀·네이비 모노크롬)으로 전환.
   공용 .bb-* 재사용 + 신규 .bb-steps(치료과정)·정적카드 오버라이드만.
   ※ 구 hub-hero, scenario 계열, hub-posts-grid, hub-post-card, related-grid,
     posts-section 등은 더 이상 category.php에서 안 씀(=dead, 추후 정리).
   ═══════════════════════════════════════════════════════════════ */

/* 섹션 레이아웃 래퍼 — column과 동일: 전부 화이트 + 넉넉한 여백으로 구분(회색 밴드 폐기).
   여백 크게(하이엔드=여백). 섹션당 상하 104px → 인접 섹션 사이 ~208px. */
.byunbaksa-theme .hub-sec { padding: 120px 24px; }
.byunbaksa-theme .hub-inner { max-width: 1140px; margin: 0 auto; }
.byunbaksa-theme .hub-conditions { padding-top: 112px; }

/* 치료 방법 = 텍스트포워드 에디토리얼(박스·아이콘 없이 헤어라인). 병렬 항목이라 번호 없음. 하이엔드 미니멀 */
.byunbaksa-theme .bb-methods { display: grid; grid-template-columns: 1fr 1fr; gap: 0 64px; margin-top: 44px; }
.byunbaksa-theme .bb-method { padding: 34px 0; border-top: 1px solid var(--gray-100); }
.byunbaksa-theme .bb-method-n { display: block; font-size: 22px; font-weight: 200; color: var(--blue-accent); letter-spacing: -1px; line-height: 1; margin-bottom: 12px; opacity: 0.75; }
.byunbaksa-theme .bb-method-t { font-size: 19px; font-weight: 700; color: var(--navy); letter-spacing: -0.4px; margin: 0 0 11px; word-break: keep-all; }
.byunbaksa-theme .bb-method-d { font-size: 14.5px; color: var(--text-secondary); line-height: 1.85; margin: 0; word-break: keep-all; }
@media (max-width: 700px) {
  .byunbaksa-theme .bb-methods { grid-template-columns: 1fr; gap: 0; margin-top: 32px; }
  .byunbaksa-theme .bb-method { padding: 26px 0; }
}

/* 히어로 증상 칩 = column 점프칩 룩(라운드 사각·헤어라인). 클릭 이동은 없음(질환 라벨) */
.byunbaksa-theme .bb-hero .hub-symptom-chips { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 28px; }
.byunbaksa-theme .bb-hero .hub-symptom-chips .chip { font-size: 13px; font-weight: 600; color: var(--text-secondary); background: var(--gray-50); border: 1px solid var(--gray-100); padding: 9px 14px; border-radius: 11px; letter-spacing: -0.01em; }

/* 정적 카드(증상·질환 / 치료방법 / 시나리오) — 링크 아님: 리프트 hover 제거 + 높이 완화 */
.byunbaksa-theme .bb-card--static { cursor: default; min-height: 0; }
.byunbaksa-theme .bb-card--static:hover { transform: none; border-color: var(--gray-100); box-shadow: 0 22px 44px -34px rgba(26, 28, 32,0.38); }
.byunbaksa-theme .hub-conditions .bb-card, .byunbaksa-theme .hub-treatments .bb-card { min-height: 0; padding: 28px 26px 26px; }
.byunbaksa-theme .hub-conditions .bb-card-desc, .byunbaksa-theme .hub-treatments .bb-card-desc { flex-grow: 0; }

/* 시나리오 카드(캐러셀 .bb-grid 안) */
.byunbaksa-theme .bb-card--scenario { min-height: 208px; }

/* 중앙정렬 섹션헤더의 타이틀+화살표 행 */
.byunbaksa-theme .bb-sec-titlerow--center { justify-content: center; gap: 16px; }
.byunbaksa-theme .bb-sec-head--center .bb-sec-lead { text-align: center; margin-left: auto; margin-right: auto; }

/* 치료 과정 = 타임라인(원형 노드 + 연결선). 순서(초진→관리)를 시각화 → Approach·Treatment(리스트)와 차별화.
   데스크톱=가로 타임라인 / 모바일=세로 타임라인. */
.byunbaksa-theme .bb-steps { list-style: none; margin: 52px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
.byunbaksa-theme .bb-step { position: relative; padding-top: 62px; }
.byunbaksa-theme .bb-step-num { position: absolute; top: 0; left: 0; width: 46px; height: 46px; border-radius: 50%; background: #fff; border: 1px solid var(--gray-200); color: var(--navy); font-size: 15px; font-weight: 700; display: flex; align-items: center; justify-content: center; z-index: 2; box-shadow: 0 6px 16px -8px rgba(26, 28, 32,0.3); }
.byunbaksa-theme .bb-step::before { content: ""; position: absolute; top: 23px; left: 46px; right: -28px; height: 1px; background: var(--gray-200); z-index: 0; }
.byunbaksa-theme .bb-step:last-child::before { display: none; }
.byunbaksa-theme .bb-step-title { font-size: 16.5px; font-weight: 700; color: var(--navy); margin: 0 0 9px; letter-spacing: -0.3px; word-break: keep-all; }
.byunbaksa-theme .bb-step-desc { font-size: 13.5px; color: var(--text-secondary); line-height: 1.75; margin: 0; word-break: keep-all; }

/* 자가체크 네이비 밴드 = 기존 .related-hub 재사용 */
.byunbaksa-theme .hub-selfcheck { padding-top: 20px; padding-bottom: 20px; }
.byunbaksa-theme .hub-selfcheck .related-hub { margin: 0 auto; }

@media (max-width: 900px) {
  .byunbaksa-theme .bb-steps { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .byunbaksa-theme .hub-sec { padding: 80px 20px; }
  .byunbaksa-theme .hub-conditions { padding-top: 84px; }
  /* Process = 세로 타임라인(연결선 왼쪽) */
  .byunbaksa-theme .bb-steps { grid-template-columns: 1fr; gap: 0; margin-top: 40px; }
  .byunbaksa-theme .bb-step { padding: 0 0 30px 62px; }
  .byunbaksa-theme .bb-step::before { top: 46px; left: 22px; right: auto; bottom: 2px; width: 1px; height: auto; }
  .byunbaksa-theme .bb-step:last-child { padding-bottom: 0; }
  .byunbaksa-theme .bb-hero .hub-symptom-chips { margin-top: 24px; }
}
/* 단일 내부링크(Approach·Treatment) = 폭 제한 + PC 가운데 정렬(영상 밑에 자연스럽게). 모바일은 풀폭 유지 */
.byunbaksa-theme .hub-morelinks--single .hub-morelink { width: min(560px, 100%); box-sizing: border-box; margin-left: auto; margin-right: auto; } /* PC=영상폭 560 / 모바일=100%(뷰포트 안). 고정 560px는 모바일서 넘쳐서 min() 사용 */

/* ── Approach·Treatment 원장 설명 = 기존 bb_explainer() 재사용(반복 클립+로어서드 자막).
   자막=크롤가능 텍스트(AEO/GEO). CSS는 style.css .bb-explainer* 에 이미 존재. 여백만 조정. ── */
.byunbaksa-theme .hub-approach .bb-explainer, .byunbaksa-theme .hub-treatments .bb-explainer { margin-top: 40px; }

/* 치료 섹션 내부링크 카드(진료철학·치료법) — 덩그러니 센터 버튼 대신 자연스러운 2열 링크카드 */
.byunbaksa-theme .hub-morelinks { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 34px; }
.byunbaksa-theme .hub-morelinks--single { grid-template-columns: 1fr; }
/* 영상 바로 아래 CTA(내용보다 우선) = 살짝 톤 배경 + 네이비 원형 화살표(하이엔드 강조). margin은 영상과 붙게 축소 */
/* 영상 아래 CTA: 위(영상)와는 붙게(18px), 아래(본문)와는 넉넉히(52px) — 본문과 안 달라붙게 */
.byunbaksa-theme .hub-morelinks--tinted { margin-top: 18px; margin-bottom: 52px; }
/* 톤 = 블루 아님. 화이트에서 살짝 다른 뉴트럴 그레이(하이엔드). 네이비 원형 화살표로 CTA 강조 */
.byunbaksa-theme .hub-morelinks--tinted .hub-morelink { background: var(--gray-50); border-color: rgba(26, 28, 32,0.07); }
.byunbaksa-theme .hub-morelinks--tinted .hub-morelink:hover { background: #eef0f3; }
.byunbaksa-theme .hub-morelinks--tinted .hub-morelink-go { background: var(--navy); color: #fff; }
.byunbaksa-theme .hub-morelinks--tinted .hub-morelink:hover .hub-morelink-go { transform: translateX(3px); }
/* 치료 방법 넘버 카드(캐러셀 안) */
.byunbaksa-theme .bb-card--method .bb-method-n { margin-bottom: 14px; }
/* 캐러셀 바로 위 화살표(영상·CTA 때문에 헤더 화살표는 카드와 멀어서 여기로). 우측 정렬, 모바일 숨김(프로그레스바가 대신) */
.byunbaksa-theme .bb-carousel-nav { display: flex; justify-content: flex-end; margin-bottom: 18px; }
@media (max-width: 640px) { .byunbaksa-theme .bb-carousel-nav { display: none; } }
/* (가로 캐러셀 "3 + ¼ peek"는 공용 .bb-grid 로 승격 — 위 .bb-grid > .bb-card 참조) */
/* 치료 = 공용 캐러셀 그대로(데스크톱 3장 + 화살표 / 모바일 1+¼ + 프로그레스바). 5장 한줄은 좁아서 폐기 */
/* 모바일: 건강 칼럼 6개(2×3) → 4개(2×2)로 축소(세로 길이 관리). 5·6번째는 DOM엔 있고 화면만 숨김 */
@media (max-width: 560px) {
  .byunbaksa-theme .hub-posts .bb-cardgrid > .bb-card:nth-child(n+5),
  .byunbaksa-theme .related-posts .bb-cardgrid > .bb-card:nth-child(n+5) { display: none; }
}
.byunbaksa-theme .hub-morelink { --ease: cubic-bezier(0.16,1,0.3,1); display: flex; align-items: center; gap: 16px; padding: 22px 26px; background: #fff; border: 1px solid var(--gray-100); border-radius: 18px; text-decoration: none; box-shadow: 0 18px 40px -36px rgba(26, 28, 32,0.34); transition: transform 0.5s var(--ease), box-shadow 0.5s var(--ease), border-color 0.4s var(--ease); }
.byunbaksa-theme .hub-morelink:hover { transform: translateY(-4px); border-color: transparent; box-shadow: 0 32px 60px -38px rgba(26, 28, 32,0.48); }
.byunbaksa-theme .hub-morelink-tx { flex: 1; min-width: 0; }
.byunbaksa-theme .hub-morelink-t { display: block; font-size: 16px; font-weight: 700; color: var(--navy); letter-spacing: -0.3px; }
.byunbaksa-theme .hub-morelink-s { display: block; font-size: 12.5px; color: var(--text-muted); margin-top: 4px; word-break: keep-all; }
.byunbaksa-theme .hub-morelink-go { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: var(--gray-50); color: var(--navy); transition: background 0.3s var(--ease), color 0.3s var(--ease), transform 0.4s var(--ease); }
.byunbaksa-theme .hub-morelink:hover .hub-morelink-go { background: var(--navy); color: #fff; transform: translateX(3px); }
@media (max-width: 560px) {
  .byunbaksa-theme .hub-morelinks { grid-template-columns: 1fr; gap: 12px; margin-top: 28px; }
  .byunbaksa-theme .hub-morelink { padding: 18px 20px; }
}

/* FAQ 섹션도 화이트 통일(회색 밴드 폐기) — 카테고리 전용 스코프(front-page FAQ 영향 없음) */
.byunbaksa-theme .faq-section--hub { background: #fff; border-top: none; border-bottom: none; padding: 88px 24px; }
@media (max-width: 560px) { .byunbaksa-theme .faq-section--hub { padding: 64px 20px; } }

/* 히어로 H1 강조(ACF <em>) = 네이비 볼드(이탤릭 아님) */
.byunbaksa-theme .bb-hero h1 em { font-style: normal; font-weight: 800; color: var(--navy); }

/* ── ④ Approach = 라이트 하이엔드(2026-08-04) — 다크 네이비 폐기 ──
   화이트 + 라이트웨이트 넘버 + 헤어라인 구분선(medicalo 에디토리얼 톤). */
.byunbaksa-theme .hub-approach-inner { max-width: 920px; }
.byunbaksa-theme .hub-approach .approach-blocks { display: flex; flex-direction: column; margin-top: 10px; }
.byunbaksa-theme .hub-approach .approach-block { display: grid; grid-template-columns: 92px 1fr; gap: 32px; align-items: start; padding: 34px 0; border-bottom: 1px solid var(--gray-100); }
.byunbaksa-theme .hub-approach .approach-block:first-child { padding-top: 8px; }
.byunbaksa-theme .hub-approach .approach-block:last-child { border-bottom: none; padding-bottom: 0; }
.byunbaksa-theme .hub-approach .approach-num { font-size: 40px; font-weight: 200; color: var(--blue-accent); letter-spacing: -1.5px; line-height: 1; opacity: 0.82; }
.byunbaksa-theme .hub-approach .approach-body h3 { font-size: 20px; font-weight: 700; color: var(--navy); letter-spacing: -0.4px; margin: 0 0 12px; word-break: keep-all; }
.byunbaksa-theme .hub-approach .approach-body p { font-size: 15.5px; color: var(--text-secondary); line-height: 1.9; margin: 0; word-break: keep-all; }
.byunbaksa-theme .hub-approach .approach-body p em { font-style: normal; color: var(--navy); font-weight: 600; background-image: linear-gradient(transparent 58%, rgba(59,108,180,0.18) 58%); background-size: 0% 100%; background-repeat: no-repeat; background-position: 0 0; transition: background-size 0.9s cubic-bezier(0.2,0.8,0.2,1) 0.35s; padding: 0 1px; }
.byunbaksa-theme .hub-approach .approach-block.in-view .approach-body p em { background-size: 100% 100%; }
.byunbaksa-theme .hub-approach .approach-footnote { margin-top: 44px; }
.byunbaksa-theme .hub-approach .approach-footnote a { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--navy); text-decoration: none; padding: 12px 22px; border: 1px solid var(--gray-200); border-radius: 100px; transition: background 0.25s cubic-bezier(0.16,1,0.3,1), color 0.25s, border-color 0.25s, transform 0.25s; }
.byunbaksa-theme .hub-approach .approach-footnote a:hover { background: var(--navy); color: #fff; border-color: var(--navy); transform: translateY(-1px); }
@media (max-width: 560px) {
  .byunbaksa-theme .hub-approach .approach-block { grid-template-columns: 1fr; gap: 6px; padding: 26px 0; }
  .byunbaksa-theme .hub-approach .approach-num { font-size: 32px; }
}

/* ════════════════════════════════════════════════════════════════
   ★NEW 히어로 = 라이브 WhyUs 섹션 그대로 이식 (2026-08-12)
   라이브 tigerbubu-remote/assets/site.css 의 .whyus* 를 우리 토큰(.byunbaksa-theme)으로 스코프.
   · 배경 페이드 rgba(239,238,234)=라이브 베이지 → rgba(239,241,245)=우리 --bg2(#EFF1F5) 로 보정.
   · var(--pad) 는 :root 에 추가함. above-the-fold라 rise-in 정적화(transform 없음).
   · .kicker/.h-lead/.sub 는 라이브 공용 기반클래스 — 아래 별도 스코프(다른 라이브 섹션도 재사용).
   ════════════════════════════════════════════════════════════════ */
/* 라이브 공용 기반 클래스 (여러 라이브 섹션 공유) */
.byunbaksa-theme .kicker { font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); display: inline-block; margin-bottom: 20px; }
.byunbaksa-theme .h-lead { font-size: clamp(27px, 3.8vw, 46px); font-weight: 300; letter-spacing: -0.045em; line-height: 1.32; color: var(--ink); margin: 0; word-break: keep-all; }
.byunbaksa-theme .h-lead b { font-weight: 600; }
.byunbaksa-theme .sub { font-size: 15px; color: var(--muted); line-height: 1.9; font-weight: 400; }

/* ── ③ front-page APPROACH 섹션 — 원장 육성 브랜딩. 제목/부제=공용 .kicker/.h-lead/.sub(좌측정렬).
   PC = 좌(제목+부제) / 우(원장영상) 2단 = grid-areas. DOM 순서는 모바일 순서(제목→영상→부제)라 무JS 폴백/모바일도 자연스러움. ── */
/* ★모두 .approach 하위로 스코프 — bare .approach-inner(위 line~566 다크 .approach-section 잔재 컴포넌트)와 분리. */
.byunbaksa-theme .approach { text-align: left; max-width: none; padding-left: var(--pad); padding-right: var(--pad); }   /* ★풀블리드 = catsec(섹션2)·히어로와 동일 좌우폭(.section 1200캡 해제) */
/* ★PC = 상단 좌(제목) · 우(영상) 2단(둘 다 짧아 높이 잘 맞음) → 그 아래 진료철학 노트 풀폭(가운데 카드).
   ★긴 텍스트 노트를 영상 옆에 안 둠 = 창 폭 줄여도 좌우 높이 안 어긋남(텍스트는 좁으면 길어지고 영상은 짧아지는 문제 회피). */
/* ★PC = 좌측[제목 + 부제 + 원장 크리덴셜 박스](좌정렬) / 우측[영상, 세로 중앙]. 메인이라 긴 본문 없이 컴팩트. */
.byunbaksa-theme .approach .approach-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas: "head media" "cred media"; column-gap: clamp(32px, 5vw, 80px); row-gap: 0;
  align-items: center; max-width: none; }   /* 풀폭(캡 없음)=섹션2와 통일. 좌=제목+부제+크리덴셜, 우=영상 span 중앙. */
.byunbaksa-theme .approach-head { grid-area: head; }
.byunbaksa-theme .approach-head .approach-sub { display: block; margin-top: 16px; max-width: 480px; }
.byunbaksa-theme .approach-media { grid-area: media; }
/* 영상 = 우측 중앙. ★max 720 = 모니터 배율/울트라와이드서 과대·저해상(소스 960px) 방지. */
.byunbaksa-theme .approach-media .bb-explainer { margin: 0 auto; max-width: 720px; }
/* 원장 크리덴셜 = ★흰 카드(박스) 제거(너무 튐) → 얇은 구분선만(부제와 자연스레 분리). */
.byunbaksa-theme .approach-cred { grid-area: cred; margin-top: clamp(24px, 3vw, 34px);
  padding-top: clamp(20px, 2.5vw, 26px); border-top: 1px solid var(--line); }
.byunbaksa-theme .approach-cred .tm-note-by { margin-top: 0; padding-top: 0; border-top: 0; }
@media (max-width: 860px) {
  .byunbaksa-theme .approach .approach-inner { display: block; }   /* 모바일/좁은 화면 = 제목+부제 → 영상 → 크리덴셜(=DOM 순서) */
  .byunbaksa-theme .approach-head .approach-sub { max-width: none; }
  .byunbaksa-theme .approach-media { margin: clamp(22px, 5.5vw, 32px) 0 0; }
  .byunbaksa-theme .approach-media .bb-explainer { max-width: 560px; }
  .byunbaksa-theme .approach-cred { margin-top: clamp(24px, 6vw, 34px); }
}

/* ── ④ ARTBAND — 짧은 밴드(라이브 ~72vh 톤) + JS 패럴럭스(이미지 살짝 반대 이동 = 고정 느낌). ★모바일서도 동작(bg-fixed 안 씀). ── */
.byunbaksa-theme .artband { position: relative; height: clamp(380px, 66vh, 660px); overflow: hidden; }
.byunbaksa-theme .artband-bg { position: absolute; inset: -32% 0; z-index: 0; }   /* ★위아래 32% 여유 = 패럴럭스 translateY(±26%) 크게 줘도 가장자리 안 보임(고정 느낌 강화) */
@media (max-width: 760px) { .byunbaksa-theme .artband { height: clamp(180px, 30vh, 260px); } }   /* ★모바일 = 확 짧게(현재 대비 ~1/3) */
.byunbaksa-theme .artband-bg img { width: 100%; height: 100%; object-fit: cover; object-position: center; will-change: transform; }
/* ★광원+공간감: 중앙 소프트 라이트(광원) + 가장자리 비네트(깊이) + 베이스 라이트 베일(제목 가독). */
.byunbaksa-theme .artband-bg::after { content: ''; position: absolute; inset: 0;
  background: radial-gradient(88% 66% at 50% 40%, rgba(255,255,255,0.34) 0%, rgba(255,255,255,0) 56%),
              radial-gradient(132% 104% at 50% 50%, transparent 58%, rgba(26,28,32,0.13) 100%),
              rgba(247,248,250,0.30); }
.byunbaksa-theme .artband .ab-text { position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 0 var(--pad); }
.byunbaksa-theme .artband .ab-text .kicker { margin-bottom: 14px; }
.byunbaksa-theme .artband .ab-text .h-lead { line-height: 1.42; }

/* ── ⑤ LINEUP — 검증 장비. ★풀블리드(섹션2·3 폭 통일) + 쿨 배경(투명=body #F8F9FB) + 테두리없는 부양카드(라이브). 필터·태그 제거(하이엔드 심플). ── */
.byunbaksa-theme .lineup { max-width: none; padding-left: var(--pad); padding-right: var(--pad); background: transparent; }
.byunbaksa-theme .lineup-head { margin-bottom: clamp(30px, 4vw, 46px); }
.byunbaksa-theme .lineup-head .h-lead { margin-top: 16px; }
.byunbaksa-theme .lineup-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 1.6vw, 20px); }
.byunbaksa-theme .lp-card { position: relative; background: var(--white); border-radius: 16px; padding: 22px 24px; display: flex; align-items: center; gap: 18px;
  min-height: 132px; box-shadow: 0 18px 40px -34px rgba(26,28,32,.42); transition: transform .35s var(--bb-ease), box-shadow .35s var(--bb-ease); }
.byunbaksa-theme .lp-card:hover { transform: translateY(-3px); box-shadow: 0 30px 54px -34px rgba(26,28,32,.5); }
.byunbaksa-theme .lp-thumb { width: 92px; height: 92px; flex-shrink: 0; border-radius: 12px; background: var(--bg2); overflow: hidden; display: grid; place-items: center; }
.byunbaksa-theme .lp-thumb img { width: 100%; height: 100%; object-fit: contain; padding: 9px; mix-blend-mode: multiply; }
.byunbaksa-theme .lp-info { flex: 1; min-width: 0; }
.byunbaksa-theme .lp-info h4 { font-size: 16.5px; font-weight: 600; letter-spacing: -0.02em; color: var(--ink); }
.byunbaksa-theme .lp-info .en { font-size: 12.5px; color: var(--muted); margin-top: 7px; display: block; }
/* ★모바일 = 세로 3줄=1컬럼, 컬럼을 가로 캐러셀(1¼ 노출) + 하단 빨강 프로그레스(1/N). 데스크톱 3열은 위 그대로. */
.byunbaksa-theme .lineup-progress { display: none; }
@media (max-width: 860px) {
  .byunbaksa-theme .lineup-grid { grid-template-columns: none; grid-auto-flow: column; grid-template-rows: repeat(3, auto); grid-auto-columns: 73%;
    gap: 11px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; -webkit-overflow-scrolling: touch;
    margin: 0 calc(-1 * var(--pad)); padding: 4px var(--pad) 8px; }
  .byunbaksa-theme .lineup-grid::-webkit-scrollbar { display: none; }
  .byunbaksa-theme .lp-card { scroll-snap-align: start; padding: 14px 16px; min-height: 0; gap: 13px; border-radius: 14px; }
  .byunbaksa-theme .lp-thumb { width: 64px; height: 64px; }
  .byunbaksa-theme .lp-info h4 { font-size: 14.5px; }
  .byunbaksa-theme .lp-info .en { font-size: 11.5px; margin-top: 5px; }
  .byunbaksa-theme .lineup-progress { display: flex; align-items: center; justify-content: flex-start; gap: 10px; margin-top: 18px; }
  .byunbaksa-theme .lineup-progress .bb-progress-track { position: relative; flex: none; width: 56px; height: 1px; background: var(--line); border-radius: 2px; overflow: hidden; }
  .byunbaksa-theme .lineup-progress .bb-progress-fill { position: absolute; left: 0; top: 0; height: 100%; width: 25%; background: var(--accent); border-radius: 2px; transition: width .25s var(--bb-ease); }
  .byunbaksa-theme .lineup-progress .bb-progress-count { flex: 0 0 auto; font-size: 12px; font-weight: 600; color: var(--muted); letter-spacing: .02em; }
  .byunbaksa-theme .lineup-progress .bb-progress-count .cur { color: var(--ink); }
}

/* ── ⑥ SPACES — 진료 공간(라이브 이식, 쿨). 4 이미지 카드 3:4 + 하단 그라데이션 캡션. ── */
.byunbaksa-theme .spaces { max-width: none; padding-left: var(--pad); padding-right: var(--pad); background: transparent; }
.byunbaksa-theme .spaces-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: clamp(34px, 4.5vw, 50px); flex-wrap: wrap; }
.byunbaksa-theme .spaces-head .h-lead { margin-top: 16px; }
.byunbaksa-theme .spaces-head .sub { max-width: 320px; }
.byunbaksa-theme .spaces-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(12px, 1.4vw, 18px); }
.byunbaksa-theme .space-card { position: relative; overflow: hidden; border-radius: 16px; aspect-ratio: 3/4; background: var(--bg2);
  box-shadow: 0 18px 40px -34px rgba(26,28,32,.42); transition: transform .4s var(--bb-ease), box-shadow .4s var(--bb-ease); }   /* ★우리 스타일 공중부양 그림자 + 부드러운 리프트 */
.byunbaksa-theme .space-card:hover { transform: translateY(-6px); box-shadow: 0 30px 56px -34px rgba(26,28,32,.5); }
.byunbaksa-theme .space-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--bb-ease); }
.byunbaksa-theme .space-card:hover img { transform: scale(1.06); }
.byunbaksa-theme .space-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 58%, rgba(20,20,20,.48)); }
.byunbaksa-theme .space-card .cap { position: absolute; left: 16px; bottom: 14px; z-index: 2; color: #fff; }
.byunbaksa-theme .space-card .cap .t { font-size: 14px; font-weight: 600; }
.byunbaksa-theme .space-card .cap .s { font-size: 11px; opacity: .82; letter-spacing: .05em; }
@media (max-width: 900px) { .byunbaksa-theme .spaces-grid { grid-template-columns: repeat(2, 1fr); } }

/* ── ⑦ COSMETICS — 홈케어 캐러셀(라이브 이식, Swiper→우리 scroll-snap). 1슬라이드/뷰 + 빨강 프로그레스(변박사 스타일). ── */
.byunbaksa-theme .cosmetics { max-width: none; padding-left: var(--pad); padding-right: var(--pad); background: transparent; }
.byunbaksa-theme .cos-head { text-align: center; max-width: 720px; margin: 0 auto clamp(34px, 4.5vw, 48px); }
.byunbaksa-theme .cos-head .h-lead { margin-top: 14px; }
.byunbaksa-theme .cos-head .sub { margin-top: 16px; }
/* ★페이드 캐러셀 = 슬라이드를 그리드 한 셀(1/1)에 겹쳐 쌓고 opacity 크로스페이드(오토플레이). 좌우 슬라이드 아님. */
.byunbaksa-theme .cos-fade { display: grid; border-radius: var(--radius-lg); overflow: hidden;
  box-shadow: 0 34px 80px -54px rgba(26,28,32,.4); background: var(--bg2); }
.byunbaksa-theme .cos-slide { grid-area: 1 / 1; position: relative; aspect-ratio: 21/10;
  opacity: 0; z-index: 0; transition: opacity .85s var(--bb-ease); }
.byunbaksa-theme .cos-slide.on { opacity: 1; z-index: 1; }
.byunbaksa-theme .cos-slide img { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; -webkit-user-drag: none; user-select: none; }   /* ★네이티브 이미지 드래그가 마우스 넘김 제스처 가로채던 것 차단 */
.byunbaksa-theme .cos-slide::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, rgba(248,249,251,.94) 0%, rgba(248,249,251,.7) 30%, rgba(248,249,251,0) 58%); }
.byunbaksa-theme .cos-cap { position: absolute; left: clamp(28px, 5vw, 76px); top: 50%; transform: translateY(-50%); z-index: 2; max-width: 46%; }
.byunbaksa-theme .cos-cap .en { display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .12em; color: var(--accent); }
.byunbaksa-theme .cos-cap .ko { display: block; font-size: clamp(21px, 2.8vw, 36px); font-weight: 600; letter-spacing: -.03em; color: var(--ink); margin-top: 9px; line-height: 1.25; }
.byunbaksa-theme .cos-cap .ds { display: block; font-size: 14px; color: var(--muted); line-height: 1.75; margin-top: 14px; max-width: 320px; }
.byunbaksa-theme .cos-cap .tag { display: inline-flex; margin-top: 16px; font-size: 11px; font-weight: 600; color: var(--accent); background: rgba(228,3,46,.09); padding: 5px 11px; border-radius: 20px; }
.byunbaksa-theme .cos-progress { margin: 22px 0 0; display: flex; align-items: center; justify-content: flex-start; gap: 10px; }   /* ★좌측·좁게(변박사 shorts 톤) */
.byunbaksa-theme .cos-progress .bb-progress-track { position: relative; flex: none; width: 56px; height: 1px; background: var(--line); border-radius: 2px; overflow: hidden; }
.byunbaksa-theme .cos-progress .bb-progress-fill { position: absolute; left: 0; top: 0; height: 100%; width: 33.33%; background: var(--accent); border-radius: 2px; transition: width .25s var(--bb-ease); }
.byunbaksa-theme .cos-progress .bb-progress-count { flex: 0 0 auto; font-size: 12px; font-weight: 600; color: var(--muted); letter-spacing: .02em; }
.byunbaksa-theme .cos-progress .bb-progress-count .cur { color: var(--ink); }
@media (max-width: 720px) {
  .byunbaksa-theme .cos-slide { aspect-ratio: auto; display: flex; flex-direction: column; }
  .byunbaksa-theme .cos-slide img { aspect-ratio: 16/10; }
  .byunbaksa-theme .cos-slide::before { display: none; }
  .byunbaksa-theme .cos-cap { position: static; transform: none; max-width: none; padding: 22px 20px 24px; background: var(--white); }
  .byunbaksa-theme .cos-cap .ds { max-width: none; }
}

/* ── FAQ — ★eyebrow 빨강 + 헤드 좌측정렬(사용자 2026-08-14). ── */
.byunbaksa-theme .faq-section .bb-sec-head { text-align: left; }
.byunbaksa-theme .faq-section .bb-eyebrow { color: var(--accent); }
.byunbaksa-theme .faq-section .bb-eyebrow::before { display: none; }   /* ★앞 가로 바(20px dash) 제거 */

/* ── 리뷰 헤더 — 다른 섹션과 동일 톤(kicker+h-lead, 대시 없음). 후기 본문은 사용자 제공 예정. ── */
.byunbaksa-theme .review-head { margin-bottom: clamp(34px, 4.5vw, 50px); }
.byunbaksa-theme .review-head .h-lead { margin-top: 16px; }

/* WhyUs 카드 (히어로) — 라이브 그대로, 토큰만 우리 것 */
.byunbaksa-theme .whyus { position: relative; z-index: 3; margin: clamp(84px, 11vh, 116px) clamp(16px, 3.5vw, 60px) clamp(48px, 7vh, 88px);
  border-radius: clamp(28px, 3.6vw, 52px);
  padding: 0 var(--pad) clamp(128px, 16vh, 210px);
  background: var(--bg2); box-shadow: 0 40px 100px -64px rgba(26,28,32,.28); }   /* ★옅은 bg2 = 흰 페이지 위로 라운드 카드가 보이게. 콘텐츠는 이 위에. */
/* ★배경사진 = sticky 고정(pin). 스크롤 동안 화면에 머물며 좌→우로 길게 팬(영상 같은 패럴럭스). 라운드 클립은 여기로 이관(카드 overflow:hidden 제거 → sticky 가능). */
.byunbaksa-theme .whyus-bg { position: sticky; top: 0; height: clamp(520px, 74vh, 820px); margin: 0 calc(-1 * var(--pad)); z-index: 0; overflow: hidden; border-radius: clamp(28px, 3.6vw, 52px) clamp(28px, 3.6vw, 52px) 0 0; }
/* ★가로 패럴럭스: JS가 object-position X를 스크롤 진행도에 따라 좌→우로 이동 = 가로 사진이 모바일에서 영상처럼 팬.
   데스크톱(넓음)은 가로크롭이 적어 자동으로 약하게, 모바일(좁음)은 크게 팬 = 자동 적응. reduced-motion=고정. */
.byunbaksa-theme .whyus-bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%;
  transform: scale(1.06); will-change: filter, object-position; backface-visibility: hidden; }   /* scale = 스크롤 블러 시 가장자리 번짐 가림 */
/* ★사진 하단을 흰색(페이지 배경)으로 부드럽게 페이드 = 딱 끊기지 않고 자연스럽게 넘어감. img 블러·팬과 별개 레이어라 간섭 없음. */
.byunbaksa-theme .whyus-bg::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg,
  rgba(239,241,245,0) 0%, rgba(239,241,245,0) 38%, rgba(239,241,245,.5) 62%, rgba(239,241,245,.88) 84%, var(--bg2) 100%); }
/* ★sticky-reveal: 콘텐츠 자체 bg2 패널(카드 폭 풀블리드) + 윗변 긴 소프트 페이드 = 사진→면 seam 안 보이게.
   패널이 올라오며 고정된 사진을 깔끔히 덮음 → 텍스트는 늘 솔리드 면 위(가독) / 사진은 페이드 위쪽에서만 보이며 팬. */
/* ★콘텐츠 섹션은 배경 없음 — 배경은 스티키 한의원 사진 그대로. 사진 자체에 scroll-driven blur(아래 JS)가 걸려
   스크롤(팬 →)할수록 블러가 세짐. 텍스트는 밝은(블러된) 사진 위에 얹힘. */
.byunbaksa-theme .whyus-inner { position: relative; z-index: 2;
  margin: clamp(-440px, -46vh, -280px) calc(-1 * var(--pad)) 0;
  padding: clamp(410px, 45vh, 600px) var(--pad) 0; }   /* 사진↔텍스트 여백 넉넉히(하이엔드) */
.byunbaksa-theme .whyus-content { max-width: 1120px; margin: 0 auto; }
.byunbaksa-theme .whyus-head { text-align: center; max-width: 740px; margin: 0 auto clamp(76px, 10vh, 130px); }
.byunbaksa-theme .whyus-head .h-lead { margin-top: 14px; }
.byunbaksa-theme .whyus-head p { margin-top: 18px; font-size: 15px; color: var(--muted); line-height: 1.9; word-break: keep-all; }
.byunbaksa-theme .whyus-rows { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(20px, 3vw, 46px);
  margin-top: clamp(76px, 10vh, 132px); }
.byunbaksa-theme .wr .wr-n { font-size: 13px; font-weight: 700; letter-spacing: .1em; color: var(--accent); }
.byunbaksa-theme .wr h3 { font-size: clamp(18px, 1.9vw, 23px); font-weight: 600; letter-spacing: -0.02em; margin: 14px 0 10px; line-height: 1.4; color: var(--ink); }
.byunbaksa-theme .wr p { font-size: 14px; color: var(--muted); line-height: 1.8; word-break: keep-all; }
/* 원장 인사말 (WhyUs 카드 내부, 라운드 포토박스) */
.byunbaksa-theme .whyus-dir { display: grid; grid-template-columns: auto 1fr; gap: clamp(28px, 4vw, 60px); align-items: center;
  max-width: 940px; margin: clamp(64px, 8.5vh, 116px) auto 0; }
.byunbaksa-theme .whyus-dir-photo { width: clamp(190px, 22vw, 280px); aspect-ratio: 5/7; border-radius: clamp(20px, 2.4vw, 30px);
  overflow: hidden; background: var(--gray-200); box-shadow: var(--shadow-float); }
.byunbaksa-theme .whyus-dir-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 8%; }
.byunbaksa-theme .whyus-dir-body .kicker { margin-bottom: 14px; }
.byunbaksa-theme .whyus-dir-body h3 { font-size: clamp(20px, 2.2vw, 28px); font-weight: 300; letter-spacing: -0.03em; line-height: 1.45; color: var(--ink); }
.byunbaksa-theme .whyus-dir-body h3 b { font-weight: 600; }
.byunbaksa-theme .whyus-dir-body p { font-size: 14.5px; color: var(--text); line-height: 1.95; margin-top: 18px; max-width: 540px; word-break: keep-all; }
.byunbaksa-theme .whyus-dir-sign { margin-top: 22px; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.byunbaksa-theme .whyus-dir-sign .nm { font-size: 17px; font-weight: 600; color: var(--ink); }
.byunbaksa-theme .whyus-dir-sign .ro { font-size: 12.5px; color: var(--muted); }
.byunbaksa-theme .whyus-dir-sign .en { margin-left: auto; font-size: 13px; color: var(--faint); }
@media (max-width: 760px) { .byunbaksa-theme .whyus-rows { grid-template-columns: 1fr; gap: 28px; } }
@media (max-width: 720px) { .byunbaksa-theme .whyus-dir { grid-template-columns: 1fr; gap: 24px; text-align: center; justify-items: center; }
  .byunbaksa-theme .whyus-dir-body p { margin-left: auto; margin-right: auto; } .byunbaksa-theme .whyus-dir-sign { justify-content: center; } .byunbaksa-theme .whyus-dir-sign .en { margin-left: 0; } }
/* ★2026-08-14 세션10 모바일 히어로 수정: 히어로 텍스트가 접힘선 아래로 내려가 첫 화면에 안 보이던 것 개선.
   sticky 사진 높이 + 콘텐츠 상단여백(padding-top) 축소 → 빨간 kicker(호랑이부부한의원 피부클리닉)가 첫 화면 하단에
   살짝 peek 하고 헤드라인은 접힘선 아래(스크롤 유도). 값은 실측 튜닝(375×812 kicker≈84% / 360×640≈86%).
   데스크톱·태블릿(≥601px)은 위 기본값 유지. */
@media (max-width: 600px) {
  .byunbaksa-theme .whyus-bg { height: clamp(340px, 66vh, 560px); }
  .byunbaksa-theme .whyus-inner { margin-top: clamp(-400px, -40vh, -240px); padding-top: clamp(230px, 40vh, 520px); }
}

/* ══════════════════════════════════════════════════════════════════════
   ② 시술 (PROGRAMS) — 라이브 catcard 그대로 이식 (고민 카테고리 카드)
   · 메인 2번째 섹션. 카드 클릭 → 시술메뉴 허브(page-treatments?cat=).
   · 라이브 그대로: 풀폭(--pad) + 이미지 카드(위 사진 · 하단 화이트 베일 · 캡션 · 우상단 → 버튼).
   · 색만 쿨 유지(베일 화이트, 카드 bg #eef1f3). 레드는 호버 화살표/이벤트 태그만(소면적).
   ══════════════════════════════════════════════════════════════════════ */
.byunbaksa-theme .catsec { background: transparent; max-width: none; margin: 0; padding: clamp(78px, 11vh, 150px) var(--pad); }   /* ★body 쿨 오프화이트가 비치게(순백 밴드 제거·톤 통일) */   /* ★.section 의 1200 캡 해제 → 히어로·라이브처럼 풀블리드 */
.byunbaksa-theme .catsec .prog-head { display: flex; justify-content: space-between; align-items: center; gap: 30px; margin-bottom: clamp(40px, 5vw, 52px); flex-wrap: wrap; }
.byunbaksa-theme .catsec .prog-head .h-lead { margin-top: 14px; }
.byunbaksa-theme .catsec-more { align-self: center; white-space: nowrap; font-size: 14px; font-weight: 600; color: var(--navy); text-decoration: none; display: inline-flex; align-items: center; gap: 10px; }
.byunbaksa-theme .catsec-more .a { transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1); }
.byunbaksa-theme .catsec-more:hover .a { transform: translateX(6px); }

.byunbaksa-theme .catgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.byunbaksa-theme .catcard { position: relative; display: block; aspect-ratio: 4 / 5; border-radius: 20px; overflow: hidden; text-decoration: none; color: var(--navy); background: #eef1f3; box-shadow: 0 2px 4px rgba(30, 30, 28, 0.04), 0 30px 55px -50px rgba(30, 30, 28, 0.4); transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1); }
.byunbaksa-theme .catcard:hover { transform: translateY(-6px); box-shadow: 0 4px 8px rgba(30, 30, 28, 0.05), 0 44px 74px -48px rgba(30, 30, 28, 0.5); }
.byunbaksa-theme .catcard-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1); }
.byunbaksa-theme .catcard:hover .catcard-img { transform: scale(1.045); }
.byunbaksa-theme .catcard-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: 0; background: #eef1f3; }   /* 이벤트 영상 카드 */
.byunbaksa-theme .catcard-veil { position: absolute; left: 0; right: 0; bottom: 0; height: 52%; z-index: 1; pointer-events: none; background: linear-gradient(to top, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.72) 22%, rgba(255, 255, 255, 0.3) 45%, transparent 100%); }
.byunbaksa-theme .catcard-cap { position: absolute; left: 22px; right: 20px; bottom: 20px; z-index: 2; }
.byunbaksa-theme .catcard-cap h3 { font-size: 20px; font-weight: 600; letter-spacing: -0.035em; line-height: 1.3; color: var(--navy); margin: 0; }
.byunbaksa-theme .catcard-cap p { font-size: 13px; font-weight: 400; color: #5B5B57; letter-spacing: -0.01em; line-height: 1.4; margin: 6px 0 0; }
.byunbaksa-theme .catcard-go { position: absolute; top: 15px; right: 15px; z-index: 2; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.72); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center; font-size: 15px; color: var(--navy); opacity: 0; transform: translateY(-4px); transition: opacity 0.3s, transform 0.3s, background 0.3s, color 0.3s; }
.byunbaksa-theme .catcard:hover .catcard-go { opacity: 1; transform: none; background: var(--accent); color: #fff; }
@media (max-width: 1024px) { .byunbaksa-theme .catgrid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 680px) { .byunbaksa-theme .catgrid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .byunbaksa-theme .catcard-cap { left: 16px; right: 14px; bottom: 16px; }
  .byunbaksa-theme .catcard-cap h3 { font-size: 15px; letter-spacing: -0.03em; }
  .byunbaksa-theme .catcard-cap p { font-size: 12px; margin-top: 5px; }
  .byunbaksa-theme .catcard-go { width: 30px; height: 30px; font-size: 13px; top: 12px; right: 12px; } }

/* ============================================================
   시술 메뉴 허브 (page-treatments.php ?cat=) — 좌 카테고리 레일 · 우 메뉴판
   라이브 treatments.css 이식 → .byunbaksa-theme 스코프 + 쿨 토큰.
   ★개별 메뉴 이미지 없음(하이엔드) · 카테고리 대표 이미지만 블록 헤더 66px.
   ============================================================ */
.byunbaksa-theme .section.tm { max-width: 1200px; margin: 0 auto; padding: clamp(96px, 13vh, 168px) var(--pad) clamp(80px, 10vh, 130px); }

/* 상단 헤드 */
/* 히어로 = .tm-main(우측 컬럼) 최상단, 좌측정렬(메뉴·프로세스·FAQ 와 통일. 좌 레일이 전체 옆에) */
.byunbaksa-theme .tm-head { margin: 0 0 clamp(56px, 7.5vw, 92px); text-align: left; }
.byunbaksa-theme .tm-head .kicker { margin-bottom: 18px; }
.byunbaksa-theme .tm-head .h-lead { margin: 0; }   /* 전역 h-lead 그대로(라이트 300 + <b>볼드 600> 2단) */
.byunbaksa-theme .tm-lead { margin: 22px 0 0; max-width: 52ch; font-size: 15px; line-height: 1.85; color: var(--muted); letter-spacing: -0.01em; }
.byunbaksa-theme .tm-lead b { color: var(--ink); font-weight: 600; }

/* 2열 레이아웃 */
.byunbaksa-theme .tm-cols { display: grid; grid-template-columns: minmax(210px, 244px) minmax(0, 1fr); gap: clamp(28px, 4vw, 60px); align-items: start; }

/* 좌: 카테고리 레일 (데스크톱=sticky, 글라스 헤더 아래 88px 고정 · 우측 FAQ 스크롤 중에도 전환 가능) */
.byunbaksa-theme .tm-rail { position: sticky; top: 88px; align-self: start; display: flex; flex-direction: column; gap: 2px;
  background: var(--white); border-radius: var(--radius-lg); padding: 12px;
  box-shadow: 0 26px 60px -38px rgba(26,28,32,0.5), 0 2px 6px -2px rgba(26,28,32,0.04); }
.byunbaksa-theme .tm-cat { text-decoration: none; text-align: left; cursor: pointer; display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 13px 6px 13px 14px; border-radius: 10px; position: relative; font-size: 14.5px; font-weight: 500; letter-spacing: -0.02em; color: var(--muted); line-height: 1.4; transition: color .2s var(--ease), background .2s var(--ease); }
.byunbaksa-theme .tm-cat .n { font-size: 11.5px; font-weight: 600; color: var(--faint); font-variant-numeric: tabular-nums; }
.byunbaksa-theme .tm-cat::before { content: ''; position: absolute; left: -4px; top: 50%; transform: translateY(-50%) scaleY(0); width: 3px; height: 18px; background: var(--accent); border-radius: 2px; transition: transform .22s var(--ease); }
.byunbaksa-theme .tm-cat:hover { color: var(--ink); background: var(--bg2); }
.byunbaksa-theme .tm-cat.on { color: var(--ink); font-weight: 600; }
.byunbaksa-theme .tm-cat.on .n { color: var(--accent); }
.byunbaksa-theme .tm-cat.on::before { transform: translateY(-50%) scaleY(1); }

/* 우: 메뉴판 (fetch 스왑 중 페이드) */
.byunbaksa-theme .tm-main { min-width: 0; transition: opacity .16s var(--ease); }
.byunbaksa-theme .tm-main.is-swapping { opacity: .35; }
/* ★메뉴판 = 흰 카드로 공중 부양(쿨 배경 위 · 게시판→메뉴판 승격). 내부 행 여백은 유지. */
.byunbaksa-theme .tm-block { margin-bottom: clamp(26px, 3.5vw, 42px); background: var(--white); border-radius: clamp(18px, 2vw, 26px); padding: clamp(26px, 3.4vw, 42px) clamp(22px, 3vw, 40px); box-shadow: 0 26px 60px -40px rgba(26,28,32,0.24), 0 2px 6px -3px rgba(26,28,32,0.05); }
.byunbaksa-theme .tm-block:last-of-type { margin-bottom: 0; }

/* ★전체 카드 = 1개 카드 안 카테고리 소제목 섹션들 (얇은 소제목 + 헤어라인) */
.byunbaksa-theme .tm-subsec { margin-top: clamp(36px, 4.5vw, 54px); }
.byunbaksa-theme .tm-subsec:first-of-type { margin-top: clamp(22px, 3vw, 32px); }
.byunbaksa-theme .tm-subhead { display: flex; align-items: baseline; gap: 10px; margin-bottom: 22px; padding-bottom: 13px; border-bottom: 1px solid var(--line); }
.byunbaksa-theme .tm-subhead h3 { margin: 0; font-size: clamp(15px, 1.8vw, 17px); font-weight: 600; letter-spacing: -0.03em; color: var(--ink); }
.byunbaksa-theme .tm-subhead .n { font-size: 12px; font-weight: 600; color: var(--faint); font-variant-numeric: tabular-nums; }

/* 블록 헤더 = 카테고리 대표 이미지 + 이름/부제 */
.byunbaksa-theme .tm-bhead { display: flex; align-items: center; gap: 18px; padding-bottom: 18px; margin-bottom: 26px; border-bottom: 1px solid var(--line); }
.byunbaksa-theme .tm-bimg { flex: 0 0 auto; width: 66px; height: 66px; border-radius: 15px; object-fit: cover; box-shadow: 0 14px 28px -22px rgba(26,28,32,.55); }
.byunbaksa-theme .tm-btext { min-width: 0; }
.byunbaksa-theme .tm-btext h2 { margin: 0; font-size: clamp(19px, 2.2vw, 24px); font-weight: 600; letter-spacing: -0.035em; color: var(--ink); }
.byunbaksa-theme .tm-btext p { margin: 5px 0 0; font-size: 13.5px; color: var(--muted); letter-spacing: -0.01em; }

/* 시술 행(2열) — 이름 + 구성 + 가격, 얇은 구분선. 개별 이미지 없음. */
.byunbaksa-theme .tm-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 clamp(30px, 4vw, 58px); }   /* ★minmax(0,1fr): 긴 시술명이 트랙을 밀어 카드 밖으로 삐져나오는 오버플로 방지 */
.byunbaksa-theme .tm-card { min-width: 0; display: flex; align-items: baseline; justify-content: space-between; gap: 18px; padding: 16px 6px; border-top: 1px solid var(--line); text-decoration: none; border-radius: 8px; transition: background .18s var(--ease); }   /* ★min-width:0 (세션10): 그리드 셀 안에서 카드가 nowrap .tm-desc 최소폭에 밀려 셀 밖으로 넘쳐 모바일 가로 오버플로 유발하던 것 차단 */
.byunbaksa-theme .tm-card:first-child, .byunbaksa-theme .tm-card:nth-child(2) { border-top: 0; }
.byunbaksa-theme .tm-card:hover { background: var(--bg2); }
.byunbaksa-theme .tm-card:hover .tm-name { color: var(--accent); }
.byunbaksa-theme .tm-info { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.byunbaksa-theme .tm-name { font-size: 15.5px; font-weight: 600; letter-spacing: -0.03em; color: var(--ink); line-height: 1.35; transition: color .18s var(--ease); }
.byunbaksa-theme .tm-desc { font-size: 12.5px; color: var(--muted); letter-spacing: -0.01em; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.byunbaksa-theme .tm-price { flex: 0 0 auto; font-size: 15px; font-weight: 600; letter-spacing: -0.02em; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* 하단 안내 문구 */
.byunbaksa-theme .tm-foot { margin-top: clamp(58px, 8vw, 92px); padding-top: 22px; border-top: 1px solid var(--line); font-size: 12px; color: var(--faint); letter-spacing: -0.01em; line-height: 1.7; }

/* ── A. "이런 피부라면" 증상·상황 칩 (히어로 하단) ── */
.byunbaksa-theme .tm-symp-wrap { margin-top: clamp(48px, 6.5vw, 74px); }
.byunbaksa-theme .tm-symp-eyebrow { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--faint); margin-bottom: 16px; }
/* ★증상 = 테두리 없는 흰색 소프트 태그(살짝 뜬 그림자) — 아웃라인 칩 대신 '쿨배경 위 흰 카드' 언어로 통일. 하이엔드. */
.byunbaksa-theme .tm-symp { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 11px; }
.byunbaksa-theme .tm-symp li { font-size: 13.5px; font-weight: 500; color: var(--text-secondary); letter-spacing: -0.015em; padding: 11px 18px; border-radius: 13px; background: var(--white); box-shadow: 0 8px 20px -14px rgba(26,28,32,0.28), 0 1px 3px -1px rgba(26,28,32,0.04); }

/* ── 원장(B) + 진료흐름(C) 묶음 ── */
.byunbaksa-theme .tm-approach { margin-top: clamp(74px, 10vw, 124px); }

/* B. 원장 한마디 = bb_explainer(영상 + 하단 자막 오버레이) 공용 컴포넌트 재사용. 히어로 중앙 배치. */
.byunbaksa-theme .tm-doctorwrap .bb-explainer { margin: clamp(32px, 4.5vw, 52px) 0 0; }  /* 좌측정렬(컬럼 안) */

/* C. 진료 흐름 4스텝 */
.byunbaksa-theme .tm-flow { margin-top: 0; }
.byunbaksa-theme .tm-flow-head { margin-bottom: 26px; }
/* Process 실제 진료 영상 — 제목 밑, 스텝 위. ★히어로 원장영상(.tm-doctorwrap=max 560)과 폭 통일 */
.byunbaksa-theme .tm-flow-vid { margin: 0 0 clamp(30px, 4vw, 44px); max-width: 560px; }
/* ★프로세스 제목 = FAQ(자주 묻는 질문) 제목과 통일: 빨강 eyebrow + 25/700 제목 */
.byunbaksa-theme .tm-flow-eyebrow { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--blue-accent); margin-bottom: 10px; }
.byunbaksa-theme .tm-flow-head h2 { margin: 0; font-size: clamp(21px, 2.6vw, 25px); font-weight: 700; letter-spacing: -0.04em; color: var(--navy); word-break: keep-all; }
/* ★세로 배치(가로 4열 → 세로) = 여백↑ 하이엔드. 번호 왼쪽(2줄 span·중앙), 제목·설명 오른쪽, 헤어라인 구분선 */
/* ★프로세스 = 밑줄(구분선) 제거(메뉴판에 구분선 많아 중복). 스텝 사이는 gap 여백으로만. */
.byunbaksa-theme .tm-flow-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: clamp(20px, 2.8vw, 30px); }
.byunbaksa-theme .tm-flow-steps li { display: grid; grid-template-columns: auto 1fr; column-gap: clamp(18px, 3vw, 32px); row-gap: 5px; align-items: baseline; }
.byunbaksa-theme .tm-flow-n { grid-column: 1; grid-row: 1 / span 2; align-self: center; font-size: 15px; font-weight: 700; color: var(--accent); font-variant-numeric: tabular-nums; letter-spacing: 0.04em; }
.byunbaksa-theme .tm-flow-t { grid-column: 2; font-size: 16px; font-weight: 600; color: var(--ink); letter-spacing: -0.03em; }
.byunbaksa-theme .tm-flow-d { grid-column: 2; font-size: 13px; color: var(--muted); line-height: 1.6; letter-spacing: -0.01em; word-break: keep-all; }

/* ★원장 진료 노트 (SEO/AEO 고유 콘텐츠 + E-E-A-T 크레덴셜 카드). 제목=FAQ/프로세스와 통일. */
.byunbaksa-theme .tm-note { margin-top: clamp(74px, 10vw, 124px); max-width: 780px;
  background: var(--white); border-radius: var(--radius-lg); padding: clamp(26px, 4vw, 40px);
  box-shadow: 0 26px 60px -38px rgba(26,28,32,0.5), 0 2px 6px -2px rgba(26,28,32,0.04); }
.byunbaksa-theme .tm-note-head { margin-bottom: 24px; }
.byunbaksa-theme .tm-note-eyebrow { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--blue-accent); margin-bottom: 10px; }
.byunbaksa-theme .tm-note-head h2 { margin: 0; font-size: clamp(21px, 2.6vw, 25px); font-weight: 700; letter-spacing: -0.04em; color: var(--navy); word-break: keep-all; }
.byunbaksa-theme .tm-note-text { margin: 0; font-size: clamp(15px, 1.7vw, 16.5px); line-height: 1.85; color: var(--text-secondary); letter-spacing: -0.015em; word-break: keep-all; }
.byunbaksa-theme .tm-note-text + .tm-note-text { margin-top: 16px; }   /* 2문단 간격 */
.byunbaksa-theme .tm-note-by { display: flex; align-items: center; gap: 18px; margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--line); }
.byunbaksa-theme .tm-note-avatar { flex: 0 0 auto; width: 80px; height: 80px; border-radius: 50%; object-fit: cover; object-position: center 16%; box-shadow: 0 12px 26px -14px rgba(26,28,32,0.45); }
.byunbaksa-theme .tm-note-who { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.byunbaksa-theme .tm-note-name { font-size: 15px; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; }
.byunbaksa-theme .tm-note-name em { font-style: normal; font-weight: 500; color: var(--muted); margin-left: 3px; }
.byunbaksa-theme .tm-note-title { font-size: 13px; font-weight: 500; color: var(--text-secondary); letter-spacing: -0.01em; }
.byunbaksa-theme .tm-note-creds { font-size: 12px; color: var(--faint); letter-spacing: -0.01em; line-height: 1.65; margin-top: 3px; word-break: keep-all; }

/* (프로세스는 세로 flex 로 전환 → 모바일 2열 규칙 불필요, 제거) */

/* FAQ = 메뉴판 안에선 좌측정렬(공용 .bb-faq 는 중앙정렬이라 컨텍스트만 조정) */
.byunbaksa-theme .tm-main .bb-faq { margin: clamp(74px, 10vw, 124px) 0 0; max-width: none; padding: 0; }
.byunbaksa-theme .tm-main .bb-faq-head { text-align: left; }

/* ── 반응형: 좌 레일 → 상단 가로 스크롤 칩(스티키) ── */
/* ── ★카드 제목(tm-bhead)이 곧 카테고리 드롭다운 = 모바일. PC는 caret/menu 숨김 = 일반 헤더(레일 사용). ── */
.byunbaksa-theme .tm-bsel { position: relative; }
.byunbaksa-theme .tm-bsel-caret { display: none; }   /* PC 숨김 */
.byunbaksa-theme .tm-bsel-menu { display: none; }    /* PC 숨김 */

@media (max-width: 860px) {
  .byunbaksa-theme .tm-cols { display: block; }        /* grid 해제 */
  .byunbaksa-theme .tm-rail { display: none; }         /* ★알약바 제거 → 카드 제목 드롭다운으로 대체 (2026-08-13) */
  /* ★모바일 = 카드 제목을 '셀렉트 박스' 톤으로(배경채움+테두리) → 메뉴 내용(흰 행)과 구분 = 드롭다운임을 직감. */
  .byunbaksa-theme .tm-bhead--sel { cursor: pointer; -webkit-tap-highlight-color: transparent; align-items: center; gap: 12px;
    background: var(--bg2); border: 1px solid var(--line); border-radius: 14px; padding: 11px 12px; margin-bottom: 24px; }
  .byunbaksa-theme .tm-bhead--sel .tm-bimg { width: 44px; height: 44px; border-radius: 11px; }
  .byunbaksa-theme .tm-bhead--sel h2 { font-size: 17px; }
  .byunbaksa-theme .tm-bhead--sel .tm-btext p { display: none; }   /* 셀렉트 톤 유지 위해 부제는 숨김(활성 카테고리는 상단 히어로에 이미 있음) */
  /* ★화살표 = 흰 동그라미(버튼감) + 레드 ⌄. 열리면 180° = ^ */
  .byunbaksa-theme .tm-bsel-caret { display: flex; align-items: center; justify-content: center; flex: 0 0 auto; margin-left: auto; align-self: center; width: 32px; height: 32px; border-radius: 50%; background: var(--white); border: 1px solid var(--line); box-shadow: 0 5px 12px -6px rgba(26,28,32,0.25); transition: transform .28s var(--ease); }
  .byunbaksa-theme .tm-bsel-caret::before { content: ''; width: 8px; height: 8px; margin-top: -2px; border-right: 2px solid var(--accent); border-bottom: 2px solid var(--accent); transform: rotate(45deg); }
  .byunbaksa-theme .tm-bsel.open .tm-bsel-caret { transform: rotate(180deg); }
  .byunbaksa-theme .tm-bsel-menu { display: block; list-style: none; margin: 0; padding: 6px; position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 30; background: var(--white); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 34px 64px -28px rgba(26,28,32,0.42); opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .2s var(--ease), transform .2s var(--ease), visibility .2s; }
  .byunbaksa-theme .tm-bsel.open .tm-bsel-menu { opacity: 1; visibility: visible; transform: none; }
  .byunbaksa-theme .tm-bsel-opt { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 12px 14px; border-radius: 9px; text-decoration: none; font-size: 14.5px; font-weight: 500; letter-spacing: -0.02em; color: var(--muted); }
  .byunbaksa-theme .tm-bsel-opt .n { font-size: 11.5px; font-weight: 600; color: var(--faint); font-variant-numeric: tabular-nums; }
  .byunbaksa-theme .tm-bsel-opt.on { color: var(--ink); font-weight: 600; background: var(--bg2); }
  .byunbaksa-theme .tm-bsel-opt.on .n { color: var(--accent); }
}
@media (max-width: 620px) {
  .byunbaksa-theme .tm-grid { grid-template-columns: 1fr; }
  .byunbaksa-theme .tm-card:nth-child(2) { border-top: 1px solid var(--line); }
  .byunbaksa-theme .tm-bimg { width: 54px; height: 54px; }
}

/* ============================================================
   EVENT PAGE (진행 중 이벤트) — page-event.php
   시술 허브(.tm-*) 셸·레일·드롭다운을 그대로 공유. 메뉴판(.tm-block) 안 본문만
   가격 행(.tm-grid) 대신 "포스터 이미지 + 내용"(.evp-item)으로 대체.
   ============================================================ */
.byunbaksa-theme .evp-list { display: flex; flex-direction: column; }

/* ★이벤트 1건 = 1단(포스터 위 · 내용 아래). 포스터가 세로 배너라 2컬럼이면 눌려서 안 보임 → 위에 크게. */
.byunbaksa-theme .evp-item { display: block; }
.byunbaksa-theme .evp-item + .evp-item { margin-top: clamp(34px, 4.5vw, 56px); padding-top: clamp(34px, 4.5vw, 56px); border-top: 1px solid var(--line); }

/* 포스터 — 원본 비율 그대로(안 자름), 쿨 배경, 살짝 라운드. 세로 배너라 폭 캡(가독) + ★가운데 정렬. */
.byunbaksa-theme .evp-item-img { max-width: 500px; margin: 0 auto clamp(22px, 3vw, 32px); border-radius: var(--radius-s, 12px); overflow: hidden; background: var(--bg2); }
.byunbaksa-theme .evp-item-img img { display: block; width: 100%; height: auto; }

.byunbaksa-theme .evp-item-body { min-width: 0; max-width: 680px; }
.byunbaksa-theme .evp-item-title { margin: 0 0 14px; font-size: clamp(19px, 2.2vw, 24px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.35; color: var(--ink); }

/* 본문 파싱 결과 (■ 소제목 / · 가격줄 / 일반 문단) */
.byunbaksa-theme .evp-card-text { font-size: 14.5px; line-height: 1.9; color: var(--text-secondary); }
.byunbaksa-theme .evp-card-text > p { margin: 0 0 10px; }
.byunbaksa-theme .evp-card-text > p:last-child { margin-bottom: 0; }
.byunbaksa-theme .evp-sub { margin: 22px 0 10px; font-size: 14px; font-weight: 700; letter-spacing: -0.02em; color: var(--ink); }
.byunbaksa-theme .evp-sub:first-child { margin-top: 0; }
.byunbaksa-theme .evp-plist { list-style: none; margin: 0 0 6px; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.byunbaksa-theme .evp-plist li { position: relative; padding-left: 15px; font-size: 14px; line-height: 1.6; color: var(--text-secondary); letter-spacing: -0.01em; }
.byunbaksa-theme .evp-plist li::before { content: ''; position: absolute; left: 2px; top: 9px; width: 4px; height: 4px; border-radius: 50%; background: var(--accent); }

/* 빈 상태 */
.byunbaksa-theme .evp-empty { text-align: center; color: var(--muted); font-size: 15px; line-height: 1.9; padding: clamp(50px, 9vh, 96px) 0; }

@media (max-width: 620px) {
  .byunbaksa-theme .evp-item-img { max-width: 100%; }
}

/* ============================================================
   PROGRAM DETAIL (③ 개별 시술 상세) — page-program.php
   하이엔드 미니멀: 쿨 배경 + 흰 카드 부양 + Pretendard. .byunbaksa-theme 스코프.
   레이아웃 = 브레드크럼 → 히어로(좌 텍스트/우 고민 대표이미지) → 본문 2컬럼(좌 설명·우 스티키 가격/정보) → 하단 CTA.
   ============================================================ */
.byunbaksa-theme .pg { max-width: 1120px; margin: 0 auto; padding-left: var(--pad); padding-right: var(--pad);
  padding-top: clamp(92px, 13vh, 150px); padding-bottom: clamp(56px, 9vw, 104px); }

/* 브레드크럼 */
.byunbaksa-theme .pg-crumb { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px;
  font-size: 12.5px; color: var(--text-muted); margin-bottom: clamp(20px, 3vw, 32px); }
.byunbaksa-theme .pg-crumb a { color: var(--text-muted); text-decoration: none; transition: color .2s var(--ease); }
.byunbaksa-theme .pg-crumb a:hover { color: var(--accent); }
.byunbaksa-theme .pg-crumb i { color: var(--gray-300); font-style: normal; margin: 0 2px; }
.byunbaksa-theme .pg-crumb span[aria-current] { color: var(--text-primary); font-weight: 600; }

/* 히어로 */
.byunbaksa-theme .pg-hero { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(24px, 4vw, 56px);
  align-items: center; margin-bottom: clamp(40px, 6vw, 72px); }
.byunbaksa-theme .pg-hero-text .kicker { color: var(--accent); margin-bottom: 14px; display: inline-block; }
.byunbaksa-theme .pg-title { font-size: clamp(28px, 4.6vw, 44px); font-weight: 700; line-height: 1.18;
  letter-spacing: -.03em; color: var(--text-primary); }
.byunbaksa-theme .pg-sub { margin-top: 16px; font-size: clamp(15px, 1.5vw, 17px); line-height: 1.7;
  color: var(--text-secondary); max-width: 30em; }
.byunbaksa-theme .pg-tags { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.byunbaksa-theme .pg-tags li { font-size: 12.5px; font-weight: 500; color: var(--text-secondary);
  background: var(--white); border: 1px solid var(--line); border-radius: 999px; padding: 6px 13px; }
.byunbaksa-theme .pg-tags--areas li { background: var(--gray-100); border-color: transparent; }
.byunbaksa-theme .pg-cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }

/* 버튼 */
.byunbaksa-theme .pg-btn { display: inline-flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 600; line-height: 1; padding: 13px 20px; border-radius: 999px;
  text-decoration: none; transition: all .2s var(--ease); white-space: nowrap; }
.byunbaksa-theme .pg-btn--primary { background: var(--accent); color: #fff; }
.byunbaksa-theme .pg-btn--primary:hover { background: var(--accent-ink); transform: translateY(-1px); }
.byunbaksa-theme .pg-btn--ghost { background: var(--white); color: var(--text-primary); border: 1px solid var(--line); }
.byunbaksa-theme .pg-btn--ghost:hover { border-color: var(--gray-300); color: var(--accent); }

/* 히어로 이미지(고민 대표 = 공유) */
.byunbaksa-theme .pg-hero-media { margin: 0; border-radius: var(--radius-lg); overflow: hidden;
  aspect-ratio: 4/5; box-shadow: var(--shadow-float); background: var(--gray-100); }
.byunbaksa-theme .pg-hero-media img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 본문 2컬럼 */
.byunbaksa-theme .pg-cols { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, .95fr);
  grid-template-areas: "doc side" "about side" "rest side"; column-gap: clamp(28px, 4vw, 56px);
  row-gap: clamp(40px, 5vw, 64px); align-items: start; }   /* ★블록(영상·설명·나머지) 간격 = 하이엔드 여백 */
.byunbaksa-theme .pg-about { grid-area: about; min-width: 0; }
/* 설명 블록 간격은 row-gap 이 담당 → 내부 섹션 하단 여백/보더 제거(이중 방지) */
.byunbaksa-theme .pg-about .pg-sec { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
.byunbaksa-theme .pg-rest  { grid-area: rest; min-width: 0; }
/* 영상(doc) — PC: 좌측 컬럼 최상단(설명 위). 허브 bb_explainer 그대로, 좌정렬·모던 사이즈 캡. 간격=row-gap */
.byunbaksa-theme .pg-doc { grid-area: doc; min-width: 0; }
.byunbaksa-theme .pg-doc .bb-explainer { margin: 0; max-width: 480px; }

/* 본문 섹션 */
.byunbaksa-theme .pg-sec { padding-bottom: clamp(28px, 4vw, 40px); margin-bottom: clamp(28px, 4vw, 40px);
  border-bottom: 1px solid var(--line); }
.byunbaksa-theme .pg-sec:last-of-type { border-bottom: 0; }
.byunbaksa-theme .pg-sec-head { margin-bottom: 16px; }
.byunbaksa-theme .pg-eyebrow { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--blue-accent); margin-bottom: 9px; }
.byunbaksa-theme .pg-sec-head h2 { font-size: clamp(19px, 2.2vw, 23px); font-weight: 700;
  letter-spacing: -.035em; color: var(--navy); word-break: keep-all; }
.byunbaksa-theme .pg-prose p { font-size: 15.5px; line-height: 1.85; color: var(--text-secondary); }
.byunbaksa-theme .pg-prose p + p { margin-top: 1em; }

/* 불릿 리스트 */
.byunbaksa-theme .pg-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.byunbaksa-theme .pg-list li { position: relative; padding-left: 26px; font-size: 15px; line-height: 1.7;
  color: var(--text-secondary); }
.byunbaksa-theme .pg-list li::before { content: ""; position: absolute; left: 4px; top: 10px;
  width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }

/* 진행 순서 */
.byunbaksa-theme .pg-steps { list-style: none; counter-reset: pgstep; display: flex; flex-direction: column; gap: 14px; }
.byunbaksa-theme .pg-steps li { counter-increment: pgstep; position: relative; padding-left: 40px;
  font-size: 15px; line-height: 1.7; color: var(--text-secondary); min-height: 28px; }
.byunbaksa-theme .pg-steps li::before { content: counter(pgstep); position: absolute; left: 0; top: 0;
  width: 28px; height: 28px; border-radius: 50%; background: var(--text-primary); color: #fff;
  font-size: 13px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }

/* 주의사항 = 다른 섹션과 완전 통일(빨간 박스 없음). eyebrow 빨강·본문·점 = 기본값(.pg-sec/.pg-eyebrow 상속). */
/* ★시술 노트(카드) 바로 뒤 주의사항 = 붙지 않게 상단 여백(노트는 margin-bottom 없음). PC·모바일 공통. */
.byunbaksa-theme .pg-note + .pg-sec--notice { margin-top: clamp(40px, 6vw, 64px); }

/* 우측 사이드(스티키) */
.byunbaksa-theme .pg-side { grid-area: side; position: sticky; top: 88px; display: flex; flex-direction: column; gap: 16px; }
.byunbaksa-theme .pg-card { background: var(--white); border-radius: var(--radius-lg);
  padding: clamp(22px, 2.5vw, 28px); box-shadow: 0 22px 50px -34px rgba(26,28,32,0.5), 0 2px 6px -2px rgba(26,28,32,0.04); }
.byunbaksa-theme .pg-card-t { font-size: 16px; font-weight: 700; letter-spacing: -.01em; color: var(--text-primary);
  margin-bottom: 16px; }

/* 가격 메뉴 */
.byunbaksa-theme .pg-menu { list-style: none; }
.byunbaksa-theme .pg-menu-row { display: flex; align-items: baseline; justify-content: space-between; gap: 14px;
  padding: 13px 0; border-top: 1px solid var(--gray-100); }
.byunbaksa-theme .pg-menu-row:first-child { border-top: 0; padding-top: 0; }
.byunbaksa-theme .pg-menu-info { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.byunbaksa-theme .pg-menu-name { font-size: 14.5px; font-weight: 600; color: var(--text-primary); }
.byunbaksa-theme .pg-menu-desc { font-size: 12.5px; line-height: 1.5; color: var(--text-muted); }
.byunbaksa-theme .pg-menu-price { flex: 0 0 auto; text-align: right; white-space: nowrap; }
.byunbaksa-theme .pg-menu-price b { font-size: 15px; font-weight: 700; color: var(--text-primary); }
.byunbaksa-theme .pg-menu-price b em { font-size: 12px; font-weight: 500; font-style: normal; color: var(--text-muted); margin-left: 1px; }
.byunbaksa-theme .pg-menu-reg { display: block; font-size: 11.5px; color: var(--gray-300); }
.byunbaksa-theme .pg-menu-sale { color: var(--accent) !important; }
.byunbaksa-theme .pg-price-note { margin-top: 14px; font-size: 11.5px; line-height: 1.6; color: var(--text-muted); }

/* 시술 정보 */
.byunbaksa-theme .pg-info-list { display: flex; flex-direction: column; }
.byunbaksa-theme .pg-info-row { display: flex; align-items: baseline; justify-content: space-between; gap: 14px;
  padding: 11px 0; border-top: 1px solid var(--gray-100); }
.byunbaksa-theme .pg-info-row:first-child { border-top: 0; padding-top: 0; }
.byunbaksa-theme .pg-info-row dt { font-size: 13px; color: var(--text-muted); }
.byunbaksa-theme .pg-info-row dd { font-size: 14px; font-weight: 600; color: var(--text-primary); text-align: right; }

/* 히어로 붕 뜬 소프트 태그(허브 .tm-symp 재사용) — 히어로 안에선 여백만 좁게 */
.byunbaksa-theme .pg-symp { margin-top: clamp(22px, 3vw, 30px); }
.byunbaksa-theme .pg-symp .tm-symp-eyebrow { color: var(--text-muted); }

/* 시술 노트 — 카드 룩은 공용 .tm-note(카드화)에서 상속. 상세선 풀폭 + 위치만 override */
.byunbaksa-theme .pg-note { max-width: none; margin: clamp(28px, 3.4vw, 44px) 0 0; }

/* 하단 = 허브로 돌아가기(back 링크만) */
.byunbaksa-theme .pg-foot { margin-top: clamp(40px, 6vw, 64px); padding-top: clamp(28px, 4vw, 40px);
  border-top: 1px solid var(--line); }
.byunbaksa-theme .pg-back { font-size: 14px; font-weight: 600; color: var(--text-secondary); text-decoration: none;
  transition: color .2s var(--ease); }
.byunbaksa-theme .pg-back:hover { color: var(--accent); }

/* 시술 없음 */
.byunbaksa-theme .pg--empty { min-height: 48vh; display: flex; align-items: center; justify-content: center; text-align: center; }
.byunbaksa-theme .pg-empty-box .kicker { color: var(--accent); }
.byunbaksa-theme .pg-empty-box .pg-title { margin-top: 12px; }
.byunbaksa-theme .pg-empty-box .pg-sub { margin: 16px auto 26px; }

/* .pg 안의 FAQ = 공용 .bb-faq 재사용(상단 여백만) */
.byunbaksa-theme .pg-rest .bb-faq { margin-top: 8px; }

/* 반응형 */
@media (max-width: 940px) {
  .byunbaksa-theme .pg-hero { grid-template-columns: 1fr; margin-bottom: clamp(48px, 11vw, 68px); }  /* ★사진↔본문 여백 더 */
  .byunbaksa-theme .pg-hero-media { order: -1; aspect-ratio: 16/10; max-height: 300px; }
  /* ★모바일 1열 순서 = 설명 → 영상 → 가격/정보 → 나머지. 여백 더(하이엔드) = row-gap 확대 */
  .byunbaksa-theme .pg-cols { grid-template-columns: 1fr; grid-template-areas: "about" "doc" "side" "rest";
    row-gap: clamp(44px, 11vw, 60px); }
  .byunbaksa-theme .pg-side { position: static; top: auto; margin-bottom: 0; }
  .byunbaksa-theme .pg-doc .bb-explainer { max-width: none; margin: 0; }
}
@media (max-width: 620px) {
  .byunbaksa-theme .pg-note .tm-note-by { flex-direction: column; align-items: flex-start; gap: 14px; }
}
