@charset "UTF-8";
/* Giao diện dùng chung: trang dự án + trang tin nhà đất (token Urban Crimson, chữ, nút .da-btn, badge, khối tiêu đề, gallery, lightbox,
   thông số, thẻ section, sidebar, popup + form CF7, thẻ tin tương tự, thanh CTA mobile). Chỉ nạp trên 2 trang này – xem inc/du-an.php, inc/nha-dat.php.
   Phần riêng nạp sau: assets/css/du-an.css (trang dự án), assets/css/nha-dat.css (trang nhà đất). */

.da-page {
	--da-text: #14202e;
	--da-muted: #5b6675;
	--da-line: #e4e7ec;
	--da-bg: #f6f7f9;
	--da-card: #ffffff;
	--da-red: #c4161c;
	--da-red-hover: #9f1117;
	--da-zalo: #0068ff;
	--da-radius: 16px;
	--da-radius-sm: 10px;
	--da-toc-h: 52px;
	--da-font: "Be Vietnam Pro", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

	background: var(--da-bg);
	color: var(--da-text);
	font-family: var(--da-font);
	font-size: 15px;
	line-height: 1.6;
	padding-bottom: 8px;
}

.da-page *,
.da-page *::before,
.da-page *::after {
	box-sizing: border-box;
}

.da-page h1,
.da-page h2,
.da-page h3,
.da-page p,
.da-page dl,
.da-page dd,
.da-page figure {
	margin: 0;
}

.da-page strong,
.da-page b,
.da-page input,
.da-page select,
.da-page textarea,
.da-page summary,
.da-page dt,
.da-page dd,
.da-page th,
.da-page td {
	font-family: var(--da-font);
}

.da-page h1,
.da-page h2,
.da-page h3 {
	color: var(--da-text);
	font-family: var(--da-font);
	letter-spacing: 0;
	text-transform: none;
}

.da-page :where(a:not(.button):not(.da-btn)) {
	color: var(--da-red);
}

.da-page :where(a:not(.button):not(.da-btn)):hover {
	color: var(--da-red-hover);
}

.da-page ul[class^="da-"],
.da-page ul[class*=" da-"] {
	list-style: none;
	margin: 0;
	padding: 0;
}

.da-page ul[class^="da-"] > li,
.da-page ul[class*=" da-"] > li {
	margin: 0;
}

.da-page button {
	font-family: var(--da-font);
	letter-spacing: 0;
	text-transform: none;
	margin: 0;
	min-height: 0;
	line-height: 1.4;
}

.da-page :focus-visible {
	outline: 2px solid var(--da-zalo);
	outline-offset: 2px;
}

.da-container {
	max-width: 1280px;
	margin: 0 auto;
	padding-left: 16px;
	padding-right: 16px;
}

.da-muted {
	color: var(--da-muted);
}

/* H2 section: chỉ tên section. Mobile 22px căn giữa, desktop 28px căn trái */
.da-page .da-h2 {
	font-size: 22px;
	font-weight: 700;
	line-height: 1.3;
	text-align: center;
	margin-bottom: 16px !important;
}

.da-h3 {
	font-size: 17px;
	font-weight: 600;
	line-height: 1.4;
	margin: 24px 0 12px !important;
}

.da-card {
	background: var(--da-card);
	border: 1px solid var(--da-line);
	border-radius: var(--da-radius);
	padding: 20px 16px;
}

.da-link {
	font-weight: 600;
	text-decoration: none;
}

/* ---------- Breadcrumb + tiêu đề ---------- */

.da-hero {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding-top: 16px;
	padding-bottom: 16px;
}

