/* ==========================================================================
   64 · 내시경이마거상술 — 페이지 전용 CSS
   모든 셀렉터는 .fs-p-64 스코프. 색은 --fs-* 토큰만 사용한다(새 hex 0개).
   전용 컴포넌트: .fs-efl-spec / .fs-efl-triad / .fs-efl-step / .fs-efl-zone
   ========================================================================== */

/* --- 셸 · 1. 1mm 계열 «투명 헤더 + 모델 히어로» 첫 화면 -------------------
   헤더를 흰 막대로 세우지 않고 히어로 사진 위에 얹는다. 히어로 상단은 전 폭이
   연한 세이지(#A4B29E)라 흰 글자(1.7:1)가 아니라 «잉크 글자»(8.5:1)를 쓴다.
   모델 머리는 사진 높이의 24% 아래에서 시작하므로 헤더 띠(최대 16%)에 안 걸린다.
   ------------------------------------------------------------------------- */
.fs-p-64 {
  --fs-header-overlay-bg: transparent;
}
/* 오버레이 헤더 뒤에 실제로 깔리는 색. 사진이 그 위를 덮으므로 화면은 그대로지만
   사진 로딩 전 번쩍임이 없고, qa.py 가 배경을 흰 body 로 오판하지 않는다. */
.fs-p-64 .fs-page--overlay { background: #A4B29E; }
.fs-p-64 .fs-header--overlay { color: var(--fs-ink); }
/* 2026-09-11 승인자 지시 「56 처럼 메뉴바 그라디에이션」 — fs.css:468 기본 ::before(검정 스크림)를
   content:none 으로 껐던 것을 되살리고 배경만 밝은 안개로 바꾼다. 56 은 크림(246,241,236)인데
   이 계열 19장은 히어로 틴트가 제각각(세이지·라벤더·블루그레이…)이라 크림을 얹으면 색이 물든다 —
   흰색 알파는 어느 틴트 위에서도 «빛 번짐» 으로 읽힌다(47·64·67·48 비교 렌더로 확인).
   위치·높이(헤더 1.6배)·pointer-events 는 fs.css 기본값 그대로다. */
.fs-p-64 .fs-header--overlay::before { background: linear-gradient(180deg, rgba(255,255,255,.72) 0%, rgba(255,255,255,.38) 55%, rgba(255,255,255,0) 100%); }
.fs-p-64 .fs-gnb__link { font-weight: 400; }
/* fs.css 의 오버레이 규칙은 «흰 글자» 전제라 호버가 흰색이다 — 밝은 헤더에선 반대로 */
.fs-p-64 .fs-header--overlay .fs-gnb__link:hover,
.fs-p-64 .fs-header--overlay .fs-gnb__link:focus-visible { color: var(--fs-teal-dk); opacity: 1; }
.fs-p-64 .fs-header--overlay .fs-util__link { color: var(--fs-ink-soft); }
.fs-p-64 .fs-header--overlay .fs-util__link:hover { color: var(--fs-teal-dk); opacity: 1; }
.fs-p-64 .fs-util__sep { opacity: .35; }

.fs-p-64 .fs-efl-hero { background: #A4B29E; }
.fs-p-64 .fs-efl-hero .fs-hero__bg picture { display: block; width: 100%; height: 100%; }
/* 사진을 2.27:1 로 잘라 구웠다 — 모델 머리 24% · 어깨선 81.7% 라 어느 폭에서도
   헤더 띠(최대 16%)에 안 걸리면서 어깨선까지 다 들어온다.
   1440 이하에서는 세로가 통째로 보이므로 object-position 으로는 모델을 못 올린다
   (파일에서 올려야 한다). 그래서 세로 크롭은 «위 고정». */
/* 2026-09-11 승인자 지시 「히어로 속 모델 위치를 56 처럼」 — 56 은 머리 꼭대기가 히어로 위에서 41px(1838 창).
   이 사진은 크라운이 원본 y=204 라 0% 로는 아래 에 떠 있었다. 통일 높이 601 · cover 배율 1838/1920 로 역산한 값.
   모바일(<1024) 스택 배치의 object-position 은 별개라 그대로 둔다. */
.fs-p-64 .fs-efl-hero .fs-hero__bg img { object-position: 50% 73%; }
.fs-p-64 .fs-efl-hero .fs-hero__kicker { color: var(--fs-ink-soft); }
.fs-p-64 .fs-efl-hero .fs-hero__title  { color: var(--fs-ink); }
.fs-p-64 .fs-efl-hero .fs-hero__copy   { max-width: min(100%, 34rem); }

/* <1024px — 히어로 박스가 가로로 길어져 오버레이로는 카피와 모델이 겹친다.
   카피를 세이지 밴드로 위에 쌓고 세로 크롭 사진을 아래에 붙인다. 사진 윗단은
   페이드로 녹여 이음매를 없앤다. */
@media (max-width: 1023px) {
  .fs-p-64 .fs-efl-hero { min-height: 0; background: #B3C4AF; }
  .fs-p-64 .fs-efl-hero .fs-hero__bg {
    position: static; inset: auto; z-index: 0; grid-row: 2;
  }
  .fs-p-64 .fs-efl-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-64 .fs-efl-hero .fs-hero__inner {
    grid-row: 1; background: #B3C4AF;
    padding-block: calc(var(--fs-header-h) + var(--fs-sp-9)) var(--fs-sp-11);
  }
  .fs-p-64 .fs-efl-hero .fs-hero__copy { max-width: 100%; }
}

/* --- 섹션 리듬 — 상하 패딩을 한 단계 조인다(57 의 섹션별 실측 패딩과 같은 결) ----- */
.fs-p-64 main > .fs-section:not(.fs-nose-contact) {
  padding-block: clamp(43px, 31.0px + 3.333vw, 95px) clamp(42px, 30.7px + 3.141vw, 91px);
}

/* --- 2. 수술정보 5뱃지 (2026-08-28) --------------------------------------
   히어로 위로 음수 마진만큼 걸쳐 올라가 «헤더에 붙은 스트립» 으로 읽혔다.
   겹침을 걷고 제목·리드 다음에 놓아 본문 안으로 들여보낸다. */
.fs-p-64 .fs-efl-spec {
  --fs-efl-spec-gap: var(--fs-gap-card);
  position: relative; z-index: 2;
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: var(--fs-efl-spec-gap);
  margin-block-start: var(--fs-gap-title);
}
.fs-p-64 .fs-efl-spec__item { flex: 0 0 calc((100% - var(--fs-efl-spec-gap)) / 2); }
.fs-p-64 .fs-efl-spec__card {
  display: grid; align-content: start; height: 100%;
  background: var(--fs-white); border: 1px solid var(--fs-line);
  padding-block-start: clamp(16px, 12.5px + 0.96vw, 31px);
}
.fs-p-64 .fs-efl-spec__ic {
  display: grid; place-items: center; margin-inline: auto;
  width: clamp(76px, 67.7px + 2.31vw, 112px);
  margin-block-end: clamp(12px, 8.5px + 0.96vw, 27px);
}
.fs-p-64 .fs-efl-spec__ic img { width: 100%; height: auto; }
.fs-p-64 .fs-efl-spec__val {
  padding: clamp(10px, 8.6px + 0.38vw, 16px) var(--fs-sp-3) clamp(14px, 11.2px + 0.77vw, 26px);
  text-align: center; font-size: var(--fs-t-lead); font-weight: 600; color: var(--fs-ink);
}
.fs-p-64 .fs-efl-spec__head { justify-items: center; }
.fs-p-64 .fs-efl-spec__head .fs-nose-lead { max-width: 62em; }
.fs-p-64 .fs-efl-spec__note { margin-block-start: clamp(14px, 11.2px + 0.77vw, 26px); color: var(--fs-muted); }
@media (min-width: 600px) {
  .fs-p-64 .fs-efl-spec__item { flex-basis: calc((100% - 2 * var(--fs-efl-spec-gap)) / 3); }
}
@media (min-width: 1024px) {
  .fs-p-64 .fs-efl-spec__item { flex-basis: calc((100% - 4 * var(--fs-efl-spec-gap)) / 5); }
}

/* --- 3. 왜 '눈썹' 인가 — 좌 인물 / 우 카피 + 3분할 교정 배지 ------------- */
.fs-p-64 .fs-efl-brow { --fs-split-align: center; }
.fs-p-64 .fs-efl-brow__fig img { display: block; width: 100%; height: auto; }
.fs-p-64 .fs-efl-brow__copy { display: grid; justify-items: start; }
.fs-p-64 .fs-efl-brow__copy .fs-h2 { margin-block-start: clamp(10px, 8.1px + 0.51vw, 18px); }
.fs-p-64 .fs-efl-brow__copy .fs-lead { margin-block-start: clamp(18px, 14.5px + 0.96vw, 33px); }
.fs-p-64 .fs-efl-brow__copy .fs-body { margin-block-start: clamp(14px, 11.2px + 0.77vw, 26px); color: var(--fs-muted); }
.fs-p-64 .fs-efl-triad {
  --fs-efl-triad-gap: clamp(20px, 15.4px + 1.28vw, 40px);
  display: flex; flex-wrap: wrap; align-items: center;
  gap: var(--fs-efl-triad-gap);
  margin-block-start: clamp(26px, 20.5px + 1.54vw, 50px);
}
.fs-p-64 .fs-efl-triad__item {
  position: relative;
  display: grid; justify-items: center; align-content: center; gap: 4px;
  width: clamp(88px, 74px + 3.9vw, 152px); aspect-ratio: 1;
  border-radius: var(--fs-radius-round);
  background: var(--fs-teal-text); color: var(--fs-on-dark); text-align: center;
}
.fs-p-64 .fs-efl-triad__num {
  font-size: var(--fs-t-pill); font-weight: 700; letter-spacing: 0.06em;
  padding-block-end: 3px; border-block-end: 1px solid var(--fs-on-dark);
}
.fs-p-64 .fs-efl-triad__label { font-size: var(--fs-t-body); font-weight: 600; }
.fs-p-64 .fs-efl-triad__item:not(:first-child)::before {
  content: "+"; position: absolute;
  inset-block-start: 50%; inset-inline-start: calc(-1 * var(--fs-efl-triad-gap) / 2);
  transform: translate(-50%, -50%);
  font-size: var(--fs-t-h3); font-weight: 700; color: var(--fs-teal-dk);
}

/* --- 4. 원리 — 좌 근육 도해 / 우 카피 + 확대 도해 ----------------------- */
.fs-p-64 .fs-efl-principle { display: grid; row-gap: clamp(28px, 23.4px + 1.28vw, 48px); }
.fs-p-64 .fs-efl-principle__face { display: grid; align-content: start; }
.fs-p-64 .fs-efl-principle__face img { display: block; width: 100%; height: auto; }
.fs-p-64 .fs-efl-principle__copy { display: grid; justify-items: start; align-content: start; }
.fs-p-64 .fs-efl-principle__copy .fs-nose-lead { margin-block-start: clamp(14px, 11.2px + 0.77vw, 26px); }
.fs-p-64 .fs-efl-principle__copy .fs-body { margin-block-start: clamp(14px, 11.2px + 0.77vw, 26px); color: var(--fs-muted); }
.fs-p-64 .fs-efl-principle__zoom {
  display: grid; width: 100%; max-width: 340px;
  margin-block-start: clamp(24px, 19.4px + 1.28vw, 44px);
}
.fs-p-64 .fs-efl-principle__zoom img { display: block; width: 100%; height: auto; }
.fs-p-64 .fs-efl-muscle {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fs-gap-card);
  margin-block-start: clamp(30px, 24.0px + 1.67vw, 56px);
}
.fs-p-64 .fs-efl-muscle__item {
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center;
  gap: clamp(14px, 11.2px + 0.77vw, 26px);
  background: var(--fs-cream-2); padding: clamp(14px, 11.2px + 0.77vw, 26px);
}
.fs-p-64 .fs-efl-muscle__fig { display: grid; width: clamp(96px, 85.6px + 2.89vw, 141px); }
.fs-p-64 .fs-efl-muscle__fig img { display: block; width: 100%; height: auto; }
.fs-p-64 .fs-efl-muscle__item .fs-body { color: var(--fs-ink-soft); }
@media (min-width: 600px) {
  .fs-p-64 .fs-efl-muscle { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .fs-p-64 .fs-efl-principle {
    grid-template-columns: minmax(0, 520fr) minmax(0, 860fr);
    column-gap: clamp(30px, 21.2px + 2.44vw, 68px); align-items: start;
  }
}

/* --- 5. 효과 3분할 (A11 확장) ------------------------------------------ */
.fs-p-64 main > .fs-efl-effect {
  background: var(--fs-cream);
  padding-block: clamp(43px, 31.0px + 3.333vw, 95px) clamp(42px, 30.7px + 3.141vw, 91px);
}
.fs-p-64 .fs-efl-effect__card {
  grid-template-rows: auto auto; align-content: start;
  row-gap: clamp(12px, 9.7px + 0.64vw, 22px);
}
.fs-p-64 .fs-efl-effect__fig { height: auto; grid-template-rows: auto auto; padding-block-start: 0; }
.fs-p-64 .fs-efl-effect__ill {
  width: clamp(150px, 111.5px + 10.7vw, 316px);
  margin-block-end: clamp(14px, 10.5px + 0.96vw, 29px);
}
.fs-p-64 .fs-efl-effect__cap { text-align: center; color: var(--fs-ink-soft); }
.fs-p-64 .fs-efl-effect__model { display: none; margin-block-start: clamp(20px, 15.4px + 1.28vw, 40px); }
.fs-p-64 .fs-efl-effect__model img { display: block; width: 100%; height: auto; }
@media (min-width: 1024px) { .fs-p-64 .fs-efl-effect__model { display: block; } }
.fs-p-64 .fs-efl-effect .fs-nose-dz__fig .fs-labelbar { min-height: clamp(34px, 30.5px + 0.96vw, 49px); }
@media (max-width: 599px) {
  .fs-p-64 .fs-efl-effect .fs-nose-dz__cards { grid-template-columns: minmax(0, 1fr); }
}

/* --- 6. 수술방법 4스텝 ------------------------------------------------- */
.fs-p-64 .fs-efl-step {
  display: grid; grid-template-columns: minmax(0, 1fr);
  gap: clamp(24px, 20.5px + 0.96vw, 39px);
  margin-block-start: clamp(34px, 27.5px + 1.79vw, 62px);
}
.fs-p-64 .fs-efl-step__item {
  position: relative; display: grid; grid-template-rows: auto minmax(0, 1fr);
  row-gap: clamp(12px, 9.7px + 0.64vw, 22px);
}
.fs-p-64 .fs-efl-step__fig { display: grid; }
.fs-p-64 .fs-efl-step__fig img { display: block; width: 100%; height: auto; }
.fs-p-64 .fs-efl-step__cap { text-align: center; color: var(--fs-ink-soft); padding-inline: var(--fs-sp-1); }
@media (min-width: 600px) {
  .fs-p-64 .fs-efl-step { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .fs-p-64 .fs-efl-step { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(18px, 13.4px + 1.28vw, 38px); }
  .fs-p-64 .fs-efl-step__item + .fs-efl-step__item::before {
    content: ""; position: absolute; z-index: 1;
    inset-block-start: 30%; inset-inline-start: calc(-1 * clamp(9px, 6.7px + 0.64vw, 19px));
    width: 11px; height: 11px;
    border-block-start: 2px solid var(--fs-teal); border-inline-end: 2px solid var(--fs-teal);
    transform: translate(-50%, -50%) rotate(45deg);
  }
}

/* --- 7. 다크 밴드 — FULL HD 내시경 ------------------------------------- */
.fs-p-64 .fs-efl-endo .fs-section__bg { opacity: .16; }
.fs-p-64 .fs-efl-endo__top { display: grid; row-gap: clamp(24px, 19.4px + 1.28vw, 44px); align-items: center; }
.fs-p-64 .fs-efl-endo__device { display: grid; justify-items: center; }
.fs-p-64 .fs-efl-endo__device img { display: block; width: 100%; max-width: 460px; height: auto; }
.fs-p-64 .fs-efl-endo__lead { margin-block-start: clamp(16px, 12.5px + 0.96vw, 31px); display: grid; gap: var(--fs-gap-col); }
.fs-p-64 .fs-efl-endo__head { display: none; }
.fs-p-64 .fs-efl-endo__head img { display: block; width: 100%; height: auto; }
@media (min-width: 1024px) {
  .fs-p-64 .fs-efl-endo__lead { grid-template-columns: minmax(0, 1fr) clamp(150px, 106px + 3.06vw, 210px); align-items: center; }
  .fs-p-64 .fs-efl-endo__head { display: block; }
}
.fs-p-64 .fs-efl-endo__cards {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fs-gap-card);
  margin-block-start: clamp(32px, 24.6px + 2.05vw, 64px);
}
.fs-p-64 .fs-efl-endo__card {
  display: grid; justify-items: start; align-content: start; gap: var(--fs-sp-3);
  background: var(--fs-white); color: var(--fs-ink);
  padding: clamp(20px, 16.5px + 0.96vw, 35px);
}
.fs-p-64 .fs-efl-endo__ic { display: grid; place-items: center; width: clamp(42px, 38.5px + 0.96vw, 57px); aspect-ratio: 1; }
.fs-p-64 .fs-efl-endo__ic img { width: 100%; height: auto; }
.fs-p-64 .fs-efl-endo__title { color: var(--fs-teal-dk); }
.fs-p-64 .fs-efl-endo__card .fs-body { color: var(--fs-ink-soft); }
@media (min-width: 600px) {
  .fs-p-64 .fs-efl-endo__cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .fs-p-64 .fs-efl-endo__top {
    grid-template-columns: minmax(0, 480fr) minmax(0, 900fr);
    column-gap: clamp(30px, 21.2px + 2.44vw, 68px);
  }
}

/* --- 8. 핵심 포인트 · 시그니처 박리 난이도 존 맵 ------------------------ */
.fs-p-64 .fs-efl-zone {
  display: grid; row-gap: clamp(28px, 23.4px + 1.28vw, 48px);
  margin-block-start: clamp(32px, 25.5px + 1.79vw, 60px);
}
.fs-p-64 .fs-efl-zone__copy { display: grid; justify-items: start; gap: clamp(12px, 9.7px + 0.64vw, 22px); }
.fs-p-64 .fs-efl-zone__copy .fs-body { color: var(--fs-muted); }
.fs-p-64 .fs-efl-zone__title { margin-block-start: var(--fs-sp-1); }
.fs-p-64 .fs-efl-zone__maps { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fs-gap-card); }
.fs-p-64 .fs-efl-zone__figure { display: grid; }
.fs-p-64 .fs-efl-zone__stack { position: relative; display: block; }
.fs-p-64 .fs-efl-zone__stack img { display: block; width: 100%; height: auto; }
.fs-p-64 .fs-efl-zone__svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.fs-p-64 .fs-efl-zone__easy { fill: var(--fs-teal); fill-opacity: .44; }
.fs-p-64 .fs-efl-zone__hard { fill: var(--fs-teal-dk); fill-opacity: .5; }
.fs-p-64 .fs-efl-zone__edge { fill: none; stroke: var(--fs-teal); stroke-width: 4; stroke-linecap: round; }
.fs-p-64 .fs-efl-zone__edge--halo { stroke: var(--fs-white); stroke-width: 9; stroke-opacity: .85; }
.fs-p-64 .fs-efl-zone__tag {
  position: absolute; inset-inline-start: 50%; transform: translateX(-50%);
  white-space: nowrap;
  min-height: clamp(24px, 22.6px + 0.38vw, 30px);
  font-size: clamp(12px, 11.1px + 0.26vw, 16px);
  padding-inline: clamp(9px, 7.6px + 0.38vw, 15px);
}
.fs-p-64 .fs-efl-zone__tag--easy { inset-block-start: 38%; }
.fs-p-64 .fs-efl-zone__tag--hard { inset-block-start: 59%; }
.fs-p-64 .fs-efl-point__list { margin-block-start: clamp(30px, 24.0px + 1.67vw, 56px); }
.fs-p-64 .fs-efl-point { row-gap: clamp(14px, 11.2px + 0.77vw, 26px); }
.fs-p-64 .fs-efl-point__fig { display: grid; }
.fs-p-64 .fs-efl-point__fig img { display: block; width: 100%; height: auto; }
.fs-p-64 .fs-efl-point__body { display: grid; gap: var(--fs-sp-2); }
@media (min-width: 600px) {
  .fs-p-64 .fs-efl-zone__maps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .fs-p-64 .fs-efl-zone {
    grid-template-columns: minmax(0, 500fr) minmax(0, 880fr);
    column-gap: clamp(30px, 21.2px + 2.44vw, 68px); align-items: center;
  }
  .fs-p-64 .fs-efl-point {
    grid-template-columns: auto clamp(180px, 141.7px + 3.74vw, 238px) minmax(0, 1fr);
    align-items: center;
  }
}

/* --- 9. 수술대상 ------------------------------------------------------- */
.fs-p-64 .fs-efl-target { --fs-split-align: start; }
.fs-p-64 .fs-efl-target__list { margin-block-start: clamp(26px, 21.4px + 1.28vw, 46px); }
.fs-p-64 .fs-efl-target__item { align-items: center; background: var(--fs-white); }
.fs-p-64 .fs-efl-target__item .fs-card__title { font-size: var(--fs-t-quote); font-weight: 600; }
.fs-p-64 .fs-efl-target__fig img { display: block; width: 100%; height: auto; }
@media (min-width: 1024px) {
  .fs-p-64 .fs-efl-target__item { grid-template-columns: auto minmax(0, 1fr); column-gap: var(--fs-sp-5); }
  .fs-p-64 .fs-efl-target__fig { margin-block-start: clamp(0px, -30px + 2.08vw, 70px); }
}

/* --- 10. 마지막 섹션 · CTA -------------------------------------------- */
.fs-p-64 .fs-efl-contact__btns { max-width: 620px; }

/* --- 모션 무효화 (레이아웃은 모션 없이도 동일) -------------------------- */
@media (prefers-reduced-motion: reduce) {
  .fs-p-64 .fs-efl-spec__item,
  .fs-p-64 .fs-efl-step__item,
  .fs-p-64 .fs-efl-muscle__item,
  .fs-p-64 .fs-efl-endo__card,
  .fs-p-64 .fs-efl-point,
  .fs-p-64 .fs-efl-zone__maps,
  .fs-p-64 .fs-efl-zone__copy {
    transform: none !important; opacity: 1 !important; transition: none !important;
  }
}

/* --- 태블릿(<1024) 에서 인물·사진이 전폭으로 커지지 않게 상한 ------------ */
@media (max-width: 1023px) {
  .fs-p-64 .fs-efl-brow__fig    { max-width: 440px; margin-inline: auto; }
  .fs-p-64 .fs-efl-target__fig  { max-width: 440px; margin-inline: auto; }
  .fs-p-64 .fs-efl-principle__face { max-width: 520px; margin-inline: auto; }
  .fs-p-64 .fs-efl-point__fig   { max-width: 360px; }
}


/* ==========================================================================
   ▼▼▼ 진단·수정 패스 — 2026-08-28
   기준선: R1 PASS · VIBE LOCK 실패 0 · tiltcheck 16개 정상 · glosscheck 0.
   아래는 검사기가 구조적으로 못 잡는 4건이다(근거는 _design/QA/64.md).
   ========================================================================== */

/* --- A. [A09] 다크 밴드 고스트에 블러가 없다 ---------------------------------
   band-ghost.jpg 의 엣지 에너지 5.84 — 확정 시안 57 의 compare-bg.jpg 는 0.46 으로
   spec-nose[3] 「단색 위에 강하게 블러된 인물 사진」이 에셋에 구워져 있다.
   블러 없이 opacity .16 으로 깔면 질감이 아니라 「패널 뒤에 반쯤 가려진 두번째 얼굴」이
   되어 카피·장비 사진과 겹쳐 읽힌다(1920 렌더에서 코·입·손이 그대로 판독된다).
   에셋은 건드리지 않는다 — 다른 페이지와 해시가 충돌한다. 페이지 CSS 로만 흐린다.
   블러가 가장자리를 투명하게 먹으므로 상자보다 크게 잡되, fs.css:235 의
   img{max-width:100%} 가 폭만 조용히 먹지 않도록 max-width:none 을 반드시 같이 준다. */
.fs-p-64 .fs-efl-endo .fs-section__bg img {
  display: block; max-width: none;
  width: calc(100% + 160px); height: calc(100% + 160px); margin: -80px;
  filter: blur(24px);
}

/* --- B. [V70 D] 인접 섹션의 축이 같다 → 3번 섹션을 반전 -----------------------
   v70fit: D:S3+S4 둘 다 Ll. 실측으로도 3번(왜 '눈썹' 인가)과 4번(원리)이 모두
   「이미지 좌 457/517 · 카피 우 944/855」로 같은 모양이 두 번 반복된다.
   4번을 뒤집으면 5번(효과 = 글 좌 / 도해 카드 우)과 붙어 새 반복이 생기므로
   3번을 뒤집는다 → 사진 우 / 도해 좌 / 카드 우 로 축이 번갈아 놓인다.
   DOM 은 그대로 둔다(모바일에서 인물이 카피보다 먼저 와야 한다 · R1 순서 보존).
   --fs-split 이 인라인 style 이라 var() 로는 못 이긴다 — 열을 직접 뒤집는다. */
@media (min-width: 1024px) {
  .fs-p-64 .fs-efl-brow { grid-template-columns: minmax(0, 930fr) minmax(0, 450fr); }
  .fs-p-64 .fs-efl-brow__copy { order: 1; }
  .fs-p-64 .fs-efl-brow__fig  { order: 2; }
}

/* --- C. 섹션 제목 뒤 70px 틸 선 (delay .5s) — 48 에서 검증된 것 ---------------
   ★ 「.is-in 이면 보이기」로 짜면 안 된다. fs.js 는 첫 화면 안의 대상에는
     .fs-reveal 클래스 자체를 안 붙인다 → 첫 화면 제목의 선이 영원히 안 그어진다.
     기본을 「그어진 상태」로 두고 .fs-reveal:not(.is-in) 에만 초기 은닉을 건다.
   ★ 64 의 제목 컨테이너는 전부 .fs-h2 클래스라 ID 열거가 필요 없다
     (ID 로 열거하면 명시도 (1,1,1) 이 은닉 규칙을 이겨 선이 늘 그어진 채 굳는다). */
.fs-p-64 main .fs-h2 { position: relative; }
.fs-p-64 main .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;
}
/* 가운데정렬 헤드(2·6·8번 섹션)에서는 선도 가운데에서 자라야 한다.
   9번 섹션의 .fs-nose-head 는 justify-items:start 라 여기 해당 없다. */
.fs-p-64 main .fs-center .fs-h2::after { margin-inline: auto; transform-origin: center; }
:root.fs-js .fs-p-64 .fs-reveal:not(.is-in) .fs-h2::after { transform: scaleX(0); }

/* --- D. 호버 — 프레임은 고정, 사진만 scale(1.045). 그림자는 쓰지 않는다 -------
   사진에만 건다. 원형 효과 도해(투명 PNG · 담을 프레임이 없다)와 존 맵
   (SVG 오버레이가 사진과 함께 커지지 않아 하이라이트가 얼굴에서 어긋난다),
   근육·확대 해부도는 제외한다. */
.fs-p-64 .fs-efl-step__fig,
.fs-p-64 .fs-efl-point__fig { overflow: hidden; }
/* 확대된 사진이 라벨바를 덮지 않게 바를 한 층 올린다
   (transform 이 걸린 img 는 위치 없는 형제보다 위에 그려진다) */
.fs-p-64 .fs-efl-step__fig > .fs-labelbar,
.fs-p-64 .fs-efl-point__fig > .fs-labelbar { position: relative; z-index: 1; }
.fs-p-64 .fs-efl-step__fig img,
.fs-p-64 .fs-efl-point__fig img,
.fs-p-64 .fs-efl-brow__fig img,
.fs-p-64 .fs-efl-target__fig img {
  transition: transform var(--fs-dur-slow) var(--fs-ease-out);
}
@media (hover: hover) and (pointer: fine) {
  .fs-p-64 .fs-efl-step__item:hover .fs-efl-step__fig img,
  .fs-p-64 .fs-efl-point:hover .fs-efl-point__fig img,
  .fs-p-64 .fs-efl-brow__fig:hover img,
  .fs-p-64 .fs-efl-target__fig:hover img { transform: scale(1.045); }
}

/* --- E. reduced-motion — C·D 가 더한 전환을 같이 끈다 ------------------------ */
@media (prefers-reduced-motion: reduce) {
  .fs-p-64 main .fs-h2::after { transition: none !important; transform: scaleX(1) !important; }
  .fs-p-64 main .fs-center .fs-h2::after { transform: scaleX(1) !important; }
  .fs-p-64 .fs-efl-step__fig img,
  .fs-p-64 .fs-efl-point__fig img,
  .fs-p-64 .fs-efl-brow__fig img,
  .fs-p-64 .fs-efl-target__fig img { transition: none !important; transform: none !important; }
}

/* ==========================================================================
   ▼▼▼ 2026-09-14 · 카테고리 틴트 2단계 — 포유리프팅 = 허니 베이지 #E8D8C2 (fs.css «카테고리 틴트» 블록 + body.fs-cat-lifting)
   공용 블록이 헤더 뒤 바탕·히어로 바탕·메뉴 안개(연한색 #F8F3ED)·글자 후광을 정한다. 여기서는 사진에 맞춘 «위치» 만.
   사진: i2i «인물·프레이밍 그대로, 배경만 왼쪽 #E8D8C2 → 모델 뒤 연한 크림 #F5EEE4 글로우, wide feathered falloff, no split»
   → hero-model-duo(-mo).jpg (모바일은 데스크톱 결과의 3:4 크롭). 모델 오른쪽(x 61~78%) · 카피 왼쪽 → 왼→오 스크림. 킥커 ink-soft → teal-dk.
   원본이 2.27:1 이라 위 233행을 가장자리색으로 패딩해 16:9 로 발주하고 되잘랐는데, 결과의 모델이 원본보다 7% 크고 89행 위로 올라왔다
   (크라운 204 → 115). object-position 73% → 36% 로 크라운을 다시 헤더 아래 ≈31px 에 둔다. #spec 은 이미 흰색(LOCK 4 OK).
   ========================================================================== */

.fs-p-64 .fs-efl-hero .fs-hero__bg img { object-position: 50% 36%; }
.fs-p-64 .fs-efl-hero .fs-hero__bg::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, rgba(var(--fs-cat), .92) 0%, rgba(var(--fs-cat), .90) 28%, rgba(var(--fs-cat), .50) 46%, rgba(var(--fs-cat), 0) 58%);
}
.fs-p-64 .fs-efl-hero .fs-hero__kicker { color: var(--fs-teal-dk); }
@media (max-width: 1023px) {
  .fs-p-64 .fs-efl-hero .fs-hero__bg::after { content: none; }
  .fs-p-64 .fs-efl-hero .fs-hero__bg img { object-position: 50% 100%; }
  .fs-p-64 .fs-efl-hero .fs-hero__inner { background: var(--fs-cat-hex); }
}


