/* TTK Services — giao diện theo bố cục tham chiếu Blo, chỉ dùng bộ màu TTK.
   Màu lấy từ theme.json (--wp--preset--color--*). Muốn đổi màu: sửa theme.json, không sửa ở đây. */

:root {
	--ttk-base: var(--wp--preset--color--base);
	--ttk-white: var(--wp--preset--color--white);
	--ttk-card: var(--wp--preset--color--card);
	--ttk-secondary: var(--wp--preset--color--secondary);
	--ttk-accent: var(--wp--preset--color--accent);
	--ttk-border: var(--wp--preset--color--border);
	--ttk-muted: var(--wp--preset--color--muted);
	--ttk-primary: var(--wp--preset--color--primary);
	--ttk-primary-dark: var(--wp--preset--color--primary-dark);
	--ttk-contrast: var(--wp--preset--color--contrast);
	--ttk-deep: var(--wp--preset--color--deep);
	/* Xanh TTK bản sáng (token dark theme của TTK) — dùng cho chữ nhấn trên nền tối để đủ tương phản */
	--ttk-primary-light: #A3C2B0;
	--ttk-serif: var(--wp--preset--font-family--heading);
	--ttk-sans: var(--wp--preset--font-family--body);
	--ttk-shadow: 0 12px 36px rgba(50, 46, 41, 0.08);
	--ttk-shadow-strong: 0 18px 48px rgba(50, 46, 41, 0.14);
	--ttk-radius: 3px;
	--ttk-gutter: 20px;
}

/* ---------- Nền tảng ---------- */

body { -webkit-font-smoothing: antialiased; }
.wp-site-blocks > *,
.ttk-main > *,
.wp-block-post-content.wp-block-post-content > * { margin-block: 0; }

h1, h2, h3, h4 {
	font-family: var(--ttk-serif);
	font-weight: 700;
	color: inherit;
	line-height: 1.3;
	margin: 0;
}
p, ul { margin: 0; }
a { color: var(--ttk-primary); text-decoration: none; }
a:hover { color: var(--ttk-primary-dark); }
:focus-visible { outline: 2px solid var(--ttk-primary); outline-offset: 3px; }

h1 em, h2 em {
	font-style: normal;
	color: var(--ttk-primary);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.18em;
}

.ttk-container {
	max-width: 1170px;
	margin-inline: auto;
	padding-inline: var(--ttk-gutter);
	box-sizing: content-box;
}

/* Khoảng cách dọc giữa các khối chữ trong một cụm */
.ttk-stack.ttk-stack > * + * { margin-block-start: 1rem; }
.ttk-stack.ttk-stack > .ttk-eyebrow + * { margin-block-start: 0.6rem; }
.ttk-stack.ttk-stack > .wp-block-buttons { margin-block-start: 1.75rem; }

.ttk-eyebrow {
	font-family: var(--ttk-sans);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ttk-primary);
}
.ttk-label {
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ttk-muted);
}
.ttk-title { font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.375rem); }
.ttk-lead { font-size: 1.0625rem; color: var(--ttk-muted); }
.ttk-center { text-align: center; }
.ttk-center.ttk-stack { max-width: 760px; margin-inline: auto; }
.ttk-section-head { margin-block-end: 3.5rem; }

/* ---------- Nút ---------- */