.da-breadcrumb {
	font-size: 13px;
	color: var(--da-muted);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.da-page .da-breadcrumb a {
	color: var(--da-muted);
	text-decoration: none;
}

.da-page .da-breadcrumb a:hover {
	color: var(--da-red);
}

.da-head {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.da-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 8px !important;
}

.da-badge {
	display: inline-flex;
	align-items: center;
	padding: 4px 12px;
	border-radius: 999px;
	background: #eef0f3;
	color: #3d4652;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
}

.da-badge--status.is-soon {
	background: #fff1db;
	color: #7a4a00;
}

.da-badge--status.is-selling {
	background: #e3f5ea;
	color: #11633a;
}

.da-badge--status.is-done {
	background: #e8eefc;
	color: #1f3f8f;
}

.da-title {
	font-size: 26px !important;
	font-weight: 700 !important;
	line-height: 1.25 !important;
	margin-bottom: 8px !important;
}

.da-address,
.da-developer {
	color: var(--da-muted);
	font-size: 15px;
}

.da-address .fas {
	color: var(--da-red);
	margin-right: 4px;
}

.da-page .da-developer a {
	color: var(--da-text);
	font-weight: 600;
	text-decoration: none;
}

.da-page .da-developer a:hover {
	color: var(--da-text);
	text-decoration: underline;
}

.da-head__price {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 12px;
}

.da-price__label {
	display: block;
	width: 100%;
	color: var(--da-muted);
	font-size: 13px;
}

.da-price {
	color: var(--da-red);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.25;
}

.da-price--contact {
	font-size: 20px;
}

/* ---------- Gallery ---------- */

.da-gallery {
	position: relative;
	order: -1;
	margin: -16px -16px 0;
}

.da-gallery__track {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.da-gallery__track::-webkit-scrollbar {
	display: none;
}

.da-gallery__item {
	flex: 0 0 100%;
	height: 260px;
	scroll-snap-align: start;
	background: #dfe3e8;
	display: block;
}

.da-gallery__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.da-gallery__count {
	position: absolute;
	left: 12px;
	bottom: 12px;
	padding: 2px 10px;
	border-radius: 999px;
	background: rgba(20, 32, 46, .75);
	color: #fff;
	font-size: 13px;
	font-weight: 600;
}



.da-page .da-gallery__all {
	position: absolute;
	right: 12px;
	bottom: 12px;
}

/* ---------- Lightbox ---------- */

/* Phủ đúng vùng nhìn thấy: inset 0 theo viewport thực. Không dùng 100vw: 100vw tính cả thanh cuộn dọc
   nên lightbox tràn sang phải, nút đóng bị che một phần. */
.da-lightbox {
	position: fixed;
	inset: 0;
	width: auto;
	height: auto;
	max-width: none;
	max-height: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: #0b1118;
	color: #fff;
	overflow: hidden;
}

.da-lightbox[open] {
	display: flex;
	flex-direction: column;
}

.da-lightbox::backdrop {
	background: rgba(0, 0, 0, .85);
}

/* Thanh đếm/đóng nằm đè lên trên, để ảnh căn giữa theo cả chiều cao màn hình (trên = dưới) */
.da-lightbox__bar {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 2;
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: calc(60px + env(safe-area-inset-top, 0px));
	padding: calc(8px + env(safe-area-inset-top, 0px)) calc(8px + env(safe-area-inset-right, 0px)) 8px calc(16px + env(safe-area-inset-left, 0px));
	font-weight: 600;
	background: linear-gradient(rgba(11, 17, 24, .7), rgba(11, 17, 24, 0));
}

.da-page .da-lightbox__close,
.da-page .da-lightbox__nav {
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, .12);
	color: #fff;
	font-size: 18px;
	cursor: pointer;
	padding: 0;
}

.da-lightbox__track {
	flex: 1;
	height: 100%;
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.da-lightbox__track::-webkit-scrollbar {
	display: none;
}

.da-lightbox__slide {
	flex: 0 0 100%;
	scroll-snap-align: start;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	padding: 60px 8px;
}

.da-lightbox__slide img {
	display: block;
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}

.da-lightbox__slide--video iframe {
	width: min(100%, 1100px);
	aspect-ratio: 16 / 9;
	height: auto;
	border: 0;
}

.da-page .da-lightbox__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: none;
}

.da-lightbox__nav--prev {
	left: calc(16px + env(safe-area-inset-left, 0px));
}

.da-lightbox__nav--next {
	right: calc(16px + env(safe-area-inset-right, 0px));
}

/* Nút đóng luôn đủ 44 × 44px, không bị co */
.da-page .da-lightbox__close {
	flex-shrink: 0;
	min-width: 44px;
	min-height: 44px;
}

/* ---------- Thông số nhanh: mobile = danh sách trong 1 thẻ ---------- */

.da-page ul.da-specs {
	background: var(--da-card);
	border: 1px solid var(--da-line);
	border-radius: var(--da-radius);
	padding: 4px 16px;
}

.da-page .da-specs > .da-spec {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	padding: 11px 0;
	border-bottom: 1px solid var(--da-line);
	min-width: 0;
}

.da-page .da-specs > .da-spec:last-child {
	border-bottom: 0;
}

.da-spec__label {
	flex-shrink: 0;
	color: var(--da-muted);
	font-size: 14px;
	white-space: nowrap;
}

.da-spec .fas {
	width: 18px;
	margin-right: 6px;
	color: var(--da-red);
	font-size: 14px;
	text-align: center;
}

/* Mobile: giá trị dài thì xuống dòng theo từ và chia đều 2 dòng, không cắt giữa chữ */
.da-spec__value {
	min-width: 0;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.35;
	text-align: right;
	overflow-wrap: normal;
	text-wrap: balance;
}

/* ---------- Bố cục ---------- */

.da-layout {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding-top: 16px;
	padding-bottom: 24px;
}

.da-main {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
}

.da-section {
	scroll-margin-top: calc(var(--da-toc-h) + 12px);
}

/* Bài giới thiệu */
.da-prose {
	position: relative;
	overflow-wrap: anywhere;
}

.da-prose > :first-child {
	margin-top: 0;
}

.da-prose h2 {
	font-size: 18px;
	margin: 20px 0 8px;
}

.da-prose h3 {
	font-size: 16px;
	margin: 16px 0 8px;
}

.da-prose p {
	margin-bottom: 12px;
}

/* Đoạn văn tối đa ~75 ký tự/dòng cho dễ đọc (đo thực tế: 60ch ≈ 75 ký tự tiếng Việt với Be Vietnam Pro 16px);
   ảnh, bảng vẫn rộng hết cột */
.da-prose > p,
.da-prose > ul,
.da-prose > ol,
.da-prose > h2,
.da-prose > h3,
.da-prose > h4,
.da-prose > blockquote {
	max-width: 60ch;
}

.da-prose img {
	height: auto;
	border-radius: var(--da-radius-sm);
}

.da-prose.is-collapsed {
	max-height: 420px;
	overflow: hidden;
}

.da-prose.is-collapsed::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 96px;
	background: linear-gradient(rgba(255, 255, 255, 0), #fff);
}



.da-page .da-more {
	margin-top: 12px;
}

.da-page .da-more[hidden] {
	display: none;
}

/* Thông tin chi tiết */
.da-details {
	display: grid;
	grid-template-columns: 1fr;
	border-top: 1px solid var(--da-line);
}

.da-details__row {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 10px 0;
	border-bottom: 1px solid var(--da-line);
}

.da-page .da-details dt,
.da-page .da-details dd {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: 0;
	text-transform: none;
}

.da-details dt {
	color: var(--da-muted);
	font-weight: 400;
	flex-shrink: 0;
}

.da-details dd {
	font-weight: 600;
	text-align: right;
}

.da-details dd a {
	text-decoration: none;
}

/* Vị trí */
.da-map {
	position: relative;
	height: 280px;
	margin: 12px 0 16px;
	border-radius: var(--da-radius-sm);
	overflow: hidden;
	background: #e9edf1;
	display: flex;
	align-items: center;
	justify-content: center;
}

.da-map iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* ---------- Quỹ căn ---------- */
.da-page {
	--da-qc-con-bg: #e3f5ea;
	--da-qc-con: #11633a;
	--da-qc-giu-bg: #fff1db;
	--da-qc-giu: #7a4a00;
	--da-qc-ban-bg: #eef0f3;
	--da-qc-ban: #8a94a3;
}

/* ---------- Sidebar ---------- */

.da-aside {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.da-aside__price .da-price {
	display: block;
}

.da-aside__actions {
	display: grid;
	grid-template-columns: 3fr 2fr;
	gap: 8px;
}



.da-aside__title {
	font-size: 18px !important;
	font-weight: 700 !important;
	padding-top: 12px;
	border-top: 1px solid var(--da-line);
}

.da-aside__sub {
	color: var(--da-muted);
	font-size: 14px;
}

.da-aside__trust {
	color: var(--da-muted);
	font-size: 13px;
	text-align: center;
}

.da-aside__trust .fas {
	color: #11633a;
}

/* ---------- Popup form dùng chung ---------- */

.da-popup {
	width: 100%;
	max-width: 460px;
	max-height: calc(100vh - 32px);
	margin: auto;
	padding: 0;
	border: 0;
	border-radius: var(--da-radius);
	background: var(--da-card);
	color: var(--da-text);
	font-family: var(--da-font);
	overflow: auto;
	box-shadow: 0 20px 60px rgba(20, 32, 46, .3);
}

.da-popup::backdrop {
	background: rgba(20, 32, 46, .6);
}

.da-popup__box {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 24px 20px 20px;
}

.da-page .da-popup__close {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--da-muted);
	font-size: 18px;
	cursor: pointer;
}

.da-page .da-popup__close:hover {
	background: var(--da-bg);
	color: var(--da-text);
}

.da-popup__kicker {
	padding-right: 40px;
	color: var(--da-muted);
	font-size: 13px;
	font-weight: 600;
}

.da-page .da-popup__title {
	padding-right: 32px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3;
}

.da-popup__sub {
	color: var(--da-muted);
	font-size: 14px;
}

.da-req {
	padding: 8px 12px;
	border-radius: var(--da-radius-sm);
	background: #fff1db;
	color: #7a4a00;
	font-size: 14px;
}

.da-req strong {
	color: #7a4a00;
}

.da-popup__ready .da-btn {
	width: 100%;
}

/* Mobile: popup trượt lên từ đáy, chiếm toàn bộ chiều ngang */
@media (max-width: 767px) {
	.da-popup {
		max-width: none;
		max-height: 92vh;
		margin: auto 0 0;
		border-radius: var(--da-radius) var(--da-radius) 0 0;
	}

	.da-popup__box {
		padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
	}
}

/* Form CF7 (sidebar + popup) */
.da-formbox .wpcf7 form > p,
.da-formbox .wpcf7 form br {
	margin: 0;
}

.da-formbox .wpcf7 form br {
	display: none;
}

.da-formbox .da-field {
	display: block;
	margin: 0 0 12px;
	font-size: 14px;
	font-weight: 600;
	color: var(--da-text);
}

.da-formbox .da-field > span:first-child {
	display: block;
	margin-bottom: 4px;
}

.da-page .da-formbox input[type="text"],
.da-page .da-formbox input[type="tel"],
.da-page .da-formbox input[type="email"],
.da-page .da-formbox textarea {
	width: 100%;
	height: 44px;
	margin: 0;
	padding: 8px 12px;
	border: 1px solid #c9ced6;
	border-radius: var(--da-radius-sm);
	box-shadow: none;
	background: #fff;
	color: var(--da-text);
	font-family: var(--da-font);
	font-size: 16px;
}

.da-page .da-formbox textarea {
	height: 88px;
}

.da-page .da-formbox input:focus,
.da-page .da-formbox textarea:focus {
	border-color: var(--da-text);
	box-shadow: none;
	outline: none;
}

.da-formbox .wpcf7-radio {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	font-weight: 400;
}

.da-formbox .wpcf7-radio .wpcf7-list-item {
	margin: 0;
}

.da-formbox .wpcf7-radio label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 40px;
	padding: 4px 12px;
	border: 1px solid var(--da-line);
	border-radius: 999px;
	cursor: pointer;
	font-weight: 500;
}