/* ==========================================================================
   ▼▼▼ 2026-09-21 · 승인자 「코성형·포유리프팅·윤곽성형·바디성형 히어로 통일」 — 규정 = 81 코재수술 포맷.
   영문 시술명 킥커 → 한글 제목 → 줄 → 리드(기존 한국어 문구). 값은 81.css 1절:
   킥커 21/500/.02em(틸) · 제목 58/700/1.22 · 요소 간격 10px · 줄 아래 8px · 리드 --fs-t-lead/1.5/#111.
   사진·카피 상자 위치·스크림은 그대로 둔다(33 선례 「모델 위치는 그대로 텍스트 부분만」).
   줄 요소의 폭(48~72)·두께·색은 fs.css:3485 정본 규칙이 정한다 — 여기서는 아래 여백만 준다.
   ========================================================================== */
.fs-p-64 .fs-efl-hero .fs-hero__copy { gap: var(--fs-sp-3); }
.fs-p-64 .fs-efl-hero .fs-hero__kicker {
  font-family: inherit; font-size: clamp(15px, 13.5px + 0.42vw, 21px);
  letter-spacing: 0.02em; font-weight: 500; line-height: 1.25; color: var(--fs-teal-dk);
}
.fs-p-64 .fs-efl-hero .fs-hero__title {
  font-size: clamp(30px, 21.4px + 2.39vw, 58px);
  font-weight: 700; line-height: 1.22; color: var(--fs-ink);
}
.fs-p-64 .fs-efl-hero__rule { margin-block-end: var(--fs-sp-2); }
.fs-p-64 .fs-efl-hero .fs-efl-hero__lead {
  max-width: 34em; font-size: var(--fs-t-lead); font-weight: 400; line-height: 1.5; color: var(--fs-ink);
}

