/* 가경/홈사이트 UX 강화 — 색상·히어로·갤러리·플로팅CTA·라이트박스·토스트
   (style.css 이후 로드되어 오버라이드) */

/* ── 현장 대표색(--pl-color=네이비) 반영: 스킨 E도 primary를 대표색으로 ── */
body.hs.skin-e{
	--hs-primary:var(--pl-color,#17244A);
	--hs-soft:#F4F7FB;
	--hs-line:#E4E9F1;
	--hs-hero-grad:linear-gradient(100deg,rgba(16,24,44,.82) 0%,rgba(16,24,44,.55) 45%,rgba(16,24,44,.28) 100%);
}

/* ── 버튼 텍스트 대비 강제 (body.hs a{color:inherit} 오버라이드 버그 수정) ──
   배경 어두우면 흰 글자 / 배경 흰색이면 대표색 글자 ── */
body.hs .hs-btn-solid{background:#fff!important;color:var(--hs-primary,#17244A)!important}
body.hs .hs-btn-line{background:transparent!important;color:#fff!important}
body.hs .hs-cta a{background:#fff!important;color:var(--hs-primary,#17244A)!important}
body.hs .hs-nav-btn{background:var(--hs-primary,#17244A)!important;color:#fff!important}
body.hs .hs-mini-btn{background:var(--hs-primary,#17244A)!important;color:#fff!important}
body.hs .hs-submit{background:var(--hs-primary,#17244A)!important;color:#fff!important}
body.hs .hs-quickbar a{color:#fff!important}
body.hs .hs-qb-call{background:#141C2B!important;color:#fff!important}
body.hs .hs-qb-form{background:var(--hs-primary,#17244A)!important;color:#fff!important}
body.hs .hs-qb-kakao{background:#FEE500!important;color:#391B1B!important}
body.hs .hs-fc-book{background:var(--hs-primary,#17244A)!important;color:#fff!important}
body.hs .hs-fc-reg{background:#fff!important;color:var(--hs-primary,#17244A)!important;border:1.5px solid var(--hs-primary,#17244A)}
body.hs .hs-nav-btn:hover,body.hs .hs-fc-book:hover,body.hs .hs-qb-form:hover{filter:brightness(1.1)}

/* ── 히어로: 이미지 잘림 최소화 + 텍스트 좌측 정렬·가독성 ── */
body.hs .hs-hero{min-height:600px}
body.hs .hs-hero>img{object-position:center 32%}
body.hs .hs-hero-in{max-width:1080px;padding:96px 20px}
body.hs .hs-hero h1{max-width:15ch;text-shadow:0 2px 18px rgba(0,0,0,.35)}
body.hs .hs-hero-tag{max-width:34ch}
body.hs .hs-hero-badge{background:rgba(255,255,255,.12);backdrop-filter:blur(3px)}
body.hs .hs-hero-ctas a{transition:transform .15s ease,box-shadow .15s ease}
body.hs .hs-hero-ctas a:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.22)}
body.hs .hs-btn-solid{box-shadow:0 6px 18px rgba(0,0,0,.18)}
@media(max-width:640px){ body.hs .hs-hero{min-height:460px} body.hs .hs-hero-in{padding:64px 20px} }

/* ── 갤러리: PDF/자료 이미지가 잘리지 않게 contain 카드 + 확대 힌트 ── */
body.hs .hs-gallery{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
body.hs .hs-gallery img{
	aspect-ratio:auto;height:210px;width:100%;object-fit:contain;
	background:#fff;border:1px solid var(--hs-line);border-radius:14px;padding:8px;
	cursor:zoom-in;transition:transform .18s ease,box-shadow .18s ease
}
body.hs .hs-gallery img:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(16,24,44,.14)}
body.hs .hs-gallery{position:relative}

/* ── 라이트박스 ── */
.hs-lb{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;
	background:rgba(10,15,28,.92);padding:24px}
.hs-lb.on{display:flex}
.hs-lb-fig{margin:0;max-width:92vw;max-height:88vh;display:flex;flex-direction:column;align-items:center;gap:12px}
.hs-lb-fig img{max-width:92vw;max-height:80vh;object-fit:contain;border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.hs-lb-fig figcaption{color:#e8edf6;font-size:14px;text-align:center}
.hs-lb-x,.hs-lb-prev,.hs-lb-next{position:absolute;background:rgba(255,255,255,.12);border:0;color:#fff;
	cursor:pointer;border-radius:50%;width:52px;height:52px;font-size:24px;line-height:1;display:flex;align-items:center;justify-content:center;transition:background .15s}
.hs-lb-x:hover,.hs-lb-prev:hover,.hs-lb-next:hover{background:rgba(255,255,255,.26)}
.hs-lb-x{top:20px;right:24px;font-size:30px}
.hs-lb-prev{left:20px;top:50%;transform:translateY(-50%)}
.hs-lb-next{right:20px;top:50%;transform:translateY(-50%)}
.hs-lb-count{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);color:#cdd6e6;font-size:13px;letter-spacing:.05em}
@media(max-width:640px){ .hs-lb-prev,.hs-lb-next{width:44px;height:44px;font-size:20px} .hs-lb-x{width:44px;height:44px} }

/* ── 플로팅 CTA 바 (스크롤 시 등장·데스크톱/모바일) ── */
.hs-floatcta{position:fixed;left:50%;bottom:22px;transform:translate(-50%,140%);z-index:80;
	display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--hs-line,#E4E9F1);
	box-shadow:0 12px 40px rgba(16,24,44,.22);border-radius:999px;padding:10px 12px 10px 22px;
	transition:transform .35s cubic-bezier(.2,.8,.2,1);max-width:calc(100vw - 24px)}
.hs-floatcta.on{transform:translate(-50%,0)}
.hs-floatcta .hs-fc-txt{font-size:14px;font-weight:800;color:var(--hs-primary,#17244A);white-space:nowrap}
.hs-floatcta .hs-fc-txt small{display:block;font-size:11.5px;font-weight:600;color:#7e8ca6}
.hs-floatcta a{padding:12px 20px;border-radius:999px;font-size:14.5px;font-weight:800;white-space:nowrap;transition:filter .15s,transform .15s}
.hs-floatcta a:hover{transform:translateY(-1px);filter:brightness(1.06)}
.hs-fc-book{background:var(--hs-primary,#17244A);color:#fff}
.hs-fc-reg{background:#fff;color:var(--hs-primary,#17244A);border:1.5px solid var(--hs-primary,#17244A)}
/* 모바일: 플로팅 CTA 숨김(하단 퀵바가 담당) → 겹침·깨짐 방지 */
@media(max-width:720px){ .hs-floatcta{display:none!important} }

/* ── 상담 알림 토스트 (사회적 증거) ── */
.hs-toast{position:fixed;left:20px;bottom:96px;z-index:74;display:flex;align-items:center;gap:11px;
	background:#fff;border:1px solid var(--hs-line,#E4E9F1);box-shadow:0 10px 34px rgba(16,24,44,.18);
	border-radius:14px;padding:13px 18px 13px 15px;font-size:13.5px;color:#1a2330;max-width:300px;
	opacity:0;transform:translateY(16px);transition:opacity .35s,transform .35s;pointer-events:none}
.hs-toast.on{opacity:1;transform:translateY(0)}
.hs-toast b{color:var(--hs-primary,#17244A);font-weight:800}
.hs-toast-dot{width:9px;height:9px;border-radius:50%;background:#22c55e;flex:0 0 auto;box-shadow:0 0 0 4px rgba(34,197,94,.18);animation:hsPulse 1.6s infinite}
@keyframes hsPulse{0%,100%{box-shadow:0 0 0 3px rgba(34,197,94,.18)}50%{box-shadow:0 0 0 7px rgba(34,197,94,.06)}}
@media(max-width:720px){ .hs-toast{left:12px;right:12px;bottom:66px;max-width:none} }

/* 모바일 퀵바가 있을 때 토스트·CTA 겹침 방지 여백 */
@media(max-width:720px){ body.hs{padding-bottom:0} }