@font-face {
	font-family: "Plus Jakarta Sans";
	src: url("../fonts/plus-jakarta-sans-400.ttf") format("truetype");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Plus Jakarta Sans";
	src: url("../fonts/plus-jakarta-sans-500.ttf") format("truetype");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Plus Jakarta Sans";
	src: url("../fonts/plus-jakarta-sans-600.ttf") format("truetype");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Plus Jakarta Sans";
	src: url("../fonts/plus-jakarta-sans-700.ttf") format("truetype");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

:root {
	--ttc-navy: #006699;
	--ttc-navy-deep: #001d3d;
	--ttc-navy-mid: #006699;
	--ttc-accent: #f0ca4b;
	--ttc-accent-text: #141e27;
	--ttc-text: #141e27;
	--ttc-muted: #6f7280;
	--ttc-line: #e5e6ea;
	--ttc-bg: #f8f7fa;
	--ttc-white: #fff;
	--ttc-radius: 8px;
	--ttc-container: 1280px;
	--ttc-font: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;
	--ttc-icon-download: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>');
}

html {
	scroll-behavior: smooth;
}

body {
	font-family: var(--ttc-font);
	color: var(--ttc-text);
	background: var(--ttc-white);
}

body,
button,
input,
select,
textarea {
	font-family: var(--ttc-font) !important;
}

.ttc-container {
	width: min(100% - 6.75rem, var(--ttc-container));
	margin-inline: auto;
}

/* —— Buttons —— */
.ttc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	padding: 0.65rem 1.2rem;
	border-radius: 4px;
	font-weight: 700;
	font-size: 0.88rem;
	text-decoration: none;
	border: 0;
	cursor: pointer;
	white-space: nowrap;
	transition: filter 0.15s ease, transform 0.15s ease;
}

.ttc-btn--accent {
	background: var(--ttc-accent);
	color: var(--ttc-accent-text);
}

.ttc-btn--accent:hover {
	filter: brightness(0.95);
	color: var(--ttc-accent-text);
}

.ttc-btn--primary {
	background: var(--ttc-navy);
	color: var(--ttc-white);
}

.ttc-btn--primary:hover,
.ttc-btn--primary:focus {
	background: var(--ttc-navy);
	color: var(--ttc-white) !important;
}

.ttc-btn--ghost {
	background: transparent;
	color: var(--ttc-white);
	border: 1px solid rgb(255 255 255 / 55%);
}

.ttc-btn--ghost:hover {
	background: rgb(255 255 255 / 12%);
	color: var(--ttc-white);
}

/* —— Header (white top + navy nav) —— */
.ttc-header {
	background: var(--ttc-white);
	box-shadow: 0 1px 0 var(--ttc-line);
}

.ttc-header__top {
	background: var(--ttc-white);
	border-bottom: 1px solid var(--ttc-line);
}

.ttc-header__top-inner {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 1.5rem;
	align-items: center;
	padding: 0.75rem 0;
}

.ttc-logo img {
	display: block;
	height: 42px;
	width: auto;
}

.ttc-logo--footer img {
	height: 40px;
	filter: brightness(0) invert(1);
}

.ttc-search {
	display: flex;
	align-items: center;
	max-width: 460px;
	width: 100%;
	margin-inline: 0;
	border: 1px solid #d7dde5;
	border-radius: 6px;
	background: var(--ttc-white);
	overflow: hidden;
}

.ttc-search input {
	flex: 1;
	width: auto;
	height: auto;
	min-height: 0;
	border: 0 !important;
	border-width: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
	padding: 0.7rem 1.1rem !important;
	font: inherit;
	color: var(--ttc-text);
	background: transparent !important;
	border-radius: 0;
	-webkit-appearance: none;
	appearance: none;
}

.ttc-search button {
	border: 0;
	background: transparent;
	padding: 0.55rem 1rem;
	color: var(--ttc-muted);
	cursor: pointer;
	border-radius: 24px;
}

.ttc-search button:hover {
	color: var(--ttc-muted);
	background: transparent;
}


.ttc-header__meta {
	display: flex;
	align-items: center;
	gap: 1.1rem;
	font-size: 0.84rem;
	color: var(--ttc-text);
}

.ttc-header__meta a {
	color: inherit;
	text-decoration: none;
}

.ttc-hotline {
	display: flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
}

.ttc-hotline__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: #e0f2fe;
	flex: none;
}

.ttc-hotline__text {
	display: flex;
	flex-direction: column;
	gap: 1px;
	white-space: nowrap;
}

.ttc-hotline__label {
	font-style: normal;
	font-weight: 400;
	font-size: 12px;
	line-height: 16.8px;
	color: #475569;
}

.ttc-hotline__number {
	font-weight: 700;
	font-size: 14px;
	line-height: 19.6px;
	color: #006599;
}

.ttc-icon-link {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	color: var(--ttc-muted) !important;
}

.ttc-lang {
	color: var(--ttc-muted);
}

.ttc-lang strong {
	color: var(--ttc-navy);
}

.ttc-header__nav {
	background: var(--ttc-white);
	border-bottom: 1px solid var(--ttc-line);
}

.ttc-header__nav-inner {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 1rem;
	padding: 0;
	min-height: 48px;
}

.ttc-nav__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 0 1.75rem;
	list-style: none;
	margin: 0;
	padding: 0.7rem 0;
}

.ttc-nav__list a {
	position: relative;
	color: var(--ttc-text);
	text-decoration: none;
	font-size: 0.875rem;
	font-weight: 600;
	transition: color 0.3s ease;
}

.ttc-nav__list a::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: -0.55rem;
	left: 0;
	height: 2px;
	background: var(--ttc-navy);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
	pointer-events: none;
}

.ttc-nav__list a:hover,
.ttc-nav__list a:focus-visible,
.ttc-nav__list .current-menu-item>a {
	color: var(--ttc-navy);
}

.ttc-nav__list a:hover::after,
.ttc-nav__list a:focus-visible::after,
.ttc-nav__list .current-menu-item>a::after {
	transform: scaleX(1);
}

.ttc-header__nav .ttc-btn--accent {
	border-radius: 0;
	align-self: stretch;
	display: inline-flex;
	padding-inline: 1.35rem;
}

.ttc-nav-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-width: 82px;
	min-height: 42px;
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--ttc-line);
	border-radius: 999px;
	background: var(--ttc-white);
	color: var(--ttc-text);
	font-size: 0.8rem;
	font-weight: 600;
	cursor: pointer;
}

.ttc-nav-toggle__icon {
	display: grid;
	gap: 4px;
	width: 17px;
}

.ttc-nav-toggle__icon span {
	display: block;
	width: 100%;
	height: 1.5px;
	border-radius: 2px;
	background: currentColor;
	transition: transform 0.2s ease, opacity 0.2s ease;
}

.ttc-nav-toggle[aria-expanded="true"] .ttc-nav-toggle__icon span:first-child {
	transform: translateY(5.5px) rotate(45deg);
}

.ttc-nav-toggle[aria-expanded="true"] .ttc-nav-toggle__icon span:nth-child(2) {
	opacity: 0;
}

.ttc-nav-toggle[aria-expanded="true"] .ttc-nav-toggle__icon span:last-child {
	transform: translateY(-5.5px) rotate(-45deg);
}

/* —— Shop shell —— */
body.woocommerce-shop #main-container>main,
body.post-type-archive-product #main-container>main,
body.tax-product_tag #main-container>main,
body.tax-product_cat #main-container>main {
	padding: 0;
}

.ttc-shop {
	width: min(100% - 2.5rem, var(--ttc-container));
	margin: 0 auto 3.5rem;
}

/* Trang danh muc san pham: luoi hang ben trai, cot ben ben phai. Chi trang
   danh muc moi co cot nay, trang San pham tong va trang thuong hieu van rong
   het be ngang. */
.ttc-shop__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: 2rem;
	align-items: start;
}

.ttc-shop__main {
	min-width: 0;
}

/* Con lai it cho hon nen luoi rut tu 4 xuong 3 cot. */
.ttc-shop__layout .woocommerce ul.products,
.ttc-shop__main ul.products {
	grid-template-columns: repeat(3, 1fr) !important;
}

@media (max-width: 1100px) {
	.ttc-shop__layout {
		grid-template-columns: minmax(0, 1fr);
	}

	.ttc-shop__main ul.products {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}

.ttc-shop-hero {
	padding: 1.5rem 0 0.25rem;
}

.ttc-breadcrumb {
	display: flex;
	gap: 0.4rem;
	font-size: 0.82rem;
	color: var(--ttc-muted);
	margin-bottom: 0.65rem;
}

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

.ttc-shop-hero__row {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 1rem;
	align-items: flex-end;
	margin-bottom: 1.1rem;
}

.ttc-shop-title {
	margin: 0;
	font-size: clamp(1.55rem, 2.2vw, 2rem);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.01em;
	color: var(--ttc-text);
}

.ttc-shop-hero__aside {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.3rem;
}

.ttc-results-count {
	margin: 0;
	font-size: 0.82rem;
	color: var(--ttc-muted);
}

.woocommerce .woocommerce-ordering {
	margin: 0;
}

.woocommerce .woocommerce-ordering select {
	border: 1px solid var(--ttc-line);
	border-radius: 4px;
	padding: 0.4rem 0.65rem;
	font: inherit;
	color: var(--ttc-text);
	background: var(--ttc-white);
}

.ttc-filters {
	display: grid;
	grid-template-columns: 1.8fr 1fr 1fr;
	gap: 0.75rem;
	padding: 0.85rem 1rem;
	background: var(--ttc-bg);
	border: 1px solid var(--ttc-line);
	border-radius: 6px;
	margin-bottom: 2rem;
}

.ttc-filters__search {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	background: var(--ttc-white);
	border: 1px solid var(--ttc-line);
	border-radius: 4px;
	padding: 0 0.85rem;
	color: var(--ttc-muted);
}

.ttc-filters__search input {
	flex: 1;
	width: 100%;
	height: auto;
	min-height: 0;
	border: 0 !important;
	border-width: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
	padding: 0.7rem 0 !important;
	font: inherit;
	line-height: 1.35;
	font-size: 0.92rem;
	color: var(----ttc-muted);
	background: transparent !important;
	border-radius: 0;
	-webkit-appearance: none;
	appearance: none;
}

.ttc-filters__search input::-webkit-search-decoration,
.ttc-filters__search input::-webkit-search-cancel-button,
.ttc-search input::-webkit-search-decoration,
.ttc-search input::-webkit-search-cancel-button {
	-webkit-appearance: none;
}

.ttc-filters__select select {
	width: 100%;
	border: 1px solid var(--ttc-line);
	border-radius: 4px;
	min-height: 44px;
	padding: 0.58rem 2rem 0.58rem 0.85rem;
	font: inherit;
	font-size: 0.92rem;
	line-height: 1.35;
	-webkit-appearance: none;
	appearance: none;
	background: var(--ttc-white);
	color: var(--ttc-text);
	background-image: linear-gradient(45deg, transparent 50%, #6b7785 50%), linear-gradient(135deg, #6b7785 50%, transparent 50%);
	background-position: calc(100% - 16px) 52%, calc(100% - 11px) 52%;
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* —— Section titles with blue bar —— */
.ttc-section-title {
	margin: 0 0 1.1rem;
	padding-left: 0.75rem;
	border-left: 4px solid var(--ttc-navy);
	font-size: 1.05rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--ttc-text);
	line-height: 1.2;
}

.ttc-featured__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	margin-bottom: 1rem;
}

.ttc-featured__head .ttc-section-title {
	margin-bottom: 0;
}

.ttc-link-all {
	color: var(--ttc-navy);
	font-weight: 600;
	text-decoration: none;
	font-size: 0.88rem;
}

.ttc-link-all:hover {
	text-decoration: underline;
}

/* —— Brands —— */
.ttc-brands {
	margin-bottom: 2.25rem;
}

.ttc-brands__grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 0.75rem 1rem;
}

.ttc-brand-tile {
	display: grid;
	place-items: center;
	position: relative;
	min-height: 72px;
	padding: 0.75rem 0.5rem;
	background: var(--ttc-white);
	border: 1px solid var(--ttc-line);
	border-radius: 8px;
	text-decoration: none;
	transform: translateY(0);
	transition:
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		border-color 0.35s ease,
		background-color 0.35s ease;
}

.ttc-brand-tile img {
	max-width: 72%;
	max-height: 32px;
	width: auto;
	height: auto;
	object-fit: contain;
}

.ttc-brand-tile:hover,
.ttc-brand-tile:focus-visible,
.woocommerce ul.products li.product:hover,
.woocommerce ul.products li.product:focus-within,
.ttc-home-product:hover {
	z-index: 1;
	border-color: rgb(0 102 153 / 40%);
	background: #edf7fb;
	box-shadow:
		0 0 0 1px rgb(0 102 153 / 12%),
		0 14px 32px rgb(0 51 102 / 16%);
	transform: translateY(-4px);
	outline: none;
}

@media (prefers-reduced-motion: reduce) {

	.ttc-brand-tile,
	.woocommerce ul.products li.product,
	.ttc-home-product {
		transition: none;
	}

	.ttc-brand-tile:hover,
	.ttc-brand-tile:focus-visible,
	.woocommerce ul.products li.product:hover,
	.woocommerce ul.products li.product:focus-within,
	.ttc-home-product:hover {
		transform: none;
	}
}

/* —— Product cards —— */
.woocommerce ul.products {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.25rem;
	margin: 0 0 2.5rem !important;
	padding: 0;
	list-style: none;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after {
	display: none !important;
}

.woocommerce ul.products li.product {
	width: auto !important;
	margin: 0 !important;
	float: none !important;
	background: var(--ttc-white);
	border: 1px solid var(--ttc-line);
	border-radius: 8px;
	overflow: hidden;
	padding: 0.9rem 0.9rem 1rem;
	position: relative;
	display: flex;
	flex-direction: column;
	transform: translateY(0);
	transition:
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		border-color 0.35s ease,
		background-color 0.35s ease;
}

.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product .ct-media-container {
	margin: 0 !important;
}

.woocommerce ul.products li.product .ct-media-container,
.woocommerce ul.products li.product a img {
	background: #f7f9fb;
	border-radius: 4px;
}

.woocommerce ul.products li.product a img {
	object-fit: contain !important;
	aspect-ratio: 1 / 1 !important;
	width: 100% !important;
	height: auto !important;
}

/* —— Single product gallery (match /shop cards) —— */
body.single-product .ct-product-gallery-container .flexy-view .ct-media-container,
body.single-product .woocommerce-product-gallery .ct-media-container {
	aspect-ratio: 1 / 1 !important;
	width: 100%;
	background: #f7f9fb;
	border-radius: 6px;
	overflow: hidden;
}

body.single-product .ct-product-gallery-container .flexy-view .ct-media-container img,
body.single-product .woocommerce-product-gallery .ct-media-container img,
body.single-product .woocommerce-product-gallery__image img {
	aspect-ratio: 1 / 1 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: contain !important;
	object-position: center !important;
	max-height: none !important;
}

/* kill residual WC/Blocksy zoom layer if still injected */
body.single-product .zoomImg,
body.single-product .woocommerce-product-gallery .zoomImg {
	display: none !important;
}

body.single-product .ct-product-gallery-container .flexy-pills .ct-media-container {
	aspect-ratio: 1 / 1 !important;
	background: #f7f9fb;
	border-radius: 4px;
	overflow: hidden;
}

body.single-product .ct-product-gallery-container .flexy-pills img {
	object-fit: contain !important;
	width: 100% !important;
	height: 100% !important;
}

.ttc-card-brand {
	position: absolute;
	top: 1rem;
	left: 1rem;
	z-index: 2;
	background: rgb(255 255 255 / 95%);
	border-radius: 3px;
	padding: 0.2rem 0.35rem;
	line-height: 0;
	box-shadow: 0 1px 3px rgb(0 0 0 / 6%);
}

.ttc-card-brand img {
	display: block;
	height: 18px;
	width: auto;
	max-width: 70px;
	object-fit: contain;
}

.ttc-card-brand--text {
	font-size: 0.62rem;
	font-weight: 700;
	color: var(--ttc-navy);
	text-transform: uppercase;
	line-height: 1.2;
	padding: 0.25rem 0.4rem;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product .ct-woo-card-title {
	font-size: 0.95rem !important;
	font-weight: 700 !important;
	color: var(--ttc-text) !important;
	margin: 0.85rem 0 0.5rem !important;
	line-height: 1.35;
	flex: 1;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title a,
.woocommerce ul.products li.product h2 a {
	color: inherit !important;
	text-decoration: none;
}

.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart,
.woocommerce ul.products li.product .ct-woo-card-actions,
.woocommerce ul.products li.product .entry-meta,
.woocommerce .star-rating,
.woocommerce .woocommerce-result-count,
.woocommerce-products-header__title.page-title {
	display: none !important;
}

.ttc-contact-link {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	color: var(--ttc-navy) !important;
	font-weight: 600;
	font-size: 0.9rem;
	text-decoration: none;
	margin-top: auto;
}

.ttc-contact-link:hover {
	color: var(--ttc-navy-mid) !important;
}

.ttc-contact-link svg {
	flex-shrink: 0;
}

/* —— Featured —— */
.ttc-featured,
.ttc-blog {
	margin: 3rem 0;
}

.ttc-featured__banner {
	margin: 0 0 1.35rem;
	border-radius: 8px;
	overflow: hidden;
}

.ttc-featured__banner img {
	display: block;
	width: 100%;
	height: clamp(200px, 30vw, 340px);
	object-fit: cover;
}

/* —— Blog —— */
.ttc-blog__layout {
	display: grid;
	grid-template-columns: 1.35fr 1fr;
	gap: 1.25rem;
	align-items: stretch;
}

.ttc-blog__feature {
	border-radius: 8px;
	overflow: hidden;
	border: 1px solid var(--ttc-line);
	min-height: 320px;
}

.ttc-blog__feature a {
	display: block;
	height: 100%;
	text-decoration: none;
	color: inherit;
}

.ttc-blog__feature-media {
	position: relative;
	height: 100%;
	min-height: 320px;
	background: #111;
}

.ttc-blog__feature-media>img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	min-height: 320px;
}

.ttc-blog__feature-overlay {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 1.25rem 1.25rem 1.35rem;
	background: linear-gradient(180deg, transparent 0%, rgb(0 0 0 / 78%) 55%, rgb(0 0 0 / 88%) 100%);
	color: #fff;
}

.ttc-blog__tag {
	display: inline-block;
	margin-bottom: 0.55rem;
	padding: 0.22rem 0.55rem;
	background: var(--ttc-accent);
	color: var(--ttc-accent-text);
	font-size: 0.65rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	border-radius: 2px;
}

.ttc-blog__feature-overlay h3 {
	margin: 0;
	font-size: 1.15rem;
	line-height: 1.4;
	color: #fff !important;
	font-weight: 700;
}

.ttc-blog__list {
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
}

.ttc-blog__item {
	background: var(--ttc-white);
	border: 1px solid var(--ttc-line);
	border-radius: 8px;
	overflow: hidden;
	flex: 1;
}

.ttc-blog__item a {
	display: grid;
	grid-template-columns: 96px 1fr;
	gap: 0.9rem;
	align-items: center;
	padding: 0.7rem;
	text-decoration: none;
	color: inherit;
	height: 100%;
}

.ttc-blog__item img {
	width: 96px;
	height: 96px;
	object-fit: cover;
	border-radius: 6px;
	background: var(--ttc-bg);
}

.ttc-blog__item a:hover {
	background: #f8fafc;
}

.ttc-blog__item-body {
	display: grid;
	gap: 0.25rem;
	min-width: 0;
}

.ttc-blog__item-meta {
	font-size: 0.72rem;
	font-weight: 600;
	color: var(--ttc-muted);
	letter-spacing: 0.02em;
}

.ttc-blog__item h3 {
	margin: 0;
	font-size: 0.95rem;
	line-height: 1.4;
	color: var(--ttc-text) !important;
	font-weight: 700;
	transition: color 0.15s ease;
}

.ttc-blog__item a:hover h3 {
	color: var(--ttc-navy) !important;
}

.ttc-blog__feature a:hover .ttc-blog__feature-media>img {
	transform: scale(1.03);
}

.ttc-blog__feature-media>img {
	transition: transform 0.35s ease;
}

/* —— Blog archive + single (Blocksy cards) —— */
body.blog,
body.archive:not(.post-type-archive-product):not(.tax-product_cat):not(.tax-product_tag),
body.single-post {
	background: var(--ttc-bg);
}

body.blog #main,
body.archive:not(.post-type-archive-product):not(.tax-product_cat):not(.tax-product_tag) #main,
body.single-post #main {
	/* padding-bottom: 3rem; */
}

.ttc-blog-hero {
	position: relative;
	display: block;
	width: 100%;
	margin: 0 0 1.75rem;
	padding: 2.35rem 0 2.1rem;
	background:
		linear-gradient(135deg, rgb(10 79 134 / 97%) 0%, rgb(6 58 100 / 94%) 55%, rgb(13 95 160 / 90%) 100%);
	color: #fff;
	overflow: hidden;
}

/* safety if ever nested in Blocksy grid */
.entries>.ttc-blog-hero {
	grid-column: 1 / -1;
}

.ttc-blog-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 88% 18%, rgb(240 180 41 / 24%) 0%, transparent 42%),
		radial-gradient(circle at 8% 88%, rgb(255 255 255 / 8%) 0%, transparent 40%);
	pointer-events: none;
}

.ttc-blog-hero .ttc-container {
	position: relative;
	z-index: 1;
}

.ttc-blog-hero__eyebrow {
	margin: 0 0 0.45rem;
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ttc-accent);
}

.ttc-blog-hero__title {
	margin: 0;
	color: #fff !important;
	font-size: clamp(1.6rem, 3vw, 2.15rem);
	font-weight: 800;
	letter-spacing: 0.01em;
	line-height: 1.25;
}

.ttc-blog-hero__desc {
	margin: 0.65rem 0 0;
	max-width: 44rem;
	color: rgb(255 255 255 / 88%) !important;
	font-size: 0.98rem;
	line-height: 1.55;
}

[data-prefix="blog"] .entries,
[data-prefix="categories"] .entries {
	width: min(100% - 2.5rem, var(--ttc-container));
	margin-inline: auto;
	gap: 1.35rem !important;
}

[data-prefix="blog"] .entry-card,
[data-prefix="categories"] .entry-card {
	display: flex;
	flex-direction: column;
	gap: 0;
	padding: 0 !important;
	border: 1px solid var(--ttc-line);
	border-radius: 10px;
	overflow: hidden;
	background: var(--ttc-white) !important;
	box-shadow: 0 8px 22px -14px rgb(10 79 134 / 28%) !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

[data-prefix="blog"] .entry-card:hover,
[data-prefix="categories"] .entry-card:hover {
	transform: translateY(-3px);
	border-color: rgb(10 79 134 / 28%);
	box-shadow: 0 16px 28px -16px rgb(10 79 134 / 42%) !important;
}

/* Image first via flex order */
[data-prefix="blog"] .entry-card>.ct-media-container,
[data-prefix="categories"] .entry-card>.ct-media-container {
	order: -2;
	margin: 0 !important;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: #0b2238;
	display: block;
}

[data-prefix="blog"] .entry-card>.ct-media-container img,
[data-prefix="categories"] .entry-card>.ct-media-container img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.35s ease;
}

