/* ==========================================================================
   Trang con: Thông điệp CEO, Chứng nhận, Tin tức, Liên hệ, E-Catalogue
   ========================================================================== */

/* ---------- Thông điệp từ CEO ---------- */
.ceo__grid { display: grid; grid-template-columns: 411fr 845fr; gap: 24px; align-items: start; }
.ceo__photo { position: sticky; top: 140px; overflow: hidden; border-radius: var(--radius); }
.ceo__photo img { width: 100%; aspect-ratio: 411 / 614; height: auto; object-fit: cover; }
.ceo-card {
	position: relative; display: flex; flex-direction: column; gap: 16px;
	min-height: 218px; padding: 49px 40px 32px 71px;
	background: #0166b3; border-radius: 24px; color: #fff;
}
.ceo-card__quote { position: absolute; left: 24px; top: 24px; }
.ceo-card__quote svg { width: 31px; height: 30px; }
.ceo-card__title { font-size: clamp(26px, 2.4vw, 40px); font-weight: 700; line-height: 1.2; letter-spacing: -0.6px; text-transform: uppercase; }
.ceo-card__by { display: flex; flex-direction: column; gap: 8px; font-size: 16px; font-style: italic; line-height: 24px; }
.ceo-letter { margin-top: 40px; color: var(--c-body); font-size: 16px; line-height: 24px; }
.ceo-letter h2 { margin: 24px 0 16px; font-size: 24px; font-weight: 700; line-height: 1.25; color: var(--c-body); }
.ceo-letter h2:first-child { margin-top: 0; }
.ceo-letter h3 { margin: 16px 0 8px; font-size: 16px; font-weight: 700; line-height: 24px; }
.ceo-letter p { margin: 0; }
.ceo-letter p + p { margin-top: 0; }
.ceo-letter h3 + p { margin-top: 0; }
.ceo-letter strong { color: var(--c-primary); }
.ceo-letter .ceo-highlight { margin: 8px 0; font-style: italic; font-weight: 500; color: var(--c-primary); }
.ceo-letter hr { height: 2px; margin: 24px 0; border: 0; background: var(--c-primary); }
.ceo-letter .ceo-signature { margin-bottom: 16px; font-style: italic; color: var(--c-primary); }
.ceo-letter .ceo-signature strong { display: inline-block; margin-bottom: 8px; }
@media (max-width: 900px) {
	.ceo__grid { grid-template-columns: 1fr; }
	.ceo__photo { position: static; max-width: 420px; }
	.ceo-card { padding: 56px 24px 24px; }
}

