/*
Theme Name: TrucCons
Theme URI: https://truccons.vn/
Author: TrucCons
Author URI: https://truccons.vn/
Description: Theme WordPress chuyên nghiệp cho công ty xây dựng, thiết kế và thi công nhà trọn gói TrucCons. Đầy đủ trang chủ tuỳ biến, dịch vụ, dự án, quy trình, báo giá, tin tức và liên hệ.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: truccons
Tags: construction, business, one-column, two-columns, right-sidebar, custom-menu, custom-logo, featured-images, translation-ready
*/

/* =========================================================
   1. Design tokens
   ========================================================= */
:root {
	--tc-navy:        #0d1a2b;
	--tc-navy-soft:   #142740;
	--tc-navy-line:   #1e3350;
	--tc-accent:      #f0a020;
	--tc-accent-dark: #cf8410;
	--tc-accent-soft: #fff4e0;
	--tc-text:        #1d2733;
	--tc-muted:       #64748b;
	--tc-border:      #e3e8ef;
	--tc-bg:          #ffffff;
	--tc-bg-alt:      #f5f7fa;
	--tc-radius:      14px;
	--tc-radius-sm:   8px;
	--tc-shadow:      0 1px 2px rgba(13, 26, 43, .06), 0 8px 24px rgba(13, 26, 43, .06);
	--tc-shadow-lg:   0 18px 48px rgba(13, 26, 43, .14);
	--tc-container:   1200px;
	--tc-font:        "Be Vietnam Pro", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--tc-ease:        cubic-bezier(.2, .7, .3, 1);
}

/* =========================================================
   2. Reset & base
   ========================================================= */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
	margin: 0;
	font-family: var(--tc-font);
	font-size: 16px;
	line-height: 1.7;
	color: var(--tc-text);
	background: var(--tc-bg);
	overflow-x: hidden;
}

img, svg, video { max-width: 100%; height: auto; display: block; }

a { color: var(--tc-accent-dark); text-decoration: none; transition: color .2s var(--tc-ease); }
a:hover { color: var(--tc-accent); }

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 .6em;
	font-weight: 800;
	line-height: 1.22;
	color: var(--tc-navy);
	letter-spacing: -.02em;
}
h1 { font-size: clamp(2rem, 4.4vw, 3.1rem); }
h2 { font-size: clamp(1.6rem, 3.2vw, 2.35rem); }
h3 { font-size: clamp(1.2rem, 2vw, 1.45rem); }
h4 { font-size: 1.1rem; }

p { margin: 0 0 1.1em; }
ul, ol { padding-left: 1.25em; }

blockquote {
	margin: 1.6em 0;
	padding: 1.1em 1.4em;
	border-left: 4px solid var(--tc-accent);
	background: var(--tc-bg-alt);
	border-radius: 0 var(--tc-radius-sm) var(--tc-radius-sm) 0;
	font-style: italic;
	color: var(--tc-navy);
}
blockquote p:last-child { margin-bottom: 0; }

code, pre, kbd {
	font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
	font-size: .92em;
}
pre {
	padding: 1.1em;
	overflow-x: auto;
	background: var(--tc-navy);
	color: #e6edf5;
	border-radius: var(--tc-radius-sm);
}
code { background: var(--tc-bg-alt); padding: .15em .4em; border-radius: 4px; }
pre code { background: none; padding: 0; color: inherit; }

table { width: 100%; border-collapse: collapse; margin-bottom: 1.5em; }
th, td { padding: .7em .9em; border: 1px solid var(--tc-border); text-align: left; }
th { background: var(--tc-bg-alt); font-weight: 700; color: var(--tc-navy); }

hr { border: 0; border-top: 1px solid var(--tc-border); margin: 2.4em 0; }