[data-prefix="blog"] .entry-card:hover>.ct-media-container img,
[data-prefix="categories"] .entry-card:hover>.ct-media-container img {
	transform: scale(1.04);
}

[data-prefix="blog"] .entry-card>.entry-meta[data-id="meta_1"],
[data-prefix="categories"] .entry-card>.entry-meta[data-id="meta_1"] {
	order: -1;
	margin: 0.95rem 1.05rem 0 !important;
}

[data-prefix="blog"] .entry-card .entry-title,
[data-prefix="categories"] .entry-card .entry-title {
	margin: 0.45rem 1.05rem 0.55rem !important;
	font-size: 1.05rem !important;
	line-height: 1.35 !important;
	font-weight: 800;
}

[data-prefix="blog"] .entry-card .entry-title a,
[data-prefix="categories"] .entry-card .entry-title a {
	color: var(--ttc-text) !important;
	text-decoration: none;
}

[data-prefix="blog"] .entry-card:hover .entry-title a,
[data-prefix="categories"] .entry-card:hover .entry-title a {
	color: var(--ttc-navy) !important;
}

[data-prefix="blog"] .entry-card .entry-excerpt,
[data-prefix="categories"] .entry-card .entry-excerpt {
	margin: 0 1.05rem 0.85rem !important;
	color: var(--ttc-muted);
	font-size: 0.88rem;
	line-height: 1.55;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	flex: 1;
}

[data-prefix="blog"] .entry-card>.entry-meta[data-id="meta_2"],
[data-prefix="categories"] .entry-card>.entry-meta[data-id="meta_2"] {
	margin: auto 1.05rem 1.05rem !important;
	padding-top: 0.75rem;
	border-top: 1px solid var(--ttc-line);
	color: var(--ttc-muted);
	font-size: 0.75rem;
}

[data-prefix="blog"] .entry-card .meta-categories a,
[data-prefix="categories"] .entry-card .meta-categories a,
body.single-post .entry-meta .meta-categories a {
	display: inline-block;
	padding: 0.2rem 0.5rem;
	border-radius: 3px;
	background: var(--ttc-accent);
	color: var(--ttc-accent-text) !important;
	font-size: 0.65rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	text-decoration: none;
}

/* Pagination */
body.blog .ct-pagination,
body.archive .ct-pagination {
	width: min(100% - 2.5rem, var(--ttc-container));
	margin: 2rem auto 0;
}

body.blog .ct-pagination a,
body.archive .ct-pagination a,
body.blog .ct-pagination .current,
body.archive .ct-pagination .current {
	border-radius: 6px;
	font-weight: 700;
}

body.blog .ct-pagination .current,
body.archive .ct-pagination .current {
	background: var(--ttc-navy) !important;
	color: #fff !important;
}

/* Single post */
body.single-post .hero-section {
	display: none;
	/* replaced by .ttc-article-hero */
}

.ttc-article-hero {
	width: min(100% - 2.5rem, 820px);
	margin: 0 auto 1.35rem;
	padding-top: 0.25rem;
}

.ttc-article-hero__crumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem;
	margin: 0 0 1rem;
	font-size: 0.78rem;
	font-weight: 600;
	color: var(--ttc-muted);
}

.ttc-article-hero__crumb a {
	color: var(--ttc-navy);
	text-decoration: none;
}

.ttc-article-hero__crumb a:hover {
	color: var(--ttc-navy-mid);
}

.ttc-article-hero__tag {
	display: inline-block;
	margin: 0 0 0.75rem;
	padding: 0.22rem 0.55rem;
	border-radius: 3px;
	background: var(--ttc-accent);
	color: var(--ttc-accent-text);
	font-size: 0.65rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.ttc-article-hero__title {
	margin: 0 0 0.75rem;
	font-size: clamp(1.55rem, 2.8vw, 2.2rem);
	line-height: 1.25;
	font-weight: 800;
	color: var(--ttc-text) !important;
}

.ttc-article-hero__meta {
	margin: 0 0 1.25rem;
	color: var(--ttc-muted);
	font-size: 0.85rem;
	font-weight: 600;
}

.ttc-article-hero__media {
	margin: 0 0 1.5rem;
	border-radius: 10px;
	overflow: hidden;
	border: 1px solid var(--ttc-line);
	background: #0b2238;
	aspect-ratio: 16 / 9;
}

.ttc-article-hero__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

body.single-post .entry-content {
	width: min(100% - 2.5rem, 820px);
	margin-inline: auto;
	padding: 1.5rem 1.75rem 2rem;
	background: var(--ttc-white);
	border: 1px solid var(--ttc-line);
	border-radius: 10px;
	box-shadow: 0 10px 28px -18px rgb(10 79 134 / 30%);
	font-size: 1.02rem;
	line-height: 1.75;
	color: var(--ttc-text);
}

body.single-post .entry-content .rte {
	max-width: none;
}

/* scraped Sapo content often repeats title as first h1 */
body.single-post .entry-content .rte>h1:first-child {
	display: none;
}

body.single-post .entry-content img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
	margin: 1rem 0;
}

body.single-post .entry-content h2,
body.single-post .entry-content h3,
body.single-post .entry-content h4 {
	color: var(--ttc-navy-deep);
	margin-top: 1.6em;
	line-height: 1.3;
}

body.single-post .entry-content a {
	color: var(--ttc-navy);
	font-weight: 600;
}

body.single-post .entry-content ul,
body.single-post .entry-content ol {
	padding-left: 1.2rem;
}

body.single-post .entry-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.25rem 0;
	font-size: 0.92rem;
}

body.single-post .entry-content th,
body.single-post .entry-content td {
	border: 1px solid var(--ttc-line);
	padding: 0.55rem 0.7rem;
}

body.single-post .entry-content th {
	background: var(--ttc-bg);
	color: var(--ttc-navy-deep);
}

body.single-post .ct-comments-container {
	display: none;
}

.ttc-article-footer {
	width: min(100% - 2.5rem, var(--ttc-container));
	margin: 2.5rem auto 0;
	display: grid;
	gap: 2rem;
}

.ttc-article-nav {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}

.ttc-article-nav__item {
	display: grid;
	gap: 0.35rem;
	padding: 1rem 1.15rem;
	border: 1px solid var(--ttc-line);
	border-radius: 10px;
	background: var(--ttc-white);
	text-decoration: none;
	color: inherit;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ttc-article-nav__item:hover {
	border-color: rgb(10 79 134 / 30%);
	box-shadow: 0 10px 22px -16px rgb(10 79 134 / 40%);
}

.ttc-article-nav__item span {
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--ttc-muted);
}

.ttc-article-nav__item strong {
	font-size: 0.95rem;
	line-height: 1.4;
	color: var(--ttc-text);
	font-weight: 700;
}

.ttc-article-nav__item--next {
	text-align: right;
}

.ttc-article-nav__item.is-empty {
	visibility: hidden;
	pointer-events: none;
}

.ttc-article-related__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.15rem;
}

.ttc-article-related__card {
	border: 1px solid var(--ttc-line);
	border-radius: 10px;
	overflow: hidden;
	background: var(--ttc-white);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ttc-article-related__card:hover {
	transform: translateY(-3px);
	box-shadow: 0 14px 26px -16px rgb(10 79 134 / 40%);
}

.ttc-article-related__card a {
	display: grid;
	text-decoration: none;
	color: inherit;
	height: 100%;
}

.ttc-article-related__card img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	background: #0b2238;
}

.ttc-article-related__body {
	display: grid;
	gap: 0.35rem;
	padding: 0.95rem 1rem 1.1rem;
}

.ttc-article-related__date {
	font-size: 0.72rem;
	font-weight: 600;
	color: var(--ttc-muted);
}

.ttc-article-related__card h3 {
	margin: 0;
	font-size: 0.98rem;
	line-height: 1.35;
	font-weight: 700;
	color: var(--ttc-text) !important;
}

.ttc-article-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	padding: 1.5rem 1.75rem;
	border-radius: 10px;
	background: linear-gradient(135deg, var(--ttc-navy) 0%, var(--ttc-navy-deep) 100%);
	color: #fff;
}

.ttc-article-cta h2 {
	margin: 0 0 0.4rem;
	font-size: 1.2rem;
	font-weight: 800;
	color: #fff !important;
}

.ttc-article-cta p {
	margin: 0;
	color: rgb(255 255 255 / 88%) !important;
	font-size: 0.92rem;
	line-height: 1.5;
	max-width: 36rem;
}

.ttc-article-cta__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem;
	flex-shrink: 0;
}

body.single-post .ct-related-posts-container,
body.single-post .ct-related-posts {
	display: none;
}

/* —— Support CTA —— */
.ttc-support:not(.wp-block-cover) {
	position: relative;
	border-radius: 8px;
	overflow: hidden;
	min-height: 300px;
	display: grid;
	align-items: center;
	isolation: isolate;
	margin: 3rem 0;
	background:
		linear-gradient(90deg, rgb(6 40 70 / 92%) 0%, rgb(6 40 70 / 78%) 42%, rgb(6 40 70 / 20%) 72%, transparent 100%),
		url("../img/support-team.jpg") center / cover no-repeat;
	color: #fff;
}

.ttc-support__inner {
	position: relative;
	z-index: 1;
	padding: 2.75rem 0;
	max-width: 520px;
}

.ttc-support h2,
.ttc-support p {
	color: #fff !important;
}

.ttc-support h2 {
	margin: 0 0 0.85rem;
	font-size: clamp(1.35rem, 2.3vw, 1.85rem);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	font-weight: 800;
	line-height: 1.25;
	text-shadow: 0 1px 8px rgb(0 0 0 / 35%);
}

.ttc-support p {
	margin: 0;
	line-height: 1.6;
	font-size: 0.95rem;
	color: rgb(255 255 255 / 92%) !important;
	text-shadow: 0 1px 6px rgb(0 0 0 / 30%);
}

/* —— Footer —— */
.ttc-footer {
	background: var(--ttc-navy-deep);
	color: rgb(255 255 255 / 88%);
	margin-top: 0;
}

.ttc-footer a {
	color: inherit;
	text-decoration: none;
}

.ttc-footer a:hover {
	color: var(--ttc-accent);
}

.ttc-footer__grid {
	display: grid;
	grid-template-columns: 1.45fr 1fr 1fr;
	gap: 2.5rem;
	padding: 2.75rem 0 2.25rem;
}

.ttc-footer__tagline {
	margin: 0.65rem 0 1rem;
	font-style: italic;
	opacity: 0.85;
}

.ttc-footer__heading {
	margin: 0 0 1rem;
	font-size: 0.9rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--ttc-white);
	font-weight: 700;
}

.ttc-footer__links,
.ttc-footer__contact {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.55rem;
	font-size: 0.9rem;
}

.ttc-footer__bottom {
	border-top: 1px solid rgb(255 255 255 / 12%);
	background: rgb(0 0 0 / 18%);
	padding: 0.85rem 0;
	font-size: 0.8rem;
	opacity: 0.8;
}

.ttc-single-contact {
	margin-top: 1rem;
}

.screen-reader-text,
.ttc-skip-link {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

.ttc-skip-link:focus {
	position: fixed;
	top: 0.75rem;
	left: 0.75rem;
	z-index: 10000;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0.65rem 1rem;
	clip: auto;
	overflow: visible;
	background: var(--ttc-navy);
	color: #fff;
	font-weight: 600;
	text-decoration: none;
	border-radius: 4px;
}

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

	.woocommerce ul.products {
		grid-template-columns: repeat(3, 1fr);
	}

	.ttc-filters {
		grid-template-columns: 1fr 1fr;
	}

	.ttc-filters__search {
		grid-column: 1 / -1;
	}
}

@media (max-width: 768px) {
	.ttc-header__top-inner {
		grid-template-columns: 1fr auto;
	}

	.ttc-header .ttc-search {
		display: none;
	}

	.ttc-nav-toggle {
		display: inline-flex;
	}

	.ttc-nav {
		display: none;
		width: 100%;
	}

	.ttc-header__nav-inner.is-open .ttc-nav {
		display: block;
	}

	.ttc-header__nav-inner {
		flex-wrap: wrap;
	}

	.ttc-nav__list {
		flex-direction: column;
		gap: 0.65rem;
		padding: 0.5rem 0 0.85rem;
	}

	.ttc-header__nav .ttc-btn--accent {
		width: 100%;
		min-height: 44px;
	}

	.ttc-brands__grid,
	.woocommerce ul.products {
		grid-template-columns: repeat(2, 1fr);
	}

	.ttc-blog__layout,
	.ttc-footer__grid,
	.ttc-filters {
		grid-template-columns: 1fr;
	}

	.ttc-shop-hero__aside {
		align-items: flex-start;
	}

	.ttc-support__inner {
		padding-inline: 0;
		max-width: 100%;
	}

	body.single-post .entry-content {
		padding: 1.15rem 1.1rem 1.5rem;
	}

	.ttc-blog-hero {
		padding: 1.6rem 0 1.4rem;
	}

	.ttc-article-nav,
	.ttc-article-related__grid,
	.ttc-article-cta {
		grid-template-columns: 1fr;
		flex-direction: column;
		align-items: flex-start;
	}

	.ttc-article-nav__item--next {
		text-align: left;
	}

	.ttc-article-nav__item.is-empty {
		display: none;
	}
}

/* —— Shop reference refresh —— */
body.woocommerce-shop,
body.post-type-archive-product,
body.tax-product_tag,
body.tax-product_cat {
	background: var(--ttc-white);
}

.ttc-header {
	position: relative;
	box-shadow: none;
}

.ttc-header__top {
	border: 0;
}

.ttc-header__top-inner {
	grid-template-columns: 128px minmax(220px, 480px) 1fr;
	gap: 2rem;
	height: 80px;
	padding: 0;
}

.ttc-logo img {
	height: 40px;
}

.ttc-search {
	max-width: 480px;
	height: 40px;
	margin: 0;
	border-color: #d7dde5;
	border-radius: 6px;
	background: #f7f8fa;
	box-shadow: none;
}

.ttc-search input {
	padding: 0.55rem 0.85rem 0.55rem 0.2rem !important;
	font-size: 0.8125rem;
}

.ttc-search button {
	order: 0;
	padding: 0.4rem 0.35rem 0.4rem 0.85rem;
}

.ttc-search button svg {
	width: 16px;
	height: 16px;
}

.ttc-header__meta {
	justify-content: flex-end;
	gap: 1.5rem;
	font-size: 0.75rem;
}

.ttc-icon-link {
	color: var(--ttc-text) !important;
	font-weight: 600;
}

.ttc-icon-link svg {
	width: 18px;
	height: 18px;
	color: var(--ttc-text);
}

.ttc-header__nav {
	background: var(--ttc-white);
	border-bottom: 1px solid var(--ttc-line);
}

.ttc-header__nav-inner {
	min-height: 52px;
	height: 52px;
	justify-content: flex-start;
}

.ttc-nav__list {
	gap: 0 1.85rem;
	padding: 0;
	justify-content: flex-start;
}

.ttc-nav__list a {
	display: inline-flex;
	align-items: center;
	height: 52px;
	color: var(--ttc-text);
	font-size: 0.8125rem;
	font-weight: 600;
	opacity: 1;
}

.ttc-nav__list a::after {
	bottom: 10px;
}

.ttc-nav__product>a::before,
.ttc-nav__product>.ct-sub-menu-parent>a::before {
	content: "";
	order: 2;
	width: 6px;
	height: 6px;
	margin-left: 8px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: translateY(-1px) rotate(45deg);
}

.ttc-header__nav .ttc-btn--accent {
	display: none;
}

.ttc-shop {
	margin-bottom: 0;
}

.ttc-shop>.ct-container {
	padding: 0;
}

.ttc-shop-hero {
	padding: 5rem 0 0;
}

.ttc-breadcrumb {
	font-size: 0.75rem;
	line-height: 1.4;
	margin-bottom: 1.55rem;
	color: var(--ttc-muted);
}

.ttc-breadcrumb span:last-child {
	color: var(--ttc-text);
	font-weight: 600;
}

.ttc-shop-hero__row {
	align-items: flex-end;
	margin-bottom: 1.85rem;
}

.ttc-shop-title {
	font-size: 1.75rem;
	line-height: 1.3;
	font-weight: 700;
	letter-spacing: -0.035em;
	text-transform: none;
}

.ttc-shop-hero__aside {
	display: block;
}

.ttc-results-count {
	font-size: 0.75rem;
	line-height: 1.4;
}

.woocommerce .woocommerce-ordering {
	display: none;
}

.ttc-filters {
	grid-template-columns: minmax(0, 1fr) 220px 220px;
	gap: 0.75rem;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	margin-bottom: 3.4rem;
}

.ttc-filters__search {
	grid-column: auto;
}

.ttc-filters__search,
.ttc-filters__select select {
	border-color: #dedfe4;
	border-radius: 8px;
	min-height: 56px;
	box-shadow: 0 1px 2px rgb(20 30 39 / 2%);
}

.ttc-filters__search {
	padding: 0 1rem;
}

.ttc-filters__search svg {
	width: 20px;
	height: 20px;
}

.ttc-filters__search input,
.ttc-filters__select select {
	font-size: 0.875rem;
}

.ttc-filters__search input {
	padding: 0.45rem 0 !important;
}

.ttc-filters__select {
	position: relative;
}

.ttc-filters__select>svg {
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 16px;
	color: #a6a6aa;
	transform: translateY(-50%);
	pointer-events: none;
}

.ttc-filters__select select {
	padding: 0.45rem 2.2rem 0.45rem 2.75rem;
	color: #a6a6aa;
}

.ttc-section-title {
	border: 0;
	padding: 0;
	margin-bottom: 1.9rem;
	font-size: 1.75rem;
	line-height: 1.3;
	font-weight: 700;
	letter-spacing: -0.04em;
	text-transform: none;
}

.ttc-brands {
	margin-bottom: 3.15rem;
}

.ttc-brands__grid {
	grid-template-columns: repeat(8, minmax(0, 1fr));
	gap: 1rem 1.25rem;
}

.ttc-brand-tile {
	min-width: 0;
	min-height: clamp(64px, 8vw, 80px);
	padding: 0.85rem 0.75rem;
	border-color: transparent;
}

.ttc-brand-tile img {
	max-width: min(72%, 108px);
	max-height: clamp(22px, 3.6vw, 28px);
}

.ttc-shop--brand .ttc-shop-hero {
	padding-top: 4.5rem;
}

.ttc-shop--brand .ttc-breadcrumb {
	margin-bottom: 1.5rem;
}

.ttc-shop--brand .ttc-filters {
	margin-bottom: 2.25rem;
}

.ttc-brand-showcase {
	margin-bottom: 3rem;
	overflow: hidden;
	border: 1px solid #dedfe4;
	border-radius: 7px;
}

.ttc-brand-showcase__media {
	position: relative;
	height: 283px;
	background: var(--ttc-brand-hero) center 54% / cover no-repeat;
}

/* The logo an mot nua len anh hero. Truoc no nam gon trong goc anh o kich
   thuoc 184x65 — nhin nhu mot cai nhan dan thu, khong ra la nhan dien cua
   hang. Gio to gan gap ruoi va dat o vi tri mat nhin toi dau tien. */
.ttc-brand-showcase__logo {
	flex: 0 0 auto;
	/* The .ttc-brand-showcase__media co `position: relative`, con the nay thi
	   khong — nen anh hero ve DE LEN no du nam sau trong tai lieu, cat mat
	   phan tren cua logo. Cho no mot lop rieng de noi len tren. */
	position: relative;
	z-index: 1;
	/* Flex chu khong grid + place-items:center. Voi grid can giua, o chua anh
	   khong duoc keo cao bang o cha, nen `height: 100%` cua anh khong co moc
	   de tinh — logo vuong nhu OSG giu nguyen 193px va trao han ra ngoai the.
	   overflow:hidden la chot chan cuoi, khong cho gi lot ra. */
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	overflow: hidden;
	width: 264px;
	height: 120px;
	margin-top: -74px;
	padding: 16px;
	border: 1px solid var(--ttc-line);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 16px 32px -22px rgb(0 29 61 / 55%);
}

/* Lap day o thay vi chi gioi han be ngoai: logo Sandvik hay Taegutec la dai
   ngang, con OSG gan nhu vuong (193x191). Chi dat max-height thi logo vuong
   chi cao bang be rong cua no, nam lot thom giua o. */
.ttc-brand-showcase__logo img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* Ten hang nam duoi anh hero. Hang chua co logo thi day la thu duy nhat noi
   cho nguoi xem biet ho dang o trang nao. */
/* Logo + ten ben trai, hang loai san pham day sang ben phai. Truoc day loai
   san pham nam mot hang rieng ben duoi, tat ca dat ben trai — nua phai cua
   hero bo trong mot mang. */
.ttc-brand-showcase__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1.25rem 1.75rem;
	padding: 1.4rem 28px 1.4rem;
	background: #fff;
}

/* Logo va ten di lien nhau thanh mot cum ben trai. */
.ttc-brand-showcase__id {
	display: flex;
	align-items: flex-end;
	gap: 1.25rem;
	min-width: 0;
}

.ttc-brand-showcase__meta {
	display: grid;
	gap: 0.3rem;
	min-width: 0;
	padding-bottom: 0.35rem;
}

.ttc-brand-showcase__name {
	margin: 0;
	font-size: 1.5rem;
	line-height: 1.2;
	font-weight: 700;
	color: var(--ttc-text);
}

.ttc-brand-showcase__count {
	margin: 0;
	color: var(--ttc-muted);
	font-size: 0.85rem;
	font-weight: 600;
}

/* Mo ta go trong o Mo ta o man hinh sua thuong hieu. Chua nhap thi khong in
   ra, khong de lai khoang trong. */
.ttc-brand-showcase__head .ttc-brand-showcase__desc {
	margin: 0.35rem 0 0;
	max-width: 68ch;
	color: var(--ttc-muted);
	font-size: 0.95rem;
	line-height: 1.6;
}

.ttc-brand-showcase__types {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 0.6rem;
	padding: 0;
	background: transparent;
}

.ttc-brand-showcase__types strong {
	margin-right: 0.75rem;
	font-size: 0.875rem;
}

.ttc-brand-showcase__types label {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-height: 36px;
	padding: 0 0.75rem;
	margin: 0;
	border-radius: 6px;
	background: var(--ttc-bg);
	font-size: 0.75rem;
	font-weight: 600;
	cursor: pointer;
}

