/* Footer theo mẫu: bốn cột trên nền mái che nhạt, các điểm nhấn xanh/vàng. */
.site-footer { border-top: 0; background: #fff; color: #494b55; }
.ft-main { background: linear-gradient(rgba(255,255,255,.3), rgba(255,255,255,.3)), url("../images/footer-bg-vina.webp") center bottom / cover no-repeat; }
.site-footer .ft-grid {
	width: 90%; max-width: 1370px;
	grid-template-columns: 32fr 22fr 27fr 19fr;
	gap: 0; padding: 40px 0 28px;
}
.site-footer .ft-col { min-width: 0; padding: 5px 24px 0; border-left: 1px solid rgba(35, 72, 48, .1); }
.site-footer .ft-about { padding: 0 24px 0 0; border-left: 0; }
.site-footer .ft-logo { display: block; margin-bottom: 10px; line-height: 0; }
.site-footer .ft-logo img { width: 170px; margin-bottom: 0; }
.ft-company { position: relative; margin: 0 0 11px; padding-bottom: 10px; color: #123f25; font-size: 13px; line-height: 1.4; font-weight: 800; }
.ft-company::after, .site-footer .ft-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 36px; height: 2px; background: #ffbe16; }
.site-footer .ft-contact li { align-items: flex-start; gap: 10px; margin: 0 0 5px; font-size: clamp(13px, .97vw, 14px); line-height: 1.4; }
.site-footer .ft-contact li:last-child { margin-bottom: 0; }
.ft-contact-icon { display: flex; align-items: center; justify-content: center; flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%; background: #f0f6ed; border: 1px solid #e4ece0; box-shadow: inset 0 -2px 3px rgba(45,76,33,.08), 0 1px 2px rgba(0,0,0,.03); }
.site-footer .ft-contact .vi { margin-top: 0; width: 17px; height: 17px; color: #0c5432; }
.ft-contact-icon .vi-phone { fill: currentColor; stroke-width: 1; }
.ft-contact-copy { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px; flex: 1; min-width: 0; padding-top: 5px; }
.site-footer .ft-contact strong { color: #105632; font-weight: 700; white-space: nowrap; }
.ft-contact-copy a { overflow-wrap: anywhere; }
.site-footer .ft-title { position: relative; margin: 0 0 8px; padding-bottom: 12px; color: #0f3f25; font-size: 18px; line-height: 1.3; font-weight: 800; white-space: nowrap; }
.site-footer .ft-links li:not(:last-child) { border-bottom: 1px solid rgba(35,72,48,.09); }
.site-footer .ft-links a { display: flex; align-items: center; gap: 8px; min-height: 35px; padding: 8px 0; font-size: clamp(13px, .97vw, 14px); line-height: 1.4; color: #494b55; }
.site-footer .ft-links .vi { width: 14px; height: 14px; color: #0d5836; }
.site-footer .ft-links a:hover { color: #0d5836; }
.site-footer .ft-links a:hover .vi { transform: translateX(2px); }
.site-footer .ft-social { gap: 11px; padding-top: 6px; }
.site-footer .soc { width: 40px; height: 40px; border-radius: 8px; box-shadow: 0 2px 3px rgba(0,0,0,.12), inset 0 1px 2px rgba(255,255,255,.18); }
.site-footer .soc svg { width: 58%; height: 58%; }
.site-footer .soc-yt { background: linear-gradient(145deg, #ec2524, #c91313); }
.site-footer .soc-tt { background: linear-gradient(145deg, #171717, #020202); }
.site-footer a:focus-visible { outline: 2px solid #0c562e; outline-offset: 4px; border-radius: 3px; }
.site-footer .ft-copy { position: relative; overflow: hidden; display: flex; align-items: center; min-height: 48px; padding: 12px 0; border-top: 1px solid #c2d8ca; background: linear-gradient(#f5f5f5, #fff); font-size: 12px; }
.ft-copy-text { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; gap: 9px; line-height: 20px; }
.ft-copyright-mark { font-size: 21px; line-height: 1; }
.ft-wave { position: absolute; bottom: -2px; width: 17%; height: calc(100% - 10px); max-width: 320px; }
.ft-wave-left { left: -2px; }
.ft-wave-right { right: -2px; transform: scaleX(-1); }
@media (max-width: 1199px) {
	.site-footer .ft-grid { width: 90%; grid-template-columns: 1fr 1fr; gap: 24px 0; padding: 32px 0 28px; }
	.site-footer .ft-col:nth-child(3) { border-left: 0; padding-left: 0; }
	.ft-company { font-size: 13px; }
	.site-footer .ft-contact li, .site-footer .ft-links a { font-size: 14px; line-height: 21px; }
}
@media (max-width: 599px) {
	.ft-main { background-size: auto 450px; }
	.site-footer .ft-grid { grid-template-columns: 1fr; gap: 20px; padding: 26px 0 24px; }
	.site-footer .ft-col { border-left: 0; padding: 0; }
	.site-footer .ft-title { font-size: 17px; }
	.ft-company { font-size: 12px; }
	.site-footer .ft-copy { min-height: 56px; padding: 12px 35px; font-size: 11px; }
	.ft-copy-text { padding: 0; gap: 7px; }
	.ft-wave { width: 18%; height: 28px; }
}
