/*
 * rb-footer.css — 하단 푸터 전용 스타일
 * 관리자 › Reberry › ⬇️ 하단 푸터 설정 › [CSS 파일] 탭에서 고칠 수 있습니다.
 * 색상은 되도록 var(--rb-*) 를 쓰세요. 그래야 🎨 색상·글꼴 화면에서 바꾼 색이 푸터에도 같이 적용됩니다.
 * [2026-08-04] 푸터 HTML 을 언어별 메뉴 구조에 맞춰 새로 만들면서 함께 정리.
 */

/* ── 전체 배치 : 브랜드 | 메뉴 안내 를 넓은 화면에서 좌우로 ── */
.site-footer__inner {
	display: grid;
	grid-template-columns: minmax(260px, 1fr) 2fr;
	gap: 48px 64px;
	max-width: var(--rb-container, 1200px);
}

/* ── ① 브랜드 ── */
.site-footer__name {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: .01em;
	color: var(--rb-white, #fff);
}
.site-footer__tagline {
	margin: 8px 0 0;
	font-size: .9rem;
	line-height: 1.6;
	color: #a8a39a;
}

/* 상담 버튼 */
.rb-footer-btn {
	display: inline-block;
	margin-top: 20px;
	padding: 12px 24px;
	border-radius: var(--rb-radius, 14px);
	background: var(--rb-brand, #5a6e5d);
	color: var(--rb-white, #fff) !important;
	font-size: .92rem;
	font-weight: 600;
	text-decoration: none;
	transition: background .2s ease, transform .2s ease;
}
.rb-footer-btn:hover,
.rb-footer-btn:focus-visible {
	background: var(--rb-accent, #c97c63);
	transform: translateY(-1px);
}

/* ── ② 메뉴 안내 : 메뉴 이름 + 그 메뉴가 하는 일 ── */
.site-footer__guide {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 28px 32px;
	align-content: start;
}
.site-footer__collink {
	display: inline-block;
	font-size: 1rem;
	font-weight: 600;
	color: var(--rb-white, #fff) !important;
	text-decoration: none;
	border-bottom: 1px solid transparent;
}
.site-footer__collink:hover,
.site-footer__collink:focus-visible {
	border-bottom-color: var(--rb-sage-light, #a6b2a1);
}
.site-footer__coldesc {
	margin: 6px 0 0;
	font-size: .85rem;
	line-height: 1.6;
	color: #8f8a81;
}

/* ── ③ 정보 칸(위젯) · ④ 저작권 : 아래쪽 전체 폭 ── */
.site-footer__widgets,
.site-footer__bottom {
	grid-column: 1 / -1;
}
.site-footer__widgets:empty {
	display: none;
}

/* ── 좁은 화면 ── */
@media (max-width: 860px) {
	.site-footer__inner {
		grid-template-columns: 1fr;
		gap: 36px;
	}
}