.da-formbox .wpcf7-radio input {
	margin: 0;
	accent-color: var(--da-red);
}

.da-formbox .wpcf7-radio label:has(input:checked) {
	border-color: var(--da-red);
	background: #fdf0f0;
}



.da-formbox .wpcf7-spinner {
	display: block;
	margin: 8px auto 0;
}

.da-formbox .wpcf7 form:not(.submitting) .wpcf7-spinner {
	display: none;
}

.da-formbox .wpcf7-not-valid-tip {
	font-size: 13px;
	font-weight: 500;
	margin-top: 4px;
}

.da-formbox .wpcf7 form .wpcf7-response-output {
	margin: 12px 0 0;
	padding: 10px 12px;
	border-radius: var(--da-radius-sm);
	font-size: 14px;
}

.da-formbox .wpcf7 form.sent .wpcf7-response-output {
	border-color: #11633a;
	background: #e3f5ea;
	color: #11633a;
}

/* ---------- Dự án tương tự ---------- */

.da-similar {
	padding: 8px 0 32px;
}

.da-page .da-similar__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}

.da-page .da-pcard__link {
	display: block;
	height: 100%;
	background: var(--da-card);
	border: 1px solid var(--da-line);
	border-radius: var(--da-radius);
	overflow: hidden;
	color: var(--da-text);
	text-decoration: none;
	transition: box-shadow .15s;
}

.da-page .da-pcard__link:hover {
	color: var(--da-text);
	box-shadow: 0 6px 20px rgba(20, 32, 46, .1);
}

.da-pcard__img {
	position: relative;
	aspect-ratio: 16 / 10;
	background: #dfe3e8;
}

.da-pcard__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.da-pcard__img .da-badge {
	position: absolute;
	left: 12px;
	top: 12px;
}

.da-pcard__body {
	padding: 12px 16px 16px;
}

.da-pcard__title {
	font-size: 17px !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	margin-bottom: 4px !important;
}

.da-pcard__body .da-muted {
	font-size: 14px;
}

