/* ==========================================================================
   MODULE: layout/footer
   푸터 + 소셜 연동(네이버블로그/브런치) + 플로팅 연락 버튼
   ========================================================================== */

.wzs-footer {
	background: var(--wzs-ink);
	color: rgba(255, 255, 255, 0.72);
	padding: var(--wzs-space-7) var(--wzs-space-4) var(--wzs-space-5);
}

.wzs-footer-inner {
	max-width: var(--wzs-container);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.2fr 1fr 1fr;
	gap: var(--wzs-space-6);
}

.wzs-footer-brand .wzs-logo {
	color: var(--wzs-white);
}

.wzs-footer-desc {
	margin-top: var(--wzs-space-2);
	max-width: 320px;
	font-size: var(--wzs-fs-sm);
	line-height: var(--wzs-lh-article);
}

.wzs-footer-col-title {
	font-size: var(--wzs-fs-sm);
	font-weight: 700;
	color: var(--wzs-white);
	margin-bottom: var(--wzs-space-2);
}

.wzs-footer-links {
	display: flex;
	flex-direction: column;
	gap: var(--wzs-space-2);
}

.wzs-footer-links a {
	font-size: var(--wzs-fs-sm);
	transition: color var(--wzs-duration-fast) var(--wzs-ease);
}

.wzs-footer-links a:hover {
	color: var(--wzs-white);
}

/* 소셜 연동: 네이버 블로그 + 브런치 */
.wzs-footer-social {
	display: flex;
	gap: var(--wzs-space-2);
}

.wzs-footer-social a {
	display: inline-flex;
	align-items: center;
	gap: var(--wzs-space-1);
	padding: 8px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.08);
	font-size: var(--wzs-fs-sm);
	font-weight: 600;
	transition: background var(--wzs-duration-fast) var(--wzs-ease);
}

.wzs-footer-social a:hover {
	background: rgba(255, 255, 255, 0.16);
}

.wzs-footer-bottom {
	max-width: var(--wzs-container);
	margin: var(--wzs-space-6) auto 0;
	padding-top: var(--wzs-space-4);
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	font-size: var(--wzs-fs-sm);
	color: rgba(255, 255, 255, 0.5);
}

.wzs-footer-bottom-sep {
	margin: 0 var(--wzs-space-2);
}

.wzs-footer-bottom a {
	color: rgba(255, 255, 255, 0.5);
	text-decoration: underline;
}

.wzs-footer-bottom a:hover {
	color: rgba(255, 255, 255, 0.8);
}

/* --- 플로팅 연락 버튼 (전화/카카오톡/이메일) --- */
.wzs-floating-contact {
	position: fixed;
	right: var(--wzs-space-4);
	bottom: var(--wzs-space-4);
	z-index: 50;
	display: flex;
	flex-direction: column;
	gap: var(--wzs-space-2);
	transition: opacity var(--wzs-duration-base) var(--wzs-ease);
}

/* 히어로 후크 섹션이 화면에 크게 보이는 동안 숨김 — assets/js/modules/floating-contact.js 참고.
   후크 자체 CTA와 겹치는 문제(특히 모바일)를 막기 위함. */
.wzs-floating-contact.is-hidden {
	opacity: 0;
	pointer-events: none;
}

.wzs-floating-contact a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var(--wzs-white);
	color: var(--wzs-ink);
	box-shadow: var(--wzs-shadow-lg);
	transition: transform var(--wzs-duration-fast) var(--wzs-ease), background var(--wzs-duration-fast) var(--wzs-ease);
}

.wzs-floating-contact a:hover {
	transform: scale(1.08);
}

.wzs-floating-contact a.wzs-fc-kakao {
	background: #fee500;
}

.wzs-floating-contact a svg {
	width: 24px;
	height: 24px;
}

@media (max-width: 720px) {
	.wzs-footer-inner {
		grid-template-columns: 1fr;
	}
}