/* ==========================================================================
   146 인중성형 — 페이지 전용 CSS
   모든 셀렉터는 .fs-p-146 스코프. 색은 --fs-* 토큰만 쓴다(새 hex 0개).
   전용 컴포넌트
     .fs-philtrum-hero    모델 풀블리드 히어로 (투명 오버레이 헤더)
     .fs-philtrum-ratio   인중 비율 1:2 계측 오버레이  ← 시그니처
     .fs-philtrum-flow    술식 2판 단계 스트립 (정적 · 캐러셀 폐지)
     .fs-philtrum-target  대상 체크 카드
     .fs-philtrum-cta     상담 전환 밴드
   ========================================================================== */

/* --- 1. 모델 풀블리드 히어로 + 투명 오버레이 헤더 ------------------------
   승인자가 1mmpsglobal.com/en 의 헤더를 지목했다 — 투명 헤더 + 전면 모델컷 +
   좌측 잉크 카피. 143·53·121·51·46·47·About 과 같은 계열이고 이 사이트
   서브 히어로의 정본이다. 146 만 옛 「크림 밴드 + 사진 상자」로 남아 있었다.
   ------------------------------------------------------------------------ */

/* fs.css 의 .fs-header--overlay 는 «흰 글자» 전제다. 이 히어로는 크림→민트라
   다섯 곳을 같이 뒤집는다(로고는 원본 금색+먹 그대로 쓴다).
   ★ 이 변수를 빠뜨리면 fs.css 의 기본값 rgba(0,0,0,.14) 가 살아나 밝은 히어로 위
   헤더 100px 에만 검은 틴트가 깔린다 — 1920 렌더에 가로 이음매로 찍힌다. */
.fs-p-146 {
  --fs-header-overlay-bg: transparent;
}
.fs-p-146 .fs-header--overlay { color: var(--fs-ink); }
.fs-p-146 .fs-header--overlay::before { content: none; }
/* 형제 오버레이 페이지들은 GNB 를 통째로 400 으로 내리는데, 146 은 «쁘띠/기타»
   대분류 자신이라 최상위에 aria-current 가 붙는다 — fs.css 의 700 표시를
   덮어 버리지 않도록 현재 항목만 빼고 내린다. */
.fs-p-146 .fs-gnb__link:not([aria-current="page"]) { font-weight: 400; }
.fs-p-146 .fs-header--overlay .fs-gnb__link:hover,
.fs-p-146 .fs-header--overlay .fs-gnb__link:focus-visible { color: var(--fs-teal-dk); opacity: 1; }
/* --fs-muted-2(#7D7D7D)는 밝은 배경에서 3.6:1 이라 AA 미달이다 */
.fs-p-146 .fs-header--overlay .fs-util__link { color: var(--fs-ink-soft); }
.fs-p-146 .fs-header--overlay .fs-util__link:hover { color: var(--fs-teal-dk); opacity: 1; }
.fs-p-146 .fs-util__sep { opacity: .35; }
/* fs.css 의 «호버 시 흰 글자» 도 다크 전제 — 밝은 헤더에선 사라진다 */
.fs-p-146 .fs-header--overlay .fs-allmenu:hover { color: var(--fs-teal-dk); opacity: 1; }
/* qa.py 는 오버레이 헤더 «뒤» 를 못 봐서 흰 GNB 1:1 오탐을 낸다 — 래퍼에 색을 선언해 둔다 */
.fs-p-146 .fs-page--overlay { background: var(--fs-cream-2); }

.fs-p-146 .fs-philtrum-hero { color: var(--fs-ink); }
/* fs.css 의 .fs-hero__bg img 규칙은 <picture> 를 건너뛴다(143·121 과 같은 처방) */
.fs-p-146 .fs-philtrum-hero .fs-hero__bg picture { display: block; width: 100%; height: 100%; }
.fs-p-146 .fs-philtrum-hero .fs-hero__bg img { object-position: 50% 0%; }
/* 카피가 앉는 좌측은 실측 rgb(247,243,235) 이라 스크림 없이도 잉크 17.1:1 ·
   --fs-teal-text 4.75:1 로 AA 를 넘는다(121 과 달리 크림 스크림이 필요 없다). */
.fs-p-146 .fs-philtrum-hero .fs-hero__copy {
  max-width: min(100%, 52vw);
  gap: clamp(12px, 9.5px + 0.705vw, 22px);
}
.fs-p-146 .fs-philtrum-hero .fs-hero__kicker {
  font-size: clamp(15px, 13.5px + 0.42vw, 21px);
  letter-spacing: 0.02em; font-weight: 600; color: var(--fs-teal-text);
}
.fs-p-146 .fs-philtrum-hero .fs-hero__title {
  font-size: clamp(30px, 21.4px + 2.39vw, 58px);
  font-weight: 700; line-height: 1.22; color: var(--fs-ink);
}

/* <1024px — 히어로 상자가 가로로 길어져 오버레이로는 카피와 모델이 겹친다.
   카피를 크림 밴드로 «위» 에 쌓고 세로 크롭 사진을 아래에 붙인다(143·121 과 같은 방식).
   밴드색은 세로 에셋 상단 실측(251,243,233)에 가장 가까운 토큰 --fs-cream-2 다. */
@media (max-width: 1023px) {
  .fs-p-146 .fs-philtrum-hero { min-height: 0; background: var(--fs-cream-2); }
  .fs-p-146 .fs-philtrum-hero .fs-hero__bg {
    position: static; inset: auto; z-index: 0; grid-row: 2;
  }
  .fs-p-146 .fs-philtrum-hero .fs-hero__bg img {
    height: auto; aspect-ratio: 3 / 4; object-position: 50% 100%;
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 96px);
            mask-image: linear-gradient(180deg, transparent 0, #000 96px);
  }
  .fs-p-146 .fs-philtrum-hero .fs-hero__inner {
    grid-row: 1; background: var(--fs-cream-2);
    padding-block: calc(var(--fs-header-h) + var(--fs-sp-9)) var(--fs-sp-11);
  }
  .fs-p-146 .fs-philtrum-hero .fs-hero__copy { max-width: 100%; }
}