.da-pcard__price {
	margin-top: 8px !important;
	color: var(--da-red);
	font-weight: 700;
}

/* ---------- Thanh CTA đáy (mobile/tablet) ---------- */

.da-ctabar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 90;
	display: flex;
	gap: 8px;
	padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px));
	background: #fff;
	border-top: 1px solid var(--da-line);
	box-shadow: 0 -4px 16px rgba(20, 32, 46, .08);
	font-family: var(--da-font);
}



/* Theme đặt overflow-x: hidden cho html/body làm hỏng position: sticky.
   clip vẫn chặn cuộn ngang nhưng không tạo vùng cuộn mới. File này chỉ nạp trên trang dự án. */
@supports (overflow: clip) {
	html,
	body.da-page-body {
		overflow-x: clip !important;
		overflow-y: visible !important;
	}
}

/* Chừa chỗ cho thanh CTA; đẩy nút "lên đầu trang" của Flatsome lên trên thanh */
.da-page-body {
	padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px));
}

.da-page-body .back-to-top {
	bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important;
}

/* ================= ≥ 768px (tablet) ================= */

@media (min-width: 768px) {
	.da-page {
		font-size: 16px;
	}

	.da-container {
		padding-left: 24px;
		padding-right: 24px;
	}

	.da-page .da-h2 {
		font-size: 28px;
		text-align: left;
	}

	.da-card {
		padding: 28px;
	}

	.da-hero {
		gap: 20px;
		padding-top: 20px;
		padding-bottom: 20px;
	}

	.da-head {
		flex-direction: row;
		justify-content: space-between;
		align-items: flex-end;
		gap: 24px;
	}

	.da-head__price {
		flex-direction: column;
		align-items: flex-end;
		text-align: right;
		flex-shrink: 0;
		max-width: 40%;
	}

	.da-price {
		font-size: 30px;
	}

	.da-price--contact {
		font-size: 22px;
	}

	.da-title {
		font-size: 34px !important;
	}

	/* Gallery dạng lưới */
	.da-gallery {
		order: 0;
		margin: 0;
	}

	.da-gallery__track {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: repeat(2, 1fr);
		gap: 8px;
		height: 360px;
		overflow: hidden;
		border-radius: var(--da-radius);
	}

	.da-gallery__item {
		height: auto;
		min-height: 0;
	}

	.da-gallery__item:nth-child(n+6) {
		display: none;
	}

	.da-gallery__item:first-child {
		grid-column: span 2;
		grid-row: span 2;
	}

	.da-gallery--n1 .da-gallery__track {
		grid-template-columns: 1fr;
		grid-template-rows: 1fr;
	}

	.da-gallery--n1 .da-gallery__item:first-child {
		grid-column: auto;
		grid-row: auto;
	}

	.da-gallery--n2 .da-gallery__track,
	.da-gallery--n3 .da-gallery__track {
		grid-template-columns: repeat(3, 1fr);
	}

	.da-gallery--n2 .da-gallery__item:nth-child(2) {
		grid-row: span 2;
	}

	.da-gallery--n4 .da-gallery__item:nth-child(2) {
		grid-column: span 2;
	}

	.da-gallery__count {
		display: none;
	}


	.da-page .da-lightbox__nav {
		display: block;
	}

	/* Thông số nhanh: lưới 4 cột × 2 hàng, mỗi mục 1 ô */
	.da-page ul.da-specs {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 12px;
		padding: 0;
		background: none;
		border: 0;
		border-radius: 0;
	}

	.da-page .da-specs > .da-spec,
	.da-page .da-specs > .da-spec:last-child {
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		gap: 4px;
		padding: 14px 16px;
		background: var(--da-card);
		border: 1px solid var(--da-line);
		border-radius: var(--da-radius-sm);
	}

	.da-spec__label {
		font-size: 13px;
	}

	.da-spec__value {
		font-size: 20px;
		font-weight: 700;
		line-height: 1.25;
		text-align: left;
	}

	.da-layout,
	.da-main {
		gap: 20px;
	}

	.da-details {
		grid-template-columns: repeat(2, 1fr);
	}

	.da-details {
		column-gap: 32px;
		border-top: 0;
	}

	.da-details__row:nth-child(-n+2) {
		border-top: 1px solid var(--da-line);
	}

	.da-map {
		height: 360px;
	}


	.da-page .da-similar__grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
	}
}

/* ================= ≥ 1024px (desktop, 2 cột) ================= */

@media (min-width: 1024px) {
	.da-title {
		font-size: 40px !important;
	}

	.da-gallery__track {
		height: 440px;
	}

	.da-spec__value {
		font-size: 25px;
	}

	.da-layout {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 340px;
		align-items: start;
		gap: 24px;
		padding-top: 24px;
	}

	.da-main {
		gap: 24px;
	}

	/* Sidebar cao hơn màn hình: du-an.js đặt --da-sidebar-top âm → dính theo mép dưới, không phần nào bị cắt */
	.da-sidebar {
		position: -webkit-sticky;
		position: sticky;
		top: var(--da-sidebar-top, calc(var(--da-toc-h) + 16px));
	}

	.da-ctabar {
		display: none;
	}

	.da-page-body {
		padding-bottom: 0;
	}

	.da-page-body .back-to-top {
		bottom: 20px !important;
	}
}

/* =====================================================================
   Token Urban Crimson
   ===================================================================== */
/*
 * BĐS Thủ Đô – token cho trang dự án. Chỉ áp dụng trong .da-page (không ảnh hưởng trang khác).
 * Màu thương hiệu lấy từ logo (bds-thu-do.png): #D81F52 – chỉ dùng cho nút CTA, giá và gạch chân tab đang chọn.
 * Mọi màu khác dùng qua biến, không viết hex trực tiếp trong component.
 */

