/* ============================================================
공통 하단 플로팅 CTA 바
쓰는 법 (2줄 + body 속성)
· 페이지 컬럼(--col)에 맞춰 가운데 정렬 — GNB와 동일한 배치 규칙
· z-index 120 (GNB 헤더 130 / 오버레이 메뉴 125 보다 아래 → 메뉴가 덮는다)
· 등장/퇴장 애니메이션 없음 — 항상 같은 자리에 고정
============================================================ */
.floatcta{
position:fixed; left:50%; transform:translateX(-50%);
bottom:0; width:100%; max-width:var(--col,430px);
z-index:120; box-sizing:border-box;
padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));
background:rgba(10,16,22,.94);
-webkit-backdrop-filter:saturate(160%) blur(12px);
backdrop-filter:saturate(160%) blur(12px);
border-top:1px solid rgba(255,255,255,.10);
}
.floatcta__btn{
display:flex; align-items:center; justify-content:center; gap:8px;
width:100%; height:54px; border-radius:12px;
background:#3182F6; color:#fff; text-decoration:none;
font-family:var(--font,'Pretendard Variable','Pretendard',-apple-system,system-ui,sans-serif);
font-size:16px; font-weight:800; letter-spacing:-.02em; line-height:1;
box-shadow:0 6px 20px -8px rgba(49,130,246,.75);
}
.floatcta__btn:visited{color:#fff;}
@media(hover:hover){
.floatcta__btn{transition:background .18s ease;}
.floatcta__btn:hover{background:#1F4ED8;}
}
.floatcta__btn:active{background:#1F4ED8;}
/* 바에 콘텐츠가 가리지 않도록 문서 하단 여백 확보 */
body.floatcta-on{padding-bottom:calc(78px + env(safe-area-inset-bottom,0px));}