.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 14px; }
.wp-block-button .wp-block-button__link {
	display: inline-block;
	background: var(--ttk-primary);
	color: var(--ttk-white);
	border: 1.5px solid var(--ttk-primary);
	border-radius: 999px;
	padding: 0.85rem 1.9rem;
	font-family: var(--ttk-sans);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1.4;
	transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s;
	box-shadow: 0 8px 20px rgba(82, 122, 99, 0.25);
}
.wp-block-button .wp-block-button__link:hover { background: var(--ttk-primary-dark); border-color: var(--ttk-primary-dark); color: var(--ttk-white); }
.wp-block-button.is-style-outline .wp-block-button__link {
	background: var(--ttk-white);
	color: var(--ttk-contrast);
	border-color: var(--ttk-border);
	box-shadow: none;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover { border-color: var(--ttk-primary); color: var(--ttk-primary); }
.wp-block-button.ttk-btn-light .wp-block-button__link { background: var(--ttk-white); color: var(--ttk-contrast); border-color: var(--ttk-white); box-shadow: none; }
.wp-block-button.ttk-btn-light .wp-block-button__link:hover { background: var(--ttk-base); color: var(--ttk-primary-dark); }
.wp-block-button.ttk-btn-ghost .wp-block-button__link { background: transparent; color: var(--ttk-white); border-color: rgba(255, 255, 255, 0.55); box-shadow: none; }
.wp-block-button.ttk-btn-ghost .wp-block-button__link:hover { border-color: var(--ttk-white); }

/* ---------- Icon (mask SVG, định nghĩa trong icons.css) ---------- */

.ttk-ico::before {
	content: "";
	display: inline-block;
	flex: none;
	width: 1em;
	height: 1em;
	background-color: currentColor;
	-webkit-mask: var(--ttk-i) center / contain no-repeat;
	mask: var(--ttk-i) center / contain no-repeat;
}

/* ---------- Đầu trang ---------- */

header.wp-block-template-part {
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) - 41px);
	z-index: 50;
}
.ttk-topbar { background: var(--ttk-contrast); color: var(--ttk-secondary); font-size: 0.8125rem; }
.ttk-topbar__inner { display: flex; align-items: center; gap: 28px; min-height: 41px; }
.ttk-topbar__inner.ttk-topbar__inner > * { margin: 0; }
.ttk-topbar__item { display: inline-flex; align-items: center; gap: 8px; }
.ttk-topbar__item::before { color: var(--ttk-primary-light); }
.ttk-topbar__item a { color: inherit; }
.ttk-topbar__item a:hover { color: var(--ttk-white); }
.ttk-topbar__end { margin-inline-start: auto !important; }

.ttk-header { background: var(--ttk-white); box-shadow: 0 1px 0 var(--ttk-border); }
.ttk-header__inner { display: flex; align-items: center; gap: 32px; min-height: 84px; }
.ttk-header__inner.ttk-header__inner > * { margin: 0; }

.ttk-brand { display: flex; align-items: center; gap: 12px; }
.ttk-brand.ttk-brand > * { margin: 0; }
.ttk-brand .wp-block-site-logo img { display: block; height: auto; }
.ttk-brand__name { font-family: var(--ttk-serif); font-size: 1.5rem; font-weight: 700; line-height: 1; }
.ttk-brand__name a { color: var(--ttk-contrast); display: flex; flex-direction: column; }
.ttk-brand__name span { font-family: var(--ttk-sans); font-size: 0.6875rem; font-weight: 500; letter-spacing: 0.08em; color: var(--ttk-muted); margin-top: 4px; }
.ttk-brand--light .ttk-brand__name a { color: var(--ttk-white); }
.ttk-brand--light .ttk-brand__name span { color: var(--ttk-primary-light); }

.ttk-nav { flex: 1; }
.ttk-nav .wp-block-navigation__container { gap: 34px; }
.ttk-nav .wp-block-navigation-item__content { color: var(--ttk-contrast); font-size: 0.9375rem; font-weight: 500; padding-block: 8px; }
.ttk-nav .wp-block-navigation-item__content:hover { color: var(--ttk-primary); }
.ttk-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--ttk-white); padding: 32px var(--ttk-gutter); }
.ttk-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 20px; }
.ttk-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.25rem; }

.ttk-header__contact {
	display: grid;
	grid-template-columns: auto auto;
	grid-template-rows: auto auto;
	column-gap: 12px;
	align-items: center;
	padding-inline-start: 26px;
	border-inline-start: 1px solid var(--ttk-border);
	line-height: 1.3;
}
.ttk-header__contact::before { grid-row: 1 / 3; font-size: 30px; color: var(--ttk-primary); }
.ttk-header__contact span { font-size: 0.8125rem; color: var(--ttk-muted); }
.ttk-header__contact a { grid-column: 2; font-weight: 700; font-size: 1.0625rem; color: var(--ttk-contrast); }

/* ---------- Hero trang chủ ---------- */