/* ==========================================================================
   ▼▼▼ 2026-10-15 · 병원 PPT 「리뷰티 수정(이마거상술).pptx」 반영 — 계획 _design/PLAN-64-1015-pptx.md
   승인자 「우선 다 추천대로」. 이 블록은 _src/gen/64-pptx/new-block.css 가 원본이다 —
   64.css 를 직접 고치지 말고 거기 고친 뒤 css_build.py → finalize.py.
   페이지 전용 hex 4개(박리 지도 쉬운/어려운 부분) — 필은 51 P12 의 승인 3색 중 골드 · 로즈 클레이 그대로(흰 글자 AA), 지도 칠은 그 두 색의 밝은 단
   (진한 단을 피부 위에 반투명으로 깔면 올리브·갈색으로 탁해져 두 부분이 안 갈렸다 — 시안 4종 비교). 토큰 규칙의 예외, 51 과 같은 처리.
   ========================================================================== */
.fs-p-64 {
  --efl-easy: #906F3E;   /* 골드(51 P12 눈썹밑거상술) — 흰 글자 4.64 */
  --efl-hard: #A7634F;   /* 로즈 클레이(51 P12 하안검) — 흰 글자 4.62 */
  --efl-easy-fill: #DEBE78;   /* 지도 칠 — 쉬운 부분(골드 밝은 단) */
  --efl-hard-fill: #C8604E;   /* 지도 칠 — 어려운 부분(로즈 클레이 진한 단) */
}

/* --- P1. 히어로(슬 1) — 지급 사진 누끼 + 허니 베이지 바탕(hero_build.py). hero-1015.jpg 는 4:1 캔버스라 어느 폭이든 높이 맞춤 —
   object-position x 를 «두 눈 사이 기준점 = 캔버스 76%» 와 같게 두면 기준점이 언제나 화면 76% 에 온다. <1024 는 3:4 세로판이 그대로 들어간다.
   정수리 5.5% 는 형제 15장 정수리 실측(26~36px)에 맞춘 값(1차 13% 는 낮게 앉았다).
   가로는 승인자 「형제 평균 자리로」(10-15 3차) — 모델 덩어리 중심을 형제 중앙값(≈69%)에 둔다. 들어 올린 손 때문에 카피↔모델 간격은 형제보다 조금 좁다(승인자 선택).
   2차 76%(+1024~1699 68%)는 간격만 형제 중앙값이고 모델이 오른쪽 끝(중심 73% · 어깨 94%)이었다. --- */
.fs-p-64 .fs-efl-hero .fs-hero__bg img { object-position: 71% center; }
@media (max-width: 1023px) { .fs-p-64 .fs-efl-hero .fs-hero__bg img { object-position: 50% 100%; } }
.fs-p-64 .fs-efl-hero .fs-efl-hero__lead { text-wrap: balance; }

