/* service/commercial/factory.html — 페이지 전용 보정
 * 원본 반입 CSS(css/base.css + css/style-4.css)가 .service__visual/.com__section-N/
 * .service__swiper-vertical/.service__review/.service__contact 를 이미 정의한다.
 * 이 파일은 반응형 잔여 격차와 COMMON JS 부재로 인한 잔류 은닉만 최소 보정한다
 * (R5 — 전면 재작성 금지, 원본 규칙은 손대지 않음. service-residential-index.css /
 * service-commercial-index.css 와 동일 패턴).
 *
 * COMMON 이슈 임시 완화(이 페이지 스코프만) — css/style-*.css 전체에
 * body{opacity:0;transition:opacity .4s;} 가 있다(원본 lenis/gsap 페이지-로드 리빌 게이트,
 * 전 페이지 공통, service/index.html 빌드에서 최초 발견). 재구현 JS(main.js)가 아직 이
 * 게이트를 풀지 않아 정적 재현 시 body 가 영구 opacity:0 으로 남아 백지 렌더된다.
 * main.js 의 site-wide 배선이 근본대응(COMMON 요청 — notes 참고). 이 페이지는
 * 요청 전까지 최소 완화만 적용.
 */
body { opacity: 1 !important; }

/* R12⑨ 동일 계열 은닉 게이트 — .animate-element 는 원본에서 스크롤 인뷰/로드 시 JS 가
 * .view 클래스를 붙여야 opacity:0→1 로 리빌된다(com__section-01~08, path-custom 등).
 * style-4.css 는 섹션 컨테이너 자신뿐 아니라 .service__title-wr 하위(title-eng/title/desc)와
 * 섹션별 .service__contents-wr 하위 요소에도 각각 개별 은닉 규칙을 건다(예:
 * .animate-element .service__title-wr .title-eng 등 — 전 섹션 공통 셀렉터).
 * main.js 에 아직 사이트 전역 IntersectionObserver 배선이 없어(COMMON 요청 — notes 참고)
 * 정적 재현 시 본문 전 섹션·하위 텍스트가 영구 비노출된다. JS 도착 전까지 콘텐츠가 항상
 * 읽히도록 이 페이지가 쓰는 .animate-element 자신과 그 하위 전체를 포괄 완화한다
 * (레이아웃/트랜지션 원본 규칙은 그대로 두고 opacity/visibility/transform만 강제).
 * ⚠ .path-custom ol > li > ul(브레드크럼 호버 서브메뉴)은 제외 — 이 은닉은 .animate-element
 * 게이트가 아니라 원본 :hover 트리거(정상 동작, .path-custom ol > li:hover > ul 규칙)라
 * 강제로 항상 노출시키면 안 된다(태블릿 뷰포트 밖으로 넘쳐 overflow 유발 — 실측 확인). */


.path-custom ol > li:hover > ul {
    opacity: 1 !important;
    visibility: visible !important;
}

/* 동일 계열 은닉 게이트 — swiper 라이브러리 미수집(COMMON 요청 대상, service-residential-
 * index.css 와 동일 사유)이라 .service__swiper-vertical/.service__review 의 슬라이드가
 * 캐러셀 대신 세로 순차 노출된다(원본은 세로 오토스크롤 리스트 / 가로 카드 슬라이더).
 * pre-init 마크업을 그대로 뒀으므로(R25/2.6) 겹침·클리핑 없이 전량 읽히도록 스택 레이아웃
 * 높이 제한만 완화 — 원본 규칙(.swiper-wrapper flex-direction:column 등)은 그대로 둔다. */
.service__swiper-vertical .service__contents-wr {
    height: auto;
}
.service__review .service__contents-wr .swiper {
    height: auto;
}
.service__review .service__contents-wr .swiper-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 20rem;
}
.service__review .service__contents-wr .swiper-slide {
    width: calc(25% - 15rem);
}
@media all and (max-width: 767px) {
    .service__review .service__contents-wr .swiper-slide {
        width: calc(50% - 10rem);
    }
}