.ttk-hero {
	background:
		radial-gradient(circle at 85% 20%, rgba(255, 255, 255, 0.55), transparent 45%),
		var(--ttk-accent);
	padding-block: 90px 170px;
	overflow: hidden;
}
.ttk-hero__title { font-family: var(--ttk-serif); font-size: clamp(2.25rem, 1.4rem + 3vw, 3.5rem); line-height: 1.2; color: var(--ttk-contrast); }
.ttk-hero .ttk-lead { max-width: 520px; color: var(--ttk-secondary-fg, #3E3832); }

/* Khung ảnh chờ ảnh thật */
.ttk-photo {
	position: relative;
	aspect-ratio: 4 / 3;
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
	padding: 20px;
	box-sizing: border-box;
	background:
		repeating-linear-gradient(135deg, rgba(82, 122, 99, 0.07) 0 12px, transparent 12px 24px),
		var(--ttk-card);
	border: 1.5px dashed rgba(82, 122, 99, 0.45);
}
.ttk-photo p { font-size: 0.8125rem; color: var(--ttk-primary-dark); background: var(--ttk-white); padding: 6px 12px; border-radius: 999px; }
.ttk-photo--tall { aspect-ratio: 4 / 5; max-height: 520px; }
/* Anh hero bi max-height chan nen hep hon cot luoi (416px trong 553px). Day sat
   me phai de thang hang voi the cuoi cua khoi ben duoi. margin-left:auto thay vi
   so px cung — cot doi be rong theo man hinh thi van thang hang.
   Phai lap ".ttk-split.ttk-split" de thang reset margin o cuoi file (cung do dac
   hieu 0,3,0); viet ".ttk-hero .ttk-photo--tall" khong du manh, se bi ghi de. */
.ttk-hero .ttk-split.ttk-split > .ttk-photo--tall { margin-left: auto; }
.ttk-photo + .ttk-photo { display: none; }

/* Khung da co anh that: bo gach cheo va vien dut, anh phu kin khung */
.ttk-photo--filled {
	display: block;
	padding: 0;
	margin: 0;
	background: var(--ttk-card);
	border: 1px solid var(--ttk-border);
	border-radius: var(--ttk-radius);
	overflow: hidden;
}
/* !important o day la co y, khong phai lam bua. Khi nguoi van hanh thay anh trong
   wp-admin roi keo chinh kich thuoc, WordPress gan style INLINE len the img
   (width:720px; height:auto; aspect-ratio:...). Style inline thang moi selector,
   nen khong co !important thi anh se khong lap kin khung — day dung la truong hop
   !important sinh ra de xu ly. Chi ap trong khung .ttk-photo--filled, khong anh
   huong anh khac tren site. */
.ttk-photo--filled img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	aspect-ratio: auto !important;
	object-fit: cover;
}

/* ---------- Bố cục lưới ---------- */

.ttk-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 64px; align-items: center; }
.ttk-split--wide-right { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.ttk-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.ttk-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.ttk-split.ttk-split > *,
.ttk-grid-2.ttk-grid-2 > *,
.ttk-grid-3.ttk-grid-3 > *,
.ttk-tiles.ttk-tiles > * { margin: 0; }

.ttk-split + .ttk-split { margin-block-start: 76px !important; }

.ttk-section { padding-block: 100px; }
.ttk-section--alt { background: var(--ttk-card); }
.ttk-section--tight { padding-block: 72px; }

/* Thẻ đè lên phần trên */
.ttk-overlap { margin-top: -110px !important; position: relative; z-index: 2; padding-block-end: 20px; }
.ttk-overlap + .ttk-section { padding-block-start: 80px; }

.ttk-card {
	background: var(--ttk-white);
	padding: 38px 32px;
	box-shadow: var(--ttk-shadow);
	border-radius: var(--ttk-radius);
	transition: transform 0.25s, box-shadow 0.25s;
}
.ttk-card:hover { transform: translateY(-4px); box-shadow: var(--ttk-shadow-strong); }
.ttk-card.ttk-card > * + * { margin-block-start: 0.75rem; }
.ttk-card h3 { font-size: 1.1875rem; }
.ttk-card p { color: var(--ttk-muted); font-size: 0.9375rem; }
.ttk-card.ttk-ico::before { display: block; font-size: 44px; color: var(--ttk-primary); margin-bottom: 22px; }
.ttk-overlap .ttk-card { border-bottom: 3px solid var(--ttk-primary); }

.ttk-num { font-family: var(--ttk-serif); font-size: 0.9375rem !important; font-weight: 700; color: var(--ttk-primary) !important; }

.ttk-card--active { background: var(--ttk-primary); color: var(--ttk-white); }
.ttk-card--active p:not(.ttk-badge), .ttk-card--active .ttk-num { color: rgba(255, 255, 255, 0.85) !important; }
.ttk-card--active .ttk-badge { background: var(--ttk-white); color: var(--ttk-primary-dark) !important; }

.ttk-badge {
	display: inline-block;
	font-size: 0.6875rem !important;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ttk-primary-dark) !important;
	background: var(--ttk-accent);
	padding: 4px 12px;
	border-radius: 999px;
}

