/**
 * Tree Plast brand theme layer
 * Applies Brand Guideline identity on top of existing layouts.
 * Load AFTER component CSS. Does not change structure/animations.
 */

/* Re-assert tokens last so component :root blocks cannot override brand. */
:root {
	--token-298644eb-3fe0-49aa-b8cb-c3344e3ab8d7: #151515;
	--token-4ee3acd3-c018-4be0-998c-2fa74728fc08: #f7f6f2;
	--token-a57d3b9c-0f65-42ac-b59d-88929fbad5a0: #c9b89a;
	--token-cb2982f0-838d-4452-9b5d-5a4f2ff7e5a2: #ffffff;

	--tk-hdr-ink: #151515;
	--tk-hdr-ink-soft: #151515;
	--tk-hdr-mute: #6b6b65;
	--tk-hdr-mute-soft: #b0a07e;
	--tk-hdr-fog: #f7f6f2;
	--tk-hdr-mist: #c9b89a;
	--tk-hdr-white: #ffffff;
	--tk-hdr-invert-dark: #151515;
	--tk-hdr-invert-light: #f7f6f2;
	--tk-hdr-font: "Almarai", sans-serif;

	--tk-hero-ink: #081219;
	--tk-hero-fog: #f7f6f2;
	--tk-hero-mist: #003b26;
	--tk-hero-display: "Almarai", sans-serif;
	--tk-hero-ui: "Almarai", sans-serif;

	--tk-ft-navy: #151515;
	--tk-ft-fog: #ffffff;
	--tk-ft-mist: rgba(255, 255, 255, 0.82);
	--tk-ft-ink: #ffffff;
	--tk-ft-link: #ffffff;
	--tk-ft-font: "Almarai", sans-serif;
	--tk-ft-font-btn: "Almarai", sans-serif;

	--font-primary: "Almarai", sans-serif;
	--font-brand: "Almarai", sans-serif;
	--font-display: "Almarai", sans-serif;
	--font-heading: "Almarai", sans-serif;
	--font-body: "Almarai", sans-serif;
	--font-ui: "Almarai", sans-serif;
	--font-arabic: "Almarai", sans-serif;
	--font-family: "Almarai", sans-serif;
	--font-sans: "Almarai", sans-serif;
	--default-font-family: "Almarai", sans-serif;
	--framer-font-family: "Almarai", sans-serif;
	--framer-font-family-preview: "Almarai", sans-serif;
	--framer-input-font-family: "Almarai", sans-serif;
}

/* ── Base document — TREEPLAST Almarai ── */
html,
body {
	font-family: "Almarai", sans-serif;
}

html {
	color: var(--color-text-primary);
	background-color: var(--color-background);
}

body {
	font-weight: var(--fw-light, 300);
	color: var(--color-text-primary);
	background-color: var(--color-background);
	-webkit-font-smoothing: antialiased;
}

body,
button,
input,
textarea,
select,
label,
a,
p,
li,
span,
h1, h2, h3, h4, h5, h6 {
	font-family: inherit;
}

/* Framer presets keep size/spacing; family is always Almarai. */
.framer-text,
[class*="framer-styles-preset"] {
	font-family: "Almarai", sans-serif !important;
}

h1,
h2,
h3 {
	font-family: "Almarai", sans-serif;
	font-weight: var(--fw-extrabold, 800);
	color: inherit;
}

h4,
h5,
h6 {
	font-family: "Almarai", sans-serif;
	font-weight: var(--fw-bold, 700);
	color: inherit;
}

.tk-about__title,
.tk-aboutpage__title,
.tk-services__heading,
.tk-services__card-title,
.tk-faq__title,
.tk-intro__title,
.tk-hero__title {
	font-family: "Almarai", sans-serif;
	font-weight: var(--fw-extrabold, 800);
}

.font-heading,
.tk-hdr__overlay-brand-text,
.tk-hdr__menu-link,
.tk-hdr__submenu-link,
.tk-ft__brand-text,
.tk-ft__col-title,
.tk-aboutpage__title,
.framer-text[class*="preset"] {
	font-family: var(--font-heading);
	color: inherit;
}

.tk-hdr__overlay-brand-text,
.tk-ft__brand-text,
.tk-aboutpage__title {
	font-weight: var(--fw-heading);
}

p,
.font-body,
.tk-hero__desc,
.har-rich {
	font-family: var(--font-body);
	font-weight: var(--fw-light, 300);
}