.ttc-brand-showcase__types input {
	width: 14px;
	height: 14px;
	margin: 0;
	accent-color: var(--ttc-navy);
}

/* Loai san pham gio la link toi /danh-muc-hang/ chu khong con la o tick.
   Giu nguyen hinh vien thuoc cu de khong doi cam giac quen thuoc. */
.ttc-brand-showcase__type {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: 0 0.85rem;
	border-radius: 6px;
	background: var(--ttc-bg);
	color: var(--ttc-text);
	font-size: 0.75rem;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}

.ttc-brand-showcase__type:hover {
	background: #e6eef5;
}

/* Dang xem loai nao thi to dam loai do, va bam lai la bo loc — quay ve toan
   bo hang. */
.ttc-brand-showcase__type.is-active {
	background: var(--ttc-navy);
	color: #fff;
}

.ttc-brand-showcase__desc {
	margin: 1.25rem 0 0;
	color: var(--ttc-muted);
	font-size: 0.95rem;
	line-height: 1.6;
}

.ttc-brand-showcase__catalog-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin: 2rem 0 1.25rem;
}

.ttc-brand-showcase__catalog-head h2 {
	margin: 0;
	font-size: 1.4rem;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.ttc-brand-showcase__catalog-head a {
	flex: 0 0 auto;
	color: var(--ttc-navy);
	font-size: 0.9rem;
	font-weight: 600;
	text-decoration: none;
}

.woocommerce ul.products {
	grid-template-columns: repeat(4, 1fr);
	column-gap: 1.667rem;
	row-gap: 1.5rem;
	grid-auto-rows: auto;
	margin-bottom: 0 !important;
	align-items: stretch;
}

.woocommerce ul.products li.product {
	height: auto;
	min-height: 0;
	border: 1px solid #e6e9ee;
	border-radius: 10px;
	padding: 0;
	background: #fff;
	box-shadow: 0 1px 2px rgb(16 36 56 / 4%);
}

.woocommerce ul.products li.product figure {
	margin: 0 !important;
}

.woocommerce ul.products li.product .ct-media-container,
.woocommerce ul.products li.product a img {
	border-radius: 9px 9px 0 0;
	background: #f3f6f9;
}

.woocommerce ul.products li.product a img {
	aspect-ratio: 5 / 3 !important;
	object-fit: cover !important;
}

.ttc-card-brand {
	position: static;
	order: 1;
	align-self: flex-start;
	margin: 1.75rem 1rem 0 !important;
	padding: 0;
	background: transparent;
	box-shadow: none;
	transform: none;
}

.ttc-card-brand img {
	height: 18px;
	max-width: 80px;
}

.ttc-card-brand--text {
	min-height: 18px;
	font-size: 0.625rem;
	padding: 0;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product .ct-woo-card-title {
	order: 2;
	flex: 0 0 auto;
	margin: 1.375rem 1rem 0 !important;
	font-size: 1rem !important;
	font-weight: 500 !important;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.ttc-contact-link {
	order: 3;
	margin: auto 1rem 1.5rem !important;
	font-size: 0.75rem;
	line-height: 1.4;
	font-weight: 600;
	color: var(--ttc-navy) !important;
}

.ttc-contact-link svg {
	width: 13px;
	height: 13px;
}

.woocommerce nav.woocommerce-pagination {
	margin-top: 0;
}

.woocommerce nav.woocommerce-pagination ul {
	border: 0;
}

.woocommerce nav.woocommerce-pagination ul li {
	border: 0;
	margin: 0 0.1rem;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	min-width: 28px;
	height: 28px;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: 5px;
	padding: 0;
	font-size: 0.66rem;
	color: var(--ttc-text);
}

.woocommerce nav.woocommerce-pagination ul li span.current {
	background: var(--ttc-navy);
	color: #fff;
}

.woocommerce .ct-pagination {
	margin-top: 1.75rem !important;
}

.woocommerce .ct-pagination .page-numbers {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 8px;
	font-size: 0.875rem;
}

.woocommerce .ct-pagination .page-numbers.current {
	background: var(--ttc-navy);
	color: #fff;
}

.ttc-featured,
.ttc-blog {
	display: none;
}

.ttc-support:not(.wp-block-cover) {
	width: 100vw;
	margin: 3.15rem calc(50% - 50vw) 0;
	border-radius: 0;
	min-height: 700px;
	background: linear-gradient(90deg, rgb(0 29 61 / 86%) 0%, rgb(0 29 61 / 72%) 48%, rgb(0 29 61 / 35%) 100%), url("../img/support-team.jpg") center / cover no-repeat;
}

/* Cover CTA has no form — don't reserve a 560px form column */
.ttc-support__inner {
	width: min(100% - 2.5rem, var(--ttc-container));
	margin-inline: auto;
	max-width: none;
	height: auto;
	min-height: 0;
	padding: 4rem 0;
	display: grid !important;
	grid-template-columns: minmax(0, 1.3fr) minmax(260px, 0.7fr);
	align-items: center;
	gap: clamp(2rem, 4vw, 4rem);
}

.ttc-support__inner:has(.ttc-support__form) {
	width: min(100% - 6.75rem, var(--ttc-container));
	min-height: 700px;
	padding: 5rem 0 3rem;
	grid-template-columns: minmax(0, 1fr) minmax(0, 560px);
	align-items: start;
	gap: clamp(2rem, 4vw, 5rem);
}

.ttc-support__copy {
	max-width: 600px;
	padding: 0;
}

.ttc-support__inner:has(.ttc-support__form) .ttc-support__copy {
	padding: 0.75rem 0 0 2.5rem;
}

.ttc-support h2 {
	max-width: 540px;
	margin-bottom: 1.5rem;
	font-size: 2.5rem;
	text-transform: none;
	letter-spacing: -0.04em;
	line-height: 1.2;
}

.ttc-support p {
	font-size: 1rem;
	line-height: 1.4;
}

.ttc-support .ttc-support__phone {
	margin-top: 2rem;
	font-size: 1.25rem;
	font-weight: 500;
}

.ttc-support__form {
	width: 100%;
	min-height: 0;
	padding: clamp(1.5rem, 3vw, 2rem);
	border: 1px solid rgb(0 29 61 / 10%);
	border-radius: 16px;
	background: var(--ttc-form-bg, #fff);
	box-shadow: 0 22px 55px -34px rgb(0 29 61 / 55%);
	display: grid;
	gap: 1.25rem;
	box-sizing: border-box;
}

.ttc-support__form p {
	margin: 0;
	color: var(--ttc-muted) !important;
	font-size: 0.95rem;
	line-height: 1.55;
	text-shadow: none;
}

.ttc-support__form-head {
	display: grid;
	gap: 0.4rem;
}

.ttc-support__form .ttc-support__note {
	color: var(--ttc-text) !important;
	font-weight: 500;
}

.ttc-support__form .ttc-support__required {
	font-size: 0.75rem;
}

.ttc-support__required span,
.ttc-support__field b {
	color: #c62828;
}

/* Mot cot tren moi breakpoint — theo mockup form lien he dung chung toan site. */
.ttc-support__fields {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 1rem;
}

.ttc-support__field {
	min-width: 0;
	display: grid;
	align-content: start;
	gap: 0.4rem;
	color: var(--ttc-text);
	font-size: 0.82rem;
	font-weight: 700;
	line-height: 1.35;
}

.ttc-support__field--wide {
	grid-column: 1 / -1;
}

.ttc-support__field .wpcf7-form-control-wrap {
	display: block;
}

.ttc-support__form input,
.ttc-support__form select,
.ttc-support__form textarea,
.ttc-support__form button {
	width: 100%;
	min-width: 0;
	height: var(--ttc-form-field-h, 50px);
	min-height: var(--ttc-form-field-h, 50px);
	border: 1px solid var(--ttc-form-field-border, #d6dee8);
	border-radius: var(--ttc-form-radius, 8px);
	padding: 0 0.85rem;
	font: inherit;
	font-size: 0.95rem;
	box-sizing: border-box;
}

.ttc-support__form input,
.ttc-support__form select,
.ttc-support__form textarea {
	background: var(--ttc-form-field-bg, #f7f9fb);
	color: var(--ttc-text);
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.ttc-support__form textarea {
	height: auto;
	min-height: 108px;
	padding-block: 0.75rem;
	line-height: 1.5;
	resize: vertical;
}

.ttc-support__form select {
	appearance: none;
	-webkit-appearance: none;
	padding-right: 2.6rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23788493' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.95rem center;
}

.ttc-support__form input::placeholder,
.ttc-support__form textarea::placeholder {
	color: #788493;
	opacity: 1;
}

.ttc-support__form input:focus,
.ttc-support__form select:focus,
.ttc-support__form textarea:focus {
	border-color: var(--ttc-form-accent, #3474a7);
	background: #fff;
	outline: none;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--ttc-form-accent, #3474a7) 20%, transparent);
}

.ttc-support__form .wpcf7-turnstile,
.ttc-support__form .cf-turnstile {
	border-radius: var(--ttc-form-radius, 8px);
	overflow: hidden;
}

.ttc-support__form .wpcf7-not-valid {
	border-color: var(--ttc-form-error, #c62828);
	background: #fff8f8;
}

.ttc-support__form .wpcf7-not-valid:focus {
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--ttc-form-error, #c62828) 16%, transparent);
}

.ttc-support__form .wpcf7-not-valid-tip {
	margin-top: 0.35rem;
	color: #a61b1b;
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.4;
}

.ttc-support__actions {
	display: grid;
	gap: 0.55rem;
}

.ttc-support__form input[type="submit"] {
	width: 100%;
	height: 56px;
	border: 0;
	border-radius: var(--ttc-form-radius, 8px);
	background: var(--ttc-form-btn-bg, var(--ttc-navy));
	color: var(--ttc-form-btn-text, #fff);
	cursor: pointer;
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.01em;
	transition: transform 0.15s ease, filter 0.15s ease, box-shadow 0.15s ease;
}

.ttc-support__form input[type="submit"]:hover {
	filter: brightness(1.12);
	box-shadow: 0 10px 22px -14px var(--ttc-navy);
}

.ttc-support__form input[type="submit"]:focus-visible {
	outline: 3px solid rgb(52 116 167 / 34%);
	outline-offset: 3px;
}

.ttc-support__form input[type="submit"]:active {
	transform: translateY(1px);
}

.ttc-support__form input[type="submit"]:disabled {
	cursor: wait;
	opacity: 0.65;
	transform: none;
}

.ttc-support__form .wpcf7-spinner {
	position: absolute;
	margin: 14px 0 0 -42px;
}

.ttc-support__form .hidden-fields-container {
	display: none;
}

.ttc-support__privacy {
	color: var(--ttc-muted);
	font-size: 0.72rem;
	line-height: 1.45;
	text-align: center;
}

.ttc-support__form .wpcf7-response-output {
	margin: 0 !important;
	padding: 0.75rem 0.9rem !important;
	border-width: 1px !important;
	border-radius: 7px;
	font-size: 0.82rem;
	font-weight: 600;
	line-height: 1.5;
}

.ttc-support__form.sent .wpcf7-response-output {
	border-color: #63a46c !important;
	background: #f2faf3;
	color: #245c2c;
}

.ttc-support__form.invalid .wpcf7-response-output,
.ttc-support__form.failed .wpcf7-response-output,
.ttc-support__form.unaccepted .wpcf7-response-output,
.ttc-support__form.spam .wpcf7-response-output {
	border-color: #d8a034 !important;
	background: #fff9ec;
	color: #684a0c;
}

.ttc-footer {
	background: #003875;
}

.ttc-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr));
	min-height: 0;
	padding: 3.5rem 0 2.5rem;
	gap: clamp(2rem, 4vw, 4rem);
}

.ttc-footer .ttc-logo--footer img {
	height: 40px;
}

.ttc-footer__tagline {
	margin: 1.25rem 0;
	font-size: 1.1rem;
	font-style: normal;
	font-weight: 600;
}

.ttc-footer__heading {
	font-size: 0.875rem;
	letter-spacing: 0;
}

.ttc-footer__links,
.ttc-footer__contact {
	gap: 0.75rem;
	font-size: 0.75rem;
}

.ttc-footer__contact li {
	display: flex;
	align-items: center;
	gap: 4px;
}

.ttc-footer__contact-icon {
	flex: none;
	margin-top: 2px;
}

.ttc-footer__social-list {
	display: flex;
	gap: 12px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ttc-footer__social-list a {
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border: 0;
	border-radius: 50%;
	color: #fff;
}

.ttc-footer__social-list a:hover {
	background: rgb(255 255 255 / 12%);
	color: #fff;
}

.ttc-footer__bottom {
	background: #003875;
	padding: 1rem 0 2rem;
	font-size: 0.75rem;
	text-align: center;
}

.ttc-footer__links a {
	text-decoration: none;
}

/* Footer: contact rows with icons and 2-col category list */
.ttc-footer__contact {
	grid-template-columns: minmax(0, 1fr);
}

.ttc-footer__contact li {
	line-height: 1.5;
	min-width: 0;
}

.ttc-footer__contact li>span,
.ttc-footer__contact li>a {
	min-width: 0;
	overflow-wrap: anywhere;
}

.ttc-footer__links--cols {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.75rem 1.25rem;
}

@media (max-width: 1024px) {
	.ttc-container {
		width: min(100% - 2.5rem, var(--ttc-container));
	}

	.ttc-header__top-inner {
		grid-template-columns: 112px minmax(260px, 380px) 1fr;
	}

	.ttc-search {
		width: 100%;
	}

	.ttc-nav__list {
		gap: 0 1.25rem;
	}

	.ttc-nav__list a {
		font-size: 0.75rem;
	}

	.ttc-filters {
		grid-template-columns: minmax(0, 1fr) 180px 180px;
	}

	.ttc-brands__grid {
		grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	}

	.ttc-brand-showcase__media {
		height: 230px;
	}

	.woocommerce ul.products {
		grid-template-columns: repeat(3, 1fr);
	}

	.ttc-support__inner {
		width: min(100% - 2.5rem, var(--ttc-container));
		grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
		gap: 2rem;
	}

	.ttc-support__copy {
		padding-left: 0;
	}

	.ttc-footer__grid {
		gap: 2.5rem;
	}
}

@media (max-width: 768px) {
	.ttc-container {
		width: min(100% - 2rem, var(--ttc-container));
	}

	.ttc-header {
		position: sticky;
		top: 0;
		box-shadow: 0 8px 24px rgb(20 30 39 / 8%);
	}

	.ttc-header__top-inner {
		grid-template-columns: 1fr auto;
		height: 68px;
	}

	.ttc-logo img {
		height: 38px;
	}

	.ttc-header__meta {
		display: none;
	}

	.ttc-nav-toggle {
		display: inline-flex;
	}

	.ttc-header__nav {
		background: var(--ttc-white);
	}

	.ttc-header__nav-inner {
		height: auto;
		min-height: 0;
	}

	.ttc-nav {
		width: 100%;
	}

	.ttc-header__nav-inner.is-open .ttc-nav {
		display: block;
	}

	.ttc-nav__list {
		display: grid;
		grid-template-columns: 1fr;
		gap: 0;
		padding: 0.5rem 0 1rem;
	}

	.ttc-nav__list li {
		min-width: 0;
		border-bottom: 1px solid var(--ttc-line);
	}

	.ttc-nav__list a {
		width: 100%;
		height: 48px;
		padding: 0 0.75rem;
		color: var(--ttc-text);
		font-size: 0.78rem;
	}

	.ttc-nav__list a:hover,
	.ttc-nav__list .current-menu-item>a {
		border-radius: 6px;
		background: #edf7fb;
		color: var(--ttc-navy);
	}

	.ttc-nav__list .current-menu-item>a::after {
		display: none;
	}

	.ttc-shop-hero {
		padding-top: 2rem;
	}

	.ttc-shop-hero__aside {
		width: 100%;
		justify-content: space-between;
	}

	.ttc-filters {
		grid-template-columns: 1fr 1fr;
	}

	.ttc-filters__search {
		grid-column: 1 / -1;
	}

	.ttc-brands__grid {
		grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	}

	.ttc-brand-showcase__media {
		height: 190px;
	}

	.ttc-brand-showcase__logo {
		left: 16px;
		bottom: 16px;
		width: 150px;
		height: 54px;
	}

	.ttc-brand-showcase__types {
		height: auto;
		padding: 1rem;
		flex-wrap: wrap;
	}

	.woocommerce ul.products {
		grid-template-columns: repeat(2, 1fr);
		column-gap: 0.75rem;
		row-gap: 0.75rem;
		grid-auto-rows: auto;
	}

	.woocommerce ul.products li.product {
		height: auto;
	}

	.ttc-card-brand {
		margin-top: 1rem !important;
	}

	.woocommerce ul.products li.product .woocommerce-loop-product__title,
	.woocommerce ul.products li.product h2,
	.woocommerce ul.products li.product .ct-woo-card-title {
		margin-top: 0.75rem !important;
	}

	.ttc-contact-link {
		margin-bottom: 1rem !important;
	}

	.ttc-support {
		min-height: auto;
	}

	.ttc-support__inner,
	.ttc-support__inner:has(.ttc-support__form) {
		width: min(100% - 2rem, var(--ttc-container));
		height: auto;
		min-height: 0;
		padding: 2.5rem 0;
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.ttc-support__copy,
	.ttc-support__inner:has(.ttc-support__form) .ttc-support__copy {
		padding: 0;
	}

	.ttc-support__form {
		min-height: 0 !important;
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}

	.ttc-support__form input,
	.ttc-support__form select,
	.ttc-support__form textarea,
	.ttc-support__form button {
		box-sizing: border-box;
		max-width: 100%;
	}

	.ttc-support h2 {
		font-size: 1.75rem;
	}

	.ttc-support__form {
		min-height: 0;
		padding: 1.15rem;
		gap: 1rem;
		border-radius: 10px;
	}

	.ttc-support__fields {
		gap: 1rem;
	}

	.ttc-support__form input,
	.ttc-support__form select,
	.ttc-support__form button {
		height: 48px;
		min-height: 48px;
	}

	.ttc-support__form textarea {
		min-height: 104px;
	}

	.ttc-footer__grid {
		gap: 2rem;
	}
}

@media (max-width: 480px) {
	.ttc-brands__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.75rem 1rem;
	}

	.woocommerce ul.products {
		grid-template-columns: repeat(2, 1fr);
		column-gap: 0.75rem;
		row-gap: 1rem;
	}
}

/* —— Product detail —— */
body.single-product #main-container>main,
body.single-product .ct-container-full {
	padding: 0 !important;
}

body.single-product .hero-section,
body.single-product .woocommerce-notices-wrapper {
	display: none;
}

body.single-product section.related.products {
	display: none !important;
}

body.single-product article[class*="post-"] {
	margin: 0;
}

.ttc-product-shell {
	width: min(100% - 2.5rem, var(--ttc-container));
	margin-inline: auto;
}

.ttc-product-toolbar {
	padding-top: 4.5rem;
}

.ttc-product-toolbar .ttc-breadcrumb {
	margin-bottom: 1.5rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ttc-product-toolbar .ttc-breadcrumb strong {
	color: var(--ttc-text);
	font-weight: 600;
}

.ttc-product-toolbar .ttc-filters {
	margin-bottom: 3.625rem;
}

.ttc-filters>label {
	margin: 0 !important;
}

.ttc-product-overview {
	display: grid;
	grid-template-columns: minmax(0, 590px) minmax(0, 1fr);
	gap: 40px;
	align-items: start;
}

.ttc-product-gallery__stage {
	position: relative;
	display: grid;
	place-items: center;
	height: 535px;
	border-radius: 10px;
	background: var(--ttc-bg);
	overflow: hidden;
}

/* Anh chinh lap day khung cho to va can doi. Muc phong to duoc chan tren o
   ttc.js: no dat max-width/max-height theo 1.6 lan kich thuoc that, nen anh
   lon hien to het co, con anh nho khong bi keo den muc vo net. */
.ttc-product-gallery__main {
	box-sizing: border-box;
	max-width: calc(100% - 64px);
	max-height: calc(100% - 64px);
	object-fit: contain;
}

.ttc-product-gallery__arrow {
	position: absolute;
	z-index: 1;
	top: 50%;
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	padding: 0 0 4px;
	border: 0;
	border-radius: 50%;
	background: #c7c8cc;
	color: #fff;
	font: 400 35px/1 var(--ttc-font);
	cursor: pointer;
	transform: translateY(-50%);
}

.ttc-product-gallery__arrow--prev {
	left: 16px;
}

.ttc-product-gallery__arrow--next {
	right: 16px;
}

.ttc-product-gallery__thumbs {
	display: grid;
	grid-template-columns: repeat(var(--ttc-thumb-count, 5), 102px);
	gap: 20px;
	margin-top: 16px;
}

.ttc-product-thumb {
	display: grid;
	place-items: center;
	width: 102px;
	height: 102px;
	padding: 8px;
	border: 1px solid #d9dbe0;
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	overflow: hidden;
}

.ttc-product-thumb.is-current {
	padding: 6px;
	border: 2px solid var(--ttc-navy);
}

/* Cung ly do voi anh chinh: dat tran, khong ep kich thuoc. */
.ttc-product-thumb img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}

.ttc-product-summary {
	padding-top: 1px;
}

.ttc-product-summary h1 {
	margin: 0 0 0.65rem;
	color: #000;
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.035em;
}

.ttc-product-summary__price {
	display: inline-block;
	margin-bottom: 0.75rem;
	color: #0075c4;
	font-size: 1.25rem;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
}

.ttc-product-summary__meta {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0 0 1.25rem;
	color: var(--ttc-muted);
	font-size: 0.75rem;
	line-height: 1.4;
}

.ttc-product-summary__meta strong {
	color: var(--ttc-text);
	font-weight: 700;
}

.ttc-product-summary__meta i {
	width: 1px;
	height: 20px;
	background: #d5d6da;
}

.ttc-product-fact {
	margin-bottom: 1rem;
	padding: 1.15rem 1.5rem 1rem;
	border: 1px solid #dedfe4;
	border-radius: 9px;
}

.ttc-product-fact h2 {
	display: flex;
	align-items: center;
	margin: 0 0 0.8rem;
	color: var(--ttc-navy);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.4;
}

.ttc-product-fact ul {
	display: grid;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ttc-product-fact li {
	position: relative;
	padding-left: 1.25rem;
	color: #55585f;
	font-size: 0.8rem;
	line-height: 1.55;
}

.ttc-product-fact li::before {
	content: "✓";
	position: absolute;
	top: 4px;
	left: 0;
	display: grid;
	place-items: center;
	width: 13px;
	height: 13px;
	border-radius: 50%;
	background: #c7c8cc;
	color: #fff;
	font-size: 8px;
	font-weight: 700;
}

.ttc-product-description {
	margin-top: 5rem;
}

.ttc-product-tabs {
	display: grid;
	grid-template-columns: repeat(3, 170px);
	justify-content: center;
}

.ttc-product-tabs button {
	height: 40px;
	padding: 0 1rem;
	border: 1px solid #cfd1d6;
	border-right: 0;
	background: #fff;
	color: var(--ttc-text);
	font-size: 0.75rem;
	font-weight: 600;
}

.ttc-product-tabs button:first-child {
	border-radius: 4px 0 0 4px;
}

.ttc-product-tabs button:last-child {
	border-right: 1px solid #cfd1d6;
	border-radius: 0 4px 4px 0;
}

.ttc-product-tabs button[aria-selected="true"] {
	border-color: var(--ttc-navy);
	background: var(--ttc-navy);
	color: #fff;
}

.ttc-product-description__body {
	max-width: 860px;
	margin: 2.6rem auto 0;
	/* Mo ta nhap tu Sapo con nguyen inline style: float khong duoc clear nen
	   khoi "San pham lien quan" troi len nam canh mo ta. flow-root nuot float
	   lai ben trong panel. */
	display: flow-root;
}

/* ...va width co dinh (900px la hay gap nhat, 102/224 san pham co width >= 100px)
   thi tran ra ngoai khung 860px. Chua o CSS thay vi sua tay 102 ban ghi. */
.ttc-product-description__body [style*="width"],
.ttc-product-description__body [width] {
	max-width: 100% !important;
}

.ttc-product-description__body h2 {
	margin: 0 0 0.75rem;
	color: #000;
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.02em;
}

.ttc-product-description__body p,
.ttc-product-description__body li {
	color: #55585f;
	font-size: 0.9375rem;
	line-height: 1.7;
}

/* `margin: 0` chi dung khi mo ta co dung mot doan roi toi video. San pham nao
   viet nhieu doan thi chung dinh lien nhau thanh mot khoi chu, doc khong ra
   dau la doan moi. Tra lai khoang cach giua cac doan. */
.ttc-product-description__body>p {
	margin: 0 0 1rem;
}

.ttc-product-description__body>p:last-child {
	margin-bottom: 0;
}

.ttc-product-description__body li+li {
	margin-top: 0.5rem;
}

.ttc-product-description__body ul,
.ttc-product-description__body ol {
	margin: 0 0 1rem;
	padding-left: 1.25rem;
}

/* Mo ta duoc bê nguyên tu Sapo nen con nguyen font cua trinh soan thao cu:
   Arial 277 lan, Calibri 194 lan, ca font Han "돋움". Doc xong doan mo ta lai
   nhay sang mot font khac han phan con lai cua trang. Ep ve font cua site;
   `!important` la bat buoc vi font nam trong thuoc tinh style tren tung the. */
.ttc-product-description__body,
.ttc-product-description__body *:not(i):not(.dashicons) {
	font-family: var(--ttc-font) !important;
}

/* Trinh soan thao cu de lai <p></p> va <p>&nbsp;</p> rong — moi cai an mot
   khoang trong giua bai. :empty chi bat duoc cai thu nhat; cai thu hai duoc
   don o phia PHP (ttc_tidy_description). */
.ttc-product-description__body p:empty {
	display: none;
}

/* Mo ta san pham gio render nguyen HTML goc, nen phai lo cho anh, bang va
   iframe do tac gia chen vao — truoc day cac the nay bi scraper boc ra het. */
.ttc-product-description__body img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
}

.ttc-product-description__body iframe {
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
	border: 0;
	border-radius: 8px;
}

.ttc-product-description__body table {
	display: block;
	width: 100%;
	margin: 1.25rem 0;
	overflow-x: auto;
	border-collapse: collapse;
	font-size: 0.875rem;
}

.ttc-product-description__body th,
.ttc-product-description__body td {
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--ttc-line);
	text-align: left;
	vertical-align: top;
}

.ttc-product-description__body th {
	background: #f7f9fb;
	font-weight: 600;
}

.ttc-product-description__body h2,
.ttc-product-description__body h3 {
	margin: 1.75rem 0 0.75rem;
}

.ttc-product-video {
	position: relative;
	height: 484px;
	margin-top: 1.5rem;
	border-radius: 8px;
	background: #ddd;
	overflow: hidden;
}

.ttc-product-video img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: grayscale(1);
}

.ttc-product-video iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

.ttc-product-video__play {
	position: absolute;
	top: 50%;
	left: 50%;
	display: grid;
	place-items: center;
	width: 84px;
	height: 84px;
	padding-left: 5px;
	border-radius: 50%;
	background: #fff;
	color: #000;
	font-size: 22px;
	transform: translate(-50%, -50%);
}

.ttc-product-description__caption {
	margin-top: 1.5rem !important;
	color: #a0a1a6 !important;
}

.ttc-product-more {
	margin-top: 1.8rem;
}

.ttc-product-more ul {
	margin: 0 0 1.75rem;
	padding-left: 1.25rem;
}

.ttc-product-more__image {
	display: block;
	width: 100%;
	height: 436px;
	margin: 0 0 1.25rem;
	border-radius: 8px;
	background: var(--ttc-bg);
	object-fit: contain;
}

.ttc-product-more-toggle {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 2.8rem auto 0;
	padding: 0.5rem 0;
	border: 0;
	background: transparent;
	color: var(--ttc-navy);
	font-size: 0.875rem;
	font-weight: 500;
	cursor: pointer;
}

.ttc-product-more-toggle i {
	width: 7px;
	height: 7px;
	border-right: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
}

.ttc-product-more-toggle[aria-expanded="true"] i {
	transform: translateY(2px) rotate(225deg);
}

.ttc-product-tab-panel[hidden] {
	display: none !important;
}

.ttc-product-specifications {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}

.ttc-product-specifications section {
	padding: 1.25rem;
	border: 1px solid var(--ttc-line);
	border-radius: 8px;
}

.ttc-product-specifications h3 {
	margin: 0 0 0.75rem;
	font-size: 1rem;
}

.ttc-product-specifications ul,
.ttc-product-downloads {
	margin: 0;
	padding-left: 1.25rem;
}

.ttc-product-downloads a {
	color: var(--ttc-navy);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.ttc-product-downloads a:hover {
	color: var(--ttc-navy-deep, #003875);
}

/* Link trong mo ta san pham phai nhin ra la bam duoc.
   Truoc day chi doi mau navy, khong gach chan — tren nen bai dai mau xanh don
   thuan de bi doc nham la chu in dam. */
.ttc-product-description__body a {
	color: var(--ttc-navy);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}

.ttc-product-description__body a:hover {
	color: var(--ttc-navy-deep, #003875);
}

/* Link tro thang toi file PDF thi gan them bieu tuong tai xuong. */
.ttc-product-description__body a[href$=".pdf" i],
.ttc-product-downloads a[href$=".pdf" i] {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
}

.ttc-product-description__body a[href$=".pdf" i]::before,
.ttc-product-downloads a[href$=".pdf" i]::before {
	content: "";
	flex: 0 0 auto;
	width: 15px;
	height: 15px;
	background: currentColor;
	-webkit-mask: var(--ttc-icon-download) center / contain no-repeat;
	mask: var(--ttc-icon-download) center / contain no-repeat;
}

.ttc-product-related {
	margin-top: 3.8rem;
}

.ttc-product-related .ttc-section-title {
	margin-bottom: 2.25rem;
	padding-left: 0.75rem;
	border-left: 4px solid var(--ttc-navy);
	font-size: 1.25rem;
	line-height: 1.25;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: uppercase;
}

.ttc-product-related .woocommerce ul.products {
	margin-bottom: 0 !important;
}

.ttc-product-related+.ttc-support,
.ttc-product-articles+.ttc-support {
	height: auto;
	min-height: 725px;
	margin-top: 2.625rem;
}

.ttc-product-related+.ttc-support .ttc-support__inner,
.ttc-product-articles+.ttc-support .ttc-support__inner {
	height: auto;
	min-height: 725px;
}

body.single-product .ttc-footer__grid {
	min-height: 351px;
	padding-top: 43px;
	padding-bottom: 27px;
}

@media (max-width: 1024px) {
	.ttc-product-overview {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: 2rem;
	}

	.ttc-product-gallery__stage {
		height: auto;
		aspect-ratio: 1 / 1;
	}

	.ttc-product-gallery__main {
		max-width: calc(100% - 36px);
		max-height: calc(100% - 36px);
	}

	.ttc-product-gallery__thumbs {
		grid-template-columns: repeat(var(--ttc-thumb-count, 5), minmax(0, 1fr));
		gap: 0.75rem;
	}

	.ttc-product-thumb {
		width: 100%;
		height: auto;
		aspect-ratio: 1 / 1;
	}
}

@media (max-width: 768px) {
	.ttc-product-shell {
		width: min(100% - 2rem, var(--ttc-container));
	}

	.ttc-product-toolbar {
		padding-top: 2rem;
	}

	.ttc-product-toolbar .ttc-filters {
		margin-bottom: 2rem;
	}

	.ttc-product-gallery__arrow {
		width: 36px;
		height: 36px;
		font-size: 24px;
		padding: 0 0 2px;
	}

	.ttc-product-overview {
		grid-template-columns: 1fr;
	}

	.ttc-product-summary h1 {
		font-size: 1.5rem;
	}

	.ttc-product-description {
		margin-top: 3rem;
	}

	.ttc-product-tabs {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.ttc-product-tabs button {
		height: auto;
		min-height: 44px;
		padding: 0.5rem;
		font-size: 0.65rem;
	}

	.ttc-product-description__body {
		margin-top: 2rem;
	}

	.ttc-product-video {
		height: auto;
		aspect-ratio: 16 / 9;
	}

	.ttc-product-video__play {
		width: 58px;
		height: 58px;
		font-size: 16px;
	}

	.ttc-product-more__image {
		height: auto;
		aspect-ratio: 4 / 3;
	}

	.ttc-product-specifications {
		grid-template-columns: 1fr;
	}

	.ttc-product-related {
		margin-top: 3rem;
	}

	.ttc-product-related+.ttc-support,
.ttc-product-articles+.ttc-support {
		height: auto;
		min-height: 0;
		margin-top: 3rem;
	}

	.ttc-product-related+.ttc-support .ttc-support__inner,
.ttc-product-articles+.ttc-support .ttc-support__inner {
		height: auto;
		min-height: 0;
	}
}

/* —— Technical knowledge archive + article —— */
body.blog #main,
body.single-post #main {
	padding: 0;
}

.ttc-knowledge {
	padding-top: 4.25rem;
	background: var(--ttc-white);
}

.ttc-knowledge a {
	text-decoration: none;
}

/* Dau trang luu tru danh muc bai viet: ten danh muc + mo ta. Trang Kinh nghiem
   ky thuat khong co phan nay — no mo dau bang khoi bai noi bat. */
.ttc-knowledge__head {
	display: grid;
	gap: 0.5rem;
	margin-bottom: 1.75rem;
}

.ttc-knowledge__head h1 {
	margin: 0;
	font-size: clamp(1.5rem, 2.6vw, 2rem);
	line-height: 1.25;
	font-weight: 700;
	color: var(--ttc-text);
}

.ttc-knowledge__desc {
	margin: 0;
	max-width: 68ch;
	color: var(--ttc-muted);
	font-size: 0.98rem;
	line-height: 1.65;
}

.ttc-knowledge__breadcrumb {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	margin-bottom: 2.15rem;
	color: var(--ttc-muted);
	font-size: 0.75rem;
	line-height: 1.4;
}

.ttc-knowledge__breadcrumb a {
	color: var(--ttc-muted);
}

.ttc-knowledge__breadcrumb strong {
	color: var(--ttc-text);
	font-weight: 600;
}

.ttc-knowledge__layout {
	display: grid;
	grid-template-columns: minmax(0, 2.15fr) minmax(280px, 1fr);
	align-items: start;
	gap: 2rem;
}

.ttc-knowledge__layout--sidebar-left {
	direction: rtl;
}

.ttc-knowledge__layout--sidebar-left > * {
	direction: ltr;
}

.ttc-knowledge__layout--no-sidebar {
	grid-template-columns: 1fr;
}

.ttc-knowledge-lead {
	display: grid;
	grid-template-columns: minmax(0, 1.68fr) minmax(250px, 0.82fr);
	gap: 1.5rem;
	margin-bottom: 2.5rem;
}

.ttc-knowledge-lead__feature {
	position: relative;
	display: block;
	height: 430px;
	border-radius: 8px;
	overflow: hidden;
	background: var(--ttc-bg);
}

.ttc-knowledge-lead__feature::after {
	content: "";
	position: absolute;
	inset: 40% 0 0;
	background: linear-gradient(transparent, rgb(0 0 0 / 78%));
}

.ttc-knowledge-lead__feature img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.25s ease;
}

.ttc-knowledge-lead__feature:hover img {
	transform: scale(1.025);
}

.ttc-knowledge-lead__feature h1 {
	position: absolute;
	z-index: 1;
	right: 1.5rem;
	bottom: 1.5rem;
	left: 1.5rem;
	margin: 0;
	color: #fff !important;
	font-size: 1.7rem;
	font-weight: 600;
	line-height: 1.3;
}

.ttc-knowledge-lead__badge {
	position: absolute;
	z-index: 2;
	top: 1rem;
	left: 1rem;
	padding: 0.28rem 0.7rem;
	border-radius: 4px;
	background: var(--ttc-navy);
	color: #fff;
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* Category tabs — shown on mobile (desktop uses the sidebar) */
.ttc-knowledge-tabs {
	display: none;
}

.ttc-knowledge-tabs__item {
	flex: 0 0 auto;
	padding: 0.45rem 1rem;
	border: 1px solid var(--ttc-line);
	border-radius: 999px;
	background: #fff;
	color: var(--ttc-text);
	font-size: 0.82rem;
	font-weight: 600;
	white-space: nowrap;
	text-decoration: none;
}

.ttc-knowledge-tabs__item.is-active {
	background: var(--ttc-navy);
	border-color: var(--ttc-navy);
	color: #fff;
}

.ttc-knowledge-lead__secondary {
	display: grid;
	gap: 1.1rem;
}

.ttc-knowledge-lead__secondary a {
	display: grid;
	grid-template-columns: 46% minmax(0, 1fr);
	align-items: start;
	gap: 1rem;
	color: var(--ttc-text);
}

.ttc-knowledge-lead__secondary img {
	width: 100%;
	height: 118px;
	border-radius: 4px;
	object-fit: cover;
	background: var(--ttc-bg);
}

.ttc-knowledge-lead__secondary h2 {
	margin: 0;
	color: var(--ttc-text) !important;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.4;
}

.ttc-knowledge-list {
	display: grid;
	gap: 1.75rem;
}

/* Duong ke mo giua cac bai — khong co no thi cac hang anh + chu troi lan vao
   nhau, nhat la khi tom tat dai ngan khac nhau. */
.ttc-knowledge-list>.ttc-knowledge-card+.ttc-knowledge-card {
	padding-top: 1.75rem;
	border-top: 1px solid var(--ttc-line);
}

.ttc-knowledge-card {
	display: grid;
	grid-template-columns: 270px minmax(0, 1fr);
	gap: 1.6rem;
	align-items: start;
}

.ttc-knowledge-card__media {
	display: block;
	height: 166px;
	border-radius: 3px;
	overflow: hidden;
	background: var(--ttc-bg);
}

.ttc-knowledge-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.25s ease;
}

.ttc-knowledge-card:hover .ttc-knowledge-card__media img {
	transform: scale(1.035);
}

.ttc-knowledge-card__body {
	padding-top: 0.25rem;
}

/* Bo VIET HOA: tieu de tieng Viet co dau, dai 8-10 tu, viet hoa het thi phai
   danh van tung chu. Chu thuong + dam van noi bat ma doc luot duoc. */
.ttc-knowledge-card h2 {
	margin: 0.3rem 0 0.5rem;
	font-size: 1.15rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: -0.01em;
}

.ttc-knowledge-card__date {
	color: var(--ttc-muted);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.02em;
}

.ttc-knowledge-card__more {
	display: inline-block;
	margin-top: 0.7rem;
	color: var(--ttc-navy);
	font-size: 0.8125rem;
	font-weight: 600;
	opacity: 0;
	transform: translateX(-4px);
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.ttc-knowledge-card:hover .ttc-knowledge-card__more {
	opacity: 1;
	transform: none;
}

.ttc-knowledge-card:hover h2 a {
	color: var(--ttc-navy);
}

.ttc-knowledge-card h2 a {
	color: var(--ttc-text);
}

.ttc-knowledge-card p {
	margin: 0;
	color: var(--ttc-muted);
	font-size: 0.9375rem;
	line-height: 1.6;
}

.blog-sidebar {
	display: grid;
	gap: 2.25rem;
}

/* Cot phai dinh theo man hinh khi cuon.
 *
 * Bai dai nhat cao 18.235px trong khi cot phai chi 838px — cuon qua man hinh
 * dau tien la ben phai trong hoac toi cuoi bai. Header khong dinh (position:
 * relative) nen chi can chua 1.5rem tren dinh.
 *
 * max-height + overflow-y: neu widget dai hon man hinh (man hinh thap, hoac
 * them widget moi) thi phan duoi van xem duoc bang cach cuon trong cot, thay vi
 * bi cat mat. Duoi 769px cot nay bi an nen khong can dinh. */
/* Sidebar sticky removed - shows full content without scrollbar */

.ttc-knowledge-catalog {
	padding: 1.25rem 1.35rem;
	border: 1px solid var(--ttc-line);
	border-radius: 8px;
	background: #fff;
}

.ttc-knowledge-catalog h2 {
	margin: 0 0 0.6rem;
	padding: 0.9rem 1rem;
	border-radius: 4px;
	background: var(--ttc-bg);
	color: var(--ttc-text) !important;
	font-size: 1rem;
	font-weight: 600;
}

.ttc-knowledge-catalog ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ttc-knowledge-catalog a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 46px;
	padding: 0 1rem;
	color: var(--ttc-text);
	font-size: 0.83rem;
	font-weight: 500;
}

.ttc-knowledge-catalog a:hover {
	color: var(--ttc-navy);
}

.ttc-knowledge-catalog i {
	width: 7px;
	height: 7px;
	border-right: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
	transform: rotate(45deg);
}

.ttc-knowledge-popular h2 {
	margin: 0 0 1.2rem;
	color: var(--ttc-text) !important;
	font-size: 1rem;
	font-weight: 600;
}

.ttc-knowledge-popular__list {
	display: grid;
	gap: 1.25rem;
}

.ttc-knowledge-popular__list a {
	display: grid;
	grid-template-columns: 118px minmax(0, 1fr);
	gap: 1rem;
	align-items: start;
	color: var(--ttc-text);
}

.ttc-knowledge-popular__list img {
	width: 118px;
	height: 82px;
	border-radius: 3px;
	object-fit: cover;
	background: var(--ttc-bg);
}

.ttc-knowledge-popular__list strong {
	font-size: 0.88rem;
	font-weight: 600;
	line-height: 1.4;
}

.ttc-knowledge-pagination {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin: 3.5rem 0 0;
}

.ttc-knowledge-pagination .page-numbers {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 7px;
	color: var(--ttc-text);
	font-size: 0.85rem;
	font-weight: 600;
}

.ttc-knowledge-pagination .current {
	background: var(--ttc-navy);
	color: #fff;
}

.ttc-knowledge>.ttc-support {
	margin-top: 5.5rem;
}

/* Article detail */
.ttc-knowledge--detail .ttc-knowledge__layout {
	grid-template-columns: minmax(0, 2.3fr) minmax(280px, 1fr);
}

/* Dự án — trang chi tiết (single ttc_project): cột giữa, không sidebar. */
.ttc-project-detail__body {
	max-width: 860px;
	margin: 0 auto;
	padding-bottom: 3.5rem;
}

.ttc-project-detail__cover {
	margin: 0 0 1.75rem;
	border-radius: 12px;
	overflow: hidden;
}

.ttc-project-detail__cover img {
	display: block;
	width: 100%;
	height: auto;
}

.ttc-project-detail__metrics {
	display: flex;
	flex-wrap: wrap;
	gap: 2.5rem;
	margin: 0 0 2rem;
	padding: 1.25rem 0;
	border-top: 1px solid var(--ttc-line);
	border-bottom: 1px solid var(--ttc-line);
}

.ttc-project-detail__metrics .ttc-home-project__metric strong {
	font-size: 1.5rem;
}

.ttc-article__header {
	margin-bottom: 1.25rem;
}

.ttc-article__header h1 {
	max-width: 850px;
	margin: 0 0 1rem;
	color: var(--ttc-text) !important;
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: -0.035em;
	line-height: 1.25;
}

.ttc-article__meta {
	display: flex;
	align-items: center;
	gap: 0.45rem;
	color: var(--ttc-muted);
	font-size: 0.72rem;
}

.ttc-article__meta time {
	margin-right: auto;
}

.ttc-article__share-label {
	color: var(--ttc-text);
	font-weight: 500;
}

.ttc-article__meta a,
.ttc-article__share a {
	display: grid;
	place-items: center;
	width: 30px;
		height: 30px;
	border: 1px solid var(--ttc-line);
	border-radius: 50%;
	color: var(--ttc-muted);
	font-size: 0.75rem;
	font-weight: 700;
}

.ttc-toc {
	margin: 0 0 1.75rem;
	overflow: hidden;
	border: 1px solid var(--ttc-line);
	border-radius: 12px;
	background: #fff;
}

.ttc-toc__toggle {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	width: 100%;
	padding: 0.9rem 1rem;
	border: 0;
	background: transparent;
	color: var(--ttc-text);
	font: inherit;
	font-size: 1rem;
	font-weight: 600;
	text-align: left;
	cursor: pointer;
	transition: background-color 0.25s ease;
}

.ttc-toc__toggle:hover,
.ttc-toc__toggle:focus-visible {
	background: #edf7fb;
	outline: none;
}

.ttc-toc__icon,
.ttc-toc__chevron {
	flex: 0 0 auto;
	color: var(--ttc-muted);
}

.ttc-toc__title {
	flex: 1;
}

.ttc-toc__chevron {
	transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

.ttc-toc[data-open="true"] .ttc-toc__chevron {
	transform: rotate(180deg);
}

.ttc-toc__panel {
	display: none;
	/* 260px chi hien duoc ~6 muc; bai dai co 24-28 muc nen phai cuon lien tuc. */
	max-height: min(420px, 55vh);
	padding: 0.75rem 0.65rem 1rem 1rem;
	overflow-x: hidden;
	overflow-y: auto;
	overscroll-behavior: contain;
	border-top: 1px solid var(--ttc-line);
	scrollbar-width: thin;
	scrollbar-color: rgb(0 102 153 / 32%) transparent;
}

.ttc-toc[data-open="true"] .ttc-toc__panel {
	display: block;
}

.ttc-toc__panel::-webkit-scrollbar {
	width: 6px;
}

.ttc-toc__panel::-webkit-scrollbar-thumb {
	background: rgb(0 102 153 / 28%);
	border-radius: 99px;
}

.ttc-toc__list {
	display: grid;
	gap: 0.15rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ttc-toc__item--h3 {
	padding-left: 1.25rem;
}

.ttc-toc__list a {
	display: block;
	padding: 0.5rem 0.55rem;
	border-radius: 6px;
	color: #4b4d53;
	font-size: 0.875rem;
	font-weight: 400;
	line-height: 1.4;
	transition: background-color 0.25s ease, color 0.25s ease;
}

.ttc-toc__list a:hover,
.ttc-toc__list a:focus-visible {
	background: #edf7fb;
	color: var(--ttc-navy);
	outline: none;
}

.ttc-toc__list a.is-active {
	color: var(--ttc-navy);
	font-weight: 600;
}

.ttc-toc__num {
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.ttc-article__content {
	color: #4b4d53;
	font-size: 0.9rem;
	line-height: 1.6;
}

.ttc-article__content h2,
.ttc-article__content h3,
.ttc-article__content h4 {
	scroll-margin-top: 7.5rem;
}

.ttc-article__content .rte {
	max-width: none;
}

.ttc-article__content p {
	margin: 0 0 0.85rem;
}

/* Anh trong bai viet giu dung kich thuoc that.
 *
 * Truoc day rule nay ep `width: 100%` + `height: clamp(260px, 39vw, 570px)` +
 * `object-fit: cover`: anh nao cung bi keo cang bang chieu rong cot roi cat cup
 * cho vua mot khung cao co dinh. Anh nho thi vo net, anh cao thi mat dau mat
 * duoi. Chi chan tran theo be ngang cot, con lai de anh tu quyet. */
.ttc-article__content img {
	display: block;
	max-width: 100%;
	width: auto;
	height: auto;
	margin: 0 0 1.25rem;
	border-radius: 2px;
}

/* 165/233 anh trong bai dung mot minh trong mot the <p> — do la hinh minh hoa.
   ttc_pair_image_captions() gom chung (kem chu thich neu co) vao <figure>. */
.ttc-article__content p>img:only-child {
	margin-inline: auto;
}

.ttc-article__figure {
	margin: 0 0 1.75rem;
	text-align: center;
}

.ttc-article__figure img {
	margin: 0 auto 0.75rem;
}

.ttc-article__figure figcaption {
	color: var(--ttc-muted, #6b7280);
	font-size: 0.8125rem;
	line-height: 1.5;
	font-style: italic;
}

.ttc-article__figure figcaption p {
	margin: 0;
}

/* 21 anh con lai nam chung dong voi chu (icon, ky hieu). `display: block` o tren
   se day chung xuong dong rieng; tra ve inline de chay theo mach chu. */
.ttc-article__content p img:not(:only-child) {
	display: inline-block;
	margin: 0 0.25rem;
	vertical-align: middle;
}

/* Trong bang thi o da co padding roi, khong can khoang cach duoi anh. */
.ttc-article__content td img,
.ttc-article__content th img {
	margin-bottom: 0;
}

.ttc-article__content h2 {
	margin: 1.1rem 0 0.7rem;
	color: var(--ttc-text) !important;
	font-size: 1.4rem;
	font-weight: 600;
	line-height: 1.35;
}

.ttc-article__content h3,
.ttc-article__content h4 {
	margin: 1rem 0 0.55rem;
	color: var(--ttc-text) !important;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.4;
}

.ttc-article__content ul,
.ttc-article__content ol {
	margin: 0 0 1rem;
	padding-left: 1.25rem;
}

.ttc-article__content table {
	display: block;
	max-width: 100%;
	overflow-x: auto;
	border-collapse: collapse;
}

.ttc-article__content th,
.ttc-article__content td {
	padding: 0.5rem;
	border: 1px solid var(--ttc-line);
}

/* ============================================================
   Cẩm nang kỹ thuật — nhịp chữ cho bài đọc dài
   ------------------------------------------------------------
   Do duoc truoc khi sua: chu 14.4px, dong dai 121 ky tu, tieu de h2 chi
   cach doan tren 17px. Ba con so do la ly do bai doc met: chu nho, dong
   qua dai (nguong de doc la 60-80 ky tu), va cac muc dinh lien nhau
   thanh mot khoi.
   ============================================================ */

.ttc-article__content {
	color: #3d4046;
	font-size: 1.0625rem;
	line-height: 1.75;
}

/* Chan be ngang cua CHU thay vi cua ca khung: doan van dung lai o ~46rem
   (khoang 72 ky tu moi dong) con anh va bang van duoc dung tron 870px.
   Noi dung bai duoc boc trong .rte nen phai nhac ca hai cap. */
.ttc-article__content> :is(p, ul, ol, blockquote, h2, h3, h4),
.ttc-article__content>.rte> :is(p, ul, ol, blockquote, h2, h3, h4) {
	max-width: 46rem;
}

.ttc-article__content p {
	margin: 0 0 1.15rem;
}

/* Doan mo dau doc to hon mot chut, dan mat vao bai. */
.ttc-article__content>p:first-of-type,
.ttc-article__content>.rte>p:first-of-type {
	color: #33363c;
	font-size: 1.125rem;
	line-height: 1.7;
}

/* Ba cap tieu de phai phan biet duoc bang mat: h2 to va den dam, h3 nho hon
   van den, h4 cung co chu nhung doi mau navy — neu de ca ba cung den cung
   dam thi h3 va h4 nhin nhu nhau. */
.ttc-article__content h2 {
	margin: 2.75rem 0 0.85rem;
	color: #1a1d22 !important;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.015em;
}

.ttc-article__content h3 {
	margin: 2rem 0 0.6rem;
	color: #1a1d22 !important;
	font-size: 1.2rem;
	font-weight: 700;
	line-height: 1.4;
}

.ttc-article__content h4 {
	margin: 1.75rem 0 0.45rem;
	color: var(--ttc-navy) !important;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.45;
}

/* Bam mot muc trong muc luc thi tieu de phai dung duoi header dinh, khong
   bi che khuat. */
.ttc-article__content :is(h2, h3, h4) {
	scroll-margin-top: 7.5rem;
}

.ttc-article__content :is(ul, ol) {
	margin: 0 0 1.15rem;
	padding-left: 1.35rem;
}

.ttc-article__content li {
	margin-bottom: 0.45rem;
}

.ttc-article__content li::marker {
	color: var(--ttc-navy);
}

.ttc-article__content strong {
	color: #23262b;
	font-weight: 700;
}

.ttc-article__content a:not(.ttc-btn) {
	color: var(--ttc-navy);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}

/* Bang thong so: 8 bang trong 22 bai, truoc day khong co vien dau bang
   nen doc lech hang.
 *
 * `width: 100%` la sai o day. Bang van dang `display: block` (de cuon ngang
 * duoc), nen 100% keo cai khung block ra du 870px trong khi noi dung that chi
 * rong 389-661px — thua ra mot manh vien trong ben phai. `max-content` cho
 * khung co dung bang be ngang that, `max-width: 100%` van chan khong cho bang
 * rong tran ra ngoai cot. */
.ttc-article__content table {
	width: max-content;
	max-width: 100%;
	margin: 0 0 1.5rem;
	font-size: 0.9375rem;
}

.ttc-article__content :is(td, th) {
	padding: 0.6rem 0.8rem;
	border: 1px solid var(--ttc-line);
	text-align: left;
	vertical-align: top;
}

.ttc-article__content th,
.ttc-article__content tr:first-child td {
	background: #f7f9fb;
	font-weight: 700;
}

/* Muc luc dung tron be ngang cot bai (870px) chu khong bo theo khoi chu 46rem
   — no la mot khoi dieu huong rieng, thu lai bang doan van thi nhin cut. */
.ttc-article .ttc-toc {
	max-width: none;
}

.ttc-article__header {
	margin-bottom: 1.75rem;
}

@media (max-width: 768px) {
	.ttc-article__content {
		font-size: 1rem;
	}

	.ttc-article__content>p:first-of-type,
	.ttc-article__content>.rte>p:first-of-type {
		font-size: 1.0625rem;
	}

	.ttc-article__content h2 {
		margin-top: 2rem;
		font-size: 1.3rem;
	}

	.ttc-article__content h3 {
		margin-top: 1.5rem;
		font-size: 1.075rem;
	}
}

.ttc-article__author {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-top: 2rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--ttc-line);
	font-size: 0.75rem;
}

.ttc-article__author>span {
	color: var(--ttc-muted);
}

.ttc-article__author strong {
	font-weight: 600;
}

.ttc-article__share {
	display: flex;
	align-items: center;
	gap: 0.45rem;
	margin-left: auto;
	color: var(--ttc-muted);
}

.ttc-knowledge-related {
	width: 100vw;
	margin: 4.5rem calc(50% - 50vw) 0;
	padding: 3.25rem 0;
	background: var(--ttc-bg);
}

.ttc-knowledge-related h2 {
	margin: 0 0 2rem;
	text-align: center;
	color: var(--ttc-text) !important;
	font-size: 1.75rem;
	font-weight: 600;
}

.ttc-knowledge-related__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.5rem;
}

.ttc-knowledge-related article {
	border: 1px solid var(--ttc-line);
	background: #fff;
}

.ttc-knowledge-related article a {
	display: block;
	height: 100%;
	padding: 0.75rem;
	color: var(--ttc-text);
}

.ttc-knowledge-related img {
	width: 100%;
	height: 210px;
	object-fit: cover;
	background: #fff;
}

.ttc-knowledge-related h3 {
	margin: 0.9rem 0 0.5rem;
	color: var(--ttc-text) !important;
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1.4;
	text-transform: uppercase;
}

.ttc-knowledge-related p {
	margin: 0;
	color: var(--ttc-muted);
	font-size: 0.75rem;
	line-height: 1.5;
}

.ttc-knowledge-related__all {
	display: flex;
	align-items: center;
	justify-content: center;
	width: max-content;
	min-width: 126px;
	height: 42px;
	margin: 2rem auto 0;
	border: 1px solid #bfc1c6;
	border-radius: 999px;
	color: var(--ttc-text);
	font-size: 0.8rem;
	font-weight: 600;
}

.ttc-knowledge-related+.ttc-support {
	margin-top: 0;
}

@media (max-width: 1024px) {

	.ttc-knowledge__layout,
	.ttc-knowledge--detail .ttc-knowledge__layout {
		grid-template-columns: minmax(0, 1fr) 280px;
	}

	.ttc-knowledge-lead {
		grid-template-columns: 1.4fr 0.8fr;
	}

	.ttc-knowledge-card {
		grid-template-columns: 220px minmax(0, 1fr);
	}
}

@media (max-width: 768px) {
	.ttc-nav-toggle {
		border-color: var(--ttc-line);
		color: var(--ttc-text);
	}

	.ttc-knowledge {
		padding-top: 2rem;
	}

	.ttc-knowledge-tabs {
		display: flex;
		gap: 0.5rem;
		margin-bottom: 1.5rem;
		padding-bottom: 0.25rem;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.ttc-knowledge-tabs::-webkit-scrollbar {
		display: none;
	}

	.ttc-knowledge__layout,
	.ttc-knowledge--detail .ttc-knowledge__layout,
	.ttc-knowledge-lead {
		grid-template-columns: 1fr;
	}

	.ttc-knowledge-lead__feature {
		height: auto;
		aspect-ratio: 16 / 10;
	}

	.ttc-knowledge-lead__feature h1 {
		right: 1rem;
		bottom: 1rem;
		left: 1rem;
		font-size: 1.2rem;
	}

	/* Image-top cards to match the mobile design */
	.ttc-knowledge-lead__secondary a,
	.ttc-knowledge-card {
		grid-template-columns: 1fr;
		gap: 0.75rem;
	}

	.ttc-knowledge-lead__secondary img,
	.ttc-knowledge-card__media {
		height: 200px;
	}

	.ttc-knowledge-card h2 {
		margin-bottom: 0.5rem;
		font-size: 1rem;
		text-transform: none;
	}

	.ttc-knowledge-card p {
		display: -webkit-box;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		font-size: 0.85rem;
	}

	/* On mobile the top tabs replace the sidebar (categories + popular) */
	.blog-sidebar {
		display: none;
	}

	.ttc-article__header h1 {
		font-size: 1.6rem;
	}

	.ttc-article__meta {
		flex-wrap: wrap;
	}

	.ttc-article__meta time {
		width: 100%;
	}

	.ttc-knowledge-related__grid {
		grid-template-columns: 1fr;
	}

	.ttc-knowledge-related img {
		height: auto;
		aspect-ratio: 16 / 9;
	}
}

/* —— FAQs —— */
body.page-faqs #main {
	padding: 0;
}

.ttc-faq-page:not(.wp-block-cover) {
	min-height: 1160px;
	background: var(--ttc-faq-bg) center / cover no-repeat;
	color: #fff;
}

.ttc-faq-page__overlay {
	min-height: inherit;
	padding: 4.25rem 0 5rem;
	background: linear-gradient(180deg, rgb(0 20 35 / 54%) 0%, rgb(0 14 26 / 46%) 58%, rgb(0 14 26 / 62%) 100%);
}

.ttc-faq-page__content {
	display: grid;
	justify-items: center;
}

.ttc-faq-intro {
	max-width: 850px;
	margin-bottom: 2.4rem;
	text-align: center;
}

.ttc-faq-intro h1 {
	margin: 0 0 1rem;
	color: #fff !important;
	font-size: 2.5rem;
	font-weight: 600;
	letter-spacing: -0.03em;
	line-height: 1.2;
}

.ttc-faq-intro>p {
	margin: 0 auto;
	color: rgb(255 255 255 / 88%) !important;
	font-size: 1rem;
	line-height: 1.5;
}

.ttc-faq-intro .ttc-faq-phone {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.65rem;
	margin-top: 1.35rem;
	color: #fff !important;
	font-size: 1.25rem;
	font-weight: 500;
}

.ttc-faq-phone::before {
	content: "";
	width: 22px;
	height: 22px;
	background: currentColor;
	clip-path: polygon(9% 0, 32% 0, 42% 24%, 29% 39%, 40% 57%, 59% 69%, 74% 55%, 100% 67%, 100% 90%, 87% 100%, 62% 95%, 36% 80%, 14% 56%, 2% 30%);
	opacity: 0.8;
}

.ttc-faq-list {
	width: min(100%, 800px);
	counter-reset: ttc-faq;
}

.ttc-faq-list details {
	counter-increment: ttc-faq;
	margin-bottom: 0.65rem;
	border-radius: 8px;
	background: #fff;
	opacity: 0.925;
	color: var(--ttc-text);
	box-shadow: 0 3px 12px rgb(0 0 0 / 8%);
	overflow: hidden;
}

.ttc-faq-list summary {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 0.45rem;
	margin: 0;
	min-height: 62px;
	padding: 1rem 1.45rem;
	color: var(--ttc-text);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.4;
	cursor: pointer;
	list-style: none;
}

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

.ttc-faq-list summary::before {
	content: counter(ttc-faq) ".";
}

.ttc-faq-list summary::after {
	content: "+";
	color: #9b9da3;
	font-size: 1.5rem;
	font-weight: 400;
	line-height: 1;
}

.ttc-faq-list details[open] summary {
	padding-bottom: 0.45rem;
}

.ttc-faq-list details[open] summary::after {
	content: "−";
	color: var(--ttc-text);
}

.ttc-faq-answer {
	padding: 0 1.45rem 1.15rem;
	color: #5e6067;
	font-size: 0.875rem;
	line-height: 1.55;
}

.ttc-faq-answer p {
	margin: 0 0 0.35rem;
	color: inherit !important;
}

.ttc-faq-answer p:last-child,
.ttc-faq-answer ul:last-child {
	margin-bottom: 0;
}

.ttc-faq-answer ul {
	margin: 0;
	padding-left: 1.15rem;
}

@media (max-width: 768px) {
	.ttc-faq-page {
		min-height: 0;
		background-position: 42% center;
	}

	.ttc-faq-page__overlay {
		padding: 2.75rem 0 3rem;
	}

	.ttc-faq-intro {
		margin-bottom: 1.75rem;
	}

	.ttc-faq-intro h1 {
		font-size: 1.8rem;
	}

	.ttc-faq-intro>p {
		font-size: 0.875rem;
	}

	.ttc-faq-intro .ttc-faq-phone {
		font-size: 1rem;
	}

	.ttc-faq-list summary {
		min-height: 58px;
		padding: 0.85rem 1rem;
		font-size: 0.875rem;
	}

	.ttc-faq-answer {
		padding: 0 1rem 1rem;
		font-size: 0.8rem;
	}
}

/* —— Careers (Gutenberg blocks) —— */
body.page-tuyen-dung #main,
body.page-id-906 #main {
	padding: 0;
}

.ttc-page:has(.ttc-careers) {
	padding: 0;
	max-width: none;
	width: 100%;
}

.ttc-careers {
	background: #fff;
}

.ttc-careers>.wp-block-group {
	margin-block: 0 !important;
}

.ttc-careers .wp-block-heading,
.ttc-careers p {
	margin-block-start: 0;
}

.ttc-careers__hero {
	padding: 4.5rem 1.25rem 2.75rem !important;
	background: linear-gradient(135deg, #f4f9fc, #fff 70%);
	max-width: none !important;
}

.ttc-careers__hero>.wp-block-columns,
.ttc-careers__hero-grid {
	max-width: var(--ttc-container, 1280px);
	margin-inline: auto;
	display: grid !important;
	grid-template-columns: minmax(0, 0.88fr) minmax(360px, 1.12fr);
	align-items: center;
	gap: 3rem 4.5rem !important;
}

.ttc-careers__hero-grid.wp-block-columns {
	flex-wrap: nowrap !important;
}

.ttc-careers__hero-copy {
	max-width: 570px;
}

.ttc-careers__eyebrow {
	margin: 0 0 0.75rem !important;
	color: var(--ttc-navy) !important;
	font-size: 0.72rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.ttc-careers h1,
.ttc-careers h2,
.ttc-careers h3,
.ttc-careers .wp-block-heading {
	color: var(--ttc-text) !important;
}

/* Band ứng tuyển [ttc_apply_form] trên nền navy tối: màu chữ trắng + reset
   layout của band được xử lý tập trung ở khối ".ttc-careers .ttc-support" cuối file. */

.ttc-careers__hero h1,
.ttc-careers__hero .wp-block-heading {
	margin: 0 !important;
	font-size: clamp(2.1rem, 4vw, 3.6rem) !important;
	font-weight: 600 !important;
	letter-spacing: -0.055em;
	line-height: 1.08 !important;
}

.ttc-careers__hero-copy>p:not(.ttc-careers__eyebrow) {
	max-width: 530px;
	margin: 1.5rem 0 0 !important;
	color: var(--ttc-muted) !important;
	line-height: 1.7;
}

.ttc-careers__actions {
	gap: 1.25rem;
	margin-top: 2rem;
}

.ttc-careers__contact .wp-block-button__link {
	color: var(--ttc-text) !important;
	font-size: 0.85rem;
	font-weight: 600;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding-inline: 0 !important;
	min-height: auto !important;
}

.ttc-careers__hero-image {
	margin: 0;
	min-height: 0;
	box-shadow: none;
}

.ttc-careers__hero-image img {
	display: block;
	width: 100%;
	min-height: 440px;
	border-radius: 10px;
	object-fit: cover;
	box-shadow: 0 22px 50px rgb(0 29 61 / 14%);
}

.ttc-careers__section-heading {
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	gap: 1rem 4rem;
	align-items: end;
	margin-bottom: 2.5rem;
}

.ttc-careers__section-heading .ttc-careers__eyebrow {
	grid-column: 1 / -1;
}

.ttc-careers__section-heading h2,
.ttc-careers__section-heading .wp-block-heading {
	margin: 0 !important;
	font-size: clamp(1.8rem, 3vw, 2.6rem) !important;
}

.ttc-careers__section-heading>p:last-child {
	margin: 0 !important;
	color: var(--ttc-muted) !important;
	line-height: 1.65;
}

.ttc-careers__openings {
	padding: 2rem 1.25rem 4.5rem;
	background: #fff;
	max-width: none !important;
}

.ttc-careers__openings>.ttc-careers__openings-head,
.ttc-careers__openings>.ttc-careers__jobs {
	max-width: var(--ttc-container, 1280px);
	margin-inline: auto;
}

.ttc-careers__openings-head {
	margin-bottom: 1.75rem;
	width: 100%;
	max-width: 40rem;
}

.ttc-careers__openings-head h2,
.ttc-careers__openings-head .wp-block-heading {
	margin: 0 !important;
	font-size: clamp(1.8rem, 3vw, 2.6rem) !important;
}

.ttc-careers__openings-head p:not(.ttc-careers__eyebrow) {
	max-width: 36rem;
	margin: 0.7rem 0 0 !important;
	color: var(--ttc-muted) !important;
	line-height: 1.65;
}

.ttc-careers__jobs {
	display: grid;
	gap: 1rem;
}

.ttc-careers__job {
	gap: 1rem 2rem;
	width: 100%;
	margin: 0 !important;
	padding: 1.5rem 1.75rem;
	border: 1px solid var(--ttc-line);
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 10px 30px -24px rgb(0 29 61 / 45%);
	transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.ttc-careers__job .wp-block-buttons {
	flex: none;
}

.ttc-careers__job:hover {
	border-color: rgb(0 102 153 / 35%);
	box-shadow: 0 16px 36px -22px rgb(0 29 61 / 42%);
}

.ttc-careers__job h3,
.ttc-careers__job .wp-block-heading {
	margin: 0 0 0.35rem !important;
	font-size: 1.05rem !important;
	font-weight: 700 !important;
}

.ttc-careers__job p {
	margin: 0 !important;
	color: var(--ttc-muted) !important;
	font-size: 0.875rem;
	line-height: 1.55;
}

.ttc-careers__job-meta {
	margin-top: 0.65rem !important;
	color: var(--ttc-navy) !important;
	font-size: 0.75rem !important;
	font-weight: 600 !important;
}

@media (max-width: 1024px) {

	.ttc-careers__hero>.wp-block-columns,
	.ttc-careers__hero-grid {
		grid-template-columns: minmax(0, 1fr) !important;
		flex-direction: column !important;
	}

	.ttc-careers__hero-copy,
	.ttc-careers__hero-image {
		min-width: 0;
		max-width: 100%;
	}

	.ttc-careers__section-heading {
		grid-template-columns: 1fr !important;
	}

	.ttc-careers__hero-image,
	.ttc-careers__hero-image img {
		min-height: 0;
		max-width: 100%;
		aspect-ratio: 4 / 3;
	}
}

@media (max-width: 768px) {
	.ttc-careers__hero {
		padding: 2.5rem 1rem 3rem !important;
	}

	.ttc-careers__actions {
		flex-direction: column;
		align-items: flex-start;
	}

	.ttc-careers__job {
		flex-direction: column;
		align-items: stretch;
	}

	.ttc-careers__openings {
		padding: 2.5rem 1rem 3rem;
	}
}

/* —— Marketing homepage (Gutenberg page content) —— */
body.home.page .hero-section,
body.home.page .ct-container-full>article>.entry-header,
body.home.page .entry-header,
body.home.page .ct-page-title-default {
	display: none !important;
}

body.home.page #main-container>main,
body.home.page main.ttc-page--home {
	padding: 0 !important;
	max-width: none !important;
	width: 100%;
}

body.home.page .entry-content,
body.home.page .ct-container-full .entry-content,
body.home.page .wp-block-post-content,
body.home.page main.ttc-page--home>.ttc-home,
body.home.page main.ttc-page--home>.wp-block-group.ttc-home {
	max-width: none !important;
	width: 100%;
	margin: 0;
	padding: 0;
}

/* Never inherit knowledge article column on the homepage */
body.home.page .ttc-knowledge,
body.home.page .ttc-knowledge__layout,
body.home.page .ttc-article,
body.home.page .ttc-container:has(> .ttc-knowledge__layout) {
	display: contents;
}

body.home.page .ttc-knowledge__breadcrumb,
body.home.page .ttc-article__header,
body.home.page .ttc-article__author,
body.home.page .ttc-article__meta,
body.home.page .blog-sidebar,
body.home.page .ttc-knowledge-related {
	display: none !important;
}

.ttc-page {
	width: 100%;
	max-width: none;
}

/* `max-width: none` o tren la co chu y: trang dung bang block tu mang container
   rieng, va vai block can tran vien. Nhung trang co noi dung HTML thuan (soan
   bang trinh soan thao co dien, khong co the .wp-block-* nao boc) thi khong con
   gi gioi han be rong — chu chay sat mep man hinh. Gioi han rieng cho cac the
   van ban la con truc tiep; block Gutenberg khong khop selector nen khong dung toi. */
.ttc-page> :is(h1, h2, h3, h4, h5, h6, p, ul, ol, dl, blockquote, pre, table, figure, hr, address) {
	width: min(100% - 2rem, var(--ttc-container));
	margin-inline: auto;
}

.ttc-page> :is(h1, h2, h3, h4, h5, h6, p, ul, ol, dl, blockquote, pre, table, figure, address):first-child {
	margin-top: clamp(2rem, 4vw, 3.5rem);
}

.ttc-page> :is(h1, h2, h3, h4, h5, h6, p, ul, ol, dl, blockquote, pre, table, figure, address):last-child {
	margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
}

.ttc-page--home {
	background: #fff;
}

.ttc-home {
	background: #fff;
}

.ttc-home>.wp-block-group,
.ttc-home .alignwide,
.ttc-home .alignfull {
	max-width: none;
}

.ttc-home-knowledge.wp-block-group {
	width: 100%;
}

.ttc-home-knowledge__heading {
	margin: 0 0 2.5rem !important;
	color: var(--ttc-text) !important;
	font-size: clamp(1.6rem, 2.4vw, 2rem) !important;
	font-weight: 700 !important;
	letter-spacing: -0.03em;
	text-align: left;
}

.ttc-home-knowledge .wp-block-buttons {
	margin-top: 2.5rem;
}

.ttc-home-section {
	padding: 2.5rem 1.25rem;
}

.ttc-home-section__head {
	margin-bottom: 2.5rem;
	text-align: center;
}

.ttc-home-section__head h2 {
	margin: 0;
	color: var(--ttc-text) !important;
	font-size: clamp(1.6rem, 2.4vw, 2rem);
	font-weight: 700;
	letter-spacing: -0.03em;
}

/* Chi ap cho doan mo ta. `.ttc-home-link` cung la the <p> trong dau muc —
   margin ngang `auto` se nuot het khoang trong va keo no vao giua, pha
   `justify-content: space-between` khien "Xem tat ca" khong con sat mep phai. */
.ttc-home-section__head p:not(.ttc-home-link) {
	max-width: 42rem;
	color: var(--ttc-muted) !important;
	line-height: 1.6;
}

.ttc-home-section__head--row {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 1rem;
	text-align: left;
}

.ttc-home-section__head--row h2 {
	margin: 0;
}

.ttc-home-section__head--left {
	text-align: left;
}

.ttc-home-link {
	color: var(--ttc-navy);
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.ttc-home-section__cta {
	display: flex;
	justify-content: center;
	margin-top: 2.5rem;
}

.ttc-home-eyebrow {
	margin: 0 0 0.5rem;
	color: var(--ttc-navy) !important;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ttc-home-hero:not(.wp-block-cover) {
	display: grid;
	place-items: center;
	min-height: min(78vh, 640px);
	padding: 5rem 1.5rem;
	background:
		linear-gradient(180deg, rgb(0 20 40 / 62%) 0%, rgb(0 20 40 / 48%) 100%),
		var(--ttc-home-hero) center / cover no-repeat;
	color: #fff;
	text-align: center;
}

.ttc-home-hero__inner {
	max-width: 820px;
}

.ttc-home-hero h1 {
	margin: 0 0 1rem;
	color: #fff !important;
	font-size: clamp(1.8rem, 4vw, 3rem);
	font-weight: 700;
	letter-spacing: -0.04em;
	line-height: 1.15;
}

.ttc-home-hero p {
	max-width: 40rem;
	margin: 0 auto 1.75rem;
	color: rgb(255 255 255 / 90%) !important;
	font-size: 1rem;
	line-height: 1.65;
}

.ttc-home-cats__grid {
	display: grid;
	grid-template-columns: repeat(8, minmax(0, 1fr));
	gap: 1.25rem 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ttc-home-cats__grid a {
	display: grid;
	justify-items: center;
	gap: 0.75rem;
	color: var(--ttc-text);
	text-decoration: none;
	text-align: center;
}

.ttc-home-cats__icon {
	display: grid;
	place-items: center;
	width: 96px;
	height: 96px;
	overflow: hidden;
	border-radius: 16px;
	background: var(--ttc-bg);
	border: 0;
}

.ttc-home-cats__icon img {
	width: 88%;
	height: 88%;
	object-fit: contain;
}

.ttc-home-cats__label {
	font-size: 0.78rem;
	font-weight: 600;
	line-height: 1.35;
}

.ttc-home-brands__grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 1rem 1.25rem;
}

.ttc-home-brands__tile {
	display: grid;
	place-items: center;
	min-height: 72px;
	padding: 0.75rem;
	border: 1px solid var(--ttc-line);
	border-radius: 8px;
	background: #fff;
}

.ttc-home-brands__tile img {
	max-width: min(100%, 120px);
	max-height: 36px;
	object-fit: contain;
}

.ttc-home-about__grid {
	display: grid !important;
	grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
	gap: 3.5rem !important;
	align-items: center;
}

.ttc-home-about__media {
	position: relative;
}

.ttc-home-about__img {
	margin: 0;
}

.ttc-home-about__img img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 420px;
	max-height: 480px;
	object-fit: cover;
	border-radius: 12px;
	box-shadow: 0 18px 40px rgb(0 29 61 / 16%);
}

.ttc-home-about__subtitle {
	margin: 0 0 0.75rem;
	color: var(--ttc-text) !important;
	font-size: 1.35rem;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.ttc-home-about__body {
	margin: 0 0 1.5rem;
	color: var(--ttc-muted) !important;
	line-height: 1.7;
}

.ttc-home-about__values {
	margin: 0 0 1.75rem;
	padding: 1.35rem 1.4rem;
	border: 1px solid var(--ttc-line);
	border-radius: 12px;
	background: var(--ttc-bg);
}

.ttc-home-about__values-title {
	margin: 0 0 1rem;
	color: var(--ttc-text) !important;
	font-size: 0.95rem;
	font-weight: 700;
}

.ttc-home-about__values ul {
	display: grid;
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ttc-home-about__values li {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 0.85rem;
	align-items: start;
}

.ttc-home-about__values-icon {
	display: grid;
	place-items: center;
	width: 1.75rem;
	height: 1.75rem;
	border-radius: 50%;
	background: var(--ttc-navy);
	color: #fff;
}

.ttc-home-about__values-text {
	display: grid;
	gap: 0.15rem;
}

.ttc-home-about__values-text strong {
	color: var(--ttc-text);
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.35;
}

.ttc-home-about__values-text em {
	color: var(--ttc-muted);
	font-style: normal;
	font-size: 0.85rem;
	line-height: 1.5;
}

.ttc-home-about__stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
	margin-bottom: 1.75rem;
}

.ttc-home-about__stats strong {
	display: block;
	color: var(--ttc-navy) !important;
	font-size: 1.75rem;
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.1;
}

.ttc-home-about__stats span,
.ttc-home-about__stats p {
	margin: 0;
	color: var(--ttc-muted) !important;
	font-size: 0.78rem;
	line-height: 1.35;
}

.ttc-home-about>.wp-block-heading {
	margin: 0 0 0.85rem;
	color: var(--ttc-text) !important;
	font-size: clamp(1.6rem, 2.4vw, 2rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	text-align: center;
}

.ttc-home-about>p.has-text-align-center {
	max-width: 42rem;
	margin: 0 auto 2.5rem;
	color: var(--ttc-muted) !important;
	line-height: 1.6;
}

.ttc-home-about__copy>.wp-block-columns,
.ttc-home-about__stats {
	margin-top: 0 !important;
	margin-bottom: 1.75rem !important;
}

.ttc-home-about__stats.wp-block-columns {
	display: grid !important;
	align-items: start !important;
}

.ttc-home-about__stats .wp-block-column {
	margin: 0 !important;
}

/* Core-values panel — core-block markup (Group per value). The check icon is
   drawn in CSS so the client only types the title + description. */
.ttc-home-about__values .wp-block-group {
	margin: 0;
}

.ttc-home-about__value {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 0.85rem;
	align-items: start;
}

.ttc-home-about__value+.ttc-home-about__value {
	margin-top: 1rem;
}

.ttc-home-about__value::before {
	content: "";
	width: 1.75rem;
	height: 1.75rem;
	border-radius: 50%;
	background: var(--ttc-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center / 0.9rem 0.9rem no-repeat;
}

.ttc-home-about__value-text {
	display: grid;
	gap: 0.15rem;
}

.ttc-home-about__value-title {
	margin: 0;
	color: var(--ttc-text) !important;
	font-size: 0.95rem;
	line-height: 1.35;
}

.ttc-home-about__value-title strong {
	font-weight: 600;
}

.ttc-home-about__value-desc {
	margin: 0;
	color: var(--ttc-muted) !important;
	font-size: 0.85rem;
	line-height: 1.5;
}

.ttc-home-about__stat-num {
	margin: 0 !important;
}

.ttc-home-products__banner {
	margin: 0 0 2rem;
	overflow: hidden;
	border-radius: 10px;
}

.ttc-home-products__banner img {
	display: block;
	width: 100%;
	height: clamp(180px, 28vw, 360px);
	object-fit: cover;
}

.ttc-home-products__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ttc-home-product {
	display: flex;
	flex-direction: column;
	padding: 0 0 1.15rem;
	border: 1px solid var(--ttc-line);
	border-radius: 10px;
	background: #fff;
	overflow: hidden;
	transform: translateY(0);
	transition:
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		border-color 0.35s ease,
		background-color 0.35s ease;
}

.ttc-home-product__media {
	display: block;
	background: #f3f5f8;
}

.ttc-home-product__media img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: contain;
	padding: 0.5rem;
	box-sizing: border-box;
}

.ttc-home-product__brand {
	display: inline-flex;
	align-items: center;
	min-height: 28px;
	margin: 1rem 1rem 0;
}

.ttc-home-product__brand img {
	height: 18px;
	width: auto;
	max-width: 90px;
	object-fit: contain;
}

.ttc-home-product__brand--text {
	color: var(--ttc-navy);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.04em;
}

.ttc-home-product h3 {
	margin: 0.65rem 1rem 0;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.4;
}

.ttc-home-product h3 a {
	color: var(--ttc-text);
	text-decoration: none;
}

.ttc-home-product__more {
	margin: auto 1rem 0;
	padding-top: 0.85rem;
	color: var(--ttc-navy);
	font-size: 0.85rem;
	font-weight: 600;
	text-decoration: none;
}

.ttc-home-projects__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ttc-home-project {
	overflow: hidden;
	border: 1px solid var(--ttc-line);
	border-radius: 10px;
	background: #fff;
}

.ttc-home-project__media img {
	display: block;
	width: 100%;
	height: 220px;
	object-fit: cover;
}

.ttc-home-project__body {
	padding: 1.15rem 1.25rem 1.25rem;
}

.ttc-home-project__body h3 {
	margin: 0 0 0.5rem;
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.35;
}

.ttc-home-project__body h3 a {
	color: var(--ttc-text);
	text-decoration: none;
}

.ttc-home-project__body p {
	margin: 0 0 1rem;
	color: var(--ttc-muted) !important;
	font-size: 0.875rem;
	line-height: 1.55;
}

.ttc-home-project__metrics {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1rem;
	padding-top: 1rem;
	border-top: 1px solid var(--ttc-line);
}

.ttc-home-project__metric {
	display: grid;
	gap: 0.2rem;
}

.ttc-home-project__metric strong {
	color: var(--ttc-navy);
	font-size: 1.05rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.1;
}

.ttc-home-project__metric span {
	color: var(--ttc-muted);
	font-size: 0.75rem;
	line-height: 1.3;
}

.ttc-home-project__metric--muted {
	text-align: right;
}

.ttc-home-project__metric--muted strong {
	color: var(--ttc-text);
	font-weight: 600;
}

.ttc-home-knowledge__layout {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
	gap: 1.75rem;
	align-items: stretch;
}

.ttc-home-knowledge__feature {
	position: relative;
	display: block;
	height: 400px;
	overflow: hidden;
	border-radius: 10px;
	color: #fff;
	text-decoration: none;
}

.ttc-home-knowledge__feature img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ttc-home-knowledge__feature::after {
	content: "";
	position: absolute;
	inset: 35% 0 0;
	background: linear-gradient(transparent, rgb(0 0 0 / 78%));
}

.ttc-home-knowledge__feature-copy {
	position: absolute;
	z-index: 1;
	right: 1.25rem;
	bottom: 1.25rem;
	left: 1.25rem;
	display: grid;
	gap: 0.45rem;
}

.ttc-home-knowledge__feature-copy strong {
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.3;
}

.ttc-home-knowledge__feature-copy em {
	font-style: normal;
	font-size: 0.85rem;
	font-weight: 600;
	opacity: 0.9;
}

.ttc-home-knowledge__list {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ttc-home-knowledge__list a {
	display: grid;
	grid-template-columns: 152px minmax(0, 1fr);
	gap: 1.1rem;
	align-items: center;
	color: var(--ttc-text);
	text-decoration: none;
}

.ttc-home-knowledge__list img {
	width: 152px;
	height: 104px;
	border-radius: 6px;
	object-fit: cover;
	background: var(--ttc-bg);
}

.ttc-home-knowledge__list span {
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.4;
}

/* Tu bai thu nam tro di: bai lon chiem tron mot hang, cac bai con lai thanh
   luoi the ben duoi. Giu kieu cu thi cot phai dai gap may lan bai lon, hai ben
   lech han. */
.ttc-home-knowledge__layout--many {
	grid-template-columns: minmax(0, 1fr);
	gap: 1.5rem;
}

.ttc-home-knowledge__layout--many .ttc-home-knowledge__list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: 1.5rem 1.25rem;
}

/* Moi bai thanh mot the doc: anh tren, tua duoi. */
.ttc-home-knowledge__layout--many .ttc-home-knowledge__list a {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0.65rem;
	align-items: start;
}

.ttc-home-knowledge__layout--many .ttc-home-knowledge__list img {
	width: 100%;
	height: 150px;
}

/* Tua dai cat o dong thu ba cho cac the bang chieu cao nhau. */
.ttc-home-knowledge__layout--many .ttc-home-knowledge__list span {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

@media (max-width: 600px) {
	.ttc-home-knowledge__layout--many .ttc-home-knowledge__list {
		grid-template-columns: minmax(0, 1fr);
	}

	.ttc-home-knowledge__layout--many .ttc-home-knowledge__list a {
		grid-template-columns: 128px minmax(0, 1fr);
		align-items: center;
	}

	.ttc-home-knowledge__layout--many .ttc-home-knowledge__list img {
		width: 128px;
		height: 88px;
	}
}

/* —— Home hover states (brand palette) —— */
.ttc-home-link:hover,
.ttc-home-cats__grid a:hover .ttc-home-cats__label,
.ttc-home-product h3 a:hover,
.ttc-home-product__more:hover,
.ttc-home-knowledge__list a:hover span,
.ttc-home-project__body h3 a:hover {
	color: var(--ttc-navy) !important;
}

/* Keep overlay text white on the knowledge feature (override theme link hover) */
.ttc-home-knowledge__feature:hover,
.ttc-home-knowledge__feature:hover .ttc-home-knowledge__feature-copy strong,
.ttc-home-knowledge__feature:hover .ttc-home-knowledge__feature-copy em {
	color: #fff !important;
}

/* Subtle media zoom instead of a color shift */
.ttc-home-product__media,
.ttc-home-project__media {
	overflow: hidden;
}

.ttc-home-knowledge__feature img,
.ttc-home-product__media img,
.ttc-home-project__media img,
.ttc-home-cats__icon img {
	transition: transform 0.35s ease;
}

.ttc-home-knowledge__feature:hover img,
.ttc-home-product__media:hover img,
.ttc-home-project__media:hover img,
.ttc-home-cats__grid a:hover .ttc-home-cats__icon img {
	transform: scale(1.045);
}

.ttc-home-project {
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.ttc-home-project:hover {
	box-shadow: 0 10px 28px rgb(20 30 39 / 10%);
	transform: translateY(-2px);
}

body.home .ttc-support {
	margin-top: 0;
}

@media (max-width: 1024px) {
	.ttc-home-cats__grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.ttc-home-brands__grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.ttc-home-about__grid,
	.ttc-home-knowledge__layout {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.ttc-home-about__img img {
		min-height: 0;
		max-height: none;
		height: auto;
		aspect-ratio: 16 / 10;
	}

	.ttc-home-products__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ttc-footer__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 768px) {
	.ttc-home-section {
		padding: 3rem 1.25rem;
	}

	.ttc-home-hero {
		min-height: 520px;
		padding: 4rem 1.25rem;
	}

	.ttc-home-section__head--row {
		flex-direction: column;
		align-items: flex-start;
	}

	.ttc-home-cats__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ttc-home-brands__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.ttc-home-about__stats {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 0.75rem;
	}

	.ttc-home-products__grid,
	.ttc-home-projects__grid {
		grid-template-columns: 1fr;
	}

	.ttc-home-knowledge__list a {
		grid-template-columns: 110px minmax(0, 1fr);
	}

	.ttc-home-knowledge__list img {
		width: 110px;
		height: 78px;
	}

	.ttc-nav__list a {
		color: var(--ttc-text);
	}

	.ttc-nav__list a:hover,
	.ttc-nav__list .current-menu-item>a {
		color: var(--ttc-navy);
	}

	.ttc-footer__grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 480px) {
	.ttc-home-brands__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ttc-home-cats__icon {
		width: 84px;
		height: 84px;
	}
}

/* Safety: never allow accidental horizontal scroll on small screens. */
@media (max-width: 768px) {

	html,
	body {
		overflow-x: hidden;
	}
}

/* Trang nội dung dựng bằng block lõi (Giới thiệu / Liên hệ…). */
.ttc-content-page {
	max-width: 1120px;
	margin: 0 auto;
	padding: clamp(2.5rem, 5vw, 4rem) 1.5rem clamp(3rem, 6vw, 4.5rem);
}

.ttc-content-page h1 {
	color: var(--ttc-text) !important;
	font-size: clamp(1.9rem, 3vw, 2.4rem);
	font-weight: 700;
	letter-spacing: -0.025em;
	margin: 0 0 1rem;
}

.ttc-content-page h2 {
	color: var(--ttc-text) !important;
	font-size: clamp(1.4rem, 2.2vw, 1.75rem);
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 2.75rem 0 1.25rem;
}

.ttc-content-page h3 {
	color: var(--ttc-text) !important;
	font-size: 1.1rem;
	font-weight: 700;
	margin: 0 0 0.6rem;
}

.ttc-content-page p {
	color: var(--ttc-muted);
	line-height: 1.75;
	margin: 0 0 1rem;
}

.ttc-content-page p strong {
	color: var(--ttc-text);
}

.ttc-content-page .wp-block-image img {
	border-radius: 12px;
}

.ttc-content-page .wp-block-columns {
	gap: clamp(1.5rem, 4vw, 3rem);
	align-items: start;
}

/* Form tư vấn nhúng trong trang Liên hệ — thành card trên nền trắng. */
.ttc-content-page .ttc-support__form {
	min-height: 0;
	border: 1px solid var(--ttc-line);
	box-shadow: 0 12px 34px -20px rgb(0 29 61 / 30%);
}

.ttc-content-page .ttc-support__form p {
	color: var(--ttc-muted);
}

/* Contact page: fixed production asset keeps the backdrop stable behind the form. */
.ttc-contact-page .site-main {
	padding: clamp(2rem, 5vw, 4rem) 1rem;
	background: linear-gradient(rgb(0 29 61 / 72%), rgb(0 29 61 / 72%)), url("../img/support-team.jpg") center / cover no-repeat;
}

.ttc-contact-page .ttc-content-page {
	padding: clamp(2rem, 5vw, 4rem) clamp(1.25rem, 4vw, 3.5rem);
	background: rgb(255 255 255 / 94%);
	border: 1px solid rgb(255 255 255 / 45%);
	border-radius: 16px;
	box-shadow: 0 24px 60px -30px rgb(0 15 32 / 70%);
}


/* Gutenberg Cover blocks (hero, support, FAQ) on the homepage/FAQ page */
.ttc-home-hero.wp-block-cover {
	display: flex !important;
	min-height: min(78vh, 640px) !important;
	padding: 5rem 1.5rem;
	background: none;
}

.ttc-home-hero.wp-block-cover .wp-block-cover__inner-container {
	max-width: 820px;
	text-align: center;
}

.ttc-home-project__media img {
	display: block;
	width: 100%;
	height: 220px;
	object-fit: cover;
	border-radius: 10px 10px 0 0;
}

.wp-block-cover.ttc-support {
	display: flex !important;
	width: 100%;
	margin: 0;
	border-radius: 0;
	background: none;
	min-height: 420px;
}

.ttc-home .ttc-support.wp-block-cover {
	margin-top: 0;
}

.ttc-page .wp-block-button.ttc-btn--primary .wp-block-button__link {
	background: var(--ttc-navy) !important;
	color: #fff !important;
	border: 0;
	border-radius: 4px;
	font-weight: 700;
	font-size: 0.88rem;
	line-height: 1.2;
	min-height: 0;
	padding: 0.65rem 1.2rem;
	transition: filter 0.15s ease;
}

/* Hover: keep white text on the navy fill (override theme link hover). */
.ttc-page .wp-block-button.ttc-btn--primary .wp-block-button__link:hover,
.ttc-page .wp-block-button.ttc-btn--primary .wp-block-button__link:focus {
	background: var(--ttc-navy) !important;
	color: #fff !important;
}

.ttc-support__form button {
	transition: filter 0.15s ease;
}

.ttc-support__form button:hover,
.ttc-support__form button:focus {
	background: var(--ttc-form-btn-bg, var(--ttc-navy));
	color: var(--ttc-form-btn-text, #fff) !important;
}

/* Hero: match the demo's dark navy overlay (Gutenberg cover dim is too light). */
.ttc-home-hero.wp-block-cover .wp-block-cover__background {
	background: linear-gradient(180deg, rgb(0 20 40 / 66%) 0%, rgb(0 20 40 / 52%) 100%) !important;
	opacity: 1 !important;
}

.ttc-faq-page.wp-block-cover {
	display: flex !important;
	min-height: 100vh;
	padding: 4.25rem 1.25rem 5rem;
	background: #0b1822 url("../img/faq-engineering-team.png") center / cover no-repeat fixed;
}

.ttc-faq-page.wp-block-cover>.wp-block-cover__image-background {
	display: none;
}

.ttc-faq-page.wp-block-cover .wp-block-cover__inner-container {
	width: min(100%, 850px);
}

.ttc-faq-list.wp-block-group {
	width: min(100%, 800px);
	margin-inline: auto;
}

body.page-faqs #main,
body.page-id-904 #main {
	padding: 0;
}

@media (max-width: 768px) {
	.ttc-home-hero.wp-block-cover {
		min-height: 520px !important;
		padding: 4rem 1.25rem;
	}
}

/* Support band: guarantee the full-bleed + 2-column layout on EVERY page.
   The homepage gets a full-width context via .ttc-page--home; shop / product /
   archive pages sit inside Blocksy's narrower container, which otherwise
   narrows .ttc-support__inner and stacks it to one column. Widths are keyed to
   the viewport (100vw) so they don't depend on the parent's computed width. */
/* Drop the empty <p> that wpautop injects around the [ttc_support_form]
   shortcode block when the band renders via do_shortcode(do_blocks()) on shop
   pages — otherwise those empties take grid cells and push the form to column 1. */
.ttc-support__inner>p {
	display: none;
}

/* khong dung :empty — the <p> do
   wpautop sinh ra co chua ky tu xuong dong nen :empty khong bao gio khop */

@media (min-width: 769px) {
	.ttc-support:not(.wp-block-cover) {
		width: 100vw !important;
		max-width: 100vw !important;
		margin-left: calc(50% - 50vw) !important;
		margin-right: calc(50% - 50vw) !important;
	}

	.ttc-support__inner:has(.ttc-support__form) {
		width: min(100vw - 6.75rem, var(--ttc-container, 1280px)) !important;
		max-width: min(100vw - 6.75rem, var(--ttc-container, 1280px)) !important;
		margin-inline: auto !important;
		grid-template-columns: minmax(0, 1fr) minmax(0, 560px) !important;
	}
}

/* —— Site chrome: Blocksy header/footer builder —— */
header#header {
	background: var(--ttc-white);
}

#header [data-row="middle"],
#header [data-row="bottom"] {
	border-bottom: 1px solid var(--ttc-line);
}

#header [data-row]>.ct-container,
#header [data-row]>.ct-container-fluid,
#footer [data-row]>.ct-container {
	width: min(100% - 6.75rem, var(--ttc-container));
	max-width: var(--ttc-container);
}

#header [data-id="logo"] img {
	height: 40px;
	width: auto;
}

#header [data-id="ttc-search"],
#header .ttc-header-search {
	width: 100%;
	max-width: 480px;
}

#header .ttc-search {
	max-width: 480px;
	height: 40px;
	margin: 0;
	border-color: #d7dde5;
	border-radius: 24px;
	background: #f7f8fa;
}

#header .header-menu-1 {
	width: 100%;
}

#header .header-menu-1>ul.menu>li>a,
#header .header-menu-1>ul.menu>li>.ct-sub-menu-parent>a,
#header .header-menu-1 .ct-menu-link {
	position: relative;
	display: inline-flex;
	align-items: center;
	height: 52px;
	text-decoration: none;
	letter-spacing: 0;
	transition: color 0.3s ease;
}

#header .header-menu-1>ul.menu>li>a::after,
#header .header-menu-1>ul.menu>li>.ct-sub-menu-parent>a::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 10px;
	left: 0;
	height: 2px;
	background: var(--ttc-navy);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
	pointer-events: none;
}

#header .header-menu-1>ul.menu>li>a:hover,
#header .header-menu-1>ul.menu>li>.ct-sub-menu-parent>a:hover,
#header .header-menu-1>ul.menu>li>a:focus-visible,
#header .header-menu-1>ul.menu>li>.ct-sub-menu-parent>a:focus-visible,
#header .header-menu-1>ul.menu>.current-menu-item>a,
#header .header-menu-1>ul.menu>.current-menu-item>.ct-sub-menu-parent>a,
#header .header-menu-1>ul.menu>.current_page_item>a,
#header .header-menu-1>ul.menu>.current_page_item>.ct-sub-menu-parent>a {
	color: var(--ttc-navy);
}

#header .header-menu-1>ul.menu>li>a:hover::after,
#header .header-menu-1>ul.menu>li>.ct-sub-menu-parent>a:hover::after,
#header .header-menu-1>ul.menu>li>a:focus-visible::after,
#header .header-menu-1>ul.menu>li>.ct-sub-menu-parent>a:focus-visible::after,
#header .header-menu-1>ul.menu>.current-menu-item>a::after,
#header .header-menu-1>ul.menu>.current-menu-item>.ct-sub-menu-parent>a::after,
#header .header-menu-1>ul.menu>.current_page_item>a::after,
#header .header-menu-1>ul.menu>.current_page_item>.ct-sub-menu-parent>a::after {
	transform: scaleX(1);
}

#header .ttc-nav__product>a::after,
#header .ttc-nav__product>.ct-sub-menu-parent>a::after,
#header .menu-item.ttc-nav__product>a::after,
#header .menu-item.ttc-nav__product>.ct-sub-menu-parent>a::after {
	right: 16px;
}

/* Blocksy dung chinh ::before cua .ct-menu-link lam gach chan hover (opacity: 0),
   nen phai tra lai opacity/background khi muon ve mui ten o day. */
#header .ttc-nav__product>a::before,
#header .ttc-nav__product>.ct-sub-menu-parent>a::before {
	content: "";
	position: static;
	inset: auto;
	opacity: 1;
	background: none;
	order: 2;
	width: 6px;
	height: 6px;
	margin-left: 8px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: translateY(-1px) rotate(45deg);
	transition: transform 0.25s ease;
}

#header .ttc-nav__product:hover>a::before,
#header .ttc-nav__product:hover>.ct-sub-menu-parent>a::before,
#header .ttc-nav__product.ct-active>a::before,
#header .ttc-nav__product.ct-active>.ct-sub-menu-parent>a::before {
	transform: translateY(2px) rotate(-135deg);
}

/* Blocksy tu ve caret cho muc co con — muc nay da co chevron rieng o tren,
   an caret mac dinh di keo hien hai mui ten canh nhau. */
#header .ttc-nav__product .ct-toggle-dropdown-desktop,
#header .ttc-nav__product .ct-toggle-dropdown-mobile {
	display: none;
}

/* Product categories dropdown panel. */
#header .menu-item-has-children>.sub-menu {
	left: 0;
	width: max-content;
	min-width: 220px;
	max-width: 320px;
	padding: 8px;
	border: 1px solid #eceef1;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 20px 44px -14px rgb(20 30 39 / 20%), 0 4px 14px rgb(20 30 39 / 6%);
}

/* Invisible bridge across the gap below the nav item so the panel stays open
   while the pointer travels from the link down onto the list. */
#header .menu-item-has-children>.sub-menu::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: -14px;
	height: 14px;
}

#header .menu-item-has-children>.sub-menu li {
	border: 0;
}

#header .menu-item-has-children>.sub-menu .ct-menu-link {
	display: block;
	height: auto;
	padding: 12px 16px;
	border-radius: 9px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.3;
	color: var(--ttc-text);
	white-space: nowrap;
	transition: background-color 0.18s ease, color 0.18s ease;
}

#header .menu-item-has-children>.sub-menu li>.ct-menu-link::after {
	content: none;
}

#header .menu-item-has-children>.sub-menu li>.ct-menu-link:hover,
#header .menu-item-has-children>.sub-menu li>.ct-menu-link:focus-visible,
#header .menu-item-has-children>.sub-menu li.current-menu-item>.ct-menu-link {
	background: #f2f4f7;
	color: var(--ttc-navy);
}

/* Blocksy shortcuts bar - iOS-style transparency */
.ct-shortcuts-bar-items {
	border-radius: 16px 16px 0 0;
	background: rgba(255, 255, 255, 0.7) !important;
	backdrop-filter: blur(20px) saturate(180%);
	-webkit-backdrop-filter: blur(20px) saturate(180%);
	box-shadow: 0 -2px 16px rgba(0, 0, 0, 0.08);
}

.ct-shortcuts-bar-items .ct-icon-container {
	transition: transform 0.2s ease;
}

.ct-shortcuts-bar-items a:hover .ct-icon-container {
	transform: scale(1.2);
}

