/**
 * Dongson - Main stylesheet (Đông Sơn cơ khí · navy + gold)
 */

/* ==========================================================================
   1. Utilities
   ========================================================================== */

.skip-link.screen-reader-text { position: absolute; left: -9999px; top: -9999px; overflow: hidden; }
.skip-link.screen-reader-text:focus {
	left: 1rem; top: 1rem; z-index: 9999;
	background: #fff; padding: 0.5rem 1rem; border-radius: 0.375rem;
	box-shadow: 0 4px 12px rgba(0,0,0,0.15); width: auto; height: auto;
}
:where(a, button, input, select, textarea):focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}
img { max-width: 100%; height: auto; }
.alignwide { max-width: 1280px; margin-left: auto; margin-right: auto; }

/* ==========================================================================
   2. Block style overrides
   ========================================================================== */

.wp-block-button.is-style-outline-primary > .wp-block-button__link {
	background: transparent; color: currentColor; border: 2px solid currentColor;
}
.wp-block-button.is-style-outline-primary > .wp-block-button__link:hover {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
}
.wp-block-button.is-style-pill > .wp-block-button__link {
	border-radius: 999px; padding-left: 1.75rem; padding-right: 1.75rem;
}
.wp-block-image.is-style-rounded-shadow img {
	border-radius: 0.75rem; box-shadow: 0 10px 30px rgba(0,0,0,0.12);
}
.wp-block-quote.is-style-card {
	background: var(--wp--preset--color--muted); border-left: 0;
	border-radius: 0.75rem; padding: var(--wp--preset--spacing--40);
	box-shadow: 0 4px 16px rgba(0,0,0,0.06);
}
.wp-block-post-featured-image a img { transition: transform .4s ease; }
.wp-block-post-featured-image a:hover img { transform: scale(1.02); }

@media (max-width: 768px) {
	.wp-block-query .wp-block-post-template.is-layout-grid {
		grid-template-columns: 1fr !important;
	}
}

.is-style-section-title {
	position: relative; padding-bottom: 0.75rem; margin-bottom: 1.5rem !important;
	text-transform: uppercase; letter-spacing: 1px;
	color: var(--wp--preset--color--secondary);
}
.is-style-section-title::after {
	content: ""; display: block;
	width: 64px; height: 4px;
	background: var(--wp--preset--color--primary); border-radius: 2px;
	margin-top: 0.75rem;
}
.has-text-align-center.is-style-section-title::after {
	margin-left: auto; margin-right: auto;
}

/* ==========================================================================
   3. Buttons
   ========================================================================== */

.dongson-btn {
	display: inline-flex; align-items: center; gap: 0.5rem;
	padding: 0.85rem 1.75rem;
	border-radius: 999px;
	font-weight: 700; font-size: 0.95rem; line-height: 1.2;
	text-decoration: none; border: 2px solid transparent;
	transition: transform .15s ease, background .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease;
	cursor: pointer; white-space: nowrap;
}
.dongson-btn:hover { transform: translateY(-1px); text-decoration: none; }
.dongson-btn--primary {
	background: linear-gradient(135deg, #f5c451 0%, #e2a234 50%, #a87212 100%);
	color: var(--wp--preset--color--secondary-dark);
	box-shadow: 0 6px 16px rgba(226,162,52,0.3);
}
.dongson-btn--primary:hover {
	background: linear-gradient(135deg, #ffd57a 0%, #f5c451 50%, #e2a234 100%);
	color: var(--wp--preset--color--secondary-dark);
	box-shadow: 0 10px 24px rgba(226,162,52,0.45);
}
.dongson-btn--ghost {
	background: transparent; color: #fff;
	border-color: rgba(255,255,255,0.7);
}
.dongson-btn--ghost:hover {
	background: #fff; color: var(--wp--preset--color--secondary-dark);
	border-color: #fff;
}
.dongson-btn--ghost-dark {
	background: transparent;
	color: var(--wp--preset--color--secondary);
	border-color: var(--wp--preset--color--secondary);
}
.dongson-btn--ghost-dark:hover {
	background: var(--wp--preset--color--secondary);
	color: #fff;
}
.dongson-btn--white {
	background: #fff; color: var(--wp--preset--color--secondary-dark);
}
.dongson-btn--white:hover {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
}

/* ==========================================================================
   4. Topbar
   ========================================================================== */

.dongson-topbar {
	font-size: 0.82rem;
	background: var(--wp--preset--color--secondary-dark);
	border-bottom: 1px solid rgba(226,162,52,0.1);
}
.dongson-topbar a { color: #cbd5e1; text-decoration: none; transition: color .2s ease; }
.dongson-topbar a:hover { color: var(--wp--preset--color--primary); }
.dongson-topbar__inner {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 1.25rem;
	align-items: center;
	justify-content: space-between;
	max-width: 1280px;
	margin: 0 auto;
	color: #cbd5e1;
	padding: 0 clamp(1rem, 3vw, 2rem);
}
.dongson-topbar__welcome { margin: 0; line-height: 1.4; }
.dongson-topbar__welcome strong { color: var(--wp--preset--color--primary); }
.dongson-topbar__right { display: flex; align-items: center; gap: 0.6rem 1rem; flex-wrap: wrap; }
.dongson-topbar__sep { opacity: 0.4; }

@media (max-width: 781px) {
	.dongson-topbar__inner { justify-content: center; text-align: center; }
	.dongson-topbar__welcome { font-size: .75rem; }
	.dongson-topbar__right { font-size: .75rem; }
}
@media (max-width: 480px) {
	.dongson-topbar__welcome { display: none; }
}

/* ==========================================================================
   5. Header (1 hàng – navy + gold)
   ========================================================================== */

/* ==========================================================================
   5. Header (cân đối: logo trái — nav giữa — actions phải)
   ========================================================================== */

.dongson-header {
	background: var(--wp--preset--color--secondary);
	position: sticky; top: 0; z-index: 100;
	display: grid;
	grid-template-columns: minmax(0, auto) minmax(0, 1fr) minmax(0, auto);
	align-items: center;
	gap: clamp(1rem, 2.5vw, 2rem);
	padding: 0.65rem clamp(1rem, 3vw, 2rem) !important;
	border-bottom: 1px solid rgba(226,162,52,0.2);
	box-shadow: 0 2px 8px rgba(0,0,0,0.15);
	transition: padding .25s ease, box-shadow .25s ease, background .25s ease;
	max-width: 100%;
}

/* Container phụ giới hạn 1280px ở giữa khi viewport lớn */
@media (min-width: 1281px) {
	.dongson-header {
		padding-left: max(2rem, calc((100vw - 1280px) / 2)) !important;
		padding-right: max(2rem, calc((100vw - 1280px) / 2)) !important;
	}
}

.dongson-header.is-scrolled {
	padding-top: 0.4rem !important;
	padding-bottom: 0.4rem !important;
	box-shadow: 0 6px 20px rgba(0,0,0,0.35);
	background: rgba(12, 22, 38, 0.96);
	backdrop-filter: saturate(140%) blur(8px);
	-webkit-backdrop-filter: saturate(140%) blur(8px);
}
.dongson-header.is-scrolled .dongson-header__logo img,
.dongson-header.is-scrolled .dongson-header__logo-img,
.dongson-header.is-scrolled .dongson-header__logo .custom-logo {
	height: 40px !important;
	max-height: 40px !important;
}
.dongson-header.is-scrolled .dongson-header__cta {
	padding: 0.45rem 1rem;
	font-size: 0.85rem;
}

/* Topbar */
.dongson-topbar { position: relative; z-index: 1; }
html, body { overflow-x: clip; }
.wp-site-blocks { overflow: visible !important; }

/* Brand row dùng grid contents để 3 col của header thấy logo + toggle riêng */
.dongson-header__row {
	display: contents;
}

/* LOGO - cố định kích thước cân đối với chiều cao header */
.dongson-header__logo {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	text-decoration: none;
	max-width: 240px;
	flex-shrink: 0;
	height: 56px;
	line-height: 1;
}
.dongson-header__logo img,
.dongson-header__logo-img,
.dongson-header__logo .custom-logo,
.dongson-header__logo .wp-block-site-logo img,
.dongson-header__logo a img {
	height: 48px !important;
	width: auto !important;
	max-width: 100% !important;
	max-height: 48px !important;
	object-fit: contain;
	display: block;
}
.dongson-header__logo .custom-logo-link {
	display: inline-flex;
	align-items: center;
	height: 48px;
}

/* NAV - căn giữa và truncate khi quá dài thay vì wrap */
.dongson-header > .wp-block-navigation,
.dongson-header .dongson-nav {
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	font-size: 0.85rem;
	min-width: 0;
}
.dongson-header .wp-block-navigation__container {
	gap: 0.5rem !important;
}
.dongson-header .wp-block-navigation-item__content {
	color: #fff !important;
	padding: 0.6rem 0.85rem;
	border-radius: 0.4rem;
	transition: color .2s ease, background .2s ease;
	position: relative;
}
.dongson-header .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--primary) !important;
	background: rgba(226,162,52,0.08);
}
.dongson-header .wp-block-navigation-item__content[aria-current="page"] {
	color: var(--wp--preset--color--primary) !important;
}
.dongson-header .wp-block-navigation-item__content[aria-current="page"]::after {
	content: ""; position: absolute;
	bottom: -2px; left: 50%; transform: translateX(-50%);
	width: 24px; height: 3px;
	background: var(--wp--preset--color--primary);
	border-radius: 2px;
}
.dongson-header .wp-block-navigation__submenu-container {
	background: var(--wp--preset--color--secondary-dark) !important;
	border: 1px solid rgba(226,162,52,0.25) !important;
	min-width: 240px !important;
	box-shadow: 0 12px 30px rgba(0,0,0,0.35);
}
.dongson-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	color: #f1f5f9 !important;
}

/* CTA hotline pill */
.dongson-header__cta {
	display: inline-flex; align-items: center; gap: 0.55rem;
	background: linear-gradient(135deg, #f5c451 0%, #e2a234 50%, #a87212 100%);
	color: var(--wp--preset--color--secondary-dark);
	padding: 0.55rem 1.1rem;
	border-radius: 999px;
	text-decoration: none;
	font-weight: 800;
	font-size: 0.9rem;
	letter-spacing: 0.3px;
	box-shadow: 0 6px 16px rgba(226,162,52,0.3);
	transition: transform .2s ease, box-shadow .2s ease;
	white-space: nowrap;
	flex-shrink: 0;
	height: 40px;
	line-height: 1;
}
.dongson-header__cta:hover {
	transform: translateY(-1px);
	box-shadow: 0 10px 22px rgba(226,162,52,0.45);
	color: var(--wp--preset--color--secondary-dark);
	text-decoration: none;
}
.dongson-header__cta-icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 24px; height: 24px;
	border-radius: 50%;
	background: rgba(12,22,38,0.18);
	flex-shrink: 0;
}
.dongson-header__cta-icon svg {
	width: 14px;
	height: 14px;
}

/* Mobile burger */
.dongson-header__toggle {
	display: none;
	background: transparent;
	border: 0; cursor: pointer;
	width: 40px; height: 40px;
	padding: 8px;
	flex-direction: column; justify-content: space-between;
}
.dongson-header__toggle span {
	display: block; height: 2px; background: var(--wp--preset--color--primary);
	border-radius: 2px;
	transition: transform .25s ease, opacity .25s ease;
}
.dongson-header__toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(10px) rotate(45deg); }
.dongson-header__toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.dongson-header__toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-10px) rotate(-45deg); }

@media (max-width: 860px) {
	.dongson-header {
		grid-template-columns: auto 1fr auto;
	}
	.dongson-header__toggle {
		display: flex;
	}
	.dongson-header > .wp-block-navigation {
		position: absolute;
		top: 100%; left: 0; right: 0;
		background: var(--wp--preset--color--secondary-dark);
		padding: 1rem;
		border-top: 2px solid var(--wp--preset--color--primary);
		max-height: 0; overflow: hidden;
		transition: max-height .35s ease;
	}
	.dongson-header.is-open > .wp-block-navigation {
		max-height: 80vh;
		overflow: auto;
	}
	.dongson-header .wp-block-navigation__container {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 0 !important;
	}
	.dongson-header .wp-block-navigation-item__content {
		padding: 0.85rem 0.5rem;
		border-bottom: 1px solid rgba(255,255,255,0.06);
		border-radius: 0;
	}
	.dongson-header__cta-text { display: none; }
	.dongson-header__cta { padding: 0.55rem; }
}
@media (max-width: 480px) {
	.dongson-header { gap: 0.75rem; padding-left: 1rem !important; padding-right: 1rem !important; }
	.dongson-header__logo,
	.dongson-header__logo .custom-logo-link { height: 40px; }
	.dongson-header__logo img,
	.dongson-header__logo-img,
	.dongson-header__logo .custom-logo,
	.dongson-header__logo a img { height: 40px !important; max-height: 40px !important; }
}

/* ==========================================================================
   6. Hero slider — premium with KenBurns, parallax overlay, progress, controls
   ========================================================================== */

.dongson-hero {
	position: relative;
	overflow: hidden;
	background: #0c1626;
	color: #fff;
	min-height: clamp(520px, 70vh, 760px);
	isolation: isolate;
}
.dongson-hero__track {
	position: relative;
	width: 100%;
	min-height: clamp(520px, 70vh, 760px);
}
.dongson-hero__slide {
	position: absolute; inset: 0;
	display: flex;
	align-items: center;
	padding: 4rem clamp(1.5rem, 5vw, 5rem) 7rem;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .9s ease, visibility 0s linear .9s;
	z-index: 1;
}
.dongson-hero__slide.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	z-index: 2;
	transition: opacity .9s ease, visibility 0s linear 0s;
}

/* KenBurns zoom effect cho background */
.dongson-hero__bg {
	position: absolute;
	inset: -3% -3%;
	background-size: cover;
	background-position: center;
	will-change: transform;
	transform: scale(1.04);
	transition: transform 8s ease-out;
}
.dongson-hero__slide.is-active .dongson-hero__bg {
	animation: dongsonHeroKenburns 8s ease-out forwards;
}
@keyframes dongsonHeroKenburns {
	0% {
		transform: scale(1.04) translate(0, 0);
	}
	100% {
		transform: scale(1.15) translate(-1.5%, -1%);
	}
}

/* Cinematic gradient overlay */
.dongson-hero__overlay {
	position: absolute; inset: 0;
	background:
		linear-gradient(105deg, rgba(12,22,38,0.95) 0%, rgba(12,22,38,0.7) 45%, rgba(12,22,38,0.15) 80%, rgba(12,22,38,0) 100%),
		radial-gradient(circle at 95% 0%, rgba(226,162,52,0.18), transparent 45%);
	z-index: 1;
}

.dongson-hero__inner {
	position: relative;
	max-width: 720px;
	margin-left: clamp(1rem, 6vw, 5rem);
	z-index: 2;
}

/* Reveal animations: text trượt từ trái + fade khi slide active */
.dongson-hero__inner > * {
	opacity: 0;
	transform: translateX(-32px);
}
.dongson-hero__slide.is-active .dongson-hero__eyebrow { animation: dongsonHeroSlideIn .7s .15s ease-out forwards; }
.dongson-hero__slide.is-active .dongson-hero__title    { animation: dongsonHeroSlideIn .8s .25s ease-out forwards; }
.dongson-hero__slide.is-active .dongson-hero__subtitle { animation: dongsonHeroSlideIn .8s .4s ease-out forwards; }
.dongson-hero__slide.is-active .dongson-hero__desc     { animation: dongsonHeroSlideIn .8s .55s ease-out forwards; }
.dongson-hero__slide.is-active .dongson-hero__cta      { animation: dongsonHeroSlideIn .8s .7s ease-out forwards; }
@keyframes dongsonHeroSlideIn {
	to { opacity: 1; transform: translateX(0); }
}

