/*
Theme Name: Launchit
Theme URI: https://themeshaper.com/launchit/
Author: Automattic
Author URI: https://automattic.com
Description: This theme is designed to showcase a single product, plugin, or digital service. Featuring large typography, plenty of spacing, and an elegant visual rhythm, it’s perfect for landing pages that aim to build confidence and guide visitors toward action. Whether you’re launching a plugin, highlighting a development tool, or simply introducing your latest creation to the world, this theme helps you present it beautifully.
Requires at least: 6.8
Tested up to: 6.8
Requires PHP: 7.2
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: launchit
Tags: blog, block-styles, featured-images, full-site-editing, two-columns, wide-blocks, rtl-language-support, style-variations, threaded-comments, translation-ready

/* Progresive enhancement to reduce widows and orphans.
/* https://github.com/WordPress/gutenberg/issues/55190
*/

h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption {
    text-wrap: pretty;
}
p {
    text-wrap: pretty;
}

/*
 * Control the hover stylings of outline block style.
 * Unnecessary once block styles are configurable via theme.json
 * https://github.com/WordPress/gutenberg/issues/42794
 */
.wp-block-button.is-style-outline>.wp-block-button__link:not(.has-background):hover {
	background-color: var(--wp--preset--color--secondary);
	color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--secondary);
}

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
a {
	text-decoration-thickness: .0625em !important;
	text-underline-offset: .15em;
}

/* ===== Header Fixed reveal after scrolling ===== */

/* Fixed header: hidden off-canvas by default, slides in after .is-on */
.reveal-after-scrolling {
  position: fixed;
  top: 0;            /* will be offset for admin bar below */
  left: 0;
  right: 0;
  transform: translateY(-120%);  /* move out of view */
  opacity: 0;
  visibility: hidden;
  transition: transform .25s ease, opacity .25s ease, visibility 0s linear .25s;
  z-index: 10000;    /* above hero/covers/etc */
}

/* Visible state */
.reveal-after-scrolling.is-on {
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
  transition: transform .25s ease, opacity .25s ease, visibility 0s;
}

/* We don't need sticky on the child when parent is fixed */
.reveal-after-scrolling .stick-top,
.reveal-after-scrolling.stick-top {
  position: static;
  top: auto;
}

/* Default: no offset for logged-out users */
.reveal-after-scrolling { top: 0; }

/* Logged-in: offset for the WP admin bar */
body.admin-bar .reveal-after-scrolling { top: 32px !important; }

/* Mobile: taller admin bar */
@media (max-width: 782px) {
  body.admin-bar .reveal-after-scrolling { top: 0px !important; }
}

/* ===== Techfortis dynamic site ===== */
body:has(.tf-site),
.tf-site {
	background: #0b1120;
	color: #e2e8f0;
	font-family: "Space Grotesk", system-ui, sans-serif;
}

body:has(.tf-site) {
	overflow-x: hidden;
}