/* --- P2. 새 섹션 #concern(슬 2 「페이지 추가」) — 일러스트(눈 뜬 처짐·주름 얼굴)를 가운데 60% 에 두고 콜아웃 2개를 좌우 바깥으로.
   점은 그림 위(--x/--y = 그림 폭·높이의 %, 단위 없음), 지시선은 점에서 그림 가장자리 밖 16px 까지, 글 상자는 그 바깥. 콜아웃 래퍼는 위치를 갖지 않아
   자식이 그림 상자(.fs-efl-concern__stack) 기준으로 놓인다. <900 은 옆 자리가 모자라 글을 그림 아래 두 칸으로(래퍼 display:contents).
   ★ 세로 위치를 top:%로 주면 <900 에서 상자 높이에 아래 글줄까지 들어가 점이 내려앉는다(768 에서 눈꺼풀 → 눈 밑) — 그림 폭(cqw) × 그림 비율(--ar)로 잰다. --- */
.fs-p-64 .fs-efl-concern__head { justify-items: center; }
/* 새 섹션(흰)과 #spec(흰)은 «문제 → 해결» 한 흐름 — 흰 2연속이 따로 노는 두 띠로 보이지 않게 사이 여백을 섹션 간격 하나로(아래 패딩 0).
   계획서 §1 에 적고 1차 반영 때 빠뜨렸던 것(10-15 승인자 「페이지 배경색 확인」에서 발견 — 그림 → 다음 제목 155px). 64.css 의 섹션 리듬 규칙(0,3,1)을 같은 특정성·뒤 순서로. */
.fs-p-64 main > .fs-section.fs-efl-concern { padding-block-end: 0; }
.fs-p-64 .fs-efl-concern__fig { max-width: 1100px; margin: var(--fs-gap-title) auto 0; }
.fs-p-64 .fs-efl-concern__stack { position: relative; display: block; width: 60%; margin-inline: auto; container-type: inline-size; }
.fs-p-64 .fs-efl-concern__stack img { display: block; width: 100%; height: auto; }
.fs-p-64 .fs-efl-concern__dot {
  position: absolute; left: calc(var(--x) * 1cqw); top: calc(var(--y) * var(--ar) * 1cqw); translate: -50% -50%; z-index: 2;
  width: 16px; height: 16px; border-radius: 50%; background: var(--fs-white); border: 4px solid var(--fs-teal-dk);
}
.fs-p-64 .fs-efl-concern__txt {
  position: absolute; top: calc(var(--y) * var(--ar) * 1cqw); translate: 0 -50%; z-index: 2;
  display: grid; gap: var(--fs-sp-2); width: clamp(150px, 107px + 6.4vw, 230px);
}
.fs-p-64 .fs-efl-concern__call--l .fs-efl-concern__txt { right: calc(100% + 16px); justify-items: end; text-align: right; }
.fs-p-64 .fs-efl-concern__call--r .fs-efl-concern__txt { left: calc(100% + 16px); justify-items: start; text-align: left; }
.fs-p-64 .fs-efl-concern__call--l::after,
.fs-p-64 .fs-efl-concern__call--r::after {
  content: ""; position: absolute; top: calc(var(--y) * var(--ar) * 1cqw); z-index: 1; height: 0; border-top: 2px dotted var(--fs-teal);
}
.fs-p-64 .fs-efl-concern__call--l::after { left: -16px; width: calc(var(--x) * 1cqw + 16px); }
.fs-p-64 .fs-efl-concern__call--r::after { left: calc(var(--x) * 1cqw); right: -16px; }
.fs-p-64 .fs-efl-concern__sm { font-size: var(--fs-t-sm); line-height: 1.45; color: var(--fs-ink-soft); text-wrap: balance; }
.fs-p-64 .fs-efl-concern__pill { font-size: var(--fs-t-sub); min-height: clamp(36px, 32.3px + 0.96vw, 46px); padding-inline: clamp(14px, 11.7px + 0.64vw, 22px); }
@media (max-width: 899px) {
  .fs-p-64 .fs-efl-concern__stack { width: 100%; display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--fs-sp-3); row-gap: var(--fs-sp-5); }
  .fs-p-64 .fs-efl-concern__stack img { grid-column: 1 / -1; }
  .fs-p-64 .fs-efl-concern__call { display: contents; }
  .fs-p-64 .fs-efl-concern__call--l::after, .fs-p-64 .fs-efl-concern__call--r::after { content: none; }
  .fs-p-64 .fs-efl-concern__txt { position: static; translate: none; width: auto; }
  .fs-p-64 .fs-efl-concern__call--l .fs-efl-concern__txt { justify-items: start; text-align: left; }
  .fs-p-64 .fs-efl-concern__call--r .fs-efl-concern__txt { justify-items: end; text-align: right; }
}