.dongson-hero__eyebrow {
	display: inline-block;
	font-size: .78rem;
	letter-spacing: 3px;
	text-transform: uppercase;
	background: rgba(226,162,52,0.12);
	color: var(--wp--preset--color--primary);
	padding: .4rem 1rem;
	border-radius: 999px;
	margin-bottom: 1.2rem;
	font-weight: 700;
	border: 1px solid rgba(226,162,52,0.4);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.dongson-hero__title {
	font-size: clamp(2.25rem, 5.5vw, 4.25rem);
	line-height: 1.05;
	margin: 0 0 0.65rem;
	font-weight: 900;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	text-shadow: 0 4px 20px rgba(0,0,0,0.4);
}
.dongson-hero__title span {
	background: linear-gradient(135deg, #fde7a8 0%, #f5c451 30%, #e2a234 70%, #a87212 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	display: inline-block;
	-webkit-text-fill-color: transparent;
}
.dongson-hero__subtitle {
	font-size: clamp(1rem, 1.7vw, 1.4rem);
	margin: 0 0 1.1rem;
	color: var(--wp--preset--color--primary);
	letter-spacing: 2px;
	font-weight: 700;
}
.dongson-hero__desc {
	font-size: clamp(.95rem, 1.3vw, 1.1rem);
	color: rgba(255,255,255,0.88);
	margin: 0 0 1.75rem;
	max-width: 560px;
	line-height: 1.65;
}
.dongson-hero__cta {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
}

/* Progress bar - top of slider */
.dongson-hero__progress {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: rgba(255,255,255,0.08);
	z-index: 5;
	overflow: hidden;
}
.dongson-hero__progress-bar {
	width: 0;
	height: 100%;
	background: linear-gradient(90deg, #f5c451 0%, #e2a234 50%, #a87212 100%);
	box-shadow: 0 0 8px rgba(226,162,52,0.6);
	transition: width 100ms linear;
}

/* Controls (prev/next + counter) bottom-right */
.dongson-hero__controls {
	position: absolute;
	bottom: calc(160px + 1.5rem);
	right: clamp(1rem, 4vw, 4rem);
	display: flex;
	align-items: center;
	gap: 1rem;
	z-index: 5;
}
.dongson-hero__nav {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(255,255,255,0.08);
	color: #fff;
	border: 1px solid rgba(255,255,255,0.2);
	width: 46px;
	height: 46px;
	border-radius: 50%;
	cursor: pointer;
	transition: background .25s ease, border-color .25s ease, color .25s ease, transform .25s ease;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	padding: 0;
}
.dongson-hero__nav:hover {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
	transform: scale(1.08);
}
.dongson-hero__counter {
	color: rgba(255,255,255,0.85);
	font-weight: 700;
	font-size: .95rem;
	letter-spacing: 1px;
	min-width: 56px;
	text-align: center;
}
.dongson-hero__counter-current {
	color: var(--wp--preset--color--primary);
	font-size: 1.5rem;
	display: inline-block;
	margin-right: .15rem;
}
.dongson-hero__counter-sep {
	margin: 0 .25rem;
	opacity: .5;
}

/* Pause/Play button bottom-left */
.dongson-hero__pause {
	position: absolute;
	bottom: calc(160px + 1.5rem);
	left: clamp(1rem, 4vw, 4rem);
	z-index: 5;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(255,255,255,0.1);
	border: 1px solid rgba(255,255,255,0.2);
	color: #fff;
	cursor: pointer;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	transition: background .2s ease;
	padding: 0;
}
.dongson-hero__pause:hover {
	background: rgba(226,162,52,0.25);
}
.dongson-hero__pause-icon-play { display: none; }
.dongson-hero.is-paused .dongson-hero__pause-icon-pause { display: none; }
.dongson-hero.is-paused .dongson-hero__pause-icon-play { display: block; }

/* Dots */
.dongson-hero__dots {
	position: absolute;
	bottom: calc(160px + 1.5rem);
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: .5rem;
	z-index: 5;
}
.dongson-hero__dots button {
	position: relative;
	width: 32px;
	height: 4px;
	border-radius: 4px;
	background: rgba(255,255,255,0.25);
	border: 0;
	cursor: pointer;
	transition: width .25s ease, background .25s ease;
	overflow: hidden;
	padding: 0;
}
.dongson-hero__dots button:hover {
	background: rgba(255,255,255,0.45);
}
.dongson-hero__dots button.is-active {
	width: 56px;
	background: rgba(255,255,255,0.18);
}
.dongson-hero__dot-progress {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, #f5c451 0%, #e2a234 100%);
	transform: scaleX(0);
	transform-origin: left;
}
.dongson-hero__dots button.is-active .dongson-hero__dot-progress {
	animation: dongsonHeroDotFill 6s linear forwards;
}
.dongson-hero.is-paused .dongson-hero__dots button.is-active .dongson-hero__dot-progress {
	animation-play-state: paused;
}
@keyframes dongsonHeroDotFill {
	from { transform: scaleX(0); }
	to   { transform: scaleX(1); }
}

/* Feature row (3 cột) — đáy slider, dạng glass card */
.dongson-hero__features {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	background: linear-gradient(180deg, rgba(12,22,38,0) 0%, rgba(12,22,38,0.92) 60%);
	padding: 3rem clamp(1.5rem, 5vw, 5rem) 1.5rem;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
	z-index: 4;
}
.dongson-hero__feature {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: .85rem 1rem;
	background: rgba(255,255,255,0.04);
	border: 1px solid rgba(226,162,52,0.18);
	border-left: 3px solid var(--wp--preset--color--primary);
	border-radius: .55rem;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	transition: background .25s ease, transform .25s ease;
}
.dongson-hero__feature:hover {
	background: rgba(226,162,52,0.08);
	transform: translateY(-2px);
}
.dongson-hero__feature-icon {
	flex-shrink: 0;
	width: 44px; height: 44px;
	border-radius: 50%;
	background: rgba(226,162,52,0.18);
	color: var(--wp--preset--color--primary);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.4rem;
	font-weight: 800;
}
.dongson-hero__feature-icon svg { width: 24px; height: 24px; }
.dongson-hero__feature strong {
	display: block;
	color: var(--wp--preset--color--primary);
	font-size: .85rem;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin-bottom: .15rem;
}
.dongson-hero__feature span {
	display: block;
	color: rgba(255,255,255,0.75);
	font-size: .8rem;
}

@media (max-width: 980px) {
	.dongson-hero__features { grid-template-columns: 1fr 1fr; }
	.dongson-hero__features .dongson-hero__feature:nth-child(3) { display: none; }
}
@media (max-width: 768px) {
	.dongson-hero { min-height: 600px; }
	.dongson-hero__track { min-height: 600px; }
	.dongson-hero__slide { padding: 3rem 1.5rem 7rem; align-items: flex-start; padding-top: 4rem; }
	.dongson-hero__inner { margin-left: 0; }
	.dongson-hero__nav { width: 40px; height: 40px; }
	.dongson-hero__features {
		grid-template-columns: 1fr;
		padding: 2rem 1rem 1rem;
	}
	.dongson-hero__features .dongson-hero__feature:nth-child(2),
	.dongson-hero__features .dongson-hero__feature:nth-child(3) { display: none; }
	.dongson-hero__controls,
	.dongson-hero__pause,
	.dongson-hero__dots { bottom: calc(110px + .75rem); }
	.dongson-hero__pause { display: none; }
}
@media (max-width: 480px) {
	.dongson-hero__features { display: none; }
	.dongson-hero__controls,
	.dongson-hero__dots { bottom: 1rem; }
}

/* ==========================================================================
   7. Category grid
   ========================================================================== */

.dongson-cat-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 1.5rem;
	margin: 0 auto;
}
.dongson-cat-card {
	display: flex; flex-direction: column; align-items: center;
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 0.85rem;
	padding: 1rem 1rem 1.25rem;
	text-align: center;
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.dongson-cat-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 40px rgba(12,22,38,0.12);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
}
.dongson-cat-card__img {
	width: 100%; aspect-ratio: 4/3; overflow: hidden;
	border-radius: 0.5rem; margin-bottom: .75rem;
	background: var(--wp--preset--color--muted);
}
.dongson-cat-card__img img {
	width: 100%; height: 100%; object-fit: cover;
	transition: transform .4s ease;
}
.dongson-cat-card:hover .dongson-cat-card__img img { transform: scale(1.05); }
.dongson-cat-card__title { font-size: 1.05rem; font-weight: 700; margin: .25rem 0; }
.dongson-cat-card__more { font-size: .85rem; color: var(--wp--preset--color--primary-dark); font-weight: 600; }

/* ==========================================================================
   8. Product grid
   ========================================================================== */

.dongson-product-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 1.5rem;
	margin: 0 auto 2rem;
}
.dongson-product-card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 0.85rem;
	overflow: hidden;
	display: flex; flex-direction: column;
	transition: transform .2s ease, box-shadow .2s ease;
}
.dongson-product-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 40px rgba(12,22,38,0.12);
}
.dongson-product-card__img {
	position: relative; display: block;
	aspect-ratio: 3/2; overflow: hidden;
}
.dongson-product-card__img img {
	width: 100%; height: 100%; object-fit: cover;
	transition: transform .4s ease;
}
.dongson-product-card:hover .dongson-product-card__img img { transform: scale(1.05); }
.dongson-product-card__badge {
	position: absolute; top: .5rem; left: .5rem;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
	font-size: .7rem; font-weight: 800; letter-spacing: 1px;
	padding: .2rem .6rem; border-radius: 999px;
}
.dongson-product-card__body {
	padding: 1rem 1rem 1.25rem;
	display: flex; flex-direction: column; flex: 1; gap: .75rem;
}
.dongson-product-card__title {
	font-size: 1rem; font-weight: 700; margin: 0; min-height: 2.6em;
	line-height: 1.4;
}
.dongson-product-card__title a {
	color: var(--wp--preset--color--secondary) !important;
	text-decoration: none !important;
	display: block;
	transition: color .2s ease;
}
.dongson-product-card__title a:hover { color: var(--wp--preset--color--primary-dark) !important; }

/* Button "Xem chi tiết" trên product card – pill gold solid */
.dongson-product-card .dongson-btn--ghost-dark {
	background: rgba(226,162,52,0.08);
	color: var(--wp--preset--color--primary-dark);
	border: 1.5px solid rgba(226,162,52,0.4);
	padding: .55rem 1rem;
	font-size: .85rem;
	width: 100%;
	justify-content: center;
	margin-top: auto;
}
.dongson-product-card .dongson-btn--ghost-dark:hover {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
	text-decoration: none;
}

/* ==========================================================================
   9. Features / Services
   ========================================================================== */

.dongson-feature-grid,
.dongson-service-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1.5rem;
	margin: 0 auto;
}
.dongson-feature,
.dongson-service {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 0.85rem;
	padding: 2rem 1.5rem;
	text-align: center;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.dongson-feature:hover,
.dongson-service:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 40px rgba(12,22,38,0.12);
	border-color: var(--wp--preset--color--primary);
}
.dongson-feature__icon,
.dongson-service__icon {
	width: 64px; height: 64px;
	margin: 0 auto 1rem;
	border-radius: 50%;
	background: rgba(226,162,52,0.12);
	display: flex; align-items: center; justify-content: center;
	color: var(--wp--preset--color--primary-dark);
}
.dongson-feature__icon svg,
.dongson-service__icon svg { width: 32px; height: 32px; }
.dongson-feature__title,
.dongson-service__title {
	font-size: 1.1rem; font-weight: 700; margin: 0 0 .5rem;
	color: var(--wp--preset--color--secondary);
}
.dongson-feature__desc,
.dongson-service__desc {
	color: #4b5563; font-size: .95rem; line-height: 1.6; margin: 0;
}
.dongson-service__more {
	display: inline-block; margin-top: 1rem;
	color: var(--wp--preset--color--primary-dark);
	font-weight: 600; text-decoration: none;
}
.dongson-service__more:hover { text-decoration: underline; }

/* ==========================================================================
   10. About
   ========================================================================== */

