/**
 * WordPress-only fixes that must not alter the reference when the interaction JS runs correctly.
 */

/* Hide runtime badge injected by legacy export scripts. */
.w-webflow-badge,
.w-webflow-badge > img {
	display: none !important;
	visibility: hidden !important;
}

/* Portfolio: category filter and two-up grid (odd counts lead with a feature). */
.site-root .techable-work-lightbox {
    width: calc(100% - 32px);
    max-width: 1100px;
    max-height: 90vh;
    padding: 0;
    border: 0;
    border-radius: 14px;
    background: transparent;
    overflow: visible;
}
.site-root .techable-work-lightbox:not([open]) { display: none; }
.site-root .techable-work-lightbox::backdrop { background: rgba(0, 0, 0, 0.85); }
.site-root .techable-work-lightbox .techable-portfolio-modal__close {
    background: #0e1620;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35);
    width: 44px;
    height: 44px;
}

.site-root .work-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: var(--_gap---gap-xl, 40px);
}

.site-root .work-filter__link {
	padding: 10px 16px;
	border-radius: 999px;
	color: var(--dark-gray, #6f7781);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.site-root .work-filter__link:hover,
.site-root .work-filter__link:focus-visible {
	background: var(--light-field, #f1f1f1);
	color: var(--dark-color, #080808);
	outline: none;
}

.site-root .work-filter__link.is-active {
	background: var(--dark-color, #080808);
	color: #fff;
}

.site-root .work-filter__status {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.site-root .work-v1-wrap.portfolio-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 48px 32px;
}

.site-root .work-v1-wrap.portfolio-grid .work-cl-item {
	min-width: 0;
}

.site-root .work-v1-wrap.portfolio-grid .work-cl-item[hidden] {
	display: none;
}

.site-root .work-v1-wrap.portfolio-grid .work-cl-item.is-feature {
	grid-column: 1 / -1;
}

.site-root .work-v1-wrap.portfolio-grid .work-card-img-wrap {
	aspect-ratio: 4 / 3;
}

.site-root .work-v1-wrap.portfolio-grid .is-feature .work-card-img-wrap {
	aspect-ratio: 21 / 10;
}

.site-root .work-v1-wrap.portfolio-grid .work-card-img {
	width: 100%;
	height: 100%;
	max-height: none;
	object-fit: cover;
	object-position: center;
}

.site-root .work-empty-state {
	margin: 0;
	padding: 64px 0;
	color: var(--dark-gray, #6f7781);
	font-size: var(--_typography---paragraph-l, 18px);
	text-align: center;
}

.site-root .work-empty-state[hidden] {
	display: none;
}

@media screen and (max-width: 767px) {
	.site-root .work-v1-wrap.portfolio-grid {
		grid-template-columns: 1fr;
		gap: 36px;
	}

	.site-root .work-v1-wrap.portfolio-grid .is-feature .work-card-img-wrap {
		aspect-ratio: 4 / 3;
	}
}

/* Core / block editor global img rules can collapse Webflow grid images. */
/* Header logo: flex wordmark (home) + SVG fallback (inner exports). */
.site-root .nav-wrapper {
	align-items: center;
}

.site-root .site-header > .container {
	display: flex;
	justify-content: center;
}

/* Absolute headers must clear the WordPress toolbar for signed-in visitors. */
body.admin-bar .site-root .site-header {
	top: 32px;
}

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

.site-root .site-header .nav-wrapper {
	width: min(1080px, 100%);
	max-width: 1080px;
	box-sizing: border-box;
}

/*
 * Keep the floating header readable on light pages (404, contact, etc.).
 * Webflow’s frosted glass is near-invisible on white, so brand text (white)
 * and hover states vanish — solid dark pill fixes that sitewide.
 */
.site-root .nav-wrapper.dark {
	background-color: rgba(10, 14, 16, 0.92) !important;
	border: 1px solid rgba(255, 255, 255, 0.08);
	backdrop-filter: saturate(140%) blur(16px);
	-webkit-backdrop-filter: saturate(140%) blur(16px);
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.35);
}

.site-root .navbar-left-wrap {
	align-items: center;
}

.site-root .brand-logo.w-nav-brand {
	float: none;
	display: inline-flex;
	align-items: center;
	align-self: center;
	line-height: 1;
	padding: 0;
	margin: 0;
	text-decoration: none;
}

/* ── Header logo image ──────────────────────────────────────── */
.site-root .techable-header-brand {
	column-gap: 10px;
}

.site-root .techable-header-brand__logo {
	display: block;
	height: 36px;
	width: auto;
	max-width: 160px;
	object-fit: contain;
	object-position: left center;
}

@media screen and (max-width: 767px) {
	.site-root .techable-header-brand__logo {
		height: 30px;
	}
}

/* ── Footer logo image ──────────────────────────────────────── */
.site-root .footer-logo-wordmark--img {
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
}

.site-root .techable-site-logo {
	height: 48px;
	width: auto;
	max-width: 220px;
	object-fit: contain;
	object-position: left bottom;
	opacity: 0.85;
}

@media screen and (max-width: 767px) {
	.site-root .techable-site-logo {
		height: 36px;
	}
}

/* ── About page: single CEO card centered ───────────────────── */
.site-root .section.leader .leader-grid-wrap {
	display: flex;
	justify-content: center;
}

.site-root .section.leader .leader-grid-wrap .leader-single-wrap {
	max-width: 560px;
	width: 100%;
}

.site-root .techable-header-brand__mark {
	flex: none;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	background-color: #006dff;
}

.site-root .techable-header-brand__name {
	font-family: Inter, Arial, sans-serif;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1;
	white-space: nowrap;
}

.site-root .techable-header-brand--dark .techable-header-brand__name {
	color: #fff;
}

.site-root .techable-header-brand--light .techable-header-brand__name {
	color: #111111;
}

.site-root .brand-image {
	width: auto;
	height: 22px;
	min-width: 0;
	min-height: 22px;
	max-height: 22px;
	object-fit: contain;
	object-position: left center;
	vertical-align: middle;
}

@media screen and (min-width: 1280px) {
	.site-root .brand-image {
		min-height: 22px;
	}
}

@media screen and (max-width: 767px) {
	.site-root .techable-header-brand__name {
		font-size: 14px;
	}

	.site-root .techable-header-brand__mark {
		width: 11px;
		height: 11px;
	}
}

/* Hero intro: theme GSAP reveal (no data-w-id). */
.section.hero .techable-reveal--hero {
	opacity: 0;
	transform: translate3d(0, 50px, 0);
}

.section.hero .techable-reveal--hero.is-revealed,
.section.hero .techable-hero-intro-locked.techable-reveal--hero {
	opacity: 1 !important;
	transform: none !important;
	visibility: visible !important;
}

.site-root img.about-img,
.site-root .hero-item-img,
.site-root .work-animated-img,
.site-root .growth-card-img,
.site-root .posts-preview-image {
	max-width: none;
	height: auto;
}

.about-intro-right-title,
.about-v1-right-title {
	visibility: visible;
	max-width: 100%;
	white-space: normal;
}

.about-v1-right-title .gsap_split_letter,
.about-v1-right-title .char {
	display: inline-block;
	will-change: color;
}

.about-flex-wrap {
	flex-wrap: nowrap;
}

@media screen and (max-width: 991px) {
	.about-flex-wrap {
		flex-wrap: wrap;
	}
}

/* Footer watermark: full-width “Techable Australia” (desktop one line, mobile two). */
.footer-logo-wrap:has(.footer-logo-wordmark) {
	width: 100%;
	max-width: 100%;
	padding-left: 0;
	padding-right: 0;
}

.footer-logo-wordmark {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0 clamp(12px, 2vw, 24px);
	box-sizing: border-box;
	font-family: Inter, Arial, sans-serif;
	font-weight: 700;
	line-height: 0.95;
	text-align: center;
	letter-spacing: -0.04em;
	color: rgba(255, 255, 255, 0.06);
	-webkit-text-fill-color: rgba(255, 255, 255, 0.06);
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
}

.footer-logo-wordmark__desktop {
	display: block;
	width: 100%;
	white-space: nowrap;
	font-size: clamp(2.25rem, 7.35vw, 13rem);
}

.footer-logo-wordmark__mobile {
	display: none;
	flex-direction: column;
	align-items: center;
	gap: 0.05em;
	font-size: clamp(2.5rem, 14vw, 5.5rem);
}

.footer-logo-wordmark__mobile span {
	display: block;
	line-height: 0.95;
}

@media screen and (max-width: 767px) {
	.footer-logo-wordmark__desktop {
		display: none;
	}

	.footer-logo-wordmark__mobile {
		display: flex;
	}
}

/* Cart: match Webflow chrome (badge, drawer, no spurious commerce error strip). */
.site-root .w-commerce-commercecartopenlink.cart-button {
	background-color: transparent;
	border: 0;
	padding: 0;
	color: inherit;
	display: inline-block;
}

.site-root .cart-button .w-commerce-commercecartopenlinkcount.cart-quantity {
	margin-left: 0;
	padding-left: 0;
	padding-right: 0;
	text-align: center;
	line-height: 18px;
}

.w-commerce-commercecartcontainer .w-commerce-commercecartcheckoutbutton.checkout-submit-button {
	background-color: var(--primary-color);
	color: #fff;
	border-radius: 0;
	transition: background-color 0.4s, color 0.4s;
}

.w-commerce-commercecartcontainer .w-commerce-commercecartcheckoutbutton.checkout-submit-button:hover {
	background-color: #fff;
	color: var(--primary-color);
}

.w-commerce-commercecartcontainer .w-commerce-commercecarterrorstate.error-message {
	display: none !important;
}

/* Block editor content on Webflow pages (Pages → edit in WP admin). */
.site-root .techable-wp-content {
	padding-top: 48px;
	padding-bottom: 48px;
}

.site-root .techable-wp-content .w-richtext {
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
}

.site-root .techable-wp-content img {
	max-width: 100%;
	height: auto;
}

/*
 * Mega-menu + footer links: disable the dual-line slide interaction inside
 * overflow-hidden panels (IX3 targets all .nav-link site-wide).
 */
.site-root .nav-link--dropdown-panel,
.site-root .nav-link--footer-panel {
	height: auto;
	overflow: visible;
}

.site-root .nav-link--dropdown-panel [link-bottom],
.site-root .nav-link--footer-panel [link-bottom] {
	display: none;
}

.site-root .nav-link--dropdown-panel [link-top],
.site-root .nav-link--footer-panel [link-top] {
	transform: none !important;
}

.site-root .nav-link--dropdown-panel:hover,
.site-root .nav-link--dropdown-panel:focus-visible {
	color: var(--primary-color);
}

.site-root .nav-link--dropdown-panel.w--current {
	color: var(--white);
}

.site-root .nav-link--dropdown-panel.w--current:hover,
.site-root .nav-link--dropdown-panel.w--current:focus-visible {
	color: var(--primary-color);
}

/*
 * Header nav hover — CSS whole-line slide.
 * IX3 splits labels into letters and animates yPercent per glyph, which
 * slides both layers out of the 22px clip so the label vanishes on hover.
 */
.site-root .nav-menu-wrap > .nav-link {
	position: relative;
	overflow: hidden;
	height: 22px;
}

.site-root .nav-menu-wrap > .nav-link [link-top],
.site-root .nav-menu-wrap > .nav-link [link-bottom] {
	display: block;
	line-height: 22px;
	transform: translate3d(0, 0, 0) !important;
	transition: transform 0.24s ease;
	will-change: transform;
}

.site-root .nav-menu-wrap > .nav-link:hover [link-top],
.site-root .nav-menu-wrap > .nav-link:hover [link-bottom],
.site-root .nav-menu-wrap > .nav-link:focus-visible [link-top],
.site-root .nav-menu-wrap > .nav-link:focus-visible [link-bottom] {
	transform: translate3d(0, -100%, 0) !important;
}

/* Neutralize IX3/GSAP letter transforms so they can't empty the clip. */
.site-root .nav-menu-wrap > .nav-link .gsap_split_word,
.site-root .nav-menu-wrap > .nav-link .gsap_split_letter,
.site-root .nav-menu-wrap > .nav-link [class*='gsap_split'] {
	transform: none !important;
	translate: none !important;
}

.site-root .techable-header-cart .woocommerce-mini-cart {
	list-style: none;
	padding: 0;
	margin: 0;
}

.site-root .techable-form-plugin .wpcf7-form,
.site-root .techable-form-plugin form {
	margin: 0;
}

.site-root .blog-single .blog-v1-author {
	width: 50px !important;
	height: 50px !important;
	max-width: 50px !important;
	border-radius: 50%;
	object-fit: cover;
}

.site-root .blog-rich-text p {
	color: #6f7781;
	margin-bottom: 14px;
}

.site-root .blog-rich-text h1,
.site-root .blog-rich-text h2,
.site-root .blog-rich-text h3,
.site-root .blog-rich-text h4,
.site-root .blog-rich-text h5,
.site-root .blog-rich-text h6 {
	color: #080808;
	font-size: 21px;
	line-height: 1.4;
	font-weight: 600;
	letter-spacing: normal;
	word-spacing: normal;
	margin-top: 20px;
	margin-bottom: 14px;
}

.site-root .blog-rich-text strong {
	color: #080808;
	font-weight: 500;
}

/* Blog articles use the reference's light, editorial first viewport. */
.site-root .blog-single-title {
	max-width: 900px;
	font-size: 64px;
	line-height: 1.05;
}

.site-root .nav-wrapper.light {
	background-color: #fff !important;
	border: 0;
	box-shadow: none;
}

.site-root .nav-wrapper.light .nav-menu-wrap > .nav-link,
.site-root .nav-wrapper.light .nav-menu-wrap > .nav-link .nav-link-text,
.site-root .nav-wrapper.light .dropdown-toggle,
.site-root .nav-wrapper.light .dropdown-toggle .dropdown-arrow-wrap,
.site-root .nav-wrapper.light .menu-button,
.site-root .nav-wrapper.light .nav-btn-wrap {
	color: #080808;
}

.site-root .nav-wrapper.light .dropdown-toggle .dropdown-arrow {
	filter: brightness(0);
}

/* Preserve article structure and allow long text to fit beside sharing controls. */
.site-root .blog-single-wrap {
	gap: 40px;
}

.site-root .blog-single-right-wrap {
	min-width: 0;
}

.site-root .blog-single-link,
.site-root .blog-single-left-wrap {
	flex-shrink: 0;
}

.site-root .blog-single-title-wrap,
.site-root .blog-author-wrapper {
	gap: 24px;
}

.site-root .blog-single-title,
.site-root .blog-rich-text {
	overflow-wrap: anywhere;
}

.site-root .blog-rich-text h2 { font-size: 32px; }
.site-root .blog-rich-text h3 { font-size: 26px; }
.site-root .blog-rich-text h4 { font-size: 23px; }

.site-root .blog-rich-text ul,
.site-root .blog-rich-text ol {
	display: block;
	padding-left: 1.5em;
	margin: 0 0 20px;
}

.site-root .blog-rich-text ul { list-style-type: disc; }
.site-root .blog-rich-text ol { list-style-type: decimal; }
.site-root .blog-rich-text li { margin-bottom: 10px; }
.site-root .blog-rich-text a { text-decoration: underline; }
.site-root .blog-rich-text pre { overflow-x: auto; }

@media screen and (max-width: 767px) {
	.site-root .blog-author-wrapper { flex-wrap: wrap; }
	.site-root .blog-single-title-wrap { align-items: flex-start; }
	.site-root .blog-rich-text h2 { font-size: 26px; }
	.site-root .blog-rich-text h3 { font-size: 23px; }
}

.site-root .nav-wrapper.light .hamburger svg,
.site-root .nav-wrapper.light .hamburger path,
.site-root .nav-wrapper.light .hamburger line {
	stroke: #080808;
}

@media screen and (max-width: 767px) {
	.site-root .blog-single-title {
		max-width: none;
		font-size: 32px;
		line-height: 1.1;
	}

	.site-root .blog-single-banner-wrap {
		height: 400px;
	}
}

.site-root .cta-wrapper--linked {
	display: block;
	text-decoration: none;
	color: inherit;
	width: 100%;
}

/*
 * Mega menu — sidebar categories + service grid (WebReinvent-style, Techable palette).
 */
.site-root .techable-megamenu-dropdown {
	position: relative;
	/* Taller hit area so moving off the label toward the panel stays "inside". */
	padding-bottom: 18px;
	margin-bottom: -18px;
}

.site-root .techable-megamenu-dropdown .w-dropdown-toggle {
	position: relative;
	z-index: 2;
}

.site-root .techable-megamenu-panel.dd-navigation,
.site-root .dd-navigation.techable-megamenu-panel {
	width: min(1080px, 90vw);
	max-width: 90vw;
	max-height: 90vh;
	/* Bridge the Webflow top:60px dead zone — keep hover continuous from toggle → panel. */
	top: 100% !important;
	left: 0;
	right: auto;
	padding-top: 20px;
	transform: translateX(-18%);
	overflow: visible;
	z-index: 1100;
	box-sizing: border-box;
}

/* Narrow hover bridge — only above the panel, does not cover sibling nav links. */
.site-root .techable-megamenu-panel.dd-navigation::before {
	content: '';
	position: absolute;
	left: 18%;
	width: 120px;
	top: -24px;
	height: 24px;
}

/* Webflow sets inline height:0 on closed lists — force open height. */
.site-root .techable-megamenu-dropdown.w--open > .techable-megamenu-panel.dd-navigation,
.site-root .techable-megamenu-panel.dd-navigation.w--open {
	height: auto !important;
	overflow: visible !important;
}

.site-root .techable-megamenu.dd-menu-wrap {
	display: grid;
	grid-template-columns: minmax(200px, 240px) minmax(0, 1fr);
	align-items: stretch;
	border: 1px solid rgba(0, 109, 255, 0.35);
	background: linear-gradient(160deg, #0c1218 0%, #0a0f14 55%, #0b1520 100%);
	border-radius: 18px;
	margin-top: 0;
	padding: 0;
	box-shadow: 0 28px 72px rgba(0, 0, 0, 0.5);
	max-height: calc(90vh - 24px);
	overflow: hidden;
	position: relative;
	z-index: 1;
}

/* Services mega menu: quiet editorial navigation that belongs to the site shell. */
.site-root .techable-megamenu-panel.dd-navigation,
.site-root .dd-navigation.techable-megamenu-panel {
	position: fixed !important;
	width: min(980px, calc(100vw - 40px));
	max-width: calc(100vw - 40px);
	top: 83px !important;
	right: auto;
	left: 50% !important;
	transform: translateX(-50%);
	padding-top: 14px;
}

.site-root .techable-megamenu.dd-menu-wrap {
	grid-template-columns: 210px minmax(0, 1fr);
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 10px;
	background: #0b1117;
	box-shadow: 0 22px 60px rgba(0, 0, 0, 0.38);
	max-height: min(620px, calc(100vh - 100px));
	animation: techable-megamenu-enter 0.24s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* Applies to the inner grid, which is NOT the translateX(-50%)-centred panel —
   keeping the centring transform here left it permanently shifted off-screen. */
@keyframes techable-megamenu-enter {
	from {
		opacity: 0;
		transform: translateY(-8px) scale(0.985);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@media screen and (max-width: 991px) {
	.site-root .techable-megamenu-panel.dd-navigation,
	.site-root .dd-navigation.techable-megamenu-panel {
		position: fixed !important;
		width: 90vw;
		max-width: 90vw;
		top: 83px !important;
		left: 50% !important;
		right: auto;
		transform: translateX(-50%);
	}

	.site-root .techable-megamenu.dd-menu-wrap {
		grid-template-columns: 1fr;
		max-height: calc(90vh - 20px);
	}
}

/*
 * Brand palette: primary accent #006DFF (replaces legacy green #006dff).
 */
.site-root {
	--primary-color: #006dff;
}

/* Hero map pills (Mexico, Australia). */
.site-root .hero-map-text {
	color: #fff;
}

/* Primary CTA — Webflow “green” variant. */
.site-root .primary-button:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492) {
	color: #fff;
}

.site-root .primary-btn-wrap:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492) {
	background-color: #006dff;
	border-color: #006dff;
	color: #fff;
}

.site-root .primary-button:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492):hover,
.site-root .primary-button:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492):focus-visible {
	color: #006dff;
}

.site-root .primary-btn-wrap:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492):hover,
.site-root .primary-btn-wrap:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492):focus-within {
	background-color: #fff;
	border-color: #006dff;
	color: #006dff;
}

.site-root .secondary-btn-wrap:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492) {
	background-color: #006dff;
	border-color: #006dff;
	color: #fff;
}

/*
 * Arrows on blue accent states → white.
 * Default icon SVG is near-black (#080808); invert on blue, restore on white hover.
 */
.site-root .primary-btn-wrap:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492) .primary-icon,
.site-root .secondary-btn-wrap:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492) .primary-icon,
.site-root .pricing-button.current .pricing-btn-icon {
	filter: brightness(0) invert(1);
}

