/* ==========================================================================
   74 · 브이핏주사 (slug: vfit) — 이 페이지 전용 CSS
   · 모든 셀렉터는 .fs-p-74 스코프
   · 색은 --fs-* 토큰만 사용 (새 hex 0개)
   ========================================================================== */

/* --- 1. 셸 · A01 · 1mm 계열 «투명 헤더 + 모델 히어로» 첫 화면 ---------------
   헤더를 흰 막대로 세우지 않고 히어로 사진 위에 얹는다. 이 페이지의 히어로 상단은
   전 폭이 따뜻한 아이보리(#F9F3EB)라 흰 글자가 아니라 «잉크 글자» 를 쓴다.
   에셋 실측: 모델 최상단이 사진 높이의 23.6%(1072 중 253px) 라 헤더 띠가 사진에서
   차지하는 최대 구간(1280 폭에서 ≈11.5%)에 안 걸린다. */
.fs-p-74 {
  --fs-header-overlay-bg: transparent;
}
/* 오버레이 헤더 뒤에 실제로 깔리는 색. 사진이 그 위를 덮으므로 화면은 그대로지만
   사진 로딩 전 번쩍임이 없고, qa.py 가 배경을 흰 body 로 오판하지 않는다. */
.fs-p-74 .fs-page--overlay { background: #F9F3EB; }
.fs-p-74 .fs-header--overlay { color: var(--fs-ink); }
.fs-p-74 .fs-header--overlay::before { content: none; }
.fs-p-74 .fs-gnb__link { font-weight: 400; }
/* fs.css 의 오버레이 규칙은 «흰 글자» 전제라 호버가 흰색이다 — 밝은 헤더에선 반대로 */
.fs-p-74 .fs-header--overlay .fs-gnb__link:hover,
.fs-p-74 .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-74 .fs-header--overlay .fs-util__link { color: var(--fs-ink-soft); }
.fs-p-74 .fs-header--overlay .fs-util__link:hover { color: var(--fs-teal-dk); opacity: 1; }
.fs-p-74 .fs-util__sep { opacity: .35; }
/* fs.css:3052 의 «호버 시 흰 글자» 도 다크 히어로 전제다 — 밝은 헤더에선 사라진다 */
.fs-p-74 .fs-header--overlay .fs-allmenu:hover { color: var(--fs-teal-dk); opacity: 1; }

/* fs.css 의 .fs-hero__bg img 규칙은 <picture> 를 건너뛴다 */
.fs-p-74 .fs-vfit-hero .fs-hero__bg picture { display: block; width: 100%; height: 100%; }
/* 세로 크롭 위치. 0% 면 1920 에서 머리끝이 y=253 이라 헤더 띠(100px) 아래가 통째로 빈다.
   25% 로 내려 위쪽을 잘라내면 머리끝이 y≈174 로 올라와 형제 페이지 143(≈178)과 맞는다.
   1326px 미만은 사진 세로가 히어로에 딱 맞아 이 값이 무효다. */
.fs-p-74 .fs-vfit-hero .fs-hero__bg img { object-position: 50% 25%; }
.fs-p-74 .fs-vfit-hero .fs-hero__copy {
  max-width: min(100%, 50vw);
  gap: var(--fs-sp-5);
  justify-items: start; text-align: start;
  color: var(--fs-ink);
}
.fs-p-74 .fs-vfit-hero .fs-h1 { color: var(--fs-ink); }
.fs-p-74 .fs-vfit-hero__rule { width: 56px; height: 3px; background: var(--fs-teal); }
.fs-p-74 .fs-vfit-hero .fs-lead { max-width: 30em; color: var(--fs-ink-soft); }
.fs-p-74 .fs-vfit-hero__tags { display: flex; flex-wrap: wrap; gap: var(--fs-sp-1); list-style: none; }

/* <1024px — 히어로 박스가 가로로 길어져 오버레이로는 카피와 모델이 겹친다.
   카피를 아이보리 밴드로 위에 쌓고 세로 크롭 사진을 아래에 붙인다. 사진 윗단은 페이드로
   녹여 이음매를 없앤다. 밴드색은 세로 에셋 상단 실측값(#FBF2EB). */
@media (max-width: 1023px) {
  .fs-p-74 .fs-vfit-hero { min-height: 0; background: #FBF2EB; }
  .fs-p-74 .fs-vfit-hero .fs-hero__bg {
    position: static; inset: auto; z-index: 0; grid-row: 2;
  }
  .fs-p-74 .fs-vfit-hero .fs-hero__bg img {
    height: auto; aspect-ratio: 3 / 4; object-position: 50% 0%;
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 60px);   /* 2026-10-22 모바일 §1-8 72 → 60 */
            mask-image: linear-gradient(180deg, transparent 0, #000 60px);
  }
  .fs-p-74 .fs-vfit-hero .fs-hero__inner {
    grid-row: 1; background: #FBF2EB;
    padding-block: calc(var(--fs-header-h) + var(--fs-sp-5)) var(--fs-sp-7);   /* 2026-10-22 모바일 §1-8 40/56 → 20/30 */
  }
  .fs-p-74 .fs-vfit-hero .fs-hero__copy { max-width: 100%; }
}

/* --- 2. 케이스 카드 : 실사 + 라벨바 + 부위 도해 --------------------------- */
.fs-p-74 .fs-vfit-case {
  display: grid; grid-template-rows: auto 1fr;
  background: var(--fs-cream);
}
.fs-p-74 .fs-vfit-case__fig { margin: 0; display: grid; overflow: hidden; }
.fs-p-74 .fs-vfit-case__img {
  display: block; width: 100%; aspect-ratio: 590 / 663; object-fit: cover;
}
.fs-p-74 .fs-vfit-case__note {
  display: flex; align-items: center; gap: var(--fs-sp-3);
  padding: var(--fs-sp-5);
  font-size: var(--fs-t-lead); font-weight: 600; color: var(--fs-ink);
}
.fs-p-74 .fs-vfit-case__zone {
  flex: 0 0 auto; width: clamp(42px, 36px + 1.7vw, 58px); height: auto;
}

/* --- 3. 시술 스펙 박스 : 아이콘 + 라벨바 + 값 ----------------------------- */
.fs-p-74 .fs-vfit-spec {
  display: grid; grid-template-rows: 1fr auto auto;
  background: var(--fs-cream); text-align: center;
}
.fs-p-74 .fs-vfit-spec__icon {
  display: grid; place-items: center;
  padding: clamp(22px, 15.6px + 1.78vw, 44px) var(--fs-sp-5);
}
.fs-p-74 .fs-vfit-spec__icon img { width: auto; max-width: 100%; height: clamp(60px, 48px + 3.3vw, 100px); }
.fs-p-74 .fs-vfit-spec__value {
  padding: var(--fs-sp-5) var(--fs-sp-3);
  font-size: var(--fs-t-lead); font-weight: 600;
}

/* --- 4. 다크 인용 밴드 --------------------------------------------------- */
.fs-p-74 .fs-vfit-shout .fs-section__bg img { opacity: .26; }
.fs-p-74 .fs-vfit-shout__quote { text-align: center; }
.fs-p-74 .fs-vfit-shout__quote span { display: inline-block; }
.fs-p-74 .fs-vfit-shout__tail { display: grid; justify-items: center; margin-block: var(--fs-sp-5); }
.fs-p-74 .fs-vfit-shout__tail svg { width: 42px; height: 22px; color: var(--fs-teal); }
.fs-p-74 .fs-vfit-shout__grid {
  display: grid; gap: var(--fs-gap-col); align-items: center;
  margin-block-start: var(--fs-sp-8);
}
.fs-p-74 .fs-vfit-shout__fig { margin: 0; overflow: hidden; }
.fs-p-74 .fs-vfit-shout__fig img {
  display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover;
}
.fs-p-74 .fs-vfit-shout__answer { text-align: center; }
@media (min-width: 768px) {
  .fs-p-74 .fs-vfit-shout__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr) minmax(0, 1fr);
  }
}