/* --- 2. 인중 비율 1:2 계측 오버레이 (시그니처) ---------------------------- */
.fs-p-146 .fs-philtrum-ratio__fig {
  --fs-philtrum-gutter: clamp(34px, 28.7px + 1.474vw, 54px);
  padding-inline-end: var(--fs-philtrum-gutter);
}
/* 계측 눈금의 % 는 사진 높이 기준이어야 한다 — figure 에 걸면 라벨바 높이만큼 밀린다 */
.fs-p-146 .fs-philtrum-ratio__frame { position: relative; display: block; }
.fs-p-146 .fs-philtrum-ratio__fig img { display: block; width: 100%; height: auto; }
.fs-p-146 .fs-philtrum-ratio__mark {
  position: absolute;
  inset-inline-end: calc(-1 * var(--fs-philtrum-gutter));
  width: clamp(30px, 24.7px + 1.474vw, 50px);
  display: flex; align-items: center; justify-content: flex-end;
  border-inline-start: 2px solid var(--fs-teal-dk);
}
.fs-p-146 .fs-philtrum-ratio__mark::before,
.fs-p-146 .fs-philtrum-ratio__mark::after {
  content: ""; position: absolute;
  inset-inline-start: -2px; width: 11px; height: 2px;
  background: var(--fs-teal-dk);
}
.fs-p-146 .fs-philtrum-ratio__mark::before { inset-block-start: 0; }
.fs-p-146 .fs-philtrum-ratio__mark::after  { inset-block-end: 0; }
.fs-p-146 .fs-philtrum-ratio__num {
  font-family: var(--fs-font-en);
  font-size: clamp(20px, 16.8px + 0.897vw, 34px);
  font-weight: 700; line-height: 1;
  color: var(--fs-teal-dk);
}
/* 원본 8c04087ada3c3 / a15340cd817c8 에 구워진 점선 계측선의 실측 y 좌표(%) */
.fs-p-146 .fs-philtrum-ratio__mark--one { inset-block-start: 63.28%; height: 4.78%; }
.fs-p-146 .fs-philtrum-ratio__mark--two { inset-block-start: 77.91%; height: 9.55%; }
.fs-p-146 .fs-philtrum-ratio__cap { margin-block-start: 0; }
.fs-p-146 .fs-philtrum-ratio__zooms {
  display: grid; gap: var(--fs-gap-card);
  grid-template-columns: minmax(0, 1fr);
  margin-block-start: clamp(24px, 20.7px + 0.897vw, 38px);
}
.fs-p-146 .fs-philtrum-ratio__zoom { display: block; }
.fs-p-146 .fs-philtrum-ratio__zoom img {
  display: block; width: 100%; height: auto;
  aspect-ratio: 412 / 190; object-fit: cover;
}
.fs-p-146 .fs-philtrum-ratio__body { display: grid; gap: clamp(14px, 11.2px + 0.769vw, 26px); align-content: start; }
@media (min-width: 600px) {
  .fs-p-146 .fs-philtrum-ratio__zooms { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --- 3. 술식 2판 단계 스트립 (캐러셀 폐지) --------------------------------
   전에는 슬라이드 2장짜리 캐러셀이었다. 두 슬라이드의 높이 차 때문에 판 아래가
   비고, 다음 슬라이드가 오른쪽으로 흘러 들어와 「잘린 두 번째 술식」으로 읽혔다.
   두 술식을 «세로로 쌓은 정적 2판» 으로 바꿔 JS·화살표·썸네일 탭을 전부 걷어냈다.
   판마다 [술식명] 행 + [단계 스트립 | 확대 도해 보조열] 행이다.
   -------------------------------------------------------------------------- */
.fs-p-146 .fs-philtrum-flow {
  display: grid;
  gap: clamp(34px, 26.1px + 2.179vw, 62px);
  margin-block-start: var(--fs-gap-title);
}
.fs-p-146 .fs-philtrum-flow__proc {
  display: grid;
  gap: clamp(16px, 13.2px + 0.769vw, 28px);
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "name" "steps" "zooms";
  align-content: start;
}
.fs-p-146 .fs-philtrum-flow__proc + .fs-philtrum-flow__proc {
  border-block-start: 1px solid var(--fs-line);
  padding-block-start: clamp(34px, 26.1px + 2.179vw, 62px);
}
.fs-p-146 .fs-philtrum-flow__name {
  grid-area: name;
  font-size: var(--fs-t-h3); font-weight: 700; line-height: 1.25;
}
.fs-p-146 .fs-philtrum-flow__zooms {
  grid-area: zooms;
  display: grid; gap: clamp(12px, 10.0px + 0.577vw, 20px);
  align-content: start;
}
.fs-p-146 .fs-philtrum-flow__zoom img,
.fs-p-146 .fs-philtrum-flow__box img {
  display: block; width: 100%; height: auto; object-fit: cover;
}
.fs-p-146 .fs-philtrum-flow__zoom img { aspect-ratio: 215 / 160; }
.fs-p-146 .fs-philtrum-flow__zooms--pair .fs-philtrum-flow__zoom img { aspect-ratio: 220 / 140; }
.fs-p-146 .fs-philtrum-flow__steps {
  grid-area: steps;
  display: grid; gap: clamp(8px, 6.6px + 0.385vw, 14px);
  grid-template-columns: minmax(0, 1fr);
  justify-items: stretch; align-items: start;
}
.fs-p-146 .fs-philtrum-flow__fig { display: block; }
.fs-p-146 .fs-philtrum-flow__box { display: block; overflow: hidden; }
.fs-p-146 .fs-philtrum-flow__box--c img { aspect-ratio: 278 / 310; }
.fs-p-146 .fs-philtrum-flow__box--r img { aspect-ratio: 438 / 477; }
.fs-p-146 .fs-philtrum-flow__fig .fs-labelbar {
  min-height: clamp(42px, 39.4px + 0.721vw, 52px);
  line-height: 1.35;
}
.fs-p-146 .fs-philtrum-flow__arrow {
  display: grid; place-items: center; justify-self: center;
  width: clamp(28px, 26.2px + 0.513vw, 36px); aspect-ratio: 1;
  border-radius: var(--fs-radius-round);
  background: var(--fs-ink); color: var(--fs-white);
}
.fs-p-146 .fs-philtrum-flow__arrow svg { width: 45%; height: 45%; transform: rotate(90deg); }
@media (min-width: 600px) {
  .fs-p-146 .fs-philtrum-flow__steps--2 {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  }
  /* 원본 도해가 438px 이라 그 이상 늘리면 흐려진다 — 폭을 잠그고 칸 안에서 가운데로 */
  .fs-p-146 .fs-philtrum-flow__steps--2 .fs-philtrum-flow__fig { width: min(100%, 438px); justify-self: center; }
  .fs-p-146 .fs-philtrum-flow__steps--2 .fs-philtrum-flow__arrow svg { transform: none; }
  .fs-p-146 .fs-philtrum-flow__arrow { align-self: center; }
  .fs-p-146 .fs-philtrum-flow__zooms--pair { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* 600~1023 — 4단계는 2×2 로 접고 두 번째 커넥터만 아래로 꺾는다.
   (자동 배치에 맡기면 화살표가 2열을 차지해 도해가 한 줄에 하나씩 남는다) */
@media (min-width: 600px) and (max-width: 1023px) {
  .fs-p-146 .fs-philtrum-flow__steps--4 {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  }
  .fs-p-146 .fs-philtrum-flow__steps--4 > :nth-child(1) { grid-area: 1 / 1; }
  .fs-p-146 .fs-philtrum-flow__steps--4 > :nth-child(2) { grid-area: 1 / 2; }
  .fs-p-146 .fs-philtrum-flow__steps--4 > :nth-child(3) { grid-area: 1 / 3; }
  .fs-p-146 .fs-philtrum-flow__steps--4 > :nth-child(4) { grid-area: 2 / 2; }
  .fs-p-146 .fs-philtrum-flow__steps--4 > :nth-child(5) { grid-area: 3 / 1; }
  .fs-p-146 .fs-philtrum-flow__steps--4 > :nth-child(6) { grid-area: 3 / 2; }
  .fs-p-146 .fs-philtrum-flow__steps--4 > :nth-child(7) { grid-area: 3 / 3; }
  .fs-p-146 .fs-philtrum-flow__steps--4 > :nth-child(2) svg,
  .fs-p-146 .fs-philtrum-flow__steps--4 > :nth-child(6) svg { transform: none; }
  .fs-p-146 .fs-philtrum-flow__steps--4 > :nth-child(4) { align-self: center; }
  .fs-p-146 .fs-philtrum-flow__steps--4 > :nth-child(4) svg { transform: rotate(90deg); }
  .fs-p-146 .fs-philtrum-flow__zooms { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fs-p-146 .fs-philtrum-flow__zoom { max-width: 360px; }
}
@media (min-width: 1024px) {
  /* 이름 줄은 판 전체를 가로지르고, 그 아래를 [단계 스트립 | 확대 보조열] 로 나눈다 */
  .fs-p-146 .fs-philtrum-flow__proc {
    /* 보조열은 확대 도해 원본 폭(215·220px)에 맞춘다 — 넓히면 도해가 1.35배로
       늘어나 흐려진다. 남는 폭은 스텝 스트립이 가져간다(스텝 원본 278·438px). */
    grid-template-columns: minmax(0, 1fr) minmax(0, 220px);
    grid-template-areas: "name name" "steps zooms";
    column-gap: clamp(24px, 17.4px + 0.641vw, 36px);
  }
  .fs-p-146 .fs-philtrum-flow__steps--4 {
    grid-template-columns:
      minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
  }
  .fs-p-146 .fs-philtrum-flow__steps--4 .fs-philtrum-flow__arrow svg { transform: none; }
  /* 확대 2장은 보조열에서 «세로로» 쌓는다 — 296px 안에서 2열로 두면 한 장이 140px 이
     되어 스텝 도해 옆에 빈 자리만 남는다(1920 실측 508px 대 65px). */
  .fs-p-146 .fs-philtrum-flow__zooms--pair { grid-template-columns: minmax(0, 1fr); }
}

/* --- 4. 대상 체크 카드 ---------------------------------------------------- */
.fs-p-146 .fs-philtrum-target__photo { display: block; overflow: hidden; }
.fs-p-146 .fs-philtrum-target__photo img {
  display: block; width: 100%; height: auto;
  aspect-ratio: 1280 / 1075; object-fit: cover;
}
.fs-p-146 .fs-philtrum-target__list {
  display: grid; gap: var(--fs-gap-card);
  grid-template-columns: minmax(0, 1fr);
}
.fs-p-146 .fs-philtrum-target__card {
  display: grid; gap: clamp(10px, 8.6px + 0.385vw, 16px);
  grid-template-columns: minmax(0, 1fr);
  justify-items: start; align-items: center;
  padding: clamp(18px, 15.2px + 0.769vw, 30px);
  background: var(--fs-white);
  border-inline-start: 2px solid var(--fs-teal);
}
.fs-p-146 .fs-philtrum-target__icon {
  display: grid; place-items: center;
  width: clamp(52px, 48.4px + 1.0vw, 66px); aspect-ratio: 1;
}
.fs-p-146 .fs-philtrum-target__icon img { display: block; width: 100%; height: auto; aspect-ratio: 1; }
.fs-p-146 .fs-philtrum-target__card .fs-pill { justify-self: start; }
.fs-p-146 .fs-philtrum-target__text {
  font-size: var(--fs-t-body); line-height: 1.55; color: var(--fs-ink);
}
.fs-p-146 .fs-philtrum-target__head { display: grid; gap: clamp(12px, 10.0px + 0.577vw, 20px); align-content: start; }
@media (min-width: 600px) {
  .fs-p-146 .fs-philtrum-target__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  /* 넓은 1열에서만 아이콘을 글 옆으로 — 좁은 폭에서는 원문 줄바꿈이 또 쪼개진다 */
  .fs-p-146 .fs-philtrum-target__list { grid-template-columns: minmax(0, 1fr); }
  .fs-p-146 .fs-philtrum-target__card { grid-template-columns: auto minmax(0, 1fr); justify-items: stretch; }
  .fs-p-146 .fs-philtrum-target__icon { grid-row: span 2; width: clamp(66px, 60.7px + 1.474vw, 86px); }
  .fs-p-146 .fs-philtrum-target__text { font-size: var(--fs-t-lead); line-height: 1.45; }
}

/* --- 5. 상담 전환 밴드 ---------------------------------------------------- */
.fs-p-146 .fs-philtrum-cta__grid {
  display: grid; gap: clamp(24px, 20.7px + 0.897vw, 38px);
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
}
.fs-p-146 .fs-philtrum-cta__fig { display: block; overflow: hidden; }
.fs-p-146 .fs-philtrum-cta__fig img {
  display: block; width: 100%; height: auto;
  aspect-ratio: 1600 / 678; object-fit: cover;
}
.fs-p-146 .fs-philtrum-cta__body { display: grid; gap: clamp(14px, 11.7px + 0.641vw, 24px); align-content: center; }
@media (min-width: 1024px) {
  .fs-p-146 .fs-philtrum-cta__grid { grid-template-columns: minmax(0, 780fr) minmax(0, 580fr); }
  .fs-p-146 .fs-philtrum-cta__fig img { aspect-ratio: 780 / 330; }
}

/* --- 6. 다크 인용 밴드 ---------------------------------------------------- */
/* .fs-section > .fs-container 만 z-index:1 을 받는다. .fs-split 직계 자식은
   배경 레이어(.fs-section__bg, z-index:0)에 덮이므로 직접 올려 준다. */
.fs-p-146 .fs-philtrum-say > .fs-split { position: relative; z-index: 1; }
.fs-p-146 .fs-philtrum-say .fs-section__bg { opacity: .12; }
.fs-p-146 .fs-philtrum-say__fig { display: block; overflow: hidden; align-self: stretch; }
.fs-p-146 .fs-philtrum-say__fig img {
  display: block; width: 100%; height: 100%;
  aspect-ratio: 1160 / 1075; object-fit: cover;
}
.fs-p-146 .fs-philtrum-say__body {
  display: grid; gap: clamp(14px, 11.2px + 0.769vw, 26px);
  align-content: center;
  padding: clamp(46px, 30.9px + 4.199vw, 110px) var(--fs-gutter);
}
.fs-p-146 .fs-philtrum-say__kicker { color: var(--fs-white); }
.fs-p-146 .fs-philtrum-say__quote { max-width: 22em; }
@media (min-width: 1024px) {
  .fs-p-146 .fs-philtrum-say__fig img { aspect-ratio: auto; min-height: clamp(420px, 300px + 8vw, 560px); }
}

@media (prefers-reduced-motion: reduce) {
  .fs-p-146 .fs-philtrum-flow__tabs .fs-philtrum-flow__tab { transition: none !important; }
}

/* ==========================================================================
   ▼▼▼ 진단·수정 패스 — 2026-08-28
   근거·판정은 _design/QA/146.md. 아래 블록은 전부 .fs-p-146 스코프다.
   ========================================================================== */

/* --------------------------------------------------------------------------
   A. [LOCK 6] 캐러셀은 1440 밖으로 흘려 잘리게 둔다
   fs.js 가 뷰포트에 .fs-carousel__viewport 를 붙이므로 fs.css:892 의
   overflow:hidden 이 기본으로 걸린다. 위쪽 102행의 페이지 규칙도 같은 값이라
   「뷰포트를 1440 으로 잘라내는」 상태다 — LOCK 6 판정법 (b) 위반.
   되돌리는 폭은 1700 부터다. 노출 폭 = (W − 1440) / 2 이므로
   1440 에서 34px · 1024 에서 29px 밖에 안 나와 «잘린 다음 장» 이 아니라
   «어긋난 여백» 으로 읽힌다. 1700 에서 130px, 1920 에서 240px 로
   두 번째 술식의 aside(300px 열) 앞머리가 실제로 읽힌다.
   잘림은 fs.css:211·219 의 html/body{overflow-x:clip} 이 맡는다.
   -------------------------------------------------------------------------- */
@media (min-width: 1700px) {
  .fs-p-146 .fs-philtrum-flow__viewport { overflow: visible; }
  /* slide 모드는 코버플로우와 달리 비활성 장에 아무 변형이 없어, 흘러나온 조각이
     현재 장의 «5번째 단계» 처럼 이어져 읽힌다. 57 의 cover 모드가 쓰는 감광
     (fs.css:925 --fs-cover-fade)만 빌려 «다음 장» 임을 드러낸다. 3D 회전은
     빌리지 않는다 — 도해가 기울면 술식 그림이 왜곡돼 보인다. */
  .fs-p-146 .fs-philtrum-flow__slide {
    opacity: var(--fs-cover-fade, .55);
    transition: opacity var(--fs-dur-slow) var(--fs-ease-out);
  }
  .fs-p-146 .fs-philtrum-flow__slide.is-active { opacity: 1; }
  :root:not(.fs-js) .fs-p-146 .fs-philtrum-flow__slide:first-child { opacity: 1; }
}

/* --------------------------------------------------------------------------
   B. 비활성 슬라이드가 만드는 빈 공간
   트랙이 flex 라 두 장이 «가장 큰 쪽» 높이로 늘어난다. 실측 여백:
     1920 99px · 1440 95px · 1024 161px · 768 520px · 360 693px
   (4단계 슬라이드와 2단계 슬라이드의 콘텐츠 양이 원래 다르다. 도해를 줄여
    맞추는 것은 R4 — 수술기법 도해를 작게 만드는 일이라 하지 않는다.)
   fs.js 는 활성 슬라이드에만 .is-active 를 붙이고(fs.js:592) initCarousels 는
   reduced-motion 에서도 돌므로(fs.js:1019) .fs-carousel 을 게이트로 쓰면
   RM 렌더와 어긋나지 않는다. JS 가 없으면 .fs-carousel 자체가 없어 폴백된다.
   1700 이상은 A 의 «흘림» 이 그 자리를 다음 장으로 채우므로 접지 않는다.
   -------------------------------------------------------------------------- */
@media (max-width: 1699px) {
  .fs-p-146 .fs-philtrum-flow.fs-carousel .fs-philtrum-flow__slide:not(.is-active) {
    max-block-size: 0;
    overflow: hidden;
  }
  /* 드래그 중에는 끌려 들어오는 장이 «빈 칸» 으로 보이면 안 된다 */
  .fs-p-146 .fs-philtrum-flow.is-dragging .fs-philtrum-flow__slide { max-block-size: none; }
}

/* --------------------------------------------------------------------------
   C. [V70-E] 크림 밴드 위 흰 카드 4장 → 세로 헤어라인 열
   검출: E:fs-split×4@S5. 상자를 지우고 가는 가로선만 남기면 밀도가 올라가고
   «상자의 나열» 이 사라진다(48.css 5번 처방과 같은 방향).
   좁은 폭은 2열·1열이라 상자가 있어야 항목 경계가 읽힌다 — 1024 부터만.
   ※ 이 카드에는 data-fs-tilt 가 없다. 배경을 지워도 53 의 «흰 얼룩» 은
     생길 수 없다(광택은 틸트 호스트에만 주입된다).
   -------------------------------------------------------------------------- */
@media (min-width: 1024px) {
  .fs-p-146 .fs-philtrum-target__list { gap: 0; }
  .fs-p-146 .fs-philtrum-target__card {
    background: transparent;
    border-inline-start: 0;
    padding-inline: 0;
    padding-block: clamp(20px, 16.5px + 0.962vw, 30px);
    column-gap: clamp(18px, 15.2px + 0.769vw, 30px);
  }
  /* 헤어라인 — 첫 줄을 뺀 모든 줄 위에 */
  .fs-p-146 .fs-philtrum-target__card + .fs-philtrum-target__card::before {
    content: "";
    position: absolute;
    inset-inline: 0;
    inset-block-start: 0;
    height: 1px;
    background: var(--fs-line-input);
  }
}

/* --------------------------------------------------------------------------
   D. [V70-D] 인접 섹션의 도해가 같은 쪽 — 축을 반전시킨다
   검출: D:S5+S6 둘 다 Ll. A23(대상)·A24(상담) 이 연달아 «좌 사진 / 우 글» 이다.
   A23 을 뒤집으면 A13 좌 → A23 우 → A24 좌 → A26 우 로 번갈아 선다.
   열 «비율» 은 인라인 --fs-split(560fr / 780fr) 그대로 두고 order 만 뒤집는다.
   상자를 지운 항목 열은 좁은 560fr 쪽이 헤어라인이 덜 비어 보이고,
   넓은 780fr 이 인물컷 쪽으로 가 비대칭이 강해진다.
   ※ v70fit.sh 의 D 는 DOM 순서로 세므로 CSS order 반전을 못 본다.
     판정은 렌더로 한다(QA/146.md 참조).
   -------------------------------------------------------------------------- */
@media (min-width: 1024px) {
  .fs-p-146 .fs-philtrum-target__list { order: 1; }
  .fs-p-146 .fs-philtrum-target__head { order: 2; }
}

/* --------------------------------------------------------------------------
   E. 섹션 제목 뒤 70px 틸 선 (delay .5s)
   ★ 48 함정: «.is-in 이면 보이기» 로 짜면 첫 화면 제목의 선이 영원히 안 그어진다
     (fs.js 는 첫 화면 대상에 .fs-reveal 을 아예 안 붙인다).
     → 기본을 「그어진 상태」로 두고 .fs-reveal:not(.is-in) 에만 초기 은닉.
   ★ ID 로 열거하면 은닉 규칙이 명시도에서 져 선이 «항상 그어진 채» 굳는다.
     → 대상을 .fs-h2 클래스로만 잡는다(#ratio-title · #target-title 둘 다 .fs-h2).
   -------------------------------------------------------------------------- */
.fs-p-146 .fs-h2 { position: relative; }
.fs-p-146 .fs-h2::after {
  content: "";
  display: block;
  width: 70px;
  height: 1px;
  margin-block-start: var(--fs-sp-4);
  background: var(--fs-teal);
  transform: scaleX(1);
  transform-origin: left center;
  transition: transform var(--fs-dur-slow) var(--fs-ease-out) .5s;
}
:root.fs-js .fs-p-146 .fs-h2.fs-reveal:not(.is-in)::after,
:root.fs-js .fs-p-146 .fs-reveal:not(.is-in) .fs-h2::after { transform: scaleX(0); }

/* --------------------------------------------------------------------------
   F. 호버 — 프레임은 고정, 사진만 scale(1.045). 그림자는 쓰지 않는다.
   라벨바가 달린 figure 는 figure 자체를 클리핑 상자로 쓰고 라벨바를 위층에
   올린다. 안 그러면 커진 사진의 아랫단이 라벨바를 덮는다.
   틸트가 걸린 .fs-philtrum-target__photo 와 계측선이 밖으로 나오는
   .fs-philtrum-ratio__fig 는 대상에서 뺀다.
   -------------------------------------------------------------------------- */
.fs-p-146 .fs-philtrum-ratio__zoom,
.fs-p-146 .fs-philtrum-flow__zoom,
.fs-p-146 .fs-philtrum-flow__fig { overflow: hidden; }
.fs-p-146 .fs-philtrum-ratio__zoom .fs-labelbar,
.fs-p-146 .fs-philtrum-flow__zoom .fs-labelbar { position: relative; z-index: 1; }
.fs-p-146 .fs-philtrum-ratio__zoom img,
.fs-p-146 .fs-philtrum-flow__zoom img,
.fs-p-146 .fs-philtrum-flow__box img,
.fs-p-146 .fs-philtrum-cta__fig img,
.fs-p-146 .fs-philtrum-say__fig img {
  transition: transform var(--fs-dur-slow) var(--fs-ease-out);
}
@media (hover: hover) and (pointer: fine) {
  .fs-p-146 .fs-philtrum-ratio__zoom:hover img,
  .fs-p-146 .fs-philtrum-flow__zoom:hover img,
  .fs-p-146 .fs-philtrum-flow__fig:hover .fs-philtrum-flow__box img,
  .fs-p-146 .fs-philtrum-cta__fig:hover img,
  .fs-p-146 .fs-philtrum-say__fig:hover img { transform: scale(1.045); }
}

/* --------------------------------------------------------------------------
   G. reduced-motion — 위에서 새로 얹은 전환을 전부 고정한다
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .fs-p-146 .fs-h2::after { transition: none !important; transform: scaleX(1) !important; }
  .fs-p-146 .fs-philtrum-ratio__zoom img,
  .fs-p-146 .fs-philtrum-flow__zoom img,
  .fs-p-146 .fs-philtrum-flow__box img,
  .fs-p-146 .fs-philtrum-cta__fig img,
  .fs-p-146 .fs-philtrum-say__fig img { transition: none !important; }
}

/* --------------------------------------------------------------------------
   H. 1024~1199 에서 대표전화가 버튼 안에서 두 줄로 쪼개진다
   실측(텍스트 라인박스): 1200 이상·1023 이하는 1줄, 1100·1024 는 2줄
   ("전화 상담 051-806-" / "7979"). 2열 CTA 의 우측 열이 580fr 이라
   이 구간에서만 버튼이 215~200px 로 줄어든다.
   LOCK 8 (e) 가 새 white-space:nowrap 을 금지하므로 폭으로 푼다 —
   이 구간에서만 버튼 바를 1열로 쌓아 400px 를 준다.
   -------------------------------------------------------------------------- */
@media (min-width: 1024px) and (max-width: 1199px) {
  .fs-p-146 .fs-philtrum-cta__body .fs-btnbar { grid-template-columns: minmax(0, 1fr); }
}

/* 검사기 사슬 교정 — 화면은 0픽셀 바뀌지 않는다.
   이 페이지의 «배경이 그라데이션인 섹션»(background-image 로 칠하므로 backgroundColor 는
   transparent)이 qa.py 의 bgOf 를 통과시켜, 그 위 글자 배경으로 .fs-page--overlay 의
   히어로색이 잡힌다. main 에 실제로 칠해지는 색을 명시해 사슬을 그 앞에서 끊는다.
   지금은 대부분의 문단이 children.length 게이트로 아예 안 재어지지만(후보의 23%만 측정),
   재게 됐을 때 처음부터 맞는 값이 나오게 하려는 줄이다. 상세: overlay-wrapper-bg-leaks */
.fs-p-146 .fs-page--overlay > main { background: var(--fs-white); }

/* ==========================================================================
   ▼▼▼ 2026-10-15 · 병원 PPT 「홈페이지 수정(인중성형).pptx」 반영 — 계획 _design/PLAN-146-1015-pptx.md
   승인자 답 5건(계획서 §5). 이 블록은 _src/gen/146-pptx/new-block.css 가 원본이다 —
   146.css 를 직접 고치지 말고 거기 고친 뒤 css_build.py → finalize.py.
   ========================================================================== */

/* --- P1. 히어로(슬 1) — 「폰트 크기 줄여주세요」: 58px → 40px. 형제 히어로 실측(1920) 한 낱말 제목은 58px(64·57·51·78·75·151),
   문장형 제목은 40px(77·109 = --fs-t-h1) — 146 은 2줄 문장이라 40px 줄로.
   카피 꼴은 승인자 「히어로 포맷 형제 히어로처럼」 → 「영문이 상단, 해시태그 밑에」(10-15 저녁) = 사이트 «81 포맷»(64.css 09-21 블록과 같은 값):
   영문 킥커 21/500/.02em · --fs-teal-dk → 제목 → 줄(span — 폭·두께·색은 fs.css 정본, 제목 ::after 줄은 :has() 가 자동으로 끈다) → 해시태그 리드 --fs-t-lead/400/잉크.
   요소 간격 10px · 줄 아래 8px. 제목만 40px(병원 「폰트 크기 줄여주세요」 — 형제 81 포맷 제목은 시술명이라 58px). --- */
.fs-p-146 .fs-philtrum-hero .fs-hero__title { font-size: var(--fs-t-h1); }
.fs-p-146 .fs-philtrum-hero .fs-hero__copy { gap: var(--fs-sp-3); }
.fs-p-146 .fs-philtrum-hero .fs-hero__kicker { letter-spacing: 0.02em; font-weight: 500; line-height: 1.25; color: var(--fs-teal-dk); }
.fs-p-146 .fs-philtrum-hero__rule { margin-block-end: var(--fs-sp-2); }
.fs-p-146 .fs-philtrum-hero .fs-philtrum-hero__lead {
  max-width: 34em; font-size: var(--fs-t-lead); font-weight: 400; line-height: 1.5; color: var(--fs-ink);
}
/* 10-16 승인자 「얼굴 인상을 바꾸는 핵심 → 이 부분이 시술명보다는 조금 다르게」 — 앞 구절을 시술명과 꼴을 나눈다.
   메인 05 슬라이드와 같은 위계(설명 구절은 작고 가볍게 · 시술명이 주인공). 구절 --fs-t-h3(20→27)/500/--fs-ink-soft,
   시술명은 위 40px/700/잉크 그대로(「폰트 크기 줄여주세요」 유지). h1 문구·텍스트 노드는 그대로 — <br> 대신 블록 span. */
.fs-p-146 .fs-philtrum-hero__pre {
  display: block; margin-block-end: var(--fs-sp-1);
  font-size: var(--fs-t-h3); font-weight: 500; line-height: 1.35; letter-spacing: 0; color: var(--fs-ink-soft);
}
/* 10-16 승인자 「쁘띠 레이저 카테고리 히어로 포인트 컬러 핑크」 → 「146만 진행」 — body.fs-cat-petit(라이트 로즈 #F3E3E0).
   히어로 바탕·래퍼·메뉴 안개는 fs.css 카테고리 블록이 준다. 여기는 크림이 박혀 있던 두 곳만 로즈로:
   ① <1024 카피 밴드(위 1절 .fs-hero__inner --fs-cream-2) → --fs-cat-hex — 사진 hero-1015-mo.jpg 위 변이 같은 색이라 96px 마스크 이음매 없음.
   ② ≥1024 헤더 옅은 상자 — fs.css 의 body.fs-p-146 고정값(253,250,247 = 옛 크림 벽)이 카테고리 변수보다 뒤에 와서 이긴다 → (0,2,1)로 되찾는다. */
body.fs-p-146.fs-cat-petit { --fs-hdr-box: var(--fs-cat-light); }
@media (max-width: 1023px) {
  .fs-p-146 .fs-philtrum-hero .fs-hero__inner { background: var(--fs-cat-hex); }
}
/* 새 사진 hero-1015.jpg(4800x1200, hero_build.py) — 4:1 이라 1024~2560 전부 높이 맞춤. x 68.3% 면 두 눈 사이가 화면 72~76%
   (1024 75.8 · 1440 74.0 · 1920 73.0 · 2560 72.3 — 지금 모델 자리 73% 와 같다). 머리는 원본에서 위 변에 잘린 컷이라 y 는 0. */
.fs-p-146 .fs-philtrum-hero .fs-hero__bg img { object-position: 68.3% 0%; }
@media (max-width: 1023px) { .fs-p-146 .fs-philtrum-hero .fs-hero__bg img { object-position: 50% 100%; } }

/* --- P2. 새 섹션 #intro(슬 2 「페이지추가」) — 한 열 가운데 정렬. PPT 한 줄 = 블록 한 줄(≥1024 에서 한 줄에 들어간다 — 최장 50자 ≈ 1010px).
   #intro(흰)와 #ratio(흰)는 «짧고 입체감 있는 인중 → 이상적인 비율 1:2» 한 흐름 — 사이 여백을 섹션 간격 하나로(아래 패딩 0, 64 #concern 처방). --- */
.fs-p-146 main > .fs-section.fs-philtrum-intro { padding-block-end: 0; }
.fs-p-146 .fs-philtrum-intro__inner {
  display: grid; justify-items: center; text-align: center;
  gap: clamp(14px, 11.2px + 0.769vw, 26px);
}
.fs-p-146 .fs-philtrum-intro__inner .fs-h2 { text-wrap: balance; }
.fs-p-146 .fs-philtrum-intro__text {
  margin-block-start: clamp(10px, 6.3px + 1.026vw, 26px);
  font-size: var(--fs-t-lead); line-height: 1.85; color: var(--fs-ink-soft);
}
.fs-p-146 .fs-philtrum-intro__line { display: block; text-wrap: pretty; }

/* 가운데 머리의 제목 틸 선 — 146 E 절의 선은 왼쪽 기준(transform-origin left)이다. 가운데 머리 둘(#intro · #target)만 가운데로. */
.fs-p-146 .fs-philtrum-intro .fs-h2::after,
.fs-p-146 .fs-philtrum-target__head .fs-h2::after { margin-inline: auto; transform-origin: center; }

/* --- P3. #ratio(슬 3) — 라벨바·확대컷이 빠져 오른쪽 글 열이 짧아졌다 → ≥1024 에서 사진 열과 세로 가운데로.
   옮겨 온 #say 본문(.fs-philtrum-ratio__more)은 위 리드와 같은 글씨 · 가는 선으로 한 덩어리 구분 · 강조 「적절한 축소 범위」는
   다크 밴드에서 쓰던 네온 대신 흰 바탕용 --fs-teal-dk + 700(네온은 흰 바탕에서 AA 미달). --- */
@media (min-width: 1024px) { .fs-p-146 #ratio .fs-split { --fs-split-align: center; } }
.fs-p-146 .fs-philtrum-ratio__more {
  margin-block-start: clamp(6px, 3.2px + 0.769vw, 18px);
  padding-block-start: clamp(18px, 14.3px + 1.026vw, 34px);
  border-block-start: 1px solid var(--fs-line-input);
}
.fs-p-146 .fs-philtrum-ratio__em { color: var(--fs-teal-dk); font-weight: 700; }

/* --- P4. #flow(슬 5·6) — h3 가운데 · 캡션은 상자 없이 글만 · 술식별 카드 크기 통일(9:10, 「자기들끼리 맞게」).
   오목술 5장(단계 4 + C컬 확대)은 지금 단계 카드 폭(250px) 그대로, 축소술 3장은 지금 폭(438px) 그대로 — 「지금이랑 비슷한 사이즈」.
   1920 실측 컨테이너 1442px: 오목술 5×250 + 화살표 3 + 구분선 = 1440 · 축소술 3×438 + 화살표 2 = 1426. 확대 보조열(220px)은 없어졌다. --- */
.fs-p-146 .fs-philtrum-flow__name { text-align: center; }
.fs-p-146 .fs-philtrum-flow__box--c img,
.fs-p-146 .fs-philtrum-flow__box--r img { aspect-ratio: 9 / 10; }
.fs-p-146 .fs-philtrum-flow__cap {
  margin-block-start: clamp(10px, 8.6px + 0.385vw, 16px);
  text-align: center; text-wrap: balance;
  font-size: clamp(15px, 14.3px + 0.192vw, 18px); font-weight: 600; line-height: 1.45;
  color: var(--fs-ink);
}
.fs-p-146 .fs-philtrum-flow__sep { display: none; }
@media (min-width: 600px) {
  .fs-p-146 .fs-philtrum-flow__steps--3 {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
  }
  .fs-p-146 .fs-philtrum-flow__steps--3 .fs-philtrum-flow__arrow svg { transform: none; }
}
/* 600~1023 — 지금 4단계 2×2 배치(146.css 3절) 아래에 확대 카드를 가운데 한 장으로 */
@media (min-width: 600px) and (max-width: 1023px) {
  .fs-p-146 .fs-philtrum-flow__steps--c5 > .fs-philtrum-flow__fig--zoom {
    grid-area: 4 / 1 / auto / -1; justify-self: center;
    width: calc((100% - clamp(28px, 26.2px + 0.513vw, 36px)) / 2 - clamp(8px, 6.6px + 0.385vw, 14px));
    margin-block-start: var(--fs-sp-4);
  }
}
@media (min-width: 1024px) {
  .fs-p-146 .fs-philtrum-flow__proc { grid-template-columns: minmax(0, 1fr); grid-template-areas: "name" "steps"; }
  .fs-p-146 .fs-philtrum-flow__steps--c5 {
    grid-template-columns:
      minmax(0, 250px) auto minmax(0, 250px) auto minmax(0, 250px) auto minmax(0, 250px) auto minmax(0, 250px);
    justify-content: center;
  }
  .fs-p-146 .fs-philtrum-flow__steps--c5 .fs-philtrum-flow__arrow { align-self: start; margin-block-start: calc(250px * 10 / 9 / 2 - 18px); }
  /* 단계 줄과 「확대」 카드 사이 — 화살표 대신 세로 점선(같은 흐름이 아니라 «4단계 결과를 크게» 라는 뜻) */
  .fs-p-146 .fs-philtrum-flow__sep {
    display: block; align-self: start; width: 0;
    height: calc(min(250px, (100vw - 120px) / 6) * 10 / 9);
    margin-inline: clamp(6px, 3.2px + 0.385vw, 12px);
    border-inline-start: 1px dashed var(--fs-line-input);
  }
  .fs-p-146 .fs-philtrum-flow__steps--3 {
    grid-template-columns: minmax(0, 438px) auto minmax(0, 438px) auto minmax(0, 438px);
    justify-content: center;
  }
  .fs-p-146 .fs-philtrum-flow__steps--2 .fs-philtrum-flow__fig { width: auto; }
}

/* --- P5. #target(슬 7) — 사진 삭제 · 머리를 위 가운데에 한 줄 · 목록을 가운데 한 열(「중앙배치」).
   목록 폭 = 가장 긴 줄(CHECK 01 한 줄) — fit-content. 146.css D 절의 order 반전(목록 1 · 머리 2)은 한 열에서 머리를 아래로 보내므로 되돌린다.
   CHECK 01 만 한 줄(승인자 「1번만 우선 한줄」) — ≥1024 에서만 nowrap, 좁은 폭은 자연 줄바꿈. --- */
.fs-p-146 .fs-philtrum-target { display: grid; gap: var(--fs-gap-title); }
.fs-p-146 .fs-philtrum-target__head { justify-items: center; text-align: center; }
@media (min-width: 1024px) {
  .fs-p-146 .fs-philtrum-target__head { order: 0; }
  .fs-p-146 .fs-philtrum-target__list { order: 1; width: fit-content; max-width: 100%; justify-self: center; }
  .fs-p-146 .fs-philtrum-target__text--one { white-space: nowrap; }
}

/* --- P6. #ratio 10-16 승인자 「레이아웃이 조금 더 얼굴 중심, 내용이 눈에 더 잘 들어왔으면」 → 같은 날 시안 비교 뒤 「선은 A · 숫자는 사진 안 · 가운데로」.
   사진: 모바일판 원본(1.6배 해상도)에서 이마~턱만 4:5 로 다시 자르고 구운 점선·괄호·숫자를 지웠다(ratio_build.py).
   계측선(.fs-philtrum-ratio__gauge): 흰 점선에 진한 테두리 — 구운 흰 점선은 피부 위 대비 1.3~2.1:1 이라 얼굴 위에서 사라졌다.
   괄호·숫자는 사진 안 오른쪽(머리카락 위) — 사진 밖 거터에 두면 큰 「1」이 옆 문단 첫 줄 높이에 놓여 문단 번호처럼 읽혔다(1024 에서 5px 차).
   2 구간 가운데 줄 + 작은 「1 · 1」 = 2 가 1 의 두 배라는 걸 그림으로. 줄 % 는 work/ratio-geom.json lines_pct(4번만 3·5번 가운데).
   배치(≥1024): 사진 ≤580px · 글 내용 폭(인라인 --fs-split) 묶음을 가운데로 — 전엔 묶음이 화면 가운데보다 127~173px 왼쪽, 오른쪽이 290~380px 비었다.
   사이는 1024 40px → 1920 100px. 글: 두 문단 리드(21px)→강조본문 크기(--fs-t-quote 25px) · 글 덩어리 fit-content(구분선이 830px 끝까지 뻗던 것).
   모바일 글씨·줄바꿈은 146 모바일 패스 전이라 손대지 않는다(사진이 거터 없이 전폭이 되는 것만 바뀐다). --- */
.fs-p-146 .fs-philtrum-ratio__fig { padding-inline-end: 0; }
.fs-p-146 .fs-philtrum-ratio__gauge {
  --fs-gauge-bar: clamp(30px, 25.92px + 1.046vw, 46px);   /* 괄호 세로선에서 사진 오른변까지 = 큰 숫자 자리 */
  --fs-gauge-halo: drop-shadow(0 0 1px rgba(45, 32, 26, .95)) drop-shadow(0 1px 2px rgba(45, 32, 26, .4));
  position: absolute; inset: 0; pointer-events: none;
}
.fs-p-146 .fs-philtrum-ratio__line {
  position: absolute; inset-inline: 0 var(--fs-gauge-bar); height: 2px; transform: translateY(-50%);
  background: repeating-linear-gradient(90deg, #fff 0 8px, transparent 8px 14px);
  filter: var(--fs-gauge-halo);
}
.fs-p-146 .fs-philtrum-ratio__line--1 { inset-block-start: 64.74%; }
.fs-p-146 .fs-philtrum-ratio__line--2 { inset-block-start: 70.34%; }
.fs-p-146 .fs-philtrum-ratio__line--3 { inset-block-start: 81.72%; }
.fs-p-146 .fs-philtrum-ratio__line--4 { inset-block-start: 87.24%; }   /* 3·5번 가운데(원본 87.33) — 「1 · 1」 같은 길이 */
.fs-p-146 .fs-philtrum-ratio__line--5 { inset-block-start: 92.76%; }
.fs-p-146 .fs-philtrum-ratio__bar {
  position: absolute; inset-inline-end: var(--fs-gauge-bar); width: 2px; transform: translateY(-1px);
  background: #fff; filter: var(--fs-gauge-halo);
}
.fs-p-146 .fs-philtrum-ratio__bar--one { inset-block-start: 64.74%; height: calc(5.6% + 2px); }
.fs-p-146 .fs-philtrum-ratio__bar--two { inset-block-start: 81.72%; height: calc(11.04% + 2px); }
.fs-p-146 .fs-philtrum-ratio__big,
.fs-p-146 .fs-philtrum-ratio__half {
  position: absolute; transform: translateY(-50%);
  font-family: var(--fs-font-en); font-weight: 700; line-height: 1; color: #fff;
  text-shadow: 0 0 2px rgba(45, 32, 26, .95), 0 1px 3px rgba(45, 32, 26, .5);
}
.fs-p-146 .fs-philtrum-ratio__big {
  inset-inline-end: 0; width: var(--fs-gauge-bar); text-align: center;
  font-size: clamp(19px, 15.18px + 0.98vw, 34px);
}
.fs-p-146 .fs-philtrum-ratio__big--one { inset-block-start: 67.54%; }
.fs-p-146 .fs-philtrum-ratio__big--two { inset-block-start: 87.24%; }
/* 작은 「1 · 1」 13→17px 은 몬세라트 「1」 글자 폭이 7px 라 1920 에서 거의 안 보였다(10-16 점검 「시각 보정 4」) → 15→21px */
.fs-p-146 .fs-philtrum-ratio__half { inset-inline-end: calc(var(--fs-gauge-bar) + 8px); font-size: clamp(15px, 13.47px + 0.392vw, 21px); }
.fs-p-146 .fs-philtrum-ratio__half--a { inset-block-start: 84.48%; }
.fs-p-146 .fs-philtrum-ratio__half--b { inset-block-start: 90%; }
@media (min-width: 1024px) {
  .fs-p-146 #ratio .fs-split { justify-content: center; column-gap: clamp(40px, -28.57px + 6.696vw, 100px); }
  .fs-p-146 .fs-philtrum-ratio__body { width: fit-content; max-width: 100%; }
  .fs-p-146 .fs-philtrum-ratio__body .fs-lead { font-size: var(--fs-t-quote); line-height: 1.6; }
}

/* --- P7. 10-16 승인자 점검 「시각 보정 3」 — 모바일 #intro 문장 경계 · CHECK 01 외톨이 줄. MOBILE_RULES 규칙대로 PC(≥1024) 픽셀 무변화.
   #intro: 블록(PPT 줄)이 <1024 에서 두세 줄로 접히면 접힌 줄 사이도 1.85 라 문장 사이(1.85)와 구분이 안 됐다 →
   <1024 에서 행간 1.6 + 블록 사이 .5em(접히지 않은 블록 간격 2.1em · 두 줄 블록 높이 3.7em = 전과 같은 높이).
   나뉜 문장 두 쌍은 한 블록으로 합쳤다(restructure.py, 옛 경계는 <br class="fs-pc-only">). 접히는 블록은 balance(전 폭 — PC 는 한 줄이라 무변화).
   CHECK 01 은 <br> 없는 한 문장이라 390 에서 「보이는 경우」(69px)만 둘째 줄로 떨어졌다 → balance(≥1024 는 P5 의 nowrap 한 줄 그대로). --- */
.fs-p-146 .fs-philtrum-intro__line { text-wrap: balance; }
.fs-p-146 .fs-philtrum-target__text--one { text-wrap: balance; }
@media (max-width: 1023px) {
  .fs-p-146 .fs-philtrum-intro__text { line-height: 1.6; }
  .fs-p-146 .fs-philtrum-intro__line + .fs-philtrum-intro__line { margin-block-start: .5em; }
}

/* --- P8. #intro 강조 표시(10-16) — 승인자 「여기에 밑줄, 동그라미, 하이라이터 같은 요소들 좀 강조할 부분에 해줘」.
   사이트 선례 143(10-07) 판을 페이지 클래스만 바꿔 옮겼다(48 「진짜 핵심만」 → 섹션당 2곳이 승인 밀도 — 8줄 한 섹션에 종류별 1곳씩 3곳).
   형광 「전체적인 인상을 좌우」(요지) · 손밑줄 「얼굴의 비율과 입체감」(접근) · ◯ 「조화」(결론).
   색: 선·원 --fs-teal-text(#80665D) · 형광 --fs-teal-neon(#E6B8A8) 60%. 글이 리빌(.is-in)될 때 .4s → .9s → 1.4s 차례로 그어진다.
   은닉은 .fs-reveal:not(.is-in) 에만(첫 화면·헤드리스는 그어진 채) · reduced-motion 은 처음부터 그어진 상태. --- */
.fs-p-146 .fs-philtrum-em--hl {
  background: linear-gradient(transparent 56%, rgba(230, 184, 168, .6) 56% 94%, transparent 94%) 0 0 / 100% 100% no-repeat;
}
.fs-p-146 .fs-philtrum-em--line {
  padding-block-end: .2em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 14' preserveAspectRatio='none'%3E%3Cpath d='M3 9 C 60 4, 120 12, 200 8 S 330 5, 397 8' fill='none' stroke='%2380665D' stroke-width='2.4' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") 0 100% / 100% .36em no-repeat;
}
/* 좌우 여백은 원이 넘는 .45em + .1em 틈 — 143 의 .45em 그대로면 390 에서 원 오른선이 다음 글자 「입」에 닿는다 */
.fs-p-146 .fs-philtrum-em--circle { position: relative; display: inline-block; margin-inline: .55em; }
.fs-p-146 .fs-philtrum-em--circle::after {
  content: ""; position: absolute; inset: auto -.45em; top: 50%; height: 1.3em; translate: 0 -50%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 80' preserveAspectRatio='none'%3E%3Cpath d='M34 9 C 90 2, 160 4, 186 18 C 199 26, 199 52, 184 63 C 160 78, 60 79, 24 68 C 4 61, 1 34, 14 22 C 22 14, 40 8, 70 6' fill='none' stroke='%2380665D' stroke-width='2.4' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  clip-path: inset(0 0 0 0);
  pointer-events: none;
}
/* 전환은 리빌(.is-in) 때만 — 기본에 두면 fs.js 가 로드 직후 .fs-reveal 을 붙일 때 그어진 선이 거꾸로 지워지는 전환이 돈다(143 함정) */
.fs-p-146 .fs-philtrum-intro__inner.is-in .fs-philtrum-em--hl,
.fs-p-146 .fs-philtrum-intro__inner.is-in .fs-philtrum-em--line { transition: background-size .9s var(--fs-ease-out) var(--em-d, .4s); }
.fs-p-146 .fs-philtrum-intro__inner.is-in .fs-philtrum-em--circle::after { transition: clip-path .8s var(--fs-ease-out) var(--em-d, .4s); }
.fs-p-146 .fs-philtrum-em--line { --em-d: .9s; }
.fs-p-146 .fs-philtrum-em--circle { --em-d: 1.4s; }
:root.fs-js .fs-p-146 .fs-philtrum-intro__inner.fs-reveal:not(.is-in) .fs-philtrum-em--hl { background-size: 0% 100%; }
:root.fs-js .fs-p-146 .fs-philtrum-intro__inner.fs-reveal:not(.is-in) .fs-philtrum-em--line { background-size: 0% .36em; }
:root.fs-js .fs-p-146 .fs-philtrum-intro__inner.fs-reveal:not(.is-in) .fs-philtrum-em--circle::after { clip-path: inset(0 100% 0 0); }
@media (prefers-reduced-motion: reduce) {
  .fs-p-146 .fs-philtrum-em--hl { transition: none !important; background-size: 100% 100% !important; }
  .fs-p-146 .fs-philtrum-em--line { transition: none !important; background-size: 100% .36em !important; }
  .fs-p-146 .fs-philtrum-em--circle::after { transition: none !important; clip-path: none !important; }
}

/* ==========================================================================
   ▼▼▼ P9. 2026-10-16 · 모바일 최적화(승인자 「모바일 최적화 진행」 — 146 정식 패스) — 줄바꿈은 전 폭, 배치는 599px/1023px 이하만.
   PC 요소 위치 무변화(1024·1440·1920 실측). 백업 _src/build/backup-146-1016-mo · 실측 _design/momeasure.py 360/390/540/768.
   앞서 public-html-14 가 #intro · CHECK 01 줄바꿈(P7 · restructure 8)을 끝냈다 — 이 블록은 그 «놔둔 것» 몫.
   고아 줄(전): #flow 캡션 「…당겨 / 올림」(768). #flow 는 <600 에서 도해 8장이 폭 가득 1열이라 360 3,734px · 540 5,334px.
   승인자 미결정 3건(#flow 크림 페이드 → #target 경계 · 단계 화살표 검정 · #flow 머리 왼쪽 정렬)은 손대지 않는다.
   ========================================================================== */
/* 문장 블록 유틸(§1-4) — 미디어쿼리 밖. #flow 캡션의 <br> 두 구를 블록으로(restructure 10) */
.fs-p-146 .fs-lead__s { display: block; text-wrap: balance; }
/* #intro 킥커 — 320 에서만 「FOUR SEASONS PLASTIC / SURGERY」 한 낱말 외톨이(≥360 은 한 줄이라 무변화) */
.fs-p-146 .fs-philtrum-intro__inner .fs-kicker { text-wrap: balance; }

/* 스택형 히어로(§1-8, 81 규격) — 승인자 「사진을 첫 화면에」: 카피 밴드 위 40 → 20 · 아래 56 → 30, 사진 윗단 페이드 96 → 60 */
@media (max-width: 1023px) {
  .fs-p-146 .fs-philtrum-hero .fs-hero__inner { padding-block: calc(var(--fs-header-h) + var(--fs-sp-5)) var(--fs-sp-7); }
  .fs-p-146 .fs-philtrum-hero .fs-hero__bg img {
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 60px);
            mask-image: linear-gradient(180deg, transparent 0, #000 60px);
  }
}

/* #flow <600 — §2 B «도해 좌 · 캡션 우» 행(141 수술과정 · 64 STEP 과 같은 꼴). 단계 순서는 위→아래 그대로, 화살표 ▼ 는 색·모양 그대로
   도해 열 가운데로만 옮긴다(가로 폭 % 는 steps 상자 기준 — 도해 열과 같은 기준이라 가운데가 맞는다). 확대 카드는 결과라 한 단 띄운다. */
@media (max-width: 599px) {
  .fs-p-146 .fs-philtrum-flow__fig {
    display: grid; grid-template-columns: min(44%, 220px) minmax(0, 1fr);
    column-gap: var(--fs-sp-5); align-items: center;
  }
  .fs-p-146 .fs-philtrum-flow__cap { margin-block-start: 0; text-align: start; }
  .fs-p-146 .fs-philtrum-flow__arrow {
    justify-self: start;
    margin-inline-start: calc(min(44%, 220px) / 2 - clamp(28px, 26.2px + 0.513vw, 36px) / 2);
  }
  .fs-p-146 .fs-philtrum-flow__fig--zoom { margin-block-start: var(--fs-sp-4); }
}

/* --- P10. #target 10-20 승인자 「이부분 양쪽 여백이 너무 많이 남아서 한줄로」 — CHECK 02~04 도 01 처럼 PC 한 줄.
   문장 가운데 <br> 은 fs-mo-only(restructure 11절)라 ≥1024 에서 사라진다 — nowrap 으로 한 줄을 지킨다. 목록 폭은 P5 의 fit-content(가장 긴 줄).
   <1024 는 옛 줄바꿈 그대로(MOBILE_RULES 10-16 146 정식 패스 결과 무변화). --- */
@media (min-width: 1024px) {
  .fs-p-146 .fs-philtrum-target__text { white-space: nowrap; }
}
/* 다국어(_route.php) — 한 줄 고정은 한국어만. 번역문은 2~3배 길어(mn CHECK 04 ≈150자) nowrap 이면 칸을 뚫는다(01 은 en·ru 1024 에서 이미 뚫었다).
   띄어쓰기 언어는 라우터가 문장 가운데 <br> 을 숨겨 왔는데(i18n-br) 속성 붙은 <br> 은 거기서 빠진다 — 같은 결과를 여기서 낸다.
   새 키(「… <x1/>…」, 앞 공백)는 10개 팩에 옛 번역을 옮겨 넣었다(띄어쓰기 언어는 <x1/> 앞 공백). */
:root:not(:lang(ko)) .fs-p-146 .fs-philtrum-target__text { white-space: normal; }
:root:not(:lang(ko)):not(:lang(ja)):not(:lang(zh)) .fs-p-146 .fs-philtrum-target__text br { display: none; }