.site-root .primary-btn-wrap:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492):hover .primary-icon,
.site-root .primary-btn-wrap:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492):focus-within .primary-icon,
.site-root .primary-button:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492):hover .primary-icon,
.site-root .primary-button:where(.w-variant-0a3f9beb-5f52-53a0-e1a7-59f8ae06e492):focus-visible .primary-icon {
	filter: none;
}

.site-root .pricing-button:hover,
.site-root .pricing-button:focus-visible {
	background-color: #006dff;
	color: #fff;
}

.site-root .pricing-button:hover .pricing-btn-icon,
.site-root .pricing-button:focus-visible .pricing-btn-icon,
.site-root .pricing-button.current:hover .pricing-btn-icon {
	filter: brightness(0) invert(1);
}

/* Growth: white text on blue, blue text on the white hover/focus state. */
.site-root .pricing-button.current,
.site-root .pricing-button.current .pricing-btn-text {
	color: #fff;
}
.site-root .pricing-button.current:hover,
.site-root .pricing-button.current:focus-visible {
	background-color: #fff;
	color: #006dff;
}
.site-root .pricing-button.current:hover .pricing-btn-text,
.site-root .pricing-button.current:focus-visible .pricing-btn-text {
	color: #006dff;
}
.site-root .pricing-button.current:hover .pricing-btn-icon,
.site-root .pricing-button.current:focus-visible .pricing-btn-icon {
	filter: brightness(0) saturate(100%) invert(32%) sepia(100%) saturate(4850%) hue-rotate(208deg) brightness(100%) contrast(107%);
}

/* Submit buttons that paint the arrow via background-image. */
.site-root .request-submit-button,
.site-root .checkout-submit-button,
.site-root .password-submit-button,
.site-root .carrer-submit-btn,
.site-root .pricing-add-to-cart {
	background-image: url("../cdn/693639cd18e0727241ca34be_arrow-right.svg");
}

.site-root .request-submit-button:hover,
.site-root .checkout-submit-button:hover,
.site-root .password-submit-button:hover,
.site-root .carrer-submit-btn:hover,
.site-root .pricing-add-to-cart:hover {
	background-image: url("../cdn/6934effbe4f3f00cfba4e6ba_Icon.svg");
}

.site-root .footer-submit-button,
.site-root .request-submit-button,
.site-root .checkout-submit-button,
.site-root .password-submit-button,
.site-root .carrer-submit-btn,
.site-root .pricing-add-to-cart {
	color: #fff;
}

.site-root .footer-submit-button:hover,
.site-root .request-submit-button:hover,
.site-root .checkout-submit-button:hover,
.site-root .password-submit-button:hover,
.site-root .carrer-submit-btn:hover {
	background-color: #fff;
	color: #006dff;
}

.site-root .contact-submit-button:hover {
	background-color: #fff;
	color: #006dff;
	border: 1px solid #006dff;
}