/* Trích dẫn kiểu Blo */
.ttk-quote {
	position: relative;
	background: var(--ttk-white);
	border-inline-start: 3px solid var(--ttk-primary);
	box-shadow: var(--ttk-shadow);
	padding: 30px 34px 30px 38px;
}
.ttk-quote::before {
	content: "\201C";
	position: absolute;
	top: -14px;
	left: 18px;
	font-family: var(--ttk-serif);
	font-size: 72px;
	line-height: 1;
	color: var(--ttk-accent);
}
.ttk-quote p { position: relative; font-family: var(--ttk-serif); font-size: 1.0625rem; line-height: 1.6; color: var(--ttk-contrast); }
.ttk-quote--lg p { font-size: 1.3125rem; }

/* Ô icon 3x2 (khối "core values" của Blo) */
.ttk-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.ttk-tile {
	background: var(--ttk-white);
	padding: 30px 20px 26px;
	text-align: center;
	box-shadow: var(--ttk-shadow);
	border-radius: var(--ttk-radius);
	transition: transform 0.25s;
}
.ttk-tile:hover { transform: translateY(-4px); }
.ttk-tile.ttk-tile > * + * { margin-block-start: 0.5rem; }
.ttk-tile.ttk-ico::before { display: block; margin: 0 auto 16px; font-size: 40px; color: var(--ttk-primary); }
.ttk-tile h3 { font-family: var(--ttk-sans); font-size: 0.9375rem; font-weight: 600; }
.ttk-tile p { font-size: 0.8125rem; line-height: 1.55; color: var(--ttk-muted); }

/* Dải số */
.ttk-stats { background: var(--ttk-secondary); padding-block: 64px; }
.ttk-stat { text-align: center; }
.ttk-stat.ttk-stat > * + * { margin-block-start: 0.35rem; }
.ttk-stat__num { font-family: var(--ttk-serif); font-size: clamp(1.75rem, 1.3rem + 1.4vw, 2.5rem); font-weight: 700; color: var(--ttk-primary); line-height: 1.2; }
.ttk-stat__label { font-size: 0.875rem; font-weight: 500; color: var(--ttk-contrast); }

/* Khối tối */
.ttk-dark {
	background:
		repeating-linear-gradient(115deg, rgba(255, 255, 255, 0.025) 0 1px, transparent 1px 90px),
		var(--ttk-contrast);
	color: var(--ttk-secondary);
}
.ttk-dark h2, .ttk-dark h3 { color: var(--ttk-white); }
.ttk-dark h2 em { color: var(--ttk-primary-light); }
.ttk-dark .ttk-eyebrow { color: var(--ttk-primary-light); }
.ttk-dark a:not(.wp-block-button__link) { color: var(--ttk-primary-light); }
.ttk-dark .ttk-lead { color: var(--ttk-secondary); }

/* Thẻ vị trí (khối career của Blo) */
.ttk-jobs-mini { display: grid; gap: 20px; }
.ttk-jobs-mini.ttk-jobs-mini > * { margin: 0; }
.ttk-job {
	background: var(--ttk-white);
	color: var(--ttk-contrast);
	padding: 30px 32px;
	box-shadow: var(--ttk-shadow);
	border-radius: var(--ttk-radius);
}
.ttk-job.ttk-job > * + * { margin-block-start: 0.5rem; }
.ttk-job h3 { font-size: 1.3125rem; color: var(--ttk-contrast) !important; margin-block-start: 0.9rem !important; }
.ttk-job__meta { font-size: 0.875rem; color: var(--ttk-muted); }
.ttk-job__meta strong { color: var(--ttk-contrast); font-weight: 600; }
.ttk-job .wp-block-buttons { margin-block-start: 1.25rem !important; }
.ttk-job .wp-block-button .wp-block-button__link { padding: 0.6rem 1.3rem; font-size: 0.75rem; border-radius: var(--ttk-radius); }
.ttk-dark .ttk-job a:not(.wp-block-button__link) { color: var(--ttk-primary); }