/* --- P3. 수술정보(슬 3) — 주석을 위 리드와 같은 글씨로 · 아이콘 줄은 51 상안검 줄 모양(57 P2 와 같은 꼴, 값은 64 그대로 5칸).
   흰 섹션이라 51(크림 섹션 위 흰 원)과 반대로 크림 원. 5칸이라 grid 대신 flex 가운데 — 600~1023 3+2 · <600 2+2+1 의 남는 칸이 가운데로 온다. --- */
.fs-p-64 .fs-efl-spec__note2 { margin-block-start: clamp(12px, 10.2px + 0.51vw, 20px); }
.fs-p-64 .fs-efl-spec2 {
  display: flex; flex-wrap: wrap; justify-content: center;
  row-gap: var(--fs-sp-7);
  margin-block: var(--fs-gap-title) 0;
  padding-block: clamp(24px, 21.2px + 0.77vw, 36px);
  border-block: 1px solid var(--fs-line);
}
.fs-p-64 .fs-efl-spec2__item {
  flex: 0 0 50%; min-width: 0;
  display: grid; justify-items: center; align-content: start; gap: var(--fs-sp-2);
  padding-inline: var(--fs-sp-2); text-align: center;
}
.fs-p-64 .fs-efl-spec2 dt {
  display: grid; justify-items: center; gap: var(--fs-sp-3);
  font-size: var(--fs-t-sm); line-height: var(--fs-lh-head); color: var(--fs-ink-soft);
}
.fs-p-64 .fs-efl-spec2__ic {
  display: grid; place-items: center;
  width: clamp(62px, 55px + 1.4vw, 82px); aspect-ratio: 1; border-radius: 50%;
  background: var(--fs-cream);
}
.fs-p-64 .fs-efl-spec2 dt img { width: 62%; height: auto;   /* ic-*-c.png 96x96 #999 선 → 포인트 브라운(51·57 과 같은 필터) */
  filter: brightness(0) invert(20%) sepia(25%) saturate(600%) hue-rotate(338deg); }
.fs-p-64 .fs-efl-spec2 dd {
  margin: 0; font-size: var(--fs-t-sub); font-weight: 700; line-height: var(--fs-lh-head); color: var(--fs-teal-dk);
}
@media (min-width: 600px)  { .fs-p-64 .fs-efl-spec2__item { flex-basis: 33.333%; } }
@media (min-width: 1024px) {
  .fs-p-64 .fs-efl-spec2__item { flex-basis: 20%; }
  .fs-p-64 .fs-efl-spec2__item + .fs-efl-spec2__item { border-inline-start: 1px solid var(--fs-line); }
}

/* --- P4. 왜 '눈썹' 인가(슬 5) — 사진 삭제 · 가운데 한 열 · 확대(제목 +25% · 문단 리드 → 인용 크기 · 원 152 → 196).
   두 문단은 같은 .fs-lead(크기·색 같음) · 「포시즌 내시경 이마거상술」만 <strong> 700(<b> 는 900 으로 풀린다). --- */
.fs-p-64 .fs-efl-brow2 { display: grid; justify-items: center; text-align: center; }
.fs-p-64 .fs-efl-brow2__copy { display: grid; justify-items: center; max-width: 52rem; }
.fs-p-64 .fs-efl-brow2__copy .fs-kicker { font-size: var(--fs-t-kicker-lg); }
.fs-p-64 .fs-efl-brow2__copy .fs-h2 {
  margin-block-start: clamp(10px, 8.1px + 0.51vw, 18px);
  font-size: clamp(32px, 28.3px + 1.03vw, 50px);
}
.fs-p-64 .fs-efl-brow2 .fs-h2::after { margin-inline: auto; transform-origin: center; }
.fs-p-64 .fs-efl-brow2__copy .fs-lead {
  margin-block-start: clamp(20px, 15.8px + 1.15vw, 38px);
  font-size: var(--fs-t-quote); line-height: 1.6; color: var(--fs-ink);
}
.fs-p-64 .fs-efl-brow2__copy .fs-lead + .fs-lead { margin-block-start: clamp(14px, 11.2px + 0.77vw, 26px); }
.fs-p-64 .fs-efl-strong { font-weight: 700; }
.fs-p-64 .fs-efl-brow2 .fs-efl-triad {
  --fs-efl-triad-gap: clamp(26px, 20.0px + 1.67vw, 52px);
  justify-content: center;
  margin-block-start: clamp(30px, 23.1px + 1.92vw, 60px);
}
.fs-p-64 .fs-efl-brow2 .fs-efl-triad__item { width: clamp(88px, 60.5px + 7.06vw, 196px); gap: 6px; }   /* 390 에서 88 — 원 3개 + 「+」 2개가 한 줄(316px) */
.fs-p-64 .fs-efl-brow2 .fs-efl-triad__num { font-size: var(--fs-t-sub); }
.fs-p-64 .fs-efl-brow2 .fs-efl-triad__label { font-size: clamp(16px, 14.6px + 0.38vw, 22px); }
.fs-p-64 .fs-efl-brow2 .fs-efl-triad__item:not(:first-child)::before { font-size: var(--fs-t-h2); }

/* --- P5. 원리(슬 4) — 강조 1곳 옐로우 형광펜(143 형광 레시피 · 색만 --fs-yellow 55%).
   글자 아래 48% 를 칠한다. 두 줄에 걸치면 줄을 따라 차례로 칠해진다(slice). 글자는 회색 본문보다 한 단 진하게(형광 위 회색은 흐리다).
   전환은 리빌(.is-in) 때만 — 기본에 두면 fs.js 가 로드 직후 .fs-reveal 을 붙일 때 거꾸로 지워지는 전환이 돈다. --- */
.fs-p-64 .fs-efl-hl {
  color: var(--fs-ink-soft); font-weight: 600;
  background: linear-gradient(transparent 52%, rgba(255, 230, 38, .55) 52% 96%, transparent 96%) 0 0 / 100% 100% no-repeat;
}
.fs-p-64 .fs-efl-principle__copy.is-in .fs-efl-hl { transition: background-size .9s var(--fs-ease-out) .5s; }
:root.fs-js .fs-p-64 .fs-efl-principle__copy.fs-reveal:not(.is-in) .fs-efl-hl { background-size: 0% 100%; }

