/* =========================================================================
   Trang liên hệ — nạp riêng ở /lien-he/, sau main.css.

   Tiền tố kl-lh- , mượn đúng bộ biến của trang chủ (home.css) để hai trang
   nhìn ra cùng một thương hiệu. Không nhồi vào main.css: file đó mọi trang
   đều phải tải, còn khối này chỉ một trang dùng.

   Ba điều đã cân nhắc, đừng sửa nếu chưa đọc lý do:
   · Khối form GIỮ nguyên lớp .solus-contact__form — toàn bộ style của
     Contact Form 7 (input, submit, response) đã nằm trong main.css và form
     trên host đã gắn sẵn .solus-contact__input / .solus-contact__textarea.
     Đổi tên lớp ở đây là mất trắng phần style đó.
   · minmax(0, 1fr) chứ không phải 1fr — bản đồ là iframe, ô lưới 1fr không
     co nhỏ hơn nội dung nên trang tràn ngang ở màn hẹp.
   · Nút kênh liên hệ là <a> thật (tel: / zalo.me / maps) chứ không phải nút
     JS: script hỏng thì khách vẫn gọi được.
   ========================================================================= */

.kl-lh {
	--kl-xanh: #55a61d;
	--kl-xanh-chu: #3f7d15;
	--kl-xanh-sang: #6fbf2a;
	--kl-vang: #8a570c;
	--kl-vang-nhat: #fbf0dc;
	--kl-muc: #333;
	--kl-muc-2: #5b6d64;
	--kl-vien: #dfe8d9;
	background: #fff;
}

/* ---------- HERO ---------- */
.kl-lh-hero {
	position: relative;
	overflow: hidden;
	padding: 32px 0 34px;
	color: #ffffff;
	background: linear-gradient(105deg, var(--solus-green-chu-trang) 0%, var(--solus-primary-dark) 40%, var(--solus-primary) 100%);
}
.kl-lh-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: radial-gradient(46% 58% at 88% 6%, rgba(255, 255, 255, .16), transparent 68%);
}
/* Tuyết rơi. Bông tuyết sáu cánh vẽ bằng SVG nhúng thẳng vào CSS dưới dạng
   data-URI — trình duyệt không phải tải thêm file nào, và cả dải chỉ là MỘT lớp
   phủ. Chỉ animate transform nên lớp này nằm ở tầng compositor, không vẽ lại
   từng khung. Lớp cao hơn khối đúng một ô hoa văn và trượt xuống đúng một ô,
   nên vòng lặp nối liền, không thấy điểm giật. */