button,
input,
select,
textarea,
.font-ui,
.tk-hdr,
.tk-hdr__cta,
.tk-hdr__icon-btn,
.tk-hdr__brand-text,
.tk-hdr__social a,
.tk-hero__cta,
.tk-ft__cta,
label,
.tk-faq__badge,
nav a {
	font-family: var(--font-ui);
}

/* ── Links ── */
a {
	color: var(--color-primary);
	transition: color var(--transition-fast);
}

a:hover {
	color: var(--color-primary-hover);
}

a:focus-visible {
	outline: 2px solid var(--color-border-focus);
	outline-offset: 2px;
}

/* ── Solid brand buttons (section CTAs / forms) — NOT the glass master ── */
button[type="submit"]:not(.tk-ft__cta):not(.tk-ch__submit),
.har-btn-primary,
.tk-contact-home__submit {
	background-color: var(--color-primary) !important;
	color: var(--color-text-on-primary) !important;
	border-radius: var(--radius-sm);
	border: 0;
	box-shadow: none;
	transition:
		background-color var(--transition-base),
		color var(--transition-base),
		transform var(--transition-fast),
		box-shadow var(--transition-base);
}

button[type="submit"]:not(.tk-ft__cta):not(.tk-ch__submit):hover,
.har-btn-primary:hover,
.tk-contact-home__submit:hover {
	background-color: var(--color-primary-hover) !important;
	color: var(--color-text-on-primary) !important;
}

button[type="submit"]:not(.tk-ch__submit):active {
	background-color: var(--brand-army-green-dark) !important;
	transform: translateY(0) scale(0.98);
}

button[type="submit"]:not(.tk-ch__submit):focus-visible {
	outline: 2px solid var(--color-border-focus);
	outline-offset: 2px;
}

/*
 * FAQ "Get in touch" CTA — solid TREEPLAST
 * Same system as Get a Consultation / Learn More.
 */
.tk-faq__cta {
	background: #003b26 !important;
	background-color: #003b26 !important;
	border: 1px solid #003b26 !important;
	border-radius: 4px !important;
	color: #ffffff !important;
	box-shadow: none !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
}

.tk-faq__cta .tk-faq__cta-label,
.tk-faq__cta .tk-faq__cta-icon {
	color: #ffffff !important;
}

.tk-faq__cta:hover {
	background: #0a4a34 !important;
	background-color: #0a4a34 !important;
	border-color: #0a4a34 !important;
	color: #ffffff !important;
	box-shadow: 0 14px 36px rgba(0, 0, 0, 0.26) !important;
	transform: translateY(-2px);
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
}

.tk-faq__cta:hover .tk-faq__cta-label,
.tk-faq__cta:hover .tk-faq__cta-icon {
	color: #ffffff !important;
}

.tk-faq__cta:active {
	background: #003b26 !important;
	background-color: #003b26 !important;
	border-color: #003b26 !important;
	color: #ffffff !important;
	box-shadow: none !important;
	transform: translateY(0) scale(0.98);
}

.tk-faq__cta:focus-visible {
	outline: 2px solid #003b26;
	outline-offset: 2px;
}

/*
 * Projects "Sales and Marketing" CTA — solid TREEPLAST
 * Same palette as solid Get a Consultation (no glass).
 */
.tk-projects__cta {
	background: #003b26 !important;
	background-color: #003b26 !important;
	border: 1px solid #003b26 !important;
	border-radius: 4px !important;
	color: #ffffff !important;
	box-shadow: none !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
}

.tk-projects__cta .tk-projects__cta-label,
.tk-projects__cta .tk-projects__cta-icon {
	color: #ffffff !important;
}

.tk-projects__cta:hover {
	background: #0a4a34 !important;
	background-color: #0a4a34 !important;
	border-color: #0a4a34 !important;
	color: #ffffff !important;
	transform: translateY(-1px);
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
}

.tk-projects__cta:hover .tk-projects__cta-label,
.tk-projects__cta:hover .tk-projects__cta-icon {
	color: #ffffff !important;
}

.tk-projects__cta:active {
	background: #003b26 !important;
	background-color: #003b26 !important;
	border-color: #003b26 !important;
	color: #ffffff !important;
	transform: translateY(0) scale(0.98);
}

.tk-projects__cta:focus-visible {
	outline: 2px solid #003b26;
	outline-offset: 2px;
}

/*
 * Header buttons — TREEPLAST Brand Guideline V.01 (solid, no glass).
 * Dark Green #104433 · Green #3B6E52 · Lime #ACD36F · White #FFFFFF
 * Size, radius, type, and hover motion stay in header.css.
 */
.tk-hdr a.tk-hdr__cta,
.tk-hdr a.tk-hdr__cta--primary,
.tk-hdr a.tk-hdr__cta--secondary,
.tk-hdr a.tk-hdr__overlay-cta,
.tk-hdr .tk-hdr__icon-btn,
.tk-hdr .tk-hdr__icon-btn--on-light {
	background: #104433 !important;
	background-color: #104433 !important;
	color: #ffffff !important;
	border: 1px solid #104433 !important;
	border-radius: var(--tk-hdr-btn-radius, 4px) !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08) !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
	transition:
		transform var(--tk-hdr-duration, 0.4s) var(--tk-hdr-ease, cubic-bezier(0.12, 0.23, 0.5, 1)),
		background-color 0.3s ease,
		box-shadow 0.3s ease,
		color 0.3s ease,
		border-color 0.3s ease;
}

.tk-hdr a.tk-hdr__cta--secondary {
	background: #ffffff !important;
	background-color: #ffffff !important;
	color: #104433 !important;
	border: 1px solid #3b6e52 !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08) !important;
}

.tk-hdr a.tk-hdr__cta .tk-hdr__cta-label,
.tk-hdr a.tk-hdr__cta .tk-hdr__cta-icon,
.tk-hdr a.tk-hdr__cta .tk-hdr__cta-icon svg {
	color: inherit !important;
	fill: currentColor;
}

.tk-hdr a.tk-hdr__cta:hover,
.tk-hdr a.tk-hdr__cta--primary:hover,
.tk-hdr a.tk-hdr__overlay-cta:hover,
.tk-hdr a.tk-hdr__cta--secondary:hover,
.tk-hdr .tk-hdr__icon-btn:hover,
.tk-hdr .tk-hdr__icon-btn--on-light:hover {
	background: #3b6e52 !important;
	background-color: #3b6e52 !important;
	color: #ffffff !important;
	border-color: #3b6e52 !important;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12) !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
}

.tk-hdr a.tk-hdr__cta:hover .tk-hdr__cta-label,
.tk-hdr a.tk-hdr__cta:hover .tk-hdr__cta-icon,
.tk-hdr a.tk-hdr__cta:hover .tk-hdr__cta-icon svg {
	color: #ffffff !important;
}

.tk-hdr a.tk-hdr__cta:active,
.tk-hdr a.tk-hdr__cta--primary:active,
.tk-hdr a.tk-hdr__overlay-cta:active,
.tk-hdr a.tk-hdr__cta--secondary:active,
.tk-hdr .tk-hdr__icon-btn:active,
.tk-hdr .tk-hdr__icon-btn--on-light:active {
	background: #3b6e52 !important;
	background-color: #3b6e52 !important;
	color: #ffffff !important;
	border-color: #3b6e52 !important;
}

.tk-hdr a.tk-hdr__cta:active .tk-hdr__cta-label,
.tk-hdr a.tk-hdr__cta:active .tk-hdr__cta-icon,
.tk-hdr a.tk-hdr__cta:active .tk-hdr__cta-icon svg {
	color: #ffffff !important;
}

.tk-hdr a.tk-hdr__cta:focus-visible,
.tk-hdr .tk-hdr__icon-btn:focus-visible {
	outline: 2px solid #3b6e52;
	outline-offset: 2px;
}

/*
 * Overlay dropdown items (Home, About, Properties, Contact Us, Blog, …)
 * Restore original clean text — no glass material.
 * Layout / type / hover underline / enter motion remain in header.css.
 */
.tk-hdr__menu-link,
.tk-hdr__menu-link:hover,
.tk-hdr__menu-link:focus-visible,
.tk-hdr__menu-link:active,
.tk-hdr__menu-item.current-menu-item > .tk-hdr__menu-link,
.tk-hdr__menu-item.current-menu-ancestor > .tk-hdr__menu-link,
.tk-hdr__submenu-link,
.tk-hdr__submenu-link:hover,
.tk-hdr__submenu-link:focus-visible,
.tk-hdr__submenu-link:active,
.tk-hdr__submenu .current-menu-item > .tk-hdr__submenu-link {
	background: transparent !important;
	background-color: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
	transform: none !important;
}

.tk-hdr__menu-link {
	color: var(--tk-hdr-ink) !important;
}

.tk-hdr__submenu-link {
	color: var(--tk-hdr-mute) !important;
}

.tk-hdr__menu-link:hover,
.tk-hdr__menu-link:focus-visible,
.tk-hdr__menu-item.current-menu-item > .tk-hdr__menu-link,
.tk-hdr__menu-item.current-menu-ancestor > .tk-hdr__menu-link,
.tk-hdr__submenu-link:hover,
.tk-hdr__submenu-link:focus-visible,
.tk-hdr__submenu .current-menu-item > .tk-hdr__submenu-link {
	color: var(--glass-accent, var(--tk-hdr-mist)) !important;
	background: transparent !important;
	box-shadow: none !important;
	--tk-hdr-border-c: var(--glass-border, var(--tk-hdr-mist));
}

/* Overlay backdrop — same glass material */
.tk-hdr__overlay-bg {
	background: var(--glass-bg) !important;
	-webkit-backdrop-filter: blur(var(--glass-blur)) !important;
	backdrop-filter: blur(var(--glass-blur)) !important;
	border: 0;
}

.tk-hdr__overlay-brand-text,
.tk-hdr__brand-text {
	display: none !important;
}

.tk-hdr__social a {
	color: var(--glass-fg) !important;
}

.tk-hdr__social a:hover {
	color: var(--glass-accent) !important;
}

/* ── Header / invert brand text + glass token remap ── */
.tk-hdr__brand-text,
.tk-hdr [data-tk-hdr-brand] {
	color: var(--tk-hdr-invert, var(--color-ink));
	font-family: var(--font-heading);
}

/* Over any section — solid white header uses dark-on-light chrome */
.tk-hdr.is-invert-light,
.tk-hdr.is-invert-dark {
	--tk-hdr-invert: var(--brand-onyx);
	--glass-bg: var(--glass-bg-on-light);
	--glass-bg-hover: var(--glass-bg-hover-on-light);
	--glass-bg-active: var(--glass-bg-active-on-light);
	--glass-fg: var(--glass-fg-on-light);
	--glass-fg-muted: var(--glass-fg-muted-on-light);
	--glass-border: var(--glass-border-on-light);
	--glass-accent: var(--glass-accent-on-light);
	--glass-accent-hover: var(--glass-accent-hover-on-light);
}

/*
 * Open + closing menu keep the cream overlay surface.
 * Must stay on .is-overlay-on (not only .is-open) or the bg snaps away
 * before the exit spring can play.
 */
.tk-hdr.is-open .tk-hdr__overlay-bg,
.tk-hdr.is-overlay-on .tk-hdr__overlay-bg {
	background: rgba(var(--brand-cream-rgb), 0.88) !important;
	-webkit-backdrop-filter: blur(var(--glass-blur)) !important;
	backdrop-filter: blur(var(--glass-blur)) !important;
}

.tk-hdr__menu-link,
.tk-hdr__submenu-link,
.tk-hdr__overlay-brand-text {
	font-family: var(--font-heading) !important;
}

.tk-hdr__social a {
	font-family: var(--font-ui) !important;
}

/* ── Hero (TREEPLAST — layout/type live in hero.css) ── */
.tk-hero {
	color: var(--color-text-on-dark);
}

.tk-hero__title {
	font-family: var(--font-heading) !important;
	font-weight: var(--fw-extrabold, 800) !important;
	color: #ffffff !important;
}

.tk-hero__desc {
	font-family: var(--font-body) !important;
	font-weight: var(--fw-regular, 400) !important;
	color: rgba(255, 255, 255, 0.85) !important;
}

.tk-intro,
.tk-intro__title,
.tk-intro__description,
.tk-intro__cta-label {
	font-family: "Almarai", sans-serif;
}

.tk-intro__title {
	font-weight: var(--fw-extrabold, 800);
}

.tk-intro__description {
	font-weight: var(--fw-regular, 400);
}

.tk-hero__cta--primary {
	/* Exact TREEPLAST logo green #003B26 */
	background: #003b26 !important;
	background-color: #003b26 !important;
	border: 1px solid #003b26 !important;
	color: #ffffff !important;
	border-radius: 4px !important;
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22) !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
}

