/* ==========================================================================
   no-implant · 무보형물 코성형 — 2026-10-12 병원 PPT 로 36(포시즌 코성형 = 옛 「유형별 코성형」)을 옮겨 왔다.
   이 파일은 36.css 를 _src/gen/no-implant-pptx/css_build.py 가 옮긴 것이다 — 고칠 때는 new-block.css 나 스크립트를 고치고 다시 돌려라.
   지운 것: 1-b 필 목차(→ 히어로 해시태그) · 5 비교표 · D 범례 · 유형 카드 사진 2장 교차(→ 일러스트 1장).
   ========================================================================== */

/* --------------------------------------------------------------------------
   셸 · 1) 1mm 계열 «투명 헤더 + 모델 히어로» 첫 화면
   사진 없는 크림 목차 히어로였다. 히어로 안에 있던 8시술 필 스트립은 본문 첫
   섹션(#index)으로 내리고, 히어로는 모델 사진 한 장으로 비웠다.
   히어로 상단은 전 폭이 블러시 로즈(#D5B0AA)라 «잉크 글자»(7.6:1)를 쓴다.
   모델 머리는 사진 높이의 24.3% 아래에서 시작해 헤더 띠(최대 16%)에 안 걸린다.
   -------------------------------------------------------------------------- */
.fs-p-no-implant {
  --fs-header-overlay-bg: transparent;
}
/* 오버레이 헤더 뒤에 실제로 깔리는 색. 사진이 그 위를 덮으므로 화면은 그대로지만
   사진 로딩 전 번쩍임이 없고, qa.py 가 배경을 흰 body 로 오판하지 않는다. */
.fs-p-no-implant .fs-page--overlay { background: #D5B0AA; }
.fs-p-no-implant .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-no-implant .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%); }
/* :not() 로 감싼다 — fs.css:495 의 [aria-current] 700 과 특정성이 같아
   «이 페이지가 곧 대분류» 일 때 굵게 표시가 조용히 죽는다 (2026-09-10 카테고리 재편) */
.fs-p-no-implant .fs-gnb__link:not([aria-current="page"]) { font-weight: 400; }
/* fs.css 의 오버레이 규칙은 «흰 글자» 전제라 호버가 흰색이다 — 밝은 헤더에선 반대로 */
.fs-p-no-implant .fs-header--overlay .fs-gnb__link:hover,
.fs-p-no-implant .fs-header--overlay .fs-gnb__link:focus-visible { color: var(--fs-teal-dk); opacity: 1; }
.fs-p-no-implant .fs-header--overlay .fs-util__link { color: var(--fs-ink-soft); }
.fs-p-no-implant .fs-header--overlay .fs-util__link:hover { color: var(--fs-teal-dk); opacity: 1; }
.fs-p-no-implant .fs-util__sep { opacity: .35; }

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

/* <1024px — 히어로 박스가 가로로 길어져 오버레이로는 카피와 모델이 겹친다.
   카피를 블러시 밴드로 위에 쌓고 세로 크롭 사진을 아래에 붙인다. */