footer#footer {
	color: rgb(255 255 255 / 88%);
	margin-top: 0;
}

#footer a {
	color: inherit;
	text-decoration: none;
}

#footer a:hover {
	color: #fff;
}

#footer .ttc-footer__heading {
	margin: 0 0 1rem;
	color: #fff;
	text-transform: none;
	letter-spacing: 0;
}

#footer .ttc-footer__links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.75rem;
	font-size: 0.75rem;
}

#footer .ttc-logo--footer img {
	filter: brightness(0) invert(1);
}

#offcanvas {
	font-family: var(--ttc-font);
}

/* Mau chu menu mobile.
 *
 * Blocksy dat `--theme-link-initial-color: #ffffff` thang len
 * [data-id="mobile-menu"] cho panel nen toi. Dat bien do o #offcanvas la vo
 * ich: element gan hon thang. Phai ghi de dung tren [data-id="mobile-menu"].
 */
#offcanvas [data-id="mobile-menu"] {
	--theme-link-initial-color: var(--ttc-text);
}

/* Menu mobile phai nen trang, khong phai nen den.
 *
 * Blocksy sinh ra `[data-header*="type-1"] #offcanvas .ct-panel-inner` voi mau
 * mac dinh rgba(18,21,25,.98). Selector do co do uu tien (1,2,0), thang
 * `#offcanvas .ct-panel-inner` (1,1,0) cua minh — nen menu den lai moi lan
 * dynamic CSS cua Blocksy duoc sinh lai (doi theme, xoa cache, deploy moi).
 * Them `body[data-header]` de vuot len (1,2,1).
 *
 * Khong dat trong @media: offcanvas hien den tan 1024px, con rule cu chi
 * chay <=768px nen khoang 769-1023px van den.
 */
