@charset "utf-8";
/**
 * LP 레이아웃(layouts/blank.php)이 **자기가 그리는 요소**에만 쓰는 스타일. (demo-harigraft)
 *
 * ★ 이 파일은 LP 의 디자인이 아니다.
 *   blank.php 의 핵심 규약은 「common.css(본 사이트 디자인)를 싣지 않는다」이고,
 *   각 LP 는 자기 팔레트·타이포·레이아웃을 본문(expertnote_page.contents)의 style 블록에서
 *   직접 갖는다. 그 규약은 그대로다 — 여기 들어오는 것은 **본문이 아니라 레이아웃이 붙이는
 *   요소**(현재는 법정 표기인 외국인환자 유치의료기관 등록번호 줄)의 여백뿐이다.
 *   LP 본문의 모양을 여기서 손대면 안 된다. 그러면 common.css 를 뺀 이유가 사라진다.
 *
 * 인라인 style= / <style> 을 쓸 수 없어(절대 규칙) 파일로 분리했다.
 * bootstrap.min.css 보다 **뒤에** 실려야 한다(아래 !important 설명 참고).
 */

/*
 * ── 하단 고정 CTA 바 회피 여백 ──
 *
 * LP 는 화면 하단에 고정 CTA 바를 둔다(본문의 `.lpcost-bar` 등, position:fixed).
 * 그 바는 자기 아래 패딩에 safe-area 를 **더한다**:
 *     padding: 10px … calc(10px + env(safe-area-inset-bottom));
 * 그래서 노치/홈 인디케이터가 있는 기기에서는 바가 safe-area 만큼 **더 높아진다.**
 *
 * 문서 끝의 등록번호 줄이 고정 여백(pt-4 pb-5 + 래퍼 pb-5 = 96px)만 갖고 있으면
 * 바가 커진 만큼 여유가 깎여 끝까지 스크롤했을 때 표기가 바에 가린다. 실측:
 *     safe-area 0px  → 바 65px, 여유 +31px      (헤드리스 브라우저의 기본값)
 *     safe-area 34px → 바 99px, 여유 -3px       (겹침)
 * ⚠ 헤드리스 브라우저는 env(safe-area-inset-bottom) 을 0 으로 재므로 이 결함이 보이지 않는다.
 *   검증할 때는 값을 실제로 주입해야 한다(--dh-safe-b 오버라이드 또는 CDP).
 *
 * 그래서 바가 늘어나는 만큼 여백도 같이 늘린다 — 여유는 어느 기기에서나 그대로 +31px 이고,
 * safe-area 가 0 인 데스크톱·안드로이드에서는 pb-5(3rem)와 **완전히 같은 값**이라 변화가 없다.
 * 여유가 이미 넉넉한 LP(/lp/smp 는 +74px)에도 빈 공간이 더 생기지 않는다 — 그쪽 바 역시
 * 같은 safe-area 만큼 커지므로 늘어난 여백을 그대로 바가 가져간다.
 *
 * !important 와 pb-5 병기 이유:
 *   부트스트랩 여백 유틸(.pb-5)이 !important 라 그냥은 이길 수 없다. 동일 특이도의
 *   !important 끼리는 나중에 실린 쪽이 이기므로 이 파일을 bootstrap 뒤에 싣는다.
 *   반대로 env() 를 모르는 낡은 브라우저에서는 아래 선언이 통째로 무효가 되어
 *   .pb-5 의 3rem 이 그대로 남는다 — 즉 안전하게 예전 동작으로 되돌아간다.
 *
 * ⚠ 여기에 var() 를 끼우지 말 것. var() 가 들어가면 선언이 파싱 단계는 통과하고
 *   계산 단계에서 무효가 되어 padding-bottom 이 **0** 이 된다(.pb-5 로 돌아가지 않는다).
 *   env() 를 직접 쓰면 파싱 단계에서 버려져 .pb-5 의 3rem 이 살아남는다.
 */
.lp-bar-clear {
    padding-bottom: calc(3rem + env(safe-area-inset-bottom, 0px)) !important;
}
