/**
 * Footer dùng chung.
 */

.site-footer {
	/* Nền tranh núi + lông phượng theo Figma (lớp "cuyoi") */
	--footer-bg-image: url("../images/home/footer-bg.webp");

	padding: clamp(6rem, -5.7143rem + 18.3036vw, 16.25rem) 0 clamp(5rem, -4.6429rem + 15.067vw, 13.4375rem); /* trên 96 → 260, dưới 80 → 215 */
	background: var(--footer-bg-image, none) center top / cover no-repeat, var(--color-bg);
	color: var(--color-heading);
	font-size: var(--fs-md);
}

.site-footer__inner {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--space-xl);
}

/* Cụm logo + slogan như Figma */
.site-footer__logo {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 0.25rem;
}

.site-footer__slogan {
	width: clamp(13rem, 4.0714rem + 13.9509vw, 20.5625rem); /* 208 → 329 */
	height: auto;
}

/* Dùng logo chính, chỉ đổi kích thước hiển thị */
.site-footer__logo .site-logo {
	width: clamp(3.5rem, 2.2857rem + 1.8973vw, 5rem); /* 56 → 80 (theo Figma) */
	height: auto;
}

/* Khi chưa tải logo lên: hiện tên site */
.site-logo--text {
	color: var(--color-heading);
	font-family: var(--font-title);
	font-size: var(--fs-title-sm);
}

.site-footer__investor {
	margin-top: var(--space-sm);
}

.site-footer__title {
	display: block;
	margin-bottom: var(--space-sm);
	color: var(--color-heading);
	font-family: var(--font-body);
	font-size: var(--fs-md);
	font-weight: var(--fw-bold);
	line-height: var(--lh-heading);
	text-transform: uppercase;
}

.site-footer__investor .site-footer__title {
	margin-bottom: 0.25em;
}

.site-footer__links,
.contact-list {
	display: grid;
	gap: var(--space-xs);
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-footer__links a {
	transition: color var(--duration) var(--ease);
}

.site-footer__links a:hover,
.contact-list a:hover {
	color: var(--color-gradient-end);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.contact-list {
	gap: var(--space-sm);
}

.contact-list li,
.contact-list a {
	display: flex;
	align-items: flex-start;
	gap: 0.6em;
}

.contact-list span {
	min-width: 0;
	overflow-wrap: anywhere;
}

.contact-list__icon {
	flex: none;
	width: 1.15em;
	height: 1.15em;
	margin-top: 0.1em;
	object-fit: contain;
}

@media (max-width: 1279.98px) {
	.site-footer__inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 599.98px) {
	.site-footer__inner {
		grid-template-columns: minmax(0, 1fr);
	}
}