.site-root .service-item-title {
	text-decoration: none;
}

.site-root .service-item-wrap {
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	overflow: visible;
	transition: overflow 0.25s ease;
}

.site-root .service-item-wrap:hover,
.site-root .service-item-wrap:focus-within {
	overflow: visible;
}

.site-root .service-item-bg {
	height: 0 !important;
	opacity: 0 !important;
	transition: height 0.38s ease, opacity 0.22s ease;
}

.site-root .service-item-btm-wrap,
.site-root .service-item-all-btm-wrap {
	height: 0;
	max-height: 0;
	opacity: 0 !important;
	overflow: hidden;
	transform: translateY(18px);
	transition: height 0.32s ease, max-height 0.32s ease, opacity 0.25s ease, transform 0.25s ease, margin-top 0.25s ease;
	margin-top: 0;
	pointer-events: none;
}

.site-root .service-item-wrap:hover .service-item-bg,
.site-root .service-item-wrap:focus-within .service-item-bg {
	height: 100% !important;
	opacity: 1 !important;
}

.site-root .service-item-wrap:hover .service-item-bg,
.site-root .service-item-wrap:focus-within .service-item-bg,
.site-root .service-item-wrap:hover .service-item-btm-wrap,
.site-root .service-item-wrap:focus-within .service-item-btm-wrap,
.site-root .service-item-wrap:hover .service-item-all-btm-wrap,
.site-root .service-item-wrap:focus-within .service-item-all-btm-wrap {
	opacity: 1 !important;
	transform: translateY(0);
}

.site-root .service-item-wrap:hover .service-item-btm-wrap,
.site-root .service-item-wrap:focus-within .service-item-btm-wrap,
.site-root .service-item-wrap:hover .service-item-all-btm-wrap,
.site-root .service-item-wrap:focus-within .service-item-all-btm-wrap {
	height: auto;
	max-height: none;
	opacity: 1 !important;
	margin-top: 16px;
	pointer-events: auto;
}

.site-root .service-item-title:hover,
.site-root .service-item-title:focus-visible {
	color: #006dff;
}

.site-root .section.techable-service-single {
	padding-top: 64px;
	padding-bottom: 80px;
	background-color: #fff;
}

.site-root .techable-service-single__body {
	color: var(--dark-gray, #4b5563);
	font-size: var(--_typography---paragraph-l, 18px);
	line-height: 1.7;
}

.site-root .techable-service-single__body > *:first-child {
	margin-top: 0;
}

.site-root .techable-service-single__body p {
	margin: 0 0 1.15em;
}

.site-root .techable-service-single__body a {
	color: #006dff;
}

/* Fallback for legacy work/career singles still on .work-details */
.site-root .section.work-details {
	padding-top: var(--_gap---gap-9xll, 140px);
	padding-bottom: 80px;
	background-color: #fff;
}

.site-root .techable-cpt-single {
	max-width: 820px;
	margin: 0 auto;
}

.site-root .techable-cpt-single .inner-title {
	margin-bottom: 16px;
}

.site-root .techable-cpt-single__body {
	margin-top: 28px;
	color: var(--dark-gray, #4b5563);
	font-size: var(--_typography---paragraph-l, 18px);
	line-height: 1.7;
}

.site-root .techable-cpt-single__body p {
	margin: 0 0 14px;
}

.site-root .section.footer .footer-left-wrap,
.site-root .section.footer .footer-single-wrap,
.site-root .section.footer .copyright-wrap,
.site-root .section.footer .footer-line-wrap {
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
}

/* ── Footer: uniform dark background ── */
.site-root .section.footer {
	background-color: #080808 !important;
}

/* Widen the inner container to match footer-top-wrap's intended 1290 px design width */
.site-root .section.footer > .layout-container {
	max-width: 1290px !important;
	padding-left: 24px;
	padding-right: 24px;
	box-sizing: border-box;
	background: none;
}

/*
 * Footer top: nav links only (newsletter removed).
 */
.site-root .section.footer .footer-top-wrap.techable-footer-top {
	display: block !important;
	max-width: none;
	background: none;
}

.site-root .section.footer .footer-right-wrap.techable-footer-sitemap {
	width: 100% !important;
	max-width: none !important;
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	column-gap: 32px;
	row-gap: 44px;
	align-items: start !important;
	background: none;
}

.site-root .section.footer .footer-single-wrap {
	min-width: 0;
	gap: 14px;
}

.site-root .section.footer .footer-all-link-wrap {
	gap: 10px;
}

.site-root .section.footer .footer-social-wrap {
	flex-flow: row wrap !important;
	gap: 16px;
}

@media screen and (max-width: 991px) {
	.site-root .section.footer > .layout-container {
		padding-left: 20px;
		padding-right: 20px;
	}
	.site-root .section.footer .footer-right-wrap.techable-footer-sitemap {
		grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	}
}

@media screen and (max-width: 767px) {
	.site-root .section.footer .footer-right-wrap.techable-footer-sitemap {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		column-gap: 20px;
		row-gap: 28px;
	}
}

@media screen and (max-width: 479px) {
	.site-root .section.footer .footer-right-wrap.techable-footer-sitemap {
		grid-template-columns: 1fr !important;
	}
}

.site-root .footer-plain-link {
	display: block;
	color: rgba(255, 255, 255, 0.62);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.45;
	text-decoration: none;
	transition: color 0.2s ease;
	overflow-wrap: anywhere;
}

.site-root .footer-plain-link:hover,
.site-root .footer-plain-link:focus-visible {
	color: #006dff;
}

.site-root .footer-plain-link.is-current {
	color: #fff;
}

.site-root .section.footer .footer-social-wrap {
	flex-flow: row wrap !important;
	gap: 16px;
	grid-column-gap: 16px;
	grid-row-gap: 16px;
}

.site-root .section.footer .copyright-wrap,
.site-root .section.footer .footer-line-wrap {
	opacity: 1 !important;
	visibility: visible !important;
}

/* Header nav hover rules live above (CSS whole-line slide; IX3 letter motion disabled). */

/* Single service — structured sections on white body (hero above stays dark). */
.site-root .section.techable-service-single {
	padding-top: 64px;
	padding-bottom: 80px;
	background-color: #fff;
}

.site-root .techable-cat-overview-link {
	color: #7eb6ff;
	text-decoration: none;
	font-weight: 600;
}

.site-root .techable-cat-overview-link:hover,
.site-root .techable-cat-overview-link:focus-visible {
	color: #fff;
	outline: none;
}

.site-root .techable-idea-static {
	margin-top: 28px;
}

.site-root .techable-services-catalogue + .techable-services-catalogue {
	padding-top: 12px;
}

/* Hide export process Lottie dead-space if old body still renders somewhere. */
.site-root .section.process .sticky-wrapper,
.site-root .section.process .process-json-wrap {
	max-height: 280px;
	overflow: hidden;
}

/* ==========================================================================
   Service pages — /services/, /services/{category}/, /services/{category}/{service}/
   Built on the theme's own language: .section rhythm, .section-sub-title pills
   and the global h2/h3 scale. Type sizes for headings are inherited on purpose;
   this block only handles layout and the components the theme lacks.
   ========================================================================== */

.site-root {
	--techable-rhythm: 140px;
	--techable-line: rgba(8, 8, 8, 0.1);
}

/* White sections stack on top padding only, as on the finalized pages. */
.site-root .techable-statement,
.site-root .techable-included,
.site-root .techable-outcomes,
.site-root .techable-work-carousel,
.site-root .techable-why,
.site-root .techable-faq,
.site-root .techable-siblings,
.site-root .techable-service-catalog {
	padding-bottom: 0;
}

/* --- Section head: pill, h2, supporting line --------------------------------- */

.site-root .techable-head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--_border-radius---border-radius-s, 12px);
	margin: 0 auto var(--_gap---gap-3xll, 60px);
	text-align: center;
}

.site-root .techable-head h2 {
	margin: 0;
	max-width: 780px;
}