.kl-lh-hero::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: -560px;
	height: calc(100% + 560px);
	z-index: 1;
	pointer-events: none;
	opacity: .85;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='560' height='560' viewBox='0 0 560 560'%3E%3Cg fill='none' stroke='%23fff' stroke-linecap='round'%3E%3Cg transform='translate(41.6 70.3) rotate(29.5) scale(1.246)' stroke-opacity='0.42' stroke-width='1.2'%3E%3Cpath d='M12 12L12.00 2.80M12.00 6.94l1.99 -2.37M12.00 6.94l-1.99 -2.37M12.00 4.46l1.41 -1.69M12.00 4.46l-1.41 -1.69M12 12L19.97 7.40M16.38 9.47l3.05 0.54M16.38 9.47l1.06 -2.91M18.53 8.23l2.17 0.38M18.53 8.23l0.75 -2.07M12 12L19.97 16.60M16.38 14.53l1.06 2.91M16.38 14.53l3.05 -0.54M18.53 15.77l0.75 2.07M18.53 15.77l2.17 -0.38M12 12L12.00 21.20M12.00 17.06l-1.99 2.37M12.00 17.06l1.99 2.37M12.00 19.54l-1.41 1.69M12.00 19.54l1.41 1.69M12 12L4.03 16.60M7.62 14.53l-3.05 -0.54M7.62 14.53l-1.06 2.91M5.47 15.77l-2.17 -0.38M5.47 15.77l-0.75 2.07M12 12L4.03 7.40M7.62 9.47l-1.06 -2.91M7.62 9.47l-3.05 0.54M5.47 8.23l-0.75 -2.07M5.47 8.23l-2.17 0.38'/%3E%3C/g%3E%3Cg transform='translate(246.9 92.2) rotate(22.4) scale(1.221)' stroke-opacity='0.48' stroke-width='1.23'%3E%3Cpath d='M12 12L12.00 2.80M12.00 6.94l1.99 -2.37M12.00 6.94l-1.99 -2.37M12.00 4.46l1.41 -1.69M12.00 4.46l-1.41 -1.69M12 12L19.97 7.40M16.38 9.47l3.05 0.54M16.38 9.47l1.06 -2.91M18.53 8.23l2.17 0.38M18.53 8.23l0.75 -2.07M12 12L19.97 16.60M16.38 14.53l1.06 2.91M16.38 14.53l3.05 -0.54M18.53 15.77l0.75 2.07M18.53 15.77l2.17 -0.38M12 12L12.00 21.20M12.00 17.06l-1.99 2.37M12.00 17.06l1.99 2.37M12.00 19.54l-1.41 1.69M12.00 19.54l1.41 1.69M12 12L4.03 16.60M7.62 14.53l-3.05 -0.54M7.62 14.53l-1.06 2.91M5.47 15.77l-2.17 -0.38M5.47 15.77l-0.75 2.07M12 12L4.03 7.40M7.62 9.47l-1.06 -2.91M7.62 9.47l-3.05 0.54M5.47 8.23l-0.75 -2.07M5.47 8.23l-2.17 0.38'/%3E%3C/g%3E%3Cg transform='translate(486.7 29.9) rotate(23.6) scale(0.925)' stroke-opacity='0.54' stroke-width='1.62'%3E%3Cpath d='M12 12L12.00 2.80M12.00 6.94l1.99 -2.37M12.00 6.94l-1.99 -2.37M12.00 4.46l1.41 -1.69M12.00 4.46l-1.41 -1.69M12 12L19.97 7.40M16.38 9.47l3.05 0.54M16.38 9.47l1.06 -2.91M18.53 8.23l2.17 0.38M18.53 8.23l0.75 -2.07M12 12L19.97 16.60M16.38 14.53l1.06 2.91M16.38 14.53l3.05 -0.54M18.53 15.77l0.75 2.07M18.53 15.77l2.17 -0.38M12 12L12.00 21.20M12.00 17.06l-1.99 2.37M12.00 17.06l1.99 2.37M12.00 19.54l-1.41 1.69M12.00 19.54l1.41 1.69M12 12L4.03 16.60M7.62 14.53l-3.05 -0.54M7.62 14.53l-1.06 2.91M5.47 15.77l-2.17 -0.38M5.47 15.77l-0.75 2.07M12 12L4.03 7.40M7.62 9.47l-1.06 -2.91M7.62 9.47l-3.05 0.54M5.47 8.23l-0.75 -2.07M5.47 8.23l-2.17 0.38'/%3E%3C/g%3E%3Cg transform='translate(85.5 315.9) rotate(22.2) scale(0.904)' stroke-opacity='0.45' stroke-width='1.66'%3E%3Cpath d='M12 12L12.00 2.80M12.00 6.94l1.99 -2.37M12.00 6.94l-1.99 -2.37M12.00 4.46l1.41 -1.69M12.00 4.46l-1.41 -1.69M12 12L19.97 7.40M16.38 9.47l3.05 0.54M16.38 9.47l1.06 -2.91M18.53 8.23l2.17 0.38M18.53 8.23l0.75 -2.07M12 12L19.97 16.60M16.38 14.53l1.06 2.91M16.38 14.53l3.05 -0.54M18.53 15.77l0.75 2.07M18.53 15.77l2.17 -0.38M12 12L12.00 21.20M12.00 17.06l-1.99 2.37M12.00 17.06l1.99 2.37M12.00 19.54l-1.41 1.69M12.00 19.54l1.41 1.69M12 12L4.03 16.60M7.62 14.53l-3.05 -0.54M7.62 14.53l-1.06 2.91M5.47 15.77l-2.17 -0.38M5.47 15.77l-0.75 2.07M12 12L4.03 7.40M7.62 9.47l-1.06 -2.91M7.62 9.47l-3.05 0.54M5.47 8.23l-0.75 -2.07M5.47 8.23l-2.17 0.38'/%3E%3C/g%3E%3Cg transform='translate(214.5 215.1) rotate(27.3) scale(0.917)' stroke-opacity='0.66' stroke-width='1.64'%3E%3Cpath d='M12 12L12.00 2.80M12.00 6.94l1.99 -2.37M12.00 6.94l-1.99 -2.37M12.00 4.46l1.41 -1.69M12.00 4.46l-1.41 -1.69M12 12L19.97 7.40M16.38 9.47l3.05 0.54M16.38 9.47l1.06 -2.91M18.53 8.23l2.17 0.38M18.53 8.23l0.75 -2.07M12 12L19.97 16.60M16.38 14.53l1.06 2.91M16.38 14.53l3.05 -0.54M18.53 15.77l0.75 2.07M18.53 15.77l2.17 -0.38M12 12L12.00 21.20M12.00 17.06l-1.99 2.37M12.00 17.06l1.99 2.37M12.00 19.54l-1.41 1.69M12.00 19.54l1.41 1.69M12 12L4.03 16.60M7.62 14.53l-3.05 -0.54M7.62 14.53l-1.06 2.91M5.47 15.77l-2.17 -0.38M5.47 15.77l-0.75 2.07M12 12L4.03 7.40M7.62 9.47l-1.06 -2.91M7.62 9.47l-3.05 0.54M5.47 8.23l-0.75 -2.07M5.47 8.23l-2.17 0.38'/%3E%3C/g%3E%3Cg transform='translate(442.4 247.9) rotate(2.3) scale(0.85)' stroke-opacity='0.44' stroke-width='1.76'%3E%3Cpath d='M12 12L12.00 2.80M12.00 6.94l1.99 -2.37M12.00 6.94l-1.99 -2.37M12.00 4.46l1.41 -1.69M12.00 4.46l-1.41 -1.69M12 12L19.97 7.40M16.38 9.47l3.05 0.54M16.38 9.47l1.06 -2.91M18.53 8.23l2.17 0.38M18.53 8.23l0.75 -2.07M12 12L19.97 16.60M16.38 14.53l1.06 2.91M16.38 14.53l3.05 -0.54M18.53 15.77l0.75 2.07M18.53 15.77l2.17 -0.38M12 12L12.00 21.20M12.00 17.06l-1.99 2.37M12.00 17.06l1.99 2.37M12.00 19.54l-1.41 1.69M12.00 19.54l1.41 1.69M12 12L4.03 16.60M7.62 14.53l-3.05 -0.54M7.62 14.53l-1.06 2.91M5.47 15.77l-2.17 -0.38M5.47 15.77l-0.75 2.07M12 12L4.03 7.40M7.62 9.47l-1.06 -2.91M7.62 9.47l-3.05 0.54M5.47 8.23l-0.75 -2.07M5.47 8.23l-2.17 0.38'/%3E%3C/g%3E%3Cg transform='translate(74.4 488.0) rotate(4.1) scale(1.217)' stroke-opacity='0.61' stroke-width='1.23'%3E%3Cpath d='M12 12L12.00 2.80M12.00 6.94l1.99 -2.37M12.00 6.94l-1.99 -2.37M12.00 4.46l1.41 -1.69M12.00 4.46l-1.41 -1.69M12 12L19.97 7.40M16.38 9.47l3.05 0.54M16.38 9.47l1.06 -2.91M18.53 8.23l2.17 0.38M18.53 8.23l0.75 -2.07M12 12L19.97 16.60M16.38 14.53l1.06 2.91M16.38 14.53l3.05 -0.54M18.53 15.77l0.75 2.07M18.53 15.77l2.17 -0.38M12 12L12.00 21.20M12.00 17.06l-1.99 2.37M12.00 17.06l1.99 2.37M12.00 19.54l-1.41 1.69M12.00 19.54l1.41 1.69M12 12L4.03 16.60M7.62 14.53l-3.05 -0.54M7.62 14.53l-1.06 2.91M5.47 15.77l-2.17 -0.38M5.47 15.77l-0.75 2.07M12 12L4.03 7.40M7.62 9.47l-1.06 -2.91M7.62 9.47l-3.05 0.54M5.47 8.23l-0.75 -2.07M5.47 8.23l-2.17 0.38'/%3E%3C/g%3E%3Cg transform='translate(313.3 428.2) rotate(24.7) scale(0.9)' stroke-opacity='0.54' stroke-width='1.67'%3E%3Cpath d='M12 12L12.00 2.80M12.00 6.94l1.99 -2.37M12.00 6.94l-1.99 -2.37M12.00 4.46l1.41 -1.69M12.00 4.46l-1.41 -1.69M12 12L19.97 7.40M16.38 9.47l3.05 0.54M16.38 9.47l1.06 -2.91M18.53 8.23l2.17 0.38M18.53 8.23l0.75 -2.07M12 12L19.97 16.60M16.38 14.53l1.06 2.91M16.38 14.53l3.05 -0.54M18.53 15.77l0.75 2.07M18.53 15.77l2.17 -0.38M12 12L12.00 21.20M12.00 17.06l-1.99 2.37M12.00 17.06l1.99 2.37M12.00 19.54l-1.41 1.69M12.00 19.54l1.41 1.69M12 12L4.03 16.60M7.62 14.53l-3.05 -0.54M7.62 14.53l-1.06 2.91M5.47 15.77l-2.17 -0.38M5.47 15.77l-0.75 2.07M12 12L4.03 7.40M7.62 9.47l-1.06 -2.91M7.62 9.47l-3.05 0.54M5.47 8.23l-0.75 -2.07M5.47 8.23l-2.17 0.38'/%3E%3C/g%3E%3Cg transform='translate(491.1 439.3) rotate(18.0) scale(1.092)' stroke-opacity='0.43' stroke-width='1.37'%3E%3Cpath d='M12 12L12.00 2.80M12.00 6.94l1.99 -2.37M12.00 6.94l-1.99 -2.37M12.00 4.46l1.41 -1.69M12.00 4.46l-1.41 -1.69M12 12L19.97 7.40M16.38 9.47l3.05 0.54M16.38 9.47l1.06 -2.91M18.53 8.23l2.17 0.38M18.53 8.23l0.75 -2.07M12 12L19.97 16.60M16.38 14.53l1.06 2.91M16.38 14.53l3.05 -0.54M18.53 15.77l0.75 2.07M18.53 15.77l2.17 -0.38M12 12L12.00 21.20M12.00 17.06l-1.99 2.37M12.00 17.06l1.99 2.37M12.00 19.54l-1.41 1.69M12.00 19.54l1.41 1.69M12 12L4.03 16.60M7.62 14.53l-3.05 -0.54M7.62 14.53l-1.06 2.91M5.47 15.77l-2.17 -0.38M5.47 15.77l-0.75 2.07M12 12L4.03 7.40M7.62 9.47l-1.06 -2.91M7.62 9.47l-3.05 0.54M5.47 8.23l-0.75 -2.07M5.47 8.23l-2.17 0.38'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
	background-size: 560px 560px;
	background-repeat: repeat;
	animation: kl-tuyet-roi 38s linear infinite;
}
@keyframes kl-tuyet-roi {
	from { transform: translate3d(0, 0, 0); }
	to { transform: translate3d(0, 560px, 0); }
}
@media (prefers-reduced-motion: reduce) {
	.kl-lh-hero::after { animation: none; }
}
.kl-lh-hero .container {
	position: relative;
	z-index: 2;
}
.kl-lh-hero__luoi {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
	gap: 34px;
	align-items: center;
}
.kl-lh-hero__nhan {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0 0 10px;
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #ffffff;
}
.kl-lh-hero__nhan i {
	display: block;
	width: 24px;
	height: 2px;
	background: var(--kl-xanh-sang);
	border-radius: 2px;
}
.kl-lh-hero__h {
	margin: 0;
	font-size: clamp(23px, 3vw, 34px);
	font-weight: 900;
	line-height: 1.14;
	letter-spacing: -.02em;
	color: #eaf6dd;
	text-wrap: balance;
}
/* Trên nền lá, mọi sắc lá sáng dùng làm màu nhấn đều rớt xuống dưới 4:1 —
   nhấn bằng độ sáng trong cùng một họ: câu dẫn để lá nhạt, vế chính trắng. */