.da-page {
	/* ---- Màu ---- */
	--brand: #D81F52;          /* logo; chữ trắng trên nền này 4.96:1 */
	--brand-hover: #B11943;    /* brand pha 18% đen; chữ trắng 6.80:1 */
	--brand-soft: #FBE9EE;     /* brand pha 90% trắng */
	--heading: #252B35;        /* tiêu đề, giá trị quan trọng (13.28:1 trên --bg) */
	--text: #515B68;           /* chữ thân (6.43:1 trên --bg) */
	--muted: #636B77;          /* nhãn, metadata (5.02:1 trên --bg) */
	--bg: #F6F7F9;             /* nền trang */
	--surface: #FFFFFF;        /* thẻ section, form, popup */
	--border: #E5E6E8;         /* đường kẻ, viền thẻ */
	--border-strong: #868D97;  /* viền ô nhập liệu (3.35:1 với --surface) */
	--overlay: rgba(37, 43, 53, .72);
	--zalo: #0068FF;           /* chỉ cho icon Zalo (4.75:1 trên trắng) */

	/* Nút (component .da-btn) */
	--btn-ink: #14202E;        /* chữ nút secondary (16.4:1 trên trắng) */
	--btn-radius: 10px;
	--btn-h: 44px;
	--btn-h-lg: 48px;
	--focus: #9C163B;          /* viền focus mọi nút (8.10:1 trên trắng) */

	/* Trạng thái dự án – không dùng tông đỏ */
	--st-selling: #1B6B3A; --st-selling-bg: #E7F6EC;  /* Đang mở bán 5.85:1 */
	--st-soon: #7A4A00;    --st-soon-bg: #FFF1DB;     /* Sắp mở bán 6.72:1 */
	--st-done: #3D4A5C;    --st-done-bg: #EEF1F5;     /* Đã bàn giao 7.95:1 */

	/* Quỹ căn */
	--ok: #23633F;      --ok-bg: #E4F1E8;      /* Còn hàng */
	--warn: #7A4B00;    --warn-bg: #FBEFD9;    /* Đang giữ chỗ */
	--neutral: #4E5661; --neutral-bg: #ECEDEF; /* Đã bán */

	/* ---- Chữ: 1 font duy nhất Be Vietnam Pro (400/500/600/700, subset vietnamese) ---- */
	--font-body: "Be Vietnam Pro", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

	/* Mobile trước; desktop đổi ở @media.
	   line-height H1/H2 1.32: đo mực chữ Be Vietnam Pro 700 – dấu chồng chữ thường (ẫ ể ỗ) cần 1.27,
	   chữ hoa 1 dấu (Á Ư Đ Ở) cần 1.31 để không chạm dấu nặng/chân chữ (ự ạ g y) dòng trên. */
	--fs-h1: 32px;   --lh-h1: 1.32;
	--fs-h2: 22px;   --lh-h2: 1.32;
	--fs-h3: 18px;   --lh-h3: 1.4;
	--fs-body: 16px; --lh-body: 1.7;
	--fs-small: 14px; --fs-meta: 13px;
	--fs-nav: 15px;  --fs-btn: 15px;
	--fs-price: 28px;

	/* ---- Khoảng cách, bo góc ---- */
	--s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px;
	--r-xs: 4px;   /* badge */
	--r-sm: 8px;   /* nút, ô nhập, ô quỹ căn */
	--r-md: 12px;  /* khối con trong thẻ */
	--r-lg: 16px;  /* thẻ section, gallery */
}

@media (min-width: 768px) {
	.da-page {
		--fs-h2: 28px;
	}
}

@media (min-width: 1024px) {
	.da-page {
		--fs-h1: 48px;
		--fs-price: 34px;
	}
}

/*
 * Urban Crimson – lớp component (đặt sau phần bố cục ở trên, dùng token ngay trên).
 * Section giữ dạng thẻ trắng trên nền xám nhạt; crimson chỉ cho nút CTA, giá và gạch chân tab đang chọn.
 */

/* ===== 1. Nối biến cũ của trang dự án vào token ===== */
.da-page {
	--da-text: var(--heading);
	--da-muted: var(--muted);
	--da-line: var(--border);
	--da-bg: var(--bg);
	--da-card: var(--surface);
	--da-red: var(--brand);
	--da-red-hover: var(--brand-hover);
	--da-zalo: var(--zalo);
	--da-radius: var(--r-lg);
	--da-radius-sm: var(--r-sm);
	--da-font: var(--font-body);
	--da-qc-con-bg: var(--ok-bg);
	--da-qc-con: var(--ok);
	--da-qc-giu-bg: var(--warn-bg);
	--da-qc-giu: var(--warn);
	--da-qc-ban-bg: var(--neutral-bg);
	--da-qc-ban: var(--neutral);

	color: var(--text);
	font-size: var(--fs-body);
	line-height: var(--lh-body);
}

.da-page :focus-visible {
	outline: 2px solid var(--heading);
	outline-offset: 2px;
}

/* ===== 2. Chữ ===== */
/* 1 font cho toàn trang dự án. style.css của child theme gán Roboto (không được nạp → rơi về Arial)
   cho label, .col-inner của UX Builder… nên ép lại cho mọi phần tử, trừ icon Font Awesome. */
.da-page *:not(i):not(.fa):not(.fas):not(.far):not(.fab) {
	font-family: var(--font-body);
}
.da-page h1,
.da-page h2,
.da-page .da-title,
.da-page .da-h2 {
	font-family: var(--font-body);
	color: var(--heading);
	letter-spacing: -0.01em;
}

.da-page h1.da-title {
	font-family: var(--font-body);
	font-size: var(--fs-h1) !important;
	line-height: var(--lh-h1) !important;
	font-weight: 700 !important;
	margin-bottom: var(--s-2) !important;
	text-wrap: balance;
}

.da-page .da-h2 {
	font-size: var(--fs-h2);
	line-height: var(--lh-h2);
	font-weight: 700;
}

.da-page h3,
.da-page .da-h3,
.da-page .da-pcard__title,
.da-page .da-aside__title,
.da-page .da-popup__title {
	font-family: var(--font-body);
	color: var(--heading);
	letter-spacing: 0;
}

.da-page strong,
.da-page b {
	color: var(--heading);
	font-weight: 600;
}