/* ---------- Chứng nhận ---------- */
.cert-cards { display: grid; gap: 24px; }
.cert-card {
	display: grid; grid-template-columns: minmax(0, 1fr) 435px; min-height: 249px;
	background: #f7f8fa; border: 1px solid #0070ef; border-radius: var(--radius);
	transition: box-shadow .25s, transform .25s;
}
.cert-card:hover { box-shadow: 0 12px 32px rgba(0, 102, 179, .12); transform: translateY(-2px); }
.cert-card__body { display: flex; flex-direction: column; gap: 16px; padding: 32px; }
.cert-card__title { font-size: clamp(24px, 1.6vw + 6px, 32px); font-weight: 600; letter-spacing: -0.48px; text-transform: uppercase; color: #404040; }
.cert-card__text { font-size: 18px; line-height: 26px; color: var(--c-gray-90); text-align: justify; }
.cert-card__text p { margin: 0; }
.cert-card__logo { display: grid; place-items: center; padding: 24px; border-left: 1px solid #0070ef; }
.cert-card__logo img { max-width: 100%; max-height: 180px; width: auto; height: auto; }
@media (max-width: 900px) {
	.cert-card { grid-template-columns: 1fr; }
	.cert-card__logo { order: -1; border-left: 0; border-bottom: 1px solid #0070ef; }
	.cert-card__logo img { max-height: 110px; }
	.cert-card__text { font-size: 16px; line-height: 24px; text-align: left; }
}

/* ---------- Tin tức: bố cục + cột danh mục ---------- */
.news__grid { display: grid; grid-template-columns: 302px minmax(0, 954px); justify-content: space-between; gap: 24px; align-items: start; }
.news__main { min-width: 0; }
.news-nav { padding: 24px; background: var(--c-bg-soft); border-radius: var(--radius); }
.news-nav__title { display: flex; align-items: center; gap: 8px; font-size: 20px; font-weight: 700; color: var(--c-heading); }
.news-nav ul { display: grid; gap: 16px; margin-top: 24px; }
.news-nav a { display: block; padding-bottom: 8px; border-bottom: 1px solid #d9d9d9; font-size: 16px; line-height: 24px; color: #000; }
.news-nav a:hover, .news-nav a[aria-current] { color: var(--c-primary); }
.news-nav a[aria-current] { font-weight: 700; }

/* ---------- Thẻ bài viết ---------- */
.post-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.post-card { display: flex; flex-direction: column; gap: 16px; }
.post-card__media { display: block; overflow: hidden; aspect-ratio: 628 / 445; border-radius: var(--radius); background: var(--c-bg-soft); }
.post-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.post-card:hover .post-card__media img { transform: scale(1.05); }
.post-card__body { display: flex; flex-direction: column; gap: 16px; }
.post-card__title { font-size: 20px; font-weight: 700; line-height: 1.3; color: #353535; }
.post-card__title a:hover, .post-card:hover .post-card__title a { color: var(--c-primary); }
.post-card__excerpt { margin-top: -8px; font-size: 16px; line-height: 24px; color: #353535; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

.post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; font-size: 16px; color: #000; }
.post-meta > span { display: inline-flex; align-items: center; gap: 8px; }
.post-meta > span + span { padding-left: 16px; border-left: 1px solid #000; }
.post-meta .icon svg { width: 16px; height: 16px; }
.post-card .post-meta, .related-card .post-meta { font-size: 14px; gap: 6px 12px; }
.post-card .post-meta > span + span, .related-card .post-meta > span + span { padding-left: 12px; }

/* ---------- Phân trang ---------- */
.pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; margin-top: 24px; }
.pagination .page-numbers {
	display: grid; place-items: center; min-width: 32px; height: 32px; padding: 0 8px;
	border: 1px solid #f1f1f1; border-radius: var(--radius-sm); background: #fff;
	font-size: 13px; font-weight: 600; color: #333;
}
.pagination .page-numbers .icon svg { width: 16px; height: 16px; }
.pagination a.page-numbers:hover { border-color: var(--c-primary); color: var(--c-primary); }
.pagination .page-numbers.current { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }
.pagination .page-numbers.dots { border-color: transparent; }
.pagination .page-numbers.is-disabled { opacity: .35; }

/* ---------- Chi tiết bài viết ---------- */
.post-single__cover { overflow: hidden; border-radius: 24px; margin-bottom: 40px; }
.post-single__cover img { width: 100%; aspect-ratio: 954 / 566; height: auto; object-fit: cover; }
.post-single__title { font-size: clamp(28px, 2.4vw, 40px); font-weight: 600; line-height: 1.15; color: #2f2f2f; }
.post-pill { display: inline-flex; flex-wrap: wrap; gap: 24px; margin: 24px 0; padding: 7px 14px; border-radius: 20px; background: var(--c-bg-soft); font-size: 16px; line-height: 24px; color: #2f2f2f; }
.post-pill > span { display: inline-flex; align-items: center; gap: 8px; }
.prose--post { color: #2f2f2f; line-height: 1.5; }
.prose--post > * + * { margin-top: 1.2em; }
.prose--post h2 { margin-top: 40px; font-size: clamp(24px, 2vw, 32px); font-weight: 700; line-height: 1.15; text-transform: none; }
.prose--post h3 { font-size: 22px; }
.prose--post img { border-radius: var(--radius-sm); }
.prose--post .wp-caption { max-width: 100% !important; }
.prose--post .wp-caption-text { font-size: 14px; color: #6b7480; text-align: center; margin-top: 8px; }
.post-share { display: flex; justify-content: flex-end; align-items: center; gap: 8px; margin-top: 40px; padding-top: 9px; border-top: 1px solid rgba(0, 0, 0, .3); }
.post-share span { margin-right: 4px; }
.post-share a { display: block; transition: transform .2s; }
.post-share a:hover { transform: translateY(-2px); }

/* ---------- Bài viết liên quan ---------- */
.related__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(4, auto); gap: 24px; }
.related-card { display: grid; grid-template-columns: 204px minmax(0, 1fr); gap: 24px; align-items: center; }
.related-card__media { display: block; overflow: hidden; border-radius: var(--radius-sm); aspect-ratio: 204 / 144; background: #7e7e7e; }
.related-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.related-card:hover .related-card__media img { transform: scale(1.05); }
.related-card__body { display: flex; flex-direction: column; gap: 12px; }
.related-card__title { font-size: 20px; font-weight: 700; line-height: 1.3; color: #353535; }
.related-card__title a:hover { color: var(--c-primary); }
.related-card--big { grid-row: 1 / span 4; grid-template-columns: 1fr; align-items: start; align-content: start; }
.related-card--big .related-card__media { aspect-ratio: 628 / 445; border-radius: var(--radius); }
.related-card__excerpt { font-size: 16px; line-height: 24px; color: #353535; }

@media (max-width: 1100px) {
	.news__grid { grid-template-columns: 1fr; }
	.news-nav { order: 2; }
	.post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.related__grid { grid-template-columns: 1fr; }
	.related-card--big { grid-row: auto; }
}
@media (max-width: 600px) {
	.post-grid { grid-template-columns: 1fr; }
	.related-card { grid-template-columns: 120px minmax(0, 1fr); gap: 16px; }
	.related-card__title { font-size: 17px; }
}

/* ---------- Liên hệ ---------- */
.contact-page__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.contact-page__form .section-title { margin: 24px 0 40px; }
.cf--contact input[type="text"],
.cf--contact input[type="email"],
.cf--contact textarea,
.cf--contact .cf__phone { border: 1px solid var(--c-primary); }
.cf--contact .cf__phone input[type="tel"] { border: 0; }
.contact-card {
	position: relative; overflow: hidden;
	padding: 40px 36px 40px 40px; background: var(--c-bg-soft); border-radius: 10px;
	border-top: 10px solid var(--c-orange);
}
.contact-card__title { font-size: 24px; font-weight: 700; color: #000; }
.contact-card__text { margin-top: 16px; font-size: 16px; line-height: 24px; color: #333; }
.contact-card__list { display: grid; gap: 16px; margin-top: 24px; }
.contact-card__list li { display: flex; align-items: center; gap: 8px; font-size: 16px; line-height: 24px; color: #333; }
.contact-card__list li > span:last-child { display: flex; flex-direction: column; }
.contact-card__list a, .contact-card__list strong { font-weight: 700; color: #333; }
.contact-card__list a:hover { color: var(--c-primary); }
.contact-card__icon { flex: 0 0 40px; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--c-primary); }
.contact-card__icon svg { width: 18px; height: 18px; }

.contact-map { margin-top: 0; padding-top: 0; }
.contact-map__tabs { display: inline-flex; flex-wrap: wrap; background: var(--c-bg-soft); border-radius: 8px 8px 0 0; }
.contact-map__tabs button {
	padding: 16px; border: 0; border-radius: 8px 8px 0 0; background: none;
	font-size: 16px; font-weight: 600; line-height: 22px; color: var(--c-primary);
}
.contact-map__tabs button[aria-selected="true"] { background: var(--c-primary); color: #fff; }
.contact-map__frame { display: block; width: 100%; height: clamp(400px, 48vw, 832px); border: 0; }
@media (max-width: 991px) {
	.contact-page__grid { grid-template-columns: 1fr; }
	.contact-card { padding: 32px 20px; }
	.contact-card__list li { align-items: flex-start; }
}

/* ---------- E-Catalogue ---------- */
.ecat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
@media (max-width: 1100px) { .ecat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .ecat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } }
