html[data-theme="light"] {
		color-scheme: light;
		--green: #00c853;
		--green-strong: #047857;
		--green-dim: rgba(0, 200, 83, .12);
		--green-border: rgba(0, 200, 83, .38);
		--amber: #b45309;
		--amber-dim: rgba(180, 83, 9, .1);
		--amber-border: rgba(180, 83, 9, .28);
		--red: #dc2626;
		--red-dim: rgba(220, 38, 38, .08);
		--pain-border: rgba(220, 38, 38, .18);
		--pain-border-hover: rgba(220, 38, 38, .4);
		--pain-ico-border: rgba(220, 38, 38, .22);
		--bg: #f8fafc;
		--bg-alt: #f1f5f9;
		--bg2: #ffffff;
		--bg3: #eef2f7;
		--text: #334155;
		--heading: #0f172a;
		--muted: #64748b;
		--line: rgba(15, 23, 42, .08);
		--line-strong: rgba(15, 23, 42, .14);
		--surface: rgba(15, 23, 42, .04);
		--radius: 14px;
		--font: 'Be Vietnam Pro', sans-serif;
		--header-bg: rgba(255, 255, 255, .92);
		--header-border: rgba(15, 23, 42, .08);
		--hero-base: #ffffff;
		--hero-grid: rgba(0, 200, 83, .09);
		--hero-radial: rgba(0, 200, 83, .14);
		--hero-mask-mid: 25%;
		--hero-mask-fade: 88%;
		--notice-bg: rgba(180, 83, 9, .06);
		--shift-bg: linear-gradient(135deg, rgba(180, 83, 9, .06), rgba(0, 200, 83, .06));
		--shift-border: rgba(15, 23, 42, .14);
		--shift-shadow: 0 4px 24px rgba(15, 23, 42, .06);
		--card-shadow: 0 1px 2px rgba(15, 23, 42, .04);
		--offer-hover-shadow: 0 16px 40px rgba(15, 23, 42, .1);
		--offer-featured-bg: linear-gradient(165deg, rgba(0, 200, 83, .08), var(--bg2));
		--process-line-end: rgba(0, 200, 83, .12);
		--pill-dot-shadow: rgba(0, 230, 118, .5);
		--step-index-shadow: rgba(0, 230, 118, .35);
		--cta-block-bg: linear-gradient(135deg, rgba(0, 200, 83, .08), rgba(0, 176, 155, .06));
		--cta-block-shadow: 0 4px 24px rgba(15, 23, 42, .06);
		--btn-ghost-fg: #0f172a;
		--testi-avatar-color: #047857;
		--footer-link: #047857;
		--btn-primary-shadow: 0 6px 24px rgba(0, 200, 83, .28);
		--btn-primary-shadow-hover: 0 10px 32px rgba(0, 200, 83, .38);
		--menu-btn-shadow: 0 2px 8px rgba(15, 23, 42, .06);
		--menu-btn-shadow-sm: 0 1px 5px rgba(15, 23, 42, .05);
		--menu-btn-hover-shadow: 0 0 0 1px var(--green-dim), 0 6px 20px rgba(0, 200, 83, .14);
		--menu-btn-expanded-shadow: 0 0 0 1px var(--green-border), 0 8px 24px rgba(0, 200, 83, .18);
		--nav-dd-shadow: var(--card-shadow), 0 18px 48px rgba(0, 0, 0, .12);
		--scrollbar-thumb: rgba(15, 23, 42, .22);
		--nav-dd-bg: var(--bg2);
		--nav-dd-border: var(--line-strong);
		--nav-panel-scrim: var(--bg);
		--nav-mobile-elevated: var(--bg2);
		--menu-btn-border: var(--line-strong);
		--surface-raised: var(--bg2);
		--surface-raised-border: var(--line);
		--surface-raised-shadow: var(--card-shadow);
	}

	html[data-theme="dark"] {
		color-scheme: dark;
		--green: #00e676;
		--green-strong: #6ee7b7;
		--green-dim: rgba(0, 230, 118, .15);
		--green-border: rgba(0, 230, 118, .3);
		--amber: #fbbf24;
		--amber-dim: rgba(251, 191, 36, .12);
		--amber-border: rgba(251, 191, 36, .3);
		--red: #f87171;
		--red-dim: rgba(248, 113, 113, .1);
		--pain-border: rgba(248, 113, 113, .15);
		--pain-border-hover: rgba(248, 113, 113, .35);
		--pain-ico-border: rgba(248, 113, 113, .2);
		--bg: #06090f;
		--bg-alt: #0d1117;
		--bg2: #0d1117;
		--bg3: #111827;
		--text: #e2e8f0;
		--heading: #f8fafc;
		--muted: #6b7280;
		--line: rgba(255, 255, 255, .06);
		--line-strong: rgba(255, 255, 255, .1);
		--surface: rgba(255, 255, 255, .04);
		--radius: 14px;
		--font: 'Be Vietnam Pro', sans-serif;
		--header-bg: rgba(6, 9, 15, .88);
		--header-border: rgba(255, 255, 255, .1);
		--hero-base: transparent;
		--hero-grid: rgba(0, 230, 118, .06);
		--hero-radial: rgba(0, 230, 118, .07);
		--hero-mask-mid: 20%;
		--hero-mask-fade: 85%;
		--notice-bg: rgba(251, 191, 36, .07);
		--shift-bg: linear-gradient(135deg, rgba(251, 191, 36, .07), rgba(0, 230, 118, .07));
		--shift-border: rgba(255, 255, 255, .08);
		--shift-shadow: none;
		--card-shadow: none;
		--offer-hover-shadow: 0 16px 40px rgba(0, 0, 0, .4);
		--offer-featured-bg: linear-gradient(165deg, rgba(0, 230, 118, .06), var(--bg2));
		--process-line-end: rgba(0, 230, 118, .05);
		--pill-dot-shadow: rgba(0, 230, 118, .5);
		--step-index-shadow: rgba(0, 230, 118, .35);
		--cta-block-bg: linear-gradient(135deg, rgba(0, 230, 118, .08), rgba(0, 176, 155, .08));
		--cta-block-shadow: none;
		--btn-ghost-fg: #ffffff;
		--testi-avatar-color: #00e676;
		--footer-link: #6ee7b7;
		--btn-primary-shadow: 0 8px 28px rgba(0, 0, 0, .42), 0 0 22px rgba(0, 230, 118, .1);
		--btn-primary-shadow-hover: 0 12px 38px rgba(0, 0, 0, .55), 0 0 30px rgba(0, 230, 118, .16);
		--menu-btn-shadow: 0 2px 12px rgba(0, 0, 0, .28);
		--menu-btn-shadow-sm: 0 1px 8px rgba(0, 0, 0, .22);
		--menu-btn-hover-shadow: 0 0 0 1px var(--green-dim), 0 8px 28px rgba(0, 0, 0, .4), 0 0 20px rgba(0, 230, 118, .1);
		--menu-btn-expanded-shadow: 0 0 0 1px var(--green-border), 0 10px 32px rgba(0, 0, 0, .48);
		--nav-dd-shadow: 0 0 0 1px rgba(255, 255, 255, .1), 0 28px 56px rgba(0, 0, 0, .58);
		--scrollbar-thumb: rgba(255, 255, 255, .22);
		--nav-dd-bg: var(--bg3);
		--nav-dd-border: rgba(255, 255, 255, .14);
		--nav-panel-scrim: rgba(6, 9, 15, .97);
		--nav-mobile-elevated: var(--bg2);
		--menu-btn-border: rgba(255, 255, 255, .14);
		/* Bề mặt nâng trong dark — card trên nền bg2 không bị “dính” */
		--surface-raised: var(--bg3);
		--surface-raised-border: rgba(255, 255, 255, .07);
		--surface-raised-shadow: 0 0 0 1px rgba(255, 255, 255, .06), 0 14px 40px rgba(0, 0, 0, .28);
	}

	::selection {
		background: rgba(0, 200, 83, .22);
		color: var(--heading);
	}

	html[data-theme="dark"] ::selection {
		background: rgba(0, 230, 118, .22);
		color: var(--heading);
	}

	* {
		margin: 0;
		padding: 0;
		box-sizing: border-box;
	}

	html {
		scroll-behavior: smooth;
		--header-base: 56px;
		--wpadminbar: 0px;
		--header-offset: calc(var(--header-base) + var(--wpadminbar));
		scrollbar-color: var(--scrollbar-thumb) var(--bg);
	}

	body.admin-bar {
		--wpadminbar: 32px;
		--header-offset: calc(var(--header-base) + var(--wpadminbar));
	}

	@media screen and (max-width: 782px) {
		body.admin-bar {
			--wpadminbar: 46px;
		}
	}

	body {
		font-family: var(--font);
		background: var(--bg);
		color: var(--text);
		line-height: 1.7;
		-webkit-font-smoothing: antialiased;
		/* hidden breaks position:sticky; clip trims overflow without a scroll container */
		overflow-x: hidden;
	}

	@supports (overflow-x: clip) {
		body {
			overflow-x: clip;
		}
	}

	.container {
		max-width: 1140px;
		margin: 0 auto;
		padding: 0 clamp(18px, 4vw, 28px);
	}

	.tag {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		padding: 5px 14px;
		border-radius: 100px;
		font-size: .75rem;
		font-weight: 700;
		letter-spacing: .08em;
		text-transform: uppercase;
	}

	.tag-green {
		background: var(--green-dim);
		color: var(--green-strong);
		border: 1px solid var(--green-border);
	}

	html[data-theme="dark"] .tag-green {
		color: var(--green);
	}

	.tag-amber {
		background: var(--amber-dim);
		color: var(--amber);
		border: 1px solid var(--amber-border);
	}

	.text-green {
		color: var(--green);
	}

	.text-amber {
		color: var(--amber);
	}

	header {
		position: sticky;
		top: var(--wpadminbar, 0px);
		z-index: 999;
		background: var(--header-bg);
		backdrop-filter: blur(14px);
		border-bottom: 1px solid var(--header-border);
		padding-top: env(safe-area-inset-top, 0px);
	}

	.header-bar {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 12px;
		max-width: 1140px;
		margin: 0 auto;
		padding: 14px clamp(18px, 4vw, 28px);
	}

	.header-brand {
		min-width: 0;
		flex-shrink: 0;
	}

	.nav-links.header-nav {
		display: none;
	}

	.nav-links {
		align-items: center;
		gap: 6px 22px;
		flex-wrap: wrap;
		justify-content: center;
	}

	.nav-links a {
		color: var(--muted);
		text-decoration: none;
		font-size: .88rem;
		font-weight: 600;
		white-space: nowrap;
	}

	.nav-links a:hover {
		color: var(--green);
	}

	.nav-links a.is-active,
	.nav-links a[aria-current="page"] {
		color: var(--green);
	}

	.nav-dd-trigger.is-active {
		color: var(--green);
	}

	.nav-dd-panel a.is-active,
	.nav-dd-panel a[aria-current="page"] {
		background: var(--green-dim);
		color: var(--green-strong);
	}

	.nav-dd-panel a.is-active .nav-submenu-icon,
	.nav-dd-panel a[aria-current="page"] .nav-submenu-icon {
		color: var(--green-strong);
		opacity: 1;
	}

	.nav-item-dd {
		position: relative;
		z-index: 1;
	}

	.nav-item-dd:hover,
	.nav-item-dd:focus-within {
		z-index: 50;
	}

	/* Desktop: invisible “bridge” so cursor can cross the gap without losing :hover */
	@media (min-width: 960px) {
		.nav-item-dd::after {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		height: 22px;
		z-index: 1;
		}
	}

	.nav-dd-trigger {
		display: inline-flex;
		align-items: center;
		gap: 5px;
		margin: 0;
		padding: 6px 2px;
		border: none;
		background: none;
		cursor: pointer;
		font-family: var(--font);
		font-size: .88rem;
		font-weight: 600;
		color: var(--muted);
		white-space: nowrap;
	}

	.nav-dd-trigger:hover,
	.nav-item-dd:hover .nav-dd-trigger,
	.nav-item-dd:focus-within .nav-dd-trigger {
		color: var(--green);
	}

	.nav-dd-trigger:focus-visible {
		outline: 2px solid var(--green);
		outline-offset: 3px;
		border-radius: 6px;
	}

	.nav-dd-chevron {
		width: 14px;
		height: 14px;
		flex-shrink: 0;
		opacity: .7;
		transition: transform .2s ease;
	}

	.nav-item-dd:hover .nav-dd-chevron,
	.nav-item-dd:focus-within .nav-dd-chevron,
	.nav-item-dd.nav-dd-open .nav-dd-chevron {
		transform: rotate(180deg);
	}

	.nav-dd-panel {
		position: absolute;
		top: calc(100% + 8px);
		left: 50%;
		z-index: 2;
		transform: translateX(-50%) translateY(4px);
		min-width: 286px;
		max-width: min(320px, 92vw);
		padding: 8px;
		background: var(--nav-dd-bg);
		border: 1px solid var(--nav-dd-border);
		border-radius: var(--radius);
		box-shadow: var(--nav-dd-shadow);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition: opacity .2s ease, visibility .2s, transform .2s ease;
	}

	.nav-item-dd:hover .nav-dd-panel,
	.nav-item-dd:focus-within .nav-dd-panel,
	.nav-item-dd.nav-dd-open .nav-dd-panel {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translateX(-50%) translateY(0);
	}

	.nav-dd-panel a {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 10px 14px;
		border-radius: 10px;
		color: var(--muted);
		font-size: .82rem;
		font-weight: 500;
		text-decoration: none;
		white-space: normal;
		line-height: 1.35;
	}

	.nav-submenu-icon {
		flex-shrink: 0;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 1.125rem;
		height: 1.125rem;
		color: var(--muted);
		opacity: .88;
	}

	.nav-submenu-icon svg {
		width: 100%;
		height: 100%;
		display: block;
	}

	.nav-submenu-text {
		flex: 1;
		min-width: 0;
	}

	.nav-dd-panel a:hover {
		background: var(--green-dim);
		color: var(--green);
	}

	.nav-dd-panel a:hover .nav-submenu-icon {
		color: var(--green);
		opacity: 1;
	}

	/* Header: account CTA + hover panel (reuses .nav-item-dd behavior) */
	button#header-account-btn {
		padding-left: 18px;
		padding-right: 18px;
	}

	.header-account-dd .nav-dd-panel {
		left: auto;
		right: 0;
		transform: translateX(0) translateY(4px);
		min-width: min(320px, 92vw);
	}

	.header-account-dd:hover .nav-dd-panel,
	.header-account-dd:focus-within .nav-dd-panel,
	.header-account-dd.nav-dd-open .nav-dd-panel {
		transform: translateX(0) translateY(0);
	}

	.header-account-dd__trigger {
		gap: 6px;
	}

	.header-account-dd__trigger-icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 1.125rem;
		height: 1.125rem;
		flex-shrink: 0;
		color: #fff;
		opacity: 0.95;
	}

	.header-account-dd__trigger-icon svg {
		width: 100%;
		height: 100%;
		display: block;
	}

	.header-account-dd__trigger .nav-dd-chevron {
		color: #fff;
		opacity: 0.92;
	}

	.header-account-dd:hover .header-account-dd__chevron,
	.header-account-dd:focus-within .header-account-dd__chevron,
	.header-account-dd.nav-dd-open .header-account-dd__chevron {
		transform: rotate(180deg);
	}

	.header-account-dd__meta {
		padding: 12px 14px 12px;
		margin: -8px -8px 6px;
		border-bottom: 1px solid var(--nav-dd-border);
		border-radius: var(--radius) var(--radius) 0 0;
		background: var(--surface);
	}

	.header-account-dd__name {
		font-weight: 700;
		font-size: 0.9rem;
		color: var(--heading);
		line-height: 1.3;
	}

	.header-account-dd__email {
		margin-top: 4px;
		font-size: 0.78rem;
		color: var(--muted);
		line-height: 1.35;
		word-break: break-word;
	}

	.header-account-dd__sep {
		margin: 8px 0 4px;
		border: 0;
		height: 0;
		border-top: 1px solid var(--nav-dd-border);
	}

	.header-account-dd__panel .header-account-dd__link--logout {
		color: var(--muted);
	}

	.header-account-dd__panel .header-account-dd__link--logout:hover {
		background: var(--red-dim);
		color: var(--red);
	}

	.header-account-dd__panel .header-account-dd__link--logout:hover .nav-submenu-icon {
		color: var(--red);
		opacity: 1;
	}

	.panel-account-card {
		margin-top: 12px;
		padding-top: 16px;
		border-top: 1px solid var(--line);
		display: flex;
		flex-direction: column;
		gap: 4px;
	}

	.panel-account-card__meta {
		padding: 12px 14px;
		margin-bottom: 8px;
		border-radius: var(--radius);
		background: var(--surface);
		border: 1px solid var(--line);
	}

	.panel-account-card__name {
		font-weight: 700;
		font-size: 0.95rem;
		color: var(--heading);
	}

	.panel-account-card__email {
		margin-top: 6px;
		font-size: 0.82rem;
		color: var(--muted);
		word-break: break-word;
	}

	.panel-account-card__link {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 12px 14px;
		border-radius: 10px;
		text-decoration: none;
		font-weight: 600;
		font-size: 0.88rem;
		color: var(--heading);
		border: 1px solid transparent;
	}

	.panel-account-card__link .nav-submenu-text {
		flex: 1;
		min-width: 0;
	}

	.panel-account-card__link:hover {
		background: var(--green-dim);
		color: var(--green);
		border-color: var(--green-border);
	}

	.panel-account-card__link:hover .nav-submenu-icon {
		color: var(--green);
		opacity: 1;
	}

	.panel-account-card__sep {
		margin: 8px 0 4px;
		border: 0;
		height: 0;
		border-top: 1px solid var(--line);
	}

	.panel-account-card__link--logout {
		color: var(--muted);
		font-weight: 600;
	}

	.panel-account-card__link--logout:hover {
		background: var(--red-dim);
		color: var(--red);
		border-color: transparent;
	}

	.panel-account-card__link--logout:hover .nav-submenu-icon {
		color: var(--red);
		opacity: 1;
	}

	.panel-sublink:hover .nav-submenu-icon,
	.panel-sublink:active .nav-submenu-icon {
		color: var(--green);
		opacity: 1;
	}

	@media (min-width: 960px) {
		.header-bar {
		display: grid;
		grid-template-columns: 1fr auto 1fr;
		align-items: center;
		column-gap: 20px;
		}

		.header-brand {
		justify-self: start;
		}

		.nav-links.header-nav {
		display: flex;
		justify-self: center;
		}

		.header-actions {
		justify-self: end;
		}

		.menu-btn {
		display: none !important;
		}
	}

	@media (max-width: 959px) {
		.hidden-mobile-cta {
		display: none;
		}

		.header-bar {
		padding: 8px 14px;
		gap: 8px;
		}

		.logo {
		font-size: 1rem;
		line-height: 1.25;
		}

		.logo-dot {
		width: 7px;
		height: 7px;
		margin-right: 6px;
		box-shadow: 0 0 8px var(--green);
		}

		.theme-toggle {
		padding: 6px 10px;
		font-size: .7rem;
		gap: 4px;
		}

		.header-actions {
		gap: 7px;
		}
	}

	.menu-btn {
		--menu-bar-w: 20px;
		--menu-bar-h: 2px;
		--menu-gap: 5px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 46px;
		height: 46px;
		border-radius: 100px;
		border: 1px solid var(--menu-btn-border);
		background: linear-gradient(165deg, var(--bg2), var(--surface));
		color: var(--heading);
		cursor: pointer;
		flex-shrink: 0;
		box-shadow: var(--menu-btn-shadow);
		transition: border-color .22s, box-shadow .22s, color .2s, transform .15s;
		-webkit-tap-highlight-color: transparent;
	}

	.menu-btn:hover {
		border-color: var(--green-border);
		color: var(--green);
		box-shadow: var(--menu-btn-hover-shadow);
	}

	.menu-btn:active {
		transform: scale(0.96);
	}

	.menu-btn:focus-visible {
		outline: 2px solid var(--green);
		outline-offset: 3px;
	}

	.menu-btn-burger {
		position: relative;
		width: var(--menu-bar-w);
		height: calc(var(--menu-bar-h) * 3 + var(--menu-gap) * 2);
		display: block;
	}

	.menu-bar {
		position: absolute;
		left: 0;
		width: 100%;
		height: var(--menu-bar-h);
		border-radius: 2px;
		background: currentColor;
		transition: transform .28s cubic-bezier(0.4, 0, 0.2, 1), opacity .2s ease;
		transform-origin: center;
	}

	.menu-bar:nth-child(1) {
		top: 0;
	}

	.menu-bar:nth-child(2) {
		top: calc(var(--menu-bar-h) + var(--menu-gap));
	}

	.menu-bar:nth-child(3) {
		top: calc((var(--menu-bar-h) + var(--menu-gap)) * 2);
	}

	.menu-btn[aria-expanded='true'] {
		border-color: var(--green-border);
		color: var(--green);
		background: var(--green-dim);
		box-shadow: var(--menu-btn-expanded-shadow);
	}

	.menu-btn[aria-expanded='true'] .menu-bar:nth-child(1) {
		top: calc(var(--menu-bar-h) + var(--menu-gap));
		transform: rotate(45deg);
	}

	.menu-btn[aria-expanded='true'] .menu-bar:nth-child(2) {
		opacity: 0;
		transform: scaleX(0);
	}

	.menu-btn[aria-expanded='true'] .menu-bar:nth-child(3) {
		top: calc(var(--menu-bar-h) + var(--menu-gap));
		transform: rotate(-45deg);
	}

	@media (prefers-reduced-motion: reduce) {
		.menu-btn,
		.menu-bar {
		transition-duration: 0.01ms;
		}
	}

	@media (max-width: 959px) {
		.menu-btn {
		width: 40px;
		height: 40px;
		--menu-bar-w: 17px;
		--menu-gap: 4px;
		box-shadow: var(--menu-btn-shadow-sm);
		}
	}

	.header-actions {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		gap: 10px;
		flex-shrink: 0;
	}

	.theme-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		padding: 8px 14px;
		border-radius: 100px;
		border: 1px solid var(--line);
		background: var(--surface);
		color: var(--heading);
		font-family: var(--font);
		font-size: .78rem;
		font-weight: 700;
		cursor: pointer;
		transition: border-color .2s, background .2s, transform .15s;
		white-space: nowrap;
	}

	.theme-toggle:hover {
		border-color: var(--green-border);
		background: var(--green-dim);
	}

	.theme-toggle:focus-visible {
		outline: 2px solid var(--green);
		outline-offset: 2px;
	}

	.logo {
		font-size: 1.1rem;
		font-weight: 800;
		color: var(--heading);
		text-decoration: none;
		display: flex;
		align-items: center;
	}

	.logo-dot {
		width: 8px;
		height: 8px;
		background: var(--green);
		border-radius: 50%;
		box-shadow: 0 0 10px var(--green);
		flex-shrink: 0;
		margin-right: 8px;
	}

	.logo span.accent {
		color: var(--green);
	}

	.logo span.accent:not(:last-child) {
		margin-left: 2px;
	}

	.btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		padding: 10px 22px;
		border-radius: 100px;
		font-family: var(--font);
		font-weight: 700;
		font-size: .88rem;
		cursor: pointer;
		border: none;
		transition: .25s ease;
		text-decoration: none;
		color: var(--btn-ghost-fg);
	}

	.btn-ghost {
		background: transparent;
		border: 1px solid var(--line-strong);
	}

	.btn-ghost:hover {
		border-color: var(--green-border);
		color: var(--green);
	}

	.btn-primary {
		background: linear-gradient(135deg, #00e676, #00b09b);
		color: #fff !important;
		box-shadow: var(--btn-primary-shadow);
	}

	.btn-primary:hover {
		transform: translateY(-2px);
		box-shadow: var(--btn-primary-shadow-hover);
	}

	.btn__icon {
		display: inline-flex;
		flex-shrink: 0;
		line-height: 0;
	}

	.btn__icon-svg {
		width: 1.15em;
		height: 1.15em;
		display: block;
	}

	.btn-big {
		padding: 16px 36px;
		font-size: 1.02rem;
	}

	/* Nút responsive — chỉ bổ sung; không ghi đè token/padding gốc của .btn / .btn-big ở trên */
	@media (max-width: 559px) {
		.btn {
		padding-left: max(16px, min(5.5vw, 22px));
		padding-right: max(16px, min(5.5vw, 22px));
		font-size: clamp(0.8125rem, 3.2vw, 0.88rem);
		min-height: 44px;
		box-sizing: border-box;
		}

		.btn-big {
		padding-top: max(0.75rem, min(3vw, 1rem));
		padding-bottom: max(0.75rem, min(3vw, 1rem));
		padding-left: max(1rem, min(5.5vw, 1.75rem));
		padding-right: max(1rem, min(5.5vw, 1.75rem));
		font-size: clamp(0.88rem, 3.5vw, 1.02rem);
		line-height: 1.35;
		min-height: 48px;
		}

		.hero-cta {
		align-self: stretch;
		width: 100%;
		max-width: min(22rem, 100%);
		margin-inline: auto;
		gap: 10px;
		}

		.hero-cta .btn-big {
		width: 100%;
		justify-content: center;
		}

		.cta-block .hero-cta {
		width: 100%;
		max-width: min(22rem, 100%);
		}

		.cta-block .hero-cta .btn-big {
		width: 100%;
		justify-content: center;
		}

		#products .btn-primary.btn-big {
		display: flex;
		width: 100%;
		max-width: min(22rem, calc(100vw - 40px));
		margin-inline: auto;
		justify-content: center;
		}

		.newsletter-form .btn {
		width: 100%;
		justify-content: center;
		min-height: 48px;
		}
	}

	/* Hai nút lớn cạnh nhau hơi chật ở khoảng ~520–679px — xếp dọc, full width */
	@media (min-width: 520px) and (max-width: 679px) {
		.hero-cta {
		flex-direction: column;
		width: 100%;
		max-width: min(22rem, 100%);
		}

		.hero-cta .btn-big {
		width: 100%;
		}

		.cta-block .hero-cta {
		flex-direction: column;
		max-width: min(22rem, 100%);
		}

		.cta-block .hero-cta .btn-big {
		width: 100%;
		}
	}

	section {
		padding: 76px 0;
	}

	.section-label {
		text-align: center;
		margin-bottom: 12px;
	}

	.section-title {
		text-align: center;
		font-size: clamp(1.7rem, 4vw, 2.35rem);
		font-weight: 800;
		color: var(--heading);
		line-height: 1.25;
		margin-bottom: 16px;
	}

	.section-sub {
		text-align: center;
		color: var(--muted);
		max-width: 680px;
		margin: 0 auto 48px;
		font-size: .97rem;
	}

	.hero {
		padding: 72px 0 56px;
		text-align: center;
		position: relative;
		overflow: hidden;
		background-color: var(--hero-base);
		background-image:
		linear-gradient(var(--hero-grid) 1px, transparent 1px),
		linear-gradient(90deg, var(--hero-grid) 1px, transparent 1px);
		background-size: 44px 44px;
		-webkit-mask-image: radial-gradient(ellipse 75% 100% at 50% 35%, black var(--hero-mask-mid), transparent var(--hero-mask-fade));
		mask-image: radial-gradient(ellipse 75% 100% at 50% 35%, black var(--hero-mask-mid), transparent var(--hero-mask-fade));
	}

	.hero::before {
		content: '';
		position: absolute;
		top: -100px;
		left: 50%;
		transform: translateX(-50%);
		width: 900px;
		height: 900px;
		background: radial-gradient(circle, var(--hero-radial) 0%, transparent 65%);
		pointer-events: none;
		z-index: 0;
	}

	/* Light: chỉ lưới + mask đã đủ; bỏ glow tròn để tránh vệt xanh trên nền trắng */
	html[data-theme="light"] .hero::before {
		display: none;
	}

	.hero>* {
		position: relative;
		z-index: 1;
	}

	.hero h1 {
		font-size: clamp(2rem, 5.5vw, 3rem);
		font-weight: 900;
		color: var(--heading);
		line-height: 1.15;
		margin: 16px 0 20px;
		letter-spacing: -.02em;
		max-width: 900px;
		margin-left: auto;
		margin-right: auto;
		text-transform: capitalize;
	}

	.hero h1 em {
		font-style: normal;
		background: linear-gradient(135deg, #00e676, #00b09b);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		background-clip: text;
	}

	.hero-sub {
		font-size: 1.05rem;
		color: var(--muted);
		max-width: 620px;
		margin: 0 auto 24px;
	}

	.hero-sub p {
		font-size: inherit;
		color: inherit;
		margin: 0 0 0.65em;
		line-height: 1.65;
	}

	.hero-sub p:last-child {
		margin-bottom: 0;
	}

	.hero-cta {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 12px;
		margin-bottom: 8px;
	}

	@media (min-width: 520px) {
		.hero-cta {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		}
	}

	.hero-note {
		font-size: .85rem;
		color: var(--muted);
		margin-top: 16px;
	}

	.hero.hero--with-breadcrumb .breadcrumb__list {
		justify-content: center;
		margin-bottom: 1rem;
	}

	.hero.hero--with-breadcrumb h1 {
		margin-top: 0;
	}

	.stat-grid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
		max-width: 820px;
		margin: 36px auto 0;
	}

	@media (min-width: 640px) {
		.stat-grid {
		grid-template-columns: repeat(4, 1fr);
		}
	}

	.stat-cell {
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		padding: 18px 14px;
		text-align: center;
		box-shadow: var(--card-shadow);
	}

	.stat-num {
		font-size: 1.65rem;
		font-weight: 900;
		color: var(--green);
		line-height: 1;
	}

	.stat-label {
		font-size: .76rem;
		color: var(--muted);
		margin-top: 8px;
		line-height: 1.35;
	}

	.solution-intro {
		text-align: center;
		color: var(--muted);
		max-width: 672px;
		margin: 0 auto 36px;
		font-size: .97rem;
	}

	.process-list {
		--process-pad-left: 16px;
		--process-num-size: 56px;
		display: flex;
		flex-direction: column;
		gap: 0;
		max-width: 880px;
		margin: 0 auto;
		position: relative;
		overflow: hidden;
		padding-left: var(--process-pad-left);
		padding-right: 16px;
	}

	.process-list::before {
		content: '';
		position: absolute;
		left: calc(var(--process-pad-left) + var(--process-num-size) / 2);
		top: 70px;
		bottom: 70px;
		width: 2px;
		transform: translateX(-50%);
		background: linear-gradient(to bottom, var(--green-border), var(--process-line-end));
		z-index: 0;
	}

	.process-item {
		display: grid;
		grid-template-columns: 56px 1fr;
		gap: 28px;
		align-items: start;
		padding: 26px 0;
		position: relative;
		z-index: 1;
	}

	.process-item:last-child {
		border: none;
	}

	.step-index {
		width: 56px;
		height: 56px;
		border-radius: 50%;
		background: var(--green);
		border: 1px solid var(--green-border);
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: .95rem;
		font-weight: 900;
		color: #ffffff;
		flex-shrink: 0;
		box-shadow: 0 0 16px var(--step-index-shadow);
	}

	.process-item h3 {
		font-size: 1.05rem;
		font-weight: 700;
		color: var(--heading);
		margin-bottom: 8px;
	}

	.process-item p {
		font-size: .9rem;
		color: var(--muted);
	}

	.process-split {
		display: grid;
		grid-template-columns: 1fr;
		gap: 32px;
		margin-top: 8px;
		align-items: start;
	}

	@media (min-width: 960px) {
		.process-split {
		grid-template-columns: 1fr minmax(300px, 400px);
		gap: 40px 48px;
		}
	}

	.process-split-main {
		min-width: 0;
	}

	.process-split .process-list {
		margin: 0;
		max-width: none;
		--process-pad-left: 8px;
		padding-left: var(--process-pad-left);
		padding-right: 0;
	}

	.process-cta {
		background: var(--cta-block-bg);
		border: 1px solid var(--green-border);
		border-radius: var(--radius);
		padding: 28px 26px;
		box-shadow: var(--cta-block-shadow);
	}

	@media (min-width: 960px) {
		.process-cta {
		position: sticky;
		top: calc(var(--header-offset, 80px) + 16px);
		}
	}

	.process-cta-kicker {
		font-size: .72rem;
		font-weight: 700;
		letter-spacing: .08em;
		text-transform: uppercase;
		color: var(--green);
		margin: 0 0 10px;
	}

	.process-cta-title {
		font-size: 1.15rem;
		font-weight: 800;
		color: var(--heading);
		margin: 0 0 12px;
		line-height: 1.35;
	}

	.process-cta-text {
		font-size: .9rem;
		color: var(--muted);
		line-height: 1.65;
		margin: 0 0 14px;
	}

	.process-cta-note {
		font-size: .82rem;
		color: var(--muted);
		margin: 0 0 18px;
		line-height: 1.5;
	}

	.process-cta .hero-cta {
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		margin-bottom: 0;
	}

	.process-cta .hero-cta .btn-big {
		width: 100%;
		justify-content: center;
	}

	.process-cta-foot {
		font-size: .78rem;
		color: var(--muted);
		margin: 16px 0 0;
		line-height: 1.5;
	}

	.process-cta-foot a {
		color: var(--green);
		font-weight: 700;
		text-decoration: none;
	}

	.process-cta-foot a:hover {
		text-decoration: underline;
	}

	.offer-grid {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
		gap: 18px;
		margin-top: 8px;
		align-items: stretch;
	}

	a.offer-card {
		text-decoration: none;
		color: inherit;
	}

	.offer-card {
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		padding: 24px 22px;
		position: relative;
		transition: .3s;
		display: flex;
		flex-direction: column;
		box-shadow: var(--card-shadow);
		height: 100%;
	}

	.offer-card:hover {
		border-color: var(--green-border);
		transform: translateY(-4px);
		box-shadow: var(--offer-hover-shadow);
	}

	.offer-card.featured {
		border-color: var(--green-border);
		background: var(--offer-featured-bg);
	}

	.offer-ico {
		font-size: 1.5rem;
		margin-bottom: 10px;
	}

	.offer-card h3 {
		font-size: 1rem;
		font-weight: 700;
		color: var(--heading);
		margin-bottom: 8px;
	}

	.offer-card p {
		font-size: .87rem;
		color: var(--muted);
		line-height: 1.65;
		flex: 1 1 auto;
	}

	.offer-card .offer-more {
		margin-top: 14px;
		font-size: .82rem;
		font-weight: 700;
		color: var(--green);
	}

	/* —— Blog: thẻ bài viết (danh sách) —— */
	.blog-list {
		padding: 40px 0 56px;
		background: var(--bg2);
	}

	html[data-theme="dark"] .blog-list {
		background-image:
		radial-gradient(ellipse 65% 40% at 15% 0%, rgba(0, 230, 118, .06) 0%, transparent 52%),
		linear-gradient(180deg, var(--bg3) 0%, var(--bg2) 100%);
	}

	.blog-post-grid {
		display: grid;
		grid-template-columns: 1fr;
		gap: 20px;
		margin-top: 10px;
		align-items: stretch;
	}

	@media (min-width: 640px) {
		.blog-post-grid {
		grid-template-columns: repeat(2, 1fr);
		}
	}

	@media (min-width: 1024px) {
		.blog-post-grid {
		grid-template-columns: repeat(3, 1fr);
		}
	}

	a.blog-post-card {
		display: flex;
		flex-direction: column;
		height: 100%;
		text-decoration: none;
		color: inherit;
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		overflow: hidden;
		box-shadow: var(--card-shadow);
		transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
	}

	a.blog-post-card:hover {
		border-color: var(--green-border);
		transform: translateY(-5px);
		box-shadow: var(--offer-hover-shadow);
	}

	a.blog-post-card:focus-visible {
		outline: 2px solid var(--green);
		outline-offset: 3px;
	}

	.blog-post-card__media {
		aspect-ratio: 16 / 9;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 2.75rem;
		line-height: 1;
		background: linear-gradient(145deg, var(--green-dim), var(--amber-dim));
		border-bottom: 1px solid var(--line);
	}

	.blog-post-card__body {
		padding: 1.15rem 1.25rem 1.35rem;
		display: flex;
		flex-direction: column;
		flex: 1;
	}

	.blog-post-card__meta {
		font-size: .72rem;
		font-weight: 700;
		letter-spacing: .06em;
		text-transform: uppercase;
		color: var(--muted);
		margin-bottom: .5rem;
	}

	.blog-post-card__title {
		font-size: 1.05rem;
		font-weight: 800;
		color: var(--heading);
		line-height: 1.35;
		margin-bottom: .5rem;
		letter-spacing: -.02em;
	}

	.blog-post-card__excerpt {
		font-size: .88rem;
		color: var(--muted);
		line-height: 1.6;
		flex: 1;
	}

	.blog-post-card__more {
		margin-top: 1rem;
		font-size: .82rem;
		font-weight: 800;
		color: var(--green-strong);
	}

	a.blog-post-card:hover .blog-post-card__more {
		text-decoration: underline;
		text-underline-offset: 3px;
	}

	.blog-back {
		display: inline-flex;
		align-items: center;
		gap: 0.35rem;
		font-size: 0.88rem;
		font-weight: 700;
		color: var(--green-strong);
		text-decoration: none;
		margin-bottom: 1rem;
	}

	.blog-back:hover {
		text-decoration: underline;
		text-underline-offset: 3px;
	}

	.blog-article-wrap {
		padding: 40px 0 64px;
		background: var(--bg);
		background-image:
		radial-gradient(ellipse 80% 50% at 50% -20%, var(--green-dim) 0%, transparent 55%),
		linear-gradient(180deg, var(--bg3) 0%, var(--bg) 28%, var(--bg-alt) 100%);
	}

	html[data-theme="dark"] .blog-article-wrap {
		background-image:
		radial-gradient(ellipse 70% 45% at 30% 0%, rgba(0, 230, 118, .06) 0%, transparent 50%),
		linear-gradient(180deg, #090d14 0%, var(--bg) 32%, var(--bg-alt) 100%);
	}

	.blog-article-meta {
		font-size: 0.9rem;
		color: var(--muted);
		margin-top: 0.35rem;
	}

	.hero.hero--blog-detail {
		padding-top: clamp(48px, 6vw, 64px);
		padding-bottom: 44px;
		text-align: left;
		mask-image: none;
		-webkit-mask-image: none;
	}

	.hero.hero--blog-detail .container {
		text-align: left;
	}

	.hero.hero--blog-detail h1 {
		margin-left: 0;
		margin-right: 0;
		max-width: min(72rem, 100%);
	}

	.hero.hero--blog-detail .hero-sub {
		margin-left: 0;
		margin-right: 0;
		max-width: 52rem;
	}

	.breadcrumb {
		width: 100%;
		max-width: min(72rem, 100%);
	}

	.breadcrumb__list {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 0.35rem 0.45rem;
		list-style: none;
		margin: 0 0 1rem;
		padding: 0;
		font-size: 0.82rem;
		font-weight: 600;
		color: var(--muted);
	}

	.breadcrumb__item a {
		color: var(--green-strong);
		text-decoration: none;
	}

	.breadcrumb__item a:hover {
		text-decoration: underline;
		text-underline-offset: 3px;
	}

	.breadcrumb__sep {
		color: var(--line-strong);
		font-weight: 500;
		user-select: none;
		opacity: 0.85;
	}

	html[data-theme="dark"] .breadcrumb__sep {
		color: var(--muted);
		opacity: 1;
	}

	.breadcrumb__current {
		color: var(--heading);
	}

	.blog-detail-layout {
		display: grid;
		gap: 28px;
		align-items: start;
	}

	@media (min-width: 960px) {
		.blog-detail-layout {
		grid-template-columns: minmax(200px, 238px) minmax(0, 1fr);
		gap: 40px;
		}

		.blog-detail-layout--no-sidebar {
		grid-template-columns: minmax(0, 1fr);
		}

		.blog-detail-sidebar {
		position: sticky;
		top: max(12px, calc(var(--header-offset, 72px) + 8px));
		}
	}

	.blog-toc__item--depth-1 {
		margin-left: 0.35rem;
	}

	.blog-toc__item--depth-2 {
		margin-left: 0.7rem;
	}

	.blog-toc {
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		padding: 1rem 1.1rem 1.15rem;
		box-shadow: var(--card-shadow);
	}

	.blog-toc__title {
		font-size: 0.68rem;
		font-weight: 800;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--muted);
		margin: 0 0 0.65rem;
	}

	.blog-toc__list {
		margin: 0;
		padding-left: 1.05rem;
		font-size: 0.83rem;
		line-height: 1.55;
		color: var(--text);
	}

	.blog-toc__list li {
		margin-bottom: 0.4rem;
	}

	.blog-toc__list a {
		color: var(--text);
		text-decoration: none;
		font-weight: 600;
	}

	.blog-toc__list a:hover {
		color: var(--green-strong);
	}

	.blog-detail-main {
		color: var(--text);
		font-size: 0.95rem;
		line-height: 1.75;
		min-width: 0;
	}

	.blog-lead {
		font-size: 1.06rem;
		line-height: 1.65;
		color: var(--heading);
		font-weight: 500;
		margin: 0 0 1.35rem;
		padding: 1.05rem 1.2rem;
		background: var(--surface);
		border-left: 4px solid var(--green);
		border-radius: 0 var(--radius) var(--radius) 0;
	}

	.blog-detail-main .blog-heading-anchor {
		font-size: 1.18rem;
		font-weight: 800;
		color: var(--heading);
		margin: 2.25rem 0 0.65rem;
		letter-spacing: -0.02em;
		scroll-margin-top: calc(var(--header-offset, 72px) + 16px);
	}

	.blog-detail-main .blog-heading-anchor:first-of-type {
		margin-top: 0.25rem;
	}

	.blog-detail-main > p,
	.blog-detail-main article p {
		margin: 0 0 1rem;
	}

	.blog-callout {
		border-radius: var(--radius);
		padding: 1rem 1.15rem;
		border: 1px solid var(--line);
		margin: 1.35rem 0;
	}

	.blog-callout--note {
		background: var(--green-dim);
		border-color: var(--green-border);
	}

	.blog-callout--tip {
		background: var(--notice-bg);
		border-color: var(--amber-border);
	}

	.blog-callout--warn {
		background: rgba(220, 38, 38, .06);
		border-color: rgba(220, 38, 38, .22);
	}

	html[data-theme="dark"] .blog-callout--warn {
		background: rgba(248, 113, 113, .08);
		border-color: rgba(248, 113, 113, .25);
	}

	.blog-callout__label {
		display: block;
		font-size: 0.68rem;
		font-weight: 800;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: var(--green-strong);
		margin-bottom: 0.4rem;
	}

	.blog-callout--tip .blog-callout__label {
		color: var(--amber);
	}

	.blog-callout--warn .blog-callout__label {
		color: var(--red);
	}

	.blog-callout__text {
		margin: 0;
		font-size: 0.9rem;
		line-height: 1.62;
		color: var(--text);
	}

	.blog-callout__text code {
		font-size: 0.84em;
		padding: 0.12rem 0.35rem;
		border-radius: 6px;
		background: var(--surface);
		border: 1px solid var(--line);
	}

	.blog-figure {
		margin: 1.5rem 0;
		padding: 1rem 1.1rem;
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		box-shadow: var(--card-shadow);
	}

	.blog-figure__chart {
		display: flex;
		flex-direction: column;
		gap: 10px;
	}

	.blog-figure__bar {
		display: block;
		padding: 0.45rem 0.65rem;
		font-size: 0.78rem;
		font-weight: 700;
		color: var(--heading);
		border-radius: 8px;
		background: linear-gradient(90deg, var(--green-dim), var(--green-dim));
		background-image: linear-gradient(105deg, var(--green-dim) 0%, rgba(0, 200, 83, .22) 100%);
		border: 1px solid var(--green-border);
	}

	html[data-theme="dark"] .blog-figure__bar {
		background-image: linear-gradient(105deg, rgba(0, 230, 118, .12) 0%, rgba(0, 230, 118, .05) 100%);
	}

	.blog-figure__bar--2 {
		background-image: linear-gradient(105deg, var(--amber-dim) 0%, rgba(180, 83, 9, .15) 100%);
		border-color: var(--amber-border);
	}

	.blog-figure__bar--3 {
		background-image: linear-gradient(105deg, var(--surface) 0%, var(--green-dim) 100%);
	}

	.blog-figure__cap {
		margin: 0.75rem 0 0;
		font-size: 0.8rem;
		color: var(--muted);
		line-height: 1.5;
	}

	.blog-keypoints {
		display: flex;
		flex-direction: column;
		gap: 12px;
		margin: 1.25rem 0;
		padding: 0;
	}

	.blog-keypoints__item {
		display: flex;
		gap: 12px;
		align-items: flex-start;
		padding: 0.85rem 1rem calc(0.85rem + 2px);
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		box-shadow: var(--card-shadow);
	}

	.blog-keypoints__ico {
		flex-shrink: 0;
		width: 28px;
		height: 28px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 8px;
		background: var(--green-dim);
		color: var(--green-strong);
		font-weight: 800;
		font-size: 0.85rem;
	}

	.blog-keypoints__item div {
		font-size: 0.9rem;
		line-height: 1.55;
	}

	.blog-pullquote {
		margin: 1.5rem 0;
		padding: 1.25rem 1.35rem;
		border-left: 4px solid var(--amber);
		background: var(--amber-dim);
		border-radius: 0 var(--radius) var(--radius) 0;
	}

	.blog-pullquote p {
		margin: 0;
		font-size: 1.05rem;
		font-weight: 600;
		font-style: italic;
		color: var(--heading);
		line-height: 1.55;
	}

	.blog-code-block {
		margin: 1.35rem 0;
		padding: 1rem 1.15rem;
		background: var(--bg-alt);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		overflow-x: auto;
		font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
		font-size: 0.8rem;
		line-height: 1.55;
		color: var(--heading);
	}

	.blog-code-block code {
		white-space: pre-wrap;
		word-break: break-word;
	}

	.blog-checklist {
		margin: 1rem 0 1.5rem;
		padding-left: 1.2rem;
	}

	.blog-checklist li {
		margin-bottom: 0.5rem;
	}

	.blog-share-row {
		margin: 2rem 0;
		padding: 1.15rem 1.2rem;
		border: 1px dashed var(--line-strong);
		border-radius: var(--radius);
		background: var(--surface);
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 12px 20px;
	}

	.blog-share-row__label {
		font-size: 0.75rem;
		font-weight: 800;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		color: var(--muted);
	}

	.blog-share-row__btns {
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
	}

	.blog-share-btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 0.45rem 0.95rem;
		font-size: 0.82rem;
		font-weight: 700;
		border-radius: 999px;
		border: 1px solid var(--green-border);
		background: var(--green-dim);
		color: var(--green-strong);
		text-decoration: none;
		cursor: pointer;
		font-family: var(--font);
		transition: background .2s, transform .15s;
	}

	.blog-share-btn:hover {
		background: var(--bg2);
		transform: translateY(-1px);
	}

	.blog-share-btn--ghost {
		background: var(--bg2);
		color: var(--heading);
		border-color: var(--line);
	}

	.blog-author-card {
		display: flex;
		gap: 1rem;
		align-items: flex-start;
		margin: 1.5rem 0;
		padding: 1.2rem 1.25rem;
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		box-shadow: var(--card-shadow);
	}

	.blog-author-card__avatar {
		flex-shrink: 0;
		width: 52px;
		height: 52px;
		border-radius: 14px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: 800;
		font-size: 0.95rem;
		color: var(--green-strong);
		background: var(--green-dim);
		border: 1px solid var(--green-border);
	}

	.blog-author-card__name {
		font-weight: 800;
		color: var(--heading);
		margin: 0 0 0.35rem;
	}

	.blog-author-card__bio {
		margin: 0;
		font-size: 0.88rem;
		color: var(--muted);
		line-height: 1.55;
	}

	.blog-author-card__cta {
		display: inline-block;
		margin-top: 0.65rem;
		font-size: 0.85rem;
		font-weight: 700;
		color: var(--green-strong);
		text-decoration: none;
	}

	.blog-author-card__cta:hover {
		text-decoration: underline;
		text-underline-offset: 3px;
	}

	.blog-related {
		margin-top: 2.25rem;
		padding-top: 1.75rem;
		border-top: 1px solid var(--line);
	}

	.blog-related__title {
		font-size: 1rem;
		font-weight: 800;
		color: var(--heading);
		margin: 0 0 1rem;
	}

	.blog-related__grid {
		display: grid;
		gap: 12px;
		grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	}

	.blog-related__card {
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		min-height: 72px;
		padding: 0.85rem 1rem;
		font-size: 0.88rem;
		font-weight: 700;
		color: var(--heading);
		text-decoration: none;
		border-radius: var(--radius);
		border: 1px solid var(--line);
		background: var(--bg2);
		box-shadow: var(--card-shadow);
		transition: border-color .2s, transform .2s, box-shadow .2s;
	}

	.blog-related__card:hover {
		border-color: var(--green-border);
		transform: translateY(-2px);
		box-shadow: var(--offer-hover-shadow);
	}

	/* —— Chi tiết mẫu sản phẩm (demo) —— */
	.hero.hero--product-detail {
		padding-top: clamp(44px, 6vw, 64px);
		padding-bottom: 36px;
		text-align: left;
		-webkit-mask-image: none;
		mask-image: none;
	}

	.hero.hero--product-detail .container {
		text-align: left;
	}

	.hero.hero--product-detail .breadcrumb__list {
		margin-bottom: 1.1rem;
	}

	.hero.hero--product-detail .product-single-hero-cat {
		margin-bottom: 12px;
	}

	.product-detail-hero-grid {
		display: grid;
		gap: 28px;
		align-items: center;
	}

	@media (min-width: 900px) {
		.product-detail-hero-grid {
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
		gap: 40px;
		}
	}

	.product-detail-lead {
		max-width: 38rem;
		margin-bottom: 0 !important;
	}

	.product-detail-hero-cta {
		display: flex;
		flex-wrap: wrap;
		gap: 12px;
		margin-top: 1.35rem;
	}

	.product-detail-trust-row {
		list-style: none;
		margin: 1.35rem 0 0;
		padding: 0;
		display: flex;
		flex-wrap: wrap;
		gap: 10px 18px;
		font-size: 0.82rem;
		font-weight: 600;
		color: var(--muted);
	}

	.product-detail-trust-row li {
		display: inline-flex;
		align-items: center;
		gap: 6px;
	}

	.product-detail-trust-row li::before {
		content: '';
		width: 6px;
		height: 6px;
		border-radius: 50%;
		background: var(--green);
		flex-shrink: 0;
	}

	.product-detail-shot {
		position: relative;
		border-radius: calc(var(--radius) + 4px);
		overflow: hidden;
		border: 1px solid var(--line);
		box-shadow: var(--offer-hover-shadow);
		background: var(--bg-alt);
	}

	.product-detail-shot img {
		width: 100%;
		height: auto;
		display: block;
	}

	.product-detail-shot__img {
		width: 100%;
		height: auto;
		display: block;
	}

	.product-detail-media {
		padding: 0 0 36px;
		background: var(--bg);
	}

	.product-detail-media__inner {
		display: flex;
		flex-direction: column;
		gap: 20px;
	}

	.product-detail-shot--hero {
		aspect-ratio: 16 / 9;
		max-width: 920px;
		margin: 0 auto;
		width: 100%;
	}

	.product-detail-shot--hero img,
	.product-detail-shot--hero .product-detail-shot__img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center top;
		transition: object-position 2.75s cubic-bezier(0.33, 0, 0.2, 1);
	}

	.product-detail-shot--hero:hover img,
	.product-detail-shot--hero:hover .product-detail-shot__img {
		object-position: center bottom;
	}

	@media (prefers-reduced-motion: reduce) {
		.product-detail-shot--hero img,
		.product-detail-shot--hero .product-detail-shot__img {
			transition: none;
		}

		.product-detail-shot--hero:hover img,
		.product-detail-shot--hero:hover .product-detail-shot__img {
			object-position: center top;
		}
	}

	.product-detail-gallery-wrap {
		max-width: 920px;
		margin: 0 auto;
		width: 100%;
	}

	.product-detail-gallery {
		position: relative;
		display: flex;
		align-items: center;
		gap: 8px;
	}

	.product-detail-gallery--single .product-detail-gallery__viewport {
		border-radius: calc(var(--radius) + 4px);
	}

	.product-detail-gallery__viewport {
		--pd-gal-gap: 10px;
		flex: 1;
		min-width: 0;
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
		border-radius: calc(var(--radius) + 4px);
		/* border: 1px solid var(--line); */
		/* background: var(--bg-alt); */
		scrollbar-width: none;
		-ms-overflow-style: none;
		container-type: inline-size;
		container-name: pd-gal;
	}

	.product-detail-gallery__viewport::-webkit-scrollbar {
		display: none;
		width: 0;
		height: 0;
	}

	.product-detail-gallery__viewport:focus-visible {
		outline: 2px solid var(--green);
		outline-offset: 2px;
	}

	.product-detail-gallery__track {
		display: flex;
		gap: var(--pd-gal-gap, 10px);
	}

	.product-detail-gallery__slide {
		align-self: flex-start;
		cursor: pointer;
		border-radius: calc(var(--radius) + 4px);
	}

	.product-detail-gallery__slide-inner {
		overflow: hidden;
		aspect-ratio: 16 / 9;
		width: 100%;
		border-radius: calc(var(--radius) + 2px);
	}

	.product-detail-gallery__slide:focus-visible {
		border: 2px solid var(--green);
	}

	.product-detail-gallery__slide.is-active-hero {
		border: 2px solid var(--green);
	}

	.product-detail-gallery--single .product-detail-gallery__slide {
		flex: 0 0 100%;
		width: 100%;
		min-width: 0;
		scroll-snap-align: start;
		scroll-snap-stop: always;
	}

	@container pd-gal (min-width: 0) {
		.product-detail-gallery:not(.product-detail-gallery--single) .product-detail-gallery__slide {
			flex: 0 0 calc((100cqw - 2 * var(--pd-gal-gap, 10px)) / 3);
			min-width: 0;
			scroll-snap-align: start;
			scroll-snap-stop: always;
		}
	}

	@supports not (container-type: inline-size) {
		.product-detail-gallery:not(.product-detail-gallery--single) .product-detail-gallery__slide {
			flex: 0 0 calc((100% - 2 * var(--pd-gal-gap, 10px)) / 3);
			min-width: 0;
			scroll-snap-align: start;
			scroll-snap-stop: always;
		}

		.product-detail-gallery__track {
			width: max-content;
			min-width: 100%;
		}
	}

	.product-detail-gallery__slide-inner img {
		width: 100%;
		height: 100%;
		display: block;
		object-fit: cover;
		object-position: center;
		vertical-align: middle;
	}

	.product-detail-gallery__nav {
		flex-shrink: 0;
		width: 42px;
		height: 42px;
		padding: 0;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border-radius: 10px;
		border: 1px solid var(--line);
		background: var(--bg-alt);
		color: var(--heading);
		font-size: 1.5rem;
		line-height: 1;
		cursor: pointer;
		transition: background 0.15s ease, border-color 0.15s ease, opacity 0.15s ease;
	}

	.product-detail-gallery__nav span {
		height: 26px;
	}

	.product-detail-gallery__nav:hover:not(:disabled) {
		border-color: var(--green);
		background: var(--green-dim);
	}

	.product-detail-gallery__nav:disabled {
		opacity: 0.35;
		cursor: not-allowed;
	}

	@media (max-width: 640px) {
		.product-detail-gallery--single .product-detail-gallery__viewport,
		.product-detail-gallery__viewport {
			border-radius: 8px;
		}

		.product-detail-gallery__slide {
			border-radius: 8px;
		}

		.product-detail-gallery__slide-inner {
			border-radius: 6px;
		}

		.product-detail-gallery {
			gap: 6px;
		}

		.product-detail-gallery__nav {
			width: 40px;
			height: 40px;
			min-width: 40px;
			min-height: 40px;
			border-radius: 8px;
			font-size: 1.35rem;
			-webkit-tap-highlight-color: transparent;
		}

		.product-detail-gallery__nav span {
			height: 24px;
		}
	}

	.product-detail-media__actions {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		gap: 12px 16px;
		margin-top: 20px;
	}

	.product-detail-media__actions .btn-ghost {
		order: 0;
	}

	.product-detail-media__actions .btn-primary {
		order: 1;
	}

	.product-detail-band__inner--stats-only {
		justify-content: center;
	}

	.product-detail-band__inner--stats-only .product-detail-band__stats {
		width: 100%;
		justify-content: center;
	}

	/* Stats band: mobile stack; tablet 3 cột; desktop một hàng */
	@media (max-width: 639px) {
		#product-stats.product-detail-band {
			padding: 14px 0 16px;
		}

		.product-detail-band__inner--stats-only .product-detail-band__stats {
			flex-direction: column;
			align-items: stretch;
			flex-wrap: nowrap;
			gap: 0;
			max-width: 100%;
		}

		.product-detail-band__inner--stats-only .product-detail-stat {
			display: flex;
			flex-direction: column;
			align-items: center;
			text-align: center;
			gap: 5px;
			padding: 14px 12px;
			border-bottom: 1px solid var(--line);
		}

		.product-detail-band__inner--stats-only .product-detail-stat:last-child {
			border-bottom: none;
			padding-bottom: 2px;
		}

		.product-detail-band__inner--stats-only .product-detail-stat strong {
			font-size: clamp(1.08rem, 4.5vw, 1.3rem);
			line-height: 1.25;
			word-break: break-word;
			overflow-wrap: anywhere;
			hyphens: auto;
		}

		.product-detail-band__inner--stats-only .product-detail-stat span {
			font-size: 0.76rem;
			line-height: 1.4;
			max-width: 22rem;
		}
	}

	@media (min-width: 640px) and (max-width: 719px) {
		.product-detail-band__inner--stats-only .product-detail-band__stats {
			display: grid;
			grid-template-columns: repeat(3, minmax(0, 1fr));
			gap: 12px 10px;
			align-items: stretch;
		}

		.product-detail-band__inner--stats-only .product-detail-stat {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			text-align: center;
			gap: 6px;
			min-height: 5.5rem;
			padding: 12px 8px;
			background: var(--bg2);
			border: 1px solid var(--line);
			border-radius: var(--radius);
		}

		.product-detail-band__inner--stats-only .product-detail-stat strong {
			font-size: clamp(0.98rem, 2.4vw, 1.2rem);
			line-height: 1.2;
			word-break: break-word;
			overflow-wrap: anywhere;
		}

		.product-detail-band__inner--stats-only .product-detail-stat span {
			font-size: 0.72rem;
			line-height: 1.35;
		}
	}

	@media (min-width: 720px) {
		.product-detail-band__inner--stats-only .product-detail-band__stats {
			justify-content: space-between;
		}

		.product-detail-band__inner--stats-only .product-detail-stat strong {
			word-break: break-word;
			overflow-wrap: anywhere;
		}
	}

	.product-detail-hero-grid--text-only {
		grid-template-columns: 1fr;
	}

	.product-detail-price-row {
		display: inline-flex;
		flex-wrap: wrap;
		align-items: baseline;
		gap: 0.35rem 0.65rem;
	}

	.product-detail-price-row del {
		font-size: 1.05rem;
		font-weight: 700;
		opacity: 0.55;
		text-decoration: line-through;
	}

	.product-detail-price-row ins {
		text-decoration: none;
	}

	.product-detail-badge {
		position: absolute;
		bottom: 12px;
		right: 12px;
		padding: 6px 12px;
		font-size: 0.72rem;
		font-weight: 800;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		border-radius: 8px;
		background: rgba(15, 23, 42, 0.82);
		color: #f8fafc;
		border: 1px solid rgba(255, 255, 255, 0.12);
	}

	html[data-theme="dark"] .product-detail-badge {
		background: rgba(6, 9, 15, 0.88);
		border-color: var(--line);
	}

	.product-detail-band {
		background: var(--bg-alt);
		border-top: 1px solid var(--line);
		border-bottom: 1px solid var(--line);
		padding: 22px 0;
	}

	.product-detail-band__inner {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 18px 28px;
	}

	.product-detail-band__stats {
		display: flex;
		flex-wrap: wrap;
		gap: 22px 32px;
	}

	.product-detail-stat {
		min-width: 0;
	}

	.product-detail-stat strong {
		display: block;
		font-size: 1.35rem;
		font-weight: 800;
		color: var(--heading);
		line-height: 1.2;
	}

	.product-detail-stat span {
		font-size: 0.8rem;
		color: var(--muted);
		font-weight: 600;
	}

	.product-detail-band__cta .btn {
		white-space: nowrap;
	}

	.product-detail-main-wrap {
		padding: 44px 0 56px;
		background: var(--bg);
		background-image:
		radial-gradient(ellipse 80% 45% at 20% 0%, var(--green-dim) 0%, transparent 55%),
		linear-gradient(180deg, var(--bg3) 0%, var(--bg) 28%);
	}

	html[data-theme="dark"] .product-detail-main-wrap {
		background-image:
		radial-gradient(ellipse 70% 40% at 20% 0%, rgba(0, 230, 118, .07) 0%, transparent 50%),
		linear-gradient(180deg, #090d14 0%, var(--bg) 35%);
	}

	.product-detail-layout {
		display: grid;
		gap: 32px;
	}

	@media (min-width: 960px) {
		.product-detail-layout {
		grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
		gap: 44px;
		}

		.product-detail-sticky {
		position: sticky;
		top: max(12px, calc(var(--header-offset, 72px) + 10px));
		}
	}

	.product-detail-article {
		min-width: 0;
		color: var(--text);
		font-size: 0.95rem;
		line-height: 1.78;
	}

	.product-detail-article h2 {
		font-size: 1.2rem;
		font-weight: 800;
		color: var(--heading);
		margin: 2rem 0 0.75rem;
		letter-spacing: -0.02em;
		scroll-margin-top: calc(var(--header-offset, 72px) + 14px);
	}

	.product-detail-article h3 {
		font-size: 1.1rem;
		font-weight: 700;
		color: var(--heading);
		margin: 1.5rem 0 0.75rem;
		letter-spacing: -0.02em;
		scroll-margin-top: calc(var(--header-offset, 72px) + 14px);
	}

	.product-detail-article h2:first-child {
		margin-top: 0;
	}

	.product-detail-kicker {
		font-size: 0.72rem;
		font-weight: 800;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		color: var(--green-strong);
		margin-bottom: 0.35rem;
	}

	.product-detail-article p {
		margin: 0 0 1rem;
	}

	.product-detail-article ul {
		margin: 0 0 1.15rem;
		padding-left: 1.2rem;
	}

	.product-detail-article ol {
		margin: 0 0 1.15rem;
		padding-left: 1.35rem;
	}

	.product-detail-article li {
		margin-bottom: 0.45rem;
	}

	.product-detail-article table {
		width: 100%;
		max-width: 100%;
		border-collapse: collapse;
		margin: 0 0 1.15rem;
		font-size: 0.9rem;
	}

	.product-detail-article th,
	.product-detail-article td {
		border: 1px solid var(--line);
		padding: 0.65rem 0.85rem;
		text-align: left;
		vertical-align: top;
	}

	.product-detail-article th {
		background: var(--bg-alt);
		font-weight: 700;
		color: var(--heading);
	}

	.product-detail-article hr {
		border: none;
		border-top: 1px solid var(--line);
		margin: 1.5rem 0;
	}

	.product-detail-article iframe {
		max-width: 100%;
		width: 100%;
	}

	.product-detail-pill-list {
		list-style: none;
		margin: 1rem 0 1.5rem;
		padding: 0 !important;
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
	}

	.product-detail-pill-list li {
		margin: 0;
		padding: 6px 12px;
		font-size: 0.8rem;
		font-weight: 600;
		border-radius: 999px;
		background: var(--surface);
		border: 1px solid var(--line);
		color: var(--heading);
	}

	.product-detail-compare {
		display: grid;
		gap: 0;
		margin: 1.25rem 0 1.75rem;
		border: 1px solid var(--line);
		border-radius: var(--radius);
		overflow: hidden;
		box-shadow: var(--card-shadow);
	}

	.product-detail-compare__head,
	.product-detail-compare__row {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}

	.product-detail-compare__head {
		background: var(--bg-alt);
		font-size: 0.78rem;
		font-weight: 800;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		color: var(--muted);
	}

	.product-detail-compare__head div {
		padding: 10px 14px;
		border-bottom: 1px solid var(--line);
	}

	.product-detail-compare__head div:last-child {
		border-left: 1px solid var(--line);
		color: var(--green-strong);
		background: var(--green-dim);
	}

	.product-detail-compare__row div {
		padding: 12px 14px;
		font-size: 0.88rem;
		border-bottom: 1px solid var(--line);
	}

	.product-detail-compare__row div:last-child {
		border-left: 1px solid var(--line);
		background: var(--bg2);
		font-weight: 600;
	}

	.product-detail-compare__row:last-child div {
		border-bottom: none;
	}

	.product-detail-article quote {
		display: block;
		margin: 1.5rem 0;
		padding: 1.2rem 1.35rem;
		border-left: 4px solid var(--green);
		background: var(--green-dim);
		border-radius: 0 var(--radius) var(--radius) 0;
		font-size: 1.02rem;
		font-weight: 600;
		font-style: italic;
		color: var(--heading);
		line-height: 1.55;
	}

	.product-detail-aside {
		min-width: 0;
	}

	.product-detail-price-card {
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		padding: 1.35rem 1.4rem 1.5rem;
		box-shadow: var(--card-shadow), 0 20px 48px rgba(15, 23, 42, .06);
	}

	html[data-theme="dark"] .product-detail-price-card {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
		box-shadow: 0 0 0 1px var(--line), 0 24px 48px rgba(0, 0, 0, .35);
	}

	.product-detail-price-label {
		font-size: 0.72rem;
		font-weight: 800;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--muted);
		margin: 0 0 0.35rem;
	}

	.product-detail-price {
		font-size: 1.75rem;
		font-weight: 900;
		color: var(--heading);
		margin: 0 0 0.75rem;
		letter-spacing: -0.03em;
	}

	.product-detail-price-list {
		list-style: none;
		margin: 0 0 1.15rem;
		padding: 0;
		font-size: 0.87rem;
		line-height: 1.55;
		color: var(--text);
	}

	.product-detail-price-list li {
		margin-bottom: 0.5rem;
		padding-left: 1.35rem;
		position: relative;
	}

	.product-detail-price-list li::before {
		content: '✓';
		position: absolute;
		left: 0;
		color: var(--green-strong);
		font-weight: 800;
	}

	.product-detail-price-note {
		margin: 0.85rem 0 0;
		font-size: 0.78rem;
		color: var(--muted);
		line-height: 1.45;
	}

	.product-detail-mini-faq {
		margin-top: 1.25rem;
		padding-top: 1.25rem;
		border-top: 1px dashed var(--line-strong);
	}

	.product-detail-mini-faq h3 {
		font-size: 0.78rem;
		font-weight: 800;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		color: var(--muted);
		margin: 0 0 0.65rem;
	}

	.product-detail-mini-faq details {
		background: var(--surface);
		border: 1px solid var(--line);
		border-radius: 10px;
		margin-bottom: 8px;
		overflow: hidden;
	}

	.product-detail-mini-faq summary {
		list-style: none;
		cursor: pointer;
		padding: 12px 14px;
		font-size: 0.86rem;
		font-weight: 700;
		color: var(--heading);
	}

	.product-detail-mini-faq summary::-webkit-details-marker {
		display: none;
	}

	.product-detail-mini-faq details p {
		margin: 0;
		padding: 0 14px 14px;
		font-size: 0.84rem;
		color: var(--muted);
		line-height: 1.55;
	}

	.product-detail-related-section {
		padding: 48px 0 40px;
		background: var(--bg2);
		border-top: 1px solid var(--line);
	}

	.product-related-carousel-shell {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		gap: clamp(8px, 2.5vw, 16px);
		width: 100%;
		box-sizing: border-box;
	}

	.product-related-carousel-shell > .container {
		flex: 0 1 1140px;
		width: 100%;
		min-width: 0;
		margin: 0;
	}

	.product-explore-carousel-arrow {
		flex-shrink: 0;
		width: 44px;
		height: 44px;
		padding: 0;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border-radius: 10px;
		border: 1px solid var(--line);
		background: var(--bg-alt);
		color: var(--heading);
		font-size: 1.5rem;
		line-height: 1;
		cursor: pointer;
		transition: background 0.15s ease, border-color 0.15s ease, opacity 0.15s ease;
		-webkit-tap-highlight-color: transparent;
	}

	.product-explore-carousel-arrow span {
		display: block;
		height: 26px;
		line-height: 26px;
	}

	.product-explore-carousel-arrow:hover:not(:disabled) {
		border-color: var(--green);
		background: var(--green-dim);
	}

	.product-explore-carousel-arrow:disabled {
		opacity: 0.35;
		cursor: not-allowed;
	}

	@media (max-width: 719px) {
		.product-detail-related-section .product-explore-carousel-arrow {
			display: none;
		}

		.product-detail-related-section .product-related-carousel-shell {
			gap: 0;
		}
	}

	.product-explore-carousel-viewport.is-dragging .product-card {
		pointer-events: none;
	}

	.product-explore-carousel__slide .product-card {
		width: 100%;
		max-width: 100%;
		min-width: 0;
		flex: 1 1 auto;
		align-self: stretch;
	}

	.product-detail-more-section {
		padding: 48px 0 56px;
		background-color: var(--bg2);
		background-image:
		radial-gradient(ellipse 85% 50% at 15% 0%, var(--green-dim) 0%, transparent 52%),
		radial-gradient(ellipse 60% 45% at 100% 30%, var(--amber-dim) 0%, transparent 48%),
		linear-gradient(180deg, var(--bg3) 0%, var(--bg2) 22%);
		border-top: 1px solid var(--line);
	}

	html[data-theme="dark"] .product-detail-more-section {
		background-image:
		radial-gradient(ellipse 75% 48% at 12% 0%, rgba(0, 230, 118, .08) 0%, transparent 50%),
		radial-gradient(ellipse 55% 40% at 100% 25%, rgba(251, 191, 36, .08) 0%, transparent 45%),
		linear-gradient(180deg, var(--bg3) 0%, var(--bg2) 25%);
	}

	.product-detail-more-header {
		max-width: 46rem;
		margin-bottom: 2.25rem;
	}

	.product-detail-more-pretitle {
		display: inline-block;
		font-size: 0.7rem;
		font-weight: 800;
		letter-spacing: 0.14em;
		text-transform: uppercase;
		color: var(--amber);
		margin-bottom: 0.65rem;
	}

	.product-detail-more-header h2 {
		font-size: clamp(1.2rem, 2.5vw, 1.55rem);
		font-weight: 800;
		color: var(--heading);
		line-height: 1.3;
		margin: 0 0 0.85rem;
		letter-spacing: -0.02em;
	}

	.product-detail-more-lead {
		margin: 0;
		font-size: 0.95rem;
		line-height: 1.7;
		color: var(--muted);
	}

	.product-detail-explore + .product-detail-explore {
		margin-top: 2.25rem;
	}

	.product-detail-explore__label {
		display: flex;
		align-items: center;
		gap: 10px;
		font-size: 0.78rem;
		font-weight: 800;
		letter-spacing: 0.11em;
		text-transform: uppercase;
		color: var(--muted);
		margin: 0 0 1rem;
	}

	.product-detail-explore__label-dot {
		width: 8px;
		height: 8px;
		border-radius: 50%;
		background: var(--green);
		flex-shrink: 0;
		box-shadow: 0 0 0 3px var(--green-dim);
	}

	.product-detail-explore__label-dot--svc {
		background: var(--amber);
		box-shadow: 0 0 0 3px var(--amber-dim);
	}

	.product-detail-explore-grid {
		display: grid;
		gap: 16px;
		grid-template-columns: 1fr;
	}

	@media (min-width: 640px) {
		.product-detail-explore-grid {
		grid-template-columns: repeat(2, 1fr);
		}
	}

	@media (min-width: 1000px) {
		.product-detail-explore-grid {
		grid-template-columns: repeat(3, 1fr);
		}
	}

	.product-explore-carousel {
		margin-top: 0;
	}

	.product-explore-carousel-viewport {
		width: 100%;
		min-width: 0;
		overflow: hidden;
		outline: none;
		cursor: grab;
		touch-action: pan-y pinch-zoom;
		padding: 5px 0 10px;
	}

	.product-explore-carousel-viewport.is-dragging {
		cursor: grabbing;
		-webkit-user-select: none;
		user-select: none;
	}

	.product-explore-carousel-viewport.is-dragging .product-detail-explore-card {
		pointer-events: none;
	}

	.product-explore-carousel-viewport:focus-visible {
		box-shadow: 0 0 0 2px var(--green);
		border-radius: 10px;
	}

	.product-explore-carousel-track {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		gap: 16px;
		transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
		will-change: transform;
	}

	@media (prefers-reduced-motion: reduce) {
		.product-explore-carousel-track {
		transition-duration: 0.01ms;
		}
	}

	.product-explore-carousel__slide {
		display: flex;
		flex-shrink: 0;
		box-sizing: border-box;
	}

	.product-explore-carousel__slide .product-detail-explore-card {
		width: 100%;
		min-height: 100%;
		box-sizing: border-box;
		cursor: pointer;
		-webkit-user-drag: none;
		user-select: none;
		-webkit-user-select: none;
		touch-action: pan-y pinch-zoom;
	}

	.product-detail-explore-card {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		text-align: left;
		text-decoration: none;
		color: inherit;
		min-height: 100%;
		padding: 1.25rem 1.3rem 1.35rem;
		border-radius: calc(var(--radius) + 2px);
		border: 1px solid var(--line);
		background: var(--bg2);
		box-shadow: var(--card-shadow);
		transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
	}

	.product-detail-explore-card:hover {
		border-color: var(--green-border);
		transform: translateY(-4px);
		box-shadow: 0px 3px 8px rgba(15, 23, 42, .1);
	}

	.product-detail-explore-card:focus-visible {
		outline: 2px solid var(--green);
		outline-offset: 3px;
	}

	.product-detail-explore-card--accent {
		border-color: var(--green-border);
		background: linear-gradient(165deg, var(--green-dim) 0%, var(--bg2) 48%);
		box-shadow: var(--card-shadow), 0 0 0 1px rgba(0, 200, 83, .06);
	}

	html[data-theme="dark"] .product-detail-explore-card--accent {
		background: linear-gradient(165deg, rgba(0, 230, 118, .12) 0%, var(--surface-raised) 55%);
		box-shadow: var(--surface-raised-shadow), 0 0 0 1px rgba(0, 230, 118, .2);
	}

	.product-detail-explore-card__ico {
		font-size: 1.75rem;
		line-height: 1;
		margin-bottom: 0.65rem;
	}

	.product-detail-explore-card__cat {
		font-size: 0.68rem;
		font-weight: 800;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: var(--green-strong);
		margin-bottom: 0.35rem;
	}

	.product-detail-explore-card--accent .product-detail-explore-card__cat {
		color: var(--green-strong);
	}

	.product-detail-more-section .container > .product-detail-explore:nth-child(2) .product-detail-explore__label + .product-explore-carousel .product-detail-explore-card:not(.product-detail-explore-card--accent) .product-detail-explore-card__cat,
	.product-detail-more-section .container > .product-detail-explore:nth-child(2) .product-detail-explore__label + .product-detail-explore-grid .product-detail-explore-card:not(.product-detail-explore-card--accent) .product-detail-explore-card__cat {
		color: var(--muted);
	}

	.product-detail-more-section .container > .product-detail-explore:nth-child(3) .product-detail-explore-card__cat {
		color: var(--amber);
	}

	.product-detail-explore-card__title {
		font-size: 1.02rem;
		font-weight: 800;
		color: var(--heading);
		line-height: 1.35;
		margin-bottom: 0.45rem;
		letter-spacing: -0.02em;
	}

	.product-detail-explore-card__desc {
		font-size: 0.86rem;
		line-height: 1.58;
		color: var(--muted);
		flex: 1;
		margin-bottom: 1rem;
	}

	.product-detail-explore-card__cta {
		font-size: 0.82rem;
		font-weight: 800;
		color: var(--green-strong);
		margin-top: auto;
	}

	.product-detail-explore-card:hover .product-detail-explore-card__cta {
		text-decoration: underline;
		text-underline-offset: 3px;
	}

	.product-detail-more-footer {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 14px;
		margin-top: 2.25rem;
		padding-top: 1.5rem;
		border-top: 1px solid var(--line);
	}

	.product-detail-more-footer__link {
		font-size: 0.88rem;
		font-weight: 700;
		color: var(--muted);
		text-decoration: none;
		transition: color .2s;
	}

	.product-detail-more-footer__link:hover {
		color: var(--green-strong);
	}

	.product-detail-more-footer__link--primary {
		color: var(--green-strong);
		padding: 0.55rem 1.1rem;
		border-radius: 999px;
		border: 1px solid var(--green-border);
		background: var(--green-dim);
	}

	.product-detail-more-footer__link--primary:hover {
		color: var(--heading);
		background: var(--bg2);
	}

	/* —— Danh mục sản phẩm: lưới card có ảnh + CTA —— */
	.product-grid-wapper {
		margin-top: 10px;
	}

	.product-grid {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
		gap: 22px;
		align-items: stretch;
	}

	.product-card {
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		overflow: hidden;
		display: flex;
		flex-direction: column;
		height: 100%;
		transition: border-color .3s ease, transform .3s ease, box-shadow .3s ease;
		box-shadow: var(--card-shadow);
	}

	.product-card:hover {
		border-color: var(--green-border);
		transform: translateY(-4px);
		box-shadow: var(--offer-hover-shadow);
	}

	.product-item-media {
		aspect-ratio: 16 / 9;
		background: var(--bg3);
		overflow: hidden;
	}

	.product-item-media img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}

	.product-item-thumb-link {
		display: block;
		height: 100%;
		color: inherit;
		text-decoration: none;
		outline-offset: 2px;
	}

	.product-item-thumb-link:focus-visible {
		outline: 2px solid var(--green);
	}

	.product-item-thumb-placeholder {
		display: block;
		min-height: 100%;
		background: linear-gradient(135deg, var(--bg3) 0%, var(--line) 120%);
	}

	.product-item-title-link {
		font-size: inherit;
		font-weight: inherit;
		color: inherit;
		text-decoration: none;
		transition: color .2s ease;
	}

	.product-item-title-link:hover,
	.product-item-title-link:focus-visible {
		color: var(--green);
	}

	.product-item-body {
		padding: 18px 20px 20px;
		display: flex;
		flex-direction: column;
		flex: 1;
		gap: 8px;
		min-height: 0;
	}

	.product-item-cat {
		font-size: .72rem;
		font-weight: 800;
		text-transform: uppercase;
		letter-spacing: .07em;
		color: var(--green);
		line-height: 1.3;
	}

	.product-item-title {
		font-size: 1.05rem;
		font-weight: 800;
		color: var(--heading);
		margin: 0;
		line-height: 1.3;
	}

	.product-item-desc {
		font-size: .87rem;
		color: var(--muted);
		line-height: 1.65;
		margin: 0;
		flex: 1 1 auto;
	}

	.product-item-actions {
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		margin-top: 14px;
		padding-top: 4px;
	}

	.btn-pair {
		flex: 1 1 calc(50% - 5px);
		min-width: 0;
		padding: 10px 14px;
		font-size: .8rem;
		text-align: center;
	}

	@media (max-width: 380px) {
		.product-item-actions {
		flex-direction: column;
		}

		.btn-pair {
		flex: 1 1 auto;
		}
	}

	/* Numbered pager (see altjsc_the_pagination() in inc/pagination.php) */
	.altjsc-pagination {
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		margin-top: 28px;
		width: 100%;
		max-width: 100%;
	}

	/* Một hàng: prev | số trang | next */
	.altjsc-pagination__nums {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		gap: 8px;
		width: auto;
		flex: 0 1 auto;
		min-width: 0;
		padding: 0 4px;
		box-sizing: border-box;
	}

	.altjsc-pagination__row {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		gap: 10px;
		flex-wrap: wrap;
	}

	.altjsc-pagination__num {
		-webkit-appearance: none;
		appearance: none;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 2.4rem;
		height: 2.4rem;
		padding: 0 10px;
		border-radius: 10px;
		font-family: var(--font);
		font-weight: 700;
		font-size: .82rem;
		cursor: default;
		border: 1px solid var(--line-strong);
		background: var(--bg2);
		color: var(--text);
		text-decoration: none;
		transition: border-color .2s, color .2s, background .2s;
		box-sizing: border-box;
	}

	a.altjsc-pagination__num {
		cursor: pointer;
	}

	a.altjsc-pagination__num:hover {
		border-color: var(--green-border);
		color: var(--green);
		background: var(--bg3);
	}

	.altjsc-pagination__num.is-active {
		background: linear-gradient(135deg, rgba(0, 230, 118, .2), rgba(0, 176, 155, .12));
		border-color: var(--green-border);
		color: var(--green);
	}

	.altjsc-pagination__prev,
	.altjsc-pagination__next {
		flex-shrink: 0;
		min-width: 2.4rem;
		padding-left: 12px;
		padding-right: 12px;
		justify-content: center;
		font-size: 1.05rem;
		line-height: 1;
    border-radius: 10px;
	}

	/* Prev/next vô hiệu: mờ rõ hơn so với nút bấm được */
	.altjsc-pagination__prev.altjsc-pagination__faux,
	.altjsc-pagination__next.altjsc-pagination__faux {
		cursor: default;
		pointer-events: none;
		user-select: none;
		opacity: 0.45;
		color: var(--muted);
		border-color: var(--line);
		background: var(--surface);
		box-shadow: none;
	}

	.altjsc-pagination__prev.altjsc-pagination__faux:hover,
	.altjsc-pagination__next.altjsc-pagination__faux:hover {
		border-color: var(--line);
		color: var(--muted);
		opacity: 0.45;
		transform: none;
	}

	.testi-carousel {
		margin-top: 8px;
	}

	.testi-carousel-row {
		display: flex;
		flex-direction: row;
		align-items: center;
		gap: 10px;
	}

	.testi-carousel-viewport {
		flex: 1;
		min-width: 0;
		overflow: hidden;
		outline: none;
	}

	.testi-carousel-viewport:focus-visible {
		box-shadow: 0 0 0 2px var(--green);
		border-radius: 10px;
	}

	.testi-carousel .testi-track {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		gap: 18px;
		transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
		will-change: transform;
	}

	@media (prefers-reduced-motion: reduce) {
		.testi-carousel .testi-track {
		transition-duration: 0.01ms;
		}
	}

	.testi-nav {
		flex-shrink: 0;
		width: 44px;
		height: 44px;
		border-radius: 50%;
		border: 1px solid var(--line-strong);
		background: var(--bg2);
		color: var(--heading);
		cursor: pointer;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 0;
		transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, opacity 0.2s ease;
		-webkit-tap-highlight-color: transparent;
	}

	.testi-nav:hover:not(:disabled) {
		border-color: var(--green-border);
		background: var(--green-dim);
		color: var(--green-strong);
	}

	.testi-nav:disabled {
		opacity: 0.35;
		cursor: not-allowed;
	}

	.testi-nav svg {
		width: 22px;
		height: 22px;
	}

	@media (max-width: 719px) {
		.testi-carousel-row {
		flex-wrap: wrap;
		gap: 14px;
		justify-content: center;
		}

		.testi-carousel-viewport {
		flex: 1 1 100%;
		width: 100%;
		order: 1;
		}

		.testi-nav-prev,
		.testi-nav-next {
		order: 2;
		}

		.testi-nav {
		width: 40px;
		height: 40px;
		}

		.testi-nav svg {
		width: 20px;
		height: 20px;
		}
	}

	.testi-card {
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		padding: 22px;
		transition: border-color .25s ease, box-shadow .25s ease;
		display: flex;
		flex-direction: column;
		box-shadow: var(--card-shadow);
		box-sizing: border-box;
		min-width: 0;
	}

	@media (hover: hover) and (pointer: fine) {
		.testi-card:hover {
		border-color: var(--line-strong);
		transform: translateY(-4px);
		}

		.testi-card {
		transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
		}
	}

	.testi-stars {
		color: var(--amber);
		font-size: .85rem;
		margin-bottom: 12px;
	}

	.testi-text {
		font-size: .9rem;
		color: var(--text);
		line-height: 1.7;
		margin-bottom: 16px;
		font-style: italic;
	}

	.testi-author {
		display: flex;
		align-items: center;
		gap: 12px;
		margin-top: auto;
	}

	.testi-avatar {
		width: 38px;
		height: 38px;
		border-radius: 50%;
		background: var(--green-dim);
		border: 2px solid var(--green-border);
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: 800;
		color: var(--testi-avatar-color);
		font-size: .85rem;
	}

	.testi-name {
		font-weight: 700;
		color: var(--heading);
		font-size: .87rem;
	}

	.testi-role {
		font-size: .78rem;
		color: var(--muted);
	}

	.cta-block {
		background: var(--cta-block-bg);
		border: 1px solid var(--green-border);
		border-radius: 24px;
		padding: 52px 32px;
		text-align: center;
		box-shadow: var(--cta-block-shadow);
	}

	.cta-block h2 {
		font-size: clamp(1.55rem, 4vw, 2.1rem);
		font-weight: 800;
		color: var(--heading);
		margin-bottom: 12px;
		line-height: 1.3;
	}

	.cta-block .cta-sub {
		color: var(--text);
		max-width: 580px;
		margin: 0 auto 22px;
		font-size: .97rem;
		line-height: 1.75;
	}

	.cta-block--contact-form {
		max-width: 640px;
		margin-left: auto;
		margin-right: auto;
	}

	.cta-block--contact-form .contact-form {
		text-align: left;
		margin-top: 8px;
	}

	.contact-form-notice {
		max-width: 100%;
		margin: 0 auto 18px;
		padding: 12px 16px;
		border-radius: var(--radius);
		font-size: .9rem;
		font-weight: 600;
		line-height: 1.45;
	}

	.contact-form-notice--success {
		background: var(--green-dim);
		color: var(--green-strong);
		border: 1px solid var(--green-border);
	}

	.contact-form-notice--error {
		background: rgba(220, 53, 69, 0.08);
		color: #b02a37;
		border: 1px solid rgba(220, 53, 69, 0.35);
	}

	html[data-theme="dark"] .contact-form-notice--error {
		background: rgba(248, 113, 113, 0.1);
		color: #fca5a5;
		border-color: rgba(248, 113, 113, 0.35);
	}

	.contact-form-hp {
		position: absolute;
		left: -9999px;
		width: 1px;
		height: 1px;
		overflow: hidden;
		margin: 0;
		padding: 0;
		border: 0;
		clip: rect(0, 0, 0, 0);
	}

	.contact-form__row {
		margin-bottom: 16px;
	}

	.contact-form__row--half {
		display: grid;
		gap: 16px;
	}

	@media (min-width: 560px) {
		.contact-form__row--half {
		grid-template-columns: 1fr 1fr;
		}
	}

	.contact-form__label {
		display: block;
		font-size: .82rem;
		font-weight: 700;
		color: var(--heading);
		margin-bottom: 6px;
	}

	.contact-form__req {
		color: var(--green-strong);
	}

	.contact-form__input,
	.contact-form__textarea {
		width: 100%;
		box-sizing: border-box;
		padding: 12px 14px;
		border-radius: var(--radius);
		border: 1px solid var(--line);
		background: var(--bg2);
		color: var(--heading);
		font-family: var(--font);
		font-size: .9rem;
		transition: outline .15s ease, border-color .15s ease;
	}

	.contact-form__textarea {
		min-height: 120px;
		resize: vertical;
	}

	.contact-form__input::placeholder,
	.contact-form__textarea::placeholder {
		color: var(--muted);
		opacity: 0.85;
	}

	.contact-form__input:focus,
	.contact-form__textarea:focus {
		outline: 2px solid var(--green);
		outline-offset: 0;
		border-color: var(--green-border);
	}

	.contact-form__actions {
		margin-top: 20px;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		gap: 10px;
	}

	.contact-form__row--recaptcha {
		display: flex;
		justify-content: center;
	}

	.contact-form__row--recaptcha .g-recaptcha {
		display: inline-block;
	}

	.cta-below {
		font-size: .8rem;
		color: var(--muted);
		margin-top: 18px;
		display: block;
	}

	/* CTA cuối trang danh mục (san-pham / danh-muc/*) */
	.product-outro {
		padding: 48px 0 64px;
		background: var(--bg);
	}

	.product-outro__card {
		position: relative;
		overflow: hidden;
		border-radius: 24px;
		border: 1px solid var(--green-border);
		background: var(--cta-block-bg);
		box-shadow: var(--cta-block-shadow);
	}

	.product-outro__glow {
		position: absolute;
		width: 420px;
		height: 420px;
		top: -180px;
		right: -120px;
		border-radius: 50%;
		background: radial-gradient(circle at 40% 40%, rgba(0, 230, 118, .22), transparent 68%);
		pointer-events: none;
	}

	html[data-theme="dark"] .product-outro__glow {
		background: radial-gradient(circle at 40% 40%, rgba(0, 230, 118, .14), transparent 70%);
	}

	.product-outro__grid {
		position: relative;
		display: grid;
		gap: 28px;
		padding: 40px 28px 44px;
		align-items: start;
		z-index: 1;
	}

	@media (min-width: 880px) {
		.product-outro__grid {
		grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
		gap: 36px;
		padding: 48px 44px 52px;
		}
	}

	.product-outro__pretitle {
		text-align: left;
		margin-bottom: 10px;
	}

	.product-outro__main h2 {
		font-size: clamp(1.45rem, 3.5vw, 2rem);
		font-weight: 800;
		color: var(--heading);
		line-height: 1.28;
		margin: 0 0 14px;
		text-align: left;
	}

	.product-outro__lead {
		margin: 0 0 20px;
		font-size: .96rem;
		line-height: 1.72;
		color: var(--text);
		text-align: left;
		max-width: 540px;
	}

	.product-outro__checks {
		list-style: none;
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
		gap: 12px;
		max-width: 520px;
	}

	.product-outro__checks li {
		position: relative;
		padding-left: 1.35rem;
		font-size: .88rem;
		line-height: 1.55;
		color: var(--muted);
	}

	.product-outro__checks li::before {
		content: '';
		position: absolute;
		left: 0;
		top: .45em;
		width: .48rem;
		height: .48rem;
		border-radius: 50%;
		background: linear-gradient(135deg, var(--green), rgba(0, 176, 155, .85));
		box-shadow: 0 0 0 2px rgba(0, 230, 118, .2);
	}

	.product-outro__aside {
		border-radius: 18px;
		border: 1px solid var(--line);
		background: var(--bg2);
		padding: 22px 22px 20px;
		box-shadow: var(--card-shadow);
    text-align: center;
	}

	.product-outro__aside-kicker {
		margin: 0 0 14px;
		font-size: .72rem;
		font-weight: 800;
		letter-spacing: .08em;
		text-transform: uppercase;
		color: var(--green);
	}

	.product-outro__cta.hero-cta {
		margin-bottom: 0;
		align-items: stretch;
	}

	@media (min-width: 520px) {
		.product-outro__cta.hero-cta {
		flex-direction: column;
		align-items: stretch;
		}
	}

	.product-outro__cta .btn-big {
		width: 100%;
		justify-content: center;
	}

	.product-outro__meta {
		margin: 16px 0 0;
		font-size: .82rem;
		color: var(--muted);
		line-height: 1.5;
	}

	.product-outro__meta a {
		color: var(--green);
		font-weight: 600;
		text-decoration: none;
	}

	.product-outro__meta a:hover {
		text-decoration: underline;
	}

	.product-outro__back {
		display: inline-block;
		margin-top: 14px;
		font-size: .82rem;
		font-weight: 600;
		color: var(--muted);
		text-decoration: none;
		transition: color .2s ease;
	}

	.product-outro__back:hover {
		color: var(--green);
	}

	@media (max-width: 639px) {
		.product-outro {
		padding: 36px 0 52px;
		}

		.product-outro__grid {
		padding: 28px 18px 32px;
		}
	}

	.newsletter-section {
		background: var(--bg3);
	}

	.newsletter-panel {
		max-width: 600px;
		margin: 0 auto;
		text-align: center;
	}

	.newsletter-panel h3 {
		font-size: clamp(1.35rem, 3vw, 1.75rem);
		font-weight: 800;
		color: var(--heading);
		margin-bottom: 10px;
	}

	.newsletter-panel>p {
		color: var(--muted);
		font-size: .95rem;
		margin-bottom: 22px;
	}

	.newsletter-form {
		display: flex;
		flex-direction: column;
		gap: 10px;
	}

	@media (min-width: 520px) {
		.newsletter-form {
		flex-direction: row;
		}
	}

	.newsletter-form input {
		flex: 1;
		min-width: 0;
		padding: 14px 18px;
		border-radius: 100px;
		border: 1px solid var(--line);
		background: var(--bg2);
		color: var(--heading);
		font-family: var(--font);
		font-size: .9rem;
	}

	.newsletter-form input::placeholder {
		color: var(--muted);
	}

	.newsletter-form input:focus {
		outline: 2px solid var(--green);
		outline-offset: 0;
	}

	.newsletter-form input:-webkit-autofill,
	.newsletter-form input:-webkit-autofill:hover,
	.newsletter-form input:-webkit-autofill:focus {
		-webkit-text-fill-color: var(--heading);
		caret-color: var(--heading);
		-webkit-box-shadow: 0 0 0 1000px var(--bg2) inset;
		box-shadow: 0 0 0 1000px var(--bg2) inset;
		transition: background-color 99999s ease-out 0s;
	}

	.newsletter-hint {
		font-size: .75rem;
		color: var(--muted);
		margin-top: 14px;
	}

	footer {
		border-top: 1px solid var(--line);
		padding: 44px clamp(18px, 4vw, 28px) 32px;
		text-align: center;
		color: var(--muted);
		font-size: .85rem;
		background: var(--bg2);
	}

	footer .logo {
		justify-content: center;
		margin-bottom: 12px;
		display: inline-flex;
	}

	.footer-desc {
		max-width: 480px;
		margin: 0 auto 20px;
		line-height: 1.65;
		font-size: .88rem;
	}

	.footer-grid {
		display: grid;
		grid-template-columns: 1fr;
		gap: 28px;
		max-width: 1140px;
		margin: 28px auto 0;
		text-align: left;
	}

	@media (min-width: 700px) {
		.footer-grid {
		grid-template-columns: repeat(2, 1fr);
		}
	}

	@media (min-width: 1024px) {
		.footer-grid {
		grid-template-columns: repeat(4, 1fr);
		}
	}

	.footer-col h4 {
		color: var(--heading);
		font-size: .9rem;
		font-weight: 800;
		margin-bottom: 14px;
	}

	.footer-col ul {
		list-style: none;
	}

	.footer-col li {
		margin-bottom: 10px;
	}

	.footer-col a {
		color: var(--muted);
		text-decoration: none;
		font-size: .86rem;
		font-weight: 500;
	}

	.footer-col a:hover {
		color: var(--footer-link);
	}

	.footer-social {
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		margin-top: 16px;
	}

	.footer-col .footer-social a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 40px;
		border-radius: 10px;
		background: var(--surface);
		border: 1px solid var(--line);
		color: var(--muted);
		transition: border-color .2s, background .2s, color .2s, transform .15s;
	}

	.footer-col .footer-social a:hover {
		border-color: var(--green-border);
		background: var(--green-dim);
		color: var(--green);
		transform: translateY(-2px);
	}

	.footer-col .footer-social a svg {
		width: 20px;
		height: 20px;
		flex-shrink: 0;
	}

	.footer-bottom {
		margin-top: 32px;
		padding-top: 24px;
		border-top: 1px solid var(--line);
		text-align: center;
		max-width: 1140px;
		margin-left: auto;
		margin-right: auto;
		font-size: .8rem;
	}

	#nav-panel {
		display: none;
		position: fixed;
		top: var(--header-offset);
		left: 0;
		right: 0;
		bottom: 0;
		background: var(--nav-panel-scrim);
		z-index: 998;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}

	#nav-panel.open {
		display: block;
	}

	.panel-links {
		margin: 0 auto;
	}

	.panel-sheet {
		background: var(--nav-mobile-elevated);
		overflow: hidden;
	}

	html[data-theme="dark"] .panel-sheet {
		box-shadow: 0 8px 40px rgba(0, 0, 0, .45);
		border-bottom: 1px solid rgba(255, 255, 255, .06);
	}

	/* Nav chữ / icon trên nền tối: đủ tương phản; hover giữ token xanh */
	html[data-theme="dark"] .nav-links>a,
	html[data-theme="dark"] .nav-dd-trigger {
		color: #9ca3af;
	}

	html[data-theme="dark"] .nav-links>a:hover,
	html[data-theme="dark"] .nav-item-dd:hover .nav-dd-trigger,
	html[data-theme="dark"] .nav-item-dd:focus-within .nav-dd-trigger,
	html[data-theme="dark"] .nav-dd-open .nav-dd-trigger {
		color: var(--green);
	}

	html[data-theme="dark"] .nav-dd-panel a {
		color: #9ca3af;
	}

	html[data-theme="dark"] .nav-dd-panel .nav-submenu-icon {
		color: #9ca3af;
		opacity: 1;
	}

	html[data-theme="dark"] .nav-dd-panel a:hover {
		color: var(--green-strong);
	}

	html[data-theme="dark"] .nav-dd-panel a:hover .nav-submenu-icon {
		color: var(--green-strong);
	}

	html[data-theme="dark"] .nav-dd-trigger.is-active {
		color: var(--green);
	}

	html[data-theme="dark"] .nav-links a.is-active,
	html[data-theme="dark"] .nav-links a[aria-current="page"] {
		color: var(--green);
	}

	html[data-theme="dark"] .nav-dd-panel a.is-active,
	html[data-theme="dark"] .nav-dd-panel a[aria-current="page"] {
		background: rgba(0, 200, 83, 0.12);
		color: var(--green-strong);
	}

	html[data-theme="dark"] .nav-dd-panel a.is-active .nav-submenu-icon,
	html[data-theme="dark"] .nav-dd-panel a[aria-current="page"] .nav-submenu-icon {
		color: var(--green-strong);
	}

	html[data-theme="dark"] .panel-sublink {
		color: #9ca3af;
	}

	html[data-theme="dark"] .theme-toggle {
		border-color: rgba(255, 255, 255, .12);
		background: rgba(255, 255, 255, .04);
	}

	html[data-theme="dark"] .menu-btn {
		background: linear-gradient(165deg, var(--bg3), var(--surface));
	}

	.panel-sheet>*+* {
		border-top: 1px solid var(--line);
	}

	.panel-toplink {
		display: flex;
		align-items: center;
		padding: 15px 18px;
		color: var(--heading);
		text-decoration: none;
		font-weight: 600;
		font-size: .93rem;
		line-height: 1.35;
		transition: background .15s ease, color .15s ease;
		-webkit-tap-highlight-color: transparent;
	}

	.panel-toplink:active {
		background: var(--green-dim);
	}

	.panel-toplink--accent {
		background: linear-gradient(90deg, var(--green-dim), transparent 55%);
		color: var(--green-strong);
		font-weight: 600;
	}

	.panel-toplink.is-active,
	.panel-toplink[aria-current="page"] {
		color: var(--green);
		background: var(--green-dim);
	}

	.panel-toplink--accent.is-active,
	.panel-toplink--accent[aria-current="page"] {
		background: linear-gradient(90deg, var(--green-dim), var(--surface) 45%);
		color: var(--green-strong);
	}

	html[data-theme="dark"] .panel-toplink--accent {
		color: var(--green);
	}

	html[data-theme="dark"] .panel-toplink.is-active,
	html[data-theme="dark"] .panel-toplink[aria-current="page"] {
		color: var(--green);
		background: rgba(0, 200, 83, 0.1);
	}

	html[data-theme="dark"] .panel-summary.is-active {
		color: var(--green);
	}

	.panel-disclosure {
		margin: 0;
	}

	.panel-summary {
		list-style: none;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 15px 18px;
		font-weight: 600;
		font-size: .93rem;
		color: var(--heading);
		cursor: pointer;
		user-select: none;
		transition: background .18s ease;
		-webkit-tap-highlight-color: transparent;
	}

	.panel-summary::-webkit-details-marker {
		display: none;
	}

	.panel-summary:hover {
		background: var(--surface);
	}

	.panel-disclosure[open] .panel-summary {
		background: var(--surface);
		border-bottom: 1px solid var(--line);
	}

	.panel-summary.is-active {
		color: var(--green);
	}

	.panel-chevron {
		width: 20px;
		height: 20px;
		flex-shrink: 0;
		opacity: .55;
		color: var(--muted);
		transition: transform .28s cubic-bezier(0.4, 0, 0.2, 1), opacity .2s;
	}

	.panel-disclosure[open] .panel-chevron {
		transform: rotate(180deg);
		opacity: .85;
		color: var(--green);
	}

	.panel-nested {
		display: flex;
		flex-direction: column;
		padding: 6px 0 10px;
		background: var(--bg);
	}

	.panel-sublink {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 11px 16px 11px 20px;
		margin: 0 8px;
		border-radius: 10px;
		border-left: 3px solid transparent;
		color: var(--muted);
		text-decoration: none;
		font-weight: 500;
		font-size: .86rem;
		line-height: 1.4;
		transition: background .15s ease, color .15s ease, border-color .15s ease;
		-webkit-tap-highlight-color: transparent;
	}

	.panel-sublink:active {
		background: var(--green-dim);
		color: var(--green);
		border-left-color: var(--green);
	}

	.panel-sublink.is-active,
	.panel-sublink[aria-current="page"] {
		background: var(--green-dim);
		color: var(--green-strong);
		border-left-color: var(--green);
	}

	.panel-sublink.is-active .nav-submenu-icon,
	.panel-sublink[aria-current="page"] .nav-submenu-icon {
		color: var(--green-strong);
		opacity: 1;
	}

	html[data-theme="dark"] .panel-sublink.is-active,
	html[data-theme="dark"] .panel-sublink[aria-current="page"] {
		background: rgba(0, 200, 83, 0.12);
		color: var(--green-strong);
	}

	@media (hover: hover) {
		.panel-toplink:hover {
		background: var(--surface);
		}

		.panel-toplink--accent:hover {
		background: linear-gradient(90deg, var(--green-dim), var(--surface) 60%);
		color: var(--green);
		}

		html[data-theme="dark"] .panel-toplink--accent:hover {
		color: var(--green-strong);
		}

		.panel-sublink:hover {
		background: var(--green-dim);
		color: var(--green);
		border-left-color: var(--green);
		}
	}

	@media (max-width: 680px) {
		section {
		padding: 56px 0;
		}

		.hero {
		padding: 56px 0 40px;
		-webkit-mask-image: none;
		mask-image: none;
		}

		.process-list {
		--process-num-size: 48px;
		}

		.process-item {
		grid-template-columns: 48px 1fr;
		gap: 16px;
		padding: 22px 0;
		}

		.step-index {
		width: 48px;
		height: 48px;
		font-size: .8rem;
		}

		.cta-block {
		padding: 36px 20px;
		}

		.process-cta {
		padding: 22px 18px;
		}
	}

	/* —— Trang con (inner) —— */
	.page-hero {
		padding: 52px 0 40px;
		text-align: center;
		background: var(--bg2);
		border-bottom: 1px solid var(--line);
	}

	.page-hero h1 {
		font-size: clamp(1.65rem, 4vw, 2.25rem);
		font-weight: 800;
		color: var(--heading);
		line-height: 1.25;
		margin: 14px 0 16px;
		max-width: 800px;
		margin-left: auto;
		margin-right: auto;
	}

	.page-hero h1 em {
		font-style: normal;
		background: linear-gradient(135deg, #00e676, #00b09b);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		background-clip: text;
	}

	.page-hero .page-lead {
		font-size: 1rem;
		color: var(--muted);
		max-width: 680px;
		margin: 0 auto;
		line-height: 1.65;
	}

	.page-main {
		padding: 48px 0 64px;
	}

	.page-prose {
		max-width: 720px;
		margin: 0 auto;
		color: var(--text);
		font-size: .95rem;
		line-height: 1.75;
	}

	.page-prose h2 {
		font-size: 1.15rem;
		font-weight: 800;
		color: var(--heading);
		margin: 2rem 0 0.75rem;
	}

	.page-prose h2:first-child {
		margin-top: 0;
	}

	.page-prose p {
		margin-bottom: 1rem;
	}

	.page-prose ul {
		margin: 0.5rem 0 1rem 1.25rem;
	}

	.page-prose li {
		margin-bottom: 0.45rem;
	}

	.page-prose.legal-doc {
		max-width: 800px;
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: 16px;
		padding: clamp(1.25rem, 4vw, 2.25rem);
		box-shadow: var(--card-shadow), 0 20px 48px rgba(15, 23, 42, .035);
		position: relative;
	}

	html[data-theme="dark"] .page-prose.legal-doc {
		box-shadow: 0 0 0 1px var(--line), 0 28px 56px rgba(0, 0, 0, .38);
	}

	.legal-content {
		position: relative;
		background-color: var(--bg2);
	}

	html[data-theme="dark"] .legal-content {
		background-image:
		radial-gradient(ellipse 75% 48% at 25% 0%, rgba(0, 230, 118, .07) 0%, transparent 52%),
		radial-gradient(ellipse 50% 36% at 95% 60%, rgba(251, 191, 36, .06) 0%, transparent 48%),
		linear-gradient(180deg, #090d14 0%, var(--bg) 32%, var(--bg-alt) 100%);
	}

	.legal-sibling-nav {
		margin-top: 2.25rem;
		padding-top: 1.75rem;
		border-top: 1px solid var(--line);
	}

	.legal-sibling-nav__label {
		display: block;
		font-size: 0.68rem;
		font-weight: 800;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--muted);
		margin-bottom: 0.9rem;
	}

	.legal-sibling-nav__list {
		list-style: none;
		margin: 0 !important;
		padding: 0;
		display: flex;
		flex-wrap: wrap;
		gap: 0.5rem;
	}

	.legal-sibling-nav__list a {
		display: inline-flex;
		align-items: center;
		padding: 0.48rem 1rem;
		font-size: 0.875rem;
		font-weight: 600;
		color: var(--text);
		text-decoration: none;
		border-radius: 999px;
		border: 1px solid var(--line);
		background: var(--surface);
		transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
	}

	.legal-sibling-nav__list a:hover {
		border-color: var(--green-border);
		color: var(--green-strong);
		background: var(--green-dim);
	}

	.legal-sibling-nav__list a:focus-visible {
		outline: 2px solid var(--green);
		outline-offset: 2px;
	}

	.legal-sibling-nav__list a[aria-current="page"] {
		border-color: var(--green-border);
		color: var(--green-strong);
		background: var(--green-dim);
		box-shadow: 0 0 0 1px var(--green-dim);
	}

	.page-cta-row {
		margin-top: 2.5rem;
		padding-top: 2rem;
		border-top: 1px solid var(--line);
		display: flex;
		flex-wrap: wrap;
		gap: 12px;
		align-items: center;
		justify-content: center;
	}

	/* Pain cards — cùng cấu trúc ebook (pain-grid / pain-card / icon-wrap) */
	.pain-grid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
		margin-top: 28px;
		margin-inline: auto;
		max-width: 930px;
		align-items: stretch;
	}

	.pain-grid > .pain-card {
		height: 100%;
	}

	@media (max-width: 700px) {
		.pain-grid {
		grid-template-columns: 1fr;
		}
	}

	.pain-card {
		background: var(--bg2);
		border: 1px solid var(--pain-border);
		border-left: 3px solid var(--red);
		border-radius: var(--radius);
		padding: 22px 24px;
		display: flex;
		gap: 16px;
		align-items: flex-start;
		transition: transform 0.25s ease, border-color 0.25s ease;
		box-shadow: var(--card-shadow);
	}

	.pain-card > div:not(.icon-wrap) {
		flex: 1;
		min-width: 0;
	}

	.pain-card:hover,
	.pain-card:focus-within {
		border-color: var(--pain-border-hover);
		transform: translateY(-4px);
	}

	@media (prefers-reduced-motion: reduce) {
		.pain-card,
		.pain-card:hover,
		.pain-card:focus-within {
		transition: none;
		transform: none;
		}
	}

	.pain-card .icon-wrap {
		width: 36px;
		height: 36px;
		border-radius: 10px;
		background: var(--red-dim);
		border: 1px solid var(--pain-ico-border);
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1.1rem;
		line-height: 1;
		flex-shrink: 0;
		margin-top: 2px;
	}

	.pain-card .icon-wrap.icon-wrap--number {
		font-size: 0.68rem;
		font-weight: 800;
		color: var(--red);
		letter-spacing: 0.05em;
	}

	.pain-card h3 {
		font-size: 1rem;
		font-weight: 700;
		color: var(--heading);
		margin: 0 0 6px;
		line-height: 1.35;
	}

	.pain-card p {
		font-size: 0.87rem;
		color: var(--muted);
		line-height: 1.65;
		margin: 0;
	}

	.testimonial-grid {
		display: grid;
		gap: 16px;
		grid-template-columns: 1fr;
	}

	@media (min-width: 900px) {
		.testimonial-grid {
		grid-template-columns: repeat(3, 1fr);
		}
	}

	.pricing-grid {
		display: grid;
		gap: 20px;
		grid-template-columns: 1fr;
		align-items: stretch;
		max-width: 1120px;
		margin: 0 auto;
	}

	@media (min-width: 768px) {
		.pricing-grid {
		grid-template-columns: repeat(3, 1fr);
		}
	}

	.price-card {
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		padding: 26px 22px;
		display: flex;
		flex-direction: column;
		box-shadow: var(--card-shadow);
		position: relative;
	}

	.price-card.featured {
		border-color: var(--green-border);
		box-shadow: 0 0 0 1px var(--green-border), var(--card-shadow);
		background: linear-gradient(165deg, var(--bg2) 0%, rgba(0, 200, 83, .06) 100%);
	}

	.price-card .price-badge {
		display: inline-block;
		font-size: .68rem;
		font-weight: 800;
		text-transform: uppercase;
		letter-spacing: .06em;
		color: var(--amber);
		margin-bottom: 10px;
	}

	.price-card h3 {
		font-size: 1.1rem;
		font-weight: 800;
		color: var(--heading);
		margin: 0 0 8px;
	}

	.price-card .price-amount {
		font-size: 1.5rem;
		font-weight: 900;
		color: var(--green);
		margin-bottom: 6px;
	}

	.price-card .price-note {
		font-size: .82rem;
		color: var(--muted);
		margin-bottom: 16px;
		line-height: 1.5;
	}

	.price-card ul {
		list-style: none;
		margin: 0 0 20px;
		padding: 0;
		flex: 1;
	}

	.price-card li {
		font-size: .85rem;
		color: var(--text);
		padding: 8px 0 8px 22px;
		position: relative;
		border-bottom: 1px solid var(--line);
	}

	.price-card li:last-child {
		border-bottom: none;
	}

	.price-card li::before {
		content: '';
		position: absolute;
		left: 0;
		top: 14px;
		width: 7px;
		height: 7px;
		border-radius: 50%;
		background: var(--green);
		opacity: .85;
	}

	.price-card .btn {
		width: 100%;
		justify-content: center;
		margin-top: auto;
	}

	.faq-accordion {
		max-width: 800px;
		margin: 0 auto;
		display: flex;
		flex-direction: column;
		gap: 10px;
	}

	.faq-accordion details {
		background: var(--bg2);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		overflow: hidden;
		box-shadow: var(--card-shadow);
	}

	.faq-accordion summary {
		list-style: none;
		cursor: pointer;
		padding: 16px 44px 16px 18px;
		font-weight: 700;
		font-size: .92rem;
		color: var(--heading);
		position: relative;
	}

	.faq-accordion summary::-webkit-details-marker {
		display: none;
	}

	.faq-accordion summary::after {
		content: '';
		position: absolute;
		right: 18px;
		top: 50%;
		width: 8px;
		height: 8px;
		border-right: 2px solid var(--muted);
		border-bottom: 2px solid var(--muted);
		transform: translateY(-60%) rotate(45deg);
		transition: transform .2s ease;
	}

	.faq-accordion details[open] summary::after {
		transform: translateY(-30%) rotate(225deg);
	}

	.faq-accordion .faq-a {
		padding: 0 18px 16px;
		font-size: .88rem;
		color: var(--muted);
		line-height: 1.65;
		border-top: 1px solid var(--line);
		margin: 0;
		padding-top: 12px;
	}

	.faq-accordion details[open] .faq-a {
		padding-top: 14px;
	}

	/* —— Dark mode: card & khối nổi (tách khỏi section nền bg2), FAQ, biểu đồ blog —— */
	html[data-theme="dark"] .offer-card:not(.featured) {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
		box-shadow: var(--surface-raised-shadow);
	}

	html[data-theme="dark"] .offer-card.featured {
		background: var(--offer-featured-bg);
		border-color: var(--green-border);
		box-shadow: 0 0 0 1px var(--green-border), 0 12px 36px rgba(0, 0, 0, .32);
	}

	html[data-theme="dark"] .price-card:not(.featured) {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
		box-shadow: var(--surface-raised-shadow);
	}

	html[data-theme="dark"] .price-card.featured {
		background: linear-gradient(165deg, var(--surface-raised) 0%, rgba(0, 230, 118, .1) 100%);
		border-color: var(--green-border);
		box-shadow: 0 0 0 1px var(--green-border), 0 12px 36px rgba(0, 0, 0, .3);
	}

	html[data-theme="dark"] a.blog-post-card {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
		box-shadow: var(--surface-raised-shadow);
	}

	html[data-theme="dark"] .stat-cell {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
		box-shadow: var(--surface-raised-shadow);
	}

	html[data-theme="dark"] .testi-card {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
		box-shadow: var(--surface-raised-shadow);
	}

	html[data-theme="dark"] .product-card {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
		box-shadow: var(--surface-raised-shadow);
	}

	html[data-theme="dark"] .blog-figure {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
		box-shadow: var(--surface-raised-shadow);
	}

	html[data-theme="dark"] .blog-figure__bar--2 {
		background-image: linear-gradient(105deg, var(--amber-dim) 0%, rgba(251, 191, 36, .14) 100%);
	}

	html[data-theme="dark"] .faq-accordion details {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
		box-shadow: var(--surface-raised-shadow);
	}

	html[data-theme="dark"] .faq-accordion summary::after {
		border-right-color: #9ca3af;
		border-bottom-color: #9ca3af;
	}

	html[data-theme="dark"] .faq-accordion .faq-a {
		color: #9ca3af;
	}

	html[data-theme="dark"] .product-detail-explore-card:not(.product-detail-explore-card--accent) {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
		box-shadow: var(--surface-raised-shadow);
	}

	html[data-theme="dark"] .product-detail-mini-faq details {
		background: rgba(255, 255, 255, .055);
		border-color: var(--line);
	}

	html[data-theme="dark"] .tag-amber {
		color: #fde68a;
		border-color: rgba(251, 191, 36, .4);
	}

	html[data-theme="dark"] .newsletter-form input {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
	}

	html[data-theme="dark"] .newsletter-form input:-webkit-autofill,
	html[data-theme="dark"] .newsletter-form input:-webkit-autofill:hover,
	html[data-theme="dark"] .newsletter-form input:-webkit-autofill:focus {
		-webkit-box-shadow: 0 0 0 1000px var(--surface-raised) inset;
		box-shadow: 0 0 0 1000px var(--surface-raised) inset;
	}

	html[data-theme="dark"] .contact-form__input,
	html[data-theme="dark"] .contact-form__textarea {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
		box-shadow: var(--surface-raised-shadow);
	}

	html[data-theme="dark"] .contact-form__input:-webkit-autofill,
	html[data-theme="dark"] .contact-form__textarea:-webkit-autofill,
	html[data-theme="dark"] .contact-form__input:-webkit-autofill:hover,
	html[data-theme="dark"] .contact-form__textarea:-webkit-autofill:hover,
	html[data-theme="dark"] .contact-form__input:-webkit-autofill:focus,
	html[data-theme="dark"] .contact-form__textarea:-webkit-autofill:focus {
		-webkit-text-fill-color: var(--heading);
		caret-color: var(--heading);
		-webkit-box-shadow: 0 0 0 1000px var(--surface-raised) inset;
		box-shadow: 0 0 0 1000px var(--surface-raised) inset;
		transition: background-color 99999s ease-out 0s;
	}

	html[data-theme="dark"] .testi-nav:not(:disabled) {
		background: var(--surface-raised);
		border-color: var(--surface-raised-border);
	}

	/* —— Utilities: thay cho inline style trên HTML tĩnh —— */
	.section-surface-alt {
		background: var(--bg2);
	}

	.section-surface-gradient {
		background: linear-gradient(180deg, var(--bg) 0%, var(--bg2) 100%);
	}

	.section-cta {
		padding: 48px 0;
	}

	.section-cta--extended {
		padding: 48px 0 56px;
	}

	.section-label--mb8 {
		margin-bottom: 8px;
	}

	.hero-cta--mb0 {
		margin-bottom: 0;
	}

	.hero-note--mb20 {
		margin-bottom: 20px;
	}

	.cta-below a {
		color: var(--footer-link);
		font-weight: 700;
	}

	.centered-block-spacing {
		text-align: center;
		margin-top: 28px;
	}

	.btn-nowrap {
		white-space: nowrap;
	}

	.tracking-pixel {
		display: none;
	}

	.btn-full-center {
		width: 100%;
		justify-content: center;
	}

	.contact-hours {
		margin-top: 8px;
		font-size: 0.88rem;
		color: var(--muted);
	}

	.blog-figure__bar--w92 {
		width: 92%;
	}

	.blog-figure__bar--w76 {
		width: 76%;
	}

	.blog-figure__bar--w64 {
		width: 64%;
	}

	/* WordPress: featured images in blog cards */
	.blog-post-card__media img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}

	.back-to-top {
		position: fixed;
		right: max(16px, env(safe-area-inset-right, 0px));
		bottom: max(18px, env(safe-area-inset-bottom, 0px));
		z-index: 960;
		width: 48px;
		height: 48px;
		padding: 0;
		margin: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		border: 1px solid var(--green-border);
		border-radius: 50%;
		background: var(--green-dim);
		color: var(--green-strong);
		box-shadow: var(--card-shadow);
		cursor: pointer;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translateY(10px);
		transition: opacity .28s ease, transform .28s ease, visibility .28s, background .2s ease, border-color .2s ease, color .2s ease;
		-webkit-tap-highlight-color: transparent;
	}

	.back-to-top.is-visible {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translateY(0);
	}

	.back-to-top:hover {
		background: var(--green-strong);
		color: #fff;
		border-color: var(--green-strong);
	}

	.back-to-top:focus-visible {
		outline: 2px solid var(--green);
		outline-offset: 3px;
	}

	.back-to-top__icon {
		display: flex;
		line-height: 0;
	}

	html[data-theme="dark"] .back-to-top {
		background: rgba(0, 230, 118, .12);
		color: var(--green);
		border-color: rgba(0, 230, 118, .35);
	}

	html[data-theme="dark"] .back-to-top:hover {
		background: var(--green);
		color: #06090f;
		border-color: var(--green);
	}

	@media (prefers-reduced-motion: reduce) {
		.back-to-top {
		transition: none;
		transform: none;
		}

		.back-to-top.is-visible {
		transform: none;
		}
	}

	/*
	 * ALTCommerce — trang Đăng nhập / Đăng ký / Tài khoản (shortcode)
	 * Đồng bộ palette với theme; dark mode theo html[data-theme="dark"].
	 */
	html[data-theme="light"] {
		--altcommerce-color-primary: #00c853;
		--altcommerce-color-primary-hover: #00b248;
		--altcommerce-color-primary-active: #009940;
		--altcommerce-color-primary-strong: #047857;
		--altcommerce-color-primary-soft: #34d399;
		--altcommerce-color-primary-on-surface: #047857;
		--altcommerce-color-primary-surface: rgba(0, 200, 83, 0.12);
		--altcommerce-color-primary-rgb: 0, 200, 83;
	}

	html[data-theme="dark"] {
		--altcommerce-color-primary: #00e676;
		--altcommerce-color-primary-hover: #00c853;
		--altcommerce-color-primary-active: #69f0ae;
		--altcommerce-color-primary-strong: #6ee7b7;
		--altcommerce-color-primary-soft: #6ee7b7;
		--altcommerce-color-primary-on-surface: #00e676;
		--altcommerce-color-primary-surface: rgba(0, 230, 118, 0.15);
		--altcommerce-color-primary-rgb: 0, 230, 118;
	}

	/*
	 * ALTCommerce — trang Thanh toán (shortcode checkout)
	 * Đồng bộ nền, card, form, payment, QR — light/dark theo html[data-theme].
	 */
	.altcommerce-checkout-wrapper {
		font-family: var(--font);
	}

	.altcommerce-checkout-form,
	.altcommerce-checkout-payment {
		background: var(--bg2);
		color: var(--text);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		box-shadow: var(--card-shadow);
	}

	.altcommerce-checkout-field label,
	.altcommerce-checkout-field-label,
	.altcommerce-gateway-single-label {
		color: var(--heading);
	}

	.altcommerce-checkout-field--product-main > .altcommerce-checkout-field-label,
	.altcommerce-checkout-field--upsells > .altcommerce-checkout-field-label {
		color: var(--heading);
	}

	.altcommerce-checkout-product-card {
		background: var(--surface-raised);
		border-color: var(--line-strong);
		border-radius: var(--radius);
	}

	.altcommerce-checkout-product-card__img {
		border-color: var(--line);
		background: var(--surface);
	}

	.altcommerce-checkout-product-card__title {
		color: var(--heading);
	}

	.altcommerce-checkout-product-card__excerpt {
		color: var(--muted);
	}

	.altcommerce-price-current:only-child {
		color: var(--heading);
	}

	.altcommerce-price-regular {
		color: var(--muted);
	}

	.altcommerce-upsell-intro {
		color: var(--muted);
	}

	.altcommerce-upsell-card {
		background: var(--surface-raised);
		border-color: var(--line-strong);
		border-radius: var(--radius);
	}

	.altcommerce-upsell-card:hover {
		border-color: var(--green-border);
	}

	.altcommerce-upsell-card__label input.altcommerce-upsell-toggle {
		background-color: var(--surface-raised);
		border-color: var(--line-strong);
	}

	.altcommerce-upsell-card__img {
		border-color: var(--line);
	}

	.altcommerce-upsell-card__title {
		color: var(--heading);
	}

	.altcommerce-upsell-card__excerpt {
		color: var(--muted);
	}

	.altcommerce-checkout-field input[type="text"],
	.altcommerce-checkout-field input[type="tel"],
	.altcommerce-checkout-field input[type="number"],
	.altcommerce-checkout-field input[type="email"],
	.altcommerce-checkout-field input[type="password"],
	.altcommerce-checkout-field input[type="address"],
	.altcommerce-checkout-field textarea,
	.altcommerce-checkout-form select,
	#payment_gateway {
		background: var(--surface-raised);
		border: 1px solid var(--line-strong);
		border-radius: 10px;
		color: var(--text);
		font-family: var(--font);
	}

	.altcommerce-checkout-field input[type="text"]:focus,
	.altcommerce-checkout-field input[type="tel"]:focus,
	.altcommerce-checkout-field input[type="number"]:focus,
	.altcommerce-checkout-field input[type="email"]:focus,
	.altcommerce-checkout-field input[type="password"]:focus,
	.altcommerce-checkout-field input[type="address"]:focus,
	.altcommerce-checkout-field textarea:focus,
	.altcommerce-checkout-form select:focus,
	#payment_gateway:focus {
		outline: 2px solid var(--green);
    	outline-offset: 0;
	}

	.altcommerce-checkout-field textarea {
		min-height: 96px;
		padding: 10px 12px;
		resize: vertical;
	}

	.altcommerce-checkout-form select,
	#payment_gateway {
		padding: 8px 12px;
		min-height: 40px;
	}

	.altcommerce-checkout-field input::placeholder,
	.altcommerce-checkout-field textarea::placeholder {
		color: var(--muted);
		opacity: 0.9;
	}

	.altcommerce-checkout-field--member-logged-in {
		border-color: var(--green-border);
		background: var(--green-dim);
	}

	.altcommerce-checkout-field--member:not(.altcommerce-checkout-field--member-logged-in) {
		border-top-color: var(--line);
	}

	.altcommerce-checkout-field--member .altcommerce-checkout-field-desc {
		color: var(--muted);
	}

	.altcommerce-checkout-logged-in-email {
		color: var(--heading);
	}

	.altcommerce-checkout-logged-in-profile {
		border-bottom-color: var(--line);
		color: var(--muted);
	}

	.altcommerce-checkout-logged-in-profile-segment:not(:last-child)::after {
		color: var(--line-strong);
	}

	.altcommerce-checkout-logged-in-profile-label {
		color: var(--muted);
	}

	.altcommerce-checkout-logged-in-profile-value {
		color: var(--text);
	}

	.altcommerce-checkout-summary-row:not(:last-child) {
		border-bottom: 1px solid var(--line);
	}

	.altcommerce-checkout-summary-row {
		color: var(--text);
	}

	.altcommerce-checkout-summary-row--total {
		color: var(--heading);
	}

	.altcommerce-checkout-submit {
		background: linear-gradient(135deg, var(--green), #00b09b);
		color: #fff;
		border-radius: 100px;
		font-family: var(--font);
		font-weight: 700;
		box-shadow: var(--btn-primary-shadow);
		cursor: pointer;
		transition: box-shadow 0.2s ease, filter 0.2s ease;
	}

	.altcommerce-checkout-submit:hover {
		background: linear-gradient(135deg, var(--green), #00b09b);
		filter: brightness(1.06);
		box-shadow: var(--btn-primary-shadow-hover);
	}

	.altcommerce-checkout-submit:disabled {
		background: var(--surface);
		color: var(--muted);
		box-shadow: none;
		opacity: 0.75;
	}

	.altcommerce-checkout-payment h3 {
		color: var(--altcommerce-color-primary-on-surface);
		border-bottom-color: var(--altcommerce-color-primary);
	}

	.altcommerce-checkout-detail-row {
		border-bottom-color: var(--line);
		color: var(--text);
	}

	.altcommerce-checkout-status {
		color: var(--amber);
	}

	.altcommerce-checkout-status[data-status="paid"] {
		color: var(--green-strong);
	}

	html[data-theme="dark"] .altcommerce-checkout-status[data-status="paid"] {
		color: var(--green);
	}

	.altcommerce-checkout-status-note {
		color: var(--muted);
	}

	.altcommerce-checkout-status-note.paid {
		color: var(--green-strong);
	}

	html[data-theme="dark"] .altcommerce-checkout-status-note.paid {
		color: var(--green);
	}

	.altcommerce-gateway-sepay-qr-wrapper {
		background: var(--surface);
		border: 1px solid var(--line);
	}

	.altcommerce-gateway-sepay-qr-wrapper img {
		background: var(--bg2);
		border-color: var(--line);
	}

	.altcommerce-gateway-sepay-qr-instruction {
		color: var(--muted);
	}

	.altcommerce-gateway-instructions {
		background: var(--amber-dim);
		color: var(--amber);
		border: 1px solid var(--amber-border);
	}

	.altcommerce-checkout-error {
		background: var(--red-dim);
		color: var(--red);
		border: 1px solid var(--pain-border);
		border-radius: var(--radius);
	}

	.altcommerce-checkout-success {
		background: var(--green-dim);
		color: var(--green-strong);
		border: 1px solid var(--green-border);
		border-radius: var(--radius);
	}

	html[data-theme="dark"] .altcommerce-checkout-success {
		color: var(--green);
	}

	.altcommerce-checkout-loading {
		color: var(--muted);
	}

	.altcommerce-gateway-error {
		color: var(--red);
	}

	.altcommerce-checkout-secondary-link a {
		color: var(--heading);
	}

	.altcommerce-checkout-secondary-link a:hover {
		color: var(--altcommerce-color-primary-on-surface);
	}

	.altcommerce-checkout-form .altcommerce-password-toggle {
		color: var(--muted);
	}

	.altcommerce-checkout-form .altcommerce-password-toggle:hover {
		color: var(--heading);
		background: var(--surface);
	}

	.altcommerce-password-match-hint--ok {
		color: var(--green-strong);
	}

	html[data-theme="dark"] .altcommerce-password-match-hint--ok {
		color: var(--green);
	}

	.altcommerce-password-match-hint--bad {
		color: var(--red);
	}

	.altcommerce-password-match-hint--reason-length {
		border-left-color: var(--amber);
	}

	.altcommerce-password-match-hint--reason-mismatch {
		border-left-color: var(--red);
	}

	.altcommerce-member-auth-card,
	.altcommerce-account-layout {
		background: var(--bg2);
		color: var(--text);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		box-shadow: var(--card-shadow);
	}

	.altcommerce-member-auth-card {
		padding: clamp(20px, 4vw, 32px);
	}

	.altcommerce-member-shell {
		font-family: var(--font);
	}

	.altcommerce-member.altcommerce-member-account {
		font-family: var(--font);
	}

	.altcommerce-member-field label,
	.altcommerce-account-subheading,
	.altcommerce-member-account-heading {
		color: var(--heading);
	}

	.altcommerce-member-field .required {
		color: var(--red);
	}

	.altcommerce-member-field input[type="text"],
	.altcommerce-member-field input[type="tel"],
	.altcommerce-member-field input[type="email"],
	.altcommerce-member-field input[type="password"] {
		background: var(--surface-raised);
		border: 1px solid var(--line-strong);
		border-radius: 10px;
		color: var(--text);
		font-family: var(--font);
	}

	.altcommerce-member-field input[type="text"]:focus,
	.altcommerce-member-field input[type="tel"]:focus,
	.altcommerce-member-field input[type="number"]:focus,
	.altcommerce-member-field input[type="email"]:focus,
	.altcommerce-member-field input[type="password"]:focus,
	.altcommerce-member-field input[type="address"]:focus,
	.altcommerce-member-field textarea:focus,
	.altcommerce-member-field select:focus,
	#payment_gateway:focus {
		outline: 2px solid var(--green);
    	outline-offset: 0;
	}

	.altcommerce-member-field input::placeholder {
		color: var(--muted);
		opacity: 0.9;
	}

	.altcommerce-account-readonly {
		background: var(--surface);
		color: var(--muted);
		border-color: var(--line);
	}

	.altcommerce-member-field textarea {
		background: var(--surface-raised);
		border: 1px solid var(--line-strong);
		border-radius: 10px;
		color: var(--text);
		font-family: var(--font);
	}

	.altcommerce-account-layout__sidebar .altcommerce-account-nav__list {
		background: var(--surface);
		border: 1px solid var(--line);
		border-radius: var(--radius);
	}

	.altcommerce-account-layout__sidebar .altcommerce-account-nav__list li:not(:last-child) a {
		border-bottom-color: var(--line);
	}

	.altcommerce-account-layout__sidebar .altcommerce-account-nav__link {
		color: var(--muted);
	}

	.altcommerce-account-layout__sidebar .altcommerce-account-nav__link:hover {
		background: var(--green-dim);
		color: var(--green-strong);
	}

	.altcommerce-account-layout__sidebar .altcommerce-account-nav__link.is-active {
		background: linear-gradient(135deg, var(--green), #00b09b);
		color: #fff;
		border-color: transparent;
	}

	.altcommerce-account-nav {
		border-bottom-color: var(--line);
	}

	.altcommerce-account-nav__link {
		color: var(--muted);
	}

	.altcommerce-account-nav__link:hover {
		background: var(--green-dim);
		color: var(--green-strong);
	}

	.altcommerce-account-nav__link.is-active {
		background: linear-gradient(135deg, var(--green), #00b09b);
		color: #fff;
	}

	@media (min-width: 783px) {
		/* Dưới header sticky + admin bar + notch (khớp --header-offset + safe-area trên header) */
		.altcommerce-account-layout__sidebar .altcommerce-account-nav {
		position: sticky;
		top: calc(var(--header-offset) + env(safe-area-inset-top, 0px) + 12px);
		z-index: 1;
		max-height: calc(100vh - var(--header-offset) - env(safe-area-inset-top, 0px) - 24px);
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		}

		.altcommerce-account-layout__main {
		border-left-color: var(--line);
		}
	}

	@media (max-width: 782px) {
		.altcommerce-account-layout__sidebar .altcommerce-account-nav {
		border-bottom-color: var(--line);
		}
	}

	.altcommerce-account-password-section-hint,
	.altcommerce-account-edit-form .altcommerce-member-field .description,
	.altcommerce-account-panel__hint,
	.altcommerce-account-downloads-intro,
	.altcommerce-account-downloads-list__meta,
	.altcommerce-account-downloads-filter-note,
	.altcommerce-member-welcome,
	.altcommerce-member-footer,
	.altcommerce-account-panel--logout .altcommerce-account-logout-confirm__text {
		color: var(--muted);
	}

	.altcommerce-member-login-prompt {
		border-top-color: var(--line);
		color: var(--text);
	}

	.altcommerce-account-downloads-list__item {
		border-bottom-color: var(--line);
	}

	.altcommerce-account-downloads-list__link {
		color: var(--green-strong);
	}

	html[data-theme="dark"] .altcommerce-account-downloads-list__link {
		color: var(--green);
	}

	.altcommerce-account-downloads-filter-clear {
		color: var(--green-strong);
	}

	html[data-theme="dark"] .altcommerce-account-downloads-filter-clear {
		color: var(--green);
	}

	.altcommerce-member-account-table th,
	.altcommerce-member-account-table td {
		border-color: var(--line);
		color: var(--text);
	}

	.altcommerce-member-account-table th {
		background: var(--surface);
		color: var(--heading);
	}

	.altcommerce-member-notice {
		border: 1px solid transparent;
	}

	.altcommerce-member-notice--error,
	.altcommerce-member-error {
		background: var(--red-dim);
		color: var(--red);
		border-color: var(--pain-border);
	}

	.altcommerce-member-notice--success {
		background: var(--green-dim);
		color: var(--green-strong);
		border-color: var(--green-border);
	}

	html[data-theme="dark"] .altcommerce-member-notice--success {
		color: var(--green);
	}

	.altcommerce-member-forgot-password a,
	.altcommerce-member-form-alt a,
	.altcommerce-member-login-prompt a,
	.altcommerce-checkout-secondary-link a {
		color: var(--green-strong);
	}

	html[data-theme="dark"] .altcommerce-member-forgot-password a,
	html[data-theme="dark"] .altcommerce-member-form-alt a,
	html[data-theme="dark"] .altcommerce-member-login-prompt a,
	html[data-theme="dark"] .altcommerce-checkout-secondary-link a {
		color: var(--green);
	}

	.altcommerce-member-forgot-password a:hover,
	.altcommerce-member-form-alt a:hover,
	.altcommerce-member-login-prompt a:hover,
	.altcommerce-checkout-secondary-link a:hover {
		color: var(--heading);
	}

	html[data-theme="dark"] .altcommerce-member-forgot-password a:hover,
	html[data-theme="dark"] .altcommerce-member-form-alt a:hover,
	html[data-theme="dark"] .altcommerce-member-login-prompt a:hover,
	html[data-theme="dark"] .altcommerce-checkout-secondary-link a:hover {
		color: #fff;
	}

	.altcommerce-member-submit,
	button.altcommerce-member-submit {
		width: 100%;
		background: linear-gradient(135deg, var(--green), #00b09b);
		color: #fff;
		border: none;
		border-radius: 100px;
		font-family: var(--font);
		font-weight: 700;
		box-shadow: var(--btn-primary-shadow);
		transition: box-shadow 0.2s ease, filter 0.2s ease, opacity 0.2s ease;
	}

	.altcommerce-member-submit:hover,
	button.altcommerce-member-submit:hover {
		filter: brightness(1.06);
		box-shadow: var(--btn-primary-shadow-hover);
		background: linear-gradient(135deg, var(--green), #00b09b);
	}

	.altcommerce-member-submit:disabled,
	button.altcommerce-member-submit:disabled {
		background: var(--surface);
		color: var(--muted);
		box-shadow: none;
		filter: none;
		opacity: 0.75;
		cursor: not-allowed;
	}

	a.altcommerce-account-logout-confirm__confirm.altcommerce-member-submit {
		background: var(--muted);
		color: var(--bg2);
		box-shadow: none;
		width: auto;
		border-radius: 100px;
	}

	a.altcommerce-account-logout-confirm__confirm.altcommerce-member-submit:hover {
		background: var(--heading);
		color: var(--bg2);
		filter: none;
		box-shadow: none;
	}

	.altcommerce-account-logout-confirm__cancel {
		color: var(--muted);
	}

	.altcommerce-account-logout-confirm__cancel:hover {
		color: var(--heading);
	}

	.altcommerce-account-layout__sidebar .altcommerce-account-nav__link--logout:not(.is-active):hover {
		background: var(--red-dim);
		color: var(--red);
	}

	.altcommerce-password-wrap input[type="password"],
	.altcommerce-password-wrap input[type="text"] {
		background: var(--surface-raised);
		border: 1px solid var(--line-strong);
		border-radius: 10px;
		color: var(--text);
		min-height: 40px;
		padding-left: 12px;
		font-family: var(--font);
	}

	.altcommerce-password-toggle {
		color: var(--muted);
	}

	.altcommerce-password-toggle:hover {
		color: var(--heading);
		background: var(--surface);
	}

	.altcommerce-password-match-hint {
		color: var(--muted);
	}

	.altcommerce-password-match-hint--ok {
		color: var(--green-strong);
	}

	html[data-theme="dark"] .altcommerce-password-match-hint--ok {
		color: var(--green);
	}

	.altcommerce-password-match-hint--bad {
		color: var(--red);
	}

	.altcommerce-password-match-hint--reason-length {
		border-left-color: var(--amber);
	}

	.altcommerce-password-match-hint--reason-mismatch {
		border-left-color: var(--red);
	}

	.altcommerce-member-empty {
		color: var(--muted);
	}