.site-root .techable-head p {
	margin: 0;
	max-width: 580px;
	color: var(--dark-gray, #6f7781);
	font-size: var(--_typography---paragraph-l, 18px);
	line-height: var(--_line-height---line-height-l, 140%);
}

.site-root .techable-head--start {
	align-items: flex-start;
	margin-left: 0;
	margin-right: 0;
	text-align: left;
}

.site-root .techable-ghost-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding-bottom: 3px;
	border-bottom: 1px solid rgba(8, 8, 8, 0.25);
	color: var(--dark-color, #080808);
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	transition: color 0.2s ease, border-color 0.2s ease, gap 0.2s ease;
}

.site-root .techable-ghost-link:hover,
.site-root .techable-ghost-link:focus-visible {
	color: var(--primary-color, #006dff);
	border-color: currentColor;
	gap: 12px;
}

/* --- Hero: the pill doubles as the breadcrumb -------------------------------- */

.site-root .techable-crumbs a,
.site-root .techable-crumbs span {
	text-decoration: none;
}

.site-root .techable-crumbs a.inner-sub-title:hover,
.site-root .techable-crumbs a.inner-sub-title:focus-visible {
	color: #fff;
}

/* --- Jump nav (/services/) -------------------------------------------------- */

.site-root .techable-service-jump {
	position: sticky;
	top: 0;
	z-index: 40;
	background: rgba(255, 255, 255, 0.94);
	backdrop-filter: saturate(180%) blur(12px);
	border-bottom: 1px solid var(--techable-line);
}

.site-root .techable-service-jump__list {
	display: flex;
	justify-content: center;
	gap: 4px;
	margin: 0;
	padding: 12px 0;
	list-style: none;
	overflow-x: auto;
	scrollbar-width: none;
}

.site-root .techable-service-jump__list::-webkit-scrollbar {
	display: none;
}

.site-root .techable-service-jump__list a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border-radius: 999px;
	color: var(--dark-gray, #6f7781);
	font-size: 15px;
	font-weight: 500;
	white-space: nowrap;
	text-decoration: none;
	transition: color 0.2s ease, background-color 0.2s ease;
}

.site-root .techable-service-jump__list a:hover,
.site-root .techable-service-jump__list a:focus-visible {
	background: var(--light-field, #f1f1f1);
	color: var(--dark-color, #080808);
}

.site-root .techable-service-jump__count {
	color: var(--light-gray, #929292);
	font-size: 13px;
	font-variant-numeric: tabular-nums;
}

/* --- Catalogue groups (/services/) ------------------------------------------ */

.site-root .techable-catalog-group {
	padding-top: 72px;
	scroll-margin-top: 80px;
}

.site-root .techable-catalog-group:first-of-type {
	padding-top: 0;
}

.site-root .techable-catalog-head {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: end;
	gap: 20px 40px;
	margin-bottom: 32px;
}

.site-root .techable-catalog-head__title {
	margin: 0 0 12px;
}

.site-root .techable-catalog-head__title a {
	font: inherit;
	letter-spacing: inherit;
	color: var(--dark-color, #080808);
	text-decoration: none;
	transition: color 0.2s ease;
}

.site-root .techable-catalog-head__title a:hover,
.site-root .techable-catalog-head__title a:focus-visible {
	color: var(--primary-color, #006dff);
}

.site-root .techable-catalog-head__count {
	margin-left: 12px;
	color: var(--light-gray, #929292);
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0;
	vertical-align: middle;
}

.site-root .techable-catalog-head__text {
	max-width: 620px;
	margin: 0;
	color: var(--dark-gray, #6f7781);
	font-size: var(--_typography---paragraph-l, 18px);
	line-height: var(--_line-height---line-height-l, 140%);
}

.site-root .techable-catalog-head__action {
	padding-bottom: 6px;
	white-space: nowrap;
}

/* --- Service rows: the theme's service-item, revealed on hover/focus -------- */

.site-root .techable-svc-rows {
	margin: 0;
	padding: 0;
	list-style: none;
	border-bottom: 1px solid var(--techable-line);
}

.site-root .techable-svc-row {
	position: relative;
	border-top: 1px solid var(--techable-line);
	overflow: hidden;
}

.site-root .techable-svc-row__bg {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 0;
	background: var(--light-field, #f1f1f1);
	transition: height 0.45s cubic-bezier(0.22, 1, 0.36, 1);
	pointer-events: none;
}

.site-root .techable-svc-row:hover .techable-svc-row__bg,
.site-root .techable-svc-row:focus-within .techable-svc-row__bg {
	height: 100%;
}

.site-root .techable-svc-row__inner {
	position: relative;
	z-index: 1;
	padding: 30px 15px;
}

.site-root .techable-svc-row__top {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr) auto;
	align-items: center;
	gap: 20px;
}

.site-root .techable-svc-row__index {
	color: var(--dark-color, #080808);
	font-size: var(--_typography---paragraph-l, 18px);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	transition: color 0.3s ease;
}

.site-root .techable-svc-row:hover .techable-svc-row__index,
.site-root .techable-svc-row:focus-within .techable-svc-row__index {
	color: var(--primary-color, #006dff);
}

.site-root .techable-svc-row__title {
	margin: 0;
	font-size: var(--_typography---h4, 34px);
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: var(--_letter-speacing---letter-speacing-s, -0.68px);
}

.site-root .techable-svc-row__title a {
	/* A global anchor rule resets links to 18px — inherit the heading instead. */
	font: inherit;
	letter-spacing: inherit;
	color: var(--dark-color, #080808);
	text-decoration: none;
}

/* Whole row is the click target; only the title is a real link. */
.site-root .techable-svc-row__title a::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 2;
}

.site-root .techable-svc-row__title a:focus-visible {
	outline: none;
}

.site-root .techable-svc-row:focus-within .techable-svc-row__title a::after {
	outline: 2px solid var(--primary-color, #006dff);
	outline-offset: -4px;
	border-radius: 12px;
}

.site-root .techable-svc-row__action {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 12px 14px;
	border-radius: var(--_border-radius---border-radius-s, 10px);
	background: var(--light-field, #f1f1f1);
	color: var(--dark-color, #080808);
	font-size: 15px;
	font-weight: 600;
	white-space: nowrap;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.site-root .techable-svc-row__action svg {
	width: 16px;
	height: 16px;
	transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-root .techable-svc-row:hover .techable-svc-row__action,
.site-root .techable-svc-row:focus-within .techable-svc-row__action {
	background: var(--dark-color, #080808);
	color: #fff;
}

.site-root .techable-svc-row:hover .techable-svc-row__action svg,
.site-root .techable-svc-row:focus-within .techable-svc-row__action svg {
	transform: translateX(4px);
}

/* 0fr -> 1fr animates to the content's natural height. */
.site-root .techable-svc-row__reveal {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-root .techable-svc-row:hover .techable-svc-row__reveal,
.site-root .techable-svc-row:focus-within .techable-svc-row__reveal {
	grid-template-rows: 1fr;
}

/* Vertical spacing must live on the children: padding on this clipped grid
   item would still occupy space while collapsed. */
.site-root .techable-svc-row__reveal-inner {
	display: flex;
	align-items: flex-end;
	gap: var(--_gap---gap-2xll, 50px);
	min-height: 0;
	padding-left: 84px;
	overflow: hidden;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity 0.35s ease 0.06s, transform 0.4s cubic-bezier(0.22, 1, 0.36, 1) 0.06s;
}

.site-root .techable-svc-row:hover .techable-svc-row__reveal-inner,
.site-root .techable-svc-row:focus-within .techable-svc-row__reveal-inner {
	opacity: 1;
	transform: translateY(0);
}

.site-root .techable-svc-row__media {
	flex: 0 0 330px;
	width: 330px;
	aspect-ratio: 16 / 11;
	margin: 24px 0 4px;
	border-radius: var(--_border-radius---border-radius-xl, 20px);
	background: #e6e8eb;
	object-fit: cover;
}

.site-root .techable-svc-row__body {
	flex: 1;
	min-width: 0;
	max-width: 645px;
	margin: 24px 0 4px;
}

.site-root .techable-svc-row__text {
	margin: 0;
	color: var(--dark-gray, #6f7781);
	font-size: var(--_typography---paragraph-l, 18px);
	line-height: var(--_line-height---line-height-l, 140%);
}

.site-root .techable-svc-row__points {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 28px;
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
}

.site-root .techable-svc-row__points li {
	padding: 10px 0;
	border-top: 1px solid rgba(8, 8, 8, 0.12);
	color: var(--dark-gray, #6f7781);
	font-size: 15px;
	line-height: 1.45;
}

/* --- Statement: large lead with offset supporting copy ---------------------- */

.site-root .techable-statement .section-sub-title {
	margin-bottom: 32px;
}

.site-root .techable-statement__lead {
	max-width: 1120px;
	margin: 0;
	color: var(--dark-color, #080808);
	font-size: clamp(26px, 2.8vw, 40px);
	font-weight: 500;
	line-height: 1.22;
	letter-spacing: -0.02em;
}

.site-root .techable-statement__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) minmax(0, 1fr);
	gap: 48px;
	margin-top: var(--_gap---gap-3xll, 60px);
}

.site-root .techable-statement__support {
	grid-column: 2;
}

.site-root .techable-statement__support:last-child {
	grid-column: 2 / -1;
	max-width: 680px;
}

.site-root .techable-statement__support p {
	margin: 0 0 16px;
	color: var(--dark-gray, #6f7781);
	font-size: var(--_typography---paragraph-l, 18px);
	line-height: 1.6;
}

.site-root .techable-statement__support p:last-child {
	margin-bottom: 0;
}

.site-root .techable-statement__aside {
	grid-column: 3;
	padding-top: 18px;
	border-top: 1px solid rgba(8, 8, 8, 0.14);
}

.site-root .techable-statement__aside-label {
	margin: 0 0 10px;
	color: var(--dark-color, #080808);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0;
}

.site-root .techable-statement__aside p {
	margin: 0;
	color: var(--dark-gray, #6f7781);
	font-size: 16px;
	line-height: 1.6;
}

/* --- What's included: tiles ------------------------------------------------- */

.site-root .techable-included__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-root .techable-included__item {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 48px;
	min-height: 210px;
	padding: 28px;
	border-radius: var(--_border-radius---border-radius-xl, 20px);
	background: var(--light-field, #f1f1f1);
}

.site-root .techable-included__num {
	color: var(--dark-gray, #6f7781);
	font-size: 16px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.site-root .techable-included__text {
	margin: 0;
	color: var(--dark-color, #080808);
	font-size: 22px;
	font-weight: 500;
	line-height: 1.35;
	letter-spacing: -0.01em;
}

/* --- Process: dark band ----------------------------------------------------- */

.site-root .techable-process {
	margin-top: var(--techable-rhythm);
	background: var(--dark-color, #080808);
}

.site-root .techable-process .techable-head h2 {
	color: #fff;
}

.site-root .techable-process .section-sub-title {
	background: rgba(255, 255, 255, 0.08);
	color: #fff;
}

.site-root .techable-process__steps {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.site-root .techable-process__step {
	position: relative;
	padding: 32px 32px 0 0;
}

.site-root .techable-process__step::before {
	content: '';
	position: absolute;
	top: -5px;
	left: 0;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--primary-color, #006dff);
}

.site-root .techable-process__num {
	color: rgba(255, 255, 255, 0.4);
	font-size: 16px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.site-root .techable-process__title {
	margin: 44px 0 12px;
	color: #fff;
	font-size: 22px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -0.01em;
}

.site-root .techable-process__text {
	margin: 0;
	color: rgba(255, 255, 255, 0.6);
	font-size: 16px;
	line-height: 1.6;
}

/* --- Outcomes ---------------------------------------------------------------- */

.site-root .techable-outcomes__list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 40px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-root .techable-outcomes__list li {
	padding-top: 24px;
	border-top: 2px solid var(--dark-color, #080808);
	color: var(--dark-color, #080808);
	font-size: clamp(20px, 1.8vw, 26px);
	font-weight: 500;
	line-height: 1.32;
	letter-spacing: -0.01em;
}

/* --- Work carousel ----------------------------------------------------------- */

.site-root .techable-work-carousel__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 32px;
	margin-bottom: var(--_gap---gap-3xll, 60px);
}

.site-root .techable-work-carousel__head .techable-head {
	margin-bottom: 0;
}

.site-root .techable-work-carousel__controls {
	display: flex;
	flex-shrink: 0;
	gap: 10px;
}

.site-root .techable-carousel-btn {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border: 0;
	border-radius: 50%;
	background: var(--light-field, #f1f1f1);
	color: var(--dark-color, #080808);
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}

.site-root .techable-carousel-btn svg {
	width: 20px;
	height: 20px;
}

.site-root .techable-carousel-btn:hover:not(:disabled),
.site-root .techable-carousel-btn:focus-visible:not(:disabled) {
	background: var(--dark-color, #080808);
	color: #fff;
}

.site-root .techable-carousel-btn:disabled {
	opacity: 0.35;
	cursor: default;
}

.site-root .techable-work-carousel.is-static .techable-work-carousel__controls {
	display: none;
}

.site-root .techable-work-carousel__viewport {
	margin: -8px -8px 0;
	padding: 8px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.site-root .techable-work-carousel__viewport::-webkit-scrollbar {
	display: none;
}

.site-root .techable-work-carousel__viewport:focus-visible {
	outline: 2px solid var(--primary-color, #006dff);
	outline-offset: 4px;
	border-radius: 20px;
}

.site-root .techable-work-carousel__track {
	display: flex;
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-root .techable-work-carousel__slide {
	flex: 0 0 calc((100% - 48px) / 3);
	scroll-snap-align: start;
}

.site-root .techable-work-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
}

.site-root .techable-work-card__media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	border-radius: var(--_border-radius---border-radius-xl, 20px);
	background: #e6e8eb;
	overflow: hidden;
}

.site-root .techable-work-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-root .techable-work-card:hover .techable-work-card__media img,
.site-root .techable-work-card:focus-visible .techable-work-card__media img {
	transform: scale(1.04);
}

.site-root .techable-work-card:focus-visible {
	outline: none;
}

.site-root .techable-work-card:focus-visible .techable-work-card__media {
	outline: 2px solid var(--primary-color, #006dff);
	outline-offset: 3px;
}

.site-root .techable-work-card__tag {
	position: absolute;
	left: 16px;
	top: 16px;
	padding: 8px 12px;
	border-radius: 999px;
	background: #fff;
	color: var(--dark-color, #080808);
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
}

.site-root .techable-work-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding-top: 22px;
}

.site-root .techable-work-card__title {
	display: block;
	margin-bottom: 8px;
	color: var(--dark-color, #080808);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -0.01em;
}

.site-root .techable-work-card__text {
	display: block;
	margin-bottom: 16px;
	color: var(--dark-gray, #6f7781);
	font-size: 16px;
	line-height: 1.55;
}

.site-root .techable-work-card__cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: auto;
	color: var(--dark-color, #080808);
	font-size: 15px;
	font-weight: 600;
	transition: gap 0.2s ease, color 0.2s ease;
}

.site-root .techable-work-card:hover .techable-work-card__cta {
	gap: 12px;
	color: var(--primary-color, #006dff);
}

.site-root .techable-work-carousel__foot {
	margin-top: 40px;
}

/* --- Why us ------------------------------------------------------------------ */

.site-root .techable-why__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 0 40px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-root .techable-why__item {
	padding: 28px 0 0;
	border-top: 1px solid rgba(8, 8, 8, 0.14);
}

.site-root .techable-why__num {
	display: block;
	margin-bottom: 40px;
	color: var(--primary-color, #006dff);
	font-size: 16px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.site-root .techable-why__item-title {
	margin: 0 0 12px;
	color: var(--dark-color, #080808);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -0.01em;
}

.site-root .techable-why__item-text {
	max-width: 42ch;
	margin: 0;
	color: var(--dark-gray, #6f7781);
	font-size: 16px;
	line-height: 1.6;
}

.site-root .techable-why__stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 16px;
	margin: var(--_gap---gap-3xll, 60px) 0 0;
	padding: 0;
}

.site-root .techable-why__stat {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 48px;
	min-height: 210px;
	padding: 28px;
	border-radius: var(--_border-radius---border-radius-xl, 20px);
	background: var(--light-field, #f1f1f1);
}

.site-root .techable-why__stat-value {
	margin: 0;
	color: var(--dark-color, #080808);
	font-size: clamp(44px, 4.6vw, 76px);
	font-weight: 600;
	line-height: 1;
	letter-spacing: -0.05em;
}

.site-root .techable-why__stat-label {
	margin: 0;
	color: var(--dark-gray, #6f7781);
	font-size: 16px;
	line-height: 1.5;
}

/* --- FAQ: the theme's card treatment, on native <details> ------------------- */

.site-root .techable-faq__list {
	display: flex;
	flex-direction: column;
	gap: var(--_gap---gap-xs, 12px);
	max-width: 908px;
	margin: 0 auto;
}

.site-root .techable-faq__item {
	padding: 0 28px;
	border-radius: 14px;
	background: var(--light-field, #f1f1f1);
}

.site-root .techable-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 28px 0;
	color: var(--dark-color, #080808);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.4;
	list-style: none;
	cursor: pointer;
}

.site-root .techable-faq__q::-webkit-details-marker {
	display: none;
}

.site-root .techable-faq__q:focus-visible {
	outline: 2px solid var(--primary-color, #006dff);
	outline-offset: 4px;
	border-radius: 6px;
}

.site-root .techable-faq__icon {
	position: relative;
	flex-shrink: 0;
	width: 24px;
	height: 24px;
}

.site-root .techable-faq__icon::before,
.site-root .techable-faq__icon::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 16px;
	height: 2px;
	border-radius: 1px;
	background: currentColor;
	transform: translate(-50%, -50%);
	transition: transform 0.25s ease, opacity 0.25s ease;
}

.site-root .techable-faq__icon::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.site-root .techable-faq__item[open] .techable-faq__icon::after {
	opacity: 0;
	transform: translate(-50%, -50%) rotate(0deg);
}

.site-root .techable-faq__a {
	padding: 0 48px 28px 0;
}

.site-root .techable-faq__a p {
	margin: -12px 0 0;
	color: var(--dark-gray, #6f7781);
	font-size: var(--_typography---paragraph-l, 18px);
	line-height: var(--_line-height---line-height-l, 140%);
}

/* --- Sibling practice areas (category hub) --------------------------------- */

/* A hub always lists the other five practice areas — one row of five. */
.site-root .techable-siblings__grid {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-root .techable-sibling-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 220px;
	padding: 28px;
	border: 1px solid var(--techable-line);
	border-radius: var(--_border-radius---border-radius-xl, 20px);
	text-decoration: none;
	transition: background-color 0.25s ease, border-color 0.25s ease;
}

.site-root .techable-sibling-card:hover,
.site-root .techable-sibling-card:focus-visible {
	border-color: transparent;
	background: var(--light-field, #f1f1f1);
	outline: none;
}

.site-root .techable-sibling-card__title {
	display: block;
	margin-bottom: 10px;
	color: var(--dark-color, #080808);
	font-size: 22px;
	font-weight: 600;
	letter-spacing: -0.01em;
}

.site-root .techable-sibling-card__text {
	display: block;
	margin-bottom: 24px;
	color: var(--dark-gray, #6f7781);
	font-size: 16px;
	line-height: 1.55;
}

.site-root .techable-sibling-card__meta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: auto;
	color: var(--dark-color, #080808);
	font-size: 15px;
	font-weight: 600;
}

/* --- Closing CTA --------------------------------------------------------------- */

.site-root .techable-service-cta {
	padding-bottom: var(--techable-rhythm);
}

.site-root .techable-service-cta__card {
	padding: clamp(48px, 7vw, 110px) clamp(24px, 5vw, 80px);
	border-radius: 24px;
	background: var(--dark-color, #080808);
	text-align: center;
}

.site-root .techable-service-cta__title {
	max-width: 860px;
	margin: 0 auto 20px;
	color: #fff;
}

.site-root .techable-service-cta__text {
	max-width: 560px;
	margin: 0 auto 36px;
	color: rgba(255, 255, 255, 0.62);
	font-size: var(--_typography---paragraph-l, 18px);
	line-height: 1.55;
}

.site-root .techable-service-cta__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 24px;
}

.site-root .techable-service-cta__actions .techable-ghost-link {
	border-color: rgba(255, 255, 255, 0.3);
	color: #fff;
}

.site-root .techable-service-cta__actions .techable-ghost-link:hover,
.site-root .techable-service-cta__actions .techable-ghost-link:focus-visible {
	border-color: #fff;
	color: #fff;
}

/* --- Responsive ---------------------------------------------------------------- */

@media screen and (max-width: 991px) {
	.site-root {
		--techable-rhythm: 100px;
	}

	.site-root .techable-statement__grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: 32px;
	}

	.site-root .techable-statement__support,
	.site-root .techable-statement__support:last-child {
		grid-column: 1;
	}

	.site-root .techable-statement__aside {
		grid-column: 2;
	}

	.site-root .techable-included__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.site-root .techable-work-carousel__slide {
		flex-basis: calc((100% - 24px) / 2);
	}

	.site-root .techable-catalog-head {
		grid-template-columns: 1fr;
		align-items: start;
		gap: 16px;
	}

	.site-root .techable-siblings__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.site-root .techable-siblings__grid > li:last-child:nth-child(odd) {
		grid-column: 1 / -1;
	}

	.site-root .techable-catalog-head__action {
		padding-bottom: 0;
	}

	.site-root .techable-service-jump__list {
		justify-content: flex-start;
	}

	.site-root .techable-svc-row__title {
		font-size: 28px;
	}

	.site-root .techable-faq__item {
		padding: 0 20px;
	}

	.site-root .techable-faq__q {
		padding: 20px 0;
	}
}

@media screen and (max-width: 767px) {
	.site-root {
		--techable-rhythm: 60px;
	}

	.site-root .techable-head {
		margin-bottom: 40px;
	}

	.site-root .techable-statement__grid {
		grid-template-columns: 1fr;
		margin-top: 32px;
	}

	.site-root .techable-statement__support,
	.site-root .techable-statement__support:last-child,
	.site-root .techable-statement__aside {
		grid-column: 1;
	}

	.site-root .techable-included__grid,
	.site-root .techable-siblings__grid {
		grid-template-columns: 1fr;
	}

	.site-root .techable-included__item,
	.site-root .techable-why__stat {
		min-height: 0;
		gap: 28px;
	}

	.site-root .techable-process__steps {
		grid-template-columns: 1fr;
		border-top: 0;
		border-left: 1px solid rgba(255, 255, 255, 0.16);
		margin-left: 4px;
	}

	.site-root .techable-process__step {
		padding: 0 0 36px 28px;
	}

	.site-root .techable-process__step::before {
		top: 4px;
		left: -5px;
	}

	.site-root .techable-process__title {
		margin-top: 12px;
	}

	.site-root .techable-work-carousel__head {
		flex-direction: column;
		align-items: flex-start;
		gap: 24px;
		margin-bottom: 40px;
	}

	.site-root .techable-work-carousel__slide {
		flex-basis: 86%;
	}

	.site-root .techable-svc-row__inner {
		padding: 22px 0;
	}

	.site-root .techable-svc-row__top {
		grid-template-columns: 40px minmax(0, 1fr);
		gap: 14px;
	}

	.site-root .techable-svc-row__title {
		font-size: 22px;
	}

	.site-root .techable-svc-row__action {
		grid-column: 2;
		justify-self: start;
	}

	.site-root .techable-svc-row__reveal-inner {
		flex-direction: column;
		align-items: stretch;
		gap: 18px;
		padding-left: 54px;
	}

	/* In a column flex the ratio alone let the image take the whole track and
	   push the copy out of the clipped box — pin the height explicitly. */
	.site-root .techable-svc-row__media {
		flex: none;
		width: 100%;
		max-width: 320px;
		height: 200px;
		aspect-ratio: auto;
	}

	.site-root .techable-svc-row__media,
	.site-root .techable-svc-row__body {
		margin: 18px 0 4px;
	}

	.site-root .techable-svc-row__points {
		grid-template-columns: 1fr;
	}

	.site-root .techable-faq__item {
		padding: 0 16px;
	}

	.site-root .techable-faq__q {
		font-size: 19px;
	}

	.site-root .techable-faq__a {
		padding-right: 0;
	}
}

/* No hover to drive the reveal on touch — show the detail inline instead. */
@media (hover: none) {
	.site-root .techable-svc-row__reveal {
		grid-template-rows: 1fr;
	}

	.site-root .techable-svc-row__reveal-inner {
		opacity: 1;
		transform: none;
	}

	.site-root .techable-svc-row__action {
		background: var(--light-field, #f1f1f1);
		color: var(--dark-color, #080808);
	}
}

@media (prefers-reduced-motion: reduce) {
	.site-root .techable-work-card__media img,
	.site-root .techable-svc-row__bg,
	.site-root .techable-svc-row__reveal,
	.site-root .techable-svc-row__reveal-inner,
	.site-root .techable-svc-row__action,
	.site-root .techable-svc-row__action svg {
		transition: none;
	}

	.site-root .techable-svc-row__reveal {
		grid-template-rows: 1fr;
	}

	.site-root .techable-svc-row__reveal-inner {
		opacity: 1;
		transform: none;
	}
}

/* ==========================================================================
   Services mega menu — type-led: a category rail, the services as a plain
   two-column index, and one real case study. No icons, counts or badges.
   ========================================================================== */

.site-root .techable-megamenu.dd-menu-wrap {
	display: grid;
	grid-template-columns: 232px minmax(0, 1fr);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 16px;
	background: #0b1013;
	box-shadow: 0 40px 90px -24px rgba(0, 0, 0, 0.7);
	max-height: min(620px, calc(100vh - 110px));
	overflow: hidden;
}

.site-root .techable-mm__rail {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	padding: 18px 12px;
	list-style: none;
	border-right: 1px solid rgba(255, 255, 255, 0.07);
}

.site-root .techable-mm__tab {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	padding: 12px 14px;
	border: 0;
	border-radius: 10px;
	background: transparent;
	color: rgba(255, 255, 255, 0.48);
	font-size: 15px;
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.25;
	text-align: left;
	cursor: pointer;
	transition: color 0.2s ease, background-color 0.2s ease;
}

.site-root .techable-mm__tab svg {
	flex-shrink: 0;
	width: 14px;
	height: 14px;
	color: var(--primary-color, #006dff);
	opacity: 0;
	transform: translateX(-4px);
	transition: opacity 0.2s ease, transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-root .techable-mm__tab:hover,
.site-root .techable-mm__tab:focus-visible {
	color: rgba(255, 255, 255, 0.86);
	outline: none;
}

.site-root .techable-mm__tab:focus-visible {
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25);
}

.site-root .techable-mm__tab.is-active {
	color: #fff;
	background: rgba(255, 255, 255, 0.05);
}

.site-root .techable-mm__tab.is-active svg {
	opacity: 1;
	transform: translateX(0);
}

.site-root .techable-mm__panes {
	min-width: 0;
	overflow-y: auto;
}

.site-root .techable-mm__pane {
	display: none;
	grid-template-columns: minmax(0, 1fr) 248px;
	gap: 36px;
	height: 100%;
	padding: 26px 28px 26px 32px;
	box-sizing: border-box;
}

.site-root .techable-mm__pane.is-active {
	display: grid;
	animation: techable-mm-pane-in 0.22s ease both;
}

@keyframes techable-mm-pane-in {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

.site-root .techable-mm__links {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.site-root .techable-mm__list {
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
	columns: 2;
	column-gap: 32px;
}

.site-root .techable-mm__list li {
	break-inside: avoid;
}

.site-root .techable-mm__list a {
	display: block;
	padding: 8px 0;
	color: rgba(255, 255, 255, 0.7);
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.35;
	text-decoration: none;
	transition: color 0.15s ease;
}

.site-root .techable-mm__list a:hover,
.site-root .techable-mm__list a:focus-visible {
	color: #fff;
	outline: none;
}

.site-root .techable-mm__list a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 4px;
}

.site-root .techable-mm__all {
	display: flex;
	align-items: center;
	gap: 8px;
	/* Pinned to the pane foot so it sits in the same place on every tab. */
	margin-top: auto;
	padding-top: 18px;
	border-top: 1px solid rgba(255, 255, 255, 0.07);
	color: #fff;
	font-size: 13.5px;
	font-weight: 600;
	text-decoration: none;
}

.site-root .techable-mm__all svg,
.site-root .techable-mm__feature-cta svg {
	width: 14px;
	height: 14px;
	transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-root .techable-mm__all:hover svg,
.site-root .techable-mm__all:focus-visible svg,
.site-root .techable-mm__feature:hover .techable-mm__feature-cta svg,
.site-root .techable-mm__feature:focus-visible .techable-mm__feature-cta svg {
	transform: translateX(3px);
}

.site-root .techable-mm__feature {
	display: flex;
	flex-direction: column;
	gap: 6px;
	color: #fff;
	text-decoration: none;
}

.site-root .techable-mm__feature:focus-visible {
	outline: 1px solid rgba(255, 255, 255, 0.4);
	outline-offset: 6px;
	border-radius: 12px;
}

.site-root .techable-mm__feature-media {
	display: block;
	aspect-ratio: 4 / 3;
	margin-bottom: 8px;
	border-radius: 10px;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.04);
}

.site-root .techable-mm__feature-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-root .techable-mm__feature:hover .techable-mm__feature-media img {
	transform: scale(1.04);
}

.site-root .techable-mm__feature-title {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
}

.site-root .techable-mm__feature-cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: rgba(255, 255, 255, 0.5);
	font-size: 13px;
	font-weight: 500;
	transition: color 0.2s ease;
}

.site-root .techable-mm__feature:hover .techable-mm__feature-cta {
	color: #fff;
}

.site-root .techable-mm__empty {
	grid-column: 1 / -1;
	padding: 24px;
}

@media screen and (max-width: 1100px) {
	.site-root .techable-mm__pane {
		grid-template-columns: minmax(0, 1fr) 200px;
		gap: 28px;
	}
}

@media screen and (max-width: 991px) {
	.site-root .techable-megamenu.dd-menu-wrap {
		grid-template-columns: 1fr;
		max-height: calc(100vh - 140px);
	}

	.site-root .techable-mm__rail {
		flex-direction: row;
		gap: 4px;
		padding: 10px;
		overflow-x: auto;
		scrollbar-width: none;
		border-right: 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.07);
	}

	.site-root .techable-mm__rail::-webkit-scrollbar {
		display: none;
	}

	.site-root .techable-mm__tab {
		width: auto;
		padding: 9px 12px;
		font-size: 13.5px;
		white-space: nowrap;
	}

	.site-root .techable-mm__tab svg,
	.site-root .techable-mm__feature {
		display: none;
	}

	.site-root .techable-mm__pane {
		grid-template-columns: 1fr;
		padding: 18px 20px 20px;
	}
}

@media screen and (max-width: 579px) {
	.site-root .techable-mm__list {
		columns: 1;
	}
}

/* ==========================================================================
   Document outline fixes — tags changed for one <h1> per page, rendering
   pinned to what each element was designed at.
   ========================================================================== */

/* Export hero titles were <h2>; promoted to <h1> but kept at the h2 scale. */
.site-root h1.techable-hero-title {
	font-size: var(--_typography---h2);
	line-height: var(--_line-height---line-height-s);
	letter-spacing: var(--_letter-speacing---letter-speacing-2xl);
}

/* Stat ticker digits were <h1>; now <span>, drawn exactly as the base h1 rule. */
.site-root span.future-v3-number {
	display: block;
	margin: 0;
	font-size: var(--_typography---h1);
	line-height: var(--_line-height---line-height-s);
	font-weight: var(--_font-weight---semi-bold);
	letter-spacing: var(--_letter-speacing---letter-speacing-3xl);
}

.site-root .techable-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* ==========================================================================
   Mega menu inside the collapsed nav: flow with the menu, never float over it.
   ========================================================================== */

@media screen and (max-width: 991px) {
	.site-root .techable-megamenu-dropdown {
		padding-bottom: 0;
		margin-bottom: 0;
	}

	.site-root .techable-megamenu-panel.dd-navigation,
	.site-root .dd-navigation.techable-megamenu-panel {
		position: static !important;
		top: auto !important;
		left: auto !important;
		right: auto !important;
		width: 100%;
		max-width: 100%;
		max-height: none;
		padding: 0 0 10px;
		transform: none !important;
	}

	.site-root .techable-megamenu-panel.dd-navigation::before {
		display: none;
	}

	.site-root .techable-megamenu.dd-menu-wrap {
		max-height: none;
		border-radius: 12px;
		box-shadow: none;
		animation: none;
	}

	.site-root .techable-mm__pane.is-active {
		animation: none;
	}
}

/* ==========================================================================
   Detail pages on the reference "label left / 785px text right" pattern.
   ========================================================================== */

.site-root .techable-service-body {
	padding-top: var(--_gap---gap-3xll, 60px);
	padding-bottom: 0;
}

/* No dark hero here, so clear the fixed header. */
.site-root .techable-work-single {
	padding-top: 180px;
	padding-bottom: 0;
}

@media screen and (max-width: 767px) {
	.site-root .techable-work-single {
		padding-top: 130px;
	}
}

.site-root .techable-service-body .service-banner-img-wrap {
	margin-top: 0;
}

.site-root .blog-single-banner-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.site-root .overview-wrap,
.site-root .inclued-wrap {
	gap: 40px;
}

.site-root .overview-wrap .overview-title,
.site-root .inclued-wrap .overview-title,
.site-root .intro-title-wrap {
	flex: 0 0 200px;
}

.site-root .overview-details-wrap {
	width: 100%;
	max-width: 785px;
}

.site-root .techable-service-body .inclued-wrap + .marketing-image-wrap {
	margin-top: var(--_gap---gap-3xll, 60px);
}

/* Let technology cards use the full section width. */
.site-root .techable-tech-stack {
	margin-top: var(--_gap---gap-3xll, 60px);
	display: flex;
	flex-direction: column;
	gap: 32px;
	align-items: stretch;
}

.site-root .techable-tech-stack__header {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}

/* The shared overview heading basis is for horizontal layouts only. */
.site-root .techable-tech-stack .techable-tech-stack__header .overview-title {
	flex: 0 1 auto;
	width: 100%;
}

.site-root .techable-tech-stack__intro {
	max-width: 680px;
	margin: 0;
	color: var(--dark-gray, #6f7781);
	font-size: 16px;
	line-height: 1.6;
}

.site-root .techable-tech-stack .overview-title,
.site-root .techable-tech-stack .marketing-title {
	margin: 0;
	color: var(--dark-color, #080808);
	letter-spacing: normal;
}

.site-root .techable-tech-stack .overview-details-wrap {
	min-width: 0;
	width: 100%;
	max-width: none;
	gap: 32px;
}

.site-root .techable-tech-stack__group + .techable-tech-stack__group {
	padding-top: 32px;
	border-top: 1px solid rgba(8, 8, 8, 0.1);
}

.site-root .techable-tech-stack__group {
	min-width: 0;
}

.site-root .techable-tech-stack__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-root .techable-tech-stack__card {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: flex-start;
	gap: 14px;
	min-width: 0;
	padding: 20px;
	border: 1px solid rgba(8, 8, 8, 0.1);
	border-radius: 12px;
	background: linear-gradient(135deg, var(--white, #fff), #f3f7fc);
	color: var(--dark-color, #080808);
	transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.site-root .techable-tech-stack .marketing-title {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	font-weight: 600;
}

.site-root .techable-tech-stack__number {
	color: var(--primary-color, #006dff);
	font-size: 13px;
	font-variant-numeric: tabular-nums;
}

.site-root .techable-tech-stack__count {
	margin-left: auto;
	padding: 4px 10px;
	border-radius: 100px;
	background: #eef4ff;
	color: var(--primary-color, #006dff);
	font-size: 12px;
	font-weight: 500;
}

.site-root .techable-tech-stack__card::before {
	content: '';
	position: absolute;
	inset: 0 auto 0 0;
	width: 3px;
	background: var(--primary-color, #006dff);
	transform: scaleY(0);
	transform-origin: bottom;
	transition: transform .25s ease;
}

@media (hover: hover) and (pointer: fine) {
	.site-root .techable-tech-stack__card:hover {
		transform: translateY(-4px);
		border-color: rgba(0, 109, 255, .3);
		box-shadow: 0 12px 28px rgba(8, 8, 8, .07);
	}
	.site-root .techable-tech-stack__card:hover::before {
		transform: scaleY(1);
	}
	.site-root .techable-tech-stack__card:hover .techable-tech-stack__icon {
		transform: rotate(-6deg) scale(1.05);
	}
}

@media (prefers-reduced-motion: reduce) {
	.site-root .techable-tech-stack__card,
	.site-root .techable-tech-stack__card::before,
	.site-root .techable-tech-stack__icon {
		transition: none;
		transform: none;
	}
}

.site-root .techable-tech-stack__icon {
	transition: transform .25s ease;
	position: relative;
	display: grid;
	place-items: center;
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	border-radius: 8px;
	background: var(--white, #fff);
	color: var(--primary-color, #006dff);
}

.site-root .techable-tech-stack__icon img {
	position: absolute;
	width: 24px;
	height: 24px;
	background: var(--white, #fff);
}

.site-root .techable-tech-stack__icon img[hidden] {
	display: none;
}

.site-root .techable-tech-stack__copy {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	overflow-wrap: anywhere;
}

.site-root .techable-tech-stack__name {
	font-size: 18px;
	line-height: 1.4;
	font-weight: 600;
}

.site-root .techable-tech-stack__description {
	color: var(--dark-gray, #6f7781);
	font-size: 15px;
	line-height: 1.5;
	font-weight: 500;
}

@media screen and (max-width: 991px) {
	.site-root .techable-tech-stack__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media screen and (max-width: 600px) {
	.site-root .techable-tech-stack__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Results and planning layout used only by the SEO service. */
.site-root .techable-seo-results {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

.site-root .techable-seo-results__item {
	padding: 28px;
	border: 1px solid rgba(8, 8, 8, .1);
	border-radius: 12px;
	background: #f3f7fc;
}

.site-root .techable-seo-results__item h2 {
	margin: 0;
	font-family: var(--_font-family---primary-font, Arial, sans-serif);
	font-weight: 600;
	letter-spacing: normal;
	word-spacing: normal;
}

.site-root .techable-seo-results__value {
	display: block;
	font-size: clamp(36px, 4vw, 60px);
	font-weight: 600;
	letter-spacing: -0.02em;
	font-variant-numeric: tabular-nums;
	line-height: 1.2;
	color: var(--primary-color, #006dff);
}

.site-root .techable-seo-results__label {
	display: block;
	margin-top: 8px;
	font-size: 20px;
	font-weight: 500;
	letter-spacing: normal;
	word-spacing: normal;
	line-height: 1.4;
}

.site-root .techable-seo-planning__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
	padding: 0;
	margin: 32px 0 0;
	list-style: none;
}

.site-root .techable-seo-planning .techable-seo-planning__step {
	min-width: 0;
	margin: 0;
	padding: 24px;
	border: 1px solid rgba(8, 8, 8, .1);
	border-radius: 12px;
}

.site-root .techable-seo-planning__step .marketing-title {
	margin: 0 0 12px;
}

.site-root .techable-seo-planning__step .overview-details {
	margin: 0;
}

@media screen and (max-width: 600px) {
	.site-root .techable-seo-results,
	.site-root .techable-seo-planning__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

.site-root .techable-step .marketing-title {
	display: flex;
	gap: 14px;
	align-items: baseline;
	color: var(--dark-color, #080808);
	font-weight: 600;
}

.site-root .techable-step__num {
	color: var(--primary-color, #006dff);
	font-size: 14px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.site-root .techable-step + .techable-step {
	padding-top: 20px;
	border-top: 1px solid rgba(8, 8, 8, 0.1);
}

.site-root .marketing-list-wrap {
	align-items: flex-start;
}

.site-root .marketing-list-icon {
	flex-shrink: 0;
	margin-top: 1px;
}

/* --- Work single --- */
.site-root .techable-work-single .wrok-single-title {
	margin: 0;
	max-width: 900px;
}

.site-root .techable-back-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--dark-color, #080808);
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.site-root .techable-back-link svg {
	width: 18px;
	height: 18px;
	transition: transform 0.25s ease;
}

.site-root .techable-back-link:hover svg {
	transform: translateX(4px);
}

.site-root .techable-work-single .intro-wrap {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}

.site-root .techable-work-single .intro-wrap + .intro-wrap {
	margin-top: var(--_gap---gap-3xll, 60px);
}

.site-root .techable-work-single .intro-details-wrap {
	margin-top: 0;
}

.site-root .techable-work-rich p,
.site-root .techable-work-rich li {
	color: var(--dark-gray, #6f7781);
	font-size: var(--_typography---paragraph-l, 18px);
	line-height: var(--_line-height---line-height-l, 140%);
	font-weight: 500;
}

.site-root .techable-work-rich p {
	margin: 0 0 16px;
}

.site-root .techable-work-rich > :last-child {
	margin-bottom: 0;
}

.site-root .techable-work-rich h3,
.site-root .techable-work-rich h4 {
	margin: 28px 0 10px;
	font-size: 22px;
	font-weight: 600;
}

.site-root .techable-work-rich img {
	border-radius: var(--_border-radius---border-radius-xl, 20px);
}

.site-root .intor-single-list {
	padding-top: 8px;
}

.site-root .intor-image-wrap {
	border-radius: var(--_border-radius---border-radius-xl, 20px);
}

.site-root .techable-project-nav {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin-top: var(--_gap---gap-3xll, 60px);
	padding-top: 32px;
	border-top: 1px solid rgba(8, 8, 8, 0.12);
}

.site-root .techable-project-nav__item {
	display: flex;
	flex-direction: column;
	gap: 6px;
	text-decoration: none;
}

.site-root .techable-project-nav__item.is-next {
	grid-column: 2;
	text-align: right;
}

.site-root .techable-project-nav__label {
	color: var(--dark-gray, #6f7781);
	font-size: 14px;
}

.site-root .techable-project-nav__title {
	color: var(--dark-color, #080808);
	font-size: 26px;
	font-weight: 600;
	letter-spacing: -0.02em;
}

@media screen and (max-width: 767px) {
	.site-root .overview-wrap,
	.site-root .inclued-wrap,
	.site-root .techable-work-single .intro-wrap {
		flex-direction: column;
		gap: 18px;
	}

	.site-root .overview-wrap .overview-title,
	.site-root .inclued-wrap .overview-title,
	.site-root .intro-title-wrap {
		flex-basis: auto;
		width: 100%;
	}

	.site-root .techable-project-nav {
		grid-template-columns: 1fr;
	}

	.site-root .techable-project-nav__item.is-next {
		grid-column: 1;
		text-align: left;
	}
}

.site-root .techable-mm__rail-foot {
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.site-root .techable-mm__all-services {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 14px;
	border-radius: 10px;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.site-root .techable-mm__all-services svg {
	width: 14px;
	height: 14px;
	color: var(--primary-color, #006dff);
}

.site-root .techable-mm__all-services:hover,
.site-root .techable-mm__all-services:focus-visible {
	background: rgba(255, 255, 255, 0.06);
	outline: none;
}

@media screen and (max-width: 991px) {
	.site-root .techable-mm__rail-foot {
		margin-top: 0;
		padding-top: 0;
		border-top: 0;
		flex: none;
	}

	.site-root .techable-mm__all-services {
		padding: 9px 12px;
		white-space: nowrap;
	}
}

/* ── Static team cards (slots 8–23, no Webflow IX2 registration) ── */
/* Cards are already visible (no opacity:0), but details overlay needs CSS hover. */
.site-root .team-item-wrap--static .team-details-wrap {
	transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.site-root .team-item-wrap--static:hover .team-details-wrap {
	transform: translate3d(0, 0%, 0) !important;
}

.site-root .team-item-wrap--static .team-overly {
	transition: opacity 0.35s ease;
}

.site-root .team-item-wrap--static:hover .team-overly {
	opacity: 1;
}

/* ── Unified team card hover: all 23 cards, same CSS behaviour ── */
/* Overrides the --static-only rules above; Webflow IX2 JS on original 7 */
/* does the same motion via inline style, so !important keeps parity.   */
.site-root .team-item-wrap .team-details-wrap {
	transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.site-root .team-item-wrap:hover .team-details-wrap {
	transform: translate3d(0, 0%, 0) !important;
}

.site-root .team-item-wrap .team-overly {
	transition: opacity 0.35s ease;
}

.site-root .team-item-wrap:hover .team-overly {
	opacity: 1;
}

/* ── Map location pills: hide empty second pill (Mexico removed) ── */
.site-root .hero-map-text:empty {
	display: none;
}

/* Shared template: identical sizing and interactions for every team member. */
.site-root .techable-team-member {
    aspect-ratio: 1 / 1;
    background: #18212c;
}
.site-root .techable-team-member .team-item-image,
.site-root .techable-team-placeholder {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.site-root .techable-team-placeholder {
    display: grid;
    place-items: center;
    font-size: 64px;
    color: #fff;
}
.site-root .techable-team-member .team-item-image {
    filter: grayscale(100%);
    transition: filter .35s ease, transform .35s ease;
}
.site-root .techable-team-member .team-details-wrap {
    transform: translateY(200%);
    transition: transform .35s cubic-bezier(.4, 0, .2, 1);
}
.site-root .techable-team-member .team-overly {
    opacity: 0;
    transition: opacity .35s ease;
}
.site-root .techable-team-member:is(:hover, :focus) .team-details-wrap { transform: translateY(0); }
.site-root .techable-team-member:is(:hover, :focus) .team-overly { opacity: 1; }
.site-root .techable-team-member:is(:hover, :focus) .team-item-image { filter: grayscale(0); transform: scale(1.04); }
.site-root .techable-team-member:focus-visible { outline: 2px solid #006dff; outline-offset: 3px; }
.site-root .techable-team-member .member-name,
.site-root .techable-team-member .member-pst { overflow-wrap: anywhere; }
@media (hover: none) {
    .site-root .techable-team-member .team-details-wrap { transform: translateY(0); }
    .site-root .techable-team-member .team-overly { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .site-root .techable-team-member .team-item-image,
    .site-root .techable-team-member .team-details-wrap,
    .site-root .techable-team-member .team-overly { transition: none; }
}


/* Shared blue section lighting. CSS gradients replace backgrounds with baked-in green. */
.site-root .pricing-tab-grid-wrap {
	align-items: stretch;
}
.site-root .pricing-tab-grid-wrap .pricing-cl-wrapper,
.site-root .pricing-tab-grid-wrap .pricing-cl-list,
.site-root .pricing-tab-grid-wrap .pricing-cl-item {
	display: flex;
	flex-direction: column;
	min-width: 0;
}
.site-root .pricing-tab-grid-wrap .pricing-cl-list,
.site-root .pricing-tab-grid-wrap .pricing-cl-item,
.site-root .pricing-tab-grid-wrap .pricing-tab-card-wrap {
	flex: 1;
}
.site-root .pricing-tab-grid-wrap .pricing-tab-card-wrap {
	box-sizing: border-box;
}
@media screen and (min-width: 768px) {
	.site-root .pricing-tab-grid-wrap .pricing-card-details {
		min-height: 4.5em;
	}
}

.site-root .pricing-tab-card-wrap.center {
	background-image: linear-gradient(180deg, transparent 48%, rgba(0, 109, 255, 0.35) 75%, #006dff 100%);
}

.site-root .section.hero,
.site-root .section.contact-inner,
.site-root .section.service-inner,
.site-root .section.work-inner,
.site-root .section.pricing-inner,
.site-root .section.ambition,
.site-root .section.number {
	background-image:
		radial-gradient(ellipse 55% 65% at 0% 0%, rgba(0, 109, 255, 0.65) 0%, transparent 70%),
		radial-gradient(ellipse 55% 65% at 100% 0%, rgba(0, 109, 255, 0.65) 0%, transparent 70%) !important;
	background-color: #080808 !important;
}


/* ── Home: Trusted logos — show SVGs in greyscale, full colour on hover ── */
.site-root .trusted-single-img {
    opacity: 0.45;
    filter: grayscale(100%);
    transition: opacity 0.3s ease, filter 0.3s ease;
    width: 120px;
    max-height: 40px;
    object-fit: contain;
}
.site-root .trusted-single-wrap:hover .trusted-single-img {
    opacity: 1;
    filter: grayscale(0%);
}

/* ── Service: Portfolio gallery ──────────────────────────────────────────── */
.site-root .techable-service-portfolio {
    padding: 80px 0;
}
.site-root .techable-service-portfolio .techable-head {
    text-align: center;
    margin-bottom: 48px;
}

/* 3-card row grid */
.site-root .techable-portfolio-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
@media (max-width: 900px) {
    .site-root .techable-portfolio-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
    .site-root .techable-portfolio-grid { grid-template-columns: 1fr; }
}

/* Card button */
.site-root .techable-portfolio-card {
    all: unset;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    border-radius: 12px;
    overflow: hidden;
    background: #111820;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.site-root .techable-portfolio-card:focus-visible {
    outline: 2px solid #006dff;
    outline-offset: 3px;
}
.site-root .techable-portfolio-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(0,0,0,0.45);
}

/* Thumbnail area */
.site-root .techable-portfolio-card__thumb {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 16 / 10;
}
.site-root .techable-portfolio-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}
.site-root .techable-portfolio-card:hover .techable-portfolio-card__thumb img {
    transform: scale(1.05);
}

/* Hover overlay */
.site-root .techable-portfolio-card__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}
.site-root .techable-portfolio-card:hover .techable-portfolio-card__overlay,
.site-root .techable-portfolio-card:focus-visible .techable-portfolio-card__overlay {
    opacity: 1;
}
.site-root .techable-portfolio-card__zoom {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(255,255,255,0.15);
    border: 1.5px solid rgba(255,255,255,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    backdrop-filter: blur(4px);
}

/* Card label */
.site-root .techable-portfolio-card__name {
    display: block;
    padding: 14px 16px;
    font-size: 0.9rem;
    font-weight: 600;
    color: #cdd6e0;
    text-align: left;
}

/* Hidden cards (shown after Load More) */
.site-root .techable-portfolio-card--hidden {
    display: none;
}

/* Load More button */
.site-root .techable-portfolio-loadmore-wrap {
    display: flex;
    justify-content: center;
    margin-top: 36px;
}
.site-root .techable-portfolio-loadmore {
    all: unset;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 32px;
    border-radius: 8px;
    border: 1.5px solid rgba(255,255,255,0.18);
    color: #cdd6e0;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.site-root .techable-portfolio-loadmore:hover {
    background: rgba(255,255,255,0.07);
    border-color: rgba(255,255,255,0.35);
    color: #fff;
}
.site-root .techable-portfolio-loadmore:focus-visible {
    outline: 2px solid #006dff;
    outline-offset: 3px;
}

/* ── Portfolio Lightbox modal ─────────────────────────────────────────────── */
.site-root .techable-portfolio-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.site-root .techable-portfolio-modal[hidden] { display: none; }

.site-root .techable-portfolio-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.85);
    backdrop-filter: blur(6px);
    cursor: pointer;
}

.site-root .techable-portfolio-modal__box {
    position: relative;
    z-index: 1;
    background: #0e1620;
    border-radius: 14px;
    overflow: hidden;
    max-width: 1100px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 32px 80px rgba(0,0,0,0.7);
}

.site-root .techable-portfolio-modal__close {
    all: unset;
    cursor: pointer;
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 2;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255,255,255,0.1);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
}
.site-root .techable-portfolio-modal__close:hover { background: rgba(255,255,255,0.22); }
.site-root .techable-portfolio-modal__close:focus-visible { outline: 2px solid #006dff; outline-offset: 2px; }

.site-root .techable-portfolio-modal__img-wrap {
    overflow-y: auto;
    flex: 1;
}
.site-root .techable-portfolio-modal__img {
    width: 100%;
    display: block;
    object-fit: contain;
}

.site-root .techable-portfolio-modal__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-top: 1px solid rgba(255,255,255,0.08);
    gap: 16px;
    flex-wrap: wrap;
}
.site-root .techable-portfolio-modal__caption {
    font-size: 0.95rem;
    font-weight: 600;
    color: #cdd6e0;
}
.site-root .techable-portfolio-modal__live {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 20px;
    border-radius: 6px;
    background: #006dff;
    color: #fff;
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s ease;
    white-space: nowrap;
}
.site-root .techable-portfolio-modal__live:hover { background: #0058d4; }
.site-root .techable-portfolio-modal__live[hidden] { display: none; }

/* Modal: description body */
.site-root .techable-portfolio-modal__body {
    padding: 16px 20px 0;
}
.site-root .techable-portfolio-modal__body[hidden] { display: none; }
.site-root .techable-portfolio-modal__desc {
    font-size: 0.9rem;
    color: #9ba8b5;
    line-height: 1.6;
    margin: 0;
}

/* Modal: meta row (name + dates) */
.site-root .techable-portfolio-modal__meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.site-root .techable-portfolio-modal__dates {
    font-size: 0.78rem;
    color: #6b7a8a;
    letter-spacing: 0.02em;
}
.site-root .techable-portfolio-modal__dates[hidden] { display: none; }

/* ── Service: Trusted by Leading Brands ─────────────────────────────────── */
.site-root .techable-service-trusted {
    padding: 56px 0;
    background: #fff;
    border-top: 1px solid #eef0f3;
    border-bottom: 1px solid #eef0f3;
}
.site-root .techable-service-trusted__inner {
    display: flex;
    align-items: center;
    gap: 40px;
    flex-wrap: wrap;
    justify-content: center;
}
.site-root .techable-service-trusted__label {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #6b7a8d;
    white-space: nowrap;
    flex-shrink: 0;
}
.site-root .techable-service-trusted__logos {
    display: flex;
    align-items: center;
    gap: 40px;
    flex-wrap: wrap;
    justify-content: center;
}
.site-root .techable-service-trusted__logo {
    height: 36px;
    width: auto;
    max-width: 120px;
    opacity: 0.45;
    filter: grayscale(100%);
    transition: opacity 0.25s ease, filter 0.25s ease;
    object-fit: contain;
}
.site-root .techable-service-trusted__logo:hover {
    opacity: 1;
    filter: grayscale(0%);
}
@media (max-width: 680px) {
    .site-root .techable-service-trusted__inner {
        flex-direction: column;
        gap: 24px;
    }
    .site-root .techable-service-trusted__logos {
        gap: 24px;
    }
    .site-root .techable-service-trusted__logo {
        height: 28px;
    }
}

/* Keep Contact Now text white throughout the hover animation. */
.site-root .primary-button.techable-contact-now:hover,
.site-root .primary-button.techable-contact-now:focus-visible,
.site-root .primary-button.techable-contact-now:hover .primary-btn-wrap,
.site-root .primary-button.techable-contact-now:focus-visible .primary-btn-wrap,
.site-root .primary-button.techable-contact-now:hover .primary-btn-text-wrap,
.site-root .primary-button.techable-contact-now:focus-visible .primary-btn-text-wrap {
 color: #fff !important;
}
.site-root .primary-button.techable-contact-now:hover .primary-btn-wrap,
.site-root .primary-button.techable-contact-now:focus-visible .primary-btn-wrap,
.site-root .primary-button.techable-contact-now:hover .primary-btn-bg,
.site-root .primary-button.techable-contact-now:focus-visible .primary-btn-bg {
 background-color: #006dff !important;
}
.site-root .primary-button.techable-contact-now:hover .primary-icon,
.site-root .primary-button.techable-contact-now:focus-visible .primary-icon {
 filter: brightness(0) invert(1);
}

/* Homepage: blue arrows on the white primary-button hover state. */
.site-root .hero .primary-button:hover .primary-icon,
.site-root .hero .primary-button:focus-visible .primary-icon,
.site-root .about-intro .primary-button:hover .primary-icon,
.site-root .about-intro .primary-button:focus-visible .primary-icon,
.site-root .work-btm-wrap .primary-button:hover .primary-icon,
.site-root .work-btm-wrap .primary-button:focus-visible .primary-icon {
 filter: brightness(0) saturate(100%) invert(32%) sepia(99%) saturate(3949%) hue-rotate(208deg) brightness(101%) contrast(105%);
}
.site-root .hero .watch-button:hover,
.site-root .hero .watch-button:focus-visible {
 border-color: #fff !important;
 box-shadow: inset 0 0 0 1px #fff;
 background-color: transparent !important;
 color: #fff !important;
}
.site-root .hero .watch-button .watch-btn-bg {
 background-color: transparent !important;
}
.site-root .about-intro .primary-button:hover .primary-btn-text-wrap,
.site-root .about-intro .primary-button:focus-visible .primary-btn-text-wrap {
 color: #006dff !important;
}

/* What We Do cards: equal heights, black fill and dark blue border. */
.site-root .growth .growth-grid-wrap {
 grid-template-rows: 1fr;
 grid-auto-rows: 1fr;
 align-items: stretch;
}
.site-root .growth .growth-card-wrapper {
 display: flex;
}
.site-root .growth .growth-card-wrap {
 width: 100%;
 box-sizing: border-box;
 background-color: #000000 !important;
 outline: 1px solid #003f94;
 outline-offset: -1px;
}

/* Site palette: neutral dark surfaces with blue accents; no green undertones. */
:root,
.site-root {
 --dark-color: #080808;
 --dark-field: #111111;
 --light-gray: #929292;
 --primary-color: #006dff;
}
.site-root .contact-icon-wrap {
 background-image: radial-gradient(circle, rgba(0,109,255,.3), transparent 75%) !important;
}
.site-root .trusted-single-wrap:hover .trusted-single-img {
 filter: grayscale(100%);
}

/* Homepage: breathing room below pricing, before the growth numbers section. */
body.home .site-root .section.plan {
 padding-bottom: clamp(48px, 6vw, 96px);
}

/* ── Change 1: Stats section "Get Started" button — arrow icon turns blue on hover ── */
.site-root .section.number .primary-btn-wrap:hover .primary-icon,
.site-root .section.number .primary-btn-wrap:focus-within .primary-icon,
.site-root .section.number .primary-button:hover .primary-icon,
.site-root .section.number .primary-button:focus-visible .primary-icon {
 filter: brightness(0) saturate(100%) invert(32%) sepia(100%) saturate(4850%) hue-rotate(208deg) brightness(100%) contrast(107%);
}

/* ── Change 2: Blend pricing-inner bottom edge into stats section top ── */
.site-root .section.pricing-inner {
 background-image:
  radial-gradient(ellipse 55% 65% at 0% 0%,   rgba(0, 109, 255, 0.65) 0%, transparent 70%),
  radial-gradient(ellipse 55% 65% at 100% 0%,  rgba(0, 109, 255, 0.65) 0%, transparent 70%),
  radial-gradient(ellipse 70% 50% at 0% 100%,  rgba(0, 109, 255, 0.45) 0%, transparent 70%),
  radial-gradient(ellipse 70% 50% at 100% 100%, rgba(0, 109, 255, 0.45) 0%, transparent 70%) !important;
}

/* ── Change 3: 500K Users stat card — number label and subtext white on blue card ── */
.site-root .plan-single-card:not(._02):not(._03) .number-details,
.site-root .plan-single-card:not(._02):not(._03) span.future-v3-number,
.site-root .plan-single-card:not(._02):not(._03) .plan-card-details {
 color: #fff !important;
}

/* ── Change 4: Blog section "View All Blogs" button — arrow icon turns blue on hover ── */
.site-root .section.posts-preview .primary-btn-wrap:hover .primary-icon,
.site-root .section.posts-preview .primary-btn-wrap:focus-within .primary-icon,
.site-root .section.posts-preview .primary-button:hover .primary-icon,
.site-root .section.posts-preview .primary-button:focus-visible .primary-icon {
 filter: brightness(0) saturate(100%) invert(32%) sepia(100%) saturate(4850%) hue-rotate(208deg) brightness(100%) contrast(107%);
}

/* ── Hero "Get Started" button (service-inner sections) — arrow icon blue on hover ── */
.site-root .section.service-inner .primary-btn-wrap:hover .primary-icon,
.site-root .section.service-inner .primary-btn-wrap:focus-within .primary-icon,
.site-root .section.service-inner .primary-button:hover .primary-icon,
.site-root .section.service-inner .primary-button:focus-visible .primary-icon {
 filter: brightness(0) saturate(100%) invert(32%) sepia(100%) saturate(4850%) hue-rotate(208deg) brightness(100%) contrast(107%);
}

/* ── Blog: tab filter buttons — white text; active tab blue bg + white text ── */
.site-root .section.blog .blog-tab-link {
 color: #fff !important;
 background-color: rgba(255, 255, 255, 0.08) !important;
}
.site-root .section.blog .blog-tab-link.w--current,
.site-root .section.blog .blog-tab-link[aria-selected="true"] {
 background-color: #006dff !important;
 color: #fff !important;
}

/* ── About page: "Talk to our team" hero button — white border, no coloured background ── */
.site-root .section.service-inner .watch-button.w-inline-block {
 border: 1px solid rgba(255, 255, 255, 0.8) !important;
 background: transparent !important;
}
.site-root .section.service-inner .watch-button .watch-btn-bg {
 display: none !important;
}

/* ── Contact page: "View Services" hero button — no background; white border on hover ── */
.site-root .section.contact-inner .watch-button.w-inline-block {
 background: transparent !important;
 border: 1px solid transparent !important;
 transition: border-color 0.25s ease !important;
}
.site-root .section.contact-inner .watch-button .watch-btn-bg {
 display: none !important;
}
.site-root .section.contact-inner .watch-button.w-inline-block:hover,
.site-root .section.contact-inner .watch-button.w-inline-block:focus-visible {
 border-color: rgba(255, 255, 255, 0.8) !important;
}

/* ── About page: "A Practical Partner for Your Business" — Get Started button icon blue on hover ── */
.site-root .section.future .primary-btn-wrap:hover .primary-icon,
.site-root .section.future .primary-btn-wrap:focus-within .primary-icon,
.site-root .section.future .primary-button:hover .primary-icon,
.site-root .section.future .primary-button:focus-visible .primary-icon {
 filter: brightness(0) saturate(100%) invert(32%) sepia(100%) saturate(4850%) hue-rotate(208deg) brightness(100%) contrast(107%);
}

/* ── About page: "Future-Proof Your Business" section — Get Started button icon blue on hover ── */
.site-root .section.next .primary-btn-wrap:hover .primary-icon,
.site-root .section.next .primary-btn-wrap:focus-within .primary-icon,
.site-root .section.next .primary-button:hover .primary-icon,
.site-root .section.next .primary-button:focus-visible .primary-icon {
 filter: brightness(0) saturate(100%) invert(32%) sepia(100%) saturate(4850%) hue-rotate(208deg) brightness(100%) contrast(107%);
}

/* ── About page: "Meet the Minds" — hide "Explore Positions" button ── */
.site-root .section.team .team-button-wrap {
 display: none !important;
}