/* ==========================================================================
   assets/page/49.css — 낮은코 · 코성형 플래그십 전용 (.fs-p-49 스코프)
   · 색은 --fs-* 토큰과 rgba(0,0,0/255,255,255) 스크림만 사용. 새 hex 0개.
   · 새 모션마다 prefers-reduced-motion 무효화 규칙을 파일 끝에 짝으로 둔다.

   전용 컴포넌트 (slug = low-nose)
     .fs-low-nose-hero    모델 풀블리드 --tall 히어로 (투명 헤더 오버레이)
     .fs-low-nose-band    A09 다크 스테이트먼트 밴드 (고스트 사진 포함)
     .fs-low-nose-dx      진단 6항목 도해 칩 그리드 (라벨바 6개)
     .fs-low-nose-tri     자가연골 삼중고정 3겹 스테이지 ★ 시그니처
     .fs-low-nose-flow    술식 4단계 흐름 (필 + 도해 + 라벨바)
     .fs-low-nose-mat     자가재료 4종 정사각 도해 타일
     .fs-low-nose-care    A18 겹친 패널 카드 2장 (패널 돌출량 보정)
   ========================================================================== */

/* --- 셸 · A01 · 1mm 계열 «투명 헤더 + 모델 히어로» 첫 화면 ---------------
   3장 크로스페이드 다큐컷 히어로를 모델 한 장으로 바꿨다. 히어로 상단은 전 폭이 짙은
   그래파이트(#1E1F23)라 «흰 글자» 가 16:1 로 넉넉하다 — 스크림이 필요 없다.
   모델 얼굴은 사진 높이의 24.6% 아래에서 시작해 헤더 띠(최대 16%)에 안 걸린다.
   ------------------------------------------------------------------------- */
.fs-p-49 {
  --fs-header-overlay-bg: transparent;
}
/* 오버레이 헤더 뒤에 실제로 깔리는 색. 사진이 그 위를 덮으므로 화면은 그대로지만
   사진 로딩 전 번쩍임이 없고, qa.py 가 배경을 흰 body 로 오판하지 않는다. */