.dongson-about {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: center;
}
@media (max-width: 768px) { .dongson-about { grid-template-columns: 1fr; } }
.dongson-about__media {
	position: relative; border-radius: 1rem; overflow: hidden;
	box-shadow: 0 24px 60px rgba(12,22,38,0.15);
}
.dongson-about__media img { display: block; width: 100%; height: auto; }
.dongson-about__badge {
	position: absolute; bottom: 1rem; left: 1rem;
	background: linear-gradient(135deg, #f5c451 0%, #e2a234 100%);
	color: var(--wp--preset--color--secondary-dark);
	padding: 1rem 1.25rem; border-radius: .75rem;
	display: flex; flex-direction: column;
	box-shadow: 0 12px 30px rgba(226,162,52,0.4);
}
.dongson-about__badge strong { font-size: 2rem; line-height: 1; }
.dongson-about__badge span { font-size: .85rem; opacity: .85; font-weight: 600; }

.dongson-about__eyebrow {
	color: var(--wp--preset--color--primary-dark);
	font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
	font-size: .85rem; margin: 0 0 .5rem;
}
.dongson-about__title {
	font-size: clamp(1.5rem, 2.6vw, 2.25rem);
	font-weight: 800; color: var(--wp--preset--color--secondary);
	line-height: 1.25; margin: 0 0 1rem;
}
.dongson-about__list { list-style: none; padding: 0; margin: 1rem 0; }
.dongson-about__list li {
	padding: .5rem 0 .5rem 1.75rem; position: relative;
}
.dongson-about__list li::before {
	content: "✓"; position: absolute; left: 0; top: .55rem;
	width: 20px; height: 20px;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
	border-radius: 50%;
	font-size: .75rem; font-weight: 800;
	display: flex; align-items: center; justify-content: center;
}
.dongson-about__cta { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; }

/* ==========================================================================
   11. News grid
   ========================================================================== */

.dongson-news-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 1.5rem;
	margin: 0 auto 2rem;
}
.dongson-news-card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 0.85rem;
	overflow: hidden;
	display: flex; flex-direction: column;
	transition: transform .2s ease, box-shadow .2s ease;
}
.dongson-news-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 40px rgba(12,22,38,0.12);
}
.dongson-news-card__img {
	display: block; aspect-ratio: 16/10; overflow: hidden;
}
.dongson-news-card__img img {
	width: 100%; height: 100%; object-fit: cover;
	transition: transform .4s ease;
}
.dongson-news-card:hover .dongson-news-card__img img { transform: scale(1.05); }
.dongson-news-card__body {
	padding: 1rem 1.25rem 1.25rem;
	display: flex; flex-direction: column; gap: .5rem; flex: 1;
}
.dongson-news-card__date { font-size: .8rem; color: #6b7280; }
.dongson-news-card__title {
	font-size: 1.05rem; font-weight: 700; margin: 0;
	color: var(--wp--preset--color--secondary); line-height: 1.4;
}
.dongson-news-card__title a { color: inherit; text-decoration: none; }
.dongson-news-card__title a:hover { color: var(--wp--preset--color--primary-dark); }
.dongson-news-card__excerpt { color: #4b5563; font-size: .9rem; margin: 0; flex: 1; }
.dongson-news-card__more {
	color: var(--wp--preset--color--primary-dark);
	font-weight: 700; text-decoration: none; font-size: .9rem;
}
.dongson-news-card__more:hover { text-decoration: underline; }

/* ==========================================================================
   12. Stats
   ========================================================================== */

.dongson-stats-section {
	background: linear-gradient(135deg, #0c1626 0%, #1a2942 60%, #2a3a5c 100%);
	color: #fff;
	position: relative; overflow: hidden;
}
.dongson-stats-section::before {
	content: ""; position: absolute; inset: 0;
	background: radial-gradient(circle at 80% 20%, rgba(226,162,52,0.2), transparent 60%);
	pointer-events: none;
}
.dongson-stats { position: relative; z-index: 1; }
.dongson-stats__head { text-align: center; margin-bottom: 2rem; }
.dongson-stats__head .is-style-section-title { color: #fff; }
.dongson-stats__head .is-style-section-title::after { background: var(--wp--preset--color--primary); }
.dongson-stats__head p { color: rgba(255,255,255,0.8); }
.dongson-stats__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 1.5rem;
	text-align: center;
}
.dongson-stat {
	background: rgba(255,255,255,0.04);
	border: 1px solid rgba(226,162,52,0.18);
	border-radius: 1rem;
	padding: 2rem 1rem;
	backdrop-filter: blur(4px);
}
.dongson-stat__value {
	display: block;
	font-size: clamp(2.25rem, 5vw, 3.5rem);
	font-weight: 800;
	color: var(--wp--preset--color--primary);
	line-height: 1;
}
.dongson-stat__label { display: block; margin-top: .5rem; font-weight: 500; }

/* ==========================================================================
   13. Partners marquee
   ========================================================================== */

.dongson-marquee {
	overflow: hidden;
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.dongson-marquee__track {
	display: flex; gap: 3rem; width: max-content;
	animation: dongson-marquee 30s linear infinite;
}
.dongson-partner-logo {
	display: inline-flex; align-items: center; justify-content: center;
	height: 70px; padding: 0 1.5rem;
	border: 1px solid var(--wp--preset--color--border);
	background: #fff;
	border-radius: .75rem;
	font-weight: 800;
	color: var(--wp--preset--color--secondary);
	font-size: 1.1rem; letter-spacing: 2px;
	transition: transform .2s ease, color .2s ease, border-color .2s ease;
	min-width: 180px;
}
.dongson-partner-logo:hover {
	transform: translateY(-2px);
	color: var(--wp--preset--color--primary-dark);
	border-color: var(--wp--preset--color--primary);
}
@keyframes dongson-marquee {
	0% { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}

/* ==========================================================================
   14. CTA banner
   ========================================================================== */

.dongson-cta {
	width: 100%;
	background: linear-gradient(135deg, var(--wp--preset--color--secondary-dark) 0%, var(--wp--preset--color--secondary) 60%, var(--wp--preset--color--primary-dark) 100%);
	color: #fff;
	padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 4vw, 3rem);
	position: relative;
	overflow: hidden;
}
.dongson-cta::before {
	content: ""; position: absolute; inset: 0;
	background: radial-gradient(circle at 90% 0%, rgba(226,162,52,0.3), transparent 40%);
	pointer-events: none;
}
.dongson-cta__inner {
	position: relative;
	max-width: 1200px; margin: 0 auto;
	display: flex; justify-content: space-between; align-items: center;
	gap: 2rem; flex-wrap: wrap;
}
.dongson-cta__eyebrow {
	color: var(--wp--preset--color--primary);
	font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
	font-size: .85rem; margin: 0 0 .5rem;
}
.dongson-cta__title {
	font-size: clamp(1.5rem, 2.8vw, 2.25rem);
	font-weight: 800; color: #fff; margin: 0 0 .5rem;
}
.dongson-cta__desc { color: rgba(255,255,255,0.85); margin: 0; }
.dongson-cta__actions { display: flex; gap: .75rem; flex-wrap: wrap; }

/* ==========================================================================
   15. Contact section
   ========================================================================== */

.dongson-contact {
	display: grid; grid-template-columns: 1fr 1.2fr;
	gap: 2rem; align-items: stretch;
}
@media (max-width: 768px) { .dongson-contact { grid-template-columns: 1fr; } }
.dongson-contact__info {
	background: var(--wp--preset--color--muted);
	border-radius: 1rem; padding: 1.5rem;
	display: flex; flex-direction: column; gap: 1rem;
}
.dongson-contact__item {
	display: flex; gap: .75rem; align-items: flex-start;
	padding: .75rem; border-radius: .5rem;
	background: #fff; border: 1px solid var(--wp--preset--color--border);
}
.dongson-contact__icon {
	flex-shrink: 0; width: 36px; height: 36px;
	border-radius: 50%;
	background: rgba(226,162,52,0.12);
	display: flex; align-items: center; justify-content: center;
	font-size: 1rem;
}
.dongson-contact__item strong {
	display: block; color: var(--wp--preset--color--secondary); font-size: .95rem;
}
.dongson-contact__item p { margin: .15rem 0 0; color: #4b5563; font-size: .9rem; }
.dongson-contact__map {
	border-radius: 1rem; overflow: hidden; min-height: 360px;
	border: 1px solid var(--wp--preset--color--border);
}
.dongson-contact__map iframe { width: 100%; height: 100%; min-height: 360px; border: 0; display: block; }

/* ==========================================================================
   16. Contact form
   ========================================================================== */

.dongson-form {
	max-width: 720px; margin: 0 auto;
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 1rem; padding: 1.5rem;
	box-shadow: 0 8px 24px rgba(12,22,38,0.06);
}
.dongson-form__row {
	display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
}
@media (max-width: 600px) { .dongson-form__row { grid-template-columns: 1fr; } }
.dongson-form__field { display: block; margin-bottom: 1rem; }
.dongson-form__field span {
	display: block; font-weight: 600; margin-bottom: .35rem;
	color: var(--wp--preset--color--secondary); font-size: .9rem;
}
.dongson-form__field em { color: var(--wp--preset--color--primary-dark); font-style: normal; }
.dongson-form__field input,
.dongson-form__field textarea {
	width: 100%; padding: .75rem 1rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .5rem; font: inherit;
	background: #fff; color: inherit;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.dongson-form__field input:focus,
.dongson-form__field textarea:focus {
	outline: none; border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 3px rgba(226,162,52,0.15);
}
.dongson-form__alert {
	padding: .75rem 1rem; border-radius: .5rem;
	margin-bottom: 1rem; font-size: .9rem;
}
.dongson-form__alert.is-success { background: #d1fae5; color: #065f46; }
.dongson-form__alert.is-error { background: #fee2e2; color: #991b1b; }

/* ==========================================================================
   17. Breadcrumb
   ========================================================================== */

.dongson-breadcrumb {
	background: var(--wp--preset--color--muted);
	font-size: .85rem;
	border-bottom: 1px solid var(--wp--preset--color--border);
}
.dongson-breadcrumb__inner {
	display: flex; align-items: center; gap: .5rem;
	padding: .75rem 0; color: #6b7280; flex-wrap: wrap;
}
.dongson-breadcrumb a { color: var(--wp--preset--color--primary-dark); text-decoration: none; }
.dongson-breadcrumb a:hover { text-decoration: underline; }
.dongson-breadcrumb__sep { opacity: .5; }

/* ==========================================================================
   18. Footer
   ========================================================================== */

.dongson-footer {
	font-size: .9rem;
	background: var(--wp--preset--color--secondary-dark) !important;
	color: #cbd5e1 !important;
}
.dongson-footer a { color: inherit; text-decoration: none; }
.dongson-footer a:hover { color: var(--wp--preset--color--primary); }
.dongson-footer__grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
	gap: 2rem; margin: 0 auto 2rem;
}
@media (max-width: 980px) {
	.dongson-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
	.dongson-footer__grid { grid-template-columns: 1fr; }
}
.dongson-footer__col h4 {
	color: #fff; font-size: 1rem; font-weight: 800;
	margin: 0 0 .75rem;
	position: relative; padding-bottom: .5rem;
	text-transform: uppercase; letter-spacing: 1px;
}
.dongson-footer__col h4::after {
	content: ""; display: block;
	width: 32px; height: 3px;
	background: var(--wp--preset--color--primary);
	border-radius: 2px;
	margin-top: .5rem;
}
.dongson-footer__col ul { list-style: none; padding: 0; margin: 0; }
.dongson-footer__col li { padding: .35rem 0; line-height: 1.5; }
.dongson-footer__logo img {
	width: 220px; height: auto;
	background: rgba(255,255,255,0.04);
	padding: .5rem .75rem; border-radius: .5rem;
	margin-bottom: .75rem;
	border: 1px solid rgba(226,162,52,0.2);
}
.dongson-footer__social {
	display: flex; gap: .5rem; margin-top: 1rem;
}
.dongson-footer__social a {
	width: 36px; height: 36px;
	border-radius: 50%;
	background: rgba(255,255,255,0.06);
	display: flex; align-items: center; justify-content: center;
	font-weight: 700; font-size: .8rem;
	transition: background .2s ease, color .2s ease;
}
.dongson-footer__social a:hover {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
}
.dongson-footer__bottom {
	border-top: 1px solid rgba(226,162,52,0.18);
	padding-top: 1rem; margin: 0 auto;
	display: flex; justify-content: space-between;
	flex-wrap: wrap; gap: 1rem;
	font-size: .85rem; color: rgba(255,255,255,0.6);
}
.dongson-footer__bottom p { margin: 0; }

/* ==========================================================================
   19. Floating contact (left side, vertical)
   ========================================================================== */

.dongson-floating-contact {
	position: fixed;
	left: 0.75rem;
	bottom: 1rem;
	z-index: 9999;
	display: flex; flex-direction: column; gap: .5rem;
}
.dongson-fc {
	display: inline-flex; align-items: center; gap: .5rem;
	padding: .55rem .9rem;
	border-radius: 999px;
	color: #fff; text-decoration: none;
	font-size: .85rem; font-weight: 700;
	box-shadow: 0 8px 20px rgba(0,0,0,0.2);
	transition: transform .2s ease;
}
.dongson-fc:hover { transform: translateX(2px); color: #fff; text-decoration: none; }
.dongson-fc__icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 1.5rem; height: 1.5rem;
	border-radius: 50%;
	background: rgba(255,255,255,0.2);
	font-weight: 800;
}
.dongson-fc--zalo { background: #0068ff; }
.dongson-fc--messenger { background: #0084ff; }
.dongson-fc--phone {
	background: linear-gradient(135deg, #f5c451 0%, #e2a234 100%);
	color: var(--wp--preset--color--secondary-dark);
}
.dongson-fc--phone .dongson-fc__icon { background: rgba(12,22,38,0.18); }
.dongson-fc--top { background: var(--wp--preset--color--secondary); }

@media (max-width: 600px) {
	.dongson-fc__label { display: none; }
	.dongson-fc { padding: .55rem; }
	.dongson-floating-contact { left: 0.5rem; }
}

/* ==========================================================================
   20. Misc
   ========================================================================== */

.dongson-section { scroll-margin-top: 80px; }

/* WooCommerce */
.woocommerce ul.products li.product .button,
.woocommerce a.button {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
	border-radius: 999px;
}
.woocommerce ul.products li.product .button:hover,
.woocommerce a.button:hover {
	background: var(--wp--preset--color--primary-light);
	color: var(--wp--preset--color--secondary-dark);
}


/* ==========================================================================
   21. Page hero (đầu trang con) + Breadcrumb
   ========================================================================== */

.dongson-page-hero {
	background: linear-gradient(135deg, var(--wp--preset--color--secondary-dark) 0%, var(--wp--preset--color--secondary) 60%, #2a3a5c 100%);
	color: #fff;
	padding: clamp(2.5rem, 6vw, 5rem) clamp(1rem, 4vw, 3rem) clamp(2rem, 5vw, 4rem);
	position: relative;
	overflow: hidden;
}
.dongson-page-hero::before {
	content: ""; position: absolute; inset: 0;
	background: radial-gradient(circle at 90% 0%, rgba(226,162,52,0.25), transparent 50%);
	pointer-events: none;
}
.dongson-page-hero__inner {
	position: relative;
	max-width: 1280px; margin: 0 auto;
}
.dongson-page-hero__title {
	font-size: clamp(1.75rem, 3.5vw, 2.75rem);
	font-weight: 800;
	color: #fff;
	margin: 0 0 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	position: relative;
	padding-bottom: 0.75rem;
}
.dongson-page-hero__title::after {
	content: ""; display: block;
	width: 64px; height: 4px;
	background: var(--wp--preset--color--primary);
	border-radius: 2px;
	margin-top: 0.75rem;
}

/* Breadcrumb inside page hero */
.dongson-page-hero .dongson-breadcrumb {
	background: transparent;
	border: 0;
	font-size: .9rem;
}
.dongson-page-hero .dongson-breadcrumb__inner {
	color: rgba(255,255,255,0.7);
	padding: 0;
}
.dongson-page-hero .dongson-breadcrumb a { color: var(--wp--preset--color--primary); }
.dongson-page-hero .dongson-breadcrumb a:hover { color: var(--wp--preset--color--primary-light); }

/* ==========================================================================
   22. With sidebar layout
   ========================================================================== */

.dongson-with-sidebar-wrap { background: #fff; }
.dongson-with-sidebar {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 2.5rem;
	max-width: 1280px;
	margin: 0 auto;
	padding-left: clamp(1rem, 4vw, 2rem);
	padding-right: clamp(1rem, 4vw, 2rem);
}
@media (max-width: 980px) {
	.dongson-with-sidebar { grid-template-columns: 1fr; gap: 2rem; }
}
.dongson-with-sidebar__content { min-width: 0; }
.dongson-with-sidebar__content > * + * { margin-top: 1.25rem; }
.dongson-with-sidebar__content img { max-width: 100%; height: auto; border-radius: .5rem; }

/* Article meta */
.dongson-article__meta {
	color: #6b7280;
	gap: 1rem !important;
	align-items: center;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--wp--preset--color--border);
}
.dongson-article__meta a { color: var(--wp--preset--color--primary-dark); text-decoration: none; }
.dongson-article__meta a:hover { text-decoration: underline; }
.dongson-article__tags a {
	display: inline-block;
	padding: .25rem .65rem;
	background: var(--wp--preset--color--muted);
	border-radius: 999px;
	font-size: .8rem;
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
	margin-right: .35rem;
}
.dongson-article__tags a:hover { background: var(--wp--preset--color--primary); color: var(--wp--preset--color--secondary-dark); }
.dongson-article__nav .wp-block-post-navigation-link a {
	color: var(--wp--preset--color--primary-dark);
	font-weight: 700;
	text-decoration: none;
}
.dongson-article__nav .wp-block-post-navigation-link a:hover {
	color: var(--wp--preset--color--secondary);
}

/* Archive card */
.dongson-archive-grid { gap: 1.5rem !important; }
.dongson-archive-card { overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.dongson-archive-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(12,22,38,0.08);
}
.dongson-archive-card .wp-block-post-featured-image {
	overflow: hidden;
	border-radius: .75rem .75rem 0 0;
}
.dongson-archive-card .wp-block-post-featured-image img {
	width: 100%; aspect-ratio: 16/10; object-fit: cover;
	border-radius: 0 !important;
}
.dongson-archive-card .wp-block-post-title a {
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
}
.dongson-archive-card .wp-block-post-title a:hover { color: var(--wp--preset--color--primary-dark); }
.dongson-archive-card .wp-block-post-date { color: #6b7280; }

/* ==========================================================================
   23. Sidebar widgets
   ========================================================================== */

.dongson-sidebar {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	position: sticky;
	top: 100px;
	align-self: flex-start;
	max-height: calc(100vh - 120px);
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: var(--wp--preset--color--border) transparent;
	padding-right: 4px;
}
.dongson-sidebar::-webkit-scrollbar {
	width: 6px;
}
.dongson-sidebar::-webkit-scrollbar-thumb {
	background: var(--wp--preset--color--border);
	border-radius: 3px;
}
@media (max-width: 980px) {
	.dongson-sidebar {
		position: static;
		max-height: none;
		overflow: visible;
		padding-right: 0;
	}
}
.dongson-widget {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .85rem;
	padding: 1.25rem;
}
.dongson-widget__title {
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 1rem;
	padding-bottom: .65rem;
	position: relative;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	border-bottom: 1px solid var(--wp--preset--color--border);
}
.dongson-widget__title::after {
	content: ""; position: absolute;
	left: 0; bottom: -1px;
	width: 48px; height: 3px;
	background: var(--wp--preset--color--primary);
	border-radius: 2px;
}
.dongson-widget__list {
	list-style: none; padding: 0; margin: 0;
	display: flex; flex-direction: column; gap: .85rem;
}
.dongson-widget__list--posts li,
.dongson-widget__list--products li {
	display: grid;
	grid-template-columns: 80px 1fr;
	gap: .75rem;
	padding-bottom: .85rem;
	border-bottom: 1px dashed var(--wp--preset--color--border);
}
.dongson-widget__list--posts li:last-child,
.dongson-widget__list--products li:last-child {
	border-bottom: 0; padding-bottom: 0;
}
.dongson-widget__thumb {
	display: block;
	width: 80px; height: 60px;
	overflow: hidden;
	border-radius: .4rem;
	background: var(--wp--preset--color--muted);
}
.dongson-widget__thumb img {
	width: 100%; height: 100%; object-fit: cover;
	transition: transform .35s ease;
}
.dongson-widget__thumb:hover img { transform: scale(1.05); }
.dongson-widget__body { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.dongson-widget__link {
	color: var(--wp--preset--color--secondary);
	font-size: .92rem;
	font-weight: 600;
	line-height: 1.35;
	text-decoration: none;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.dongson-widget__link:hover { color: var(--wp--preset--color--primary-dark); }
.dongson-widget__date { font-size: .75rem; color: #6b7280; }
.dongson-widget__more {
	font-size: .8rem;
	color: var(--wp--preset--color--primary-dark);
	font-weight: 700;
	text-decoration: none;
}
.dongson-widget__more:hover { text-decoration: underline; }

.dongson-widget__list--cats li { line-height: 1.6; }
.dongson-widget__list--cats a {
	display: block;
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
	padding: .5rem 0;
	border-bottom: 1px dashed var(--wp--preset--color--border);
	font-weight: 600;
	transition: color .2s ease, padding-left .2s ease;
}
.dongson-widget__list--cats li:last-child a { border-bottom: 0; }
.dongson-widget__list--cats a:hover {
	color: var(--wp--preset--color--primary-dark);
	padding-left: .35rem;
}

/* CTA widget */
.dongson-widget--cta {
	background: linear-gradient(135deg, var(--wp--preset--color--secondary-dark) 0%, var(--wp--preset--color--secondary) 100%);
	color: #fff;
	border-color: rgba(226,162,52,0.25);
	text-align: center;
}
.dongson-widget--cta .dongson-widget__title { color: #fff; border-bottom-color: rgba(255,255,255,0.15); }
.dongson-widget--cta p { color: rgba(255,255,255,0.85); margin: 0 0 1rem; font-size: .9rem; }
.dongson-widget--cta .dongson-btn { width: 100%; justify-content: center; margin-bottom: .5rem; }
.dongson-widget--cta .dongson-btn--ghost-dark {
	color: #fff;
	border-color: rgba(255,255,255,0.5);
}
.dongson-widget--cta .dongson-btn--ghost-dark:hover {
	background: #fff;
	color: var(--wp--preset--color--secondary-dark);
}


/* ==========================================================================
   24. Partner logo (image variant)
   ========================================================================== */

.dongson-partner-logo--img {
	padding: 0.5rem 1rem;
	min-width: 160px;
	max-width: 200px;
}
.dongson-partner-logo--img img {
	max-height: 50px;
	width: auto;
	max-width: 100%;
	object-fit: contain;
	filter: grayscale(0.2);
	transition: filter .25s ease;
}
.dongson-partner-logo--img:hover img {
	filter: grayscale(0);
}
a.dongson-partner-logo--img {
	text-decoration: none;
}

/* ==========================================================================
   25. WooCommerce single & archive tweaks
   ========================================================================== */

.woocommerce-breadcrumb {
	font-size: .85rem;
	color: #6b7280;
}
.woocommerce-breadcrumb a {
	color: var(--wp--preset--color--primary-dark);
	text-decoration: none;
}
.woocommerce-breadcrumb a:hover { text-decoration: underline; }

.wp-block-woocommerce-product-button .wp-block-button__link {
	background: var(--wp--preset--color--primary) !important;
	color: var(--wp--preset--color--secondary-dark) !important;
	border-radius: 999px;
	font-weight: 700;
}
.wp-block-woocommerce-product-button .wp-block-button__link:hover {
	background: var(--wp--preset--color--primary-light) !important;
}

.wp-block-woocommerce-product-price ins,
.wp-block-woocommerce-product-price .price {
	color: var(--wp--preset--color--primary-dark);
	font-weight: 800;
	text-decoration: none;
}

.dongson-product-card .wp-block-woocommerce-product-image {
	overflow: hidden;
	aspect-ratio: 3/2;
}
.dongson-product-card .wp-block-woocommerce-product-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Single product layout */
.single-product .product .summary {
	padding: 0;
}
.single-product .quantity .qty {
	width: 80px;
	padding: .5rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .5rem;
}
.single-product .single_add_to_cart_button {
	background: var(--wp--preset--color--primary) !important;
	color: var(--wp--preset--color--secondary-dark) !important;
	border-radius: 999px !important;
	padding: .85rem 1.75rem !important;
	font-weight: 800 !important;
	border: 0 !important;
}
.single-product .single_add_to_cart_button:hover {
	background: var(--wp--preset--color--primary-light) !important;
}


/* ==========================================================================
   26. Custom navigation (replaces wp-block-navigation)
   ========================================================================== */

.dongson-nav {
	flex: 1;
	display: flex;
	justify-content: center;
	min-width: 0;
}
.dongson-nav__list,
.dongson-nav .menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: nowrap;
	gap: 0;
	align-items: center;
}
.dongson-nav__list li,
.dongson-nav .menu li {
	position: relative;
	list-style: none;
}
.dongson-nav__list a,
.dongson-nav .menu a {
	display: block;
	color: #fff;
	text-decoration: none;
	font-weight: 700;
	font-size: 0.82rem;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	padding: 0.55rem 0.7rem;
	border-radius: 0.4rem;
	transition: color .2s ease, background .2s ease;
	white-space: nowrap;
}
@media (min-width: 1100px) {
	.dongson-nav__list a,
	.dongson-nav .menu a { padding: 0.6rem 0.85rem; font-size: 0.85rem; }
}
.dongson-nav__list a:hover,
.dongson-nav .menu a:hover,
.dongson-nav__list .current-menu-item > a,
.dongson-nav .menu .current-menu-item > a,
.dongson-nav .menu .current_page_item > a {
	color: var(--wp--preset--color--primary);
	background: rgba(226,162,52,0.08);
}

/* Submenu (children) */
.dongson-nav__list .has-children > a::after,
.dongson-nav .menu .menu-item-has-children > a::after,
.dongson-nav .menu .page_item_has_children > a::after {
	content: "▾";
	margin-left: 0.35rem;
	font-size: 0.7em;
	opacity: 0.7;
}
.dongson-nav__submenu,
.dongson-nav .sub-menu,
.dongson-nav .children {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 240px;
	background: var(--wp--preset--color--secondary-dark);
	border: 1px solid rgba(226,162,52,0.25);
	border-radius: 0.5rem;
	box-shadow: 0 12px 30px rgba(0,0,0,0.35);
	padding: 0.4rem;
	list-style: none;
	margin: 0.25rem 0 0;
	display: flex;
	flex-direction: column;
	gap: 0;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-4px);
	transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
	z-index: 60;
}
.dongson-nav__list li:hover > .dongson-nav__submenu,
.dongson-nav__list li:focus-within > .dongson-nav__submenu,
.dongson-nav .menu li:hover > .sub-menu,
.dongson-nav .menu li:focus-within > .sub-menu,
.dongson-nav .menu li:hover > .children,
.dongson-nav .menu li:focus-within > .children {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	transition: opacity .2s ease, transform .2s ease, visibility 0s linear 0s;
}
.dongson-nav__submenu a,
.dongson-nav .sub-menu a,
.dongson-nav .children a {
	color: #f1f5f9;
	font-size: 0.8rem;
	padding: 0.55rem 0.75rem;
	border-radius: 0.3rem;
}
.dongson-nav__submenu a:hover,
.dongson-nav .sub-menu a:hover,
.dongson-nav .children a:hover {
	background: rgba(226,162,52,0.15);
	color: var(--wp--preset--color--primary);
}

/* Mobile */
@media (max-width: 860px) {
	.dongson-nav {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: var(--wp--preset--color--secondary-dark);
		max-height: 0;
		overflow: hidden;
		transition: max-height .35s ease;
		z-index: 50;
		border-top: 2px solid var(--wp--preset--color--primary);
	}
	.dongson-header.is-open .dongson-nav {
		max-height: 80vh;
		overflow: auto;
	}
	.dongson-nav__list,
	.dongson-nav .menu {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		padding: 0.5rem;
	}
	.dongson-nav__list a,
	.dongson-nav .menu a {
		padding: 0.85rem 0.75rem;
		border-bottom: 1px solid rgba(255,255,255,0.06);
		border-radius: 0;
	}
	.dongson-nav__submenu,
	.dongson-nav .sub-menu,
	.dongson-nav .children {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		background: rgba(0,0,0,0.25);
		border: 0;
		box-shadow: none;
		margin: 0;
		padding: 0 0 0 1rem;
		border-radius: 0;
	}
	.dongson-nav__submenu a,
	.dongson-nav .sub-menu a,
	.dongson-nav .children a {
		font-size: 0.78rem;
		padding: 0.65rem 0.75rem;
	}
}


/* ==========================================================================
   27. Hero full-bleed wrapper (override constrained padding)
   ========================================================================== */

/* Wrap quanh hero: phá ra khỏi constrained main, full viewport width */
.dongson-hero-wrap.alignfull {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	padding: 0 !important;
}
.dongson-hero-wrap > .dongson-hero {
	width: 100%;
	margin: 0;
}


/* ==========================================================================
   28. Page Hero (banner đầu trang con) - cân đối + lớn hơn
   ========================================================================== */

/* Wrap full-bleed để break ra khỏi constrained main */
.dongson-page-hero-wrap.alignfull {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	padding: 0 !important;
}

.dongson-page-hero {
	position: relative;
	background-color: var(--wp--preset--color--secondary-dark);
	color: #fff;
	padding: clamp(3.5rem, 8vw, 6rem) clamp(1.25rem, 5vw, 3rem) clamp(3rem, 6vw, 5rem);
	overflow: hidden;
	isolation: isolate;
	min-height: clamp(280px, 42vh, 460px);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.dongson-page-hero__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: .35;
	z-index: -3;
	transform: scale(1.05);
	will-change: transform;
}

.dongson-page-hero__overlay {
	position: absolute; inset: 0;
	background:
		linear-gradient(180deg, rgba(12,22,38,0.85) 0%, rgba(12,22,38,0.78) 60%, rgba(26,41,66,0.85) 100%),
		radial-gradient(ellipse at center, transparent 0%, rgba(12,22,38,0.5) 80%);
	z-index: -2;
}

/* Pattern grid lưới mờ */
.dongson-page-hero__pattern {
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(rgba(226,162,52,0.05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(226,162,52,0.05) 1px, transparent 1px);
	background-size: 60px 60px;
	z-index: -1;
	mask-image: radial-gradient(ellipse at center, black 0%, transparent 70%);
	-webkit-mask-image: radial-gradient(ellipse at center, black 0%, transparent 70%);
}

.dongson-page-hero__inner {
	max-width: 920px;
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}

/* Eyebrow with horizontal lines */
.dongson-page-hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 1rem;
	font-size: .85rem;
	letter-spacing: 4px;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary);
	margin: 0 0 1.25rem;
	font-weight: 700;
}
.dongson-page-hero__eyebrow-line {
	width: 32px;
	height: 1px;
	background: linear-gradient(90deg, transparent 0%, var(--wp--preset--color--primary) 100%);
}
.dongson-page-hero__eyebrow-line:last-child {
	background: linear-gradient(90deg, var(--wp--preset--color--primary) 0%, transparent 100%);
}

.dongson-page-hero__title {
	font-size: clamp(2.5rem, 6vw, 4.5rem);
	font-weight: 900;
	color: #fff;
	margin: 0 0 1.25rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	line-height: 1.05;
	text-shadow: 0 4px 24px rgba(0,0,0,0.4);
}

/* Decorative underline below title */
.dongson-page-hero__title::after {
	content: "";
	display: block;
	width: 100px;
	height: 4px;
	background: linear-gradient(90deg, transparent 0%, #f5c451 30%, #e2a234 50%, #a87212 70%, transparent 100%);
	border-radius: 2px;
	margin: 1.25rem auto 0;
	box-shadow: 0 0 16px rgba(226,162,52,0.5);
}

.dongson-page-hero__subtitle {
	color: rgba(255,255,255,0.82);
	font-size: clamp(.95rem, 1.4vw, 1.1rem);
	line-height: 1.7;
	margin: 0 auto 1.5rem;
	max-width: 720px;
}

/* Stats inline */
.dongson-page-hero__stats {
	display: flex;
	gap: 2rem;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 1.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(226,162,52,0.2);
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
}
.dongson-page-hero__stat {
	display: flex;
	flex-direction: column;
	gap: .15rem;
	min-width: 0;
}
.dongson-page-hero__stat strong {
	font-size: 1.85rem;
	font-weight: 900;
	color: var(--wp--preset--color--primary);
	line-height: 1;
	letter-spacing: 1px;
}
.dongson-page-hero__stat span {
	font-size: .82rem;
	color: rgba(255,255,255,0.7);
	font-weight: 500;
	letter-spacing: 0.5px;
}

/* Breadcrumb on top */
.dongson-page-hero .dongson-breadcrumb {
	background: transparent;
	border: 0;
	font-size: .85rem;
	margin-bottom: 1.25rem;
	display: flex;
	justify-content: center;
}
.dongson-page-hero .dongson-breadcrumb__inner {
	color: rgba(255,255,255,0.65);
	padding: 0;
	gap: .55rem;
	justify-content: center;
}
.dongson-page-hero .dongson-breadcrumb a {
	color: var(--wp--preset--color--primary);
	font-weight: 600;
}
.dongson-page-hero .dongson-breadcrumb a:hover {
	color: var(--wp--preset--color--primary-light);
	text-decoration: underline;
}
.dongson-page-hero .dongson-breadcrumb__sep {
	color: rgba(226,162,52,0.45);
}

@media (max-width: 600px) {
	.dongson-page-hero {
		padding: 2.5rem 1rem 2.25rem;
		min-height: 240px;
	}
	.dongson-page-hero__eyebrow {
		font-size: .72rem;
		letter-spacing: 2.5px;
		gap: .55rem;
	}
	.dongson-page-hero__eyebrow-line {
		width: 18px;
	}
	.dongson-page-hero__stats {
		gap: 1.25rem;
	}
	.dongson-page-hero__stat strong {
		font-size: 1.4rem;
	}
}

/* ==========================================================================
   29. Page content – typography đẹp, dễ đọc
   ========================================================================== */

.dongson-page-content {
	font-size: 1rem;
	line-height: 1.75;
	color: #1f2937;
}
.dongson-page-content > * + * {
	margin-top: 1.15rem;
}
.dongson-page-content h2,
.dongson-page-content h3,
.dongson-page-content h4 {
	color: var(--wp--preset--color--secondary);
	font-weight: 800;
	line-height: 1.3;
	scroll-margin-top: 100px;
}
.dongson-page-content h2 {
	font-size: clamp(1.4rem, 2.4vw, 1.85rem);
	margin-top: 2rem;
	padding-bottom: .5rem;
	border-bottom: 2px solid var(--wp--preset--color--border);
	position: relative;
}
.dongson-page-content h2::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -2px;
	width: 60px;
	height: 2px;
	background: var(--wp--preset--color--primary);
}
.dongson-page-content h3 {
	font-size: 1.3rem;
	margin-top: 1.6rem;
	padding-left: .85rem;
	border-left: 4px solid var(--wp--preset--color--primary);
}
.dongson-page-content h4 {
	font-size: 1.1rem;
	margin-top: 1.4rem;
}
.dongson-page-content ul,
.dongson-page-content ol {
	padding-left: 1.5rem;
}
.dongson-page-content ul li,
.dongson-page-content ol li {
	margin: .35rem 0;
}
.dongson-page-content ul li::marker {
	color: var(--wp--preset--color--primary);
}
.dongson-page-content blockquote {
	background: var(--wp--preset--color--muted);
	border-left: 4px solid var(--wp--preset--color--primary);
	padding: 1rem 1.25rem;
	margin: 1.5rem 0;
	border-radius: 0 .5rem .5rem 0;
	font-style: italic;
}
.dongson-page-content img {
	border-radius: .75rem;
	box-shadow: 0 8px 24px rgba(12,22,38,0.08);
}
.dongson-page-content a {
	color: var(--wp--preset--color--primary-dark);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}
.dongson-page-content a:hover {
	color: var(--wp--preset--color--primary);
}

/* ==========================================================================
   30. Article (single post) – meta đẹp
   ========================================================================== */

.dongson-article__meta {
	gap: .75rem 1.25rem !important;
	align-items: center;
	padding: .75rem 1rem;
	margin-bottom: 1.5rem;
	background: var(--wp--preset--color--muted);
	border-radius: .65rem;
	border-left: 4px solid var(--wp--preset--color--primary);
}
.dongson-article__meta .wp-block-post-author-name,
.dongson-article__meta .wp-block-post-date,
.dongson-article__meta .wp-block-post-terms {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	color: #6b7280;
	font-size: .85rem;
	margin: 0;
}
.dongson-article__meta .wp-block-post-author-name::before { content: "👤"; font-size: .9rem; }
.dongson-article__meta .wp-block-post-date::before { content: "🗓"; font-size: .9rem; }
.dongson-article__meta .wp-block-post-terms::before { content: "🏷"; font-size: .9rem; }
.dongson-article__meta a {
	color: var(--wp--preset--color--primary-dark);
	text-decoration: none;
	font-weight: 600;
}
.dongson-article__meta a:hover { text-decoration: underline; }

.dongson-article__tags .wp-block-post-terms a {
	display: inline-block;
	margin: .25rem .25rem .25rem 0;
	padding: .25rem .75rem;
	background: var(--wp--preset--color--muted);
	color: var(--wp--preset--color--secondary);
	font-size: .8rem;
	border-radius: 999px;
	text-decoration: none;
	transition: background .2s ease, color .2s ease;
}
.dongson-article__tags .wp-block-post-terms a:hover {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
}

.dongson-article__nav {
	gap: 1rem !important;
}
.dongson-article__nav .wp-block-post-navigation-link {
	flex: 1;
	min-width: 0;
}
.dongson-article__nav .wp-block-post-navigation-link a {
	display: block;
	padding: .85rem 1rem;
	background: var(--wp--preset--color--muted);
	border-radius: .65rem;
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
	font-weight: 700;
	transition: background .2s ease, color .2s ease;
}
.dongson-article__nav .wp-block-post-navigation-link a:hover {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
}
.dongson-article__nav .post-navigation-link-next {
	text-align: right;
}

/* ==========================================================================
   31. Share buttons
   ========================================================================== */

.dongson-share {
	display: flex;
	align-items: center;
	gap: .5rem;
	flex-wrap: wrap;
	padding: 1rem 1.25rem;
	background: var(--wp--preset--color--muted);
	border-radius: .65rem;
}
.dongson-share__label {
	font-weight: 700;
	color: var(--wp--preset--color--secondary);
	margin-right: .5rem;
}
.dongson-share__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #fff;
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
	border: 1px solid var(--wp--preset--color--border);
	cursor: pointer;
	transition: transform .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
	font-weight: 800;
	font-size: .85rem;
}
.dongson-share__btn:hover {
	transform: translateY(-2px);
	color: #fff;
	border-color: transparent;
}
.dongson-share__btn--fb:hover { background: #1877f2; }
.dongson-share__btn--zalo { color: #fff; background: #0068ff; border-color: transparent; }
.dongson-share__btn--zalo:hover { background: #0058d9; }
.dongson-share__btn--twitter:hover { background: #000; }
.dongson-share__btn--linkedin:hover { background: #0a66c2; }
.dongson-share__btn--copy:hover { background: var(--wp--preset--color--primary); color: var(--wp--preset--color--secondary-dark); }
.dongson-share__copied {
	font-size: .82rem;
	color: var(--wp--preset--color--primary-dark);
	font-weight: 700;
	opacity: 0;
	transition: opacity .25s ease;
}
.dongson-share__copied.is-shown { opacity: 1; }

/* ==========================================================================
   32. Related posts
   ========================================================================== */

.dongson-related {
	border-top: 1px solid var(--wp--preset--color--border);
	padding-top: 2rem;
}
.dongson-related__title {
	font-size: 1.4rem;
	font-weight: 800;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 1.25rem;
	padding-bottom: .5rem;
	border-bottom: 2px solid var(--wp--preset--color--primary);
	display: inline-block;
}
.dongson-related__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1rem;
}
.dongson-related__card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .65rem;
	overflow: hidden;
	transition: transform .2s ease, box-shadow .2s ease;
}
.dongson-related__card:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(12,22,38,0.1);
}
.dongson-related__img {
	display: block;
	aspect-ratio: 16/10;
	overflow: hidden;
}
.dongson-related__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .35s ease;
}
.dongson-related__card:hover .dongson-related__img img {
	transform: scale(1.05);
}
.dongson-related__body {
	padding: .85rem 1rem 1rem;
}
.dongson-related__date {
	font-size: .75rem;
	color: #6b7280;
}
.dongson-related__heading {
	font-size: .95rem;
	font-weight: 700;
	margin: .35rem 0 0;
	line-height: 1.4;
}
.dongson-related__heading a {
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
}
.dongson-related__heading a:hover {
	color: var(--wp--preset--color--primary-dark);
}

/* ==========================================================================
   33. Archive cards (chuyên mục bài viết)
   ========================================================================== */

.dongson-archive-card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .85rem;
	overflow: hidden;
	display: flex !important;
	flex-direction: column;
	transition: transform .2s ease, box-shadow .2s ease;
}
.dongson-archive-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 36px rgba(12,22,38,0.1);
}
.dongson-archive-card__img {
	overflow: hidden;
	margin: 0 !important;
}
.dongson-archive-card__img img {
	width: 100%;
	aspect-ratio: 16/10;
	object-fit: cover;
	border-radius: 0 !important;
	transition: transform .35s ease;
}
.dongson-archive-card:hover .dongson-archive-card__img img {
	transform: scale(1.05);
}
.dongson-archive-card__body {
	display: flex !important;
	flex-direction: column;
	gap: .55rem;
	flex: 1;
}
.dongson-archive-card__cat .wp-block-post-terms-list a,
.dongson-archive-card__cat a {
	display: inline-block;
	font-size: .72rem !important;
	font-weight: 800;
	letter-spacing: .5px;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary-dark);
	background: rgba(226,162,52,0.12);
	padding: .25rem .65rem;
	border-radius: 999px;
	text-decoration: none;
}
.dongson-archive-card__title {
	margin: 0 !important;
	line-height: 1.35;
}
.dongson-archive-card__title a {
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
}
.dongson-archive-card__title a:hover {
	color: var(--wp--preset--color--primary-dark);
}
.dongson-archive-card__excerpt {
	color: #4b5563;
	margin: 0 !important;
	flex: 1;
}
.dongson-archive-card__foot {
	color: #6b7280;
	gap: .5rem 1rem !important;
	margin-top: auto !important;
	padding-top: .75rem;
	border-top: 1px dashed var(--wp--preset--color--border);
}
.dongson-archive-card__foot .wp-block-read-more {
	color: var(--wp--preset--color--primary-dark) !important;
	font-weight: 700;
	text-decoration: none;
}

/* Pagination */
.wp-block-query-pagination {
	gap: .25rem !important;
	flex-wrap: wrap;
}
.wp-block-query-pagination-previous,
.wp-block-query-pagination-next,
.page-numbers {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 .85rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .4rem;
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
	font-weight: 600;
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.wp-block-query-pagination-previous:hover,
.wp-block-query-pagination-next:hover,
.page-numbers:hover,
.page-numbers.current {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
}

/* ==========================================================================
   34. Search form & search results
   ========================================================================== */

.dongson-search-form .wp-block-search__inside-wrapper {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	overflow: hidden;
	padding: .25rem;
	background: #fff;
}
.dongson-search-form input[type="search"] {
	border: 0;
	padding: .65rem 1rem;
	font-size: .95rem;
	flex: 1;
	background: transparent;
	color: var(--wp--preset--color--secondary);
}
.dongson-search-form input[type="search"]:focus {
	outline: none;
}
.dongson-search-form button {
	background: var(--wp--preset--color--primary) !important;
	color: var(--wp--preset--color--secondary-dark) !important;
	border-radius: 999px !important;
	padding: .55rem 1.25rem !important;
	font-weight: 700;
	border: 0;
}

.dongson-search-results {
	display: flex !important;
	flex-direction: column;
	gap: 1rem;
	list-style: none;
	padding: 0;
	margin: 1.5rem 0 0;
}
.dongson-search-item {
	gap: 1rem !important;
	padding: 1rem;
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .75rem;
	align-items: flex-start !important;
	transition: transform .2s ease, box-shadow .2s ease;
}
.dongson-search-item:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(12,22,38,0.08);
}
.dongson-search-item__img {
	flex: 0 0 180px;
	max-width: 180px;
	margin: 0 !important;
}
.dongson-search-item__img img {
	width: 100%;
	height: 120px;
	object-fit: cover;
	border-radius: .5rem;
}
.dongson-search-item__body {
	flex: 1;
	min-width: 0;
}
.dongson-search-item__body .wp-block-post-title {
	margin: 0 0 .35rem !important;
}
.dongson-search-item__body .wp-block-post-title a {
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
}
.dongson-search-item__body .wp-block-post-title a:hover {
	color: var(--wp--preset--color--primary-dark);
}
.dongson-search-item__body .wp-block-post-date {
	color: #6b7280;
	font-size: .8rem !important;
	margin-top: .35rem;
}
@media (max-width: 600px) {
	.dongson-search-item { flex-direction: column !important; }
	.dongson-search-item__img { flex-basis: auto; max-width: 100%; }
	.dongson-search-item__img img { height: 200px; }
}

.dongson-empty {
	padding: 2.5rem 1rem;
	background: var(--wp--preset--color--muted);
	border-radius: .75rem;
	margin-top: 1.5rem;
}

/* ==========================================================================
   35. 404 page
   ========================================================================== */

.dongson-404 {
	background: linear-gradient(135deg, var(--wp--preset--color--secondary-dark) 0%, var(--wp--preset--color--secondary) 60%, #2a3a5c 100%);
	color: #fff;
	position: relative;
	overflow: hidden;
}
.dongson-404::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 80% 20%, rgba(226,162,52,0.2), transparent 60%);
	pointer-events: none;
}
.dongson-404 > * {
	position: relative;
}
.dongson-404__code {
	font-size: clamp(5rem, 14vw, 9rem) !important;
	font-weight: 900;
	line-height: 1;
	background: linear-gradient(135deg, #f5c451 0%, #e2a234 50%, #a87212 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	margin: 0 0 .5rem;
}
.dongson-404__title {
	color: #fff !important;
	font-size: clamp(1.5rem, 3vw, 2.25rem) !important;
	font-weight: 800;
	margin: 0 0 .75rem;
}
.dongson-404__desc {
	color: rgba(255,255,255,0.78);
	max-width: 560px;
	margin: 0 auto 1.5rem !important;
}
.dongson-404 .dongson-search-form .wp-block-search__inside-wrapper {
	background: rgba(255,255,255,0.95);
}

/* ==========================================================================
   36. Comments
   ========================================================================== */

.dongson-comments {
	margin-top: 3rem !important;
	padding-top: 2rem;
	border-top: 1px solid var(--wp--preset--color--border);
}
.dongson-comments .wp-block-comments-title {
	font-size: 1.4rem;
	font-weight: 800;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 1.5rem;
	padding-bottom: .5rem;
	border-bottom: 2px solid var(--wp--preset--color--primary);
	display: inline-block;
}

/* ==========================================================================
   37. Page hero responsive: nâng padding cho mobile
   ========================================================================== */

@media (max-width: 600px) {
	.dongson-page-hero {
		padding: 2rem 1rem 2rem;
	}
	.dongson-with-sidebar {
		grid-template-columns: 1fr !important;
	}
}


/* ==========================================================================
   38. Project cards (archive-project)
   ========================================================================== */

.dongson-project-grid {
	gap: 1.5rem !important;
}
.dongson-project-card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .85rem;
	overflow: hidden;
	display: flex !important;
	flex-direction: column;
	transition: transform .2s ease, box-shadow .2s ease;
}
.dongson-project-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 36px rgba(12,22,38,0.12);
}
.dongson-project-card__img {
	overflow: hidden;
	margin: 0 !important;
	aspect-ratio: 4/3;
}
.dongson-project-card__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0 !important;
	transition: transform .35s ease;
}
.dongson-project-card:hover .dongson-project-card__img img {
	transform: scale(1.06);
}
.dongson-project-card__body {
	display: flex !important;
	flex-direction: column;
	gap: .55rem;
	padding: 1rem 1.15rem 1.25rem;
	flex: 1;
}
.dongson-project-card__cat .wp-block-post-terms-list a,
.dongson-project-card__cat a {
	display: inline-block;
	font-size: .7rem !important;
	font-weight: 800;
	letter-spacing: .5px;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary-dark);
	background: rgba(226,162,52,0.12);
	padding: .25rem .65rem;
	border-radius: 999px;
	text-decoration: none;
}
.dongson-project-card__title {
	margin: 0 !important;
	line-height: 1.35;
	font-weight: 700 !important;
}
.dongson-project-card__title a {
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
}
.dongson-project-card__title a:hover {
	color: var(--wp--preset--color--primary-dark);
}
.dongson-project-card__excerpt {
	color: #4b5563;
	margin: 0 !important;
}

/* ==========================================================================
   39. Project meta box (sidebar trên single-project)
   ========================================================================== */

.dongson-project-meta {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .85rem;
	padding: 1.25rem;
	box-shadow: 0 4px 16px rgba(12,22,38,0.05);
	position: sticky;
	top: 100px;
}
.dongson-project-meta__title {
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 1rem;
	padding-bottom: .65rem;
	border-bottom: 2px solid var(--wp--preset--color--primary);
	display: inline-block;
	text-transform: uppercase;
	letter-spacing: .5px;
}
.dongson-project-meta__list {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.dongson-project-meta__row {
	display: flex;
	flex-direction: column;
	gap: .25rem;
	padding-bottom: .85rem;
	border-bottom: 1px dashed var(--wp--preset--color--border);
}
.dongson-project-meta__row:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}
.dongson-project-meta__row dt {
	font-size: .8rem;
	color: #6b7280;
	font-weight: 600;
	display: flex;
	gap: .35rem;
	align-items: center;
}
.dongson-project-meta__row dd {
	margin: 0;
	font-weight: 700;
	color: var(--wp--preset--color--secondary);
	font-size: .95rem;
}
.dongson-project-meta__row dd a {
	color: var(--wp--preset--color--primary-dark);
	text-decoration: none;
}
.dongson-project-meta__row dd a:hover {
	text-decoration: underline;
}

/* ==========================================================================
   40. Filter chips (archive filters)
   ========================================================================== */

.dongson-filter-chips {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	justify-content: center;
	margin: 0 auto 2rem;
	padding: 0;
}
.dongson-filter-chip {
	display: inline-flex;
	align-items: center;
	padding: .5rem 1.1rem;
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
	font-weight: 600;
	font-size: .88rem;
	transition: all .2s ease;
	white-space: nowrap;
}
.dongson-filter-chip:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary-dark);
	transform: translateY(-1px);
}
.dongson-filter-chip.is-active {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
	box-shadow: 0 4px 12px rgba(226,162,52,0.3);
}

/* Section alt (muted background) */
.dongson-section--alt {
	background: var(--wp--preset--color--muted);
}
.dongson-section--alt .alignwide {
	max-width: 1280px;
	padding-left: clamp(1rem, 4vw, 2rem);
	padding-right: clamp(1rem, 4vw, 2rem);
}


/* ==========================================================================
   41. Shop sidebar (left) layout
   ========================================================================== */

.dongson-with-sidebar.dongson-with-sidebar--left {
	grid-template-columns: 280px minmax(0, 1fr);
}
@media (max-width: 980px) {
	.dongson-with-sidebar.dongson-with-sidebar--left {
		grid-template-columns: 1fr;
	}
}
.dongson-shop-sidebar {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.dongson-shop-search {
	display: flex;
	gap: .35rem;
	align-items: stretch;
}
.dongson-shop-search input[type="search"] {
	flex: 1;
	min-width: 0;
	padding: .55rem .85rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .4rem;
	font-size: .9rem;
	background: #fff;
}
.dongson-shop-search input[type="search"]:focus {
	outline: none;
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 3px rgba(226,162,52,.15);
}
.dongson-shop-search button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
	border: 0;
	border-radius: .4rem;
	cursor: pointer;
}
.dongson-shop-search button:hover {
	background: var(--wp--preset--color--primary-light);
}

.dongson-widget__count {
	color: #9ca3af;
	font-size: .8rem;
	font-weight: 500;
	margin-left: .25rem;
}
.dongson-widget__price {
	color: var(--wp--preset--color--primary-dark);
	font-weight: 800;
	font-size: .9rem;
}
.dongson-widget__price del {
	color: #9ca3af;
	font-weight: 500;
	margin-right: .35rem;
}

/* ==========================================================================
   42. Shop toolbar (sort + notice)
   ========================================================================== */

.dongson-shop-toolbar {
	background: var(--wp--preset--color--muted);
	border-radius: .65rem;
	padding: .75rem 1rem;
	margin-bottom: 1.5rem;
	gap: 1rem !important;
	align-items: center;
}
.dongson-shop-toolbar .woocommerce-ordering select,
.dongson-shop-toolbar select {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .4rem;
	padding: .5rem .85rem;
	background: #fff;
	font-size: .9rem;
	color: var(--wp--preset--color--secondary);
	cursor: pointer;
}

/* ==========================================================================
   43. Shop product cards
   ========================================================================== */

.dongson-shop-grid {
	gap: 1.5rem !important;
}
.dongson-shop-card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .85rem;
	overflow: hidden;
	display: flex !important;
	flex-direction: column;
	transition: transform .2s ease, box-shadow .2s ease;
	position: relative;
}
.dongson-shop-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 40px rgba(12,22,38,0.12);
}
.dongson-shop-card__img {
	overflow: hidden;
	margin: 0 !important;
	aspect-ratio: 4/3;
	background: var(--wp--preset--color--muted);
}
.dongson-shop-card__img img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	transition: transform .35s ease;
}
.dongson-shop-card:hover .dongson-shop-card__img img {
	transform: scale(1.06);
}
.dongson-shop-card__img .wc-block-components-product-sale-badge,
.dongson-shop-card__img .onsale {
	position: absolute;
	top: .65rem;
	left: .65rem;
	background: linear-gradient(135deg, #f5c451 0%, #e2a234 100%);
	color: var(--wp--preset--color--secondary-dark);
	font-size: .7rem;
	font-weight: 800;
	padding: .25rem .65rem;
	border-radius: 999px;
	letter-spacing: .5px;
	z-index: 2;
}
.dongson-shop-card__body {
	padding: 1rem 1.15rem 1.25rem;
	display: flex !important;
	flex-direction: column;
	gap: .55rem;
	flex: 1;
}
.dongson-shop-card__title {
	margin: 0 !important;
	font-weight: 700 !important;
	line-height: 1.4;
	min-height: 2.8em;
}
.dongson-shop-card__title a {
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
}
.dongson-shop-card__title a:hover {
	color: var(--wp--preset--color--primary-dark);
}
.dongson-shop-card__price {
	color: var(--wp--preset--color--primary-dark);
	font-weight: 800;
	font-size: 1.1rem;
}
.dongson-shop-card__price ins {
	text-decoration: none;
	color: var(--wp--preset--color--primary-dark);
}
.dongson-shop-card__price del {
	color: #9ca3af;
	font-weight: 500;
	font-size: .9rem;
	margin-right: .5rem;
}
.dongson-shop-card__button .wp-block-button__link {
	display: block;
	width: 100%;
	text-align: center;
	background: var(--wp--preset--color--primary) !important;
	color: var(--wp--preset--color--secondary-dark) !important;
	border-radius: 999px !important;
	padding: .65rem 1rem !important;
	font-weight: 700 !important;
	margin-top: auto;
}
.dongson-shop-card__button .wp-block-button__link:hover {
	background: var(--wp--preset--color--primary-light) !important;
}

/* ==========================================================================
   44. Single product summary
   ========================================================================== */

.dongson-product-breadcrumb {
	background: var(--wp--preset--color--muted);
	border-bottom: 1px solid var(--wp--preset--color--border);
	font-size: .85rem;
}
.dongson-product-breadcrumb a {
	color: var(--wp--preset--color--primary-dark);
	text-decoration: none;
}
.dongson-product-breadcrumb a:hover {
	text-decoration: underline;
}
.woocommerce-breadcrumb {
	color: #6b7280;
}

.dongson-product-summary__gallery img {
	border-radius: .85rem;
}

.dongson-product-summary__title {
	font-size: clamp(1.5rem, 2.6vw, 2rem) !important;
	font-weight: 800 !important;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 .5rem !important;
	line-height: 1.25;
}
.dongson-product-summary__price {
	background: linear-gradient(135deg, rgba(226,162,52,0.08) 0%, rgba(226,162,52,0) 100%);
	padding: .75rem 1rem;
	border-left: 4px solid var(--wp--preset--color--primary);
	border-radius: 0 .5rem .5rem 0;
	margin: 1rem 0 !important;
}
.dongson-product-summary__price .price ins,
.dongson-product-summary__price .price {
	color: var(--wp--preset--color--primary-dark);
	font-weight: 900;
	text-decoration: none;
	font-size: 1.6rem;
}
.dongson-product-summary__price .price del {
	color: #9ca3af;
	font-weight: 500;
	font-size: 1rem;
	margin-right: .5rem;
}
.dongson-product-summary__excerpt {
	color: #4b5563;
	font-size: .98rem;
	margin: 1rem 0 1.25rem !important;
	line-height: 1.7;
}

/* WooCommerce add to cart form styling */
.single-product form.cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem;
	margin: 1rem 0 1.5rem;
}
.single-product form.cart .quantity {
	display: flex;
	align-items: center;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	overflow: hidden;
	background: #fff;
}
.single-product form.cart .qty {
	width: 64px;
	height: 44px;
	border: 0;
	text-align: center;
	font-weight: 700;
	background: transparent;
}
.single-product form.cart .qty:focus { outline: none; }

.dongson-product-features {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	margin-top: 1.5rem;
	padding: 1rem 1.25rem;
	background: var(--wp--preset--color--muted);
	border-radius: .65rem;
}
.dongson-product-feature {
	display: flex;
	gap: .75rem;
	align-items: flex-start;
	padding: .5rem 0;
	border-bottom: 1px dashed rgba(0,0,0,0.06);
}
.dongson-product-feature:last-child {
	border-bottom: 0;
}
.dongson-product-feature__icon {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(226,162,52,0.12);
	border-radius: 50%;
	font-size: 1.1rem;
}
.dongson-product-feature strong {
	display: block;
	color: var(--wp--preset--color--secondary);
	font-size: .92rem;
	margin-bottom: .15rem;
}
.dongson-product-feature span {
	display: block;
	color: #6b7280;
	font-size: .82rem;
	line-height: 1.5;
}

/* Product meta (categories, tags, sku) */
.product_meta {
	border-top: 1px solid var(--wp--preset--color--border);
	padding-top: 1rem;
	margin-top: 1rem;
	font-size: .85rem;
	color: #6b7280;
	display: flex;
	flex-direction: column;
	gap: .35rem;
}
.product_meta a {
	color: var(--wp--preset--color--primary-dark);
	text-decoration: none;
}
.product_meta a:hover { text-decoration: underline; }
.product_meta > span {
	display: inline-flex;
	gap: .5rem;
}

/* ==========================================================================
   45. Product details (description tabs)
   ========================================================================== */

.dongson-product-details .wc-tabs-wrapper {
	background: #fff;
	border-radius: .85rem;
	padding: 1.5rem;
	box-shadow: 0 4px 16px rgba(12,22,38,0.05);
}
.dongson-product-details .wc-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: .25rem;
	list-style: none;
	padding: 0;
	margin: 0 0 1.5rem;
	border-bottom: 2px solid var(--wp--preset--color--border);
}
.dongson-product-details .wc-tabs li {
	margin: 0;
	padding: 0;
}
.dongson-product-details .wc-tabs li a {
	display: block;
	padding: .85rem 1.25rem;
	color: #6b7280;
	text-decoration: none;
	font-weight: 700;
	font-size: .9rem;
	text-transform: uppercase;
	letter-spacing: .5px;
	border-bottom: 3px solid transparent;
	transition: color .2s ease, border-color .2s ease;
	margin-bottom: -2px;
}
.dongson-product-details .wc-tabs li a:hover {
	color: var(--wp--preset--color--primary-dark);
}
.dongson-product-details .wc-tabs li.active a {
	color: var(--wp--preset--color--secondary);
	border-bottom-color: var(--wp--preset--color--primary);
}
.dongson-product-details .wc-tab {
	padding: .5rem 0;
	color: #4b5563;
	line-height: 1.75;
}