@media (max-width: 1023px) {
  .fs-p-no-implant .fs-nhub-hero { min-height: 0; background: #E5C7C0; }
  .fs-p-no-implant .fs-nhub-hero .fs-hero__bg {
    position: static; inset: auto; z-index: 0; grid-row: 2;
  }
  .fs-p-no-implant .fs-nhub-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-no-implant .fs-nhub-hero .fs-hero__inner {
    grid-row: 1; background: #E5C7C0;
    padding-block: calc(var(--fs-header-h) + var(--fs-sp-9)) var(--fs-sp-11);
  }
  .fs-p-no-implant .fs-nhub-hero .fs-hero__copy { max-width: 100%; }
}
/* 블러시 밴드(L 0.61) 위에서 --fs-teal-text 는 3.3:1, --fs-teal-dk 는 4.37:1 이라
   본문 기준(4.5)에는 못 미친다. 킥커를 19px·700 으로 올리면 «큰 글자»(기준 3:1)가
   되어 4.37:1 로 통과하고, 브랜드 틸도 그대로 살릴 수 있다. */
.fs-p-no-implant .fs-nhub-hero .fs-hero__kicker {
  color: var(--fs-teal-dk);
  font-family: var(--fs-font-en);
  font-size: clamp(19px, 17.5px + 0.42vw, 23px);
  font-weight: 700;
}
.fs-p-no-implant .fs-nhub-hero .fs-hero__title { color: var(--fs-ink); }
.fs-p-no-implant .fs-nhub-hero__sub {
  font-size: var(--fs-t-lead);
  line-height: var(--fs-lh-body);
  color: var(--fs-ink-soft);
}

/* --------------------------------------------------------------------------
   2) .fs-nhub-mat — 자가재료 4종 원형 도해 + 라벨바
   -------------------------------------------------------------------------- */
.fs-p-no-implant .fs-nhub-mat { margin-block-start: var(--fs-gap-title); }
.fs-p-no-implant .fs-nhub-mat__fig { display: grid; }
.fs-p-no-implant .fs-nhub-mat__fig img {
  display: block;
  width: 100%;
  height: auto;
  background: var(--fs-white);
}

/* --------------------------------------------------------------------------
   3) .fs-nhub-cards — A18 대표 2카드 (겹친 패널 돌출량 보정)
   -------------------------------------------------------------------------- */
.fs-p-no-implant .fs-nhub-cards {
  margin-block-start: var(--fs-gap-title);
  align-items: start;
}
.fs-p-no-implant .fs-nhub-cards .fs-card--panel { --fs-panel-w: 68%; }
.fs-p-no-implant .fs-nhub-cards [data-fs-tilt-inner] { position: relative; }
.fs-p-no-implant .fs-nhub-cards img { display: block; width: 100%; height: auto; }
@media (min-width: 1024px) {
  .fs-p-no-implant .fs-nhub-cards { padding-block-end: var(--fs-panel-drop, 72px); }
}
.fs-p-no-implant .fs-nhub-diag { margin-block-start: var(--fs-sp-12); }
/* 진단 6항목 — 글자 필 6개였다. 49 페이지에서 이미 이 여섯 항목을 그대로 그린
   도해(low-nose/dx-01~06)가 있어 그것을 카드로 세운다. 새로 생성하면 코의 계측
   기준을 지어낼 위험이 있어 실제 도해를 재사용한다. */
.fs-p-no-implant .fs-nhub-diag__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--fs-gap-card);
  margin-block-start: var(--fs-sp-7);
  list-style: none;
}
@media (min-width: 600px)  { .fs-p-no-implant .fs-nhub-diag__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .fs-p-no-implant .fs-nhub-diag__list { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.fs-p-no-implant .fs-nhub-diag__fig { display: grid; margin: 0; background: var(--fs-white); }
.fs-p-no-implant .fs-nhub-diag__fig img {
  display: block; width: 100%; max-width: 96px; height: auto;
  margin-inline: auto; padding-block: var(--fs-sp-6);
}
.fs-p-no-implant .fs-nhub-diag__fig .fs-labelbar {
  min-height: clamp(34px, 31.2px + 0.77vw, 46px);
  padding-inline: var(--fs-sp-2); line-height: 1.3;
}

/* --------------------------------------------------------------------------
   4) .fs-nhub-type — 유형별 코성형 타일 (A15 확장)
      정사각 도해 박스 → 라벨바 → 태그라인 2줄 → 링크. 카드 전체가 링크다.
   -------------------------------------------------------------------------- */
.fs-p-no-implant .fs-nhub-types { margin-block-start: var(--fs-gap-title); }
.fs-p-no-implant .fs-nhub-type {
  display: grid;
  grid-template-rows: auto auto 1fr;
  height: 100%;
  text-decoration: none;
  color: inherit;
  background: var(--fs-white);
}
.fs-p-no-implant .fs-nhub-type__fig {
  position: relative;
  display: block;
  aspect-ratio: 1;
  overflow: hidden;
  background: var(--fs-cream-2);
}
.fs-p-no-implant .fs-nhub-type__fig img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fs-p-no-implant .fs-nhub-type__body {
  display: grid;
  align-content: start;
  gap: var(--fs-sp-2);
  padding: var(--fs-sp-6) var(--fs-sp-5) var(--fs-sp-7);
}
.fs-p-no-implant .fs-nhub-type__sub {
  font-size: var(--fs-t-sub);
  font-weight: 700;
  color: var(--fs-teal-text);
}
.fs-p-no-implant .fs-nhub-type__desc {
  font-size: var(--fs-t-body);
  line-height: var(--fs-lh-body);
  color: var(--fs-muted);
}
.fs-p-no-implant .fs-nhub-type__more {
  margin-block-start: var(--fs-sp-3);
  font-size: var(--fs-t-sm);
  font-weight: 700;
  color: var(--fs-teal-dk);
}
.fs-p-no-implant .fs-nhub-type__more::after {
  content: "";
  display: inline-block;
  width: 7px; height: 7px;
  margin-inline-start: 8px;
  border-inline-end: 2px solid currentColor;
  border-block-start: 2px solid currentColor;
  transform: rotate(45deg) translate(-2px, 2px);
}

/* --------------------------------------------------------------------------
   6) .fs-nhub-statement — A09 다크 스테이트먼트 밴드
      fs.css 는 .fs-section > .fs-container / .fs-bleed 에만 z-index:1 을 주므로
      .fs-split 을 직계 자식으로 두면 .fs-section__bg 아래로 깔린다. 직접 올린다.
   -------------------------------------------------------------------------- */
.fs-p-no-implant .fs-nhub-statement { position: relative; z-index: 1; }
.fs-p-no-implant .fs-nhub-statement > figure { margin: 0; }
.fs-p-no-implant .fs-nhub-statement > figure img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fs-p-no-implant .fs-nhub-statement__copy {
  display: grid;
  gap: var(--fs-sp-6);
  padding: var(--fs-sp-13) var(--fs-gutter);
}
.fs-p-no-implant .fs-nhub-statement__copy .fs-quote { color: var(--fs-on-dark); }

/* --------------------------------------------------------------------------
   7) CTA 밴드
   -------------------------------------------------------------------------- */
.fs-p-no-implant .fs-nhub-cta__bar {
  max-width: 720px;
  margin-inline: auto;
  margin-block-start: var(--fs-gap-title);
}

/* --------------------------------------------------------------------------
   8) 모바일 보정
      fs.css 의 .fs-grid--3 는 600px 에서 2열이라 타일 텍스트가 눌린다.
      360px 에서는 1열로 되돌린다(카드 안에 본문이 있는 확장형이라 3열 유지 불가).
   -------------------------------------------------------------------------- */
@media (max-width: 599px) {
  /* fs.css 의 .fs-grid--4 는 <600px 에서 1열이라 원형 도해 4장이 한없이 길어진다 */
  .fs-p-no-implant .fs-nhub-mat { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 480px) {
  .fs-p-no-implant .fs-nhub-types { grid-template-columns: minmax(0, 1fr); }
  .fs-p-no-implant .fs-nhub-type__fig { max-width: 320px; margin-inline: auto; width: 100%; }
}

/* ==========================================================================
   ▼▼▼ 진단·수정 패스 — 2026-08-27
   근거: _design/DESIGN_SYSTEM.md 6장 · _design/QA/48.md · assets/page/48.css 승격분
   ========================================================================== */

/* --------------------------------------------------------------------------
   A. [LOCK 2 / 호버] 타일 틸트가 라벨바를 두고 갔다

   fs.js:318 은 data-fs-tilt-inner 요소 «하나만» 돌린다. 그 대상이
   .fs-nhub-type__fig(사진 상자 = 카드 면적 70%)였어서 PC 호버에서
   사진만 4도 기울고, 바로 아래 «간격 0» 으로 붙어 있어야 할 라벨바가
   평평하게 남아 바와 사진이 눈에 띄게 떨어졌다(LOCK 2 의 «붙어 있는가»).
   확정 시안 57 은 라벨바를 틸트 대상 «안» 에 둔다(57/index.html:260 의
   figure > img + figcaption). 같은 형태로 되돌린다 —
   index.html 에서 data-fs-tilt-inner 를 <a class="fs-nhub-type"> 로 옮겼다.

   그러면 같은 요소에 걸려 있던 호버 리프트가 문제가 된다.
   .fs-p-no-implant .fs-nhub-type:hover 는 특정성 (0,3,0) 이라 fs.css 의
   .fs-tilt__inner (0,1,0) 를 이겨 틸트 변형을 통째로 덮어쓴다.
   → 리프트를 걷어내고, 아래 B 의 «프레임 고정 + 사진만 확대» 로 바꿨다.
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   B. 호버 — 프레임은 고정, 사진만 움직인다 (48 검증분)
      그림자는 쓰지 않는다(2차 규칙).
   -------------------------------------------------------------------------- */
.fs-p-no-implant .fs-nhub-type__fig img {
  transition: transform var(--fs-dur-slow) var(--fs-ease-out);
}
.fs-p-no-implant .fs-nhub-type .fs-labelbar {
  transition: background-color var(--fs-dur) var(--fs-ease);
}

@media (hover: hover) and (pointer: fine) {
  .fs-p-no-implant .fs-nhub-type:hover .fs-nhub-type__fig img { transform: scale(1.045); }
  /* 라벨바는 사진과 함께 커지면 안 된다 — 글자가 흔들린다. 색만 한 단계 */
  .fs-p-no-implant .fs-nhub-type:hover .fs-labelbar { background: var(--fs-teal-dk); }
}
/* 키보드 이동에도 같은 신호를 준다(틸트는 fine pointer 에만 걸린다) */
.fs-p-no-implant .fs-nhub-type:focus-visible .fs-nhub-type__fig img { transform: scale(1.045); }

/* --------------------------------------------------------------------------
   C. 섹션 제목 뒤 70px 틸 선 (48 검증분, delay .5s)

   ★ «.is-in 이면 보이기» 로 짜면 안 된다. fs.js 는 첫 화면 안에 있던 대상에
     .fs-reveal 클래스 자체를 붙이지 않아 그 제목의 선이 영원히 안 그어진다.
     기본을 「그어진 상태」로 두고 .fs-reveal:not(.is-in) 에만 초기 은닉을 건다.
   -------------------------------------------------------------------------- */
.fs-p-no-implant .fs-nose-head h2 { position: relative; }
.fs-p-no-implant .fs-nose-head 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-no-implant h2.fs-reveal:not(.is-in)::after,
:root.fs-js .fs-p-no-implant .fs-reveal:not(.is-in) .fs-nose-head h2::after { transform: scaleX(0); }

/* --------------------------------------------------------------------------
   E. [V70 B] 다크 밴드 50:50 하드컷 → 56:44 비대칭 + 카피 패널 가로 겹침

   ① 하드컷 — 사진 절반 / 글 절반이 «맞붙은 두 장» 으로 읽힌다.
   ② 1024~1440 구간에서는 더 나쁘다. --fs-split-align:center 라 사진이
      밴드 높이를 못 채우고 위아래 83px 씩 검은 띠를 남긴 채 떠 있었다.
      (1024 실측: 밴드 496px · 사진 329px)
   → stretch 로 사진이 밴드를 꽉 채우게 하고, 카피 패널을 사진 위로 끌어
     비대칭 겹침을 만든다. band-consult.jpg 평균 휘도 125.4(>110)라 겹침이 먹는다.
   ★ 음수 마진은 PC «가로» 로만. 세로로 주면 섹션이 통째로 끌려 올라간다.
   ★ 인라인 style 은 CSS 로 못 이기므로 --fs-split 선언을 index.html 에서
     이 파일로 옮겼다. gap:0 은 모바일에도 걸려 있어야 해서 분기 밖에 둔다.
   -------------------------------------------------------------------------- */
.fs-p-no-implant .fs-nhub-statement { gap: 0; }

@media (min-width: 1024px) {
  .fs-p-no-implant .fs-nhub-statement {
    --fs-split: minmax(0, 56fr) minmax(0, 44fr);
    --fs-split-align: stretch;
  }
  .fs-p-no-implant .fs-nhub-statement > figure { position: relative; z-index: 1; }
  .fs-p-no-implant .fs-nhub-statement__copy {
    position: relative;
    z-index: 3;                                  /* .fs-section__bg 위, 사진 위 */
    align-self: center;
    margin-inline-start: clamp(-136px, -7vw, -72px);
    padding-inline: clamp(40px, 3.2vw, 76px) var(--fs-gutter);
    background: var(--fs-ink-band);              /* 겹친 자리에서 글자가 사진에 묻지 않게 */
  }
}

/* --------------------------------------------------------------------------
   F. 다크 밴드 고스트 블러

   band-ghost.jpg 는 어둡게만 눌러 놓았을 뿐 흐려지지 않아서, 카피 뒤에서
   수술모·마스크를 쓴 «두번째 얼굴» 이 그대로 읽힌다(1024 에서 특히 또렷하다).
   확정 시안 57 은 이 블러가 에셋에 구워져 있다(assets/nose/compare-bg.jpg).
   여기서는 에셋을 건드리지 않고 CSS 로 흐린다 — 50.css:392 와 같은 처방이다.
   블러 가장자리가 비지 않도록 상자보다 크게 깔고 음수 마진으로 되민다.
   -------------------------------------------------------------------------- */
.fs-p-no-implant .fs-section--ink .fs-section__bg img {
  max-width: none;               /* fs.css 의 img{max-width:100%} 가 폭 보정을 먹는다 */
  width: calc(100% + 140px);
  height: calc(100% + 140px);
  margin: -70px;
  filter: blur(20px);
}

/* --------------------------------------------------------------------------
   G. reduced-motion — 이 패스에서 새로 만든 전이를 전부 정지 상태로 확정
      (겹침·스트레치·블러는 모션이 아니므로 그대로 둔다)
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .fs-p-no-implant .fs-nose-head h2::after {
    transform: scaleX(1) !important;
    transition: none !important;
  }
  .fs-p-no-implant .fs-nhub-type__fig img,
  .fs-p-no-implant .fs-nhub-type .fs-labelbar {
    transition: none !important;
    transform: none !important;
  }
}

/* ==========================================================================
   ▼▼▼ 2026-09-14 · 카테고리 틴트 2단계 — 코성형 = 로즈 그레이지 #D8C9C4 (fs.css «카테고리 틴트» 블록 + body.fs-cat-nose)
   승인자 결정 A(57 확정색). 사진은 i2i 컬러 워시(«로즈 그레이지 → 모델 뒤 로즈 크림 글로우», 원본 1920×998 은 16:9 패딩 후 되자름)
   → hero-model-duo(-mo).jpg. 킥커는 fs.css 의 코성형 B 규칙(토프 큰 글자). 모델 오른쪽(x 68%~) → 카피 쪽 가로 스크림 왼→오.
   ========================================================================== */
.fs-p-no-implant .fs-nhub-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) 30%, rgba(var(--fs-cat), .50) 50%, rgba(var(--fs-cat), 0) 64%);
}
@media (max-width: 1023px) {
  .fs-p-no-implant .fs-nhub-hero .fs-hero__bg::after { content: none; }
  .fs-p-no-implant .fs-nhub-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-no-implant .fs-nhub-hero .fs-hero__copy { gap: var(--fs-sp-3); }
.fs-p-no-implant .fs-nhub-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-no-implant .fs-nhub-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-no-implant .fs-nhub-hero__rule { margin-block-end: var(--fs-sp-2); }
.fs-p-no-implant .fs-nhub-hero .fs-nhub-hero__sub {
  max-width: 34em; font-size: var(--fs-t-lead); font-weight: 400; line-height: 1.5; color: var(--fs-ink);
}

/* ==========================================================================
   ▼▼▼ 2026-10-12 · 병원 PPT 「홈페이지 수정(무보형물코성형+유형별코성형)」 — 계획 _design/PLAN-no-implant-1012-pptx.md
   마크업 _src/gen/no-implant-pptx/restructure.py · 히어로 _src/gen/no-implant-hero/ · 일러스트 _src/gen/no-implant-illust/
   ========================================================================== */

/* P1. 슬 1·2 — 새 히어로(hero-1012f.jpg 1920×998, 36 과 같은 판형 · 정수리 y≈243). 세로 위치는 36 과 같은 54%.
       10-12 오후 승인자 「모델 사이즈 재조정, 어깨 밑에도 보이게」 — 몸을 이어 그려(gen#734) 머리 485 → 330px(_src/gen/no-implant-hero/hero_build2.py).
       1024~1279 는 카피 줄 끝이 머리카락에 닿지 않게 사진을 오른쪽으로 밀고(가로 넘침 0% 정렬),
       해시태그 8개를 4개씩 두 줄로 접는다(1차 히어로 1024 실측: 한 줄 522px · 머리 545px — 2차는 머리가 ≈580px 로 물러났지만 여유를 둔다). */
@media (min-width: 1024px) and (max-width: 1279px) {
  .fs-p-no-implant .fs-nhub-hero .fs-hero__bg img { object-position: 0% 54%; }
  .fs-p-no-implant .fs-nimp-tags { max-width: 300px; }
}

/* P2. 슬 3 — 필 줄을 히어로로 올려 «박스 없는» 해시태그 글줄로. 링크는 필 줄의 것을 잇는다.
       히어로 바탕(로즈 그레이지) 위 --fs-teal-dk 는 4.27:1 로 본문 기준 미달 → 본문색 ink-soft(≈6.5:1). */
.fs-p-no-implant .fs-nimp-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--fs-sp-1) var(--fs-sp-3);
  margin: var(--fs-sp-2) 0 0;
  padding: 0;
  list-style: none;
}
.fs-p-no-implant .fs-nimp-tags a {
  font-size: var(--fs-t-body);
  font-weight: 500;
  line-height: 1.5;
  color: var(--fs-ink-soft);
  text-decoration: none;
}
.fs-p-no-implant .fs-nimp-tags a:hover,
.fs-p-no-implant .fs-nimp-tags a:focus-visible {
  color: var(--fs-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* P3. 슬 5·6·7 「중앙정렬」 — 지시된 머리 3곳만(시그니처 · 진단 · 유형별). 「선택한 자가조직에…」 머리는 왼쪽 그대로.
       .fs-nose-head 는 fs.css 에서 justify-items:start 라 text-align 만으로는 안 모인다. 제목 아래 틸 선도 가운데에서 그어진다. */
.fs-p-no-implant .fs-nimp-head--center { text-align: center; }
.fs-p-no-implant .fs-nose-head.fs-nimp-head--center { justify-items: center; }
.fs-p-no-implant .fs-nose-head.fs-nimp-head--center h2::after { margin-inline: auto; transform-origin: center; }
/* ★ justify-items:center 를 블록(.fs-nhub-diag)에 걸면 최신 크롬은 블록 안 목록까지 내용 폭으로 줄인다(1440 → 992px, 칸 223 → 149px).
     그래서 진단 블록은 글자 가운데만. 10-12 오후 승인자 캡처 「아이콘이랑 박스들 조금 더 크게」 — 칸은 36 폭으로 돌아오고 아이콘 96 → 112px. */
.fs-p-no-implant .fs-nhub-diag__fig img { max-width: 112px; }

/* P4. 슬 6 — 진단 제목 아래 두 문장(신설). 문장 블록(MOBILE_RULES 1-4). 간격은 .fs-nose-head .fs-nose-lead(12px)가 준다. */
.fs-p-no-implant .fs-lead__s { display: block; text-wrap: balance; }

/* P5. 슬 7 — 유형 일러스트(1024 정사각, 바탕까지 그려진 그림)라 상자 바탕색은 안 보인다.
       10-12 오후 승인자 「기존처럼 커서가 가면 사진이 바뀌는 식으로」 — 옛 20초 자동 교차 대신 «마우스 올림·키보드 포커스» 에 둘째 각도로.
       둘째 그림은 옛 사진 중 첫 그림과 다른 각도를 일러스트로(_src/gen/no-implant-illust/enqueue2.py). 터치 기기는 첫 그림만.
       transition 은 위 «.fs-nhub-type__fig img»(0,2,1) 의 transform 전이를 덮지 않게 같이 적고 특정성을 올린다. */
.fs-p-no-implant .fs-nhub-type__fig { background: var(--fs-cream); }
.fs-p-no-implant .fs-nhub-type__fig img.fs-nhub-type__view--2 {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity var(--fs-dur-slow) var(--fs-ease), transform var(--fs-dur-slow) var(--fs-ease-out);
}
@media (hover: hover) and (pointer: fine) {
  .fs-p-no-implant .fs-nhub-type:hover .fs-nhub-type__fig img.fs-nhub-type__view--2 { opacity: 1; }
}
.fs-p-no-implant .fs-nhub-type:focus-visible .fs-nhub-type__fig img.fs-nhub-type__view--2 { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .fs-p-no-implant .fs-nhub-type__fig img.fs-nhub-type__view--2 { transition: none !important; }
}

/* P6. 10-12 오후 승인자 「섹션 배경 순서/색」 → 「진단 따로 떼기」 — 진단을 흰 섹션 #diag 로 꺼내고 #types 를 크림으로.
       리듬 = 히어로 · 흰 · 크림 · 흰 · 크림 · 잉크 · 크림 (LOCK 4 (b) 히어로 다음 흰 · (d) 3연속 0).
       진단 상자는 흰 바탕이라 흰 섹션에서 증발한다([[point-card-needs-cream-band]]) → 상자 면을 크림으로. 섹션 안 첫 블록이라 위 여백은 0. */
.fs-p-no-implant #diag .fs-nhub-diag { margin-block-start: 0; }
.fs-p-no-implant #diag .fs-nhub-diag__fig { background: var(--fs-cream); }
.fs-p-no-implant #diag .fs-nhub-diag__list { margin-block-start: var(--fs-gap-title); }   /* 다른 섹션의 «머리 → 본문» 간격과 같게 */

/* P7. 같은 날 승인자 타이포 5항(위계 · 크기·굵기 · 행간 · 자간 · 정렬·줄 길이) — 실측 `typo.py`(로컬 HTTP + 사이트 글꼴, 1920·1440·1024·390·360).
       ① 진단 제목 27px(소제목 크기) → 섹션 머리 형식(마크업 restructure.py: h2.fs-h2 40 + 70px 선, P3 의 가운데 규칙을 그대로 받는다).
       ⑤ 다크 밴드 본문 1920 한 줄 53자 → 34em(≈30자) 두 줄 balance.
       ⑤ 외톨이 줄 — 1024 「…곧게 / 교정」 · 360 히어로 리드 「…화려한 / 코성형」 · 라벨 「(6,7번째 / 연골)」「(엉덩이 / 부위)」 → 짧은 블록 balance(MOBILE_RULES 1-5).
       그대로 둔 것: ② 굵기 400/500/700 · ③ 행간 제목 1.2~1.25 · 본문 1.5 · ④ 자간 제목 −0.006~−0.025em · 본문 −0.01~−0.025em · 영문 킥커 +0.02/+0.06em(fs.css 규격). */
.fs-p-no-implant .fs-nhub-statement__copy .fs-body { max-width: 34em; text-wrap: balance; }
.fs-p-no-implant .fs-nhub-hero__sub,
.fs-p-no-implant .fs-nhub-type__desc,
.fs-p-no-implant .fs-nhub-type__sub,
.fs-p-no-implant .fs-labelbar { text-wrap: balance; }

/* P8. ▼▼▼ 2026-10-12 · 모바일 최적화(승인자 「오늘 수정한 페이지들 다 모바일 최적화 진행」) — 줄바꿈은 전 폭, 배치는 599px 이하만.
       PC 요소 위치 무변화(1024·1440·1920 실측). 백업 _src/build/backup-no-implant-1012-mo/ · 실측 _design/momeasure.py 360/390/540.
       마크업 몫은 mobile_1012.py(restructure.py 끝에서 부른다): 약속 h2 마지막 구 nbsp · 리드 3곳 문장 가운데 <br> → fs-pc-only · 유형 리드 문장 블록.
       고아 줄(360/390, 전): 인용 「… 포시즌에서는 / 가능합니다.」 · h3 「… 디테일이 / 달라집니다.」 · 3D-CT 카드 설명 · 리드 3곳 · 주소 → balance.
       배치: 유형별 6장이 <480 1열(사진 최대 320 · 360 에서 섹션 ≈3,100px)이었고 390~480 에서는 라벨바가 사진보다 넓었다(36.css §8)
       → <600 «사진+라벨바 왼쪽 40% · 글 오른쪽» 행(MOBILE_RULES §2 B). 라벨바 폭 = 사진 폭(LOCK 2). */
.fs-p-no-implant .fs-lead__s { display: block; text-wrap: balance; }
.fs-p-no-implant .fs-quote,
.fs-p-no-implant .fs-h3,
.fs-p-no-implant .fs-nose-lead,
.fs-p-no-implant #cta .fs-lead,
.fs-p-no-implant .fs-card__desc,
.fs-p-no-implant .fs-address { text-wrap: balance; }
@media (max-width: 599px) {
  .fs-p-no-implant .fs-nhub-types { grid-template-columns: minmax(0, 1fr); gap: var(--fs-sp-4); }
  .fs-p-no-implant .fs-nhub-type {
    grid-template-columns: min(40%, 200px) minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    height: auto;
  }
  .fs-p-no-implant .fs-nhub-type__fig { grid-column: 1; grid-row: 1; max-width: none; margin-inline: 0; }
  .fs-p-no-implant .fs-nhub-type .fs-labelbar { grid-column: 1; grid-row: 2; align-self: start; }
  .fs-p-no-implant .fs-nhub-type__body { grid-column: 2; grid-row: 1 / 3; padding: var(--fs-sp-4) var(--fs-sp-5); gap: var(--fs-sp-1); }
  .fs-p-no-implant .fs-nhub-type__sub { font-size: var(--fs-t-body); }
  .fs-p-no-implant .fs-nhub-type__desc { font-size: var(--fs-t-sm); }
  .fs-p-no-implant .fs-nhub-type__more { margin-block-start: var(--fs-sp-2); }
}