.fs-p-49 .fs-page--overlay { background: #1E1F23; }
.fs-p-49 .fs-header--overlay::before { content: none; }
.fs-p-49 .fs-gnb__link { font-weight: 400; opacity: .92; }
.fs-p-49 .fs-gnb__link:hover,
.fs-p-49 .fs-gnb__link:focus-visible { opacity: 1; }
.fs-p-49 .fs-util__link { opacity: .8; }
.fs-p-49 .fs-util__link:hover { opacity: 1; }
.fs-p-49 .fs-util__sep { opacity: .3; }

.fs-p-49 .fs-low-nose-hero { color: var(--fs-on-dark); background: #1E1F23; }
.fs-p-49 .fs-low-nose-hero .fs-hero__bg picture { display: block; width: 100%; height: 100%; }
/* 사진을 2.07:1 로 잘라 구웠다 — 얼굴 24.6% · 어깨선 73% 라 어느 폭에서도
   헤더 띠에 안 걸리면서 어깨선까지 들어온다. 그래서 세로 크롭은 «위 고정». */
.fs-p-49 .fs-low-nose-hero .fs-hero__bg img { object-position: 50% 0%; }
.fs-p-49 .fs-low-nose-hero .fs-hero__copy { max-width: min(100%, 34rem); }
.fs-p-49 .fs-low-nose-hero .fs-hero__kicker {
  font-size: var(--fs-t-kicker); font-weight: 500;
  letter-spacing: var(--fs-ls-wide); color: var(--fs-on-dark);
}
.fs-p-49 .fs-low-nose-hero .fs-hero__title { color: var(--fs-on-dark); line-height: 1.12; }

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

/* --- A09 · 다크 스테이트먼트 밴드 --------------------------------------- */
/* .fs-section__bg 를 쓰지 않고 .fs-split 을 직계 자식으로 두므로
   z-index 함정(콘텐츠가 배경에 덮임)이 없다. 고스트는 카피 칼럼 안에 둔다. */
.fs-p-49 .fs-low-nose-band__fig { display: block; height: 100%; }
.fs-p-49 .fs-low-nose-band__fig img {
  display: block; width: 100%; height: 100%; min-height: clamp(280px, 220px + 12vw, 604px);
  object-fit: cover;
}
.fs-p-49 .fs-low-nose-band__copy {
  position: relative; z-index: 1; isolation: isolate;
  display: grid; gap: clamp(16px, 12px + 1vw, 26px);
  padding: clamp(56px, 34px + 4.4vw, 130px) var(--fs-gutter);
}
.fs-p-49 .fs-low-nose-band__ghost {
  position: absolute; z-index: -1;
  inset-block-start: 50%; inset-inline-end: 0;
  width: min(74%, 520px); height: auto;
  transform: translateY(-50%);
  opacity: .30;
}
.fs-p-49 .fs-low-nose-band__copy > *:not(.fs-low-nose-band__ghost) { position: relative; }
.fs-p-49 .fs-low-nose-band__quote {
  font-size: var(--fs-t-quote); font-weight: 700; color: var(--fs-on-dark);
}
.fs-p-49 .fs-low-nose-band__copy .fs-lead,
.fs-p-49 .fs-low-nose-band__copy .fs-body { color: var(--fs-on-dark); }
.fs-p-49 .fs-low-nose-band__close {
  margin-block-start: var(--fs-sp-2);
  padding-block-start: clamp(14px, 11px + 0.6vw, 22px);
  border-block-start: 1px solid rgba(255, 255, 255, .28);
  font-size: var(--fs-t-lead); line-height: var(--fs-lh-body); font-weight: 600;
  color: var(--fs-on-dark);
}

/* --- 섹션 머리 공통 (fs-nose-head 는 justify-items:start 라 중앙정렬이 안 먹는다) --- */
.fs-p-49 .fs-nose-head.fs-center { justify-items: center; }

/* --- A03 · 상담 사진 / 진단 6항목 --------------------------------------- */
.fs-p-49 .fs-low-nose-consult__intro {
  display: grid; gap: clamp(12px, 9px + 0.8vw, 20px); justify-items: center;
  margin-block-end: var(--fs-gap-title);
}
.fs-p-49 .fs-low-nose-consult__frame { display: block; overflow: hidden; }
.fs-p-49 .fs-low-nose-consult__frame img { display: block; width: 100%; height: auto; }
.fs-p-49 .fs-low-nose-consult__copy { display: grid; align-content: start; gap: clamp(12px, 9px + 0.8vw, 20px); }
.fs-p-49 .fs-low-nose-consult__sub {
  margin-block-start: clamp(14px, 10px + 1vw, 28px);
  font-size: var(--fs-t-h3); font-weight: 700; line-height: var(--fs-lh-head);
}

.fs-p-49 .fs-low-nose-dx {
  display: grid; gap: var(--fs-gap-card);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-block-start: clamp(18px, 14px + 1vw, 30px);
}
@media (min-width: 1024px) { .fs-p-49 .fs-low-nose-dx { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* 칩의 면은 «섹션 배경과 다른 쪽» 이어야 한다. 이 섹션은 흰색이라 흰 타일은
   증발하고 라벨바만 남아 «띠 위에 동그라미» 로 읽힌다(1920 실측 아이콘 108px /
   바 264px). 아이콘을 바 폭에 맞춰 키우면 짧은 변이 120px 을 넘어 LOCK 2 의
   캡션 판정 대상이 되고, 그때는 폭 불일치가 곧 FAIL 이다(6장 2항 b-1·d).
   → 아이콘은 그대로 두고 칩에 면을 준다. 바가 그 면의 밑변이 된다. */
.fs-p-49 .fs-low-nose-dx__fig { display: grid; background: var(--fs-cream); }
.fs-p-49 .fs-section--cream .fs-low-nose-dx__fig { background: var(--fs-white); }
.fs-p-49 .fs-low-nose-dx__fig img {
  display: block; justify-self: center;
  width: clamp(78px, 68px + 3vw, 108px); height: auto;
  padding-block: clamp(12px, 9px + 0.8vw, 20px);
}
.fs-p-49 .fs-low-nose-dx__fig .fs-labelbar {
  min-height: clamp(36px, 33px + 0.9vw, 46px);
  padding-inline: var(--fs-sp-2);
  font-size: var(--fs-t-body); line-height: 1.3;
}
.fs-p-49 .fs-low-nose-dx__sum {
  margin-block-start: var(--fs-gap-card);
  min-height: clamp(46px, 41px + 1.4vw, 62px);
  line-height: 1.35;
}

/* --- A05 · 자가연골 삼중고정 3겹 스테이지 ★ 시그니처 -------------------- */
.fs-p-49 .fs-low-nose-tri-sec .fs-low-nose-tri__head { justify-items: center; }
.fs-p-49 .fs-low-nose-tri {
  display: grid; gap: clamp(28px, 20px + 2.2vw, 60px);
  justify-items: center; align-items: center;
  margin-block-start: var(--fs-gap-title);
}
@media (min-width: 1024px) {
  .fs-p-49 .fs-low-nose-tri { grid-template-columns: minmax(0, 620fr) minmax(0, 520fr); }
}
.fs-p-49 .fs-low-nose-tri__anatomy { display: grid; width: min(100%, 620px); }
.fs-p-49 .fs-low-nose-tri__anatomy img { display: block; width: 100%; height: auto; }

.fs-p-49 .fs-low-nose-tri__stage { display: grid; gap: var(--fs-sp-4); width: min(100%, 520px); }
.fs-p-49 .fs-low-nose-tri__layers { display: grid; gap: 0; }
.fs-p-49 .fs-low-nose-tri__layer {
  display: grid; align-items: center; column-gap: clamp(8px, 5px + 0.8vw, 16px);
  grid-template-columns: clamp(42px, 36px + 1.6vw, 58px) minmax(0, 1fr);
}
.fs-p-49 .fs-low-nose-tri__layer img { display: block; width: 100%; height: auto; }
.fs-p-49 .fs-low-nose-tri__num {
  display: grid; place-items: center;
  width: 100%; aspect-ratio: 1;
  border: 2px solid var(--fs-teal); border-radius: var(--fs-radius-round);
  background: var(--fs-white); color: var(--fs-teal-dk);
  font-size: var(--fs-t-sm); font-weight: 700;
}
/* 라벨바는 확대 원 아래에만 깔린다 — 번호 칼럼만큼 들여쓴다 */
.fs-p-49 .fs-low-nose-tri__cap {
  margin-inline-start: calc(clamp(42px, 36px + 1.6vw, 58px) + clamp(8px, 5px + 0.8vw, 16px));
}
.fs-p-49 .fs-low-nose-tri__text {
  display: grid; gap: var(--fs-sp-4); justify-items: center; text-align: center;
  margin-block-start: var(--fs-sp-3);
}
@media (min-width: 1024px) { .fs-p-49 .fs-low-nose-tri__text { grid-column: 1 / -1; margin-block-start: 0; } }

/* 스크롤 진입 시 세 겹이 위·아래에서 모여 맞닿는다.
   fs.js 가 첫 화면 요소에는 .fs-reveal 을 붙이지 않으므로 반드시
   .fs-reveal 을 함께 요구해야 영구 은닉이 생기지 않는다. */
.fs-p-49 .fs-low-nose-tri__layer {
  transition: transform var(--fs-dur-slow) var(--fs-ease), opacity var(--fs-dur-slow) var(--fs-ease);
}
:root.fs-js .fs-p-49 .fs-low-nose-tri__stage.fs-reveal:not(.is-in) .fs-low-nose-tri__layer { opacity: 0; }
:root.fs-js .fs-p-49 .fs-low-nose-tri__stage.fs-reveal:not(.is-in) .fs-low-nose-tri__layer--1 { transform: translateY(-46px); }
:root.fs-js .fs-p-49 .fs-low-nose-tri__stage.fs-reveal:not(.is-in) .fs-low-nose-tri__layer--3 { transform: translateY(46px); }
.fs-p-49 .fs-low-nose-tri__layer--2 { transition-delay: 120ms; }
.fs-p-49 .fs-low-nose-tri__layer--3 { transition-delay: 240ms; }

/* --- A12 · 술식 4단계 흐름 ---------------------------------------------- */
.fs-p-49 .fs-low-nose-flow {
  display: grid; gap: var(--fs-gap-card);
  grid-template-columns: minmax(0, 1fr);
  margin-block-start: var(--fs-gap-title);
}
@media (min-width: 600px)  { .fs-p-49 .fs-low-nose-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .fs-p-49 .fs-low-nose-flow { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.fs-p-49 .fs-low-nose-flow__item {
  position: relative;
  display: grid; align-content: start; justify-items: center;
  gap: clamp(12px, 9px + 0.8vw, 18px);
}
.fs-p-49 .fs-low-nose-flow__fig { position: relative; display: grid; width: 100%; background: var(--fs-white); }
.fs-p-49 .fs-low-nose-flow__fig img {
  display: block; width: 100%; aspect-ratio: 1; object-fit: cover;
}
.fs-p-49 .fs-low-nose-flow__fig img.fs-low-nose-flow__ill { object-fit: contain; padding: var(--fs-sp-3); }
.fs-p-49 .fs-low-nose-flow__desc { text-align: center; }
/* 스텝 커넥터 — fs-steps__link 와 같은 3px 틸 막대 (도해 세로 중앙에 자동 정렬) */
@media (min-width: 1024px) {
  .fs-p-49 .fs-low-nose-flow__item + .fs-low-nose-flow__item .fs-low-nose-flow__fig::before {
    content: ""; position: absolute;
    inset-block-start: 50%; transform: translateY(-50%);
    inset-inline-start: calc(-1 * var(--fs-gap-card)); width: var(--fs-gap-card); height: 3px;
    background: var(--fs-step-bg);
  }
  .fs-p-49 .fs-low-nose-flow__item + .fs-low-nose-flow__item--2 .fs-low-nose-flow__fig::before {
    background: linear-gradient(90deg, var(--fs-teal) 0%, var(--fs-teal-mid) 100%);
  }
}

/* --- A15 · 자가재료 4종 도해 타일 --------------------------------------- */
.fs-p-49 .fs-low-nose-mat-head { margin-block-start: clamp(56px, 40px + 3.4vw, 110px); }
.fs-p-49 .fs-low-nose-mat-head .fs-body { margin-block-start: var(--fs-sp-3); }
.fs-p-49 .fs-low-nose-mat {
  display: grid; gap: var(--fs-gap-card);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-block-start: clamp(24px, 18px + 1.6vw, 44px);
}
@media (min-width: 1024px) { .fs-p-49 .fs-low-nose-mat { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.fs-p-49 .fs-low-nose-mat__fig { display: grid; background: var(--fs-white); }
.fs-p-49 .fs-low-nose-mat__fig img {
  display: block; width: 100%; aspect-ratio: 1; object-fit: contain;
  padding: clamp(8px, 5px + 0.8vw, 16px);
}
.fs-p-49 .fs-low-nose-mat__fig .fs-labelbar {
  min-height: clamp(36px, 33px + 0.9vw, 50px);
  padding-inline: var(--fs-sp-2); line-height: 1.3;
}

.fs-p-49 .fs-low-nose-process__note {
  margin-block-start: clamp(26px, 20px + 1.6vw, 46px);
  color: var(--fs-ink-soft);
}

/* --- A06 · POINT 카드 (설명이 2~3줄이라 정사각 고정을 풀었다) ----------- */
/* 설명 줄 수가 3·4·3·3 이라 카드가 li 안에서 제각각 끝난다(실측 369/426/369/402).
   높이를 채우고 내용을 위로 붙여 POINT 필 4개가 같은 선에서 시작하게 한다.
   (fs.css 의 .fs-card--point 는 align-content:center 라 높이를 채우면 필이 흩어진다) */
.fs-p-49 .fs-low-nose-point {
  height: 100%;
  align-content: start;
  gap: clamp(14px, 11px + 0.8vw, 22px);
  padding-block-end: clamp(22px, 18px + 1.2vw, 38px);
  background: var(--fs-white);
}
.fs-p-49 .fs-low-nose-point .fs-card__icon {
  width: clamp(84px, 78px + 1.4vw, 106px); height: clamp(84px, 78px + 1.4vw, 106px);
  aspect-ratio: auto;
}
.fs-p-49 .fs-low-nose-point .fs-card__icon img { width: 100%; height: 100%; object-fit: contain; }
.fs-p-49 .fs-low-nose-point .fs-card__title { text-align: center; }
.fs-p-49 .fs-low-nose-point .fs-card__desc { text-align: center; color: var(--fs-ink-soft); }

/* --- A07 · 룰 카드 (소제목 2개 + 설명) ---------------------------------- */
.fs-p-49 .fs-low-nose-promise__list { margin-block-start: var(--fs-gap-title); }
.fs-p-49 .fs-low-nose-rule .fs-card__num { align-self: start; }
@media (min-width: 1024px) {
  /* 소제목이 없는 카드라 기본 1fr 타이틀 칼럼이 비어 보인다 — 폭을 줄인다 */
  .fs-p-49 .fs-low-nose-rule { grid-template-columns: auto minmax(0, 0.5fr) minmax(0, 1.65fr); align-items: start; }
}
.fs-p-49 .fs-low-nose-rule .fs-card__title { align-self: start; }
.fs-p-49 .fs-low-nose-rule__group { display: grid; gap: var(--fs-sp-1); }
.fs-p-49 .fs-low-nose-rule__group + .fs-low-nose-rule__group { margin-block-start: var(--fs-sp-5); }
.fs-p-49 .fs-low-nose-rule__sub { font-size: var(--fs-t-sub); font-weight: 700; color: var(--fs-teal-dk); }

/* --- A18 · 회복 케어 겹친 패널 카드 ------------------------------------- */
.fs-p-49 .fs-low-nose-care__grid { --fs-panel-w: 62%; margin-block-start: var(--fs-gap-title); }
@media (min-width: 1024px) { .fs-p-49 .fs-low-nose-care__grid { padding-block-end: var(--fs-panel-drop, 72px); } }
.fs-p-49 .fs-low-nose-care__card { background: var(--fs-white); }
.fs-p-49 .fs-low-nose-care__img { display: block; width: 100%; height: auto; }
.fs-p-49 .fs-low-nose-care__card .fs-card__panel { gap: var(--fs-sp-3); }
.fs-p-49 .fs-low-nose-care__card .fs-card__desc { color: var(--fs-ink-soft); }

/* --- A14 · 전후 사례 도트 (7사례) --------------------------------------- */
/* fs.css 는 PC 도트를 3번째부터 숨긴다(4사례 기준 하드코딩). 사례가 7개이므로 되돌린다. */
@media (min-width: 64rem) {
  .fs-p-49 .fs-nose-ba [data-fs-carousel-dots] > .fs-carousel__dot:nth-child(n+3) { display: inline-flex; }
}

/* --- prefers-reduced-motion — 위에서 만든 모션 전부 최종 정적 상태로 ----- */
@media (prefers-reduced-motion: reduce) {
  .fs-p-49 .fs-low-nose-tri__layer {
    transform: none !important; opacity: 1 !important;
    transition: none !important; transition-delay: 0s !important;
  }
}

/* ==========================================================================
   진단 패스 [2026-08-27] — 렌더 판독으로 확인한 것만
   검출기가 준 5개 기회(A~E) 중 실제로 해당하는 것은 E 하나다.
   B 는 밴드 사진 평균 휘도 67.6(<110)이라 겹침이 안 먹고,
   A 는 4열이며(5열 아님), C 는 스티키 이동거리가 119px 뿐이고,
   D 는 «도해 축» 이 아니라 .fs-ba__pair(BEFORE/AFTER)를 축으로 오독한 값이다.
   ========================================================================== */

/* --- E. POINT 4카드 — 크림 밴드 위 흰 상자 4개 → 헤어라인으로 나뉜 한 면 ---
   48 의 .fs-lef-op 는 상자를 아예 지웠지만 여기서는 그럴 수 없다.
   POINT 아이콘 4장(assets/nose/icon-point-0*.png)은 **알파가 없는 흰 배경 PNG** 라
   카드를 투명하게 만들면 크림 밴드 위에 흰 정사각형 4개가 그대로 드러난다(렌더 확인).
   → 상자를 지우는 대신 **붙인다.** gap 0 + 세로 헤어라인이면 «상자 4개의 나열» 이
   «4열로 나뉜 한 면» 이 되고, 아이콘의 흰 배경도 그 면 안에서 사라진다. */
@media (min-width: 1024px) {
  .fs-p-49 .fs-low-nose-points .fs-nose-cards { gap: 0; }
  .fs-p-49 .fs-low-nose-points .fs-nose-cards > li { position: relative; }
  .fs-p-49 .fs-low-nose-point { padding-inline: clamp(24px, 1.8vw, 40px); }
  /* 제목이 1줄·2줄로 갈려 설명 첫 줄이 어긋난다 — 2줄 자리를 미리 잡아둔다 */
  .fs-p-49 .fs-low-nose-point .fs-card__title {
    min-height: calc(2em * var(--fs-lh-head));
  }
  /* 세로 구분선 — 첫 칸을 제외한 모든 칸 왼쪽에.
     z-index 를 빼면 안 된다 — .fs-card 가 position:relative 라 트리 순서상
     ::before 보다 뒤에 칠해지고, 카드의 흰 배경이 선을 덮는다(렌더로 확인). */
  .fs-p-49 .fs-low-nose-points .fs-nose-cards > li + li::before {
    content: "";
    position: absolute;
    z-index: 1;
    inset-block: clamp(12px, 0.9vw, 20px);
    inset-inline-start: 0;
    width: 1px;
    background: var(--fs-line-input);
  }
  /* ★ 칸을 붙였으면 3D 틸트는 꺼야 한다. 네 칸이 변을 맞대고 있는데 한 칸만
     기울면 맞댄 변이 벌어져 «한 면» 이 도로 네 상자로 깨진다.
     헤드리스는 FINE_POINTER 게이트에 걸려 initTilt 가 조기 return 하므로
     스크린샷·vibecheck·qa 어디에도 안 잡힌다 — 마우스를 올릴 때만 나온다.
     (광택은 흰 면 위 rgba(255,255,255,.55) 라 원래 보이지 않으므로 그대로 둔다) */
  .fs-p-49 .fs-low-nose-points .fs-tilt__inner { transform: none; }
}

/* --- 룰 카드의 틸트를 끈다 ---------------------------------------------
   .fs-low-nose-rule 에는 [data-fs-tilt-inner] 가 없다. fs.js 는 그럴 때
   card.firstElementChild 를 inner 로 삼는데(fs.js:320) 그게 <span class="fs-card__num">01</span>
   이라, 호버하면 **번호 «01» 한 글자만 3D 로 기울고** 광택 span 이 그 안에 주입된다.
   프레임 없는 글자를 기울이는 건 53 에서 터진 것과 같은 종류다.
   헤드리스는 FINE_POINTER 게이트에 막혀 이 상태를 못 잡는다 — iframe 프로브로 확인했다. */
.fs-p-49 .fs-low-nose-rule .fs-tilt__inner { transform: none; }
.fs-p-49 .fs-low-nose-rule .fs-tilt__gloss { opacity: 0 !important; }

/* --- 제목 뒤 70px 틸 선 (48 검증분) ------------------------------------- */
.fs-p-49 .fs-nose-head h2,
.fs-p-49 .fs-low-nose-consult__copy h2 { position: relative; }

.fs-p-49 .fs-nose-head h2::after,
.fs-p-49 .fs-low-nose-consult__copy h2::after {
  content: "";
  display: block;
  width: 70px;
  height: 1px;
  margin-block-start: var(--fs-sp-4);
  background: var(--fs-teal);
  transform-origin: left center;
  transform: scaleX(1);
  transition: transform var(--fs-dur-slow) var(--fs-ease-out) .5s;
}
/* 가운데정렬 머리에서는 선도 가운데에서 벌어진다 */
.fs-p-49 .fs-nose-head.fs-center h2::after {
  margin-inline: auto;
  transform-origin: center;
}
/* ★ 초기 은닉을 «.is-in 이면 보이기» 로 짜면 안 된다 — fs.js 는 첫 화면 안에
   있던 대상에는 .fs-reveal 클래스 자체를 붙이지 않아 선이 영원히 안 그어진다.
   기본을 「그어진 상태」로 두고 실제 리빌 대상에만 초기 은닉을 건다. */
:root.fs-js .fs-p-49 h2.fs-reveal:not(.is-in)::after,
:root.fs-js .fs-p-49 .fs-reveal:not(.is-in) h2::after { transform: scaleX(0); }

/* --- 호버 — 프레임은 고정, 사진만 움직인다 (48 검증분) ------------------
   그림자는 쓰지 않는다(2차 규칙). 대상은 프레임이 있는 사진뿐이다.
   술식 4단계는 제외한다 — .fs-low-nose-flow__fig 의 커넥터가 도해 상자 «밖» 에
   그려지는 ::before 라서 overflow:hidden 을 걸면 틸 막대가 잘려 사라진다. */
.fs-p-49 .fs-low-nose-consult__frame img,
.fs-p-49 .fs-low-nose-care__img {
  transition: transform var(--fs-dur-slow) var(--fs-ease-out);
}
.fs-p-49 .fs-low-nose-care__frame { display: block; overflow: hidden; }

@media (hover: hover) and (pointer: fine) {
  .fs-p-49 .fs-low-nose-consult__fig:hover .fs-low-nose-consult__frame img,
  .fs-p-49 .fs-low-nose-care__card:hover .fs-low-nose-care__img { transform: scale(1.045); }

  /* 라벨바는 사진과 함께 커지면 안 된다 — 글자가 흔들린다. 대신 색만 한 단계 */
  .fs-p-49 .fs-low-nose-consult__fig:hover .fs-labelbar {
    background: var(--fs-teal-dk);
    transition: background var(--fs-dur) var(--fs-ease);
  }
}

@media (prefers-reduced-motion: reduce) {
  .fs-p-49 .fs-nose-head h2::after,
  .fs-p-49 .fs-low-nose-consult__copy h2::after {
    transform: scaleX(1) !important;
    transition: none !important;
  }
  .fs-p-49 .fs-low-nose-consult__frame img,
  .fs-p-49 .fs-low-nose-care__img {
    transform: none !important;
    transition: none !important;
  }
}

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

/* ==========================================================================
   ▼▼▼ 2026-10-22 · 모바일 최적화(승인자 「홈페이지 전체적인 모바일 최적화 진행」) — 줄바꿈은 전 폭, 배치는 599px/767px/1023px 이하만.
   PC 요소 위치 무변화(1024·1440·1920 실측). 백업 _src/build/backup-49-1022-mo · 실측 _design/momeasure.py 360/390/540/768.
   · <br> 문장 블록 14곳(상담 리드 · 다크 밴드 맺음 · 술식 노트 · POINT 설명 4 · 약속 카드 6 · 회복 리드) — 360 에서 「세심하게 듣고」「않습니다.」「판단합니다.」 외톨이.
   · balance: 라벨바 · 전후 주의문 · #triple 제목 · 재료 머리 h3 · #care 제목. nbsp 4(「포시즌에서는 가능합니다.」「보형물에 따라」「디테일이 달라집니다.」「(6,7번째 연골)」).
   · #triple 제목 «형광 칸 + 합니다» 를 한 덩어리로(MOBILE_RULES §7-19 — .fs-mark 가 inline-block 이라 「고정 / 합니다.」).
   · 술식 4단계 <600: 1열 «필 · 도해 · 라벨바 · 설명» 세로(장당 ≈480px) → §2 B «도해+라벨바 좌 42% · 필 + 설명 우» 행. 600 이상은 2열 그대로.
   ========================================================================== */
.fs-p-49 .fs-lead__s { display: block; text-wrap: balance; }
.fs-p-49 .fs-labelbar,
.fs-p-49 .fs-nose-ba__note,
.fs-p-49 #triple-title,
.fs-p-49 .fs-low-nose-mat-head .fs-h3,
.fs-p-49 #care-title { text-wrap: balance; }
.fs-p-49 .fs-p49-keep { white-space: nowrap; }
@media (max-width: 599px) {
  .fs-p-49 .fs-low-nose-flow__item {
    grid-template-columns: min(42%, 200px) minmax(0, 1fr);
    grid-template-areas: "fig pill" "fig desc";
    align-content: center;
    justify-items: start;
    column-gap: var(--fs-sp-5);
    row-gap: var(--fs-sp-2);
  }
  .fs-p-49 .fs-low-nose-flow__item > .fs-pill { grid-area: pill; align-self: end; }
  .fs-p-49 .fs-low-nose-flow__fig { grid-area: fig; }
  .fs-p-49 .fs-low-nose-flow__desc { grid-area: desc; align-self: start; text-align: start; font-size: var(--fs-t-body); }   /* §2 H — 170px 칸에서 「3D-CT로 정확한 / 진단과」 3줄 */
}