body[data-header] #offcanvas .ct-panel-inner,
#offcanvas .ct-panel-inner {
	background: #fff;
}

#offcanvas .menu a {
	font-weight: 600;
	color: var(--ttc-text);
	border-radius: 6px;
	transition: color 0.3s ease, background-color 0.3s ease;
}

#offcanvas .menu a:hover,
#offcanvas .menu a:focus-visible,
#offcanvas .menu .current-menu-item>a,
#offcanvas .menu .current_page_item>a {
	color: var(--ttc-navy);
	background: #edf7fb;
}

@media (prefers-reduced-motion: reduce) {

	#header .header-menu-1>ul.menu>li>a,
	#header .header-menu-1>ul.menu>li>.ct-sub-menu-parent>a,
	#header .header-menu-1>ul.menu>li>a::after,
	#header .header-menu-1>ul.menu>li>.ct-sub-menu-parent>a::after,
	#offcanvas .menu a,
	.ttc-nav__list a,
	.ttc-nav__list a::after {
		transition: none;
	}
}

/* Trong offcanvas, Blocksy da co nut mui ten rieng (chinh la vung bam de mo
   danh muc con). Chevron ::before cua minh la cai thu hai — an di. */
#offcanvas .ttc-nav__product>a::before,
#offcanvas .ttc-nav__product>.ct-sub-menu-parent>a::before {
	content: none;
}

