/*
 * Footer toàn site — Figma node 59:238 (1440×424)
 * Nền: ảnh toàn cảnh + gradient Primary (109.8°, 80% → 100%), hoạ tiết G (375) cách phải 40, trên 19.
 * Nội dung 1280 tại (80, 39): 3 cột 566 / 1fr / 1fr (gap 32) → đường kẻ #DBC3B2 → dòng miễn trừ.
 */

#footer {
	background: none;
}

.vg-footer {
	position: relative;
	overflow: hidden;
	padding: 39px 16px 86px;
	background:
		linear-gradient(109.82deg, rgba(22, 45, 82, 0.8) 11.76%, rgb(22, 45, 82) 97.98%),
		url("../images/footer/footer-bg.webp") center 70.7% / 100% auto no-repeat,
		var(--vg-color-primary);
	color: #d8e9f8;
	font-family: var(--vg-font-body);
}

.vg-footer__pattern {
	position: absolute;
	top: 19px;
	right: 40px;
	width: 375px;
	height: 375px;
	max-width: none;
	opacity: 0.18; /* Figma: hoạ tiết chìm vào nền */
	pointer-events: none;
}

.vg-footer__inner {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 32px;
	max-width: 1280px;
	margin: 0 auto;
}

.vg-footer__cols {
	display: grid;
	grid-template-columns: 566px minmax(0, 1fr) minmax(0, 1fr);
	gap: 32px;
	padding-bottom: 32px;
	border-bottom: 1px solid var(--vg-color-body-gold);
}

.vg-footer a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease;
}

.vg-footer a:hover {
	color: var(--vg-color-secondary);
}

/* Cột 1 */
.vg-footer__brand {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.vg-footer__logo img {
	display: block;
	width: 193px;
	height: auto;
}

.vg-footer__brand p {
	max-width: 507px;
	margin: 0;
	font-size: 16px;
	line-height: 1.5;
	letter-spacing: -0.005em;
}

/* Tiêu đề cột */
.vg-footer__heading {
	margin: 0;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: -0.005em;
}

/* Cột 2 */
.vg-footer__links {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.vg-footer__links ul {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
	line-height: 1.5;
}

.vg-footer__links li {
	margin: 0;
}

/* Cột 3 */
.vg-footer__contact {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.vg-footer .vg-footer__hotline {
	color: var(--vg-color-body-gold);
	font-family: var(--vg-font-heading);
	font-size: 36px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.02em;
}

.vg-footer__info {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
	line-height: 1.5;
}

.vg-footer__info-item {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
}

.vg-footer__info-item::before {
	content: "";
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	background-color: #d8e9f8;
	-webkit-mask: var(--vg-icon) center / 20px 20px no-repeat;
	mask: var(--vg-icon) center / 20px 20px no-repeat;
}

.vg-footer__info-item--mail {
	--vg-icon: url("../icons/mail.svg");
}

.vg-footer__info-item--location {
	--vg-icon: url("../icons/location.svg");
}

.vg-footer__ctas {
	display: flex;
	align-items: center;
	gap: 16px;
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
}

.vg-footer__ctas span {
	width: 1px;
	height: 13px;
	background-color: #a37956;
}

.vg-footer__disclaimer {
	margin: 0;
	color: var(--vg-color-body-gold);
	font-size: 14px;
	line-height: 1.5;
}

@media (max-width: 1199.98px) {
	.vg-footer {
		padding-bottom: 48px;
		background-size: auto, cover, auto;
	}

	.vg-footer__cols {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vg-footer__brand {
		grid-column: 1 / -1;
	}
}

@media (max-width: 689.98px) {
	.vg-footer__cols {
		grid-template-columns: minmax(0, 1fr);
	}

	.vg-footer__pattern {
		width: 240px;
		height: 240px;
		right: -60px;
	}
}