::selection { background: var(--tc-accent); color: #fff; }

/* =========================================================
   3. Layout helpers
   ========================================================= */
.tc-container {
	width: 100%;
	max-width: var(--tc-container);
	margin-inline: auto;
	padding-inline: 20px;
}
.tc-section { padding: clamp(56px, 8vw, 96px) 0; }
.tc-section--alt { background: var(--tc-bg-alt); }
.tc-section--dark { background: var(--tc-navy); color: #cbd5e1; }
.tc-section--dark h2,
.tc-section--dark h3 { color: #fff; }

/* Fixed column counts per breakpoint — auto-fit left orphan rows (3 + 1, 4 + 2). */
.tc-grid { display: grid; gap: 26px; }
.tc-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tc-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tc-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .tc-grid--4 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) {
	.tc-grid--3, .tc-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
	.tc-grid--2, .tc-grid--3, .tc-grid--4 { grid-template-columns: minmax(0, 1fr); }
}

.tc-screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap; border: 0;
}
.tc-skip-link:focus {
	position: fixed; top: 12px; left: 12px; z-index: 9999;
	width: auto; height: auto; clip: auto;
	padding: 10px 18px; background: var(--tc-accent); color: #fff;
	border-radius: var(--tc-radius-sm); font-weight: 700;
}

/* =========================================================
   4. Buttons, badges, section heads
   ========================================================= */
.tc-btn {
	display: inline-flex;
	align-items: center;
	gap: .55em;
	padding: 13px 26px;
	font-weight: 700;
	font-size: .95rem;
	border-radius: 999px;
	border: 2px solid transparent;
	cursor: pointer;
	transition: transform .2s var(--tc-ease), box-shadow .2s var(--tc-ease), background .2s var(--tc-ease), color .2s var(--tc-ease);
	line-height: 1.2;
	text-align: center;
}
.tc-btn:hover { transform: translateY(-2px); }
.tc-btn--primary {
	background: var(--tc-accent);
	color: #fff;
	box-shadow: 0 8px 20px rgba(240, 160, 32, .32);
}
.tc-btn--primary:hover { background: var(--tc-accent-dark); color: #fff; }
.tc-btn--dark { background: var(--tc-navy); color: #fff; }
.tc-btn--dark:hover { background: var(--tc-navy-soft); color: #fff; }
.tc-btn--ghost { border-color: currentColor; color: inherit; background: transparent; }
.tc-btn--ghost:hover { background: var(--tc-accent); border-color: var(--tc-accent); color: #fff; }
.tc-btn--block { display: flex; width: 100%; justify-content: center; }

.tc-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .5em;
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--tc-accent-dark);
	margin-bottom: .8em;
}
.tc-eyebrow::before {
	content: "";
	width: 26px; height: 2px;
	background: var(--tc-accent);
	display: inline-block;
}
.tc-section--dark .tc-eyebrow { color: var(--tc-accent); }

.tc-section-head { max-width: 780px; margin-bottom: 46px; }
.tc-section-head--center { margin-inline: auto; text-align: center; max-width: 860px; }
/* Stop headings dropping a single orphan word onto the last line. */
.tc-section-head h2, .tc-hero h1, .tc-banner h1 { text-wrap: balance; }
.tc-section-head p { color: var(--tc-muted); font-size: 1.05rem; margin-bottom: 0; text-wrap: pretty; }
.tc-section--dark .tc-section-head p { color: #94a3b8; }

/* =========================================================
   5. Header
   ========================================================= */
.tc-topbar {
	background: var(--tc-navy);
	color: #93a4b8;
	font-size: .85rem;
}
.tc-topbar .tc-container {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 26px;
	align-items: center;
	justify-content: space-between;
	min-height: 42px;
}
.tc-topbar__list { display: flex; flex-wrap: wrap; gap: 20px; list-style: none; margin: 0; padding: 0; }
.tc-topbar__list li { display: flex; align-items: center; gap: .45em; }
.tc-topbar a { color: #cbd5e1; }
.tc-topbar a:hover { color: var(--tc-accent); }
.tc-topbar__socials { display: flex; gap: 12px; }
.tc-topbar__socials a { display: inline-flex; }

.tc-header {
	position: sticky;
	top: 0;
	z-index: 900;
	background: rgba(255, 255, 255, .97);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--tc-border);
	transition: box-shadow .25s var(--tc-ease);
}
.tc-header.is-stuck { box-shadow: 0 6px 24px rgba(13, 26, 43, .1); }
.tc-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	min-height: 76px;
	flex-wrap: nowrap;
}

.tc-brand { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.tc-brand img { max-height: 52px; width: auto; }
.tc-brand__mark {
	width: 42px; height: 42px;
	border-radius: 11px;
	background: linear-gradient(135deg, var(--tc-accent), var(--tc-accent-dark));
	display: grid; place-items: center;
	color: #fff; font-weight: 900; font-size: 1.15rem;
	flex: 0 0 auto;
}
.tc-brand__name {
	font-size: 1.35rem; font-weight: 900; color: var(--tc-navy);
	letter-spacing: -.03em; line-height: 1.1; display: block;
}
.tc-brand__tagline {
	font-size: .7rem; color: var(--tc-muted);
	letter-spacing: .08em; text-transform: uppercase;
	white-space: nowrap;
}
.tc-brand a { color: inherit; }

.tc-nav ul { list-style: none; margin: 0; padding: 0; }
.tc-nav > ul { display: flex; align-items: center; gap: 2px; }
.tc-nav li { position: relative; }
.tc-nav a {
	display: block;
	padding: 10px 11px;
	font-weight: 600;
	font-size: .92rem;
	color: var(--tc-navy);
	border-radius: var(--tc-radius-sm);
	/* Eight Vietnamese menu labels wrapped onto two lines at 1440px. */
	white-space: nowrap;
}
.tc-nav a:hover,
.tc-nav .current-menu-item > a,
.tc-nav .current_page_item > a,
.tc-nav .current-menu-ancestor > a { color: var(--tc-accent-dark); background: var(--tc-accent-soft); }

.tc-nav .menu-item-has-children > a::after {
	content: "";
	display: inline-block;
	width: 6px; height: 6px;
	margin-left: 7px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
}
.tc-nav .sub-menu {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	min-width: 236px;
	background: #fff;
	border: 1px solid var(--tc-border);
	border-radius: var(--tc-radius);
	box-shadow: var(--tc-shadow-lg);
	padding: 8px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: all .2s var(--tc-ease);
}
.tc-nav li:hover > .sub-menu,
.tc-nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.tc-nav .sub-menu .sub-menu { top: -8px; left: 100%; }
.tc-nav .sub-menu a { padding: 9px 13px; font-weight: 500; }

.tc-header__actions { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.tc-header__phone { display: flex; align-items: center; gap: 9px; flex: 0 0 auto; }
.tc-header__phone-ico {
	width: 38px; height: 38px; border-radius: 50%;
	background: var(--tc-accent-soft); color: var(--tc-accent-dark);
	display: grid; place-items: center; flex: 0 0 auto;
}
/* Without nowrap the number broke across three lines and blew up the header. */
.tc-header__phone small { display: block; font-size: .68rem; color: var(--tc-muted); line-height: 1.2; white-space: nowrap; }
.tc-header__phone strong { display: block; font-size: 1rem; color: var(--tc-navy); line-height: 1.2; white-space: nowrap; }
.tc-header__actions .tc-btn { white-space: nowrap; padding: 12px 22px; }

.tc-burger {
	display: none;
	width: 46px; height: 42px;
	border: 1px solid var(--tc-border);
	background: #fff;
	border-radius: var(--tc-radius-sm);
	cursor: pointer;
	padding: 0;
	place-items: center;
}
.tc-burger span, .tc-burger span::before, .tc-burger span::after {
	display: block; width: 20px; height: 2px; background: var(--tc-navy);
	border-radius: 2px; transition: transform .25s var(--tc-ease), opacity .2s;
}
.tc-burger span { position: relative; }
.tc-burger span::before, .tc-burger span::after { content: ""; position: absolute; left: 0; }
.tc-burger span::before { top: -6px; }
.tc-burger span::after { top: 6px; }
.tc-burger[aria-expanded="true"] span { background: transparent; }
.tc-burger[aria-expanded="true"] span::before { transform: translateY(6px) rotate(45deg); }
.tc-burger[aria-expanded="true"] span::after { transform: translateY(-6px) rotate(-45deg); }

/* =========================================================
   6. Hero
   ========================================================= */
.tc-hero {
	position: relative;
	color: #fff;
	background: var(--tc-navy);
	overflow: hidden;
}
.tc-hero__bg {
	position: absolute; inset: 0;
	background-size: cover; background-position: center;
	opacity: .55;
}
.tc-hero::after {
	content: "";
	position: absolute; inset: 0;
	background:
		linear-gradient(100deg, rgba(9, 18, 31, .95) 0%, rgba(9, 18, 31, .84) 42%, rgba(9, 18, 31, .68) 100%),
		linear-gradient(to bottom, rgba(9, 18, 31, .5) 0%, transparent 22%);
}
.tc-hero__grid {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 400px);
	gap: 56px;
	align-items: center;
	padding: clamp(56px, 7vw, 92px) 0;
}
.tc-hero__inner { max-width: 660px; }

/* Quote card sitting in what used to be dead space on the right. */
.tc-hero__card {
	background: rgba(255, 255, 255, .97);
	border-radius: var(--tc-radius);
	padding: 28px 26px 24px;
	box-shadow: 0 24px 60px rgba(0, 0, 0, .34);
	color: var(--tc-text);
}
.tc-hero__card h2 { font-size: 1.28rem; margin-bottom: .3em; }
.tc-hero__card > p { font-size: .9rem; color: var(--tc-muted); margin-bottom: 1.2em; }
.tc-hero__card .tc-form { gap: 13px; }
.tc-hero__card-foot {
	display: flex; align-items: center; gap: 9px;
	margin-top: 18px; padding-top: 16px;
	border-top: 1px solid var(--tc-border);
	font-size: .89rem; color: var(--tc-muted);
}
.tc-hero__card-foot svg { color: var(--tc-accent-dark); flex: 0 0 auto; }
.tc-hero__card-foot a { font-weight: 800; color: var(--tc-navy); }

@media (max-width: 1080px) {
	.tc-hero__grid { grid-template-columns: minmax(0, 1fr); gap: 40px; }
	.tc-hero__card { max-width: 460px; }
	.tc-hero__inner { max-width: none; }
}
.tc-hero h1 { color: #fff; margin-bottom: .45em; }
.tc-hero h1 em { color: var(--tc-accent); font-style: normal; }
.tc-hero__lead { font-size: clamp(1rem, 1.6vw, 1.14rem); color: #cbd5e1; margin-bottom: 2em; max-width: 600px; }
.tc-hero__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 44px; }
.tc-hero__facts { display: flex; flex-wrap: wrap; gap: 14px 40px; padding-top: 30px; border-top: 1px solid rgba(255, 255, 255, .16); }
.tc-hero__fact strong { display: block; font-size: 1.9rem; font-weight: 900; color: var(--tc-accent); line-height: 1.1; }
.tc-hero__fact span { font-size: .86rem; color: #94a3b8; }

/* Page banner (interior pages) */
.tc-banner {
	position: relative;
	background: var(--tc-navy);
	color: #fff;
	padding: clamp(48px, 7vw, 78px) 0;
	overflow: hidden;
}
.tc-banner__bg { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .3; }
.tc-banner::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(100deg, rgba(13, 26, 43, .95), rgba(13, 26, 43, .68));
}
.tc-banner .tc-container { position: relative; z-index: 2; }
.tc-banner h1 { color: #fff; margin-bottom: .3em; }
.tc-banner p { color: #94a3b8; margin: 0; max-width: 640px; }
.tc-breadcrumb { font-size: .87rem; color: #94a3b8; margin-bottom: 1em; }
.tc-breadcrumb a { color: #cbd5e1; }
.tc-breadcrumb a:hover { color: var(--tc-accent); }
.tc-breadcrumb .sep { margin: 0 .5em; opacity: .6; }

/* =========================================================
   7. Cards — services / features / projects
   ========================================================= */
.tc-card {
	background: #fff;
	border: 1px solid var(--tc-border);
	border-radius: var(--tc-radius);
	padding: 30px 26px;
	transition: transform .28s var(--tc-ease), box-shadow .28s var(--tc-ease), border-color .28s var(--tc-ease);
	height: 100%;
	display: flex;
	flex-direction: column;
}
.tc-card:hover { transform: translateY(-6px); box-shadow: var(--tc-shadow-lg); border-color: transparent; }
.tc-card__icon {
	width: 54px; height: 54px;
	border-radius: 15px;
	background: var(--tc-accent-soft);
	color: var(--tc-accent-dark);
	display: grid; place-items: center;
	margin-bottom: 18px;
	transition: background .28s var(--tc-ease), color .28s var(--tc-ease);
}
.tc-card:hover .tc-card__icon { background: var(--tc-accent); color: #fff; }
.tc-card h3 { margin-bottom: .45em; font-size: 1.13rem; text-wrap: balance; }
.tc-card p {
	color: var(--tc-muted); font-size: .94rem; margin-bottom: 1.1em;
	/* Clamp instead of trimming in PHP, so cards line up and words stay whole. */
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
	overflow: hidden;
}
.tc-card__link { margin-top: auto; font-weight: 700; font-size: .9rem; display: inline-flex; align-items: center; gap: .4em; }
.tc-card__link::after { content: "→"; transition: transform .2s var(--tc-ease); }
.tc-card__link:hover::after { transform: translateX(4px); }

/* Price sits under the title as a footnote, not stacked above it. */
.tc-card--service .tc-card__price {
	order: 2;
	font-size: .84rem; color: var(--tc-accent-dark); font-weight: 800;
	margin: 0 0 14px;
	display: inline-flex; align-items: baseline; gap: .4em;
}
.tc-card--service .tc-card__price::before {
	content: "";
	width: 18px; height: 2px; background: var(--tc-accent);
	align-self: center; flex: 0 0 auto;
}
.tc-card--service { display: flex; flex-direction: column; }
.tc-card--service .tc-card__icon { order: 0; }
.tc-card--service h3 { order: 1; }
.tc-card--service p { order: 3; }
.tc-card--service .tc-card__link { order: 4; }

/* Project card */
.tc-project {
	position: relative;
	border-radius: var(--tc-radius);
	overflow: hidden;
	background: var(--tc-navy);
	display: block;
	aspect-ratio: 4 / 3;
}
.tc-project__img {
	position: absolute; inset: 0;
	background-size: cover; background-position: center;
	transition: transform .7s var(--tc-ease), opacity .3s;
	opacity: 1;
}
.tc-project:hover .tc-project__img { transform: scale(1.06); opacity: .82; }
.tc-project__body {
	position: absolute; inset: auto 0 0 0;
	padding: 30px 24px 22px;
	/* Deeper scrim so white text stays legible over bright photos, and tall
	   enough that a two-line title does not push the category chip out of it. */
	background: linear-gradient(to top,
		rgba(9, 18, 31, .97) 0%,
		rgba(9, 18, 31, .93) 45%,
		rgba(9, 18, 31, .72) 72%,
		rgba(9, 18, 31, .18) 92%,
		rgba(9, 18, 31, 0) 100%);
	padding-top: 46px;
	color: #fff;
	z-index: 2;
}
.tc-project__body h3 { text-shadow: 0 1px 12px rgba(0, 0, 0, .45); }
/* Solid pill: the plain orange text disappeared over bright photos. */
.tc-project__cat {
	display: inline-block;
	font-size: .68rem; font-weight: 800; letter-spacing: .12em;
	text-transform: uppercase; color: var(--tc-navy);
	background: var(--tc-accent);
	padding: 4px 10px; border-radius: 999px;
	margin-bottom: .7em;
}
.tc-project__body h3 { color: #fff; font-size: 1.14rem; margin: 0 0 .35em; }
.tc-project__meta { font-size: .84rem; color: #94a3b8; display: flex; flex-wrap: wrap; gap: 4px 16px; }

.tc-filter { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 36px; }
.tc-filter button {
	padding: 9px 20px; border-radius: 999px;
	border: 1px solid var(--tc-border); background: #fff;
	font: inherit; font-size: .9rem; font-weight: 600; color: var(--tc-navy);
	cursor: pointer; transition: all .2s var(--tc-ease);
}
.tc-filter button:hover { border-color: var(--tc-accent); color: var(--tc-accent-dark); }
.tc-filter button.is-active { background: var(--tc-navy); border-color: var(--tc-navy); color: #fff; }

/* =========================================================
   8. Feature list / about split
   ========================================================= */
.tc-split { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: clamp(32px, 5vw, 64px); align-items: center; }
.tc-split__media { position: relative; }
.tc-split__media img,
.tc-split__media .tc-ph { border-radius: var(--tc-radius); box-shadow: var(--tc-shadow-lg); width: 100%; }
.tc-split__badge {
	position: absolute; right: -14px; bottom: -18px;
	background: var(--tc-accent); color: #fff;
	padding: 18px 22px; border-radius: var(--tc-radius);
	box-shadow: var(--tc-shadow-lg); text-align: center; max-width: 190px;
}
.tc-split__badge strong { display: block; font-size: 2rem; font-weight: 900; line-height: 1; }
.tc-split__badge span { font-size: .8rem; opacity: .95; }

.tc-checklist { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 14px; }
.tc-checklist li { display: flex; gap: 12px; align-items: flex-start; font-size: .97rem; }
.tc-checklist li::before {
	content: "✓";
	flex: 0 0 auto;
	width: 24px; height: 24px; border-radius: 50%;
	background: var(--tc-accent-soft); color: var(--tc-accent-dark);
	display: grid; place-items: center; font-size: .78rem; font-weight: 900;
	margin-top: 2px;
}
.tc-section--dark .tc-checklist li::before { background: rgba(240, 160, 32, .18); color: var(--tc-accent); }

/* =========================================================
   9. Process / steps
   ========================================================= */
/* 3 x 2 on desktop — auto-fit produced a lopsided 4 + 2 at common widths. */
.tc-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px 30px; counter-reset: step; }
@media (max-width: 900px) { .tc-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .tc-steps { grid-template-columns: minmax(0, 1fr); gap: 26px; } }
.tc-step { position: relative; padding-top: 12px; }
.tc-step__num {
	width: 54px; height: 54px; border-radius: 16px;
	background: var(--tc-navy); color: var(--tc-accent);
	display: grid; place-items: center;
	font-size: 1.25rem; font-weight: 900;
	margin-bottom: 18px;
	position: relative; z-index: 2;
}
.tc-section--dark .tc-step__num { background: rgba(255, 255, 255, .08); }
.tc-step h3 { font-size: 1.08rem; margin-bottom: .45em; }
.tc-step p { color: var(--tc-muted); font-size: .93rem; margin: 0; }
.tc-section--dark .tc-step p { color: #94a3b8; }
.tc-step::after {
	content: "";
	position: absolute; top: 39px; left: 66px; right: -22px;
	border-top: 2px dashed var(--tc-border);
	z-index: 1;
}
/* No dangling connector at the end of a row or after the final step. */
.tc-step:nth-child(3n)::after,
.tc-step:last-child::after { display: none; }
.tc-section--dark .tc-step::after { border-color: rgba(255, 255, 255, .14); }
@media (max-width: 900px) {
	.tc-step:nth-child(3n)::after { display: block; }
	.tc-step:nth-child(2n)::after { display: none; }
}
@media (max-width: 560px) { .tc-step::after { display: none !important; } }

/* =========================================================
   10. Stats / counters
   ========================================================= */
.tc-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 30px; text-align: center; }
.tc-stat strong {
	display: block; font-size: clamp(2.1rem, 4vw, 2.9rem); font-weight: 900;
	color: var(--tc-accent); line-height: 1;
}
.tc-stat span { font-size: .92rem; color: #94a3b8; }
.tc-section--alt .tc-stat span, .tc-section:not(.tc-section--dark) .tc-stat span { color: var(--tc-muted); }

/* =========================================================
   11. Testimonials
   ========================================================= */
.tc-quote {
	background: #fff;
	border: 1px solid var(--tc-border);
	border-radius: var(--tc-radius);
	padding: 30px 28px;
	height: 100%;
	display: flex; flex-direction: column;
}
.tc-quote__stars { color: var(--tc-accent); letter-spacing: 2px; margin-bottom: 14px; font-size: .95rem; }
.tc-quote p { font-size: .98rem; color: var(--tc-text); margin-bottom: 22px; }
.tc-quote__who { display: flex; align-items: center; gap: 13px; margin-top: auto; }
.tc-quote__avatar {
	width: 46px; height: 46px; border-radius: 50%;
	background: var(--tc-navy); color: var(--tc-accent);
	display: grid; place-items: center; font-weight: 800; flex: 0 0 auto;
	overflow: hidden;
}
.tc-quote__avatar img { width: 100%; height: 100%; object-fit: cover; }
.tc-quote__who strong { display: block; color: var(--tc-navy); font-size: .95rem; line-height: 1.3; }
.tc-quote__who span { font-size: .83rem; color: var(--tc-muted); }

/* =========================================================
   12. CTA band
   ========================================================= */
.tc-cta {
	background: linear-gradient(120deg, var(--tc-accent), var(--tc-accent-dark));
	color: #fff;
	border-radius: var(--tc-radius);
	padding: clamp(34px, 5vw, 54px);
	display: flex; flex-wrap: wrap; gap: 26px;
	align-items: center; justify-content: space-between;
}
.tc-cta h2 { color: #fff; margin-bottom: .3em; }
.tc-cta p { margin: 0; opacity: .95; max-width: 560px; }
.tc-cta .tc-btn--dark { flex: 0 0 auto; }

/* =========================================================
   13. Forms
   ========================================================= */
.tc-form { display: grid; gap: 16px; }
.tc-form__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.tc-field label { display: block; font-size: .87rem; font-weight: 700; color: var(--tc-navy); margin-bottom: 6px; }
.tc-field .req { color: #dc2626; }

input[type="text"], input[type="email"], input[type="url"], input[type="tel"],
input[type="password"], input[type="search"], input[type="number"], input[type="date"],
select, textarea {
	width: 100%;
	padding: 12px 14px;
	font: inherit;
	font-size: .95rem;
	color: var(--tc-text);
	background: #fff;
	border: 1px solid var(--tc-border);
	border-radius: var(--tc-radius-sm);
	transition: border-color .2s, box-shadow .2s;
}
input:focus, select:focus, textarea:focus {
	outline: none;
	border-color: var(--tc-accent);
	box-shadow: 0 0 0 3px rgba(240, 160, 32, .18);
}
textarea { min-height: 130px; resize: vertical; }

input[type="submit"], button[type="submit"], .tc-form button {
	font: inherit;
}

.tc-notice { padding: 13px 17px; border-radius: var(--tc-radius-sm); font-size: .93rem; margin-bottom: 18px; }
.tc-notice--ok { background: #e8f7ef; color: #146c43; border: 1px solid #bcdfcc; }
.tc-notice--err { background: #fdecec; color: #a4232b; border: 1px solid #f3c4c4; }

/* =========================================================
   14. Contact info blocks
   ========================================================= */
.tc-info { display: grid; gap: 20px; }
.tc-info__item { display: flex; gap: 15px; align-items: flex-start; }
.tc-info__ico {
	width: 46px; height: 46px; border-radius: 13px; flex: 0 0 auto;
	background: var(--tc-accent-soft); color: var(--tc-accent-dark);
	display: grid; place-items: center;
}
.tc-info__item h4 { margin: 0 0 .15em; font-size: 1rem; }
.tc-info__item p { margin: 0; color: var(--tc-muted); font-size: .95rem; }

.tc-map { border-radius: var(--tc-radius); overflow: hidden; border: 1px solid var(--tc-border); line-height: 0; }
.tc-map iframe { width: 100%; height: 380px; border: 0; }

/* =========================================================
   15. Blog
   ========================================================= */
.tc-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 44px; }
.tc-layout--sidebar { grid-template-columns: minmax(0, 1fr) 330px; }
@media (max-width: 991px) { .tc-layout--sidebar { grid-template-columns: minmax(0, 1fr); } }

.tc-post-card {
	background: #fff;
	border: 1px solid var(--tc-border);
	border-radius: var(--tc-radius);
	overflow: hidden;
	display: flex; flex-direction: column; height: 100%;
	transition: transform .28s var(--tc-ease), box-shadow .28s var(--tc-ease);
}
.tc-post-card:hover { transform: translateY(-5px); box-shadow: var(--tc-shadow-lg); }
.tc-post-card__thumb { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--tc-bg-alt); }
.tc-post-card__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--tc-ease); }
.tc-post-card:hover .tc-post-card__thumb img { transform: scale(1.06); }
.tc-post-card__body { padding: 22px 22px 24px; display: flex; flex-direction: column; flex: 1; }
.tc-post-card__meta { font-size: .8rem; color: var(--tc-muted); margin-bottom: .6em; display: flex; flex-wrap: wrap; gap: 4px 14px; }
.tc-post-card h3 { font-size: 1.08rem; margin-bottom: .5em; text-wrap: balance; }
.tc-post-card h3 a { color: var(--tc-navy); }
.tc-post-card h3 a:hover { color: var(--tc-accent-dark); }
.tc-post-card p {
	font-size: .93rem; color: var(--tc-muted); margin-bottom: 1em;
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}

.tc-entry { background: #fff; }
.tc-entry__header { margin-bottom: 28px; }
.tc-entry__meta { font-size: .88rem; color: var(--tc-muted); display: flex; flex-wrap: wrap; gap: 6px 18px; margin-bottom: 1em; }
.tc-entry__thumb { border-radius: var(--tc-radius); overflow: hidden; margin-bottom: 30px; }
.tc-entry__content > * { max-width: 100%; }
.tc-entry__content img { border-radius: var(--tc-radius-sm); }
.tc-entry__content h2 { margin-top: 1.5em; }
.tc-entry__content h3 { margin-top: 1.3em; }
.tc-entry__footer { margin-top: 34px; padding-top: 24px; border-top: 1px solid var(--tc-border); }
.tc-tags a {
	display: inline-block; font-size: .82rem; padding: 5px 13px; margin: 0 6px 6px 0;
	background: var(--tc-bg-alt); border-radius: 999px; color: var(--tc-navy); font-weight: 600;
}
.tc-tags a:hover { background: var(--tc-accent); color: #fff; }

.tc-postnav { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; margin-top: 34px; }
.tc-postnav a {
	display: block; padding: 18px 20px; border: 1px solid var(--tc-border);
	border-radius: var(--tc-radius); color: var(--tc-navy);
}
.tc-postnav a:hover { border-color: var(--tc-accent); }
.tc-postnav small { display: block; color: var(--tc-muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .1em; margin-bottom: 4px; }
.tc-postnav strong { font-weight: 700; font-size: .98rem; }

/* Sidebar */
.tc-sidebar .widget {
	background: #fff;
	border: 1px solid var(--tc-border);
	border-radius: var(--tc-radius);
	padding: 24px 22px;
	margin-bottom: 26px;
}
.tc-sidebar .widget-title, .tc-sidebar .widgettitle {
	font-size: 1.05rem; margin-bottom: 1em; padding-bottom: .7em;
	border-bottom: 1px solid var(--tc-border); position: relative;
}
.tc-sidebar .widget-title::after {
	content: ""; position: absolute; left: 0; bottom: -1px; width: 46px; height: 2px; background: var(--tc-accent);
}
.tc-sidebar ul { list-style: none; margin: 0; padding: 0; }
.tc-sidebar li { padding: 8px 0; border-bottom: 1px dashed var(--tc-border); font-size: .94rem; }
.tc-sidebar li:last-child { border-bottom: 0; }
.tc-sidebar a { color: var(--tc-navy); }
.tc-sidebar a:hover { color: var(--tc-accent-dark); }
.tc-widget-cta { background: var(--tc-navy) !important; border-color: var(--tc-navy) !important; color: #cbd5e1; text-align: center; }
.tc-widget-cta h4 { color: #fff; }
.tc-widget-cta p { font-size: .9rem; color: #94a3b8; }

/* Pagination */
.tc-pagination { margin-top: 44px; }
.tc-pagination .nav-links { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.tc-pagination .page-numbers {
	display: grid; place-items: center;
	min-width: 42px; height: 42px; padding: 0 12px;
	border: 1px solid var(--tc-border); border-radius: var(--tc-radius-sm);
	color: var(--tc-navy); font-weight: 600; font-size: .93rem;
}
.tc-pagination .page-numbers:hover { border-color: var(--tc-accent); color: var(--tc-accent-dark); }
.tc-pagination .page-numbers.current { background: var(--tc-navy); border-color: var(--tc-navy); color: #fff; }

/* Comments */
.tc-comments { margin-top: 46px; padding-top: 34px; border-top: 1px solid var(--tc-border); }
.tc-comments .comment-list { list-style: none; padding: 0; margin: 0 0 34px; }
.tc-comments .comment-list ul.children { list-style: none; padding-left: clamp(16px, 4vw, 46px); }
.tc-comments article { padding: 20px 0; border-bottom: 1px dashed var(--tc-border); }
.tc-comments .comment-meta { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.tc-comments .comment-meta img { border-radius: 50%; }
.tc-comments .fn { font-style: normal; font-weight: 700; color: var(--tc-navy); }
.tc-comments .comment-metadata { font-size: .82rem; color: var(--tc-muted); }
.comment-respond { background: var(--tc-bg-alt); padding: 26px; border-radius: var(--tc-radius); }
.comment-form { display: grid; gap: 14px; }
.comment-form label { font-weight: 700; font-size: .87rem; color: var(--tc-navy); display: block; margin-bottom: 5px; }
.comment-form .form-submit { margin: 0; }
.comment-form input[type="submit"] {
	background: var(--tc-accent); color: #fff; border: 0; padding: 13px 28px;
	border-radius: 999px; font-weight: 700; cursor: pointer;
}
.comment-form input[type="submit"]:hover { background: var(--tc-accent-dark); }

/* Search form */
.tc-searchform { display: flex; gap: 8px; }
.tc-searchform input[type="search"] { flex: 1; }
.tc-searchform button {
	padding: 0 18px; border: 0; border-radius: var(--tc-radius-sm);
	background: var(--tc-navy); color: #fff; cursor: pointer; font-weight: 700;
}
.tc-searchform button:hover { background: var(--tc-accent); }

/* =========================================================
   16. Placeholder art (no image uploaded)
   ========================================================= */
.tc-ph {
	position: relative;
	background:
		linear-gradient(135deg, rgba(240, 160, 32, .16), rgba(13, 26, 43, .1)),
		repeating-linear-gradient(45deg, #e7ecf3 0 14px, #eef2f7 14px 28px);
	display: grid; place-items: center;
	color: #93a4b8; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; font-size: .74rem;
	aspect-ratio: 4 / 3;
}
.tc-ph--wide { aspect-ratio: 16 / 9; }
/* Fills its parent box instead of deriving width from the aspect ratio. */
.tc-ph--fill { width: 100%; height: 100%; aspect-ratio: auto; }

/* =========================================================
   17. Footer
   ========================================================= */
.tc-footer { background: var(--tc-navy); color: #94a3b8; padding-top: clamp(52px, 7vw, 78px); font-size: .94rem; }
.tc-footer h4 { color: #fff; font-size: 1.02rem; margin-bottom: 1.1em; }
.tc-footer a { color: #94a3b8; }
.tc-footer a:hover { color: var(--tc-accent); }
.tc-footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.3fr; gap: 40px; padding-bottom: 46px; }
@media (max-width: 900px) { .tc-footer__grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } }
.tc-footer .tc-brand__name { color: #fff; }
.tc-footer ul { list-style: none; margin: 0; padding: 0; }
.tc-footer ul li { padding: 6px 0; }
.tc-footer__bottom {
	border-top: 1px solid rgba(255, 255, 255, .1);
	padding: 20px 0;
	display: flex; flex-wrap: wrap; gap: 10px 24px;
	align-items: center; justify-content: space-between;
	font-size: .87rem;
}
.tc-socials { display: flex; gap: 10px; margin-top: 18px; }
.tc-socials a {
	width: 38px; height: 38px; border-radius: 50%;
	background: rgba(255, 255, 255, .07);
	display: grid; place-items: center; color: #cbd5e1;
	transition: background .2s, color .2s, transform .2s;
}
.tc-socials a:hover { background: var(--tc-accent); color: #fff; transform: translateY(-3px); }

/* Floating quick actions */
.tc-fab { position: fixed; right: 18px; bottom: 18px; z-index: 950; display: grid; gap: 10px; }
.tc-fab a {
	width: 50px; height: 50px; border-radius: 50%;
	display: grid; place-items: center;
	background: var(--tc-accent); color: #fff;
	box-shadow: 0 8px 22px rgba(13, 26, 43, .28);
	transition: transform .2s var(--tc-ease);
}
.tc-fab a:hover { transform: scale(1.08); color: #fff; }
.tc-fab a.is-top { background: var(--tc-navy); opacity: 0; visibility: hidden; }
.tc-fab a.is-top.show { opacity: 1; visibility: visible; }

/* =========================================================
   18. WordPress core classes
   ========================================================= */
.alignleft { float: left; margin: .4em 1.6em 1em 0; }
.alignright { float: right; margin: .4em 0 1em 1.6em; }
.aligncenter { display: block; margin-inline: auto; }
.alignwide { max-width: 1100px; margin-inline: auto; }
.alignfull { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); }
.wp-caption { max-width: 100%; }
.wp-caption-text, .wp-element-caption { font-size: .85rem; color: var(--tc-muted); text-align: center; margin-top: .5em; }
.sticky .tc-post-card { border-color: var(--tc-accent); }
.bypostauthor > article { background: var(--tc-bg-alt); }
.gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 1.5em; }
.gallery-item { margin: 0; }
.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px;
	margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* Reveal on scroll — only hidden when JS is available to reveal it again. */
.tc-js .tc-reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s var(--tc-ease), transform .6s var(--tc-ease); }
.tc-js .tc-reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.tc-js .tc-reveal { opacity: 1; transform: none; transition: none; }
	html { scroll-behavior: auto; }
}

/* =========================================================
   19. Responsive
   ========================================================= */
/* Drop the hotline block before the nav is forced to wrap. */
@media (max-width: 1330px) {
	.tc-header__phone { display: none; }
}
@media (max-width: 991px) {
	.tc-topbar__list li.is-hide-mobile { display: none; }
	.tc-burger { display: grid; }
	.tc-header__inner { min-height: 66px; }
	.tc-nav {
		position: absolute;
		top: 100%; left: 0; right: 0;
		background: #fff;
		border-top: 1px solid var(--tc-border);
		border-bottom: 1px solid var(--tc-border);
		box-shadow: var(--tc-shadow-lg);
		max-height: calc(100vh - 66px);
		overflow-y: auto;
		display: none;
		padding: 12px 20px 22px;
	}
	.tc-nav.is-open { display: block; }
	.tc-nav > ul { display: block; }
	.tc-nav a { padding: 12px 6px; border-bottom: 1px solid var(--tc-border); border-radius: 0; }
	.tc-nav .sub-menu {
		position: static; opacity: 1; visibility: visible; transform: none;
		box-shadow: none; border: 0; padding: 0 0 0 16px; min-width: 0;
		display: none;
	}
	.tc-nav li.is-open > .sub-menu { display: block; }
	.tc-nav .menu-item-has-children > a::after { float: right; margin-top: 8px; }
	.tc-header__actions .tc-btn { display: none; }
}
@media (max-width: 640px) {
	.tc-hero__cta .tc-btn { flex: 1 1 100%; justify-content: center; }
	.tc-cta { text-align: center; justify-content: center; }
	.tc-cta p { margin-inline: auto; }
	.tc-split__badge { position: static; margin-top: 16px; max-width: none; }
	.tc-brand__tagline { display: none; }
}

/* Print */
@media print {
	.tc-header, .tc-topbar, .tc-footer, .tc-fab, .tc-sidebar, .tc-cta { display: none !important; }
	body { color: #000; }
}