/* Link: charcoal gạch chân (crimson để dành cho CTA, giá) */
.da-page a {
	color: var(--heading);
}

.da-page a:hover {
	color: var(--heading);
}

.da-page .da-prose a,
.da-page a.da-link,
.da-page .da-details dd a {
	text-decoration: underline;
	text-decoration-color: var(--border-strong);
	text-underline-offset: 3px;
}

.da-page .da-prose a:hover,
.da-page a.da-link:hover,
.da-page .da-details dd a:hover {
	text-decoration-color: var(--heading);
}

.da-page .da-muted {
	color: var(--muted);
}

/* ===== 3. Nút: 1 component .da-btn, 2 biến thể (primary / secondary), cỡ thường 44px và --lg 48px ===== */

/* Reset kiểu nút của Flatsome bên trong trang dự án (uppercase, giãn chữ, bóng, margin, min-height riêng) */
.da-page button,
.da-page .button,
.da-page input[type="submit"],
.da-page input[type="button"] {
	margin: 0;
	box-shadow: none;
	text-shadow: none;
	text-transform: none;
	letter-spacing: 0;
	opacity: 1;
	font-family: var(--font-body);
}

/* Khuôn chung (cả nút trong nội dung bài viết do UX Builder tạo, và nút gửi của form CF7) */
.da-page .da-btn,
.da-page .da-prose .button,
.da-page .da-formbox input[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: var(--btn-h);
	height: auto;
	margin: 0;
	padding: 0 var(--btn-px, 18px);
	border: 1px solid transparent;
	border-radius: var(--btn-radius);
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0;
	text-transform: none;
	text-decoration: none;
	white-space: nowrap;
	box-shadow: none;
	transform: none;
	cursor: pointer;
	transition: background-color .15s, border-color .15s, color .15s;
}

.da-page .da-btn:hover,
.da-page .da-prose .button:hover,
.da-page .da-formbox input[type="submit"]:hover {
	box-shadow: none;
	transform: none;
	text-decoration: none;
}

.da-page .da-btn--lg,
.da-page .da-formbox input[type="submit"] {
	min-height: var(--btn-h-lg);
}

/* Nút chỉ có icon (Gọi trên thanh CTA mobile): vuông, cao bằng nút cùng nhóm */
.da-page .da-btn--icon {
	width: var(--btn-h);
	padding: 0;
}

.da-page .da-btn--lg.da-btn--icon {
	width: var(--btn-h-lg);
}

.da-page .da-btn .fas,
.da-page .da-btn .da-btn__icon {
	flex-shrink: 0;
	width: 18px;
	font-size: 18px;
	line-height: 1;
	text-align: center;
	color: inherit;
}

/* Primary: nền crimson, chữ trắng – tối đa 1 nút / nhóm */
.da-page .da-btn--primary,
.da-page .da-prose .button.primary,
.da-page .da-formbox input[type="submit"] {
	background: var(--brand);
	border-color: var(--brand);
	color: var(--surface);
}

.da-page .da-btn--primary:hover,
.da-page .da-prose .button.primary:hover,
.da-page .da-formbox input[type="submit"]:hover {
	background: var(--brand-hover);
	border-color: var(--brand-hover);
	color: var(--surface);
}

/* Secondary: nền trắng, viền xám, chữ mực */
.da-page .da-btn--secondary,
.da-page .da-prose .button:not(.primary) {
	background: var(--surface);
	border-color: var(--border-strong);
	color: var(--btn-ink);
}

.da-page .da-btn--secondary:hover,
.da-page .da-prose .button:not(.primary):hover {
	background: var(--bg);
	border-color: var(--btn-ink);
	color: var(--btn-ink);
}

/* Icon nhận diện trong nút secondary: không đổi màu khi hover */
.da-page .da-btn .da-btn__icon--zalo,
.da-page .da-btn:hover .da-btn__icon--zalo {
	color: var(--zalo);
}

.da-page .da-btn .da-btn__icon--call,
.da-page .da-btn:hover .da-btn__icon--call {
	color: var(--brand);
}

/* Focus bàn phím: mọi nút trong trang */
.da-page .da-btn:focus-visible,
.da-page button:focus-visible,
.da-page .button:focus-visible,
.da-page input[type="submit"]:focus-visible {
	outline: 2px solid var(--focus);
	outline-offset: 2px;
}

/* Disabled */
.da-page .da-btn:disabled,
.da-page .da-btn[aria-disabled="true"],
.da-page .da-formbox input[type="submit"]:disabled {
	background: var(--neutral-bg);
	border-color: var(--border);
	color: var(--muted);
	cursor: not-allowed;
}

.da-page .da-btn:disabled .da-btn__icon,
.da-page .da-btn[aria-disabled="true"] .da-btn__icon {
	color: var(--muted);
}

/* Form CF7: nút gửi rộng hết thẻ */
.da-page .da-formbox input[type="submit"] {
	width: 100%;
	margin-top: 4px;
	font-size: 16px;
}

/* ===== 4. Breadcrumb + khối tiêu đề ===== */
.da-page .da-breadcrumb {
	font-size: var(--fs-meta);
	color: var(--muted);
}

.da-page .da-breadcrumb a {
	color: var(--muted);
	text-decoration: none;
}

.da-page .da-breadcrumb a:hover {
	color: var(--heading);
	text-decoration: underline;
}

.da-page .da-address,
.da-page .da-developer {
	color: var(--text);
}

.da-page .da-address .fas {
	color: var(--muted);
}

.da-page .da-developer a {
	color: var(--heading);
}

/* Badge: góc 4px, không viên thuốc */
.da-page .da-badge {
	padding: 3px 8px;
	border-radius: var(--r-xs);
	background: transparent;
	border: 1px solid var(--border);
	color: var(--text);
	font-size: var(--fs-meta);
	font-weight: 600;
	line-height: 1.45;
}

/* Trạng thái: không tông đỏ */
.da-page .da-badge--status {
	gap: 6px;
	border-color: transparent;
}

.da-page .da-badge--status::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
}