.kl-lh-hero__h em {
	font-style: normal;
	color: #ffffff;
}
.kl-lh-hero__mo-ta {
	margin: 11px 0 0;
	max-width: 52ch;
	font-size: 15.4px;
	line-height: 1.62;
	color: #eaf6dd;
}
.kl-lh-hero__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 20px;
	margin: 16px 0 0;
	padding-top: 14px;
	border-top: 1px solid rgba(255, 255, 255, .25);
	font-size: 13.4px;
	line-height: 1.5;
	color: #eaf6dd;
}
.kl-lh-hero__meta span {
	display: flex;
	align-items: flex-start;
	gap: 7px;
}
.kl-lh-hero__meta svg {
	flex: 0 0 auto;
	width: 15px;
	height: 15px;
	margin-top: 2px;
	color: #ffffff;
}
.kl-lh-hero__meta b {
	font-weight: 700;
	color: #ffffff;
}

/* Ba kênh liên hệ — cột phải của hero */
.kl-lh-kenh {
	display: grid;
	gap: 9px;
}
.kl-lh-kenh__o {
	display: flex;
	align-items: center;
	gap: 13px;
	padding: 13px 15px;
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: 12px;
	background: rgba(0, 0, 0, .22);
	color: #ffffff;
	transition: border-color .25s, background .25s, transform .25s;
}
.kl-lh-kenh__o:hover {
	border-color: var(--kl-xanh-sang);
	background: rgba(0, 0, 0, .3);
	transform: translateY(-2px);
	color: #fff;
	text-decoration: none;
}
.kl-lh-kenh__bieu {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 11px;
	background: rgba(255, 255, 255, .18);
	color: #ffffff;
}
.kl-lh-kenh__bieu svg {
	width: 21px;
	height: 21px;
}
/* Trên nền xanh lá, một thẻ xanh lá nữa sẽ chìm mất. Thẻ gọi kho là hành động
   chính nên đảo ngược: nền trắng đặc, chữ xanh đậm — nó là thứ nổi nhất khối. */