/* --- 5. 시그니처 : 회차별 만족도 라인 차트 -------------------------------- */
.fs-p-74 .fs-vfit-chart { margin: 0; display: grid; gap: var(--fs-sp-3); }
.fs-p-74 .fs-vfit-chart__yaxis {
  font-size: var(--fs-t-pill); font-weight: 700; color: var(--fs-ink);
}
.fs-p-74 .fs-vfit-chart__plot svg { display: block; width: 100%; height: auto; }
.fs-p-74 .fs-vfit-chart__xaxis {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
  list-style: none; text-align: center;
}
.fs-p-74 .fs-vfit-chart__xaxis li {
  font-size: var(--fs-t-pill); line-height: 1.35; color: var(--fs-ink-soft);
}
.fs-p-74 .fs-vfit-chart__xaxis b { display: block; font-weight: 600; color: var(--fs-ink); }
.fs-p-74 .fs-vfit-chart__xlabel {
  text-align: right; font-size: var(--fs-t-pill); font-weight: 700; color: var(--fs-ink);
}
.fs-p-74 .fs-vfit-chart__keys { display: flex; flex-wrap: wrap; gap: var(--fs-sp-2); list-style: none; }
.fs-p-74 .fs-vfit-chart__keys .fs-labelbar { min-height: 34px; padding-inline: var(--fs-sp-5); }
.fs-p-74 .fs-vfit-key--gray { background: var(--fs-fill-gray); }
.fs-p-74 .fs-vfit-diff__note { color: var(--fs-muted-2); }
.fs-p-74 .fs-vfit-diff__fig { margin: 0; overflow: hidden; }
.fs-p-74 .fs-vfit-diff__fig img {
  display: block; width: 100%; aspect-ratio: 1160 / 500; object-fit: cover; object-position: 18% center;
}