#offcanvas .ttc-hotline {
	margin-top: 1.25rem;
	padding: 0 1.25rem;
}

/* Hide offcanvas on desktop */
@media (min-width: 1024px) {
	#offcanvas {
		display: none !important;
	}
}

@media (max-width: 1024px) {

	#header [data-row]>.ct-container,
	#footer [data-row]>.ct-container {
		width: min(100% - 2.5rem, var(--ttc-container));
	}

	#header .header-menu-1>ul.menu>li>a {
		font-size: 0.75rem;
	}
}

@media (max-width: 768px) {
	header#header {
		box-shadow: 0 8px 24px rgb(20 30 39 / 8%);
	}

	#header [data-row]>.ct-container,
	#footer [data-row]>.ct-container {
		width: min(100% - 2rem, var(--ttc-container));
	}

	#header [data-id="logo"] img {
		height: 38px;
	}

	#footer .ttc-footer__links--cols {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ============================================================
   Trang Giới thiệu (About) — landing đầy đủ
   ============================================================ */
.ttc-page:has(.ttc-about) {
	padding: 0;
	max-width: none;
	width: 100%;
}

.ttc-about {
	background: #fff;
}

.ttc-about .wp-block-heading,
.ttc-about p {
	margin-block-start: 0;
}

.ttc-about h1,
.ttc-about h2,
.ttc-about h3,
.ttc-about .wp-block-heading {
	color: var(--ttc-text) !important;
}

/* Band [ttc_support] nhúng trong .ttc-about nằm trên nền navy tối — giữ chữ trắng
   của chính band, KHÔNG để rule tiêu đề .ttc-about ở trên đè thành đen (chìm nền). */
.ttc-about .ttc-support :is(h1, h2, h3),
.ttc-about .ttc-support .wp-block-heading {
	color: #fff !important;
}

.ttc-about__eyebrow {
	margin: 0 0 0.75rem !important;
	color: var(--ttc-navy) !important;
	font-size: 0.72rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

/* —— Hero —— */
.ttc-about__hero {
	padding: 4.75rem 1.25rem 6rem !important;
	background: linear-gradient(135deg, #f4f9fc, #fff 70%);
	max-width: none !important;
}

.ttc-about__hero-grid {
	max-width: var(--ttc-container, 1280px);
	margin-inline: auto;
	display: grid !important;
	grid-template-columns: minmax(0, 0.9fr) minmax(340px, 1.1fr);
	align-items: center;
	gap: 3rem 4.5rem !important;
	flex-wrap: nowrap !important;
}

.ttc-about__hero-copy {
	max-width: 560px;
}

.ttc-about__hero-copy h1,
.ttc-about__hero-copy .wp-block-heading {
	margin: 0 !important;
	font-size: clamp(2.1rem, 4vw, 3.4rem) !important;
	font-weight: 600 !important;
	letter-spacing: -0.055em;
	line-height: 1.08 !important;
}

.ttc-about__hero-copy>p:not(.ttc-about__eyebrow) {
	max-width: 520px;
	margin: 1.5rem 0 0 !important;
	color: var(--ttc-muted) !important;
	line-height: 1.7;
}

.ttc-about__hero-actions {
	gap: 1rem;
	margin-top: 2rem;
}

.ttc-about__hero-link .wp-block-button__link {
	background: transparent !important;
	color: var(--ttc-navy) !important;
	border: 1px solid var(--ttc-line) !important;
	border-radius: 4px;
	font-weight: 700;
	font-size: 0.88rem;
	padding: 0.65rem 1.2rem;
	min-height: 0;
}

.ttc-about__hero-link .wp-block-button__link:hover {
	border-color: var(--ttc-navy) !important;
	background: rgb(0 102 153 / 6%) !important;
	color: var(--ttc-navy) !important;
}

.ttc-about__hero-image {
	margin: 0;
}

.ttc-about__hero-image img {
	display: block;
	width: 100%;
	min-height: 420px;
	border-radius: 12px;
	object-fit: cover;
	box-shadow: 0 22px 50px rgb(0 29 61 / 16%);
}

/* —— Stats band (thẻ nổi chồng lên hero) —— */
.ttc-about__stats-band {
	position: relative;
	z-index: 2;
	max-width: none !important;
	margin-top: -3rem;
	padding: 0 1.25rem;
}

.ttc-about__stats {
	max-width: var(--ttc-container, 1280px);
	margin: 0 auto !important;
}

.ttc-about__stats.wp-block-columns {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0 !important;
	background: #fff;
	border: 1px solid var(--ttc-line);
	border-radius: 14px;
	box-shadow: 0 20px 44px -26px rgb(0 29 61 / 40%);
	overflow: hidden;
}

.ttc-about__stat.wp-block-column {
	margin: 0 !important;
	padding: 1.75rem 2rem;
	border-right: 1px solid var(--ttc-line);
}

.ttc-about__stat:last-child {
	border-right: 0;
}

.ttc-about__stat-num {
	margin: 0 !important;
	color: var(--ttc-navy) !important;
	font-size: clamp(1.5rem, 2.4vw, 2.1rem) !important;
	font-weight: 700 !important;
	letter-spacing: -0.03em;
	line-height: 1.1;
}

.ttc-about__stat-label {
	margin: 0.4rem 0 0 !important;
	color: var(--ttc-muted) !important;
	font-size: 0.82rem !important;
	line-height: 1.4;
}

/* —— Story —— */
.ttc-about__story {
	padding: 4.75rem 1.25rem !important;
	max-width: none !important;
}

.ttc-about__story-grid {
	max-width: var(--ttc-container, 1280px);
	margin-inline: auto;
	display: grid !important;
	grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
	align-items: center;
	gap: 3rem 4rem !important;
	flex-wrap: nowrap !important;
}

.ttc-about__story-image {
	margin: 0;
}

.ttc-about__story-image img {
	display: block;
	width: 100%;
	min-height: 400px;
	border-radius: 12px;
	object-fit: cover;
	box-shadow: 0 18px 40px rgb(0 29 61 / 14%);
}

.ttc-about__story-copy h2,
.ttc-about__story-copy .wp-block-heading {
	margin: 0.5rem 0 0 !important;
	font-size: clamp(1.7rem, 2.6vw, 2.3rem) !important;
	font-weight: 700 !important;
	letter-spacing: -0.03em;
	line-height: 1.18 !important;
}

.ttc-about__story-copy>p:not(.ttc-about__eyebrow) {
	margin: 1.25rem 0 0 !important;
	color: var(--ttc-muted) !important;
	line-height: 1.75;
}

/* —— Sứ mệnh & Tầm nhìn —— */
.ttc-about__mv {
	padding: 0 1.25rem 4.75rem !important;
	max-width: none !important;
}

.ttc-about__mv-grid {
	max-width: var(--ttc-container, 1280px);
	margin-inline: auto;
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem !important;
}

.ttc-about__mv-card.wp-block-column {
	margin: 0 !important;
	padding: 2.25rem;
	border: 1px solid var(--ttc-line);
	border-radius: 16px;
	background: #fff;
}

.ttc-about__mv-card--mission {
	background: linear-gradient(180deg, #f4f9fc, #fff 65%);
}

.ttc-about__mv-card::before {
	content: "";
	display: block;
	width: 52px;
	height: 52px;
	margin-bottom: 1.35rem;
	border-radius: 13px;
	background: rgb(0 102 153 / 8%) center / 26px 26px no-repeat;
}

.ttc-about__mv-card--mission::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23006699' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='12' r='6'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E");
}

.ttc-about__mv-card--vision::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23006699' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.ttc-about__mv-tag {
	margin: 0 0 0.75rem !important;
	color: var(--ttc-navy) !important;
	font-size: 0.72rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.ttc-about__mv-card h3,
.ttc-about__mv-card .wp-block-heading {
	margin: 0 0 0.75rem !important;
	font-size: clamp(1.2rem, 1.9vw, 1.5rem) !important;
	font-weight: 700 !important;
	letter-spacing: -0.02em;
}

.ttc-about__mv-card p {
	margin: 0 !important;
	color: var(--ttc-muted) !important;
	line-height: 1.7;
}

/* —— Giá trị cốt lõi —— */
.ttc-about__values-section {
	padding: 4.75rem 1.25rem !important;
	background: var(--ttc-bg);
	max-width: none !important;
}

.ttc-about__values-section>.ttc-about__section-heading,
.ttc-about__values-section>.ttc-about__value-cards {
	max-width: var(--ttc-container, 1280px);
	margin-inline: auto;
}

.ttc-about__section-heading {
	margin-bottom: 2.75rem;
	text-align: center;
}

.ttc-about__section-heading .ttc-about__eyebrow {
	margin-bottom: 0.5rem !important;
}

.ttc-about__section-heading h2,
.ttc-about__section-heading .wp-block-heading {
	margin: 0 !important;
	font-size: clamp(1.7rem, 2.6vw, 2.3rem) !important;
	font-weight: 700 !important;
	letter-spacing: -0.03em;
}

.ttc-about__value-cards.wp-block-columns {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.5rem !important;
}

.ttc-about__value-card.wp-block-column {
	display: block;
	margin: 0 !important;
	padding: 2rem;
	background: #fff;
	border: 1px solid var(--ttc-line);
	border-radius: 16px;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.ttc-about__value-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 20px 40px -26px rgb(0 29 61 / 40%);
}

.ttc-about__value-card::before {
	content: "";
	display: block;
	width: 52px;
	height: 52px;
	border-radius: 13px;
	background: rgb(0 102 153 / 8%) center / 26px 26px no-repeat;
}

.ttc-about__value-card:nth-child(1)::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23006699' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E");
}

.ttc-about__value-card:nth-child(2)::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23006699' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
}

.ttc-about__value-card:nth-child(3)::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23006699' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 1 0-7.78 7.78L12 21.23l8.84-8.84a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E");
}

.ttc-about__value-card h3,
.ttc-about__value-card .wp-block-heading {
	margin: 1.25rem 0 0.5rem !important;
	font-size: 1.1rem !important;
	font-weight: 700 !important;
}

.ttc-about__value-card p {
	margin: 0 !important;
	color: var(--ttc-muted) !important;
	font-size: 0.9rem;
	line-height: 1.65;
}

/* CTA cuối trang dùng lại band tư vấn dùng chung [ttc_support] (.ttc-support),
   không tự dựng dải CTA riêng — để màu & copy đồng nhất với trang chủ / shop. */