.tk-hero__cta--primary:hover {
	background: #0a4a34 !important;
	background-color: #0a4a34 !important;
	border-color: #0a4a34 !important;
	color: #ffffff !important;
	box-shadow: 0 14px 36px rgba(0, 0, 0, 0.26) !important;
	transform: translateY(-2px);
}

/* About section "Learn More" — layout + chrome live in about.css
 * (.tk-about a.tk-about__cta.tk-btn.tk-btn--primary). Keep brand colors
 * aligned here so a late brand-theme load cannot revert to glass/mist. */
.tk-about a.tk-about__cta.tk-btn.tk-btn--primary {
	background-color: #003b26;
	border-color: #003b26;
	color: #ffffff;
	box-shadow: none;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}

.tk-about a.tk-about__cta.tk-btn.tk-btn--primary:hover {
	background-color: #0a4a34;
	border-color: #0a4a34;
	color: #ffffff;
	box-shadow: 0 14px 36px rgba(0, 0, 0, 0.26);
	transform: translateY(-2px);
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}

.tk-about a.tk-about__cta.tk-btn.tk-btn--primary:active {
	background-color: #003b26;
	border-color: #003b26;
	color: #ffffff;
	box-shadow: none;
	transform: translateY(0) scale(0.98);
}

/* Home Intro (tk-about) — TREEPLAST type accents; layout in about.css */
.tk-about__title,
.tk-about__card-number {
	font-family: var(--font-heading) !important;
}

.tk-about__badge,
.tk-about__desc,
.tk-about__card-label,
.tk-about__cta-label {
	font-family: var(--font-ui) !important;
}

.tk-about__badge,
.tk-about__card-number,
.tk-about__card-index {
	color: #003b26 !important;
}

.tk-hero__cta--ghost {
	background: transparent !important;
	background-color: transparent !important;
	color: #ffffff !important;
	border: 1px solid rgba(255, 255, 255, 0.55) !important;
	border-radius: var(--radius-sm, 4px) !important;
	box-shadow: none !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
}

.tk-hero__cta--ghost:hover {
	background: rgba(255, 255, 255, 0.08) !important;
	background-color: rgba(255, 255, 255, 0.08) !important;
	border-color: rgba(255, 255, 255, 0.85) !important;
	color: #ffffff !important;
	transform: translateY(-2px);
}

/* ── Footer — white text + white glass buttons (layout unchanged) ── */
.tk-ft {
	--tk-ft-navy: var(--brand-onyx);
	--tk-ft-fog: #ffffff;
	--tk-ft-mist: rgba(255, 255, 255, 0.82);
	--tk-ft-ink: #ffffff;
	--tk-ft-link: #ffffff;
	--tk-ft-font: "Almarai", sans-serif;
	--tk-ft-font-btn: "Almarai", sans-serif;
	background: #002a1e !important;
	color: #ffffff;
}

.tk-ft,
.tk-ft p,
.tk-ft h1,
.tk-ft h2,
.tk-ft h3,
.tk-ft h4,
.tk-ft__brand-text,
.tk-ft__desc,
.tk-ft__meta-line,
.tk-ft__col-title,
.tk-ft__nav-p,
.tk-ft__newsletter-title,
.tk-ft__newsletter-desc,
.tk-ft__copy,
.tk-ft__bottom-nav .tk-ft__nav-p {
	color: #ffffff;
}

.tk-ft__desc,
.tk-ft__meta-line,
.tk-ft__newsletter-desc,
.tk-ft__copy,
.tk-ft__bottom-nav .tk-ft__nav-p,
.tk-ft__bottom-nav .tk-ft__nav-a {
	color: rgba(255, 255, 255, 0.82);
}

.tk-ft a,
.tk-ft__nav-a,
.tk-ft__meta-line a {
	color: #ffffff !important;
}

.tk-ft a:hover,
.tk-ft__nav-a:hover,
.tk-ft__nav-a:focus-visible,
.tk-ft__meta-line a:hover,
.tk-ft__bottom-nav .tk-ft__nav-a:hover {
	color: #ffffff !important;
}

.tk-ft__cta,
.tk-ft__cta:hover,
.tk-ft__cta:active,
.tk-ft__cta:focus-visible {
	background: rgba(255, 255, 255, 0.12) !important;
	background-color: rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
	border: 1px solid rgba(255, 255, 255, 0.85) !important;
	box-shadow: none !important;
	-webkit-backdrop-filter: blur(12px) saturate(120%) !important;
	backdrop-filter: blur(12px) saturate(120%) !important;
}