/* --- 6. 효과 룰 카드 : 아이콘 + 라벨바 + 설명 ----------------------------- */
.fs-p-74 .fs-vfit-effect { background: var(--fs-white); }
.fs-p-74 .fs-vfit-effect__icon {
  display: grid; place-items: center;
  width: clamp(80px, 62px + 4.7vw, 130px);
  padding-block: var(--fs-sp-2);
}
.fs-p-74 .fs-vfit-effect__icon img { width: 100%; height: auto; }
.fs-p-74 .fs-vfit-effect__head .fs-labelbar {
  min-height: clamp(36px, 31.6px + 1.22vw, 50px); padding-inline: var(--fs-sp-5);
}
.fs-p-74 .fs-vfit-effect__side { margin: 0; overflow: hidden; }
.fs-p-74 .fs-vfit-effect__side img {
  display: block; width: 100%; aspect-ratio: 640 / 760; object-fit: cover;
}

/* --- 6b. 틸트 광택을 가두는 프레임 (인라인 style 대체) --- */
.fs-p-74 .fs-vfit-frame { display: block; overflow: hidden; }

/* --- 7. 특별함 타일 ------------------------------------------------------ */
.fs-p-74 .fs-vfit-tile { margin: 0; display: grid; }
.fs-p-74 .fs-vfit-tile img {
  display: block; width: 100%; aspect-ratio: 466 / 290; object-fit: cover;
}

/* --- 8. Q&A 아코디언 (details/summary) ------------------------------------ */
.fs-p-74 .fs-vfit-faq { list-style: none; }
.fs-p-74 .fs-vfit-faq__item { border-block-end: 1px solid var(--fs-line); }
.fs-p-74 .fs-vfit-faq__item:first-child { border-block-start: 1px solid var(--fs-line); }
.fs-p-74 .fs-vfit-faq__q {
  display: flex; align-items: center; justify-content: space-between; gap: var(--fs-sp-5);
  padding: var(--fs-sp-6) 0; cursor: pointer; list-style: none;
  font-size: var(--fs-t-lead); font-weight: 700; color: var(--fs-ink);
}
.fs-p-74 .fs-vfit-faq__q::-webkit-details-marker { display: none; }
.fs-p-74 .fs-vfit-faq__q::after {
  content: ""; flex: 0 0 auto; width: 10px; height: 10px;
  border-inline-end: 2px solid var(--fs-teal-dk);
  border-block-end: 2px solid var(--fs-teal-dk);
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform var(--fs-dur, .35s) var(--fs-ease, ease);
}
.fs-p-74 .fs-vfit-faq__d[open] .fs-vfit-faq__q::after { transform: rotate(-135deg) translate(-2px, -2px); }
.fs-p-74 .fs-vfit-faq__a { padding: 0 0 var(--fs-sp-6); color: var(--fs-muted); }
.fs-p-74 .fs-vfit-faq__mark { color: var(--fs-teal-dk); font-weight: 700; margin-inline-end: 6px; }
.fs-p-74 .fs-vfit-faq__fig { margin: 0; overflow: hidden; }
.fs-p-74 .fs-vfit-faq__fig img {
  display: block; width: 100%; aspect-ratio: 860 / 836; object-fit: cover;
}
.fs-p-74 .fs-vfit-faq__fig--wide img { aspect-ratio: 1200 / 520; }