/* ==========================================================================
   46. Related products spacing
   ========================================================================== */

.related.products,
.up-sells.products {
	margin-top: 2rem;
}
.related.products .products,
.up-sells.products .products {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 1.5rem;
	list-style: none;
	padding: 0;
	margin: 0;
}

@media (max-width: 768px) {
	.dongson-product-summary {
		flex-direction: column !important;
	}
	.dongson-product-summary__gallery,
	.dongson-product-summary__info {
		flex-basis: 100% !important;
		width: 100%;
	}
}


/* ==========================================================================
   47. FAQ Accordion
   ========================================================================== */

.dongson-faq {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	max-width: 920px;
	margin: 0 auto;
}
.dongson-faq__item {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .65rem;
	overflow: hidden;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.dongson-faq__item[open] {
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 8px 24px rgba(226,162,52,0.12);
}
.dongson-faq__q {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 1rem 1.25rem;
	cursor: pointer;
	list-style: none;
	font-weight: 700;
	color: var(--wp--preset--color--secondary);
	transition: background .2s ease;
}
.dongson-faq__q::-webkit-details-marker {
	display: none;
}
.dongson-faq__q:hover {
	background: rgba(226,162,52,0.04);
}
.dongson-faq__num {
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(226,162,52,0.12);
	color: var(--wp--preset--color--primary-dark);
	font-weight: 800;
	font-size: .85rem;
	border-radius: 50%;
	letter-spacing: 0;
}
.dongson-faq__qtext {
	flex: 1;
	font-size: 1rem;
	line-height: 1.5;
}
.dongson-faq__icon {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--wp--preset--color--primary-dark);
	transition: transform .25s ease;
}
.dongson-faq__item[open] .dongson-faq__icon {
	transform: rotate(45deg);
}
.dongson-faq__a {
	padding: 0 1.25rem 1.25rem 4.5rem;
	color: #4b5563;
	line-height: 1.7;
}