.kl-lh-kenh__o--chinh {
	border-color: transparent;
	background: #fff;
	color: #3f7d15;
}
.kl-lh-kenh__o--chinh:hover {
	background: #f2fae8;
	border-color: transparent;
}
.kl-lh-kenh__o--chinh .kl-lh-kenh__bieu {
	background: rgba(63, 125, 21, .12);
	color: #3f7d15;
}
.kl-lh-kenh__chu {
	min-width: 0;
}
.kl-lh-kenh__chu b {
	display: block;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: -.01em;
	line-height: 1.25;
}
.kl-lh-kenh__chu span {
	display: block;
	margin-top: 1px;
	font-size: 12.6px;
	line-height: 1.4;
	color: #eaf6dd;
}
.kl-lh-kenh__o--chinh .kl-lh-kenh__chu span {
	color: rgba(63, 125, 21, .8);
}
.kl-lh-kenh__o:hover .kl-lh-kenh__chu span {
	color: #f2fae8;
}

/* ---------- FORM + BẢN ĐỒ ---------- */
.kl-lh-gui {
	padding: 26px 0 44px;
}
.kl-lh-gui__luoi {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 28px;
	align-items: start;
}
.kl-lh-hop {
	padding: 20px 20px 22px;
	border: 1px solid var(--kl-vien);
	border-radius: 16px;
	background: #fbfdf9;
}
.kl-lh-hop__h {
	margin: 0;
	font-size: 19px;
	font-weight: 900;
	letter-spacing: -.02em;
	color: #1c2b21;
}
.kl-lh-hop__phu {
	margin: 6px 0 0;
	font-size: 14px;
	line-height: 1.55;
	color: var(--kl-muc-2);
}
.kl-lh-nhac {
	display: grid;
	gap: 6px;
	margin: 13px 0 15px;
	padding: 0;
	list-style: none;
}
.kl-lh-nhac li {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 13.6px;
	line-height: 1.5;
	color: var(--kl-muc);
}
.kl-lh-nhac svg {
	flex: 0 0 auto;
	width: 16px;
	height: 16px;
	margin-top: 2px;
	color: var(--kl-xanh);
}
.kl-lh-nhac b {
	font-weight: 700;
	color: #1c2b21;
}
.kl-lh .solus-contact__form {
	max-width: none;
}
.kl-lh .solus-contact__form .wpcf7-form > p {
	margin: 0 0 11px;
}
/* main.css đặt width:100% cho input.wpcf7-form-control, mà nút Gửi cũng mang đúng lớp đó
   nên nó kéo dài hết dòng (đo được 520px trên bản đang chạy). Trả về cỡ nút thật. */
