/**
 * Trang Giới thiệu công ty — nội dung ACF / editor (layout ảnh, danh sách).
 * File này chỉ được enqueue khi dùng template Giới thiệu (xem styles-scripts.php).
 */

/* Gợi ý cho người đang đăng nhập khi trang chưa có flexible content */
.luxen-about-editor-hint {
	padding: 12px 0;
	margin-bottom: 1rem;
	background: #fff8e5;
	border: 1px solid #dba617;
	border-radius: 4px;
	font-size: 14px;
	line-height: 1.5;
}

.luxen-about-editor-hint__p {
	margin: 0;
}

.about-us-page .luxen-about-intro-rich .alignwide,
.about-us-page .luxen-about-intro-rich .alignfull {
	max-width: 100%;
}

.about-us-page .luxen-about-inline-images {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	align-items: flex-start;
	justify-content: center;
	margin: 1.25rem 0;
}

.about-us-page .luxen-about-inline-images > .wp-caption,
.about-us-page .luxen-about-inline-images > p {
	flex: 1 1 calc(50% - 0.5rem);
	min-width: min(100%, 220px);
	margin: 0;
	box-sizing: border-box;
}

.about-us-page .luxen-about-inline-images img {
	width: 100%;
	height: auto;
	display: block;
	vertical-align: middle;
}

.about-us-page .luxen-about-intro-rich img {
	max-width: 100%;
	height: auto;
}

/* Khối nội dung soạn thảo (About): ảnh không tràn; canh giữa như trong editor */
.about-us-page .about-content .luxen-about-body-rich img,
.about-us-page .about-content .luxen-about-body-rich .wp-block-image img {
	max-width: 100%;
	height: auto;
}

.about-us-page .about-content .luxen-about-body-rich .aligncenter,
.about-us-page .about-content .luxen-about-body-rich .wp-block-image.aligncenter,
.about-us-page .about-content .luxen-about-body-rich figure.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/* Ảnh chèn trong nội dung WYSIWYG: khoảng cách dọc mặc định 24px */
.about-us-page .about-content .luxen-about-body-rich img,
.about-us-page .about-content .luxen-about-intro-rich img {
	margin-top: 24px;
	margin-bottom: 24px;
}

.about-us-page .about-content .luxen-about-body-rich .wp-block-image img,
.about-us-page .about-content .luxen-about-intro-rich .wp-block-image img,
.about-us-page .about-content .luxen-about-body-rich .wp-caption img,
.about-us-page .about-content .luxen-about-intro-rich .wp-caption img {
	margin-top: 0;
	margin-bottom: 0;
}

.about-us-page .about-content .luxen-about-body-rich .wp-block-image,
.about-us-page .about-content .luxen-about-intro-rich .wp-block-image,
.about-us-page .about-content .luxen-about-body-rich .wp-caption,
.about-us-page .about-content .luxen-about-intro-rich .wp-caption {
	margin-top: 24px;
	margin-bottom: 24px;
}

.about-us-page .about-content .luxen-about-body-rich .luxen-about-inline-images img,
.about-us-page .about-content .luxen-about-intro-rich .luxen-about-inline-images img {
	margin-top: 0;
	margin-bottom: 0;
}

.about-us-page .about-content .about-content-container.about-content--image-pair-only .content-images {
	margin-top: 0;
}

/* Tiêu đề cấp 3 trong nội dung WYSIWYG */
.about-us-page .about-content .luxen-about-body-rich h3,
.about-us-page .about-content .luxen-about-intro-rich h3 {
	font-size: 32px;
	margin-bottom: 30px;
}

/*
 * Danh sách trong nội dung About — bám theo html/css/styles.css
 * (.about-us-milestone .milestone-list): bullet tùy chỉnh, không trùng marker core/block.
 */
.about-us-page .about-content .content-desc.luxen-about-body-rich ul:not(.milestone-list):not(.menu):not(.sub-menu),
.about-us-page .about-content .content-desc:not(.luxen-about-body-rich):not(.luxen-about-intro-rich) ul:not(.milestone-list):not(.menu):not(.sub-menu),
.about-us-page .about-content .luxen-about-intro-rich ul:not(.milestone-list):not(.menu):not(.sub-menu) {
	position: relative;
	z-index: 1;
	list-style: none;
	list-style-type: none;
	padding: 0;
	padding-inline-start: 0;
	margin: 0 0 3rem 0;
}

.about-us-page .about-content .content-desc.luxen-about-body-rich ul:not(.milestone-list):not(.menu):not(.sub-menu) ul:not(.milestone-list):not(.menu):not(.sub-menu),
.about-us-page .about-content .content-desc:not(.luxen-about-body-rich):not(.luxen-about-intro-rich) ul:not(.milestone-list):not(.menu):not(.sub-menu) ul:not(.milestone-list):not(.menu):not(.sub-menu),
.about-us-page .about-content .luxen-about-intro-rich ul:not(.milestone-list):not(.menu):not(.sub-menu) ul:not(.milestone-list):not(.menu):not(.sub-menu) {
	margin-top: 0.6rem;
	margin-bottom: 0;
}

.about-us-page .about-content .content-desc.luxen-about-body-rich ul:not(.milestone-list) li,
.about-us-page .about-content .content-desc:not(.luxen-about-body-rich):not(.luxen-about-intro-rich) ul:not(.milestone-list) li,
.about-us-page .about-content .luxen-about-intro-rich ul:not(.milestone-list) li {
	position: relative;
	list-style: none;
	list-style-type: none;
	padding-left: 2rem;
	margin-bottom: 1.2rem;
	font-size: 1.8rem;
	line-height: 1.35;
	color: #000;
}

.about-us-page .about-content .content-desc.luxen-about-body-rich ul:not(.milestone-list) li::before,
.about-us-page .about-content .content-desc:not(.luxen-about-body-rich):not(.luxen-about-intro-rich) ul:not(.milestone-list) li::before,
.about-us-page .about-content .luxen-about-intro-rich ul:not(.milestone-list) li::before {
	content: "\2022";
	position: absolute;
	left: 0;
	color: #000;
}

@media (max-width: 768px) {
	.about-us-page .about-content .content-desc.luxen-about-body-rich ul:not(.milestone-list) li,
	.about-us-page .about-content .content-desc:not(.luxen-about-body-rich):not(.luxen-about-intro-rich) ul:not(.milestone-list) li,
	.about-us-page .about-content .luxen-about-intro-rich ul:not(.milestone-list) li {
		font-size: 1.8rem;
		margin-bottom: 1rem;
	}
}