@media (max-width: 600px) {
	.dongson-faq__a {
		padding-left: 1.25rem;
	}
}

/* ==========================================================================
   48. Process steps
   ========================================================================== */

.dongson-process {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1.5rem;
	position: relative;
}
.dongson-process::before {
	content: "";
	position: absolute;
	top: 32px;
	left: 5%;
	right: 5%;
	height: 2px;
	background: linear-gradient(90deg, transparent 0%, var(--wp--preset--color--primary) 50%, transparent 100%);
	z-index: 0;
}
@media (max-width: 768px) {
	.dongson-process::before {
		display: none;
	}
}
.dongson-process__step {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .85rem;
	padding: 2rem 1.5rem 1.5rem;
	text-align: center;
	position: relative;
	z-index: 1;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.dongson-process__step:hover {
	transform: translateY(-4px);
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 16px 36px rgba(12,22,38,0.1);
}
.dongson-process__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	margin: 0 auto 1rem;
	background: linear-gradient(135deg, #f5c451 0%, #e2a234 50%, #a87212 100%);
	color: var(--wp--preset--color--secondary-dark);
	font-size: 1.5rem;
	font-weight: 900;
	border-radius: 50%;
	box-shadow: 0 8px 20px rgba(226,162,52,0.35);
}
.dongson-process__title {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--wp--preset--color--secondary);
	margin: .5rem 0;
}
.dongson-process__desc {
	color: #6b7280;
	font-size: .9rem;
	line-height: 1.6;
	margin: 0;
}


