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

/* 동일 계열 은닉 게이트 — .swiper 컨테이너도 로드 시 opacity:0 상태로 시작해 GSAP/스와이퍼
 * 초기화가 없으면 영구 비노출된다(res__section-03 워크플로 카드, res__section-05-1 리스트,
 * res__section-05 세로 스와이퍼 전부 포함). 라이브러리 재초기화 전까지 최소 가시성 확보. */


/* swiper 라이브러리 미수집(COMMON 요청 대상) — pre-init 마크업만 있어 슬라이드가
 * 캐러셀 대신 세로로 순차 노출된다(원본은 가로 카드 슬라이더/세로 오토스크롤 리스트).
 * 겹침·클리핑 없이 전량 읽히도록 리스트형 스와이퍼의 높이 제한만 완화. */
.res__section-05-1 .service__contents-wr .list {
    height: auto;
    aspect-ratio: auto;
}
.res__section-05-1 .service__contents-wr .list .swiper {
    height: auto !important;
}
/* 원본은 Swiper.js direction:'vertical' 옵션으로 이 리스트를 세로 오토스크롤 티커로 굴린다
 * (런타임에 swiper-wrapper 에 flex-direction:column 인라인을 건다 — stylediff 스펙 실측
 * swiper-initialized 상태 기준). 미초기화 상태에서는 site-wide 기본 .swiper-wrapper{display:flex}
 * 만 걸려 가로 한 줄로 눌린다. JS 부재(COMMON) 상태에서도 원본과 동일하게 세로로 읽히도록
 * 최소 강등(원본 클래스 유지, 재저작 아님). */
.res__section-05-1 .service__contents-wr .list .swiper-wrapper {
    flex-direction: column;
}

/* COMMON 결핍(swiper 라이브러리 미반입) 임시 완화 — index.css 의 main__section-02 와 동일
 * 패턴(guardrails 기존 판단 준용). res__section-03(워크플로 5카드) 는 원본이 Swiper.js 로
 * 가로 카드 슬라이더를 굴리는데, 미초기화 상태에서는 .swiper-wrapper 가 기본 block 흐름으로
 * 카드 5장을 세로로 쌓아 stylediff 스펙(가로 배열 시 높이) 대비 컨테이너 높이가 부풀어난다.
 * 원본 시각(카드 가로 나열)과 동일한 구조를 유지하는 최소 강등 — 원본 클래스는 그대로 둔다. */
.res__section-03 .swiper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.res__section-03 .swiper-wrapper {
    display: flex;
    flex-wrap: nowrap;
}
.res__section-03 .swiper-slide {
    flex: 0 0 auto;
}
.res__section-03 .swiper-pagination {
    position: static;
}

/* R3 태블릿 리플로우 보정 — 공통 헤더(partials/header.html, .header__gnb 등)의 762rem 값이
 * style-3.css 스킨과 달리 style-4.css 스킨 조합에서 768px 폭을 소폭(약 3px) 초과한다.
 * 헤더 마크업/치수 자체는 이 페이지 쓰기범위 밖(COMMON) — 문서 가로 스크롤만 여기서 봉쇄. */
html, body {
    overflow-x: hidden;
}