@media (max-width: 1024px) {

	.ttc-about__hero-grid,
	.ttc-about__story-grid {
		grid-template-columns: minmax(0, 1fr) !important;
		flex-direction: column !important;
	}

	.ttc-about__hero-copy,
	.ttc-about__story-copy,
	.ttc-about__hero-image,
	.ttc-about__story-image {
		min-width: 0;
		max-width: 100%;
	}

	.ttc-about__hero-image img,
	.ttc-about__story-image img {
		min-height: 0;
		max-width: 100%;
		aspect-ratio: 16 / 10;
	}

	.ttc-about__stats.wp-block-columns {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ttc-about__stat.wp-block-column:nth-child(2) {
		border-right: 0;
	}

	.ttc-about__stat.wp-block-column:nth-child(-n+2) {
		border-bottom: 1px solid var(--ttc-line);
	}

	.ttc-about__mv-grid {
		grid-template-columns: 1fr !important;
	}
}

@media (max-width: 768px) {
	.ttc-about__hero {
		padding: 2.75rem 1rem 4rem !important;
	}

	.ttc-about__hero-actions {
		flex-direction: column;
		align-items: flex-start;
	}

	.ttc-about__stats-band {
		margin-top: -2rem;
	}

	.ttc-about__stats.wp-block-columns {
		grid-template-columns: 1fr;
	}

	.ttc-about__stat.wp-block-column {
		border-right: 0 !important;
		border-bottom: 1px solid var(--ttc-line);
	}

	.ttc-about__stat.wp-block-column:last-child {
		border-bottom: 0;
	}

	.ttc-about__story,
	.ttc-about__values-section {
		padding-block: 3rem !important;
	}

	.ttc-about__mv {
		padding-bottom: 3rem !important;
	}

	.ttc-about__value-cards.wp-block-columns {
		grid-template-columns: 1fr;
	}
}

/* ============================================================
   Trang Tuyển dụng (Careers) — bổ sung Quyền lợi / Chip / Quy trình / CTA
   ============================================================ */
/* —— Quyền lợi —— */
.ttc-careers__perks {
	padding: 4.75rem 1.25rem !important;
	background: var(--ttc-bg);
	max-width: none !important;
}

.ttc-careers__perks>.ttc-careers__section-heading,
.ttc-careers__perks>.ttc-careers__perk-cards {
	max-width: var(--ttc-container, 1280px);
	margin-inline: auto;
}

.ttc-careers__perk-cards.wp-block-columns {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.25rem !important;
}

.ttc-careers__perk.wp-block-column {
	display: block;
	margin: 0 !important;
	padding: 1.75rem;
	background: #fff;
	border: 1px solid var(--ttc-line);
	border-radius: 16px;
}

.ttc-careers__perk::before {
	content: "";
	display: block;
	width: 48px;
	height: 48px;
	border-radius: 12px;
	background: rgb(0 102 153 / 8%) center / 24px 24px no-repeat;
}

.ttc-careers__perk:nth-child(1)::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23006699' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='6'/%3E%3Cpath d='M15.5 12.5L17 22l-5-3-5 3 1.5-9.5'/%3E%3C/svg%3E");
}

.ttc-careers__perk:nth-child(2)::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23006699' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 10L12 5 2 10l10 5 10-5z'/%3E%3Cpath d='M6 12v5c0 1 2 3 6 3s6-2 6-3v-5'/%3E%3C/svg%3E");
}

.ttc-careers__perk:nth-child(3)::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23006699' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3C/svg%3E");
}

.ttc-careers__perk:nth-child(4)::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23006699' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M23 6l-9.5 9.5-5-5L1 18'/%3E%3Cpath d='M17 6h6v6'/%3E%3C/svg%3E");
}

.ttc-careers__perk h3,
.ttc-careers__perk .wp-block-heading {
	margin: 1.1rem 0 0.5rem !important;
	font-size: 1.02rem !important;
	font-weight: 700 !important;
}

.ttc-careers__perk p {
	margin: 0 !important;
	color: var(--ttc-muted) !important;
	font-size: 0.86rem;
	line-height: 1.6;
}

/* —— Chip trong tin tuyển —— */

/* 24rem la chieu RONG co so khi the viec xep hang ngang. Duoi 768px the viec
   doi sang `flex-direction: column`, cung con so do tro thanh chieu CAO: khoi
   chu bi keo len 384px du noi dung chi chiem mot nua, the viec cao gan gap doi
   va ho mot khoang trong to truoc nut "Ung tuyen". Chi dat khi con hang ngang. */
@media (min-width: 769px) {
	.ttc-careers__job-main {
		flex: 1 1 24rem;
	}
}

.ttc-careers__job-tags {
	gap: 0.5rem !important;
	margin-top: 0.9rem !important;
}

.ttc-careers__chip {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin: 0 !important;
	padding: 0.32rem 0.72rem;
	border: 1px solid var(--ttc-line);
	border-radius: 999px;
	background: var(--ttc-bg);
	color: var(--ttc-text) !important;
	font-size: 0.72rem !important;
	font-weight: 600 !important;
	line-height: 1.4;
}

.ttc-careers__chip::before {
	content: "";
	width: 14px;
	height: 14px;
	background: center / contain no-repeat;
	flex: none;
}

.ttc-careers__chip--type::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23006699' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E");
}

.ttc-careers__chip--place::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23006699' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
}

@media (max-width: 1024px) {
	.ttc-careers__perk-cards.wp-block-columns {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 768px) {
	.ttc-careers__perks {
		padding-block: 3rem !important;
	}

	.ttc-careers__perk-cards.wp-block-columns {
		grid-template-columns: 1fr;
	}
}

/* Apply band reuses .ttc-support; keep copy white and aligned with page grid. */
.ttc-careers .ttc-support,
.ttc-careers__apply.ttc-support:not(.wp-block-cover) {
	margin: 0;
	min-height: 0;
}

#ung-tuyen {
	scroll-margin-top: 6.5rem;
}

.ttc-careers__apply .ttc-support__inner,
.ttc-careers__apply .ttc-support__inner:has(.ttc-support__form) {
	min-height: 0;
	padding-block: 4.25rem 3.5rem;
	align-items: center;
}

.ttc-careers__apply .ttc-support__copy,
.ttc-careers__apply .ttc-support__inner:has(.ttc-support__form) .ttc-support__copy {
	padding: 0;
	margin: 0;
}

.ttc-careers .ttc-support h2,
.ttc-careers .ttc-support .wp-block-heading,
.ttc-careers .ttc-support__copy p {
	color: #fff !important;
}

.ttc-careers .ttc-support .ttc-support__form p,
.ttc-careers .ttc-support .ttc-support__form .ttc-support__note {
	color: var(--ttc-muted) !important;
}

.ttc-careers .ttc-support .ttc-support__form .ttc-support__note {
	color: var(--ttc-text) !important;
}

/* —— Mobile menu drill-down navigation —— */
@media (max-width: 1023px) {

	/* Submenu wrapper */
	.ttc-submenu-wrapper {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: #fff;
		z-index: 10;
		overflow-y: auto;
	}

	/* Back button */
	.ttc-submenu-back {
		display: flex;
		align-items: center;
		gap: 8px;
		width: 100%;
		padding: 1rem 1.25rem;
		border: 0;
		border-bottom: 1px solid #eceef1;
		background: #f8f9fa;
		color: var(--ttc-navy);
		font-weight: 600;
		font-size: 14px;
		text-align: left;
		cursor: pointer;
	}

	.ttc-submenu-back:hover,
	.ttc-submenu-back:focus-visible {
		background: #edf1f4;
	}

	.ttc-submenu-back svg {
		flex: none;
	}

	/* Submenu view list */
	.ttc-submenu-view {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	.ttc-submenu-view>li {
		border-bottom: 1px solid #eceef1;
	}

	.ttc-submenu-view>li:last-child {
		border-bottom: 0;
	}

	.ttc-submenu-view a {
		display: block;
		padding: 1rem 1.25rem;
		color: var(--ttc-text);
		font-weight: 600;
		text-decoration: none;
	}

	.ttc-submenu-view a:hover,
	.ttc-submenu-view a:focus-visible {
		background: #edf7fb;
		color: var(--ttc-navy);
	}

	/* Hide Blocksy's toggle in mobile menu */
	#offcanvas .menu-item-has-children>a .ct-toggle-dropdown-desktop {
		display: none;
	}
}

/* Position offcanvas below header on mobile */
@media (max-width: 1023px) {
	#offcanvas {
		top: 68px !important;
		/* Mobile header height */
		height: calc(100vh - 68px) !important;
		height: calc(100dvh - 68px) !important;
		/* Dynamic viewport height */
	}

	/* Adjust for admin bar if logged in */
	.admin-bar #offcanvas {
		top: calc(68px + 46px) !important;
		height: calc(100vh - 68px - 46px) !important;
		height: calc(100dvh - 68px - 46px) !important;
	}
}

/* Hide offcanvas close button on mobile - use header toggle instead */
@media (max-width: 1023px) {
	#offcanvas .ct-panel-actions {
		display: none;
	}
}

/* Sticky header - bottom row only (desktop) */
@media (min-width: 1024px) {

}

/* Sticky menu now controlled by ttctech-addons plugin extension */

/* ============================================================
   Trang chi tiet du an (single-ttc_project.php)
   ============================================================ */
.ttc-project {
	padding: 1.75rem 0 3.5rem;
	background: var(--ttc-white);
}

.ttc-project__breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 1.75rem;
	color: #6b7280;
	font-size: 0.8125rem;
}

.ttc-project__breadcrumb a {
	color: #6b7280;
	text-decoration: none;
}

.ttc-project__breadcrumb a:hover {
	color: var(--ttc-navy);
}

.ttc-project__breadcrumb strong {
	color: var(--ttc-text);
	font-weight: 600;
}

.ttc-project__head {
	max-width: 780px;
	margin-bottom: 2rem;
}

.ttc-project__head h1 {
	margin: 0 0 0.75rem;
	font-size: clamp(1.6rem, 3vw, 2.25rem);
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.02em;
}

.ttc-project__lead {
	margin: 0;
	color: #55585f;
	font-size: 1.0625rem;
	line-height: 1.65;
}

.ttc-project__layout {
	display: grid;
	grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr);
	gap: 2rem;
	align-items: start;
}

.ttc-project__media {
	margin: 0;
	border-radius: 12px;
	overflow: hidden;
}

.ttc-project__media img {
	display: block;
	width: 100%;
	height: auto;
}

.ttc-project__aside {
	display: grid;
	gap: 1rem;
}

.ttc-project__facts {
	display: grid;
	gap: 1px;
	border: 1px solid #dedfe4;
	border-radius: 10px;
	background: #dedfe4;
	overflow: hidden;
}

.ttc-project__fact {
	padding: 1.15rem 1.35rem;
	background: var(--ttc-white);
}

.ttc-project__fact strong {
	display: block;
	color: var(--ttc-navy);
	font-size: 1.375rem;
	font-weight: 700;
	line-height: 1.3;
}

.ttc-project__fact span {
	color: #6b7280;
	font-size: 0.8125rem;
}

.ttc-project__cta {
	padding: 1.35rem;
	border-radius: 10px;
	background: var(--ttc-bg);
}

.ttc-project__cta p {
	margin: 0 0 0.85rem;
	color: #55585f;
	font-size: 0.9375rem;
	line-height: 1.6;
}

.ttc-project__body {
	max-width: 780px;
	margin-top: 2.25rem;
}

.ttc-project__body p {
	margin: 0 0 1rem;
	color: #55585f;
	font-size: 0.9375rem;
	line-height: 1.7;
}

.ttc-project__related {
	margin-top: 3rem;
}

.ttc-project__related .ttc-section-title {
	margin-bottom: 1.5rem;
}

.ttc-project__related .ttc-home-projects__grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1024px) {
	.ttc-project__layout {
		grid-template-columns: minmax(0, 1fr);
	}

	.ttc-project__related .ttc-home-projects__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 768px) {
	.ttc-project__related .ttc-home-projects__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ============================================================
   Trang chính sách (page-policy.php)
   Cột trái là mục lục dính; cột phải là nội dung đánh số.
   ============================================================ */
.ttc-policy {
	padding: 1.75rem 0 3.5rem;
	background: var(--ttc-white);
}

.ttc-policy__breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 1.5rem;
	color: var(--ttc-muted);
	font-size: 0.8125rem;
}

.ttc-policy__breadcrumb a {
	color: var(--ttc-muted);
	text-decoration: none;
}

.ttc-policy__breadcrumb a:hover {
	color: var(--ttc-navy);
}

.ttc-policy__breadcrumb strong {
	color: var(--ttc-text);
	font-weight: 600;
}

.ttc-policy__layout {
	display: grid;
	grid-template-columns: 320px minmax(0, 1fr);
	gap: 3rem;
	align-items: start;
}

/* Muc luc di theo man hinh; noi dung chinh sach thuong dai hon cot trai nhieu.
 *
 * `position: sticky` phai dat tren O LUOI (.ttc-policy__aside), khong phai tren
 * cai the ben trong: sticky chi truot trong pham vi khoi cha, ma khoi cha cua
 * the lai cao dung bang chinh no — dat sai cho thi cuon mot cai la mat hut. */
.ttc-policy__aside {
	align-self: stretch;
}

.ttc-policy__nav {
	position: sticky;
	top: 1.5rem;
	max-height: calc(100vh - 3rem);
	padding: 1.75rem 1.5rem;
	border-radius: 14px;
	background: var(--ttc-bg);
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-width: thin;
}

.ttc-policy__nav-title {
	margin: 0 0 1.25rem;
	font-size: 1.375rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.015em;
}

/* .ttc-toc__panel mac dinh bi an, chi hien khi cha la .ttc-toc[data-open].
   O day cha la .ttc-policy__nav nen phai mo lai, va bo cac style rieng cua
   hop muc luc bai viet (khung cuon, vien tren, padding). */
.ttc-policy__nav .ttc-toc__panel {
	display: block;
	max-height: none;
	padding: 0;
	border-top: 0;
	overflow: visible;
}

.ttc-policy__nav ol {
	display: grid;
	gap: 0.2rem;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: none;
}

.ttc-policy__nav a {
	display: block;
	padding: 0.55rem 0.7rem;
	border-radius: 8px;
	color: #4b4d53;
	font-size: 0.9375rem;
	line-height: 1.5;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.ttc-policy__nav a:hover,
.ttc-policy__nav a:focus-visible {
	background: #edf7fb;
	color: var(--ttc-navy);
	outline: none;
}

/* Muc dang doc — ttc.js gan .is-active theo vi tri cuon. */
.ttc-policy__nav a.is-active {
	background: var(--ttc-white);
	color: var(--ttc-navy);
	font-weight: 600;
	box-shadow: 0 1px 2px rgb(20 30 39 / 8%);
}

.ttc-policy__num {
	font-variant-numeric: tabular-nums;
}

.ttc-policy__body {
	max-width: 46rem;
	color: #3d4046;
	font-size: 1rem;
	line-height: 1.75;
}

.ttc-policy__body h2 {
	margin: 2.5rem 0 0.85rem;
	color: #1a1d22 !important;
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.35;
	scroll-margin-top: 7.5rem;
}

.ttc-policy__body>h2:first-child {
	margin-top: 0;
}

.ttc-policy__body h3 {
	margin: 1.75rem 0 0.5rem;
	color: #1a1d22 !important;
	font-size: 1.05rem;
	font-weight: 700;
	scroll-margin-top: 7.5rem;
}

.ttc-policy__body p {
	margin: 0 0 1rem;
}

.ttc-policy__body :is(ul, ol) {
	margin: 0 0 1rem;
	padding-left: 1.35rem;
}

.ttc-policy__body li {
	margin-bottom: 0.5rem;
}

.ttc-policy__body li::marker {
	color: var(--ttc-navy);
}

.ttc-policy__body strong {
	color: #23262b;
}

.ttc-policy__body a {
	color: var(--ttc-navy);
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (max-width: 1024px) {
	.ttc-policy__layout {
		grid-template-columns: 260px minmax(0, 1fr);
		gap: 2rem;
	}
}

/* Duoi 900px cot trai qua hep de doc; xep muc luc len tren, bo dinh. */
@media (max-width: 900px) {
	.ttc-policy__layout {
		grid-template-columns: minmax(0, 1fr);
	}

	.ttc-policy__nav {
		position: static;
		max-height: none;
	}

	.ttc-policy__nav-title {
		font-size: 1.25rem;
	}
}

/* Hai cot chi du cho khong gian tu 1025px tro len.
   Cot form bi ghim cung 560px, nen o 769-1024px phan con lai danh cho chu chi
   ~120-315px: tieu de "Ho tro giai phap gia cong toan dien" xuong moi tu mot
   dong. Duoi 1025px xep thanh mot cot. */
@media (min-width: 1025px) {
	.ttc-support__inner:has(.ttc-support__form) {
		grid-template-columns: minmax(0, 1fr) minmax(0, 560px) !important;
	}
}

@media (max-width: 1024px) {
	.ttc-support:not(.wp-block-cover),
	.ttc-product-related + .ttc-support,
	.ttc-product-articles + .ttc-support,
	.ttc-product-related + .ttc-support .ttc-support__inner,
	.ttc-product-articles + .ttc-support .ttc-support__inner {
		height: auto;
		min-height: 0;
	}
	.ttc-support__inner,
	.ttc-support__inner:has(.ttc-support__form) {
		min-height: 0;
		grid-template-columns: 1fr;
		gap: 2rem;
	}
	.ttc-support__copy,
	.ttc-support__inner:has(.ttc-support__form) .ttc-support__copy {
		padding: 0;
	}
	.ttc-support__form {
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}
}

@media (min-width: 769px) and (max-width: 1024px) {
	.ttc-support__inner:has(.ttc-support__form) {
		width: min(100% - 2.5rem, var(--ttc-container, 1280px)) !important;
		max-width: min(100% - 2.5rem, var(--ttc-container, 1280px)) !important;
		grid-template-columns: 1fr !important;
		gap: 2rem;
	}

	.ttc-support__inner:has(.ttc-support__form) .ttc-support__copy {
		padding: 0;
	}
}

/* —— Goi y san pham duoi thanh tim kiem —— */

.ttc-suggest {
	/* `fixed` chu khong `absolute`: o tim kiem tren header nam trong mot chuoi
	   the co `overflow: hidden` va `overflow: clip`, tha dropdown theo dong tai
	   lieu la bi cat cut ngay duoi vien o nhap. Toa do do JS dat vao lc mo,
	   tinh theo vi tri that cua o nhap tren man hinh. */
	position: fixed;
	z-index: 1200;
	overflow: hidden;
	max-height: min(70vh, 26rem);
	overflow-y: auto;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	background: var(--ttc-white, #fff);
	box-shadow: 0 18px 40px -22px rgb(15 32 51 / 45%);
}

.ttc-suggest[hidden] { display: none; }

/* Cho lau thi vien tren chay mot vach sang de biet la dang tai, khong phai
   dropdown chet. */
.ttc-suggest.is-loading::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--ttc-navy, #0f2033), transparent);
	animation: ttc-suggest-bar 1s linear infinite;
}

@keyframes ttc-suggest-bar {
	from { transform: translateX(-100%); }
	to { transform: translateX(100%); }
}

.ttc-suggest__item {
	display: flex;
	gap: 0.75rem;
	align-items: center;
	padding: 0.6rem 0.85rem;
	border-bottom: 1px solid #eef2f6;
	color: var(--ttc-text, #16212f);
	text-decoration: none;
}

.ttc-suggest__item:last-child { border-bottom: 0; }

.ttc-suggest__item:hover,
.ttc-suggest__item.is-active {
	background: #f2f7fb;
}

.ttc-suggest__thumb {
	flex: 0 0 48px;
	width: 48px;
	height: 48px;
	border: 1px solid #eef2f6;
	border-radius: 8px;
	object-fit: contain;
	background: #fff;
}

.ttc-suggest__body {
	display: grid;
	gap: 0.15rem;
	min-width: 0;
}

/* Ten dai cat o dong thu hai, khong keo dropdown cao gap doi. */
.ttc-suggest__title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1.35;
}

.ttc-suggest__brand {
	color: var(--ttc-muted, #64748b);
	font-size: 0.75rem;
	font-weight: 500;
}

.ttc-suggest__empty {
	margin: 0;
	padding: 1rem 0.85rem;
	color: var(--ttc-muted, #64748b);
	font-size: 0.875rem;
	text-align: center;
}

.ttc-suggest__more {
	display: block;
	padding: 0.7rem 0.85rem;
	border-top: 1px solid #eef2f6;
	background: #f8fafc;
	color: var(--ttc-navy, #0f2033);
	font-size: 0.85rem;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
}

.ttc-suggest__more:hover { background: #eef4f9; }

/* Man hinh hep: o nhap trong header bi thu lai con rat ngan, tha dropdown
   theo be rong o nhap thi moi dong chi con hai chu. Cho no rong bang mep
   man hinh. */
@media (max-width: 600px) {
	.ttc-suggest {
		max-height: 60vh;
	}
	.ttc-suggest__thumb {
		flex-basis: 40px;
		width: 40px;
		height: 40px;
	}
}

/* —— Bai viet lien quan duoi trang san pham —— */

.ttc-product-articles {
	margin-top: 3.5rem;
}

.ttc-product-articles__head {
	display: flex;
	gap: 1rem;
	align-items: baseline;
	justify-content: space-between;
	margin-bottom: 2.25rem;
}

/* Dung lai vach xanh ben trai cua "San pham lien quan" ngay tren no, hai khoi
   phai nhin ra la cung mot cap. */
.ttc-product-articles .ttc-section-title {
	margin: 0;
	padding-left: 0.75rem;
	border-left: 4px solid var(--ttc-navy);
	font-size: 1.25rem;
	line-height: 1.25;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: uppercase;
}

.ttc-product-articles__more {
	flex: 0 0 auto;
	color: var(--ttc-navy);
	font-size: 0.9rem;
	font-weight: 600;
	text-decoration: none;
}

.ttc-product-articles__more:hover {
	text-decoration: underline;
}

@media (max-width: 900px) {
	.ttc-product-articles .ttc-article-related__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.ttc-product-articles {
		margin-top: 2.5rem;
	}
	.ttc-product-articles .ttc-article-related__grid {
		grid-template-columns: 1fr;
	}
}

/* Man hinh hep: the logo an len anh se choan gan het be ngang, nen bo phan an
   len va xep ten xuong duoi. */
@media (max-width: 700px) {
	.ttc-brand-showcase__head {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.9rem;
	}

	.ttc-brand-showcase__logo {
		width: min(212px, 100%);
		height: 92px;
		margin-top: -56px;
	}

	.ttc-brand-showcase__id {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.75rem;
	}

	.ttc-brand-showcase__meta {
		padding-bottom: 0;
	}

	/* Man hinh hep thi loai san pham xuong hang rieng, can trai cho thang voi
	   ten hang. */
	.ttc-brand-showcase__types {
		justify-content: flex-start;
		width: 100%;
	}
}