/* ==========================================================================
   49. Dark mode
   ========================================================================== */

:root {
	--ds-bg: #ffffff;
	--ds-text: #1a1a1a;
	--ds-muted: #f5f7fa;
	--ds-card: #ffffff;
	--ds-border: #e5e7eb;
	--ds-text-muted: #4b5563;
	--ds-text-soft: #6b7280;
	--ds-shadow: rgba(12,22,38,0.08);
}
:root[data-theme="dark"] {
	--ds-bg: #0c1626;
	--ds-text: #e5e7eb;
	--ds-muted: #16243a;
	--ds-card: #16243a;
	--ds-border: #1f2d4a;
	--ds-text-muted: #cbd5e1;
	--ds-text-soft: #94a3b8;
	--ds-shadow: rgba(0,0,0,0.4);
}

/* Apply dark mode to base layout (keep header/footer/hero giữ navy + gold gốc) */
:root[data-theme="dark"] body {
	background: var(--ds-bg);
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-page-content {
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-page-content h2,
:root[data-theme="dark"] .dongson-page-content h3,
:root[data-theme="dark"] .dongson-page-content h4 {
	color: var(--wp--preset--color--primary-light);
}
:root[data-theme="dark"] .dongson-page-content blockquote {
	background: var(--ds-muted);
}
:root[data-theme="dark"] .dongson-product-meta__row dt {
	color: var(--ds-text-soft);
}
:root[data-theme="dark"] .has-muted-background-color {
	background-color: var(--ds-muted) !important;
}
:root[data-theme="dark"] .dongson-section,
:root[data-theme="dark"] .dongson-with-sidebar-wrap {
	background: var(--ds-bg);
}
:root[data-theme="dark"] .dongson-cat-card,
:root[data-theme="dark"] .dongson-product-card,
:root[data-theme="dark"] .dongson-feature,
:root[data-theme="dark"] .dongson-service,
:root[data-theme="dark"] .dongson-news-card,
:root[data-theme="dark"] .dongson-archive-card,
:root[data-theme="dark"] .dongson-project-card,
:root[data-theme="dark"] .dongson-shop-card,
:root[data-theme="dark"] .dongson-related__card,
:root[data-theme="dark"] .dongson-search-item,
:root[data-theme="dark"] .dongson-widget,
:root[data-theme="dark"] .dongson-faq__item,
:root[data-theme="dark"] .dongson-process__step,
:root[data-theme="dark"] .dongson-project-meta {
	background: var(--ds-card);
	border-color: var(--ds-border);
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-cat-card__title,
:root[data-theme="dark"] .dongson-product-card__title a,
:root[data-theme="dark"] .dongson-news-card__title a,
:root[data-theme="dark"] .dongson-archive-card__title a,
:root[data-theme="dark"] .dongson-project-card__title a,
:root[data-theme="dark"] .dongson-shop-card__title a,
:root[data-theme="dark"] .dongson-related__heading a,
:root[data-theme="dark"] .dongson-feature__title,
:root[data-theme="dark"] .dongson-service__title,
:root[data-theme="dark"] .dongson-process__title,
:root[data-theme="dark"] .dongson-faq__qtext,
:root[data-theme="dark"] .dongson-widget__title {
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-cat-card,
:root[data-theme="dark"] .dongson-cat-card:hover {
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-feature__desc,
:root[data-theme="dark"] .dongson-service__desc,
:root[data-theme="dark"] .dongson-news-card__excerpt,
:root[data-theme="dark"] .dongson-archive-card__excerpt,
:root[data-theme="dark"] .dongson-project-card__excerpt,
:root[data-theme="dark"] .dongson-related__date,
:root[data-theme="dark"] .dongson-archive-card__foot,
:root[data-theme="dark"] .dongson-news-card__date,
:root[data-theme="dark"] .dongson-search-item__body .wp-block-post-date,
:root[data-theme="dark"] .dongson-process__desc,
:root[data-theme="dark"] .dongson-faq__a {
	color: var(--ds-text-soft);
}
:root[data-theme="dark"] .dongson-form,
:root[data-theme="dark"] .dongson-shop-search input[type="search"] {
	background: var(--ds-card);
	border-color: var(--ds-border);
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-form__field input,
:root[data-theme="dark"] .dongson-form__field textarea {
	background: var(--ds-bg);
	border-color: var(--ds-border);
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-form__field span {
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-share {
	background: var(--ds-muted);
}
:root[data-theme="dark"] .dongson-share__btn {
	background: var(--ds-card);
	border-color: var(--ds-border);
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-article__meta {
	background: var(--ds-muted);
}
:root[data-theme="dark"] .dongson-article__nav .wp-block-post-navigation-link a {
	background: var(--ds-muted);
	color: var(--ds-text);
}
:root[data-theme="dark"] .wp-block-query-pagination-previous,
:root[data-theme="dark"] .wp-block-query-pagination-next,
:root[data-theme="dark"] .page-numbers {
	background: var(--ds-card);
	border-color: var(--ds-border);
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-page-hero__overlay {
	background: linear-gradient(135deg, rgba(0,0,0,0.92) 0%, rgba(12,22,38,0.85) 100%);
}
:root[data-theme="dark"] .dongson-product-breadcrumb {
	background: var(--ds-muted);
	border-color: var(--ds-border);
}
:root[data-theme="dark"] .dongson-shop-toolbar {
	background: var(--ds-muted);
}
:root[data-theme="dark"] .dongson-product-features {
	background: var(--ds-muted);
}

/* Theme toggle button */
.dongson-theme-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: rgba(255,255,255,0.06);
	color: #fff;
	border: 1px solid rgba(255,255,255,0.12);
	cursor: pointer;
	transition: background .2s ease, border-color .2s ease, transform .25s ease;
	flex-shrink: 0;
}
.dongson-theme-toggle:hover {
	background: rgba(226,162,52,0.15);
	border-color: rgba(226,162,52,0.4);
	transform: rotate(15deg);
}
.dongson-theme-toggle__sun,
.dongson-theme-toggle__moon {
	display: none;
}
:root[data-theme="light"] .dongson-theme-toggle__moon,
:root:not([data-theme]) .dongson-theme-toggle__moon {
	display: block;
}
:root[data-theme="dark"] .dongson-theme-toggle__sun {
	display: block;
}

.dongson-header__actions {
	gap: .6rem !important;
	align-items: center;
	display: flex !important;
	flex-shrink: 0;
	justify-self: end;
}
@media (max-width: 480px) {
	.dongson-theme-toggle {
		width: 36px;
		height: 36px;
	}
}


/* ==========================================================================
   50. Mega menu (kích hoạt khi menu item có class .menu-item-mega)
   ========================================================================== */

@media (min-width: 861px) {
	.dongson-nav .menu .menu-item-mega {
		position: static;
	}
	.dongson-nav .menu .menu-item-mega > .sub-menu,
	.dongson-nav .menu .menu-item-mega > .children {
		left: 0;
		right: 0;
		width: 100%;
		max-width: 1280px;
		margin: 0 auto;
		min-width: 0;
		padding: 1.25rem;
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: 1rem 1.5rem;
		border-radius: .65rem;
		top: calc(100% + .25rem);
	}
	.dongson-nav .menu .menu-item-mega > .sub-menu li,
	.dongson-nav .menu .menu-item-mega > .children li {
		margin: 0;
	}
	.dongson-nav .menu .menu-item-mega > .sub-menu a,
	.dongson-nav .menu .menu-item-mega > .children a {
		padding: .5rem .65rem;
		border-radius: .35rem;
		font-size: .82rem;
		line-height: 1.4;
		white-space: normal;
	}
	/* Tiêu đề group: dùng nav-menu item có depth 2+ với class menu-item-mega-heading hoặc icon trước */
	.dongson-nav .menu .menu-item-mega-heading > a {
		font-weight: 800 !important;
		text-transform: uppercase;
		color: var(--wp--preset--color--primary) !important;
		font-size: .75rem !important;
		letter-spacing: 1px;
		pointer-events: none;
		opacity: .85;
	}
}

/* Helper: viết hint trong admin Menus screen */


/* ==========================================================================
   51. Cookie consent banner
   ========================================================================== */

.dongson-cookie {
	position: fixed;
	bottom: 1rem;
	left: 50%;
	transform: translate(-50%, calc(100% + 2rem));
	width: calc(100% - 2rem);
	max-width: 720px;
	background: var(--wp--preset--color--secondary-dark);
	color: #fff;
	border: 1px solid rgba(226,162,52,0.25);
	border-radius: .85rem;
	box-shadow: 0 20px 50px rgba(0,0,0,0.4);
	padding: 1.15rem 1.25rem;
	z-index: 10000;
	transition: transform .35s ease;
}
.dongson-cookie.is-shown {
	transform: translate(-50%, 0);
}
.dongson-cookie__inner {
	display: flex;
	gap: 1rem;
	align-items: center;
	flex-wrap: wrap;
}
.dongson-cookie__text {
	flex: 1;
	min-width: 240px;
	margin: 0;
	font-size: .9rem;
	line-height: 1.5;
	color: rgba(255,255,255,0.9);
}
.dongson-cookie__text a {
	color: var(--wp--preset--color--primary);
	text-decoration: underline;
}
.dongson-cookie__actions {
	display: flex;
	gap: .5rem;
	flex-wrap: wrap;
}
.dongson-cookie__actions .dongson-btn {
	padding: .55rem 1.25rem;
	font-size: .85rem;
}
@media (max-width: 480px) {
	.dongson-cookie {
		bottom: 0;
		width: 100%;
		max-width: none;
		border-radius: 1rem 1rem 0 0;
		left: 0;
		transform: translateY(100%);
	}
	.dongson-cookie.is-shown {
		transform: translateY(0);
	}
}

/* ==========================================================================
   52. Reading time + post enhancement
   ========================================================================== */

.dongson-reading-time {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	color: var(--wp--preset--color--primary-dark);
	font-size: .85rem;
	font-weight: 600;
}
.dongson-reading-time::before {
	content: "⏱";
}


/* ==========================================================================
   53. Newsletter form
   ========================================================================== */

.dongson-newsletter {
	background: linear-gradient(135deg, var(--wp--preset--color--secondary-dark) 0%, var(--wp--preset--color--secondary) 60%, var(--wp--preset--color--primary-dark) 100%);
	color: #fff;
	padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 4vw, 3rem);
	border-radius: var(--dongson-radius, .85rem);
	position: relative;
	overflow: hidden;
}
.dongson-newsletter::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 95% 20%, rgba(226,162,52,0.3), transparent 45%);
	pointer-events: none;
}
.dongson-newsletter__inner {
	position: relative;
	max-width: 1100px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
	align-items: center;
}
@media (max-width: 768px) {
	.dongson-newsletter__inner {
		grid-template-columns: 1fr;
		text-align: center;
	}
}
.dongson-newsletter__title {
	font-size: clamp(1.4rem, 2.4vw, 1.85rem);
	font-weight: 800;
	color: #fff;
	margin: 0 0 .5rem;
}
.dongson-newsletter__desc {
	color: rgba(255,255,255,0.85);
	margin: 0;
}
.dongson-newsletter__form {
	display: flex;
	gap: .5rem;
	background: #fff;
	padding: .35rem;
	border-radius: 999px;
	box-shadow: 0 8px 24px rgba(0,0,0,0.25);
}
.dongson-newsletter__form input[type="email"] {
	flex: 1;
	min-width: 0;
	border: 0;
	padding: .65rem 1rem;
	font-size: .95rem;
	border-radius: 999px;
	color: var(--wp--preset--color--secondary);
	background: transparent;
}
.dongson-newsletter__form input[type="email"]:focus {
	outline: none;
}
.dongson-newsletter__form button {
	white-space: nowrap;
	padding: .55rem 1.5rem;
	border-radius: 999px;
	border: 0;
	font-weight: 700;
}
.dongson-newsletter__success {
	grid-column: 1 / -1;
	background: rgba(255,255,255,0.12);
	color: #fff;
	padding: .75rem 1rem;
	border-radius: .5rem;
	margin: 0;
	font-weight: 600;
	text-align: center;
}


/* ==========================================================================
   54. About story – split layout với 2 ảnh + badge
   ========================================================================== */

.dongson-about-story__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4rem;
	align-items: center;
	max-width: 1280px;
	margin: 0 auto;
}
@media (max-width: 980px) {
	.dongson-about-story__inner { gap: 2.5rem; grid-template-columns: 1fr; }
}

.dongson-about-story__media {
	position: relative;
	min-height: 480px;
}
.dongson-about-story__main-img {
	position: relative;
	width: 78%;
	aspect-ratio: 4/5;
	border-radius: 1rem;
	overflow: hidden;
	box-shadow: 0 24px 60px rgba(12,22,38,0.18);
	z-index: 2;
}
.dongson-about-story__main-img img {
	width: 100%; height: 100%; object-fit: cover;
}
.dongson-about-story__sub-img {
	position: absolute;
	right: 0;
	bottom: 8%;
	width: 50%;
	aspect-ratio: 4/3;
	border-radius: 1rem;
	overflow: hidden;
	border: 6px solid #fff;
	box-shadow: 0 16px 40px rgba(12,22,38,0.2);
	z-index: 3;
}
.dongson-about-story__sub-img img {
	width: 100%; height: 100%; object-fit: cover;
}
.dongson-about-story__badge {
	position: absolute;
	top: 8%;
	right: 4%;
	background: linear-gradient(135deg, #f5c451 0%, #e2a234 50%, #a87212 100%);
	color: var(--wp--preset--color--secondary-dark);
	border-radius: 1rem;
	padding: 1.25rem 1.5rem;
	box-shadow: 0 16px 40px rgba(226,162,52,0.45);
	z-index: 4;
	min-width: 130px;
	text-align: center;
}
.dongson-about-story__badge-num {
	font-size: 2.5rem;
	font-weight: 900;
	display: inline-block;
	line-height: 1;
}
.dongson-about-story__badge-plus {
	font-size: 1.5rem;
	font-weight: 800;
	vertical-align: top;
	margin-left: .15rem;
}
.dongson-about-story__badge-label {
	display: block;
	font-size: .8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin-top: .35rem;
	opacity: .85;
}
.dongson-about-story__shape {
	position: absolute;
	top: -3%;
	left: -3%;
	width: 60%;
	aspect-ratio: 1;
	background: radial-gradient(circle, rgba(226,162,52,0.18) 0%, transparent 70%);
	border-radius: 50%;
	z-index: 1;
	pointer-events: none;
}

@media (max-width: 600px) {
	.dongson-about-story__media { min-height: 400px; }
	.dongson-about-story__main-img { width: 100%; aspect-ratio: 16/10; }
	.dongson-about-story__sub-img { width: 60%; right: 0; bottom: -10%; }
	.dongson-about-story__badge { padding: .85rem 1rem; min-width: 100px; }
	.dongson-about-story__badge-num { font-size: 1.75rem; }
}

.dongson-about-story__eyebrow {
	color: var(--wp--preset--color--primary-dark);
	font-weight: 800;
	letter-spacing: 3px;
	text-transform: uppercase;
	font-size: .82rem;
	margin: 0 0 .65rem;
}
.dongson-about-story__title {
	font-size: clamp(1.65rem, 3vw, 2.4rem);
	font-weight: 800;
	color: var(--wp--preset--color--secondary);
	line-height: 1.2;
	margin: 0 0 1.15rem;
}
.dongson-about-story__title span {
	background: linear-gradient(135deg, #e2a234 0%, #a87212 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.dongson-about-story__lead {
	color: #4b5563;
	font-size: 1.02rem;
	line-height: 1.75;
	margin: 0 0 1.5rem;
}
.dongson-about-story__highlights {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
	margin-bottom: 1.5rem;
	padding: 1.15rem 1.25rem;
	background: var(--wp--preset--color--muted);
	border-radius: .75rem;
	border-left: 4px solid var(--wp--preset--color--primary);
}
.dongson-about-story__highlight {
	display: flex;
	flex-direction: column;
}
.dongson-about-story__h-num {
	font-size: 1.4rem;
	font-weight: 900;
	color: var(--wp--preset--color--primary-dark);
	line-height: 1;
}
.dongson-about-story__h-text {
	font-size: .8rem;
	color: #6b7280;
	margin-top: .25rem;
	font-weight: 600;
}
@media (max-width: 480px) {
	.dongson-about-story__highlights { grid-template-columns: 1fr 1fr; }
}
.dongson-about-story__list {
	list-style: none;
	padding: 0;
	margin: 0 0 1.5rem;
}
.dongson-about-story__list li {
	position: relative;
	padding: .55rem 0 .55rem 2rem;
	color: #374151;
	border-bottom: 1px dashed var(--wp--preset--color--border);
}
.dongson-about-story__list li:last-child { border-bottom: 0; }
.dongson-about-story__list li::before {
	content: "✓";
	position: absolute;
	left: 0; top: 50%;
	transform: translateY(-50%);
	width: 24px; height: 24px;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
	border-radius: 50%;
	font-size: .8rem;
	font-weight: 800;
	display: flex;
	align-items: center;
	justify-content: center;
}
.dongson-about-story__cta {
	display: flex;
	gap: .75rem;
	flex-wrap: wrap;
	margin-top: 1.5rem;
}

/* ==========================================================================
   55. Core values cards
   ========================================================================== */

.dongson-values {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1.5rem;
}
.dongson-value {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 1rem;
	padding: 2rem 1.5rem;
	position: relative;
	overflow: hidden;
	transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.dongson-value:hover {
	transform: translateY(-6px);
	box-shadow: 0 20px 50px rgba(12,22,38,0.12);
	border-color: var(--wp--preset--color--primary);
}
.dongson-value::before {
	content: "";
	position: absolute;
	top: -50%;
	right: -30%;
	width: 200px;
	height: 200px;
	background: radial-gradient(circle, rgba(226,162,52,0.12) 0%, transparent 70%);
	border-radius: 50%;
	transition: transform .35s ease;
}
.dongson-value:hover::before {
	transform: scale(1.4);
}
.dongson-value__num {
	position: absolute;
	top: 1rem;
	right: 1.25rem;
	font-size: 3rem;
	font-weight: 900;
	color: rgba(226,162,52,0.18);
	line-height: 1;
	letter-spacing: -2px;
}
.dongson-value__icon {
	width: 60px;
	height: 60px;
	border-radius: .75rem;
	background: linear-gradient(135deg, rgba(226,162,52,0.12) 0%, rgba(226,162,52,0.04) 100%);
	color: var(--wp--preset--color--primary-dark);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1.15rem;
	position: relative;
	z-index: 1;
}
.dongson-value__icon svg {
	width: 28px;
	height: 28px;
}
.dongson-value__title {
	font-size: 1.2rem;
	font-weight: 800;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 .65rem;
	position: relative;
	z-index: 1;
}
.dongson-value__desc {
	color: #4b5563;
	line-height: 1.7;
	font-size: .92rem;
	margin: 0;
	position: relative;
	z-index: 1;
}

/* ==========================================================================
   56. Vision & Mission (2 panel dark)
   ========================================================================== */

.dongson-vm-section {
	background: linear-gradient(135deg, var(--wp--preset--color--secondary-dark) 0%, var(--wp--preset--color--secondary) 60%, #2a3a5c 100%);
	color: #fff;
	position: relative;
	overflow: hidden;
}
.dongson-vm-section::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 80% 30%, rgba(226,162,52,0.18), transparent 55%);
	pointer-events: none;
}
.dongson-vm {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
	max-width: 1280px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
@media (max-width: 768px) {
	.dongson-vm { grid-template-columns: 1fr; }
}
.dongson-vm__panel {
	background: rgba(255,255,255,0.04);
	border: 1px solid rgba(226,162,52,0.18);
	border-radius: 1rem;
	padding: 2rem;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	transition: transform .3s ease, border-color .3s ease;
	position: relative;
	overflow: hidden;
}
.dongson-vm__panel:hover {
	transform: translateY(-4px);
	border-color: var(--wp--preset--color--primary);
}
.dongson-vm__panel--vision {
	border-left: 4px solid var(--wp--preset--color--primary);
}
.dongson-vm__panel--mission {
	border-left: 4px solid var(--wp--preset--color--primary-light);
}
.dongson-vm__icon {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: linear-gradient(135deg, #f5c451 0%, #e2a234 50%, #a87212 100%);
	color: var(--wp--preset--color--secondary-dark);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1.25rem;
	box-shadow: 0 8px 24px rgba(226,162,52,0.4);
}
.dongson-vm__title {
	font-size: 1.4rem;
	font-weight: 900;
	color: var(--wp--preset--color--primary);
	letter-spacing: 2px;
	margin: 0 0 1rem;
	text-transform: uppercase;
}
.dongson-vm__desc {
	color: rgba(255,255,255,0.85);
	line-height: 1.75;
	margin: 0 0 1.25rem;
	font-size: .98rem;
}
.dongson-vm__list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: .65rem;
}
.dongson-vm__list li {
	position: relative;
	padding-left: 1.65rem;
	color: rgba(255,255,255,0.85);
	font-size: .92rem;
}
.dongson-vm__list li::before {
	content: "→";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--wp--preset--color--primary);
	font-weight: 800;
	font-size: 1rem;
}

/* ==========================================================================
   57. Timeline (zigzag)
   ========================================================================== */

.dongson-timeline {
	position: relative;
	max-width: 920px;
	margin: 0 auto;
	padding: 1rem 0;
}
.dongson-timeline::before {
	content: "";
	position: absolute;
	top: 0; bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 2px;
	background: linear-gradient(180deg, transparent 0%, var(--wp--preset--color--primary) 10%, var(--wp--preset--color--primary) 90%, transparent 100%);
}
.dongson-timeline__item {
	position: relative;
	width: 50%;
	padding: 1rem 2.5rem;
	margin-bottom: .5rem;
	box-sizing: border-box;
}
.dongson-timeline__item--left {
	left: 0;
	text-align: right;
}
.dongson-timeline__item--right {
	left: 50%;
	text-align: left;
}
.dongson-timeline__item::before {
	content: "";
	position: absolute;
	top: 1.85rem;
	width: 18px;
	height: 18px;
	background: var(--wp--preset--color--primary);
	border: 4px solid #fff;
	border-radius: 50%;
	box-shadow: 0 0 0 3px var(--wp--preset--color--primary), 0 4px 12px rgba(226,162,52,0.4);
	z-index: 2;
}
.dongson-timeline__item--left::before  { right: -9px; }
.dongson-timeline__item--right::before { left: -9px; }

.dongson-timeline__year {
	display: inline-block;
	font-size: 1.4rem;
	font-weight: 900;
	color: var(--wp--preset--color--primary-dark);
	background: rgba(226,162,52,0.12);
	padding: .35rem .85rem;
	border-radius: 999px;
	margin-bottom: .65rem;
	letter-spacing: 1px;
}
.dongson-timeline__card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .85rem;
	padding: 1.15rem 1.35rem;
	box-shadow: 0 4px 16px rgba(12,22,38,0.05);
	transition: transform .25s ease, box-shadow .25s ease;
}
.dongson-timeline__card:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 32px rgba(12,22,38,0.1);
}
.dongson-timeline__title {
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 .5rem;
}
.dongson-timeline__desc {
	color: #4b5563;
	line-height: 1.65;
	margin: 0;
	font-size: .92rem;
}
@media (max-width: 768px) {
	.dongson-timeline::before { left: 16px; }
	.dongson-timeline__item,
	.dongson-timeline__item--left,
	.dongson-timeline__item--right {
		width: 100%;
		left: 0;
		text-align: left;
		padding-left: 3rem;
		padding-right: 0;
	}
	.dongson-timeline__item--left::before,
	.dongson-timeline__item--right::before {
		left: 7px;
		right: auto;
	}
}

/* ==========================================================================
   58. Leadership cards
   ========================================================================== */

.dongson-leaders {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1.5rem;
}
.dongson-leader {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .85rem;
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease;
}
.dongson-leader:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 40px rgba(12,22,38,0.12);
}
.dongson-leader__photo {
	position: relative;
	aspect-ratio: 4/5;
	overflow: hidden;
	background: var(--wp--preset--color--muted);
}
.dongson-leader__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .35s ease;
}
.dongson-leader:hover .dongson-leader__photo img {
	transform: scale(1.05);
}
.dongson-leader__photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 60%, rgba(12,22,38,0.6) 100%);
	pointer-events: none;
}
.dongson-leader__social {
	position: absolute;
	left: 1rem;
	bottom: 1rem;
	display: flex;
	gap: .4rem;
	z-index: 2;
	opacity: 0;
	transform: translateY(8px);
	transition: opacity .25s ease, transform .25s ease;
}
.dongson-leader:hover .dongson-leader__social {
	opacity: 1;
	transform: translateY(0);
}
.dongson-leader__social a {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(255,255,255,0.95);
	color: var(--wp--preset--color--secondary);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .2s ease, color .2s ease;
}
.dongson-leader__social a:hover {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--secondary-dark);
}
.dongson-leader__body {
	padding: 1.15rem 1.25rem 1.35rem;
}
.dongson-leader__name {
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 .25rem;
}
.dongson-leader__role {
	font-size: .82rem;
	font-weight: 700;
	color: var(--wp--preset--color--primary-dark);
	letter-spacing: 1px;
	text-transform: uppercase;
	margin: 0 0 .65rem;
	padding-bottom: .65rem;
	border-bottom: 1px dashed var(--wp--preset--color--border);
}
.dongson-leader__bio {
	color: #4b5563;
	line-height: 1.65;
	font-size: .88rem;
	margin: 0;
}