/* Dải chữ năng lực (thay dải logo của Blo) */
.ttk-strip { padding-block: 44px; border-block: 1px solid var(--ttk-border); background: var(--ttk-base); }
.ttk-strip__text { text-align: center; font-family: var(--ttk-serif); font-size: 1.0625rem; color: var(--ttk-muted); word-spacing: 0.15em; line-height: 2.1; }

/* ---------- Khối kêu gọi cuối trang (dải CTA của Blo) ---------- */

.ttk-cta {
	background: linear-gradient(90deg, var(--ttk-contrast) 0 calc(50% - 585px + 250px), var(--ttk-primary) 0);
	color: var(--ttk-white);
}
.ttk-cta__inner { display: grid; grid-template-columns: 250px minmax(0, 1fr); align-items: stretch; }
.ttk-cta__inner.ttk-cta__inner > * { margin: 0; }
.ttk-cta__brand { background: var(--ttk-contrast); display: flex; align-items: center; justify-content: flex-start; padding-block: 36px; }
.ttk-cta__brand.ttk-cta__brand > * { margin: 0; }
.ttk-cta__body { display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap; padding: 44px 0 44px 56px; }
.ttk-cta__body.ttk-cta__body > * { margin: 0; }
.ttk-cta__title { font-size: clamp(1.375rem, 1rem + 1.1vw, 1.875rem); color: var(--ttk-white); max-width: 560px; }
.ttk-cta__title em { color: var(--ttk-white); text-decoration-color: rgba(255, 255, 255, 0.6); }

/* ---------- Đầu trang con ---------- */

.ttk-page-hero {
	background:
		repeating-linear-gradient(115deg, rgba(255, 255, 255, 0.03) 0 1px, transparent 1px 90px),
		linear-gradient(180deg, var(--ttk-contrast), var(--ttk-deep));
	color: var(--ttk-secondary);
	padding-block: 96px 88px;
}
.ttk-page-hero--overlap { padding-block-end: 190px; }
.ttk-page-hero .ttk-stack { max-width: 860px; }
.ttk-crumbs { font-size: 0.8125rem; letter-spacing: 0.04em; color: var(--ttk-primary-light); }
.ttk-crumbs a { color: var(--ttk-white); }
.ttk-page-hero__title { font-size: clamp(2rem, 1.3rem + 2.6vw, 3.125rem); line-height: 1.22; color: var(--ttk-white); }
.ttk-page-hero__title em { color: var(--ttk-primary-light); }
.ttk-page-hero__lead { font-size: 1.125rem; max-width: 720px; }

/* Thanh tab trong trang (About/Mission/Career của Blo) */
.ttk-subnav { background: var(--ttk-white); box-shadow: 0 1px 0 var(--ttk-border); }
.ttk-subnav__links { display: flex; flex-wrap: wrap; justify-content: center; }
.ttk-subnav__links a { display: block; padding: 18px 26px; font-size: 0.875rem; font-weight: 500; color: var(--ttk-contrast); transition: background-color 0.2s, color 0.2s; }
.ttk-subnav__links a:hover { background: var(--ttk-primary); color: var(--ttk-white); }

[id] { scroll-margin-top: 110px; }

/* Thẻ năng lực đầy đủ */
.ttk-tags { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 6px; }
.ttk-tags code {
	font-family: var(--ttk-sans);
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--ttk-primary-dark);
	background: var(--ttk-accent);
	padding: 3px 10px;
	border-radius: 999px;
}