.kl-lh .solus-contact__form input.wpcf7-submit {
	width: auto;
	min-width: 172px;
	padding: 12px 32px;
	border-radius: 10px;
	font-size: 15.4px;
	font-weight: 800;
	letter-spacing: -.01em;
}

/* Cột phải: bản đồ trên, thẻ địa chỉ dưới */
.kl-lh-ban-do {
	position: relative;
	overflow: hidden;
	width: 100%;
	min-height: 420px;
	border: 1px solid var(--kl-vien);
	border-radius: 16px;
	background: #e8ece8;
}
.kl-lh-ban-do iframe {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 420px;
	border: 0;
}
.kl-lh-dia-chi {
	display: grid;
	gap: 10px;
	margin-top: 12px;
	padding: 15px 17px;
	border: 1px solid var(--kl-vien);
	border-radius: 16px;
	background: #fff;
}
.kl-lh-dia-chi__dong {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	line-height: 1.55;
	color: var(--kl-muc);
}
.kl-lh-dia-chi__dong svg {
	flex: 0 0 auto;
	width: 17px;
	height: 17px;
	margin-top: 2px;
	color: var(--kl-xanh-chu);
}
.kl-lh-dia-chi__dong b {
	display: block;
	font-size: 12.4px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #8b9a91;
}
.kl-lh-dia-chi__dong a {
	color: var(--kl-muc);
}
.kl-lh-dia-chi__dong a:hover {
	color: var(--kl-xanh-chu);
}

/* ---------- MÀN HẸP ---------- */
@media (max-width: 992px) {
	.kl-lh-hero__luoi {
		grid-template-columns: minmax(0, 1fr);
		gap: 22px;
	}
	.kl-lh-gui__luoi {
		grid-template-columns: minmax(0, 1fr);
		gap: 22px;
	}
}

@media (max-width: 576px) {
	.kl-lh-hero {
		padding: 24px 0 26px;
	}
	.kl-lh-hop {
		padding: 16px 15px 18px;
	}
	.kl-lh-ban-do,
	.kl-lh-ban-do iframe {
		min-height: 260px;
	}
}