/* Dark mode tweaks for new sections */
:root[data-theme="dark"] .dongson-value,
:root[data-theme="dark"] .dongson-leader,
:root[data-theme="dark"] .dongson-timeline__card {
	background: var(--ds-card);
	border-color: var(--ds-border);
}
:root[data-theme="dark"] .dongson-value__title,
:root[data-theme="dark"] .dongson-leader__name,
:root[data-theme="dark"] .dongson-timeline__title {
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-value__desc,
:root[data-theme="dark"] .dongson-leader__bio,
:root[data-theme="dark"] .dongson-timeline__desc,
:root[data-theme="dark"] .dongson-about-story__lead {
	color: var(--ds-text-soft);
}
:root[data-theme="dark"] .dongson-about-story__title { color: var(--ds-text); }
:root[data-theme="dark"] .dongson-about-story__highlights { background: var(--ds-muted); }
:root[data-theme="dark"] .dongson-about-story__list li { color: var(--ds-text); border-bottom-color: var(--ds-border); }


/* ==========================================================================
   59. Service Hero (single-service) — full bleed, 2 cột cân đối
   ========================================================================== */

.dongson-svc-hero {
	position: relative;
	background: var(--wp--preset--color--secondary-dark);
	color: #fff;
	padding: clamp(3rem, 6vw, 5rem) clamp(1.25rem, 4vw, 3rem) clamp(2.5rem, 5vw, 4rem);
	overflow: hidden;
	isolation: isolate;
	min-height: clamp(420px, 60vh, 600px);
	display: flex;
	align-items: center;
}
.dongson-svc-hero__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: .35;
	z-index: -3;
	transform: scale(1.05);
}
.dongson-svc-hero__overlay {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(105deg, rgba(12,22,38,0.95) 0%, rgba(12,22,38,0.82) 45%, rgba(12,22,38,0.55) 100%),
		radial-gradient(circle at 95% 0%, rgba(226,162,52,0.2), transparent 50%);
	z-index: -2;
}
.dongson-svc-hero__pattern {
	position: absolute; inset: 0;
	background-image:
		linear-gradient(rgba(226,162,52,0.04) 1px, transparent 1px),
		linear-gradient(90deg, rgba(226,162,52,0.04) 1px, transparent 1px);
	background-size: 50px 50px;
	z-index: -1;
	mask-image: radial-gradient(ellipse at left center, black 0%, transparent 75%);
	-webkit-mask-image: radial-gradient(ellipse at left center, black 0%, transparent 75%);
}
.dongson-svc-hero__inner {
	max-width: 1280px;
	width: 100%;
	margin: 0 auto;
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
	gap: 2.5rem 3rem;
	align-items: center;
}
@media (max-width: 980px) {
	.dongson-svc-hero__inner {
		grid-template-columns: 1fr;
		gap: 1.75rem;
	}
}

.dongson-svc-hero__text { min-width: 0; }

.dongson-svc-hero .dongson-breadcrumb {
	background: transparent;
	border: 0;
	margin-bottom: 1rem;
	font-size: .85rem;
}
.dongson-svc-hero .dongson-breadcrumb__inner {
	color: rgba(255,255,255,0.6);
	padding: 0;
	gap: .55rem;
}
.dongson-svc-hero .dongson-breadcrumb a {
	color: var(--wp--preset--color--primary);
	font-weight: 600;
}
.dongson-svc-hero .dongson-breadcrumb__sep {
	color: rgba(226,162,52,0.4);
}

.dongson-svc-hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	font-size: .8rem;
	letter-spacing: 2.5px;
	text-transform: uppercase;
	background: rgba(226,162,52,0.12);
	color: var(--wp--preset--color--primary);
	padding: .45rem 1.1rem;
	border-radius: 999px;
	margin: 0 0 1.25rem;
	font-weight: 700;
	border: 1px solid rgba(226,162,52,0.4);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.dongson-svc-hero__eyebrow-icon {
	font-size: 1.05rem;
	line-height: 1;
}

.dongson-svc-hero__title {
	font-size: clamp(2.25rem, 4.6vw, 3.75rem);
	line-height: 1.1;
	font-weight: 900;
	color: #fff;
	margin: 0 0 1.15rem;
	letter-spacing: 0.5px;
	text-shadow: 0 4px 24px rgba(0,0,0,0.35);
}

.dongson-svc-hero__lead {
	color: rgba(255,255,255,0.85);
	font-size: clamp(1rem, 1.4vw, 1.15rem);
	line-height: 1.7;
	margin: 0 0 1.5rem;
	max-width: 620px;
}

.dongson-svc-hero__highlights {
	list-style: none;
	padding: 0;
	margin: 0 0 1.85rem;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .75rem 1.5rem;
}
@media (max-width: 540px) {
	.dongson-svc-hero__highlights { grid-template-columns: 1fr; gap: .6rem; }
}
.dongson-svc-hero__highlights li {
	display: flex;
	align-items: flex-start;
	gap: .55rem;
	color: rgba(255,255,255,0.92);
	font-size: .95rem;
	line-height: 1.5;
}
.dongson-svc-hero__highlights svg {
	flex-shrink: 0;
	margin-top: .35rem;
	color: var(--wp--preset--color--primary);
	background: rgba(226,162,52,0.15);
	width: 22px !important;
	height: 22px !important;
	padding: 4px;
	border-radius: 50%;
	box-sizing: border-box;
}

.dongson-svc-hero__cta {
	display: flex;
	gap: .75rem;
	flex-wrap: wrap;
}
.dongson-svc-hero__cta .dongson-btn {
	padding: .85rem 1.65rem;
	font-size: .95rem;
}