body:has(.tf-site)::before {
	background:
		radial-gradient(ellipse at 78% 12%, rgba(0, 240, 255, .18), transparent 34%),
		radial-gradient(ellipse at 12% 38%, rgba(37, 99, 235, .16), transparent 38%),
		radial-gradient(ellipse at 64% 88%, rgba(139, 92, 246, .1), transparent 36%),
		linear-gradient(180deg, #0b1120 0%, #020617 100%);
	content: "";
	inset: 0;
	pointer-events: none;
	position: fixed;
	z-index: -1;
}

.tf-site * {
	box-sizing: border-box;
	letter-spacing: 0;
}

.tf-site {
	font-size: 16px;
	line-height: 1.5;
}

.tf-site a {
	color: inherit;
	text-decoration: none !important;
}

.tf-grid {
	background: transparent;
	background-image: none;
}

@keyframes tf-float {
	0% { transform: translateY(0); }
	50% { transform: translateY(-20px); }
	100% { transform: translateY(0); }
}

@keyframes tf-pulse-glow {
	0%, 100% { opacity: .82; box-shadow: 0 0 10px #00f0ff; }
	50% { opacity: 1; box-shadow: 0 0 25px #00f0ff, 0 0 40px #00f0ff; }
}

@keyframes tf-running-line {
	0% { left: -30%; }
	100% { left: 100%; }
}

@keyframes tf-reveal-up {
	from { opacity: 0; transform: translateY(22px); }
	to { opacity: 1; transform: translateY(0); }
}

@keyframes tf-bounce {
	0%, 100% { transform: translate(-50%, 0); }
	50% { transform: translate(-50%, -14px); }
}

@keyframes tf-slow-pan {
	0% { transform: scale(1.01) translate3d(0, 0, 0); }
	50% { transform: scale(1.05) translate3d(-10px, -8px, 0); }
	100% { transform: scale(1.01) translate3d(0, 0, 0); }
}

@keyframes tf-soft-shift {
	0% { transform: translate3d(-2%, 0, 0); opacity: .42; }
	50% { transform: translate3d(2%, -1%, 0); opacity: .72; }
	100% { transform: translate3d(-2%, 0, 0); opacity: .42; }
}

@keyframes tf-edge-flow {
	0% { transform: translateX(-125%); }
	100% { transform: translateX(125%); }
}

@keyframes tf-visual-rise {
	0% { transform: perspective(900px) rotateX(3deg) rotateY(-6deg) translateY(0); }
	50% { transform: perspective(900px) rotateX(1deg) rotateY(-2deg) translateY(-14px); }
	100% { transform: perspective(900px) rotateX(3deg) rotateY(-6deg) translateY(0); }
}

.tf-site [data-aos] {
	animation: tf-reveal-up .75s ease both;
}

.tf-site [data-aos-delay="100"] { animation-delay: .1s; }
.tf-site [data-aos-delay="200"] { animation-delay: .2s; }
.tf-site [data-aos-delay="300"] { animation-delay: .3s; }
.tf-site [data-aos-delay="400"] { animation-delay: .4s; }

.tf-nav {
	align-items: center;
	backdrop-filter: blur(16px);
	background: rgba(2, 6, 23, .84);
	border-bottom: 1px solid rgba(255,255,255,.1);
	display: flex;
	gap: 32px;
	justify-content: space-between;
	left: 0;
	min-height: 80px;
	padding: 0 48px;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 50;
}

body.admin-bar .tf-nav {
	top: 32px;
}

.tf-brand {
	color: #fff;
	font-size: 24px;
	font-weight: 700;
}

.tf-logo-link {
	align-items: center;
	display: inline-flex;
	min-width: 220px;
}

.tf-logo-link img {
	display: block;
	height: 76px;
	object-fit: contain;
	width: auto;
}

.tf-mobile-toggle {
	align-items: center;
	background: transparent;
	border: 1px solid rgba(0, 240, 255, .42);
	color: #00f0ff;
	cursor: pointer;
	display: none;
	height: 44px;
	justify-content: center;
	width: 44px;
}

.tf-mobile-toggle:hover,
.tf-mobile-toggle:focus-visible {
	background: rgba(0, 240, 255, .1);
	outline: 0;
}

.tf-menu {
	align-items: center;
	display: flex;
	gap: 28px;
}

.tf-menu a,
.tf-menu-group > a {
	color: #94a3b8;
	font-size: 16px;
	font-weight: 600;
}

.tf-menu a:hover,
.tf-menu-group:hover > a,
.tf-menu-group.is-open > a {
	color: #fff;
}

.tf-menu a.is-active {
	border-bottom: 2px solid #00f0ff;
	color: #00f0ff;
	padding-bottom: 4px;
}

.tf-home-link {
	align-items: center;
	display: inline-flex;
	height: 34px;
	justify-content: center;
	width: 34px;
}

.tf-home-link span {
	font-size: 21px;
	line-height: 1;
}

.tf-home-link:hover {
	background: rgba(0, 240, 255, .08);
}

.tf-menu-group {
	position: relative;
}

.tf-dropdown {
	background:
		linear-gradient(135deg, rgba(0, 240, 255, .08), transparent 34%),
		rgba(2, 6, 23, .97);
	border: 1px solid rgba(0, 240, 255, .2);
	box-shadow: 0 28px 80px rgba(0, 0, 0, .44);
	display: grid;
	gap: 22px;
	grid-template-columns: 260px minmax(0, 1fr);
	left: 50%;
	min-width: min(900px, calc(100vw - 64px));
	opacity: 0;
	padding: 20px;
	pointer-events: none;
	position: fixed;
	top: 80px;
	transform: translate(-50%, 6px);
	transition: opacity .2s ease, transform .2s ease;
	z-index: 70;
}

.tf-dropdown::before {
	content: "";
	height: 18px;
	left: 0;
	position: absolute;
	right: 0;
	top: -18px;
}

.tf-menu-group:hover .tf-dropdown,
.tf-menu-group:focus-within .tf-dropdown,
.tf-menu-group.is-open .tf-dropdown {
	opacity: 1;
	pointer-events: auto;
	transform: translate(-50%, 0);
}

.tf-dropdown a {
	border: 0;
	color: #cbd5e1;
	padding: 10px 12px;
	white-space: normal;
}

.tf-dropdown a:hover {
	background: rgba(0, 240, 255, .08);
	color: #fff;
}

.tf-mega-feature {
	background: rgba(15, 23, 42, .74);
	border: 1px solid rgba(255, 255, 255, .08);
	padding: 22px;
}

.tf-mega-feature h3 {
	color: #fff;
	font-size: 22px;
	margin: 12px 0 8px;
}

.tf-mega-feature p {
	color: #94a3b8;
	font-size: 14px;
	line-height: 1.55;
	margin: 0 0 18px;
}

.tf-mega-feature a {
	color: #00f0ff;
	font-size: 13px;
	font-weight: 700;
	padding: 0;
	text-transform: uppercase;
}

.tf-mega-links {
	display: grid;
	gap: 18px;
	grid-template-columns: 1.3fr 1fr;
}

.tf-mega-links > div {
	display: grid;
	gap: 6px;
}

.tf-mega-links p {
	color: #00f0ff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .14em;
	margin: 0 0 8px;
	text-transform: uppercase;
}

.tf-button {
	background: #00f0ff;
	border: 1px solid #00f0ff;
	border-radius: 3px;
	color: #020617;
	display: inline-flex;
	font-size: 16px;
	font-weight: 700;
	gap: 8px;
	justify-content: center;
	padding: 14px 24px;
	transition: box-shadow .2s ease, transform .2s ease, background .2s ease;
}

.tf-button:hover {
	box-shadow: 0 0 22px rgba(0, 240, 255, .38);
	transform: translateY(-1px);
}

.tf-button.secondary {
	background: rgba(0, 240, 255, .08);
	color: #00f0ff;
}

.tf-section {
	margin: 0 auto;
	max-width: 1280px;
	padding: 112px 48px;
}

.tf-section.tight-top {
	padding-top: 96px;
}

.tf-hero {
	align-items: center;
	display: grid;
	min-height: 100vh;
	overflow: hidden;
	place-items: center;
	position: relative;
	text-align: center;
}

.tf-hero-bg {
	inset: 0;
	position: absolute;
}

.tf-hero-bg img {
	animation: tf-float 6s ease-in-out infinite;
	height: 100%;
	object-fit: cover;
	opacity: .4;
	width: 100%;
}

.tf-hero-bg::after {
	background: linear-gradient(to bottom, transparent, rgba(11, 17, 32, .5), #0b1120);
	content: "";
	inset: 0;
	position: absolute;
}

.tf-hero-inner {
	max-width: 980px;
	padding: 120px 24px 80px;
	position: relative;
	z-index: 2;
}

.tf-eyebrow {
	color: #00dbe9;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .1em;
	margin-bottom: 18px;
	text-transform: uppercase;
}

.tf-hero h1,
.tf-page-hero h1 {
	color: #fff;
	font-size: clamp(42px, 6vw, 72px);
	font-weight: 700;
	line-height: 1.1;
	margin: 0 0 24px;
}

.tf-hero h1 span,
.tf-cyan {
	color: #00dbe9;
}

.tf-lead {
	color: #94a3b8;
	font-size: 18px;
	line-height: 1.65;
	margin: 0 auto 36px;
	max-width: 720px;
}

.tf-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	justify-content: center;
}

.tf-scroll-cue {
	animation: tf-bounce 1.2s ease-in-out infinite;
	bottom: 40px;
	color: #00dbe9;
	left: 50%;
	position: absolute;
	z-index: 3;
}

.tf-glass {
	background: linear-gradient(135deg, rgba(15, 23, 42, .84), rgba(15, 23, 42, .46));
	backdrop-filter: blur(18px);
	border: 1px solid rgba(148, 163, 184, .14);
	border-radius: 8px;
}

.tf-aetheric-glow {
	background: radial-gradient(circle at center, rgba(0, 240, 255, .15) 0%, transparent 70%);
	pointer-events: none;
}

.tf-parallax-story {
	position: relative;
}

.tf-parallax-bg {
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 800px;
	position: sticky;
	top: 0;
	z-index: 0;
}

.tf-parallax-bg::after {
	background: rgba(2, 6, 23, .42);
	content: "";
	inset: 0;
	position: absolute;
}

.tf-overlap {
	display: grid;
	gap: 48px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-top: -800px;
	padding-block: 128px;
	position: relative;
	z-index: 2;
}

.tf-spacer-cell {
	min-height: 1px;
}

.tf-right {
	text-align: right;
}

.tf-kicker-row {
	align-items: center;
	color: #00dbe9;
	display: flex;
	font-size: 12px;
	font-weight: 700;
	gap: 14px;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.tf-kicker-row.right {
	justify-content: flex-end;
}

.tf-border-left {
	border-left: 4px solid #00dbe9;
}

.tf-border-right {
	border-right: 4px solid #00f0ff;
}

.tf-gradient-card {
	background: rgba(11, 17, 32, .8);
	border-radius: 12px;
	overflow: hidden;
	position: relative;
	transition: box-shadow .3s ease, transform .3s ease;
}

.tf-gradient-card::before {
	background: linear-gradient(45deg, #0088ff, #00f0ff);
	border-radius: inherit;
	content: "";
	inset: -1px;
	padding: 1px;
	pointer-events: none;
	position: absolute;
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}

.tf-gradient-card:hover,
.tf-lift:hover {
	box-shadow: 0 0 30px rgba(0, 240, 255, .2);
	transform: translateY(-8px);
}

.tf-section-title-bar {
	background: linear-gradient(90deg, #00dbe9, #00f0ff);
	height: 4px;
	margin-top: 10px;
	width: 96px;
}

.tf-split,
.tf-feature {
	display: grid;
	gap: 28px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tf-card {
	padding: 32px;
	position: relative;
	overflow: hidden;
}

.tf-section-heading {
	margin-bottom: 46px;
	max-width: 820px;
}

.tf-section-heading .tf-lead {
	margin-left: 0;
}

.tf-card h2,
.tf-section h2,
.tf-page-section h2 {
	color: #fff;
	font-size: clamp(28px, 3.2vw, 40px);
	line-height: 1.2;
	margin: 0 0 18px;
}

.tf-card h3,
.tf-item h3 {
	color: #fff;
	font-size: 24px;
	margin: 14px 0;
}

.tf-card p,
.tf-item p,
.tf-page-section p {
	color: #94a3b8;
	font-size: 16px;
	line-height: 1.5;
	margin: 0;
}

.tf-icon {
	color: #00f0ff;
	font-size: 38px;
}

.tf-services,
.tf-capability-grid,
.tf-team,
.tf-page-grid {
	display: grid;
	gap: 22px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.tf-page-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tf-capability-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tf-item {
	min-height: 100%;
	padding: 28px;
	position: relative;
	overflow: hidden;
	transition: box-shadow .3s ease, transform .3s ease, border-color .3s ease;
}

.tf-page-grid .tf-item > img,
.tf-capability-grid .tf-item > img {
	aspect-ratio: 16 / 9;
	border: 1px solid rgba(0, 240, 255, .16);
	border-radius: 6px;
	display: block;
	margin-bottom: 20px;
	object-fit: cover;
	width: 100%;
}

.tf-card-link {
	inset: 0;
	position: absolute;
	z-index: 3;
}

.tf-item::before,
.tf-card::before,
.tf-contact-panel::before,
.tf-careers::before {
	background: linear-gradient(90deg, transparent, rgba(0, 240, 255, .5), transparent);
	content: "";
	height: 1px;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	transform: translateX(-115%);
	transition: transform .8s ease;
}

.tf-item:hover::before,
.tf-card:hover::before,
.tf-contact-panel:hover::before,
.tf-careers:hover::before {
	transform: translateX(115%);
}

.tf-item::after {
	background:
		linear-gradient(135deg, rgba(0, 240, 255, .1), transparent 42%),
		radial-gradient(ellipse at top right, rgba(139, 92, 246, .14), transparent 48%);
	border-radius: inherit;
	content: "";
	inset: 0;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	transition: opacity .3s ease;
}

.tf-item:hover::after {
	opacity: 1;
}

.tf-bento {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin-top: 64px;
}

.tf-bento .wide {
	grid-column: span 2;
}

.tf-bento-card {
	display: flex;
	flex-direction: column;
	height: 400px;
	justify-content: space-between;
	padding: 40px;
}

.tf-bento-card h3 {
	font-size: 24px;
	margin: 20px 0 14px;
}

.tf-bento-card p {
	color: #94a3b8;
	line-height: 1.55;
	max-width: 460px;
}

.tf-bento-card.with-image {
	background: #0b1120;
}

.tf-bento-card.with-image img {
	height: 100%;
	inset: 0;
	object-fit: cover;
	opacity: .3;
	position: absolute;
	transition: opacity .5s ease;
	width: 100%;
}

.tf-bento-card.with-image:hover img {
	opacity: .5;
}

.tf-bento-shade {
	background: linear-gradient(90deg, #0b1120, rgba(11, 17, 32, .8), transparent);
	inset: 0;
	position: absolute;
}

.tf-bento-content {
	position: relative;
	z-index: 2;
}

.tf-security-layout {
	align-items: center;
	display: flex;
	gap: 32px;
}

.tf-security-layout > div:first-child {
	flex: 1;
}

.tf-security-visual {
	align-items: center;
	background-color: #1e293b;
	background-image: radial-gradient(circle at center, rgba(0, 240, 255, .18), transparent 70%);
	border-radius: 8px;
	color: rgba(0, 219, 233, .35);
	display: flex;
	font-family: monospace;
	font-size: 12px;
	justify-content: center;
	min-height: 190px;
	width: 50%;
}

.tf-capabilities-grid {
	display: grid;
	gap: 64px;
	grid-template-columns: 4fr 8fr;
	margin: 0 auto;
	max-width: 1280px;
	padding: 112px 48px;
	position: relative;
}

.tf-capability-buttons {
	display: grid;
	gap: 16px;
}

.tf-capability-button {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 8px;
	color: #94a3b8;
	display: flex;
	font: inherit;
	font-weight: 700;
	justify-content: space-between;
	padding: 24px;
	text-align: left;
	transition: background .2s ease, color .2s ease;
	width: 100%;
}

.tf-capability-button:hover {
	background: rgba(255,255,255,.05);
	color: #fff;
}

.tf-capability-button.is-active {
	background: rgba(255,255,255,.03);
	border-left: 4px solid #00f0ff;
	color: #fff;
}

.tf-capability-button .material-symbols-outlined {
	opacity: 0;
	transition: opacity .2s ease, transform .2s ease;
}

.tf-capability-button:hover .material-symbols-outlined,
.tf-capability-button.is-active .material-symbols-outlined {
	opacity: 1;
	transform: translateX(8px);
}

.tf-feature-card {
	background: rgba(15, 23, 42, .92);
	border-radius: 16px;
	display: grid;
	gap: 32px;
	grid-template-columns: 1fr minmax(260px, 42%);
	min-height: 500px;
	overflow: hidden;
	padding: 8px;
}

.tf-feature-copy {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 32px;
}

.tf-feature-top {
	align-items: center;
	display: flex;
	justify-content: space-between;
	margin-bottom: 24px;
}

.tf-chip {
	background: rgba(0, 240, 255, .08);
	border-radius: 999px;
	color: #00f0ff;
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	padding: 6px 16px;
}

.tf-feature-image {
	border: 1px solid rgba(255,255,255,.1);
	border-radius: 8px;
	min-height: 250px;
	overflow: hidden;
	position: relative;
}

.tf-feature-image img {
	height: 100%;
	inset: 0;
	object-fit: cover;
	position: absolute;
	width: 100%;
}

.tf-feature-list {
	display: grid;
	gap: 12px;
	list-style: none;
	margin: 28px 0 0;
	padding: 0;
}

.tf-feature-list li {
	align-items: center;
	color: #fff;
	display: flex;
	font-size: 14px;
	font-weight: 700;
	gap: 12px;
}

.tf-band {
	background: #020617;
	border-block: 1px solid rgba(255,255,255,.06);
}

.tf-capabilities-band {
	background: #020617;
	border-block: 1px solid rgba(255,255,255,.06);
	overflow: hidden;
	position: relative;
}

.tf-capabilities-band .tf-aetheric-glow {
	height: 600px;
	opacity: .3;
	position: absolute;
	right: -250px;
	top: 0;
	width: 600px;
}

.tf-capability-list {
	display: grid;
	gap: 12px;
}

.tf-capability-list div {
	align-items: center;
	border-bottom: 1px solid rgba(255,255,255,.08);
	display: flex;
	font-weight: 700;
	justify-content: space-between;
	padding: 18px 0;
}

.tf-checks {
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin-top: 28px;
}

.tf-checks span {
	background: rgba(0, 240, 255, .08);
	border: 1px solid rgba(0, 240, 255, .2);
	border-radius: 4px;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	padding: 12px;
}

.tf-framework {
	display: flex;
	gap: 48px;
	min-width: max-content;
	position: relative;
}

.tf-framework-wrap {
	overflow-x: auto;
	padding: 36px 0 8px;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.tf-framework-wrap::-webkit-scrollbar {
	display: none;
}

.tf-timeline-line {
	background: rgba(255,255,255,.1);
	border-radius: 999px;
	height: 2px;
	left: 0;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 32px;
	z-index: 0;
}

.tf-timeline-runner {
	animation: tf-running-line 4s linear infinite;
	background: linear-gradient(90deg, transparent, #22d3ee, transparent);
	box-shadow: 0 0 15px #00f0ff;
	height: 100%;
	position: absolute;
	top: 0;
	width: 33%;
}

.tf-step {
	padding: 0;
	position: relative;
	scroll-snap-align: start;
	width: 280px;
	z-index: 2;
}

.tf-step-icon {
	align-items: center;
	background: #0b1120;
	border: 1px solid rgba(255,255,255,.1);
	border-radius: 16px;
	color: rgba(255,255,255,.55);
	display: flex;
	height: 64px;
	justify-content: center;
	margin-bottom: 32px;
	width: 64px;
}

.tf-step:first-of-type .tf-step-icon {
	border-color: #22d3ee;
	box-shadow: 0 0 15px rgba(0,240,255,.3);
	color: #22d3ee;
}

.tf-step h3 {
	font-size: 24px;
	margin: 0 0 16px;
}

.tf-step p {
	color: #94a3b8;
	font-size: 14px;
	line-height: 1.55;
}

.tf-framework-heading {
	margin-bottom: 80px;
	text-align: center;
}

.tf-framework-heading .tf-lead {
	margin-bottom: 0;
}

.tf-number {
	color: #00f0ff;
	font-family: monospace;
	font-weight: 700;
}

.tf-team img,
.tf-page-grid img {
	aspect-ratio: 1;
	border-radius: 6px;
	display: block;
	object-fit: cover;
	width: 100%;
}

.tf-team .tf-item {
	background: transparent;
	border: 0;
	padding-inline: 10px;
	text-align: center;
}

.tf-team .tf-image-frame {
	background: #0f172a;
	border-radius: 16px;
	margin: 0 auto 24px;
	max-width: 192px;
	overflow: hidden;
	padding: 4px;
	transition: box-shadow .3s ease;
}

.tf-team img {
	filter: grayscale(1);
	transition: filter .3s ease;
}

.tf-team .tf-item:hover .tf-image-frame {
	box-shadow: 0 0 25px rgba(0,240,255,.5);
}

.tf-team .tf-item:hover img {
	filter: grayscale(0);
}

.tf-contact {
	align-items: center;
	display: grid;
	gap: 48px;
	grid-template-columns: 1fr 1fr;
}

.tf-insights-careers {
	background:
		linear-gradient(135deg, rgba(0, 240, 255, .055), transparent 38%),
		rgba(2, 6, 23, .42);
	padding-block: 0;
	position: relative;
}

.tf-insights-careers .tf-section {
	display: grid;
	gap: 96px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tf-insight-list {
	display: grid;
	gap: 32px;
}

.tf-insights-careers h2 {
	margin-bottom: 48px;
}

.tf-insight {
	background: linear-gradient(135deg, rgba(15, 23, 42, .72), rgba(15, 23, 42, .36));
	border: 1px solid rgba(148, 163, 184, .12);
	border-radius: 8px;
	cursor: pointer;
	padding: 28px;
	position: relative;
	transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}

.tf-insight:first-child {
	border-top: 1px solid rgba(148, 163, 184, .12);
	padding-top: 28px;
}

.tf-insight:hover {
	border-color: rgba(0, 240, 255, .32);
	box-shadow: 0 0 28px rgba(0, 240, 255, .16);
	transform: translateY(-6px);
}

.tf-insight h3 {
	font-size: 24px;
	line-height: 1.3;
	margin: 0 0 16px;
	transition: color .2s ease;
}

.tf-insight:hover h3 {
	color: #00f0ff;
}

.tf-meta {
	align-items: center;
	color: #94a3b8;
	display: flex;
	font-size: 14px;
	gap: 14px;
}

.tf-careers {
	overflow: hidden;
	padding: 48px;
	position: relative;
}

.tf-careers h2 {
	margin-bottom: 24px;
}

.tf-careers p {
	color: #94a3b8;
	line-height: 1.65;
	position: relative;
}

.tf-careers::after {
	background: rgba(0, 219, 233, .05);
	content: "";
	inset: 0;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	transition: opacity .3s ease;
}

.tf-careers:hover::after {
	opacity: 1;
}

.tf-career-list {
	display: grid;
	gap: 16px;
	margin: 36px 0;
	position: relative;
}

.tf-career-row {
	align-items: center;
	border-bottom: 1px solid rgba(255,255,255,.1);
	display: flex;
	font-weight: 700;
	justify-content: space-between;
	padding-bottom: 16px;
}

.tf-career-row span:last-child {
	color: #00dbe9;
	font-size: 14px;
}

.tf-contact-panel {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	overflow: hidden;
	position: relative;
}

.tf-contact-panel > .tf-button {
	align-self: center;
	justify-self: center;
}

.tf-contact-copy,
.tf-contact-form {
	padding: 64px;
}

.tf-contact-info {
	display: grid;
	gap: 24px;
	margin-top: 48px;
}

.tf-contact-row {
	align-items: center;
	display: flex;
	gap: 24px;
}

.tf-contact-row strong {
	display: block;
}

.tf-contact-icon {
	align-items: center;
	background: #1e293b;
	border-radius: 8px;
	color: #00f0ff;
	display: flex;
	height: 48px;
	justify-content: center;
	width: 48px;
}

.tf-contact-form {
	background: #1e293b;
}

.tf-form input,
.tf-form textarea {
	background: transparent;
	border: 0;
	border-bottom: 1px solid #00f0ff;
	color: #fff;
	margin-bottom: 18px;
	padding: 14px 0;
	width: 100%;
}

.tf-form input[type="file"] {
	background: rgba(15, 23, 42, .62);
	border: 1px solid rgba(0, 240, 255, .24);
	border-radius: 6px;
	padding: 12px;
}

.tf-form label {
	color: #94a3b8;
	display: block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.tf-form button {
	width: 100%;
}

.tf-article {
	margin-inline: auto;
	max-width: 920px;
	padding: 42px;
}

.tf-article-meta {
	color: #00f0ff;
	display: flex;
	flex-wrap: wrap;
	font-size: 12px;
	font-weight: 700;
	gap: 12px;
	letter-spacing: .1em;
	margin-bottom: 26px;
	text-transform: uppercase;
}

.tf-article-meta span + span::before {
	color: #475569;
	content: "/";
	margin-right: 12px;
}

.tf-article-image {
	border: 1px solid rgba(0, 240, 255, .18);
	border-radius: 10px;
	margin-bottom: 32px;
	overflow: hidden;
}

.tf-article-image img {
	display: block;
	height: auto;
	width: 100%;
}

.tf-entry-content {
	color: #cbd5e1;
	font-size: 17px;
	line-height: 1.75;
}

.tf-entry-content > * + * {
	margin-top: 18px;
}

.tf-entry-content h2,
.tf-entry-content h3,
.tf-entry-content h4 {
	color: #fff;
	line-height: 1.25;
	margin-top: 34px;
}

.tf-entry-content h2 {
	font-size: clamp(28px, 3vw, 38px);
}

.tf-entry-content h3 {
	font-size: 24px;
}

.tf-entry-content a {
	color: #00f0ff;
	font-weight: 700;
}

.tf-entry-content ul,
.tf-entry-content ol {
	padding-left: 24px;
}

.tf-entry-content li + li {
	margin-top: 8px;
}

.tf-entry-content img {
	border: 1px solid rgba(0, 240, 255, .18);
	border-radius: 10px;
	height: auto;
	max-width: 100%;
}

.tf-job-detail-grid {
	align-items: start;
	display: grid;
	gap: 28px;
	grid-template-columns: minmax(0, 1.45fr) minmax(320px, .75fr);
}

.tf-job-detail,
.tf-application-panel {
	padding: 34px;
}

.tf-job-detail h3 {
	color: #fff;
	font-size: 22px;
	margin: 32px 0 12px;
}

.tf-job-content {
	color: #cbd5e1;
}

.tf-job-content p {
	margin-bottom: 14px;
}

.tf-job-meta-grid {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin: 24px 0 30px;
}

.tf-job-meta-grid div {
	background: rgba(0, 240, 255, .07);
	border: 1px solid rgba(0, 240, 255, .16);
	border-radius: 6px;
	padding: 16px;
}

.tf-job-meta-grid span {
	color: #94a3b8;
	display: block;
	font-size: 12px;
	font-weight: 700;
	margin-bottom: 8px;
	text-transform: uppercase;
}

.tf-job-meta-grid strong {
	color: #fff;
	font-size: 16px;
}

.tf-form-message {
	background: rgba(34, 197, 94, .12);
	border: 1px solid rgba(34, 197, 94, .3);
	border-radius: 6px;
	color: #bbf7d0;
	margin-bottom: 22px;
	padding: 14px;
}

.tf-form-message.is-error {
	background: rgba(239, 68, 68, .12);
	border-color: rgba(239, 68, 68, .32);
	color: #fecaca;
}

.tf-footer {
	background: #020617;
	border-top: 1px solid rgba(255,255,255,.08);
	color: #94a3b8;
	padding: 36px 48px;
}

.tf-footer-inner {
	align-items: center;
	display: flex;
	justify-content: space-between;
	margin: 0 auto;
	max-width: 1280px;
}

.tf-footer-links {
	display: flex;
	flex-wrap: wrap;
	gap: 28px;
	justify-content: flex-end;
}

.tf-footer-links a:hover {
	color: #00f0ff;
}

.tf-footer-logo {
	display: block;
	height: 128px;
	margin-bottom: 14px;
	object-fit: contain;
	width: auto;
}

.tf-page-hero {
	margin: 0 auto;
	max-width: 1280px;
	min-height: 690px;
	padding: 154px 48px 84px;
	position: relative;
}

.tf-page-hero::before {
	animation: tf-soft-shift 9s ease-in-out infinite;
	background:
		linear-gradient(135deg, rgba(0, 240, 255, .11), transparent 42%),
		radial-gradient(ellipse at center, rgba(0, 240, 255, .24) 0%, transparent 68%);
	content: "";
	height: 620px;
	opacity: .62;
	pointer-events: none;
	position: absolute;
	right: -280px;
	top: 70px;
	width: 760px;
}

.tf-page-hero::after {
	background: linear-gradient(180deg, transparent, rgba(2, 6, 23, .92));
	bottom: -1px;
	content: "";
	height: 180px;
	left: 0;
	pointer-events: none;
	position: absolute;
	right: 0;
}

.tf-page-hero-inner {
	align-items: center;
	display: grid;
	gap: 64px;
	grid-template-columns: minmax(0, .88fr) minmax(420px, 52%);
	position: relative;
	z-index: 2;
}

.tf-page-hero-copy .tf-lead {
	margin-left: 0;
	max-width: 672px;
}

.tf-hero-metrics {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 30px;
}

.tf-hero-metrics span {
	background: rgba(0, 240, 255, .08);
	border: 1px solid rgba(0, 240, 255, .22);
	border-radius: 999px;
	color: #e2e8f0;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .04em;
	padding: 11px 15px;
	text-transform: uppercase;
}

.tf-page-visual {
	aspect-ratio: 16 / 10;
	box-shadow: 0 28px 90px rgba(0, 0, 0, .4), 0 0 42px rgba(0, 240, 255, .16);
	overflow: hidden;
	padding: 0;
	position: relative;
	transform-origin: center;
}

.tf-page-visual::before {
	background:
		linear-gradient(135deg, rgba(255, 255, 255, .08), transparent 34%),
		linear-gradient(45deg, rgba(0, 240, 255, .18), rgba(139, 92, 246, .08));
	content: "";
	inset: 0;
	opacity: .52;
	pointer-events: none;
	position: absolute;
	z-index: 2;
}

.tf-page-visual::after {
	background: linear-gradient(45deg, #0088ff, #00f0ff, #8b5cf6);
	border-radius: inherit;
	content: "";
	inset: -1px;
	padding: 1px;
	pointer-events: none;
	position: absolute;
	z-index: 4;
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}

.tf-page-visual img {
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.tf-scan-line {
	display: none;
}

.tf-page-shell {
	min-height: 100vh;
	padding-top: 0;
}

.tf-page-section {
	margin: 0 auto;
	max-width: 1280px;
	padding: 54px 48px 118px;
	position: relative;
}

.tf-editable-content {
	color: #cbd5e1;
	padding-top: 0;
}

.tf-editable-content > * {
	max-width: 880px;
}

.tf-editable-content h2,
.tf-editable-content h3,
.tf-editable-content h4 {
	color: #fff;
	margin: 28px 0 12px;
}

.tf-editable-content p,
.tf-editable-content li {
	color: #cbd5e1;
	font-size: 16px;
	line-height: 1.65;
}

.tf-editable-content a {
	color: #00f0ff;
}

.tf-feature-section {
	position: relative;
}

.tf-feature-section::before {
	background: radial-gradient(circle at center, rgba(0, 240, 255, .12), transparent 68%);
	content: "";
	height: 520px;
	left: -260px;
	opacity: .5;
	pointer-events: none;
	position: absolute;
	top: 100px;
	width: 620px;
}

@media (max-width: 960px) {
	.tf-nav {
		gap: 14px;
		padding: 0 20px;
	}

	.tf-logo-link {
		min-width: 0;
	}

	.tf-logo-link img {
		height: 56px;
	}

	.tf-mobile-toggle {
		display: inline-flex;
	}

	.tf-nav > .tf-button {
		display: none;
	}

	.tf-menu {
		align-items: stretch;
		background: rgba(2, 6, 23, .98);
		border: 1px solid rgba(0, 240, 255, .18);
		box-shadow: 0 24px 70px rgba(0, 0, 0, .42);
		display: none;
		flex-direction: column;
		gap: 2px;
		left: 16px;
		max-height: calc(100vh - 104px);
		overflow-y: auto;
		padding: 14px;
		position: fixed;
		right: 16px;
		top: 88px;
	}

	body.admin-bar .tf-menu {
		top: 134px;
	}

	.tf-nav.is-mobile-open .tf-menu {
		display: flex;
	}

	.tf-menu a,
	.tf-menu-group > a {
		display: flex;
		font-size: 16px;
		padding: 12px;
		width: 100%;
	}

	.tf-menu a.is-active {
		background: rgba(0, 240, 255, .1);
		border-bottom: 0;
		padding-bottom: 12px;
	}

	.tf-home-link {
		height: auto;
		justify-content: flex-start;
		width: 100%;
	}

	.tf-menu-group {
		display: block;
	}

	.tf-dropdown {
		display: none;
		grid-template-columns: 1fr;
		left: auto;
		margin-top: 4px;
		min-width: 0;
		opacity: 1;
		padding: 14px;
		pointer-events: auto;
		position: static;
		top: auto;
		transform: none;
		width: 100%;
	}

	.tf-menu-group:hover .tf-dropdown,
	.tf-menu-group:focus-within .tf-dropdown,
	.tf-menu-group.is-open .tf-dropdown {
		display: grid;
		transform: none;
	}

	.tf-mega-links {
		grid-template-columns: 1fr;
	}

	.tf-section,
	.tf-page-hero,
	.tf-page-section {
		padding-inline: 20px;
	}

	.tf-split,
	.tf-feature,
	.tf-overlap,
	.tf-capabilities-grid,
	.tf-feature-card,
	.tf-contact,
	.tf-bento,
	.tf-insights-careers .tf-section,
		.tf-contact-panel,
		.tf-job-detail-grid,
		.tf-job-meta-grid,
		.tf-page-hero-inner,
	.tf-services,
	.tf-capability-grid,
	.tf-team,
	.tf-page-grid,
	.tf-checks {
		grid-template-columns: 1fr;
	}

	.tf-page-hero {
		padding-top: 130px;
	}

	.tf-page-hero::before {
		right: -360px;
	}

	.tf-spacer-cell {
		display: none;
	}

	.tf-bento .wide {
		grid-column: auto;
	}

	.tf-bento-card {
		height: auto;
	}

	.tf-security-layout {
		align-items: stretch;
		flex-direction: column;
	}

	.tf-security-visual {
		width: 100%;
	}

	.tf-capabilities-grid {
		padding-inline: 20px;
	}

	.tf-feature-card {
		min-height: 0;
	}

	.tf-feature-image img {
		position: static;
	}

	.tf-contact-copy,
	.tf-contact-form,
	.tf-careers {
		padding: 32px;
	}

	.tf-footer-links {
		justify-content: flex-start;
	}

	.tf-footer-inner {
		align-items: flex-start;
		flex-direction: column;
		gap: 12px;
	}

	.tf-logo-link {
		min-width: 160px;
	}

	.tf-logo-link img {
		height: 58px;
	}

	.tf-footer-logo {
		height: 108px;
	}
}

/* Editor-only: always show the fixed header while editing */
.editor-styles-wrapper .reveal-after-scrolling {
  position: static !important;
  top: auto !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Remove extra space around images */
.wp-block-image img {
  display: block;
}

/* Thin link underlines */
.wp-site-blocks a:where(:not(.wp-element-button)) {
    text-decoration-thickness: max(0.010em, 0.005em);
    text-underline-offset: max(0.1em, 0.08em);
}

/* Desktop-only sticky column */
@media (min-width: 1024px) {
  .sticky-col {
    position: sticky;
    top: 0;
    align-self: flex-start; /* prevents full-height columns from stretching it */
    z-index: 5; /* above backgrounds */
  }

  /* If you’re logged in, offset for the admin bar so it isn’t covered */
  body.admin-bar .sticky-col { top: 32px; }
  @media (max-width: 782px) {
    body.admin-bar .sticky-col { top: 46px; }
  }
}

/* Let the overlay use the viewport, not the transformed header */
.reveal-after-scrolling:has(.wp-block-navigation__responsive-container.is-menu-open) {
  transform: none !important; /* key fix: removes the containing block */
}

/* Make the mobile overlay a true fullscreen layer */
.wp-block-navigation__responsive-container.is-menu-open {
  position: fixed !important;
  inset: 0 !important;                 /* top/right/bottom/left: 0 */
  height: auto !important;
  max-height: none !important;
  z-index: 10003;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding-top: var(--admin-offset, 0);
  padding-bottom: env(safe-area-inset-bottom);
}

/* Keep header interaction sane */
.reveal-after-scrolling { pointer-events: none; }
.reveal-after-scrolling.is-on { pointer-events: auto; }

/* Admin bar offset for the overlay */
@media (max-width: 782px) {
  body.admin-bar .wp-block-navigation__responsive-container.is-menu-open { padding-top: 46px; }
}
@media (min-width: 783px) {
  body.admin-bar .wp-block-navigation__responsive-container.is-menu-open { padding-top: 32px; }
}

/* Buttons stay above overlay content */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
  position: relative;
  z-index: 10004;
}