/* --- P5-2. 근육 지도(슬 4 「그림 설명 이런 AI로」) — 근육 카드 2장 → 그림 1장 + 번호 핀 + 범례(원고 그대로). 옛 카드처럼 크림 판 위. --- */
.fs-p-64 .fs-efl-mmap {
  display: grid; row-gap: clamp(20px, 16.5px + 0.96vw, 35px); align-items: center;
  margin-block-start: clamp(30px, 24.0px + 1.67vw, 56px);
  padding: clamp(16px, 11.4px + 1.28vw, 36px); background: var(--fs-cream-2);
}
.fs-p-64 .fs-efl-mmap__stack { position: relative; display: block; }
.fs-p-64 .fs-efl-mmap__stack img { display: block; width: 100%; height: auto; }
.fs-p-64 .fs-efl-mmap__pin {
  position: absolute; left: var(--x); top: var(--y); translate: -50% -50%;
  display: grid; place-items: center; width: clamp(30px, 26.5px + 0.96vw, 44px); aspect-ratio: 1; border-radius: 50%;
  border: 3px solid var(--fs-white); background: var(--fs-teal-dk); color: var(--fs-white);
  font-size: clamp(13px, 12.1px + 0.26vw, 17px); font-weight: 700; line-height: 1;
}
.fs-p-64 .fs-efl-mmap__legend { display: grid; gap: clamp(18px, 14.5px + 0.96vw, 33px); }
.fs-p-64 .fs-efl-mmap__name { display: flex; align-items: center; gap: var(--fs-sp-3); font-size: var(--fs-t-h3); font-weight: 700; line-height: 1.3; color: var(--fs-ink); }
.fs-p-64 .fs-efl-mmap__num {
  display: inline-grid; place-items: center; flex: 0 0 auto; width: clamp(30px, 26.5px + 0.96vw, 44px); aspect-ratio: 1; border-radius: 50%;
  background: var(--fs-teal-dk); color: var(--fs-white); font-size: clamp(13px, 12.1px + 0.26vw, 17px);
}
.fs-p-64 .fs-efl-mmap__item .fs-body { margin-block-start: var(--fs-sp-2); padding-inline-start: calc(clamp(30px, 26.5px + 0.96vw, 44px) + var(--fs-sp-3)); color: var(--fs-ink-soft); }
/* 600~1023 — 그림 아래 범례 두 줄이 왼쪽에만 붙어 오른쪽 절반이 비었다(옆 세션 public-html-ea 지적, 768). 두 항목을 좌우 두 칸으로. ≥1024 는 public-html-ce 블록. */
@media (min-width: 600px) and (max-width: 1023px) { .fs-p-64 .fs-efl-mmap__legend { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--fs-gap-col); } }
/* 10-15 오후 승인자 「텍스트 쪽 죽은 공간이 너무 많아」 → 「표시선 있는 도해처럼」 — 범례가 620fr 열의 왼쪽 330px 만 쓰고 있었다.
   열을 700:440 으로 좁히고 그림+범례 묶음(최대 1208px)을 판 가운데로 · 핀에서 범례까지 표시선(그림 안은 SVG, 열 사이 틈은 항목 ::before).
   범례 항목은 자기 선 높이(--y, 그림 높이 %)에 번호 원 가운데를 맞춘다 — 범례 열이 그림 높이로 늘어나야 하므로 stretch.
   모바일(<1024)은 선 없이 옛 목록 그대로(64 모바일 패스 때). */
.fs-p-64 .fs-efl-mmap__leads { display: none; }
@media (min-width: 1024px) {
  .fs-p-64 .fs-efl-mmap {
    --mmap-gap: clamp(30px, 21.2px + 2.44vw, 68px); --mmap-num: clamp(30px, 26.5px + 0.96vw, 44px);
    grid-template-columns: minmax(0, 700fr) minmax(0, 440fr); column-gap: var(--mmap-gap); align-items: stretch;
    padding-inline: max(clamp(16px, 11.4px + 1.28vw, 36px), calc((100% - 1208px) / 2));
  }
  .fs-p-64 .fs-efl-mmap__leads {
    display: block; position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none;
  }
  .fs-p-64 .fs-efl-mmap__leads path { fill: none; stroke: var(--fs-teal-dk); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
  .fs-p-64 .fs-efl-mmap__legend { position: relative; display: block; }
  .fs-p-64 .fs-efl-mmap__item { position: absolute; inset-inline: 0; top: var(--y); translate: 0 calc(var(--mmap-num) / -2); }
  .fs-p-64 .fs-efl-mmap__item::before {
    content: ""; position: absolute; inset-inline-end: 100%; top: calc(var(--mmap-num) / 2 - 0.75px);
    width: var(--mmap-gap); border-block-start: 1.5px solid var(--fs-teal-dk);
  }
  .fs-p-64 .fs-efl-mmap__item .fs-body { font-size: var(--fs-t-lead); text-wrap: balance; }
}

/* --- P6. 효과(슬 6) — 왼쪽 모델 사진 삭제 → 글 열을 카드 줄 가운데에 · 일러스트(800x800)를 카드 이미지 칸에 가득 --- */
@media (min-width: 1024px) { .fs-p-64 .fs-efl-effect .fs-nose-dz__grid { align-items: center; } }
.fs-p-64 .fs-efl-effect--ill .fs-efl-effect__fig { padding-block-start: 0; }
.fs-p-64 .fs-efl-effect--ill .fs-efl-effect__ill {
  display: block; width: 100%; aspect-ratio: 1; object-fit: cover;
  align-self: start; margin-block-end: 0;
}
/* 10-15 승인자 「여기도 왜 센터가 아니야?」(옆 세션 public-html-ea 경유) — 캡션이 한 줄인 카드(「미간, 이마 주름의 해결」)만 그림 바로 밑에 붙고 남는 높이가 아래로 쌓였다.
   캡션 칸을 1fr 로 늘려 가운데 · 카드 아래에도 그림→글자와 같은 여백(기존 row-gap clamp)을 줘 위아래가 같게. */
.fs-p-64 .fs-efl-effect__card { grid-template-rows: auto 1fr; padding-block-end: clamp(12px, 9.7px + 0.64vw, 22px); }
.fs-p-64 .fs-efl-effect__cap { align-self: center; }

/* --- P7. 수술방법(슬 7) — STEP 라벨바와 설명 사이에 STEP 제목(굵게 · 설명 17 → 21~23px) · 리드 줄은 제목으로 옮겨 지웠다.
   단계 사이 «›» 는 li 높이의 30% 였는데 제목이 들어가 li 가 길어졌다 → 그림 높이의 절반(li 폭 × 546/700 ÷ 2 = 39cqw)에 고정. --- */
.fs-p-64 .fs-efl-step__item { grid-template-rows: auto auto minmax(0, 1fr); container-type: inline-size; }
.fs-p-64 .fs-efl-step__title {
  margin-block-start: var(--fs-sp-1);
  text-align: center; font-size: clamp(19px, 17.6px + 0.38vw, 23px); font-weight: 700; line-height: 1.35; color: var(--fs-ink);
}
.fs-p-64 .fs-efl-step__title + .fs-efl-step__cap { margin-block-start: calc(var(--fs-sp-1) - clamp(12px, 9.7px + 0.64vw, 22px)); }
@media (min-width: 1024px) {
  .fs-p-64 .fs-efl-step__item + .fs-efl-step__item::before { inset-block-start: 39cqw; }
}

/* --- P9. 핵심 포인트(슬 9) — 박리 지도 쉬운/어려운 부분을 다른 색(골드 / 로즈 클레이) · POINT 02·03 을 POINT 01 배치로 --- */
.fs-p-64 .fs-efl-zone__easy { fill: var(--efl-easy-fill); fill-opacity: .55; }
.fs-p-64 .fs-efl-zone__hard { fill: var(--efl-hard-fill); fill-opacity: .62; }
.fs-p-64 .fs-efl-zone__edge { stroke: var(--efl-hard-fill); }
.fs-p-64 .fs-efl-zone__tag--easy { background: var(--efl-easy); }
.fs-p-64 .fs-efl-zone__tag--hard { background: var(--efl-hard); }
.fs-p-64 #point[style] .fs-efl-zone__tag--easy { inset-block-start: var(--zone-easy-y); }
.fs-p-64 #point[style] .fs-efl-zone__tag--hard { inset-block-start: var(--zone-hard-y); }
.fs-p-64 .fs-efl-zone--one { margin-block-start: clamp(44px, 33.4px + 2.95vw, 90px); }
.fs-p-64 .fs-efl-point2__fig img { display: block; width: 100%; height: auto; }
/* 10-15 승인자 「POINT 본문 글자 키워」(옆 세션 public-html-ea 경유) — POINT 01~03 본문 17 → 19px(1920) · 360 17px. 같은 페이지 리드 21px 바로 아래 단계, 행간·색은 그대로. */
.fs-p-64 #point .fs-efl-zone__copy .fs-body { font-size: clamp(17px, 16.54px + 0.128vw, 19px); }

/* 10-15 승인자 캡처 「약간 외톨이줄, 폰트 사이즈 키우던가 해서 조정」 — #endoscope 흰 카드 3장 본문 끝줄이 「보이지 않음」「손상을 최소화」「적음」(30px)만 남았다.
   글자는 POINT 본문과 같은 단(17 → 19px@1920 · 360 17px) + balance 로 두 줄을 고르게. 1920~1280 끝줄/첫줄 0.8 이상, 1024 는 세 줄 고르게. */
.fs-p-64 .fs-efl-endo__card .fs-body { font-size: clamp(17px, 16.54px + 0.128vw, 19px); text-wrap: balance; }

/* --- reduced-motion --- */
@media (prefers-reduced-motion: reduce) {
  .fs-p-64 .fs-efl-hl { transition: none !important; background-size: 100% 100% !important; }
}

/* --- P10. 모바일 최적화(10-15 승인자 「모바일 최적화 진행」) — MOBILE_RULES 절차. 줄바꿈은 전 폭, 배치는 <600 만.
   PC 요소 위치 무변화(1024·1440·1920 실측). 마크업 mobile_1015.py(restructure 끝). 백업 _src/build/backup-64-1015-mo/. --- */
.fs-p-64 .fs-lead__s { display: block; text-wrap: balance; }
.fs-p-64 .fs-efl-spec__note2,
.fs-p-64 .fs-efl-effect__cap,
.fs-p-64 .fs-efl-mmap__item .fs-body,
.fs-p-64 .fs-efl-target__item .fs-card__title,
.fs-p-64 #endoscope .fs-lead,
.fs-p-64 .fs-efl-zone__figure .fs-labelbar,
.fs-p-64 #spec-title,                                   /* <br> 앞 구만 잡힌다(§7-2) — 540 「…인상 전체를 / 개선해주는」 한 낱말 줄 */
.fs-p-64 #brow-title,                                   /* 360 「쌍꺼풀 수술은 잘 / 되었지만」 */
.fs-p-64 .fs-efl-step__title,
.fs-p-64 #principle .fs-efl-principle__copy .fs-body,
.fs-p-64 #point .fs-efl-zone__copy .fs-body { text-wrap: balance; }   /* pretty 는 390 「수 있습니다.」 를 못 잡았다 */
@media (max-width: 599px) {
  /* 효과 3장 — §2 B «그림+라벨바 좌 · 글 우» */
  .fs-p-64 .fs-efl-effect__card {
    grid-template-columns: min(42%, 200px) minmax(0, 1fr); grid-template-rows: auto;
    column-gap: var(--fs-sp-4); align-items: center;
    padding-block-end: 0; padding-inline-end: var(--fs-sp-4);
  }
  .fs-p-64 .fs-efl-effect__cap { text-align: start; }
  /* STEP 4장 — §2 B */
  .fs-p-64 .fs-efl-step__item {
    grid-template-columns: min(44%, 220px) minmax(0, 1fr); grid-template-rows: 1fr auto auto 1fr;
    column-gap: var(--fs-sp-5); row-gap: 0;
  }
  .fs-p-64 .fs-efl-step__fig { grid-column: 1; grid-row: 1 / -1; }
  .fs-p-64 .fs-efl-step__title { grid-column: 2; grid-row: 2; margin-block-start: 0; text-align: start; }
  .fs-p-64 .fs-efl-step__title + .fs-efl-step__cap {
    grid-column: 2; grid-row: 3; margin-block-start: var(--fs-sp-2); text-align: start; padding-inline: 0;
  }
  /* POINT 01 박리 지도 2장 — §2 A 나란히(두 범위 비교가 요지) */
  .fs-p-64 .fs-efl-zone__maps:not(.fs-efl-zone__maps--one) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--fs-sp-3); }
  /* 도해가 155px 로 줄어 꼬리표 두 개(24px 고정)가 4~5px 겹쳤다 → 꼬리표를 납작하게(글자 12px 유지) + 「쉬운 부분」을 금색 띠 안에서 7% 위로 */
  .fs-p-64 .fs-efl-zone__maps:not(.fs-efl-zone__maps--one) .fs-efl-zone__tag {
    min-height: 0; padding-block: 3px; padding-inline: 8px; font-size: 12px; line-height: 1.2;
  }
  .fs-p-64 #point[style] .fs-efl-zone__maps:not(.fs-efl-zone__maps--one) .fs-efl-zone__tag--easy { inset-block-start: calc(var(--zone-easy-y) - 7%); }
}
/* 10-15 승인자 캡처 「모바일에 맞게 레이아웃 봐줘, 모바일만」 — #concern <900: 지시선이 빠져 그림 위 점과 아래 두 칸 설명의 짝이 안 보였고,
   왼쪽 설명이 두 줄 · 오른쪽 한 줄이라 아래 알약 높이가 어긋났다.
   ① 점 = 번호 원(1·2) · 설명 머리에 같은 번호 → 짝을 번호로(숫자는 CSS content, 대체 텍스트 "" — 문구·낭독 무변경)
   ② 글 상자를 display:contents 로 풀어 그림 아래를 «설명 줄 / 알약 줄» 공용 격자로 — 알약이 같은 높이에 선다. 번호 옆 글은 들여쓰기(flex). ≥900 무변경. */