/* Mốc hành trình */
.ttk-milestone {
	background: var(--ttk-white);
	padding: 32px 30px;
	border-top: 3px solid var(--ttk-primary);
	box-shadow: var(--ttk-shadow);
}
.ttk-milestone.ttk-milestone > * + * { margin-block-start: 0.6rem; }
.ttk-milestone__year { font-family: var(--ttk-serif); font-size: 2.25rem; font-weight: 700; color: var(--ttk-primary); line-height: 1.1; }
.ttk-milestone h3 { font-size: 1.125rem; }
.ttk-milestone p:last-child { color: var(--ttk-muted); font-size: 0.9375rem; }

/* Người sáng lập */
.ttk-bigquote { font-family: var(--ttk-serif); font-size: clamp(1.375rem, 1rem + 1.3vw, 2rem); line-height: 1.5; color: var(--ttk-white); }
.ttk-bigquote__by { color: var(--ttk-primary-light); font-weight: 500; }
.ttk-founder-wrap { padding-block: 0 100px; background: linear-gradient(180deg, var(--ttk-contrast) 0 120px, var(--ttk-base) 120px); }
.ttk-founder { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); box-shadow: var(--ttk-shadow-strong); }
.ttk-founder.ttk-founder > * { margin: 0; }
.ttk-founder__bio { background: var(--ttk-white); padding: 52px 48px; }
.ttk-founder__bio p:not(.ttk-eyebrow) { color: var(--ttk-muted); }
.ttk-founder__creds { background: var(--ttk-secondary); padding: 52px 44px; }
.ttk-founder__creds h3 { font-size: 1.25rem; }

.ttk-dark-band { padding-block: 100px 180px; }

/* Danh sách có dấu tích */
.ttk-checks { list-style: none; padding: 0; }
.ttk-checks li { position: relative; padding-inline-start: 30px; }
.ttk-checks li + li { margin-top: 0.6rem; }
.ttk-checks li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.3em;
	width: 18px;
	height: 18px;
	background-color: var(--ttk-primary);
	-webkit-mask: var(--ttk-i-check) center / contain no-repeat;
	mask: var(--ttk-i-check) center / contain no-repeat;
}
.ttk-checks--plus li::before { -webkit-mask-image: var(--ttk-i-plus); mask-image: var(--ttk-i-plus); background-color: var(--ttk-muted); }
.ttk-creds li { font-size: 0.9375rem; }

/* Các bước */
.ttk-step, .ttk-process {
	position: relative;
	background: var(--ttk-white);
	padding: 40px 32px 34px;
	box-shadow: var(--ttk-shadow);
	border-radius: var(--ttk-radius);
}
.ttk-step.ttk-step > * + *, .ttk-process.ttk-process > * + * { margin-block-start: 0.7rem; }
.ttk-step__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var(--ttk-primary);
	color: var(--ttk-white);
	font-family: var(--ttk-serif);
	font-weight: 700;
	box-shadow: 0 0 0 8px var(--ttk-accent);
}
.ttk-step h3, .ttk-process h3 { font-size: 1.25rem; margin-block-start: 1.4rem !important; }
.ttk-step p:last-child { color: var(--ttk-muted); }
.ttk-process .ttk-label { margin-block-start: 1.2rem !important; }
.ttk-process .ttk-label + p { font-size: 0.9375rem; }
.ttk-process__time { color: var(--ttk-primary-dark); font-weight: 500; }

.ttk-tagline { margin-top: 40px !important; text-align: center; font-family: var(--ttk-serif); font-style: italic; color: var(--ttk-muted); }

/* Hai ô cạnh nhau (Excellence Record / Get Quote của Blo) */
.ttk-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); box-shadow: var(--ttk-shadow-strong); }
.ttk-duo.ttk-duo > * { margin: 0; }
.ttk-duo__item { background: var(--ttk-white); padding: 52px 48px; }
.ttk-duo__item--alt { background: var(--ttk-secondary); }
.ttk-duo__item h3 { font-size: 1.375rem; }
.ttk-duo__item p { color: var(--ttk-muted); }

/* Thẻ Pillar */
.ttk-pillar-card { background: var(--ttk-primary); color: var(--ttk-white); padding: 48px 44px; box-shadow: var(--ttk-shadow-strong); }
.ttk-pillar-card.ttk-pillar-card > * + * { margin-block-start: 0.8rem; }
.ttk-pillar-card .ttk-stat__num { color: var(--ttk-white); font-size: 3rem; }
.ttk-pillar-card p { font-size: 1.0625rem; }

