/* DLB Trang chủ (is_front_page) — thêm 2026-08-30, đối chiếu khối ".cta-band" màu
   vàng trong demo-ui/index.html theo yêu cầu người dùng "muốn phần khối vàng giống
   100%". CHỈ CSS — theo yêu cầu người dùng, KHÔNG đổi cấu trúc khối: giữ nguyên 3
   khối con gốc nằm NGANG HÀNG như từ đầu (core/post-title, core/paragraph,
   core/buttons — không bọc thêm group con nào). Bố cục 2 cột (chữ trái/nút phải)
   dựng bằng CSS GRID nhắm thẳng vào 3 khối theo đúng thứ tự DOM sẵn có. Khối gốc là
   core/group thường (thuộc tính dlbGroupAnimatedGradient — do module hiệu ứng nền
   của plugin render class "dlb-group-fx--animated-gradient", KHÔNG đụng tới module
   đó) — chỉ thêm className "dlb-home-cta" để có chỗ móc CSS riêng (bắt buộc phải có
   ít nhất 1 class để nhắm đúng khối này, vì class hiệu ứng nền dùng chung cho MỌI
   group bật hiệu ứng, không an toàn để nhắm riêng). */

.dlb-home-cta.wp-block-group {
	display: grid !important;
	grid-template-columns: 1fr auto;
	grid-template-rows: auto auto;
	align-items: center;
	column-gap: 32px;
	padding: 52px 24px !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	min-height: 0 !important;
}

.dlb-home-cta > .wp-block-post-title {
	grid-column: 1;
	grid-row: 1;
	margin: 0;
	font-family: var(--wp--preset--font-family--be-vietnam-pro, inherit);
	font-size: clamp(26px, 3.2vw, 36px);
	line-height: 1.18;
	font-weight: 800;
	letter-spacing: -.03em;
	color: #111111;
}
.dlb-home-cta > .wp-block-paragraph {
	grid-column: 1;
	grid-row: 2;
	margin: 10px 0 0;
	font-size: 17px;
	color: #111111;
	max-width: 560px;
}

.dlb-home-cta > .wp-block-buttons {
	grid-column: 2;
	grid-row: 1 / span 2;
	gap: 12px !important;
	flex-wrap: wrap;
	margin: 0;
}
.dlb-home-cta > .wp-block-buttons .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--wp--preset--font-family--inter, inherit);
	font-size: 17px !important;
	font-weight: 600;
	padding: 18px 34px !important;
	min-height: 56px;
	border-radius: 6px !important;
	transition: background .15s ease, color .15s ease;
}
/* Nút 1 "Mua ngay" — nền đen, chữ trắng (đúng demo-ui, KHÔNG dùng màu primary xanh) */
.dlb-home-cta > .wp-block-buttons .wp-block-button:first-child .wp-block-button__link {
	background: #111111 !important;
	color: #ffffff !important;
}
.dlb-home-cta > .wp-block-buttons .wp-block-button:first-child .wp-block-button__link:hover {
	background: #000000 !important;
}
/* Nút 2 "Gọi ..." — viền đen, chữ đen, nền trong suốt */
.dlb-home-cta > .wp-block-buttons .wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent !important;
	color: #111111 !important;
	border-color: #111111 !important;
	box-shadow: inset 0 0 0 1px #111111 !important;
}
.dlb-home-cta > .wp-block-buttons .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: #111111 !important;
	color: #ffffff !important;
}

@media (max-width: 640px) {
	.dlb-home-cta.wp-block-group {
		display: flex !important;
		flex-direction: column;
		align-items: flex-start;
		padding: 24px 20px !important;
	}
	/* Thu nhỏ 2026-09-01 theo yêu cầu người dùng (gửi ảnh) — trước đó khối
	   mobile chỉ đổi BỐ CỤC (xếp dọc, nút full-width), chưa từng giảm CỠ CHỮ
	   nào cả: tiêu đề dùng "clamp(26px, 3.2vw, 36px)" — ở 390px thì 3.2vw chỉ
	   ~12px, luôn bị kẹp về mức SÀN 26px, tức không co lại chút nào trên di
	   động dù trông như có "clamp() responsive". Đoạn văn/nút cũng đều là số
	   cố định không đổi theo màn hình. Giảm hẳn riêng mobile cho gọn. */
	.dlb-home-cta > .wp-block-post-title {
		font-size: 20px !important;
		line-height: 1.25 !important;
	}
	.dlb-home-cta > .wp-block-paragraph {
		font-size: 14px !important;
		margin-top: 8px !important;
	}
	.dlb-home-cta > .wp-block-buttons {
		width: 100%;
		gap: 8px !important;
		margin-top: 14px !important;
	}
	.dlb-home-cta > .wp-block-buttons .wp-block-button {
		width: 100%;
	}
	.dlb-home-cta > .wp-block-buttons .wp-block-button__link {
		width: 100%;
		font-size: 14px !important;
		padding: 12px 20px !important;
		min-height: 44px;
	}
}

/* Khoảng trắng hở giữa dải CTA vàng và footer xanh — phát hiện 2026-09-01
   (người dùng gửi ảnh chụp thật). Nguồn gốc: WordPress tự chèn
   margin-top:24px (đúng bằng --wp--preset--spacing--60) cho MỌI khối cấp cao
   liền sau nhau (header/main/footer) — đây là khoảng thở MẶC ĐỊNH, hợp lý ở
   hầu hết trang khác (nội dung dừng lại, cần khoảng cách trước footer), nhưng
   RIÊNG Trang chủ dải CTA cần liền mạch màu vàng→xanh, không hở. Chỉ bỏ margin
   này trên đúng Trang chủ (file CSS này chỉ nạp khi is_front_page()) — không
   đụng tới khoảng cách main→footer ở các trang khác. */
footer.wp-block-template-part {
	margin-top: 0 !important;
}