/* Pricing card (right column) */
.dongson-svc-hero__card {
	background: rgba(255,255,255,0.06);
	border: 1px solid rgba(226,162,52,0.35);
	border-radius: 1rem;
	padding: 1.85rem 1.85rem 1.5rem;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	box-shadow: 0 24px 60px rgba(0,0,0,0.3);
	position: relative;
	display: flex;
	flex-direction: column;
	gap: .75rem;
}
.dongson-svc-hero__card::before {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 4px;
	background: linear-gradient(90deg, #f5c451 0%, #e2a234 50%, #a87212 100%);
	border-radius: 1rem 1rem 0 0;
}
.dongson-svc-hero__card-head {
	display: flex;
	align-items: center;
	gap: .55rem;
	color: var(--wp--preset--color--primary);
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
}
.dongson-svc-hero__card-value {
	font-size: clamp(1.5rem, 2.4vw, 2rem);
	font-weight: 900;
	color: #fff;
	line-height: 1.15;
	letter-spacing: 0.5px;
}
.dongson-svc-hero__card-note {
	font-size: .82rem;
	color: rgba(255,255,255,0.6);
	line-height: 1.5;
	margin: 0;
}
.dongson-svc-hero__card-link {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	color: var(--wp--preset--color--primary);
	font-weight: 700;
	font-size: .92rem;
	text-decoration: none;
	padding-top: .85rem;
	margin-top: .25rem;
	border-top: 1px solid rgba(255,255,255,0.1);
	transition: gap .2s ease, color .2s ease;
}
.dongson-svc-hero__card-link:hover {
	gap: .75rem;
	color: var(--wp--preset--color--primary-light);
}
.dongson-svc-hero__card-trust {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: .5rem;
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid rgba(255,255,255,0.1);
}
.dongson-svc-hero__card-trust > div {
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: .15rem;
}
.dongson-svc-hero__card-trust strong {
	font-size: 1.1rem;
	font-weight: 900;
	color: var(--wp--preset--color--primary);
	line-height: 1;
}
.dongson-svc-hero__card-trust span {
	font-size: .72rem;
	color: rgba(255,255,255,0.55);
	letter-spacing: 0.5px;
}

@media (max-width: 600px) {
	.dongson-svc-hero {
		padding: 2.5rem 1rem 2.25rem;
		min-height: 380px;
	}
	.dongson-svc-hero__card { padding: 1.35rem; }
}

/* ==========================================================================
   60. Service cards (archive + related)
   ========================================================================== */

.dongson-services-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 1.5rem;
}
.dongson-service-card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 1rem;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
	position: relative;
}
.dongson-service-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 18px 44px rgba(12,22,38,0.13);
	border-color: var(--wp--preset--color--primary);
}
.dongson-service-card__img {
	display: block;
	aspect-ratio: 16/10;
	overflow: hidden;
	position: relative;
	background: var(--wp--preset--color--muted);
}
.dongson-service-card__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .35s ease;
}
.dongson-service-card:hover .dongson-service-card__img img {
	transform: scale(1.06);
}
.dongson-service-card__img-placeholder {
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, var(--wp--preset--color--secondary) 0%, var(--wp--preset--color--secondary-dark) 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 4rem;
	color: var(--wp--preset--color--primary);
}
.dongson-service-card__icon-badge {
	position: absolute;
	top: 1rem;
	left: 1rem;
	width: 48px;
	height: 48px;
	background: linear-gradient(135deg, #f5c451 0%, #e2a234 50%, #a87212 100%);
	color: var(--wp--preset--color--secondary-dark);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.4rem;
	font-weight: 800;
	border-radius: .65rem;
	box-shadow: 0 8px 20px rgba(226,162,52,0.4);
	z-index: 2;
}
.dongson-service-card__body {
	padding: 1.25rem 1.35rem 1.5rem;
	display: flex;
	flex-direction: column;
	gap: .65rem;
	flex: 1;
}
.dongson-service-card__eyebrow {
	font-size: .72rem;
	font-weight: 800;
	color: var(--wp--preset--color--primary-dark);
	letter-spacing: 1.5px;
	text-transform: uppercase;
	margin: 0;
}
.dongson-service-card__title {
	font-size: 1.15rem;
	font-weight: 800;
	margin: 0;
	line-height: 1.35;
}
.dongson-service-card__title a {
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
}
.dongson-service-card__title a:hover {
	color: var(--wp--preset--color--primary-dark);
}
.dongson-service-card__excerpt {
	color: #4b5563;
	font-size: .92rem;
	line-height: 1.65;
	margin: 0;
	flex: 1;
}
.dongson-service-card__highlights {
	list-style: none;
	padding: .85rem 0 .35rem;
	margin: 0;
	border-top: 1px dashed var(--wp--preset--color--border);
	display: flex;
	flex-direction: column;
	gap: .4rem;
}
.dongson-service-card__highlights li {
	display: flex;
	gap: .5rem;
	align-items: flex-start;
	color: #374151;
	font-size: .85rem;
	line-height: 1.5;
}
.dongson-service-card__highlights svg {
	flex-shrink: 0;
	margin-top: .25rem;
	color: var(--wp--preset--color--primary-dark);
}
.dongson-service-card__more {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	color: var(--wp--preset--color--primary-dark);
	font-weight: 700;
	text-decoration: none;
	font-size: .9rem;
	margin-top: auto;
	padding-top: .65rem;
	transition: gap .2s ease;
}
.dongson-service-card__more:hover {
	gap: .65rem;
	color: var(--wp--preset--color--primary);
}

/* Service highlights list trong sidebar */
.dongson-service-features {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: .65rem;
}
.dongson-service-features li {
	display: flex;
	gap: .55rem;
	align-items: flex-start;
	font-size: .92rem;
	line-height: 1.5;
	color: #374151;
}
.dongson-service-features svg {
	flex-shrink: 0;
	margin-top: .2rem;
	color: var(--wp--preset--color--primary-dark);
}

/* Dark mode */
:root[data-theme="dark"] .dongson-service-card {
	background: var(--ds-card);
	border-color: var(--ds-border);
}
:root[data-theme="dark"] .dongson-service-card__title a {
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-service-card__excerpt,
:root[data-theme="dark"] .dongson-service-card__highlights li,
:root[data-theme="dark"] .dongson-service-features li {
	color: var(--ds-text-soft);
}
:root[data-theme="dark"] .dongson-service-card__highlights {
	border-top-color: var(--ds-border);
}


/* ==========================================================================
   61. Lead paragraph style
   ========================================================================== */

.dongson-page-content .is-style-lead,
.is-style-lead {
	font-size: 1.15rem !important;
	line-height: 1.7 !important;
	color: #1f2937 !important;
	font-weight: 500 !important;
	padding: 1.15rem 1.5rem !important;
	background: linear-gradient(135deg, rgba(226,162,52,0.06) 0%, rgba(226,162,52,0.02) 100%) !important;
	border-left: 4px solid var(--wp--preset--color--primary) !important;
	border-radius: 0 .65rem .65rem 0 !important;
	margin: 0 0 1.5rem !important;
}
:root[data-theme="dark"] .is-style-lead {
	color: var(--ds-text) !important;
	background: linear-gradient(135deg, rgba(226,162,52,0.1) 0%, rgba(226,162,52,0.04) 100%) !important;
}


/* ==========================================================================
   62. Project Hero (single-project top)
   ========================================================================== */

.dongson-project-hero {
	position: relative;
	background: var(--wp--preset--color--secondary-dark);
	color: #fff;
	padding: clamp(3rem, 7vw, 5.5rem) clamp(1.25rem, 5vw, 3rem) clamp(2.5rem, 5vw, 4rem);
	overflow: hidden;
	isolation: isolate;
	min-height: clamp(420px, 60vh, 600px);
	display: flex;
	align-items: center;
}
.dongson-project-hero__bg {
	position: absolute; inset: 0;
	background-size: cover;
	background-position: center;
	opacity: .55;
	z-index: -3;
	transform: scale(1.05);
}
.dongson-project-hero__overlay {
	position: absolute; inset: 0;
	background:
		linear-gradient(180deg, rgba(12,22,38,0.65) 0%, rgba(12,22,38,0.85) 60%, rgba(12,22,38,0.95) 100%),
		linear-gradient(105deg, rgba(12,22,38,0.5) 0%, transparent 60%);
	z-index: -2;
}
.dongson-project-hero__pattern {
	position: absolute; inset: 0;
	background-image:
		linear-gradient(rgba(226,162,52,0.04) 1px, transparent 1px),
		linear-gradient(90deg, rgba(226,162,52,0.04) 1px, transparent 1px);
	background-size: 50px 50px;
	z-index: -1;
	mask-image: radial-gradient(ellipse at left center, black 0%, transparent 75%);
	-webkit-mask-image: radial-gradient(ellipse at left center, black 0%, transparent 75%);
}
.dongson-project-hero__inner {
	max-width: 1280px;
	width: 100%;
	margin: 0 auto;
	position: relative;
}

.dongson-project-hero .dongson-breadcrumb {
	background: transparent; border: 0;
	font-size: .85rem;
	margin-bottom: 1.25rem;
}
.dongson-project-hero .dongson-breadcrumb__inner {
	color: rgba(255,255,255,0.6);
	padding: 0;
}
.dongson-project-hero .dongson-breadcrumb a { color: var(--wp--preset--color--primary); font-weight: 600; }

.dongson-project-hero__cat {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	color: var(--wp--preset--color--primary);
	font-size: .82rem;
	font-weight: 700;
	letter-spacing: 2.5px;
	text-transform: uppercase;
	margin: 0 0 1rem;
	padding: .4rem .9rem;
	background: rgba(226,162,52,0.12);
	border: 1px solid rgba(226,162,52,0.4);
	border-radius: 999px;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

.dongson-project-hero__title {
	font-size: clamp(2rem, 5vw, 3.75rem);
	font-weight: 900;
	line-height: 1.1;
	color: #fff;
	margin: 0 0 1rem;
	letter-spacing: 0.5px;
	max-width: 920px;
	text-shadow: 0 4px 24px rgba(0,0,0,0.35);
}

.dongson-project-hero__lead {
	font-size: clamp(1rem, 1.4vw, 1.15rem);
	color: rgba(255,255,255,0.85);
	line-height: 1.7;
	max-width: 720px;
	margin: 0 0 2rem;
}

.dongson-project-hero__meta {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 1rem 2rem;
	max-width: 920px;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(226,162,52,0.25);
}
.dongson-project-hero__meta-item {
	display: flex;
	gap: .85rem;
	align-items: center;
}
.dongson-project-hero__meta-icon {
	flex-shrink: 0;
	width: 44px; height: 44px;
	border-radius: 50%;
	background: rgba(226,162,52,0.15);
	border: 1px solid rgba(226,162,52,0.4);
	color: var(--wp--preset--color--primary);
	display: flex;
	align-items: center;
	justify-content: center;
}
.dongson-project-hero__meta-item small {
	display: block;
	font-size: .72rem;
	color: rgba(255,255,255,0.55);
	letter-spacing: 1.5px;
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: .15rem;
}
.dongson-project-hero__meta-item strong {
	display: block;
	font-size: 1.05rem;
	color: #fff;
	font-weight: 700;
	line-height: 1.3;
}

@media (max-width: 600px) {
	.dongson-project-hero {
		padding: 2rem 1rem 2rem;
		min-height: 380px;
	}
	.dongson-project-hero__cat {
		font-size: .7rem;
		letter-spacing: 1.5px;
		padding: .3rem .75rem;
	}
}

/* ==========================================================================
   63. Project Stats Bar
   ========================================================================== */

.dongson-project-stats-wrap.alignfull {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}
.dongson-project-stats {
	background: linear-gradient(135deg, var(--wp--preset--color--primary) 0%, #d49524 50%, var(--wp--preset--color--primary-dark) 100%);
	color: var(--wp--preset--color--secondary-dark);
	padding: 0;
	position: relative;
	overflow: hidden;
}
.dongson-project-stats::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at top right, rgba(255,255,255,0.15), transparent 60%);
	pointer-events: none;
}
.dongson-project-stats__inner {
	max-width: 1280px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1px;
	background: rgba(12,22,38,0.18);
	position: relative;
	z-index: 1;
}
.dongson-project-stats__item {
	background: linear-gradient(135deg, var(--wp--preset--color--primary) 0%, #d49524 60%, var(--wp--preset--color--primary-dark) 100%);
	padding: 1.85rem 1.5rem;
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: .35rem;
	position: relative;
	transition: transform .25s ease;
}
.dongson-project-stats__item:hover {
	transform: translateY(-2px);
}
.dongson-project-stats__value {
	font-size: clamp(1.65rem, 3vw, 2.35rem);
	font-weight: 900;
	color: var(--wp--preset--color--secondary-dark);
	line-height: 1;
	letter-spacing: 0.5px;
}
.dongson-project-stats__label {
	font-size: .82rem;
	color: rgba(12,22,38,0.78);
	font-weight: 600;
	letter-spacing: 0.5px;
	text-transform: uppercase;
}
@media (max-width: 768px) {
	.dongson-project-stats__inner {
		grid-template-columns: 1fr 1fr;
	}
	.dongson-project-stats__item {
		padding: 1.25rem 1rem;
	}
}

/* ==========================================================================
   64. Project meta sidebar (refined)
   ========================================================================== */

.dongson-project-meta {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .85rem;
	padding: 1.5rem;
	box-shadow: 0 8px 24px rgba(12,22,38,0.06);
	position: relative;
	overflow: hidden;
}
.dongson-project-meta::before {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 4px;
	background: linear-gradient(90deg, #f5c451 0%, #e2a234 50%, #a87212 100%);
}
.dongson-project-meta__head {
	display: flex;
	align-items: center;
	gap: .55rem;
	margin-bottom: 1.15rem;
	padding-bottom: .85rem;
	border-bottom: 1px solid var(--wp--preset--color--border);
	color: var(--wp--preset--color--primary-dark);
}
.dongson-project-meta__title {
	font-size: 1.05rem;
	font-weight: 800;
	color: var(--wp--preset--color--secondary);
	margin: 0;
	letter-spacing: 0.5px;
	text-transform: uppercase;
}
.dongson-project-meta__list {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.dongson-project-meta__row {
	display: flex;
	flex-direction: column;
	gap: .25rem;
	padding-bottom: 1rem;
	border-bottom: 1px dashed var(--wp--preset--color--border);
}
.dongson-project-meta__row:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}
.dongson-project-meta__row dt {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	font-size: .75rem;
	color: var(--wp--preset--color--primary-dark);
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
}
.dongson-project-meta__row dd {
	margin: 0;
	font-weight: 700;
	color: var(--wp--preset--color--secondary);
	font-size: 1rem;
	line-height: 1.4;
}
.dongson-project-meta__row dd a {
	color: var(--wp--preset--color--primary-dark);
	text-decoration: none;
}
.dongson-project-meta__row dd a:hover { text-decoration: underline; }

.dongson-project-meta__share {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	margin-top: 1.15rem;
	padding-top: 1rem;
	border-top: 1px solid var(--wp--preset--color--border);
	width: 100%;
	color: var(--wp--preset--color--primary-dark);
	font-weight: 700;
	font-size: .85rem;
	text-decoration: none;
	transition: color .2s ease;
}
.dongson-project-meta__share:hover {
	color: var(--wp--preset--color--primary);
}

/* CTA card riêng cho project */
.dongson-pj-cta-card {
	margin-top: 1.25rem;
	text-align: center;
}

/* Sidebar sticky */
.dongson-pj-aside {
	position: relative;
}
.dongson-pj-aside .dongson-project-meta,
.dongson-pj-aside > * {
	position: relative;
}
@media (min-width: 880px) {
	.dongson-pj-aside {
		position: sticky;
		top: 100px;
		align-self: flex-start;
	}
}

/* ==========================================================================
   65. Project Process Timeline
   ========================================================================== */

.dongson-pj-process {
	display: grid;
	grid-template-columns: repeat(4, 1fr) auto;
	gap: 1rem;
	align-items: stretch;
	max-width: 1280px;
	margin: 0 auto;
	position: relative;
}
.dongson-pj-process__step {
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: .85rem;
	padding: 1.5rem 1.25rem;
	text-align: center;
	position: relative;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
	display: flex;
	flex-direction: column;
	gap: .65rem;
}
.dongson-pj-process__step:hover {
	transform: translateY(-4px);
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 16px 36px rgba(12,22,38,0.1);
}
.dongson-pj-process__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px; height: 48px;
	margin: 0 auto;
	background: linear-gradient(135deg, #f5c451 0%, #e2a234 50%, #a87212 100%);
	color: var(--wp--preset--color--secondary-dark);
	font-weight: 900;
	border-radius: 50%;
	box-shadow: 0 6px 16px rgba(226,162,52,0.4);
	font-size: 1rem;
}
.dongson-pj-process__title {
	font-size: 1rem;
	font-weight: 800;
	color: var(--wp--preset--color--secondary);
	margin: 0;
}
.dongson-pj-process__desc {
	color: #4b5563;
	font-size: .85rem;
	line-height: 1.55;
	margin: 0;
}
.dongson-pj-process__arrow {
	position: absolute;
	right: -1.05rem;
	top: 50%;
	transform: translateY(-50%);
	color: var(--wp--preset--color--primary);
	background: var(--wp--preset--color--muted);
	width: 36px; height: 36px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
}
.dongson-pj-process__step:nth-child(4) .dongson-pj-process__arrow { display: none; }

@media (max-width: 980px) {
	.dongson-pj-process {
		grid-template-columns: 1fr 1fr;
	}
	.dongson-pj-process__arrow { display: none; }
}
@media (max-width: 540px) {
	.dongson-pj-process {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   66. Project Testimonial
   ========================================================================== */

.dongson-pj-testimonial-wrap {
	background: linear-gradient(135deg, rgba(226,162,52,0.04) 0%, rgba(226,162,52,0.01) 100%);
}
.dongson-pj-testimonial {
	max-width: 880px;
	margin: 0 auto;
	padding: 0 1rem;
	text-align: center;
	position: relative;
}
.dongson-pj-testimonial__quote {
	color: var(--wp--preset--color--primary);
	opacity: .35;
	margin: 0 auto .85rem;
	display: block;
}
.dongson-pj-testimonial__quote-text {
	font-size: clamp(1.1rem, 1.8vw, 1.45rem);
	line-height: 1.65;
	color: var(--wp--preset--color--secondary);
	font-weight: 500;
	font-style: italic;
	margin: 0 0 1.5rem;
	border: 0;
	padding: 0;
	background: transparent;
}
.dongson-pj-testimonial__author {
	display: inline-flex;
	align-items: center;
	gap: .85rem;
	padding: .85rem 1.5rem .85rem .85rem;
	background: #fff;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	box-shadow: 0 4px 16px rgba(12,22,38,0.08);
}
.dongson-pj-testimonial__avatar {
	flex-shrink: 0;
	width: 48px; height: 48px;
	border-radius: 50%;
	background: linear-gradient(135deg, #f5c451 0%, #e2a234 100%);
	color: var(--wp--preset--color--secondary-dark);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 900;
	font-size: 1.25rem;
}
.dongson-pj-testimonial__author > div {
	text-align: left;
}
.dongson-pj-testimonial__author strong {
	display: block;
	color: var(--wp--preset--color--secondary);
	font-weight: 800;
	font-size: 1rem;
}
.dongson-pj-testimonial__author span {
	display: block;
	color: #6b7280;
	font-size: .82rem;
}

/* Dark mode tweaks */
:root[data-theme="dark"] .dongson-project-meta {
	background: var(--ds-card);
	border-color: var(--ds-border);
}
:root[data-theme="dark"] .dongson-project-meta__title,
:root[data-theme="dark"] .dongson-project-meta__row dd {
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-pj-process__step {
	background: var(--ds-card);
	border-color: var(--ds-border);
}
:root[data-theme="dark"] .dongson-pj-process__title {
	color: var(--ds-text);
}
:root[data-theme="dark"] .dongson-pj-process__desc {
	color: var(--ds-text-soft);
}
:root[data-theme="dark"] .dongson-pj-testimonial__author {
	background: var(--ds-card);
	border-color: var(--ds-border);
}
:root[data-theme="dark"] .dongson-pj-testimonial__quote-text,
:root[data-theme="dark"] .dongson-pj-testimonial__author strong {
	color: var(--ds-text);
}