.tk-ft__cta:hover {
	background: rgba(255, 255, 255, 0.22) !important;
	background-color: rgba(255, 255, 255, 0.22) !important;
	border-color: #ffffff !important;
	color: #ffffff !important;
}

.tk-ft__cta:active {
	background: rgba(255, 255, 255, 0.28) !important;
	background-color: rgba(255, 255, 255, 0.28) !important;
	border-color: #ffffff !important;
	color: #ffffff !important;
}

.tk-ft__cta-label,
.tk-ft__cta:hover .tk-ft__cta-label,
.tk-ft__cta-arrow,
.tk-ft__cta:hover .tk-ft__cta-arrow {
	color: #ffffff !important;
}

/* ── Forms ── */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="search"],
input[type="number"],
input[type="password"],
textarea,
select,
.tk-contact-home input,
.tk-contact-home textarea,
.har-form input,
.har-form textarea,
.har-form select {
	font-family: var(--font-ui);
	color: var(--color-text-primary);
	background-color: var(--color-surface);
	border-color: var(--color-border);
	border-radius: var(--radius-sm);
	transition:
		border-color var(--transition-fast),
		box-shadow var(--transition-fast);
}

input:focus,
textarea:focus,
select:focus,
.tk-contact-home input:focus,
.tk-contact-home textarea:focus {
	border-color: var(--color-border-focus) !important;
	outline: none;
	box-shadow: 0 0 0 3px var(--color-primary-muted);
}

input::placeholder,
textarea::placeholder {
	color: var(--color-text-muted);
}

/* ── FAQ / cards / sections ── */
.tk-faq__badge,
.tk-faq__title,
.tk-faq__desc,
.tk-faq__item {
	font-family: inherit;
}

.tk-faq__title {
	font-family: var(--font-heading) !important;
	color: var(--color-ink) !important;
}

.tk-faq__badge {
	font-family: var(--font-ui) !important;
	color: var(--color-primary) !important;
}

/* Soft sand/army accents for mist lines / dividers used in Marby sections */
.tk-faq [style*="rgb(213, 213, 219)"],
.tk-aboutpage [style*="rgb(213, 213, 219)"] {
	/* inline leftovers handled via Framer token remap */
}

/* ── Page shells (about / properties / blog / contact) ── */
.tk-aboutpage,
.tk-properties,
.tk-blogpage,
.tk-contactpage,
.har-page {
	font-family: var(--font-body);
	color: var(--color-text-primary);
	background-color: var(--color-background);
}

.tk-aboutpage h1,
.tk-aboutpage h2,
.tk-aboutpage h3,
.tk-properties h1,
.tk-properties h2,
.tk-properties h3,
.tk-blogpage h1,
.tk-blogpage h2,
.tk-blogpage h3,
.tk-contactpage h1,
.tk-contactpage h2,
.tk-contactpage h3 {
	font-family: var(--font-heading);
	font-weight: var(--fw-extrabold, 800);
	color: var(--color-ink);
}

.tk-aboutpage .tk-aboutpage__hero .tk-aboutpage__badge,
.tk-aboutpage .tk-aboutpage__hero .tk-aboutpage__hero-title,
.tk-aboutpage h1.tk-aboutpage__hero-title {
	color: #ffffff;
	-webkit-text-fill-color: #ffffff;
	font-weight: 400;
}

/* ── Loading / disabled ── */
[aria-busy="true"],
.is-loading,
.har-loading {
	opacity: 0.65;
	pointer-events: none;
	cursor: wait;
}

:disabled,
[disabled],
.is-disabled {
	opacity: 0.5;
	pointer-events: none;
	cursor: not-allowed;
}

/* ── Focus ring default ── */
:focus-visible {
	outline: 2px solid var(--color-border-focus);
	outline-offset: 2px;
}

/* ── Selection ── */
::selection {
	background: rgba(var(--brand-army-green-rgb), 0.28);
	color: var(--brand-onyx);
}

@media (prefers-reduced-motion: reduce) {
	.tk-hdr__cta--primary,
	.tk-hero__cta--primary,
	.tk-hero__cta--ghost,
	.tk-faq__cta,
	.tk-projects__cta,
	.tk-hdr__icon-btn,
	button[type="submit"] {
		transition: none !important;
	}
}