/* Chi tiết vị trí */
.ttk-role { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 56px; align-items: start; }
.ttk-role.ttk-role > * { margin: 0; }
.ttk-role__main h3 { font-size: 1.25rem; margin-block-start: 2.2rem !important; }
.ttk-role__main .ttk-label { margin-block-start: 1.2rem !important; }
.ttk-role__aside {
	position: sticky;
	top: 120px;
	background: var(--ttk-white);
	padding: 34px 32px;
	box-shadow: var(--ttk-shadow);
	border-top: 3px solid var(--ttk-primary);
}
.ttk-role__aside.ttk-role__aside > * + * { margin-block-start: 0.35rem; }
.ttk-role__aside .ttk-label { margin-block-start: 1.2rem !important; }
.ttk-role__aside .ttk-label:first-child { margin-block-start: 0 !important; }
.ttk-role__salary { font-family: var(--ttk-serif); font-size: 1.25rem; font-weight: 700; color: var(--ttk-primary); }
.ttk-role__aside .ttk-checks li { font-size: 0.9375rem; }
.ttk-role__aside .wp-block-buttons { margin-block-start: 1.6rem !important; }
.ttk-role__aside .wp-block-button, .ttk-role__aside .wp-block-button__link { width: 100%; text-align: center; box-sizing: border-box; }

/* Liên hệ */
.ttk-contact-card { text-align: center; }
.ttk-contact-card.ttk-ico::before { margin-inline: auto; }
.ttk-contact-card p { color: var(--ttk-contrast) !important; }
.ttk-contact-card p.ttk-contact-card__sub { color: var(--ttk-muted) !important; }

.ttk-info { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 48px; }
.ttk-info.ttk-info > * { margin: 0; }
.ttk-info__row { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 16px; padding-block: 16px; border-bottom: 1px solid var(--ttk-border); align-items: baseline; }
.ttk-info__row.ttk-info__row > * { margin: 0; }

.ttk-reason { padding-block: 18px; border-bottom: 1px solid var(--ttk-border); }
.ttk-reason.ttk-reason > * + * { margin-block-start: 0.4rem; }
.ttk-reason h3 { font-size: 1.0625rem; }
.ttk-reason p { color: var(--ttk-muted); font-size: 0.9375rem; }

.ttk-form { background: var(--ttk-white); padding: 44px 40px; box-shadow: var(--ttk-shadow-strong); }
.ttk-form fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.ttk-form__pending { font-size: 0.8125rem; color: var(--ttk-primary-dark); background: var(--ttk-accent); padding: 10px 14px; margin-bottom: 24px !important; border-inline-start: 3px solid var(--ttk-primary); }
.ttk-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.ttk-form label { display: flex; flex-direction: column; gap: 6px; font-size: 0.8125rem; font-weight: 500; color: var(--ttk-contrast); }
.ttk-form__full { grid-column: 1 / -1; }
.ttk-form input[type="text"], .ttk-form input[type="email"], .ttk-form input[type="tel"], .ttk-form textarea {
	font: inherit;
	font-size: 0.9375rem;
	font-weight: 400;
	color: var(--ttk-contrast);
	background: var(--ttk-base);
	border: 1px solid var(--ttk-border);
	border-radius: var(--ttk-radius);
	padding: 12px 14px;
}
.ttk-form textarea { resize: vertical; }
.ttk-form ::placeholder { color: var(--ttk-muted); opacity: 0.8; }
.ttk-form .ttk-form__consent { flex-direction: row; align-items: flex-start; gap: 10px; margin-top: 22px; font-weight: 400; font-size: 0.875rem; }
.ttk-form__consent input { margin-top: 4px; accent-color: var(--ttk-primary); }
.ttk-form__notice { font-size: 0.75rem; line-height: 1.6; color: var(--ttk-muted); margin-top: 12px !important; }
.ttk-form button {
	margin-top: 24px;
	font: inherit;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ttk-white);
	background: var(--ttk-contrast);
	border: 0;
	border-radius: var(--ttk-radius);
	padding: 15px 34px;
}
.ttk-form fieldset:disabled button { opacity: 0.55; cursor: not-allowed; }

