@charset "utf-8";
/* =====================================================
   FOOTER — Claude Design v2 (딥 세이지 · 세이지 크림 콘트라스트)
   ===================================================== */

.site-footer {
	position:relative;
	background:oklch(0.28 0.045 148);
	color:oklch(0.85 0.02 130);
	padding:96px 0 40px;
	overflow:hidden;
}
.site-footer::before {
	content:""; position:absolute;
	top:-40%; left:-6%;
	width:520px; height:520px; border-radius:50%;
	background:oklch(0.42 0.08 148 / 0.35);
	filter:blur(60px);
	pointer-events:none;
}
.site-footer::after {
	content:""; position:absolute;
	bottom:-30%; right:-8%;
	width:420px; height:420px; border-radius:50%;
	background:oklch(0.80 0.09 140 / 0.10);
	filter:blur(60px);
	pointer-events:none;
}

.site-footer .footer-inner {
	position:relative; z-index:1;
	width:min(1240px, 92vw); margin:0 auto;
	padding:0 !important;
}

/* ── 브랜드 헤드 ── */
.footer-brand {
	display:flex; align-items:center; gap:24px;
	padding-bottom:44px; margin-bottom:44px;
	border-bottom:1px solid oklch(0.98 0.008 120 / 0.10);
}
.footer-brand .footer-logo {
	height:38px; width:auto;
	filter:brightness(0) invert(1);
	opacity:0.95;
}
.footer-brand .footer-slogan {
	font-family:var(--f_display);
	font-size:var(--fs20);
	font-weight:700;
	letter-spacing:-0.02em;
	color:oklch(0.94 0.02 130);
}

/* ── 그리드 ── */
.footer-grid {
	display:grid;
	grid-template-columns:1.2fr 1.4fr 1fr;
	gap:60px;
	margin-bottom:56px;
}
.footer-col-title {
	font-family:var(--f_ui);
	font-size:var(--fs12);
	font-weight:700;
	letter-spacing:0.22em;
	text-transform:uppercase;
	color:oklch(0.80 0.09 140);
	margin-bottom:22px;
}
.footer-col ul {
	list-style:none; padding:0; margin:0;
	display:flex; flex-direction:column; gap:10px;
}
.footer-col ul li {
	font-size:var(--fs14);
	line-height:1.75;
	color:oklch(0.85 0.02 130);
}
.footer-col ul li strong {
	display:inline-block; min-width:70px;
	font-family:var(--f_ui);
	font-size:var(--fs11);
	font-weight:700;
	letter-spacing:0.14em;
	color:oklch(0.75 0.06 140);
}
.footer-col ul li a {
	color:inherit;
	transition:color .2s ease;
}
.footer-col ul li a:hover { color:oklch(0.85 0.10 140); }

.footer-address {
	font-style:normal;
	font-size:var(--fs14);
	line-height:1.85;
	color:oklch(0.85 0.02 130);
}
.footer-sitemap li a { display:block; padding:2px 0; }

/* ── 하단 카피 ── */
.footer-bottom {
	padding-top:28px;
	border-top:1px solid oklch(0.98 0.008 120 / 0.10);
	display:flex; justify-content:space-between; align-items:center;
	font-size:var(--fs14);
	color:oklch(0.68 0.03 148);
}
.footer-bottom a { color:inherit; transition:color .2s ease; }
.footer-bottom a:hover { color:oklch(0.85 0.02 130); }

/* ── 맨위로 버튼 ── */
.gotop {
	position:fixed; right:28px; bottom:28px;
	width:48px; height:48px; border-radius:50%;
	background:oklch(0.55 0.09 148);
	color:oklch(0.98 0.008 120);
	display:flex; align-items:center; justify-content:center;
	z-index:800;
	opacity:0; pointer-events:none;
	transform:translateY(10px);
	transition:opacity .3s ease, transform .3s ease, background .2s ease;
	box-shadow:0 12px 28px oklch(0.30 0.05 148 / 0.25);
}
.gotop.on {
	opacity:1; pointer-events:auto;
	transform:translateY(0);
}
.gotop:hover {
	background:oklch(0.50 0.10 148);
	transform:translateY(-3px);
}
.gotop svg { width:20px; height:20px; }

/* ==================== 태블릿 이하 (~1199) ==================== */
@media screen and (max-width:1199px) {
	.site-footer { padding:72px 0 32px; }
	.footer-brand { flex-direction:column; align-items:flex-start; gap:14px; padding-bottom:36px; margin-bottom:36px; }
	.footer-grid { grid-template-columns:1fr 1fr; gap:40px; }
	.footer-col-title {margin-bottom:20px;}
	.footer-bottom { flex-direction:column; gap:10px; text-align:center; }
}

/* ==================== 모바일 (~767) ==================== */
@media screen and (max-width:767px) {
	.site-footer { padding:56px 0 28px; }
	.footer-brand .footer-logo { height:32px; }
	.footer-brand .footer-slogan { font-size:var(--fs17); }
	.footer-grid { grid-template-columns:1fr; gap:28px; margin-bottom:40px; }
	.footer-col-title {margin-bottom:10px;}
	.footer-col ul li { font-size:var(--fs13); }
	.gotop { right:16px; bottom:16px; width:42px; height:42px; }
}