@media (prefers-reduced-motion: reduce) {
  .fs-p-74 .fs-vfit-faq__q::after { transition: none !important; }
}

/* --- 9. 차트 SVG 스트로크 (토큰 색을 SVG 로 넘긴다) ----------------------- */
.fs-p-74 .fs-vfit-chart__axis { stroke: var(--fs-ink); }
.fs-p-74 .fs-vfit-chart__grid { stroke: var(--fs-step-idle); }
.fs-p-74 .fs-vfit-chart__line--a { stroke: var(--fs-teal-dk); }
.fs-p-74 .fs-vfit-chart__line--b { stroke: var(--fs-fill-gray); }
.fs-p-74 .fs-vfit-chart__dot--a { fill: var(--fs-teal-dk); }
.fs-p-74 .fs-vfit-chart__dot--b { fill: var(--fs-fill-gray); }

/* ==========================================================================
   ▼▼▼ 진단·수정 패스 — 2026-08-28
   근거: _design/QA/74.md. 48.css 「V70 승격분」·113.css·122.css 에서 검증된 패턴.
   ========================================================================== */

/* --------------------------------------------------------------------------
   F1 [접근성] 부작용 고지문이 흰 배경에서 4.12:1 (AA 4.5 미달 · 1920·360 양쪽 검출)
   --fs-muted-2 #7D7D7D 는 토큰 주석대로 «약관 본문» 용이고 4.12:1 은 흰 배경 전제값이다.
   흰 바탕에서 4.5 를 넘는 텍스트 잉크 토큰은 ink / ink-soft 뿐이라 ink-soft(10.5:1) 로 올린다.
   (113.css F1 · 152.css F2 와 같은 처방)
   -------------------------------------------------------------------------- */
.fs-p-74 .fs-vfit-diff__note { color: var(--fs-ink-soft); }

/* --------------------------------------------------------------------------
   F2 [구조] 600~1023 에서 서브 히어로의 h1 이 통째로 첫 화면 밖으로 밀린다
   .fs-split 은 1024 미만에서 1열이 되는데 <source> 경계는 599 였다. 그래서
   600~1023 은 세로 원본(hero.jpg 1040x1212)을 전폭으로 깔았고,
   __media 의 min-height 는 «바닥» 이지 «천장» 이 아니라 아무것도 막지 못했다
   (img 의 height:100% 는 부모에 height 가 없어 auto 로 풀린다).
   1023px 실측: 사진만 1192px → 킥커·h1·리드·태그 전부 폴드 아래.
   확정 시안 57·91 의 서브 히어로는 h1 이 언제나 첫 화면 안에 있다.
   → HTML 의 media 를 1023 으로 넓혀 이 구간용으로 만들어져 있던 가로 원본
     (hero-mo.jpg 900x734)을 쓰게 한다. 1023px 사진 높이 1192 → 834.
   ※ object-position 은 이 구간에서 손대지 않는다 — 세로 넘침이 0 이라 무효다.
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   F3 [구조] 태블릿 마지막 줄 고아 카드
   fs.css:332~334 는 600~1023 구간에서 --3 을 일률 2열로 만든다.
   케이스 3장은 «이중턱 / 볼살 / 얼굴라인» 병렬이라 2+1 이 되면 셋째만 떨어져 나간다.
   열 수만 손본다(순서·비율은 그대로). 113.css F2 · 48.css F 와 같은 처방.
   -------------------------------------------------------------------------- */