.ttk-box { display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; background: var(--ttk-white); padding: 48px 52px; box-shadow: var(--ttk-shadow); border-inline-start: 3px solid var(--ttk-primary); }
.ttk-box.ttk-box > * { margin: 0; }
.ttk-box .ttk-stack { max-width: 640px; }

/* ---------- Chân trang ---------- */

.ttk-footer {
	background:
		repeating-linear-gradient(115deg, rgba(255, 255, 255, 0.025) 0 1px, transparent 1px 110px),
		var(--ttk-contrast);
	color: var(--ttk-secondary);
	font-size: 0.9375rem;
	padding-block-start: 80px;
}
.ttk-footer a { color: var(--ttk-secondary); }
.ttk-footer a:hover { color: var(--ttk-white); }
.ttk-footer__cols { gap: 56px !important; margin: 0 !important; }
.ttk-footer__about.ttk-footer__about > * + * { margin-block-start: 1.1rem; }
.ttk-footer__pillar { display: inline-block; font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ttk-primary-light); border: 1px solid rgba(163, 194, 176, 0.4); padding: 5px 12px; border-radius: 999px; }
.ttk-footer__title { font-size: 1.125rem; color: var(--ttk-white); margin-bottom: 1.4rem !important; }
.ttk-footer ul { list-style: none; padding: 0; }
.ttk-footer li + li { margin-top: 0.7rem; }
.ttk-footer__links li::before { content: "·"; color: var(--ttk-primary-light); margin-inline-end: 8px; }
.ttk-footer__contact li { display: flex; gap: 12px; align-items: baseline; }
.ttk-footer__contact li::before { color: var(--ttk-primary-light); transform: translateY(2px); }
.ttk-footer__bottom { margin-top: 64px !important; background: var(--ttk-deep); font-size: 0.8125rem; }
.ttk-footer__bottom-inner { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-block: 22px; }
.ttk-footer__bottom-inner.ttk-footer__bottom-inner > * { margin: 0; }
.ttk-footer__bottom a { letter-spacing: 0.1em; text-transform: uppercase; }

/* ---------- Màn hình vừa ---------- */

@media (max-width: 1100px) {
	.ttk-header__contact { display: none !important; }
	.ttk-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ttk-split { gap: 48px; }
	.ttk-cta { background: var(--ttk-primary); }
	.ttk-cta__inner { grid-template-columns: 1fr; }
	.ttk-cta__brand { display: none; }
	.ttk-cta__body { padding-inline: 0; }
}

/* ---------- Điện thoại ---------- */

@media (max-width: 781px) {
	:root { --ttk-gutter: 18px; }
	.ttk-section { padding-block: 64px; }
	.ttk-topbar__item:not(.ttk-ico--mail) { display: none; }
	.ttk-header__inner { min-height: 68px; gap: 12px; justify-content: space-between; }
	.ttk-nav { flex: none; }
	.ttk-hero { padding-block: 56px 130px; }
	.ttk-split, .ttk-split--wide-right, .ttk-grid-2, .ttk-grid-3, .ttk-role, .ttk-founder, .ttk-duo, .ttk-info, .ttk-form__grid { grid-template-columns: minmax(0, 1fr); }
	.ttk-split { gap: 40px; }
	.ttk-tiles { grid-template-columns: minmax(0, 1fr); }
	.ttk-photo--tall { aspect-ratio: 4 / 3; }
	.ttk-overlap { margin-top: -90px !important; }
	.ttk-card, .ttk-step, .ttk-process { padding: 30px 24px; }
	.ttk-page-hero { padding-block: 64px 60px; }
	.ttk-page-hero--overlap { padding-block-end: 150px; }
	.ttk-founder__bio, .ttk-founder__creds, .ttk-duo__item, .ttk-form, .ttk-box { padding: 34px 24px; }
	.ttk-role__aside { position: static; }
	.ttk-info__row { grid-template-columns: minmax(0, 1fr); gap: 2px; }
	.ttk-subnav__links a { padding: 14px 14px; }
	.ttk-cta__body { padding-block: 40px; }
	.ttk-footer { padding-block-start: 56px; }
}

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; }
}