.da-page .da-badge--status.is-selling {
	background: var(--st-selling-bg);
	color: var(--st-selling);
}

.da-page .da-badge--status.is-soon {
	background: var(--st-soon-bg);
	color: var(--st-soon);
}

.da-page .da-badge--status.is-done {
	background: var(--st-done-bg);
	color: var(--st-done);
}

/* Giá: crimson, font display, số đều cột */
.da-page .da-price__label {
	color: var(--muted);
	font-size: var(--fs-meta);
	font-weight: 500;
}

.da-page .da-price {
	font-family: var(--font-body);
	color: var(--brand);
	font-size: var(--fs-price);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.01em;
	font-variant-numeric: tabular-nums;
}

/* "Liên hệ nhận báo giá" không phải con số: charcoal, nhỏ hơn */
.da-page .da-price--contact {
	color: var(--heading);
	font-size: calc(var(--fs-price) * .7);
}

/* ===== 5. Gallery ===== */
.da-page .da-gallery__item {
	height: auto;
	aspect-ratio: 4 / 3;
	background: var(--neutral-bg);
}

.da-page .da-gallery__count {
	border-radius: var(--r-xs);
	background: var(--overlay);
	font-size: var(--fs-meta);
}

/* ===== 6. Thông số nhanh ===== */
.da-page ul.da-specs {
	border-color: var(--border);
	border-radius: var(--r-lg);
}

.da-page .da-spec .fas {
	color: var(--muted);
}

.da-page .da-spec__label {
	color: var(--muted);
}

.da-page .da-spec__value {
	font-family: var(--font-body);
	color: var(--heading);
	font-weight: 700;
	letter-spacing: -0.01em;
	font-variant-numeric: tabular-nums;
}

/* ===== 8. Section: thẻ trắng bo 16px trên nền xám nhạt (giữ như bản đã duyệt) ===== */
.da-page .da-card {
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
}

/* Bài giới thiệu */
.da-page .da-prose {
	color: var(--text);
}

.da-page .da-prose h2,
.da-page .da-prose h3,
.da-page .da-prose h4 {
	font-family: var(--font-body);
	color: var(--heading);
	font-weight: 600;
	letter-spacing: 0;
}

/* Bảng thông số */
.da-page .da-details dt {
	color: var(--muted);
}

.da-page .da-details dd {
	color: var(--heading);
}

/* Bản đồ */
.da-page .da-map {
	background: var(--neutral-bg);
	border-radius: var(--r-md);
}

/* ===== 14. Sidebar + form + popup ===== */
/* Cột phải 340px không đủ cho "Gọi 09xx…" + "Chat Zalo" cùng hàng khi giữ đúng khuôn nút → xếp 2 hàng, rộng hết thẻ */
.da-page .da-aside__actions {
	grid-template-columns: 1fr;
}