@media (min-width: 600px) and (max-width: 1023px) {
  .fs-p-74 #about .fs-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* --------------------------------------------------------------------------
   F4 [V70-D] 인접 섹션의 도해가 같은 쪽 — 축을 반전시킨다
   검출: D:S4+S5 둘 다 Ll (S4 차이=차트 좌 / S5 효과=사진 좌).
   두 밝은 섹션이 연달아 「좌 도해 / 우 카피」라 같은 리듬으로 붙어 단조롭다.
   효과 섹션에서 축을 뒤집는다 → 차트 좌 · 효과 우 · Q&A 좌 로 번갈아 읽힌다.
   ★ 트랙 폭(--fs-split)은 HTML 인라인에서 980fr/420fr 로 교환했다.
     order 만 바꾸고 폭을 그대로 두면 사진이 980 칸에 들어간다.
   ★ 1024 미만은 건드리지 않는다 — 모바일은 사진이 먼저 와야 읽힌다.
   -------------------------------------------------------------------------- */
@media (min-width: 1024px) {
  .fs-p-74 #effect .fs-split > .fs-vfit-effect__side { order: 2; }
  .fs-p-74 #effect .fs-split > .fs-stack             { order: 1; }
}

/* --------------------------------------------------------------------------
   F5 [V70-C] 효과 섹션 좌우 높이 차 118px
   검출기는 sticky 자리(fig499 / copy617)로 잡았지만 실측 이동거리가 118px 뿐이라
   스티키는 «움직이는 척»만 한다. 대신 도해를 행 높이까지 늘려 크림 밴드 아래쪽에
   생기던 빈 면을 없앤다.
   model-jawline.jpg 는 640x914(0.700)이고 늘어난 칸은 420x617(0.681)이라
   cover 크롭이 사실상 없다 — 인물컷 비율 왜곡이 아니다.
   -------------------------------------------------------------------------- */
@media (min-width: 1024px) {
  .fs-p-74 #effect .fs-split { align-items: stretch; }
  .fs-p-74 .fs-vfit-effect__side,
  .fs-p-74 .fs-vfit-effect__side .fs-vfit-frame { height: 100%; }
  .fs-p-74 .fs-vfit-effect__side img { height: 100%; aspect-ratio: auto; }
}

/* --------------------------------------------------------------------------
   F6 [다크 밴드] 고스트 사진에 블러가 없다
   band-ghost.jpg 가 opacity .26 만 걸린 채 선명해서 마스크·장갑 낀 손·주사기가
   그대로 읽힌다 — 인용문 뒤에 «반쯤 가려진 두번째 장면» 이 겹쳐 보인다.
   127·128·51·46·50·140·36 이 쓰는 처방(블러 20~24px)을 따른다.
   ★ transform 은 쓰지 않는다 — .fs-parallax__layer.fs-anim-active 가 스크롤 중
     transform 을 통째로 덮어써서 오버스캔이 사라진다. 대신 음수 마진으로 넓힌다.
     패럴랙스가 최대 67px 아래로 밀어도 위쪽 여유가 남도록 100px 를 준다.
   -------------------------------------------------------------------------- */
.fs-p-74 .fs-vfit-shout .fs-section__bg img {
  display: block;
  width: calc(100% + 200px);
  height: calc(100% + 200px);
  margin: -100px;
  filter: blur(20px);
}

/* --------------------------------------------------------------------------
   F7 [마이크로 인터랙션] 섹션 제목 뒤 70px 틸 선 — 48.css B 에서 검증된 구현
   ★ 「.is-in 이면 보이기」로 짜면 첫 화면 제목의 선이 영원히 안 그어진다.
     fs.js 는 첫 화면 대상에 .fs-reveal 클래스 자체를 안 붙인다.
     → 기본을 「그어진 상태」로 두고 .fs-reveal:not(.is-in) 에만 초기 은닉.
   ★ 선택자는 :where() 로 감싼다. ID 를 그대로 쓰면 명시도가 초기 은닉 규칙을 이겨
     선이 «항상 그어진 채» 굳는다.
   다크 밴드 대제목(#shout-title)에는 걸지 않는다 — 틸 하이라이트 박스가 이미 강조다.
   -------------------------------------------------------------------------- */
.fs-p-74 .fs-nose-head h2,
.fs-p-74 :where(#faq-title) { position: relative; }

.fs-p-74 .fs-nose-head h2::after,
.fs-p-74 :where(#faq-title)::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;
}
:root.fs-js .fs-p-74 :where(h2.fs-reveal:not(.is-in))::after,
:root.fs-js .fs-p-74 :where(.fs-reveal:not(.is-in)) h2::after { transform: scaleX(0); }

/* --------------------------------------------------------------------------
   F8 [마이크로 인터랙션] 호버 — 프레임은 고정, 사진만 scale(1.045)
   그림자는 쓰지 않는다(2차 규칙). 라벨바는 사진과 함께 커지면 안 되므로
   figure 가 아니라 img 에만 건다.
   프레임의 overflow:hidden 은 __fig · __side · frame · __fig(faq) 에 이미 있고,
   .fs-vfit-tile 만 없어 여기서 채운다.
   -------------------------------------------------------------------------- */
.fs-p-74 .fs-vfit-tile { overflow: hidden; }

.fs-p-74 .fs-vfit-case__img,
.fs-p-74 .fs-vfit-tile img,
.fs-p-74 .fs-vfit-effect__side img,
.fs-p-74 .fs-vfit-faq__fig img {
  transition: transform var(--fs-dur-slow) var(--fs-ease-out);
}

@media (hover: hover) and (pointer: fine) {
  .fs-p-74 .fs-vfit-case:hover .fs-vfit-case__img,
  .fs-p-74 .fs-vfit-tile:hover img,
  .fs-p-74 .fs-vfit-effect__side:hover img,
  .fs-p-74 .fs-vfit-faq__fig:hover img { transform: scale(1.045); }
}

/* --------------------------------------------------------------------------
   F9 reduced-motion — 위에서 더한 것은 전부 정지 상태로 확정
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .fs-p-74 .fs-nose-head h2::after,
  .fs-p-74 :where(#faq-title)::after { transform: scaleX(1) !important; transition: none !important; }

  .fs-p-74 .fs-vfit-case__img,
  .fs-p-74 .fs-vfit-tile img,
  .fs-p-74 .fs-vfit-effect__side img,
  .fs-p-74 .fs-vfit-faq__fig img { transition: none !important; transform: none !important; }
}

/* ==========================================================================
   ▼▼▼ 2026-10-22 · 모바일 최적화(승인자 「홈페이지 전체적인 모바일 최적화 진행」) — 줄바꿈은 전 폭, 배치는 599px/1023px 이하만.
   PC 요소 위치 무변화(1024·1440·1920 실측). 백업 _src/build/backup-74-1022-mo · 실측 _design/momeasure.py 360/390/540/768/1024/1440/1920.
   · 히어로 §1-8 20/30/60 — <1024 스택 블록 제자리 수정(페이드 72 → 60).
   · 리드 `<br>` 3곳 → 문장 블록(.fs-lead__s, §1-4): 히어로 · 정의 리드(같은 문장) · 차이 리드. 360 에서 「녹이고」「배출시켜주는 시술입니다.」 가 짧은 줄로 갈렸다.
   · balance(전 폭): 본문 · 인용 · ※ 주의문 · 주소 — 360 「높습니다.」「발생할 수 있습니다.」, 1440 인용 「있습니다.」 · FAQ 답 「사용하고 있습니다.」.
   ========================================================================== */
.fs-p-74 .fs-lead__s { display: block; text-wrap: balance; }
.fs-p-74 .fs-body,
.fs-p-74 .fs-quote,
.fs-p-74 .fs-vfit-diff__note,
.fs-p-74 .fs-address { text-wrap: balance; }

/* 배치(§2 A) — 시술 스펙 4칸(시계·밴드·달력·하트): fs.css .fs-grid--4 가 600 미만 1열이라 360 에서 칸마다 ≈190px 한 줄씩 쌓였다 → 2×2.
   값(「일주일 간격」 등)은 155px 칸에 한 줄로 든다. 600~1023 은 원래 2열. */
@media (max-width: 599px) {
  .fs-p-74 .fs-grid--4:has(> li > .fs-vfit-spec) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--fs-sp-4);
  }
  .fs-p-74 .fs-vfit-spec__value { padding-inline: var(--fs-sp-2); font-size: var(--fs-t-body); }
}