@media (max-width: 899px) {
  .fs-p-64 .fs-efl-concern__dot {
    display: grid; place-items: center; width: 26px; height: 26px;
    background: var(--fs-teal-dk); border: 2px solid var(--fs-white); box-shadow: 0 1px 4px rgba(17, 17, 17, .28);
    color: var(--fs-white); font-size: 13px; font-weight: 700; line-height: 1;
  }
  .fs-p-64 .fs-efl-concern__stack { row-gap: 0; }
  .fs-p-64 .fs-efl-concern__txt { display: contents; }
  .fs-p-64 .fs-efl-concern__sm { grid-row: 2; align-self: start; display: flex; gap: 6px; margin-block-start: var(--fs-sp-5); }
  .fs-p-64 .fs-efl-concern__sm::before {
    flex: 0 0 20px; display: grid; place-items: center; height: 20px; margin-block-start: 1px;
    border-radius: 50%; background: var(--fs-teal-dk); color: var(--fs-white); font-size: 12px; font-weight: 700; line-height: 1;
  }
  .fs-p-64 .fs-efl-concern__pill { grid-row: 3; align-self: start; margin-block-start: var(--fs-sp-3); }
  .fs-p-64 .fs-efl-concern__call--l .fs-efl-concern__sm,
  .fs-p-64 .fs-efl-concern__call--l .fs-efl-concern__pill { grid-column: 1; justify-self: start; }
  .fs-p-64 .fs-efl-concern__call--r .fs-efl-concern__sm,
  .fs-p-64 .fs-efl-concern__call--r .fs-efl-concern__pill { grid-column: 2; justify-self: end; }
  .fs-p-64 .fs-efl-concern__call--r .fs-efl-concern__sm { text-align: right; }
  .fs-p-64 .fs-efl-concern__call--l .fs-efl-concern__dot::before,
  .fs-p-64 .fs-efl-concern__call--l .fs-efl-concern__sm::before { content: "1" / ""; }
  .fs-p-64 .fs-efl-concern__call--r .fs-efl-concern__dot::before,
  .fs-p-64 .fs-efl-concern__call--r .fs-efl-concern__sm::before { content: "2" / ""; }
}
/* 10-15 승인자 「페이지 전체적으로 모바일에 맞게」 — <1024(쌓이는 폭)만.
   ① 원리 · 내시경: 그림(얼굴 도해 423px · 장비 원 345px)이 제목보다 먼저 왔다 → 글 열 먼저(141 「제목이 먼저 오게」 선례). DOM·리빌 무변경, order 만.
      원리는 글 열 안의 확대 원이 글 바로 뒤에 붙어 «글 → 확대(올리고 고정) → 얼굴 전체 → 근육 지도» 순서가 된다.
   ② 수술대상 5장: 번호가 제목 위 따로 한 줄 → PC 처럼 「번호 | 제목」 한 줄. 사진·도해 크기는 안 줄였다(§4-4). */
@media (max-width: 1023px) {
  .fs-p-64 .fs-efl-principle__copy,
  .fs-p-64 .fs-efl-endo__copy { order: -1; }
  .fs-p-64 .fs-efl-principle__zoom { justify-self: center; }   /* 768 에서 확대 원만 왼쪽에 붙고 얼굴 도해는 가운데였다 */
  .fs-p-64 .fs-efl-target__item { grid-template-columns: auto minmax(0, 1fr); column-gap: var(--fs-sp-4); align-items: baseline; }
}