.da-page .da-aside__form {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.da-page .da-aside__title {
	font-size: 18px !important;
	font-weight: 600 !important;
	border-top-color: var(--border);
}

.da-page .da-aside__trust .fas {
	color: var(--muted);
}

.da-page .da-popup {
	border-radius: var(--r-lg);
	box-shadow: 0 12px 40px rgba(37, 43, 53, .22);
}

.da-page .da-popup::backdrop {
	background: var(--overlay);
}

/* "Bạn đang yêu cầu…": thông tin, không phải CTA → trung tính */
.da-page .da-req {
	border-radius: var(--r-sm);
	background: var(--bg);
	color: var(--text);
}

.da-page .da-req strong {
	color: var(--heading);
}

.da-page .da-formbox .da-field {
	color: var(--heading);
	font-weight: 500;
}

.da-page .da-formbox .da-field small {
	font-size: var(--fs-meta);
	font-weight: 400;
	color: var(--muted);
}

.da-page .da-formbox input[type="text"],
.da-page .da-formbox input[type="tel"],
.da-page .da-formbox input[type="email"],
.da-page .da-formbox textarea {
	height: 48px;
	border: 1px solid var(--border-strong);
	border-radius: var(--r-sm);
	color: var(--heading);
}

.da-page .da-formbox input::placeholder {
	color: var(--muted);
	opacity: 1;
}

.da-page .da-formbox input:focus,
.da-page .da-formbox textarea:focus {
	border-color: var(--heading);
	outline: 2px solid var(--neutral-bg);
	outline-offset: 0;
}

.da-page .da-formbox .wpcf7-radio label {
	min-height: 44px;
	border-color: var(--border-strong);
	border-radius: var(--r-sm);
	color: var(--heading);
}

.da-page .da-formbox .wpcf7-radio label:has(input:checked) {
	border-color: var(--heading);
	background: var(--bg);
}

.da-page .da-formbox .wpcf7-radio input {
	accent-color: var(--heading);
}

/* CF7 Skins thu nhỏ nhãn lựa chọn còn 12.6px */
.da-page .da-formbox .wpcf7-list-item-label {
	font-size: 15px;
	font-weight: 500;
}

.da-page .da-formbox .wpcf7 form.sent .wpcf7-response-output {
	border-color: var(--st-selling);
	background: var(--st-selling-bg);
	color: var(--st-selling);
}

/* ===== 15. Dự án tương tự: khoảng trắng phía trên, thẻ phẳng ===== */
.da-page .da-similar {
	padding-top: var(--s-6);
}

.da-page .da-pcard__link {
	border-color: var(--border);
	border-radius: var(--r-lg);
	transition: border-color .15s;
}

.da-page .da-pcard__link:hover {
	border-color: var(--border-strong);
	box-shadow: none;
}

.da-page .da-pcard__img {
	background: var(--neutral-bg);
	overflow: hidden;
}

.da-page .da-pcard__img img {
	transition: transform .3s;
}

.da-page .da-pcard__link:hover .da-pcard__img img {
	transform: scale(1.03);
}

.da-page .da-pcard__title {
	font-size: 17px !important;
	font-weight: 600 !important;
}

.da-page .da-pcard__price {
	color: var(--brand-hover);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

/* ===== 16. Thanh CTA mobile: 3 nút .da-btn--lg cùng cao 48px (Gọi icon · Zalo · Nhận bảng giá) ===== */
.da-page .da-ctabar {
	align-items: stretch;
	border-top-color: var(--border);
	box-shadow: 0 -2px 8px rgba(37, 43, 53, .06);
}

.da-page .da-ctabar .da-btn {
	flex: 0 0 auto;
}

.da-page .da-ctabar .da-ctabar__main {
	flex: 1 1 auto;
}

/* ===== ≥ 768px ===== */
@media (min-width: 768px) {
	.da-page .da-gallery__item {
		aspect-ratio: auto;
	}

	/* Thông số: 1 thẻ, chia ô bằng kẻ 1px; ô cuối kéo hết hàng để không lộ ô trống */
	.da-page ul.da-specs {
		gap: 1px;
		padding: 0;
		background: var(--border);
		border: 1px solid var(--border);
		border-radius: var(--r-lg);
		overflow: hidden;
	}

	.da-page .da-specs > .da-spec,
	.da-page .da-specs > .da-spec:last-child {
		padding: var(--s-4) var(--s-5);
		background: var(--surface);
		border: 0;
		border-radius: 0;
	}

	.da-page .da-specs > .da-spec:last-child:nth-child(4n+1) {
		grid-column: span 4;
	}

	.da-page .da-specs > .da-spec:last-child:nth-child(4n+2) {
		grid-column: span 3;
	}

	.da-page .da-specs > .da-spec:last-child:nth-child(4n+3) {
		grid-column: span 2;
	}
}

/* ===== ≥ 1024px: ảnh lớn hơn ===== */
@media (min-width: 1024px) {
	.da-page .da-gallery__track {
		height: 520px;
		gap: 6px;
		border-radius: var(--r-lg);
	}

	.da-page .da-spec__value {
		font-size: 25px;
	}
}

/* Ảnh gallery nhận lại focus khi đóng lightbox (giữ cho người dùng bàn phím). Viền chỉ hiện khi dùng bàn phím:
   màu brand, vẽ vào trong ảnh (gallery cắt phần tràn). html[data-bdst-input="pointer"] (du-an.js): thao tác gần nhất là
   chuột / chạm – không hiện viền kể cả khi trình duyệt coi lần trả focus là focus-visible (Safari, đóng bằng chạm). */
.da-page .da-gallery__item:focus {
	outline: none;
}

.da-page .da-gallery__item:focus-visible {
	outline: 3px solid var(--brand);
	outline-offset: -3px;
}

html[data-bdst-input="pointer"] .da-page .da-gallery__item:focus-visible {
	outline: none;
}

/* Bài viết (Tổng quan trang dự án, Mô tả trang nhà đất) trên desktop: chữ 17px, dòng 1.7. Giữ giới hạn độ rộng
   nhưng nới ra cho chữ lấp gần hết thẻ ở 1280 và 1440 (vùng chữ ~795–810px). Mobile / tablet giữ 16px, 60ch.
   Tiêu đề trong bài tăng theo để không nhỏ hơn chữ thân. */
@media (min-width: 1024px) {
	.da-page .da-prose {
		font-size: 17px;
		line-height: 1.7;
	}

	.da-page .da-prose > p,
	.da-page .da-prose > ul,
	.da-page .da-prose > ol,
	.da-page .da-prose > h2,
	.da-page .da-prose > h3,
	.da-page .da-prose > h4,
	.da-page .da-prose > blockquote {
		max-width: 82ch;
	}

	.da-page .da-prose h2 {
		font-size: 20px;
	}

	.da-page .da-prose h3 {
		font-size: 18px;
	}
}

/* Danh sách trong bài (Tổng quan, Mô tả): Flatsome đưa padding của ul/ol về 0 nên dấu bullet (outside) nằm ngoài cột chữ,
   lấn ra lề thẻ (điện thoại chỉ còn 16px lề). Thụt lề cho bullet / số nằm trong thẻ; lồng nhau thụt thêm 1 nấc;
   mục nhiều dòng thẳng hàng với dòng đầu. */
.da-page .da-prose ul,
.da-page .da-prose ol {
	margin: 0 0 12px;
	padding-left: 1.25em;
	list-style-position: outside;
}

.da-page .da-prose ol {
	padding-left: 1.6em; /* đủ chỗ cho số 2 chữ số "10." */
}

.da-page .da-prose ul {
	list-style-type: disc;
}

.da-page .da-prose ol {
	list-style-type: decimal;
}

.da-page .da-prose ul ul,
.da-page .da-prose ol ul {
	list-style-type: circle;
}

.da-page .da-prose li ul,
.da-page .da-prose li ol {
	margin: 6px 0 0;
}

.da-page .da-prose li {
	margin: 0 0 6px;
	padding-left: .2em;
}

.da-page .da-prose li > p {
	margin-bottom: 6px;
}

.da-page .da-prose li > p:last-child {
	margin-bottom: 0;
}

.da-page .da-prose li::marker {
	color: var(--muted);
}

/* Spinner sau khi gửi form CF7. flatsome.js gắn class "processing" vào khối cha khi bấm nút gửi và chỉ gỡ khi có jQuery
   ajaxComplete – CF7 5.4+ gửi bằng fetch nên không bao giờ gỡ: vòng xoay .processing::before của Flatsome quay mãi sau khi
   gửi xong (cả form trong lightbox #test). Trên trang dự án / nhà đất bỏ vòng xoay đó; chỉ dùng spinner của CF7,
   chỉ hiện khi form đang gửi (form.submitting). Lightbox Flatsome nằm ngoài .da-page nên không giới hạn trong .da-page. */
.wpcf7.processing::before,
.wpcf7 .processing::before,
.wpcf7-form.processing::before {
	content: none !important;
	display: none !important;
}

.wpcf7.processing *,
.wpcf7-form .processing * {
	opacity: 1;
}

.wpcf7 form:not(.submitting) .wpcf7-spinner {
	visibility: hidden;
}