
:root {
	--khe-bg: #f3f0e8;
	--khe-paper: #fffdf8;
	--khe-text: #151515;
	--khe-muted: #6d6a62;
	--khe-accent: #ff5c35;
	--khe-lime: #d8ff5f;
	--khe-blue: #8ec5ff;
	--khe-border: rgba(21, 21, 21, .18);
	--khe-shell: min(1440px, calc(100vw - 48px));
}

body.khe-homepage {
	background: var(--khe-bg);
	color: var(--khe-text);
	overflow-x: hidden;
}

.khe-main *,
.khe-main *::before,
.khe-main *::after {
	box-sizing: border-box;
}

.khe-shell {
	width: var(--khe-shell);
	margin-inline: auto;
}

.khe-section {
	padding: clamp(90px, 11vw, 180px) 0;
}

.khe-kicker {
	margin: 0;
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.khe-index {
	margin: 0;
	color: var(--khe-muted);
	font-size: .84rem;
}

.khe-cursor-orb {
	position: fixed;
	z-index: 999;
	left: 0;
	top: 0;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--khe-accent);
	pointer-events: none;
	mix-blend-mode: multiply;
	transform: translate(-50%, -50%);
	transition: width .2s ease, height .2s ease, opacity .2s ease;
	opacity: 0;
}

.khe-cursor-orb.is-visible {
	opacity: .85;
}

.khe-cursor-orb.is-active {
	width: 54px;
	height: 54px;
}

.khe-hero {
	position: relative;
	min-height: calc(100svh - 40px);
	display: flex;
	align-items: stretch;
	padding: 30px 0 20px;
	overflow: hidden;
	border-bottom: 1px solid var(--khe-border);
}

.khe-grid-bg {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(var(--khe-border) 1px, transparent 1px),
		linear-gradient(90deg, var(--khe-border) 1px, transparent 1px);
	background-size: 80px 80px;
	mask-image: linear-gradient(to bottom, black, transparent 92%);
	opacity: .45;
}

.khe-hero-inner {
	position: relative;
	display: grid;
	grid-template-rows: auto 1fr auto;
}

.khe-hero-topline {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.khe-hero-title {
	align-self: center;
	margin: 80px 0 70px;
	font-size: clamp(4.2rem, 10.5vw, 11rem);
	line-height: .84;
	letter-spacing: -.08em;
	font-weight: 800;
	text-transform: uppercase;
}

.khe-line {
	display: block;
	overflow: hidden;
}

.khe-line > span {
	display: block;
	transform: translateY(115%);
	animation: khe-line-in .9s cubic-bezier(.16, 1, .3, 1) forwards;
}

.khe-line:nth-child(2) > span { animation-delay: .12s; }
.khe-line:nth-child(3) > span { animation-delay: .24s; }

.khe-line--accent {
	color: var(--khe-accent);
}

@keyframes khe-line-in {
	to { transform: translateY(0); }
}

.khe-hero-bottom {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	align-items: end;
	gap: 48px;
}

.khe-hero-bottom > p {
	max-width: 820px;
	margin: 0;
	font-size: clamp(1.25rem, 2.2vw, 2.2rem);
	line-height: 1.25;
	letter-spacing: -.025em;
}

.khe-hero-actions {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	flex-wrap: wrap;
	gap: 24px;
}

.khe-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 54px;
	padding: 14px 22px;
	border: 1px solid var(--khe-text);
	text-decoration: none;
	font-weight: 800;
	transition: transform .2s ease, box-shadow .2s ease;
}

.khe-button:hover {
	transform: translate(-4px, -4px);
	box-shadow: 7px 7px 0 var(--khe-accent);
}

.khe-button--dark {
	background: var(--khe-text);
	color: white;
}

.khe-text-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: inherit;
	font-weight: 800;
	text-decoration: none;
	border-bottom: 2px solid currentColor;
}

.khe-floating-tags {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.khe-tag {
	position: absolute;
	display: inline-flex;
	align-items: center;
	padding: 10px 16px;
	border: 1px solid var(--khe-text);
	background: var(--khe-paper);
	font-size: .8rem;
	font-weight: 800;
	transform: rotate(var(--r));
	box-shadow: 5px 5px 0 rgba(21,21,21,.12);
	animation: khe-float 4.5s ease-in-out infinite;
}

.khe-tag--one { right: 7%; top: 24%; --r: 7deg; }
.khe-tag--two { left: 4%; top: 46%; --r: -8deg; animation-delay: -.8s; background: var(--khe-lime); }
.khe-tag--three { right: 18%; bottom: 22%; --r: -4deg; animation-delay: -1.6s; background: var(--khe-blue); }
.khe-tag--four { left: 35%; top: 16%; --r: 3deg; animation-delay: -2.1s; }

@keyframes khe-float {
	0%, 100% { translate: 0 0; }
	50% { translate: 0 -12px; }
}

.khe-marquee {
	overflow: hidden;
	padding: 16px 0;
	background: rgba(255, 255, 255, 0.98);
	color: var(--khe-text);
	border-top: 1px solid rgba(18, 27, 50, 0.08);
	border-bottom: 1px solid rgba(18, 27, 50, 0.08);
	box-shadow: 0 12px 36px rgba(18, 27, 50, 0.04);
	position: relative;
	z-index: 2;
}

.khe-marquee-track {
	display: flex;
	align-items: center;
	gap: 26px;
	width: max-content;
	font-size: 1rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .08em;
	animation: khe-marquee 24s linear infinite;
	padding-inline: 14px;
}

.khe-marquee-track span {
	color: #101626;
	white-space: nowrap;
}

.khe-marquee-track i,
.khe-marquee-planet {
	position: relative;
	flex: 0 0 auto;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	font-style: normal;
	background: radial-gradient(circle at 30% 28%, #ffffff 0 18%, #d6e6ff 19%, #78a9ff 54%, #2f5fbd 100%);
	box-shadow: inset -2px -3px 6px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(33, 58, 110, 0.16);
	transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
	cursor: pointer;
}

.khe-marquee-track i::after,
.khe-marquee-planet::after {
	content: "";
	position: absolute;
	inset: -5px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(116, 170, 255, 0.35) 0%, rgba(116, 170, 255, 0.10) 45%, rgba(116, 170, 255, 0) 75%);
	opacity: 0;
	transform: scale(.8);
	transition: opacity .25s ease, transform .25s ease;
	pointer-events: none;
}

.khe-marquee-track i:nth-of-type(5n + 1) {
	background: radial-gradient(circle at 30% 28%, #fff 0 18%, #d8e7ff 19%, #78a9ff 54%, #315ec0 100%);
}

.khe-marquee-track i:nth-of-type(5n + 2) {
	background: radial-gradient(circle at 34% 30%, #fff 0 18%, #ffe8c8 19%, #ffbe68 54%, #d78322 100%);
}

.khe-marquee-track i:nth-of-type(5n + 3) {
	background: radial-gradient(circle at 32% 28%, #fff 0 18%, #def6db 19%, #8ddb8f 54%, #3d9b55 100%);
}

.khe-marquee-track i:nth-of-type(5n + 4) {
	background: radial-gradient(circle at 34% 30%, #fff 0 18%, #f0def7 19%, #d298f0 54%, #8e4db8 100%);
}

.khe-marquee-track i:nth-of-type(5n + 5) {
	background: radial-gradient(circle at 34% 30%, #fff 0 18%, #f8d9d9 19%, #f39a9a 54%, #c75454 100%);
}

.khe-marquee-track i:hover,
.khe-marquee-track i:focus-visible {
	transform: scale(1.22);
	box-shadow: inset -2px -3px 6px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(33, 58, 110, 0.16), 0 0 18px rgba(120, 169, 255, 0.45), 0 0 32px rgba(120, 169, 255, 0.22);
	filter: saturate(1.1) brightness(1.08);
}

.khe-marquee-track i:hover::after,
.khe-marquee-track i:focus-visible::after {
	opacity: 1;
	transform: scale(1.12);
}

@keyframes khe-marquee {
	to { transform: translateX(-50%); }
}

.khe-two-col {
	display: grid;
	grid-template-columns: 1fr 3fr;
	gap: 60px;
}

.khe-big-copy {
	max-width: 1050px;
	margin: 0;
	font-size: clamp(3rem, 7vw, 7rem);
	line-height: .94;
	letter-spacing: -.06em;
}

.khe-body-copy {
	max-width: 760px;
	margin: 42px 0 0 auto;
	color: var(--khe-muted);
	font-size: clamp(1.1rem, 1.8vw, 1.6rem);
	line-height: 1.55;
}

.khe-section-head {
	display: flex;
	justify-content: space-between;
	align-items: end;
	gap: 30px;
	margin-bottom: 56px;
}

.khe-section-head h2 {
	max-width: 900px;
	margin: 14px 0 0;
	font-size: clamp(3rem, 6vw, 6rem);
	line-height: .95;
	letter-spacing: -.055em;
}

.khe-service-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.khe-service-card {
	min-height: 380px;
	display: flex;
	flex-direction: column;
	padding: clamp(28px, 4vw, 54px);
	border: 1px solid var(--khe-text);
	background: var(--khe-paper);
	transform-style: preserve-3d;
	transition: transform .15s ease;
}

.khe-service-card--accent { background: var(--khe-lime); }
.khe-service-card--dark { background: var(--khe-text); color: white; }

.khe-service-card > span {
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .1em;
}

.khe-service-card h3 {
	margin: auto 0 20px;
	font-size: clamp(2.6rem, 5vw, 5.2rem);
	line-height: .9;
	letter-spacing: -.055em;
}

.khe-service-card p {
	max-width: 520px;
	margin: 0;
	font-size: 1.08rem;
	line-height: 1.5;
}

.khe-service-card em {
	margin-top: 28px;
	font-style: normal;
	font-size: .8rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .1em;
}

.khe-projects {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 50px 24px;
}

.khe-project {
	grid-column: span 6;
}

.khe-project:nth-child(4n+1) {
	grid-column: span 7;
}

.khe-project:nth-child(4n+2) {
	grid-column: span 5;
	margin-top: 120px;
}

.khe-project:nth-child(4n+3) {
	grid-column: span 5;
}

.khe-project:nth-child(4n+4) {
	grid-column: span 7;
	margin-top: 90px;
}

.khe-project a {
	color: inherit;
	text-decoration: none;
}

.khe-project-image {
	position: relative;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: var(--project-accent);
}

.khe-project-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .7s cubic-bezier(.16,1,.3,1), filter .4s ease;
}

.khe-project:hover img {
	transform: scale(1.06) rotate(.5deg);
	filter: saturate(1.08);
}

.khe-project-fallback {
	width: 100%;
	height: 100%;
	background:
		linear-gradient(135deg, rgba(255,255,255,.25), transparent 60%),
		var(--project-accent);
}

.khe-project-number {
	position: absolute;
	right: 18px;
	top: 18px;
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: var(--khe-paper);
	font-weight: 900;
}

.khe-project-copy {
	padding-top: 20px;
}

.khe-project-meta {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	color: var(--khe-muted);
	font-size: .76rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .1em;
}

.khe-project h3 {
	margin: 14px 0 0;
	font-size: clamp(2rem, 4vw, 4.2rem);
	line-height: .95;
	letter-spacing: -.05em;
}

.khe-project p {
	max-width: 650px;
	color: var(--khe-muted);
	font-size: 1rem;
	line-height: 1.55;
}

.khe-process-list {
	border-top: 1px solid var(--khe-border);
}

.khe-process-row {
	display: grid;
	grid-template-columns: 90px 1.3fr 1fr;
	align-items: center;
	gap: 24px;
	padding: 24px 0;
	border-bottom: 1px solid var(--khe-border);
	transition: padding-left .25s ease, background .25s ease;
}

.khe-process-row:hover {
	padding-left: 18px;
	background: var(--khe-paper);
}

.khe-process-row span {
	font-size: .78rem;
	font-weight: 800;
}

.khe-process-row strong {
	font-size: clamp(2.4rem, 5vw, 5rem);
	line-height: 1;
	letter-spacing: -.045em;
}

.khe-process-row em {
	font-style: normal;
	color: var(--khe-muted);
	text-align: right;
}

.khe-impact {
	background: var(--khe-text);
	color: white;
}

.khe-impact-grid {
	display: grid;
	grid-template-columns: 1.5fr repeat(3, 1fr);
	gap: 28px;
	align-items: end;
}

.khe-impact-intro h2 {
	margin: 18px 0 0;
	font-size: clamp(3rem, 6vw, 6rem);
	line-height: .95;
	letter-spacing: -.055em;
}

.khe-metric {
	border-left: 1px solid rgba(255,255,255,.25);
	padding-left: 24px;
}

.khe-metric strong,
.khe-metric span {
	font-size: clamp(4rem, 7vw, 7rem);
	line-height: 1;
	letter-spacing: -.06em;
}

.khe-metric span {
	color: var(--khe-accent);
}

.khe-metric p {
	max-width: 180px;
	margin: 16px 0 0;
	color: rgba(255,255,255,.68);
	font-size: .95rem;
	line-height: 1.4;
}

.khe-metric-note {
	margin: 50px 0 0;
	color: rgba(255,255,255,.45);
	font-size: .75rem;
}

.khe-human-card {
	padding: clamp(36px, 7vw, 90px);
	border: 1px solid var(--khe-text);
	background: var(--khe-blue);
	box-shadow: 18px 18px 0 var(--khe-accent);
}

.khe-human-card h2 {
	max-width: 1100px;
	margin: 26px 0;
	font-size: clamp(3.2rem, 7vw, 7rem);
	line-height: .92;
	letter-spacing: -.06em;
}

.khe-human-card > p:not(.khe-kicker) {
	max-width: 760px;
	font-size: 1.2rem;
	line-height: 1.55;
}

.khe-contact {
	padding-bottom: 110px;
}

.khe-contact h2 {
	max-width: 1200px;
	margin: 26px 0 60px;
	font-size: clamp(4rem, 9vw, 9rem);
	line-height: .88;
	letter-spacing: -.07em;
}

.khe-contact-link {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 26px 0;
	border-top: 2px solid var(--khe-text);
	border-bottom: 2px solid var(--khe-text);
	color: inherit;
	font-size: clamp(2rem, 5vw, 5rem);
	font-weight: 900;
	text-decoration: none;
	transition: padding-inline .25s ease, background .25s ease;
}

.khe-contact-link:hover {
	padding-inline: 18px;
	background: var(--khe-lime);
}

.khe-reveal {
	opacity: 0;
	transform: translateY(34px);
	transition: opacity .8s ease, transform .8s cubic-bezier(.16,1,.3,1);
}

.khe-reveal.is-visible {
	opacity: 1;
	transform: none;
}

@media (max-width: 1000px) {
	:root { --khe-shell: min(100% - 32px, 1440px); }

	.khe-hero-bottom,
	.khe-two-col,
	.khe-impact-grid {
		grid-template-columns: 1fr;
	}

	.khe-hero-actions {
		justify-content: flex-start;
	}

	.khe-floating-tags {
		opacity: .55;
	}

	.khe-project,
	.khe-project:nth-child(n) {
		grid-column: span 12;
		margin-top: 0;
	}

	.khe-impact-grid {
		gap: 50px;
	}

	.khe-metric {
		border-left: 0;
		border-top: 1px solid rgba(255,255,255,.25);
		padding: 24px 0 0;
	}
}

@media (max-width: 720px) {
	.khe-cursor-orb { display: none; }

	.khe-hero-topline span:last-child {
		display: none;
	}

	.khe-hero-title {
		margin-top: 120px;
		font-size: clamp(3.5rem, 17vw, 6.5rem);
	}

	.khe-service-grid {
		grid-template-columns: 1fr;
	}

	.khe-section-head {
		align-items: flex-start;
		flex-direction: column;
	}

	.khe-process-row {
		grid-template-columns: 48px 1fr;
	}

	.khe-process-row em {
		grid-column: 2;
		text-align: left;
	}

	.khe-tag--three,
	.khe-tag--four {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.khe-line > span,
	.khe-marquee-track,
	.khe-tag {
		animation: none;
		transform: none;
	}

	.khe-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}
}


/* v0.2 — contrast and readability corrections */
.khe-service-card--dark,
.khe-service-card--dark h3,
.khe-service-card--dark p,
.khe-service-card--dark em,
.khe-service-card--dark > span {
	color: #ffffff !important;
}

.khe-service-card--dark p {
	color: rgba(255, 255, 255, .82) !important;
}

.khe-impact,
.khe-impact h2,
.khe-impact .khe-kicker,
.khe-impact-intro h2 {
	color: #ffffff !important;
}

.khe-impact-intro h2 {
	max-width: 780px;
}

.khe-impact .khe-metric p {
	color: rgba(255, 255, 255, .76) !important;
}

.khe-impact .khe-metric-note {
	color: rgba(255, 255, 255, .58) !important;
}

.khe-impact .khe-metric strong {
	color: #ffffff !important;
}

.khe-impact .khe-metric span {
	color: var(--khe-accent) !important;
}

/* Keep headings readable even when Blocksy applies global heading colors. */
.khe-main h1,
.khe-main h2,
.khe-main h3 {
	color: inherit;
}

.khe-service-card:not(.khe-service-card--dark) h3,
.khe-project h3,
.khe-human-card h2,
.khe-contact h2,
.khe-big-copy,
.khe-section-head h2 {
	color: var(--khe-text) !important;
}



/* v0.4 — aligned intro layout + solar-system interaction */
body.khe-homepage header [data-id="logo"],
body.khe-homepage header .site-branding,
body.khe-homepage header .site-title-container{display:none!important}
body.khe-homepage header .ct-container,
body.khe-homepage header .ct-container-fluid{justify-content:flex-end}
body.khe-homepage header#header{border-bottom:1px solid var(--khe-border);background:rgba(255,255,255,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
body.khe-homepage header#header nav a{letter-spacing:.06em;text-transform:uppercase;font-size:.82rem;font-weight:800}

.khe-intro .khe-two-col{align-items:start;grid-template-columns:minmax(360px,.9fr) minmax(0,2.1fr);gap:clamp(48px,6vw,110px)}
.khe-intro-aside,.khe-intro .khe-two-col>div:last-child{align-self:start}
.khe-intro-aside{min-height:0}
.khe-intro .khe-big-copy{margin-top:0}

.khe-interactive-field{position:relative;height:520px;margin-top:34px;overflow:hidden;border:1px solid rgba(255,255,255,.18);background:radial-gradient(circle at 50% 50%,rgba(37,54,92,.35),transparent 42%),linear-gradient(180deg,#07111f 0%,#02060c 100%);cursor:crosshair;isolation:isolate;box-shadow:inset 0 0 80px rgba(0,0,0,.5)}
.khe-stars{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.95) 0 1px,transparent 1.5px),radial-gradient(circle,rgba(255,255,255,.55) 0 1px,transparent 1.5px),radial-gradient(circle,rgba(149,197,255,.65) 0 1px,transparent 1.5px);background-size:70px 70px,110px 110px,160px 160px;background-position:12px 20px,40px 10px,20px 60px;opacity:.75;animation:khe-stars-drift 30s linear infinite}
.khe-sun{position:absolute;left:50%;top:50%;z-index:6;display:grid;place-items:center;width:118px;height:118px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff7b0 0 8%,#ffd45c 20%,#ff8c2a 56%,#ff4f1f 100%);box-shadow:0 0 28px rgba(255,173,66,.95),0 0 65px rgba(255,112,32,.6),0 0 110px rgba(255,82,28,.35);color:#311300;transform:translate(-50%,-50%);transition:transform .18s ease-out;will-change:transform}
.khe-sun:after{content:"";position:absolute;inset:-18px;border-radius:inherit;border:1px solid rgba(255,200,100,.35);animation:khe-sun-pulse 2.8s ease-in-out infinite}
.khe-sun span{font-size:.78rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase}

.khe-orbit{position:absolute;left:50%;top:50%;border:1px solid rgba(255,255,255,.18);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}
.khe-orbit--mercury{width:190px;height:190px;animation:khe-orbit-spin 7s linear infinite}
.khe-orbit--earth{width:290px;height:290px;animation:khe-orbit-spin 12s linear infinite}
.khe-orbit--mars{width:390px;height:390px;animation:khe-orbit-spin 17s linear infinite reverse}
.khe-orbit--saturn{width:500px;height:500px;animation:khe-orbit-spin 24s linear infinite}

.khe-planet{position:absolute;top:50%;left:100%;border-radius:50%;transform:translate(-50%,-50%);box-shadow:inset -8px -10px 18px rgba(0,0,0,.38),0 0 14px rgba(255,255,255,.12)}
.khe-planet span{position:absolute;left:50%;top:calc(100% + 12px);transform:translateX(-50%);padding:5px 8px;border-radius:999px;background:rgba(2,6,12,.78);color:#fff;font-size:.58rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;backdrop-filter:blur(6px)}
.khe-planet--mercury{width:20px;height:20px;background:radial-gradient(circle at 35% 30%,#d7d0c7 0 18%,#8e887f 55%,#4a4642 100%)}
.khe-planet--earth{width:42px;height:42px;background:radial-gradient(circle at 35% 35%,#a8e8ff 0 18%,transparent 19%),radial-gradient(circle at 68% 62%,#5bb66c 0 18%,transparent 19%),radial-gradient(circle at 50% 50%,#2f87d7 0 60%,#174b8a 100%)}
.khe-planet--earth:after{content:"";position:absolute;inset:-6px;border:1px solid rgba(142,197,255,.45);border-radius:50%}
.khe-planet--mars{width:34px;height:34px;background:radial-gradient(circle at 35% 30%,#ffb08a 0 12%,transparent 13%),radial-gradient(circle at 62% 58%,#7f2f1c 0 16%,transparent 17%),radial-gradient(circle at 50% 50%,#cb5937 0 65%,#6e2618 100%)}
.khe-planet--saturn{width:54px;height:54px;background:linear-gradient(180deg,#f6d49b 0 20%,#c99d5a 21% 36%,#f0c57d 37% 58%,#a9783f 59% 72%,#e3b86d 73% 100%)}
.khe-planet--saturn:before{content:"";position:absolute;left:50%;top:50%;width:88px;height:24px;border:5px solid rgba(223,186,120,.9);border-left-color:rgba(125,89,48,.6);border-right-color:rgba(125,89,48,.6);border-radius:50%;transform:translate(-50%,-50%) rotate(-18deg);box-shadow:0 0 0 1px rgba(255,255,255,.12)}
.khe-solar-hint{position:absolute;right:16px;bottom:14px;z-index:7;margin:0;color:rgba(255,255,255,.58);font-size:.64rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}

@keyframes khe-orbit-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes khe-stars-drift{to{background-position:82px 90px,150px 120px,180px 220px}}
@keyframes khe-sun-pulse{0%,100%{transform:scale(1);opacity:.45}50%{transform:scale(1.14);opacity:.12}}

@media(max-width:1000px){
	.khe-intro .khe-two-col{grid-template-columns:1fr;gap:42px}
	.khe-interactive-field{height:440px;margin-top:24px}
	.khe-intro .khe-big-copy{max-width:100%}
}
@media(max-width:720px){
	.khe-interactive-field{height:360px}
	.khe-orbit--saturn{width:380px;height:380px}
	.khe-orbit--mars{width:300px;height:300px}
	.khe-orbit--earth{width:225px;height:225px}
}
@media(prefers-reduced-motion:reduce){
	.khe-stars,.khe-sun:after,.khe-orbit{animation:none!important}
}


/* v0.5 — unified space section + aligned typography */
.khe-intro {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(circle at 20% 42%, rgba(72, 113, 173, .22), transparent 34%),
		radial-gradient(circle at 80% 28%, rgba(255, 92, 53, .12), transparent 28%),
		linear-gradient(180deg, #07111f 0%, #02060c 100%);
	color: #f7f5ef;
}

.khe-intro::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		radial-gradient(circle, rgba(255,255,255,.92) 0 1px, transparent 1.4px),
		radial-gradient(circle, rgba(255,255,255,.46) 0 1px, transparent 1.4px),
		radial-gradient(circle, rgba(139,190,255,.52) 0 1px, transparent 1.4px);
	background-size: 74px 74px, 118px 118px, 168px 168px;
	background-position: 12px 24px, 38px 8px, 18px 54px;
	opacity: .44;
}

.khe-intro .khe-shell {
	position: relative;
	z-index: 2;
}

.khe-intro .khe-kicker,
.khe-intro .khe-big-copy,
.khe-intro .khe-body-copy {
	color: inherit !important;
}

.khe-intro .khe-kicker {
	color: rgba(255,255,255,.72) !important;
}

.khe-intro .khe-big-copy {
	color: #f7f5ef !important;
	max-width: 100%;
	margin: 0 !important;
}

.khe-intro .khe-body-copy {
	color: rgba(247,245,239,.72) !important;
	max-width: 900px;
	margin: 42px 0 0 0 !important;
	padding: 0 !important;
}

.khe-intro .khe-two-col {
	align-items: start;
}

.khe-intro .khe-two-col > div:last-child {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.khe-intro .khe-interactive-field {
	margin-top: 34px;
	background:
		radial-gradient(circle at 50% 50%, rgba(37,54,92,.22), transparent 42%),
		transparent;
	border: 1px solid rgba(255,255,255,.16);
	box-shadow:
		inset 0 0 80px rgba(0,0,0,.38),
		0 0 0 1px rgba(255,255,255,.02);
}

.khe-intro .khe-interactive-field::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
	pointer-events: none;
	z-index: 1;
}

.khe-intro .khe-solar-system {
	position: relative;
	display: block;
	z-index: 2;
}

.khe-intro .khe-stars,
.khe-intro .khe-sun,
.khe-intro .khe-orbit,
.khe-intro .khe-planet,
.khe-intro .khe-solar-hint {
	position: absolute;
}

.khe-intro .khe-solar-hint {
	color: rgba(255,255,255,.58) !important;
}

/* Ensure title and paragraph share the exact same left edge */
.khe-intro .khe-big-copy,
.khe-intro .khe-body-copy {
	width: 100%;
	text-align: left;
}

@media (max-width: 1000px) {
	.khe-intro .khe-body-copy {
		margin-top: 30px !important;
	}
}


/* v0.6 — restore solar-system container and stacking */
.khe-intro .khe-interactive-field.khe-solar-system {
	position: relative !important;
	min-height: 520px;
	overflow: hidden;
}

.khe-intro .khe-stars { z-index: 0; }
.khe-intro .khe-orbit { z-index: 2; }
.khe-intro .khe-sun { z-index: 5; }
.khe-intro .khe-solar-hint { z-index: 7; }

@media (max-width: 1000px) {
	.khe-intro .khe-interactive-field.khe-solar-system {
		min-height: 440px;
	}
}

@media (max-width: 720px) {
	.khe-intro .khe-interactive-field.khe-solar-system {
		min-height: 360px;
	}
}


/* v0.7 — frameless solar system, success sun, extra planets */
.khe-intro .khe-interactive-field.khe-solar-system {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	overflow: visible;
}

.khe-intro .khe-interactive-field.khe-solar-system::before {
	display: none !important;
}

.khe-intro .khe-stars {
	opacity: .38;
}

.khe-intro .khe-sun {
	cursor: pointer;
}

.khe-intro .khe-sun span {
	letter-spacing: .14em;
}

.khe-intro .khe-sun::before {
	content: "";
	position: absolute;
	inset: -82px;
	border-radius: 50%;
	background:
		repeating-conic-gradient(
			from 0deg,
			rgba(255, 245, 180, .95) 0deg 7deg,
			rgba(255, 175, 62, 0) 7deg 16deg,
			rgba(255, 219, 134, .82) 16deg 22deg,
			rgba(255, 175, 62, 0) 22deg 32deg
		);
	-webkit-mask: radial-gradient(circle, transparent 0 26%, #000 29% 54%, transparent 61%);
	mask: radial-gradient(circle, transparent 0 26%, #000 29% 54%, transparent 61%);
	filter: blur(1.2px) drop-shadow(0 0 10px rgba(255, 191, 86, .7));
	opacity: 0;
	transform: scale(.72);
	transform-origin: center;
	transition: opacity .35s ease, transform .45s ease;
	animation: khe-sun-rays-spin 14s linear infinite;
	pointer-events: none;
}

.khe-intro .khe-sun:hover::before {
	opacity: .92;
	transform: scale(1.04);
}

.khe-intro .khe-sun:hover::after {
	inset: -26px;
	border-color: rgba(255, 214, 124, .58);
	box-shadow: 0 0 26px rgba(255, 173, 66, .42);
}

.khe-orbit--mercury { animation-delay: -1s; }

.khe-orbit--passion {
	width: 240px;
	height: 240px;
	animation: khe-orbit-spin 9s linear infinite;
	animation-delay: -3s;
}

.khe-orbit--earth { animation-delay: -5s; }

.khe-orbit--mars {
	animation-delay: -7s;
}

.khe-orbit--creativity {
	width: 445px;
	height: 445px;
	animation: khe-orbit-spin 21s linear infinite reverse;
	animation-delay: -9s;
}

.khe-orbit--saturn {
	animation-delay: -12s;
}

.khe-planet--passion {
	width: 28px;
	height: 28px;
	background:
		radial-gradient(circle at 35% 30%, #ffd8bf 0 18%, transparent 19%),
		radial-gradient(circle at 62% 60%, #ff8f6b 0 22%, transparent 23%),
		radial-gradient(circle at 50% 50%, #ff725e 0 62%, #8d2431 100%);
}

.khe-planet--creativity {
	width: 40px;
	height: 40px;
	background:
		radial-gradient(circle at 34% 32%, #c6fdff 0 16%, transparent 17%),
		radial-gradient(circle at 67% 64%, #8a64ff 0 18%, transparent 19%),
		radial-gradient(circle at 50% 50%, #4f8cff 0 56%, #43269c 100%);
	box-shadow: inset -8px -10px 18px rgba(0,0,0,.34), 0 0 16px rgba(143, 179, 255, .24);
}

.khe-planet--creativity::after {
	content: "";
	position: absolute;
	inset: -7px;
	border: 1px solid rgba(155, 194, 255, .34);
	border-radius: 50%;
}

@keyframes khe-sun-rays-spin {
	from { transform: scale(.72) rotate(0deg); }
	to { transform: scale(.72) rotate(360deg); }
}

@media (max-width: 720px) {
	.khe-orbit--passion {
		width: 205px;
		height: 205px;
	}

	.khe-orbit--creativity {
		width: 335px;
		height: 335px;
	}
}


/* v0.8 — selected work redesign */
.khe-work {
	position: relative;
}

.khe-work .khe-section-head {
	align-items: end;
	margin-bottom: 54px;
}

.khe-work .khe-section-head h2 {
	max-width: 760px;
	font-size: clamp(2.8rem, 5.8vw, 6.4rem);
	line-height: .92;
}

.khe-work .khe-text-link {
	border-bottom-width: 3px;
	font-size: 1rem;
}

.khe-work .khe-projects {
	display: grid;
	grid-template-columns: 1fr;
	gap: 28px;
}

.khe-work .khe-project,
.khe-work .khe-project:nth-child(n) {
	position: relative;
	grid-column: span 1;
	margin-top: 0;
	padding: clamp(22px, 3vw, 36px);
	border: 1px solid var(--khe-text);
	background:
		linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.05)),
		var(--khe-paper);
	overflow: hidden;
}

.khe-work .khe-project::before {
	content: "";
	position: absolute;
	right: -70px;
	top: -70px;
	width: 180px;
	height: 180px;
	border-radius: 50%;
	background: color-mix(in srgb, var(--project-accent) 18%, transparent);
	filter: blur(6px);
	opacity: .9;
	pointer-events: none;
}

.khe-work .khe-project::after {
	content: "";
	position: absolute;
	left: 24px;
	top: 24px;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--project-accent);
	box-shadow: 22px 0 0 rgba(21,21,21,.16);
}

.khe-work .khe-project a {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) clamp(190px, 24vw, 290px);
	align-items: center;
	gap: clamp(22px, 4vw, 54px);
	min-height: 240px;
}

.khe-work .khe-project:nth-child(even) a {
	grid-template-columns: clamp(190px, 24vw, 290px) minmax(0, 1.4fr);
}

.khe-work .khe-project:nth-child(even) .khe-project-image {
	order: 1;
	justify-self: start;
	transform: rotate(-3deg);
}

.khe-work .khe-project:nth-child(even) .khe-project-copy {
	order: 2;
}

.khe-work .khe-project-image {
	width: 100%;
	max-width: 290px;
	aspect-ratio: 4 / 5;
	justify-self: end;
	overflow: hidden;
	border: 1px solid rgba(21,21,21,.15);
	box-shadow: 12px 12px 0 rgba(21,21,21,.08);
	transform: rotate(3deg);
	transition: transform .35s ease, box-shadow .35s ease;
}

.khe-work .khe-project:hover .khe-project-image {
	transform: rotate(0deg) translateY(-6px);
	box-shadow: 18px 18px 0 rgba(21,21,21,.11);
}

.khe-work .khe-project-image img {
	transition: transform .7s cubic-bezier(.16,1,.3,1);
}

.khe-work .khe-project:hover .khe-project-image img {
	transform: scale(1.06);
}

.khe-work .khe-project-number {
	right: 12px;
	top: 12px;
	width: 56px;
	height: 56px;
	background: rgba(255,255,255,.96);
	border: 1px solid rgba(21,21,21,.12);
	font-size: 1.15rem;
}

.khe-work .khe-project-copy {
	position: relative;
	max-width: 880px;
	padding-left: 0;
}

.khe-work .khe-project-meta {
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 18px;
}

.khe-work .khe-project-meta span {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	padding: 6px 12px;
	border: 1px solid rgba(21,21,21,.14);
	border-radius: 999px;
	background: rgba(255,255,255,.62);
	color: var(--khe-text);
	font-size: .72rem;
	letter-spacing: .1em;
}

.khe-work .khe-project h3 {
	max-width: 780px;
	margin: 0;
	font-size: clamp(2.2rem, 4.6vw, 5rem);
	line-height: .92;
	letter-spacing: -.055em;
}

.khe-work .khe-project p {
	max-width: 700px;
	margin: 18px 0 0;
	font-size: 1.02rem;
	line-height: 1.6;
}

.khe-project-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 24px;
	font-size: .9rem;
	font-weight: 900;
	letter-spacing: .08em;
	text-transform: uppercase;
	padding-bottom: 4px;
	border-bottom: 2px solid currentColor;
}

.khe-work .khe-project:hover .khe-project-cta {
	transform: translateX(6px);
}

.khe-work .khe-project-cta {
	transition: transform .25s ease;
}

.khe-work .khe-empty-projects {
	padding: 46px 0;
	border-top: 1px solid var(--khe-border);
	border-bottom: 1px solid var(--khe-border);
}

@media (max-width: 1000px) {
	.khe-work .khe-project a,
	.khe-work .khe-project:nth-child(even) a {
		grid-template-columns: 1fr;
		align-items: start;
	}

	.khe-work .khe-project-image,
	.khe-work .khe-project:nth-child(even) .khe-project-image {
		order: 2;
		justify-self: start;
		max-width: 220px;
		transform: rotate(2deg);
	}

	.khe-work .khe-project-copy,
	.khe-work .khe-project:nth-child(even) .khe-project-copy {
		order: 1;
	}

	.khe-work .khe-project h3 {
		max-width: 100%;
	}
}

@media (max-width: 720px) {
	.khe-work .khe-section-head {
		gap: 18px;
	}

	.khe-work .khe-project {
		padding: 20px;
	}

	.khe-work .khe-project::after {
		left: 18px;
		top: 18px;
	}

	.khe-work .khe-project-image,
	.khe-work .khe-project:nth-child(even) .khe-project-image {
		max-width: 170px;
	}
}


/* v0.9 — impact section with soda-fill glasses */
.khe-impact {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(circle at 20% 42%, rgba(72, 113, 173, .22), transparent 34%),
		radial-gradient(circle at 80% 28%, rgba(255, 92, 53, .12), transparent 28%),
		linear-gradient(180deg, #07111f 0%, #02060c 100%) !important;
	color: #f7f5ef !important;
}

.khe-impact::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		radial-gradient(circle, rgba(255,255,255,.92) 0 1px, transparent 1.4px),
		radial-gradient(circle, rgba(255,255,255,.46) 0 1px, transparent 1.4px),
		radial-gradient(circle, rgba(139,190,255,.52) 0 1px, transparent 1.4px);
	background-size: 74px 74px, 118px 118px, 168px 168px;
	background-position: 12px 24px, 38px 8px, 18px 54px;
	opacity: .32;
}

.khe-impact .khe-shell {
	position: relative;
	z-index: 2;
}

.khe-impact-top {
	max-width: 920px;
	margin-bottom: 54px;
}

.khe-impact .khe-kicker,
.khe-impact h2,
.khe-impact .khe-impact-lead,
.khe-impact .khe-metric-note {
	color: inherit !important;
}

.khe-impact .khe-kicker {
	color: rgba(255,255,255,.76) !important;
}

.khe-impact h2 {
	margin: 18px 0 16px;
	font-size: clamp(3.1rem, 7vw, 7rem);
	line-height: .92;
	letter-spacing: -.06em;
}

.khe-impact-lead {
	max-width: 760px;
	margin: 0;
	color: rgba(247,245,239,.72) !important;
	font-size: 1.1rem;
	line-height: 1.6;
}

.khe-impact-pours {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 22px;
}

.khe-impact-card {
	display: grid;
	grid-template-columns: 146px 1fr;
	align-items: center;
	gap: 24px;
	min-height: 280px;
	padding: 28px;
	border: 1px solid rgba(255,255,255,.12);
	background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}

.khe-impact-glass-wrap {
	display: flex;
	justify-content: center;
}

.khe-impact-glass {
	position: relative;
	width: 94px;
	height: 170px;
	border: 3px solid rgba(255,255,255,.62);
	border-top: 0;
	border-radius: 0 0 18px 18px;
	background:
		linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
	box-shadow:
		inset 10px 0 18px rgba(255,255,255,.05),
		inset -12px 0 18px rgba(0,0,0,.18);
	overflow: hidden;
}

.khe-impact-glass::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 0;
	width: 104%;
	height: 14px;
	border: 3px solid rgba(255,255,255,.62);
	border-bottom: 0;
	border-radius: 16px 16px 0 0;
	transform: translate(-50%, -52%);
	background: rgba(255,255,255,.04);
}

.khe-impact-glass::after {
	content: "";
	position: absolute;
	left: 16px;
	top: 10px;
	bottom: 18px;
	width: 10px;
	border-radius: 999px;
	background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0));
	opacity: .8;
}

.khe-impact-liquid {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 0;
	background:
		linear-gradient(180deg, rgba(255,255,255,.34), rgba(255,255,255,0) 18%),
		linear-gradient(180deg, #8e1f18 0%, #66150f 35%, #43100d 100%);
	transition: height 1.6s cubic-bezier(.22, 1, .36, 1);
}

.khe-impact-card.is-visible .khe-impact-liquid {
	height: var(--fill-level);
}

.khe-foam {
	position: absolute;
	left: 0;
	right: 0;
	top: -10px;
	height: 18px;
	background:
		radial-gradient(circle at 12px 10px, rgba(244,223,187,.96) 0 8px, transparent 9px),
		radial-gradient(circle at 34px 8px, rgba(244,223,187,.96) 0 9px, transparent 10px),
		radial-gradient(circle at 56px 10px, rgba(244,223,187,.96) 0 10px, transparent 11px),
		radial-gradient(circle at 78px 8px, rgba(244,223,187,.96) 0 9px, transparent 10px);
	filter: blur(.2px);
}

.khe-bubble {
	position: absolute;
	bottom: 8px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: rgba(255, 230, 190, .85);
	opacity: 0;
}

.khe-impact-card.is-visible .khe-bubble {
	opacity: .9;
	animation: khe-cola-bubble 2.8s linear infinite;
}

.khe-bubble--1 { left: 18px; animation-delay: .2s; }
.khe-bubble--2 { left: 38px; width: 5px; height: 5px; animation-delay: 1.1s; }
.khe-bubble--3 { left: 58px; width: 6px; height: 6px; animation-delay: .7s; }
.khe-bubble--4 { left: 72px; width: 4px; height: 4px; animation-delay: 1.6s; }

.khe-impact-value {
	display: flex;
	align-items: flex-end;
	gap: 2px;
	margin-bottom: 14px;
	color: #ffffff;
	line-height: 1;
}

.khe-impact-prefix,
.khe-impact-suffix,
.khe-impact-value strong {
	font-size: clamp(2.8rem, 5vw, 5rem);
	font-weight: 900;
	letter-spacing: -.06em;
}

.khe-impact-prefix,
.khe-impact-suffix {
	color: var(--khe-accent);
}

.khe-impact-copy h3 {
	margin: 0 0 12px;
	color: #ffffff !important;
	font-size: 1.25rem;
	line-height: 1.2;
	letter-spacing: -.02em;
}

.khe-impact-copy p {
	margin: 0;
	color: rgba(247,245,239,.74) !important;
	font-size: 1rem;
	line-height: 1.55;
}

.khe-impact .khe-metric-note {
	margin-top: 30px;
	color: rgba(255,255,255,.5) !important;
	font-size: .78rem;
}

@keyframes khe-cola-bubble {
	0% {
		transform: translateY(0) scale(.8);
		opacity: 0;
	}
	15% {
		opacity: .95;
	}
	100% {
		transform: translateY(-120px) translateX(6px) scale(1.15);
		opacity: 0;
	}
}

@media (max-width: 1000px) {
	.khe-impact-pours {
		grid-template-columns: 1fr;
	}

	.khe-impact-card {
		grid-template-columns: 120px 1fr;
		min-height: 240px;
	}
}

@media (max-width: 720px) {
	.khe-impact-card {
		grid-template-columns: 1fr;
		gap: 20px;
		padding: 22px;
	}

	.khe-impact-glass-wrap {
		justify-content: flex-start;
	}

	.khe-impact-glass {
		width: 82px;
		height: 150px;
	}
}


/* v1.0 — impact chests with treasure fill */
.khe-impact-card {
	grid-template-columns: 170px 1fr;
}

.khe-impact-chest-wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 190px;
}

.khe-impact-glass-wrap,
.khe-impact-glass,
.khe-impact-liquid,
.khe-foam,
.khe-bubble {
	display: none !important;
}

.khe-impact-chest {
	position: relative;
	width: 132px;
	height: 118px;
	filter: drop-shadow(0 12px 18px rgba(0,0,0,.26));
}

.khe-impact-chest-lid {
	position: absolute;
	left: 8px;
	right: 8px;
	top: 0;
	height: 44px;
	border-radius: 18px 18px 10px 10px;
	background:
		linear-gradient(180deg, #8b5523 0%, #6a3918 58%, #4b240f 100%);
	border: 3px solid #d7a83c;
	box-shadow:
		inset 0 10px 14px rgba(255,255,255,.08),
		inset 0 -10px 12px rgba(0,0,0,.22);
	transform-origin: 50% 100%;
	transition: transform .9s cubic-bezier(.22,1,.36,1);
	z-index: 4;
}

.khe-impact-chest-lid::before,
.khe-impact-chest-lid::after,
.khe-impact-chest-body::before,
.khe-impact-chest-body::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 12px;
	background: linear-gradient(180deg, #f3d266 0%, #d19b2b 100%);
}

.khe-impact-chest-lid::before { left: 18px; }
.khe-impact-chest-lid::after { right: 18px; }

.khe-impact-chest-body {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 86px;
	border-radius: 12px 12px 18px 18px;
	background:
		linear-gradient(180deg, #8e5a29 0%, #6f3d1c 52%, #4d2411 100%);
	border: 3px solid #d7a83c;
	box-shadow:
		inset 0 10px 14px rgba(255,255,255,.08),
		inset 0 -12px 16px rgba(0,0,0,.28);
	overflow: hidden;
	z-index: 3;
}

.khe-impact-chest-body::before { left: 18px; }
.khe-impact-chest-body::after { right: 18px; }

.khe-impact-treasure {
	position: absolute;
	left: 10px;
	right: 10px;
	bottom: 8px;
	height: 0;
	overflow: hidden;
	transition: height 1.7s cubic-bezier(.22,1,.36,1);
	background:
		radial-gradient(circle at 20% 65%, rgba(252, 214, 94, .95) 0 10px, transparent 11px),
		radial-gradient(circle at 38% 70%, rgba(232, 175, 52, .96) 0 9px, transparent 10px),
		radial-gradient(circle at 52% 60%, rgba(248, 223, 120, .95) 0 12px, transparent 13px),
		radial-gradient(circle at 71% 70%, rgba(229, 167, 43, .96) 0 10px, transparent 11px),
		radial-gradient(circle at 86% 63%, rgba(247, 214, 102, .95) 0 9px, transparent 10px),
		linear-gradient(180deg, rgba(255,255,255,.42), rgba(255,255,255,0) 14%),
		linear-gradient(180deg, #f5d66b 0%, #d89a1f 42%, #a85d10 100%);
	border-radius: 18px 18px 12px 12px;
	box-shadow:
		inset 0 8px 10px rgba(255,255,255,.18),
		0 -2px 0 rgba(255,255,255,.12);
}

.khe-impact-card.is-visible .khe-impact-treasure {
	height: var(--fill-level);
}

.khe-impact-card.is-visible .khe-impact-chest-lid {
	transform: perspective(500px) rotateX(-48deg) translateY(-8px);
}

.khe-coin,
.khe-gem,
.khe-spark {
	position: absolute;
	display: block;
}

.khe-coin {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, #fff1a6 0 18%, #f1c54c 45%, #b97711 100%);
	box-shadow: inset 0 0 0 2px rgba(255,242,184,.45);
	bottom: 0;
}

.khe-coin--1 { left: 12px; bottom: 12px; }
.khe-coin--2 { left: 46px; bottom: 18px; width: 16px; height: 16px; }
.khe-coin--3 { right: 16px; bottom: 10px; }

.khe-gem {
	width: 16px;
	height: 16px;
	transform: rotate(45deg);
	border-radius: 3px;
}

.khe-gem--1 {
	left: 28px;
	bottom: 32px;
	background: linear-gradient(135deg, #98efff 0%, #45b7ff 55%, #375cff 100%);
	box-shadow: 0 0 10px rgba(105, 208, 255, .35);
}
.khe-gem--2 {
	right: 28px;
	bottom: 30px;
	background: linear-gradient(135deg, #ffd5f0 0%, #d96cff 58%, #8a48ff 100%);
	box-shadow: 0 0 10px rgba(217, 108, 255, .35);
}
.khe-gem--3 {
	left: 62px;
	bottom: 40px;
	width: 12px;
	height: 12px;
	background: linear-gradient(135deg, #d8ffbb 0%, #81df4c 58%, #31a96f 100%);
	box-shadow: 0 0 8px rgba(129, 223, 76, .35);
}

.khe-spark {
	width: 10px;
	height: 10px;
	opacity: 0;
}

.khe-spark::before,
.khe-spark::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	background: rgba(255, 240, 189, .95);
	transform: translate(-50%, -50%);
}

.khe-spark::before {
	width: 2px;
	height: 10px;
	border-radius: 999px;
}

.khe-spark::after {
	width: 10px;
	height: 2px;
	border-radius: 999px;
}

.khe-spark--1 { left: 18px; top: 16px; }
.khe-spark--2 { left: 62px; top: 8px; }
.khe-spark--3 { right: 20px; top: 18px; }

.khe-impact-card.is-visible .khe-spark {
	animation: khe-treasure-spark 2.1s ease-in-out infinite;
}

.khe-spark--2 { animation-delay: .5s; }
.khe-spark--3 { animation-delay: 1s; }

@keyframes khe-treasure-spark {
	0%, 100% {
		opacity: 0;
		transform: scale(.6) rotate(0deg);
	}
	25% {
		opacity: 1;
		transform: scale(1.08) rotate(12deg);
	}
	55% {
		opacity: .8;
		transform: scale(.92) rotate(-10deg);
	}
}

@media (max-width: 1000px) {
	.khe-impact-card {
		grid-template-columns: 150px 1fr;
	}
}

@media (max-width: 720px) {
	.khe-impact-card {
		grid-template-columns: 1fr;
	}
	.khe-impact-chest-wrap {
		justify-content: flex-start;
	}
}


/* v1.1 — premium glowing treasure sacks */
.khe-impact-card {
	grid-template-columns: 176px 1fr;
}

.khe-impact-chest-wrap,
.khe-impact-chest,
.khe-impact-chest-lid,
.khe-impact-chest-body,
.khe-impact-treasure {
	display: none !important;
}

.khe-impact-sack-wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 210px;
}

.khe-impact-sack {
	position: relative;
	width: 138px;
	height: 176px;
	filter: drop-shadow(0 18px 28px rgba(0, 0, 0, .28));
}

.khe-impact-sack::before {
	content: "";
	position: absolute;
	inset: 36px 0 0;
	border-radius: 38% 38% 32% 32% / 28% 28% 38% 38%;
	background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 16%), linear-gradient(180deg, #d1ad73 0%, #b6894f 42%, #8f6137 100%);
	box-shadow: inset 16px 0 16px rgba(255,255,255,.08), inset -20px -18px 26px rgba(63, 33, 8, .22);
	z-index: 1;
}

.khe-impact-sack::after {
	content: "";
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 12px;
	height: 34px;
	border-radius: 50%;
	background: radial-gradient(ellipse at center, rgba(255, 179, 77, .16), rgba(255, 179, 77, 0) 68%);
	filter: blur(8px);
	z-index: 0;
}

.khe-impact-sack-neck {
	position: absolute;
	left: 50%;
	top: 18px;
	width: 58px;
	height: 34px;
	transform: translateX(-50%);
	border-radius: 16px 16px 12px 12px;
	background: linear-gradient(180deg, #c79d61 0%, #a8753f 100%);
	box-shadow: inset 0 8px 10px rgba(255,255,255,.08), inset 0 -10px 14px rgba(74, 39, 9, .18);
	z-index: 3;
}

.khe-impact-sack-tie {
	position: absolute;
	left: 50%;
	top: 44px;
	width: 78px;
	height: 18px;
	transform: translateX(-50%);
	border-radius: 999px;
	background: linear-gradient(180deg, #5f3418 0%, #3c1d0e 100%);
	box-shadow: 0 0 0 3px rgba(241, 203, 122, .26), 0 0 22px rgba(255, 189, 80, .12);
	z-index: 4;
}

.khe-impact-sack-body {
	position: absolute;
	left: 9px;
	right: 9px;
	top: 48px;
	bottom: 8px;
	overflow: hidden;
	border-radius: 38% 38% 32% 32% / 24% 24% 40% 40%;
	z-index: 2;
}

.khe-impact-loot {
	position: absolute;
	left: 10px;
	right: 10px;
	bottom: 10px;
	height: 0;
	overflow: hidden;
	border-radius: 20px 20px 14px 14px;
	transition: height 1.8s cubic-bezier(.22,1,.36,1);
	background:
		radial-gradient(circle at 16% 74%, rgba(250, 218, 103, .98) 0 11px, transparent 12px),
		radial-gradient(circle at 34% 68%, rgba(236, 173, 50, .96) 0 9px, transparent 10px),
		radial-gradient(circle at 53% 74%, rgba(250, 220, 116, .98) 0 12px, transparent 13px),
		radial-gradient(circle at 75% 68%, rgba(223, 154, 39, .96) 0 10px, transparent 11px),
		radial-gradient(circle at 88% 76%, rgba(247, 215, 97, .98) 0 9px, transparent 10px),
		radial-gradient(circle at 48% 20%, rgba(137, 227, 255, .9) 0 10px, transparent 11px),
		linear-gradient(180deg, rgba(255,255,255,.32), rgba(255,255,255,0) 18%),
		linear-gradient(180deg, #ffd76b 0%, #dd9d1d 46%, #a85d10 100%);
	box-shadow: inset 0 10px 12px rgba(255,255,255,.18), 0 0 22px rgba(255, 191, 90, .2);
}

.khe-impact-card.is-visible .khe-impact-loot {
	height: var(--fill-level);
}

.khe-impact-card.is-visible .khe-impact-sack {
	animation: khe-sack-settle .85s cubic-bezier(.22,1,.36,1);
}

.khe-coin,
.khe-gem,
.khe-spark {
	position: absolute;
	display: block;
}

.khe-coin {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, #fff2ab 0 18%, #f0c84c 48%, #b77910 100%);
	box-shadow: inset 0 0 0 2px rgba(255,242,184,.45), 0 0 12px rgba(255, 210, 88, .16);
}
.khe-coin--1 { left: 10px; bottom: 10px; }
.khe-coin--2 { left: 38px; bottom: 18px; width: 16px; height: 16px; }
.khe-coin--3 { left: 68px; bottom: 12px; }
.khe-coin--4 { right: 10px; bottom: 18px; width: 15px; height: 15px; }

.khe-gem {
	transform: rotate(45deg);
	border-radius: 4px;
}
.khe-gem--1 {
	left: 24px; bottom: 34px; width: 15px; height: 15px;
	background: linear-gradient(135deg, #b8f7ff 0%, #5bc6ff 52%, #3665ff 100%);
	box-shadow: 0 0 16px rgba(91, 198, 255, .45);
}
.khe-gem--2 {
	right: 25px; bottom: 30px; width: 16px; height: 16px;
	background: linear-gradient(135deg, #ffe1f5 0%, #e27bff 58%, #7d4dff 100%);
	box-shadow: 0 0 16px rgba(226, 123, 255, .42);
}
.khe-gem--3 {
	left: 58px; bottom: 40px; width: 12px; height: 12px;
	background: linear-gradient(135deg, #e3ffbd 0%, #89df4f 52%, #2ba96e 100%);
	box-shadow: 0 0 14px rgba(137, 223, 79, .4);
}

.khe-spark {
	width: 12px;
	height: 12px;
	opacity: 0;
	filter: drop-shadow(0 0 6px rgba(255, 220, 147, .5));
}
.khe-spark::before,
.khe-spark::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	background: rgba(255, 240, 189, .98);
	transform: translate(-50%, -50%);
	border-radius: 999px;
}
.khe-spark::before { width: 2px; height: 12px; }
.khe-spark::after { width: 12px; height: 2px; }
.khe-spark--1 { left: 22px; top: 66px; }
.khe-spark--2 { left: 64px; top: 58px; }
.khe-spark--3 { right: 18px; top: 70px; }

.khe-impact-card.is-visible .khe-spark {
	animation: khe-treasure-spark 2.4s ease-in-out infinite;
}
.khe-spark--2 { animation-delay: .45s; }
.khe-spark--3 { animation-delay: .95s; }

.khe-impact-sack-wrap::after {
	content: "";
	position: absolute;
	width: 124px;
	height: 124px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255, 201, 92, .24) 0%, rgba(255, 201, 92, .12) 32%, rgba(255, 201, 92, 0) 72%);
	filter: blur(10px);
	opacity: .75;
	z-index: 0;
}

.khe-impact-card.is-visible .khe-impact-sack-wrap::after {
	animation: khe-sack-glow 2.6s ease-in-out infinite;
}

@keyframes khe-sack-settle {
	0% { transform: translateY(10px) scale(.94); opacity: .85; }
	60% { transform: translateY(-4px) scale(1.02); opacity: 1; }
	100% { transform: translateY(0) scale(1); opacity: 1; }
}

@keyframes khe-sack-glow {
	0%, 100% { opacity: .48; transform: scale(.92); }
	50% { opacity: .94; transform: scale(1.08); }
}

@media (max-width: 1000px) {
	.khe-impact-card { grid-template-columns: 158px 1fr; }
}

@media (max-width: 720px) {
	.khe-impact-card { grid-template-columns: 1fr; }
	.khe-impact-sack-wrap { justify-content: flex-start; }
}


/* v1.2 — premium treasure sacks closer to reference + hover sparkle */
.khe-impact-card {
	grid-template-columns: 184px 1fr;
}

.khe-impact-sack-wrap {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 220px;
}

.khe-impact-sack-wrap::after {
	content: "";
	position: absolute;
	width: 160px;
	height: 160px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255, 201, 92, .28) 0%, rgba(255, 201, 92, .14) 34%, rgba(255, 201, 92, 0) 74%);
	filter: blur(14px);
	opacity: .62;
	z-index: 0;
	transition: opacity .35s ease, transform .35s ease;
}

.khe-impact-sack {
	position: relative;
	width: 152px;
	height: 180px;
	filter: drop-shadow(0 18px 28px rgba(0, 0, 0, .28));
	transition: transform .35s ease;
}

.khe-impact-sack::before {
	content: "";
	position: absolute;
	left: 4px;
	right: 4px;
	top: 56px;
	bottom: 10px;
	border-radius: 34% 34% 24% 24% / 24% 24% 38% 38%;
	background:
		linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,0) 16%),
		linear-gradient(180deg, #c79b63 0%, #a67645 44%, #83542f 100%);
	box-shadow:
		inset 14px 0 18px rgba(255,255,255,.07),
		inset -18px -18px 24px rgba(74, 39, 9, .24);
	z-index: 1;
}

.khe-impact-sack-neck {
	position: absolute;
	left: 12px;
	right: 12px;
	top: 24px;
	height: 42px;
	border-radius: 44% 56% 38% 40% / 54% 58% 42% 46%;
	background: linear-gradient(180deg, #8c6a46 0%, #6d4f2f 100%);
	box-shadow: inset 0 8px 10px rgba(255,255,255,.08), inset 0 -10px 14px rgba(33, 19, 9, .28);
	transform: rotate(2deg);
	z-index: 4;
}

.khe-impact-sack-neck::before {
	content: "";
	position: absolute;
	left: 9px;
	right: 11px;
	top: 7px;
	bottom: 10px;
	border-radius: inherit;
	background: radial-gradient(ellipse at center, rgba(19, 10, 6, .98) 0%, rgba(53, 31, 16, .98) 68%, rgba(109, 79, 47, .92) 100%);
}

.khe-impact-sack-neck::after {
	content: "";
	position: absolute;
	left: -2px;
	right: -2px;
	bottom: -5px;
	height: 12px;
	border-radius: 50%;
	background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(0,0,0,.1));
	opacity: .65;
}

.khe-impact-sack-tie {
	position: absolute;
	left: 50%;
	top: 58px;
	width: 54px;
	height: 10px;
	transform: translateX(-50%);
	border-radius: 999px;
	background: linear-gradient(180deg, #5f3418 0%, #3c1d0e 100%);
	box-shadow: 0 0 0 2px rgba(241, 203, 122, .22);
	z-index: 5;
}

.khe-impact-sack-tie::before,
.khe-impact-sack-tie::after {
	content: "";
	position: absolute;
	top: 8px;
	width: 4px;
	height: 38px;
	border-radius: 999px;
	background: linear-gradient(180deg, #8e643f 0%, #6d4525 100%);
}

.khe-impact-sack-tie::before {
	left: 16px;
	transform: rotate(12deg);
}

.khe-impact-sack-tie::after {
	right: 14px;
	transform: rotate(-9deg);
}

.khe-impact-sack-body {
	position: absolute;
	left: 12px;
	right: 12px;
	top: 50px;
	bottom: 12px;
	overflow: visible;
	z-index: 3;
}

.khe-impact-loot {
	position: absolute;
	left: 8px;
	right: 8px;
	bottom: 8px;
	height: 0;
	overflow: visible;
	border-radius: 18px 18px 14px 14px;
	transition: height 1.8s cubic-bezier(.22,1,.36,1);
	background:
		radial-gradient(circle at 16% 74%, rgba(250, 218, 103, .98) 0 11px, transparent 12px),
		radial-gradient(circle at 34% 68%, rgba(236, 173, 50, .96) 0 9px, transparent 10px),
		radial-gradient(circle at 53% 74%, rgba(250, 220, 116, .98) 0 12px, transparent 13px),
		radial-gradient(circle at 75% 68%, rgba(223, 154, 39, .96) 0 10px, transparent 11px),
		radial-gradient(circle at 88% 76%, rgba(247, 215, 97, .98) 0 9px, transparent 10px),
		linear-gradient(180deg, rgba(255,255,255,.36), rgba(255,255,255,0) 18%),
		linear-gradient(180deg, #ffd76b 0%, #dd9d1d 46%, #a85d10 100%);
	box-shadow: inset 0 10px 12px rgba(255,255,255,.18), 0 0 22px rgba(255, 191, 90, .2);
}

.khe-impact-card.is-visible .khe-impact-loot {
	height: var(--fill-level);
}

.khe-impact-card.is-visible .khe-impact-sack {
	animation: khe-sack-settle .85s cubic-bezier(.22,1,.36,1);
}

.khe-coin,
.khe-gem,
.khe-spark {
	position: absolute;
	display: block;
	transition: transform .28s ease, box-shadow .28s ease, filter .28s ease, opacity .28s ease;
}

.khe-coin {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, #fff2ab 0 18%, #f0c84c 48%, #b77910 100%);
	box-shadow: inset 0 0 0 2px rgba(255,242,184,.45), 0 0 10px rgba(255, 210, 88, .14);
}

.khe-coin--1 { left: 10px; bottom: 8px; }
.khe-coin--2 { left: 38px; bottom: 18px; width: 16px; height: 16px; }
.khe-coin--3 { left: 68px; bottom: 10px; }
.khe-coin--4 { right: 8px; bottom: 18px; width: 15px; height: 15px; }

.khe-gem {
	transform: rotate(45deg);
	border-radius: 4px;
}

.khe-gem--1 {
	left: 18px; bottom: 40px; width: 16px; height: 16px;
	background: linear-gradient(135deg, #b8f7ff 0%, #5bc6ff 52%, #3665ff 100%);
	box-shadow: 0 0 14px rgba(91, 198, 255, .34);
}

.khe-gem--2 {
	right: 18px; bottom: 46px; width: 18px; height: 18px;
	background: linear-gradient(135deg, #ffe1f5 0%, #e27bff 58%, #7d4dff 100%);
	box-shadow: 0 0 14px rgba(226, 123, 255, .32);
}

.khe-gem--3 {
	left: 58px; bottom: 58px; width: 14px; height: 14px;
	background: linear-gradient(135deg, #e3ffbd 0%, #89df4f 52%, #2ba96e 100%);
	box-shadow: 0 0 14px rgba(137, 223, 79, .3);
}

.khe-spark {
	width: 12px;
	height: 12px;
	opacity: .18;
	filter: drop-shadow(0 0 6px rgba(255, 220, 147, .4));
}

.khe-spark::before,
.khe-spark::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	background: rgba(255, 240, 189, .98);
	transform: translate(-50%, -50%);
	border-radius: 999px;
}

.khe-spark::before { width: 2px; height: 12px; }
.khe-spark::after { width: 12px; height: 2px; }

.khe-spark--1 { left: 18px; top: 64px; }
.khe-spark--2 { left: 64px; top: 56px; }
.khe-spark--3 { right: 16px; top: 68px; }

.khe-impact-card.is-visible .khe-spark {
	animation: khe-treasure-spark 2.6s ease-in-out infinite;
}

.khe-spark--2 { animation-delay: .45s; }
.khe-spark--3 { animation-delay: .95s; }

.khe-impact-card:hover .khe-impact-sack {
	transform: translateY(-4px) rotate(-1deg);
}

.khe-impact-card:hover .khe-impact-sack-wrap::after {
	opacity: .95;
	transform: scale(1.08);
}

.khe-impact-card:hover .khe-gem {
	animation: khe-gem-twinkle 1.15s ease-in-out infinite alternate;
	filter: brightness(1.18) saturate(1.15);
}

.khe-impact-card:hover .khe-gem--1 { animation-delay: .05s; }
.khe-impact-card:hover .khe-gem--2 { animation-delay: .2s; }
.khe-impact-card:hover .khe-gem--3 { animation-delay: .35s; }

.khe-impact-card:hover .khe-spark {
	opacity: 1;
	animation-duration: .95s;
}

.khe-impact-card:hover .khe-coin {
	animation: khe-coin-glint 1.8s ease-in-out infinite;
}

@keyframes khe-gem-twinkle {
	0% {
		transform: rotate(45deg) scale(1);
		box-shadow: 0 0 10px rgba(255,255,255,.12);
	}
	100% {
		transform: rotate(45deg) scale(1.18) translateY(-2px);
		box-shadow: 0 0 24px currentColor, 0 0 14px rgba(255,255,255,.65);
	}
}

@keyframes khe-coin-glint {
	0%, 100% {
		filter: brightness(1);
		transform: translateY(0);
	}
	50% {
		filter: brightness(1.12);
		transform: translateY(-1px);
	}
}

@media (max-width: 1000px) {
	.khe-impact-card {
		grid-template-columns: 164px 1fr;
	}
}

@media (max-width: 720px) {
	.khe-impact-card {
		grid-template-columns: 1fr;
	}
	.khe-impact-sack-wrap {
		justify-content: flex-start;
	}
}


/* v1.3 — premium lego-style impact bricks */
.khe-impact-card {
	grid-template-columns: 198px 1fr;
}

.khe-impact-sack-wrap,
.khe-impact-sack,
.khe-impact-sack-neck,
.khe-impact-sack-tie,
.khe-impact-sack-body,
.khe-impact-loot,
.khe-coin,
.khe-gem,
.khe-spark {
	display: none !important;
}

.khe-impact-bricks-wrap {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 214px;
}

.khe-impact-bricks-wrap::before {
	content: "";
	position: absolute;
	width: 166px;
	height: 166px;
	border-radius: 28px;
	background: radial-gradient(circle, rgba(255,255,255,.06) 0%, rgba(255,255,255,.02) 46%, rgba(255,255,255,0) 74%);
	filter: blur(10px);
	opacity: .95;
}

.khe-impact-bricks-wrap::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 24px;
	transform: translateX(-50%);
	width: 144px;
	height: 16px;
	border-radius: 50%;
	background: radial-gradient(ellipse at center, rgba(255, 104, 56, .22) 0%, rgba(255, 104, 56, 0) 74%);
	filter: blur(10px);
	opacity: .85;
}

.khe-impact-bricks {
	position: relative;
	width: 156px;
	height: 160px;
	z-index: 2;
	transform-style: preserve-3d;
}

.khe-brick {
	position: absolute;
	display: block;
	border-radius: 8px;
	background: linear-gradient(180deg, var(--brick-top) 0%, var(--brick-bottom) 100%);
	box-shadow: inset 0 2px 0 rgba(255,255,255,.28), inset 0 -4px 8px rgba(0,0,0,.18), 0 8px 18px rgba(0,0,0,.16);
	opacity: 0;
	transition: transform .7s cubic-bezier(.22,1,.36,1), opacity .6s ease, box-shadow .3s ease, filter .3s ease;
	transform: translate(var(--intro-x), var(--intro-y)) rotate(var(--intro-r)) scale(.76);
	will-change: transform, opacity;
}

.khe-brick::before,
.khe-brick::after {
	content: "";
	position: absolute;
	top: 7px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, rgba(255,255,255,.42) 0 18%, rgba(255,255,255,.12) 46%, rgba(0,0,0,.08) 100%);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.28);
}

.khe-brick::before { left: 10px; }
.khe-brick::after { right: 10px; }

.khe-brick--1 {
	--brick-top: #ff8b69; --brick-bottom: #ff5c35;
	width: 64px; height: 30px; left: 16px; top: 98px;
	--intro-x: -54px; --intro-y: 18px; --intro-r: -18deg;
	--scatter-x: -66px; --scatter-y: 8px; --scatter-r: -22deg;
}
.khe-brick--2 {
	--brick-top: #ffd87a; --brick-bottom: #ffb938;
	width: 64px; height: 30px; left: 80px; top: 98px;
	--intro-x: 44px; --intro-y: 28px; --intro-r: 17deg;
	--scatter-x: 62px; --scatter-y: 10px; --scatter-r: 28deg;
}
.khe-brick--3 {
	--brick-top: #7ec7ff; --brick-bottom: #398cf8;
	width: 56px; height: 30px; left: 28px; top: 66px;
	--intro-x: -70px; --intro-y: -14px; --intro-r: -25deg;
	--scatter-x: -74px; --scatter-y: -20px; --scatter-r: -34deg;
}
.khe-brick--4 {
	--brick-top: #cbff6f; --brick-bottom: #8bd93f;
	width: 56px; height: 30px; left: 84px; top: 66px;
	--intro-x: 62px; --intro-y: -14px; --intro-r: 18deg;
	--scatter-x: 76px; --scatter-y: -24px; --scatter-r: 34deg;
}
.khe-brick--5 {
	--brick-top: #c9b4ff; --brick-bottom: #8c64ff;
	width: 48px; height: 30px; left: 54px; top: 34px;
	--intro-x: 0px; --intro-y: -54px; --intro-r: -6deg;
	--scatter-x: 0px; --scatter-y: -62px; --scatter-r: 8deg;
}
.khe-brick--6 {
	--brick-top: #ffffff; --brick-bottom: #d8e1f5;
	width: 40px; height: 24px; left: 10px; top: 128px;
	--intro-x: -44px; --intro-y: 40px; --intro-r: -14deg;
	--scatter-x: -58px; --scatter-y: 44px; --scatter-r: -24deg;
}
.khe-brick--7 {
	--brick-top: #ffffff; --brick-bottom: #d8e1f5;
	width: 40px; height: 24px; left: 106px; top: 128px;
	--intro-x: 44px; --intro-y: 34px; --intro-r: 14deg;
	--scatter-x: 56px; --scatter-y: 44px; --scatter-r: 24deg;
}
.khe-brick--8 {
	--brick-top: #ffcfde; --brick-bottom: #ff74a2;
	width: 30px; height: 22px; left: 116px; top: 44px;
	--intro-x: 58px; --intro-y: -48px; --intro-r: 20deg;
	--scatter-x: 72px; --scatter-y: -58px; --scatter-r: 35deg;
}

.khe-brick--6::before,
.khe-brick--7::before,
.khe-brick--8::before {
	left: 50%;
	transform: translateX(-50%);
}
.khe-brick--6::after,
.khe-brick--7::after,
.khe-brick--8::after { display: none; }

.khe-impact-card.is-visible .khe-brick {
	opacity: 1;
	transform: translate(0, 0) rotate(0deg) scale(1);
}

.khe-impact-card.is-visible .khe-brick--1 { transition-delay: .05s; }
.khe-impact-card.is-visible .khe-brick--2 { transition-delay: .12s; }
.khe-impact-card.is-visible .khe-brick--3 { transition-delay: .19s; }
.khe-impact-card.is-visible .khe-brick--4 { transition-delay: .26s; }
.khe-impact-card.is-visible .khe-brick--5 { transition-delay: .33s; }
.khe-impact-card.is-visible .khe-brick--6 { transition-delay: .40s; }
.khe-impact-card.is-visible .khe-brick--7 { transition-delay: .47s; }
.khe-impact-card.is-visible .khe-brick--8 { transition-delay: .54s; }

.khe-impact-card:hover .khe-brick {
	transform: translate(var(--scatter-x), var(--scatter-y)) rotate(var(--scatter-r)) scale(.97);
	box-shadow: inset 0 2px 0 rgba(255,255,255,.34), inset 0 -4px 8px rgba(0,0,0,.18), 0 12px 24px rgba(0,0,0,.22), 0 0 18px rgba(255,255,255,.08);
	filter: saturate(1.08) brightness(1.03);
}

.khe-impact-card:hover .khe-brick--1 { transition-delay: .00s; }
.khe-impact-card:hover .khe-brick--2 { transition-delay: .03s; }
.khe-impact-card:hover .khe-brick--3 { transition-delay: .06s; }
.khe-impact-card:hover .khe-brick--4 { transition-delay: .09s; }
.khe-impact-card:hover .khe-brick--5 { transition-delay: .12s; }
.khe-impact-card:hover .khe-brick--6 { transition-delay: .15s; }
.khe-impact-card:hover .khe-brick--7 { transition-delay: .18s; }
.khe-impact-card:hover .khe-brick--8 { transition-delay: .21s; }

.khe-impact-card:hover .khe-impact-bricks-wrap::after {
	opacity: 1;
	filter: blur(12px);
}

@media (max-width: 1000px) {
	.khe-impact-card { grid-template-columns: 174px 1fr; }
}

@media (max-width: 720px) {
	.khe-impact-card { grid-template-columns: 1fr; }
	.khe-impact-bricks-wrap { justify-content: flex-start; }
}


/* v1.4 — stronger 3D lego look + unique builds per category */
.khe-impact-card { grid-template-columns: 208px 1fr; }
.khe-impact-bricks { width: 170px; height: 170px; }

.khe-brick {
	border-radius: 7px;
	background:
		linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0) 26%),
		linear-gradient(180deg, var(--brick-top) 0%, var(--brick-bottom) 100%);
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.35),
		inset 0 -6px 10px rgba(0,0,0,.16),
		0 12px 20px rgba(0,0,0,.18);
	transform-origin: center center;
}

.khe-brick::before {
	content: "";
	position: absolute;
	left: 6px;
	right: 6px;
	top: -7px;
	height: 10px;
	border-radius: 6px 6px 2px 2px;
	background:
		radial-gradient(circle at 18px 5px, rgba(255,255,255,.45) 0 4px, rgba(255,255,255,.16) 4.5px, transparent 5px),
		radial-gradient(circle at calc(100% - 18px) 5px, rgba(255,255,255,.45) 0 4px, rgba(255,255,255,.16) 4.5px, transparent 5px),
		linear-gradient(180deg, color-mix(in srgb, var(--brick-top) 72%, white), var(--brick-top));
	transform: perspective(120px) rotateX(58deg);
	transform-origin: bottom center;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.28);
}

.khe-brick::after {
	content: "";
	position: absolute;
	top: 3px;
	right: -7px;
	width: 8px;
	height: calc(100% - 3px);
	border-radius: 0 5px 5px 0;
	background: linear-gradient(180deg, color-mix(in srgb, var(--brick-bottom) 88%, white), color-mix(in srgb, var(--brick-bottom) 80%, black));
	transform: skewY(-42deg);
	transform-origin: left top;
	opacity: .96;
}

.khe-impact-card:hover .khe-brick {
	filter: saturate(1.1) brightness(1.03);
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.38),
		inset 0 -6px 10px rgba(0,0,0,.16),
		0 14px 24px rgba(0,0,0,.22),
		0 0 20px rgba(255,255,255,.06);
}

/* Budget build — dense money wall */
.khe-impact-card--budget .khe-brick--1{--brick-top:#ff8b69;--brick-bottom:#ff5c35;width:72px;height:30px;left:12px;top:108px;--intro-x:-54px;--intro-y:20px;--intro-r:-18deg;--scatter-x:-70px;--scatter-y:10px;--scatter-r:-24deg;}
.khe-impact-card--budget .khe-brick--2{--brick-top:#ffd87a;--brick-bottom:#ffb938;width:72px;height:30px;left:84px;top:108px;--intro-x:48px;--intro-y:24px;--intro-r:18deg;--scatter-x:66px;--scatter-y:12px;--scatter-r:26deg;}
.khe-impact-card--budget .khe-brick--3{--brick-top:#7ec7ff;--brick-bottom:#398cf8;width:56px;height:30px;left:22px;top:76px;--intro-x:-74px;--intro-y:-10px;--intro-r:-22deg;--scatter-x:-82px;--scatter-y:-18px;--scatter-r:-30deg;}
.khe-impact-card--budget .khe-brick--4{--brick-top:#cbff6f;--brick-bottom:#8bd93f;width:56px;height:30px;left:78px;top:76px;--intro-x:62px;--intro-y:-12px;--intro-r:18deg;--scatter-x:78px;--scatter-y:-18px;--scatter-r:34deg;}
.khe-impact-card--budget .khe-brick--5{--brick-top:#c9b4ff;--brick-bottom:#8c64ff;width:52px;height:28px;left:52px;top:44px;--intro-x:0px;--intro-y:-58px;--intro-r:-4deg;--scatter-x:0px;--scatter-y:-70px;--scatter-r:8deg;}
.khe-impact-card--budget .khe-brick--6{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:38px;height:24px;left:0px;top:138px;--intro-x:-48px;--intro-y:42px;--intro-r:-14deg;--scatter-x:-62px;--scatter-y:46px;--scatter-r:-24deg;}
.khe-impact-card--budget .khe-brick--7{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:38px;height:24px;left:118px;top:138px;--intro-x:46px;--intro-y:36px;--intro-r:14deg;--scatter-x:60px;--scatter-y:46px;--scatter-r:24deg;}
.khe-impact-card--budget .khe-brick--8{--brick-top:#ffcfde;--brick-bottom:#ff74a2;width:34px;height:22px;left:118px;top:48px;--intro-x:60px;--intro-y:-50px;--intro-r:20deg;--scatter-x:74px;--scatter-y:-62px;--scatter-r:36deg;}

/* Web build — stair-step / modular UI feel */
.khe-impact-card--web .khe-brick--1{--brick-top:#7ec7ff;--brick-bottom:#398cf8;width:58px;height:28px;left:8px;top:120px;--intro-x:-60px;--intro-y:32px;--intro-r:-20deg;--scatter-x:-68px;--scatter-y:20px;--scatter-r:-32deg;}
.khe-impact-card--web .khe-brick--2{--brick-top:#cbff6f;--brick-bottom:#8bd93f;width:58px;height:28px;left:66px;top:120px;--intro-x:12px;--intro-y:38px;--intro-r:10deg;--scatter-x:14px;--scatter-y:34px;--scatter-r:18deg;}
.khe-impact-card--web .khe-brick--3{--brick-top:#ffd87a;--brick-bottom:#ffb938;width:58px;height:28px;left:124px;top:120px;--intro-x:66px;--intro-y:26px;--intro-r:20deg;--scatter-x:76px;--scatter-y:24px;--scatter-r:32deg;}
.khe-impact-card--web .khe-brick--4{--brick-top:#ff8b69;--brick-bottom:#ff5c35;width:58px;height:28px;left:36px;top:90px;--intro-x:-34px;--intro-y:-10px;--intro-r:-16deg;--scatter-x:-38px;--scatter-y:-14px;--scatter-r:-24deg;}
.khe-impact-card--web .khe-brick--5{--brick-top:#c9b4ff;--brick-bottom:#8c64ff;width:58px;height:28px;left:94px;top:90px;--intro-x:34px;--intro-y:-8px;--intro-r:16deg;--scatter-x:42px;--scatter-y:-10px;--scatter-r:24deg;}
.khe-impact-card--web .khe-brick--6{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:40px;height:24px;left:54px;top:60px;--intro-x:-18px;--intro-y:-52px;--intro-r:-8deg;--scatter-x:-24px;--scatter-y:-64px;--scatter-r:-16deg;}
.khe-impact-card--web .khe-brick--7{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:40px;height:24px;left:94px;top:60px;--intro-x:18px;--intro-y:-48px;--intro-r:8deg;--scatter-x:24px;--scatter-y:-60px;--scatter-r:16deg;}
.khe-impact-card--web .khe-brick--8{--brick-top:#ffcfde;--brick-bottom:#ff74a2;width:52px;height:24px;left:69px;top:32px;--intro-x:0px;--intro-y:-70px;--intro-r:0deg;--scatter-x:0px;--scatter-y:-78px;--scatter-r:8deg;}

/* Strategy build — upward arrow / direction */
.khe-impact-card--strategy .khe-brick--1{--brick-top:#ffd87a;--brick-bottom:#ffb938;width:60px;height:28px;left:18px;top:122px;--intro-x:-48px;--intro-y:26px;--intro-r:-18deg;--scatter-x:-64px;--scatter-y:18px;--scatter-r:-26deg;}
.khe-impact-card--strategy .khe-brick--2{--brick-top:#ffd87a;--brick-bottom:#ffb938;width:60px;height:28px;left:78px;top:122px;--intro-x:44px;--intro-y:28px;--intro-r:18deg;--scatter-x:60px;--scatter-y:20px;--scatter-r:26deg;}
.khe-impact-card--strategy .khe-brick--3{--brick-top:#7ec7ff;--brick-bottom:#398cf8;width:50px;height:28px;left:48px;top:92px;--intro-x:-18px;--intro-y:8px;--intro-r:-14deg;--scatter-x:-22px;--scatter-y:4px;--scatter-r:-22deg;}
.khe-impact-card--strategy .khe-brick--4{--brick-top:#cbff6f;--brick-bottom:#8bd93f;width:50px;height:28px;left:98px;top:92px;--intro-x:28px;--intro-y:10px;--intro-r:14deg;--scatter-x:34px;--scatter-y:6px;--scatter-r:24deg;}
.khe-impact-card--strategy .khe-brick--5{--brick-top:#ff8b69;--brick-bottom:#ff5c35;width:44px;height:26px;left:74px;top:62px;--intro-x:0px;--intro-y:-26px;--intro-r:0deg;--scatter-x:0px;--scatter-y:-34px;--scatter-r:0deg;}
.khe-impact-card--strategy .khe-brick--6{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:34px;height:22px;left:66px;top:34px;--intro-x:-16px;--intro-y:-66px;--intro-r:-12deg;--scatter-x:-22px;--scatter-y:-76px;--scatter-r:-18deg;}
.khe-impact-card--strategy .khe-brick--7{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:34px;height:22px;left:100px;top:34px;--intro-x:18px;--intro-y:-64px;--intro-r:12deg;--scatter-x:24px;--scatter-y:-76px;--scatter-r:18deg;}
.khe-impact-card--strategy .khe-brick--8{--brick-top:#c9b4ff;--brick-bottom:#8c64ff;width:28px;height:20px;left:86px;top:10px;--intro-x:0px;--intro-y:-84px;--intro-r:0deg;--scatter-x:0px;--scatter-y:-90px;--scatter-r:8deg;}

/* Brands build — clustered mosaic */
.khe-impact-card--brands .khe-brick--1{--brick-top:#ff8b69;--brick-bottom:#ff5c35;width:64px;height:30px;left:16px;top:104px;--intro-x:-56px;--intro-y:22px;--intro-r:-18deg;--scatter-x:-70px;--scatter-y:14px;--scatter-r:-28deg;}
.khe-impact-card--brands .khe-brick--2{--brick-top:#7ec7ff;--brick-bottom:#398cf8;width:48px;height:30px;left:82px;top:104px;--intro-x:20px;--intro-y:28px;--intro-r:12deg;--scatter-x:24px;--scatter-y:20px;--scatter-r:20deg;}
.khe-impact-card--brands .khe-brick--3{--brick-top:#cbff6f;--brick-bottom:#8bd93f;width:40px;height:28px;left:132px;top:104px;--intro-x:66px;--intro-y:24px;--intro-r:18deg;--scatter-x:78px;--scatter-y:18px;--scatter-r:26deg;}
.khe-impact-card--brands .khe-brick--4{--brick-top:#c9b4ff;--brick-bottom:#8c64ff;width:52px;height:28px;left:28px;top:74px;--intro-x:-44px;--intro-y:-10px;--intro-r:-14deg;--scatter-x:-54px;--scatter-y:-14px;--scatter-r:-22deg;}
.khe-impact-card--brands .khe-brick--5{--brick-top:#ffd87a;--brick-bottom:#ffb938;width:60px;height:28px;left:80px;top:74px;--intro-x:24px;--intro-y:-6px;--intro-r:16deg;--scatter-x:30px;--scatter-y:-10px;--scatter-r:24deg;}
.khe-impact-card--brands .khe-brick--6{--brick-top:#ffcfde;--brick-bottom:#ff74a2;width:38px;height:24px;left:16px;top:46px;--intro-x:-36px;--intro-y:-42px;--intro-r:-16deg;--scatter-x:-46px;--scatter-y:-50px;--scatter-r:-24deg;}
.khe-impact-card--brands .khe-brick--7{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:38px;height:24px;left:56px;top:42px;--intro-x:-2px;--intro-y:-54px;--intro-r:-8deg;--scatter-x:-4px;--scatter-y:-64px;--scatter-r:-14deg;}
.khe-impact-card--brands .khe-brick--8{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:52px;height:24px;left:94px;top:38px;--intro-x:38px;--intro-y:-56px;--intro-r:10deg;--scatter-x:48px;--scatter-y:-66px;--scatter-r:18deg;}

.khe-brick--6::before,
.khe-brick--7::before,
.khe-brick--8::before { left: 50%; right: auto; width: 12px; transform: translateX(-50%) perspective(120px) rotateX(58deg); }

@media (max-width: 1000px) {
	.khe-impact-card { grid-template-columns: 184px 1fr; }
}
@media (max-width: 720px) {
	.khe-impact-card { grid-template-columns: 1fr; }
}


/* v1.5 — interactive CV slider replacing How I Work */
.khe-resume {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(circle at 82% 18%, rgba(142,197,255,.18), transparent 30%),
		linear-gradient(180deg, #f3f0e8 0%, #ebe5da 100%);
}

.khe-resume::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(var(--khe-border) 1px, transparent 1px),
		linear-gradient(90deg, var(--khe-border) 1px, transparent 1px);
	background-size: 72px 72px;
	opacity: .18;
	pointer-events: none;
}

.khe-resume .khe-shell { position: relative; z-index: 2; }

.khe-resume-head {
	display: flex;
	justify-content: space-between;
	align-items: end;
	gap: 36px;
	margin-bottom: 54px;
}

.khe-resume-head h2 {
	max-width: 980px;
	margin: 18px 0 0;
	font-size: clamp(2.7rem, 5.9vw, 5.95rem);
	line-height: .92;
	letter-spacing: -.06em;
}

.khe-resume-controls {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-shrink: 0;
}

.khe-resume-arrow {
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	border: 1px solid var(--khe-text);
	background: transparent;
	color: var(--khe-text);
	font-size: 1.4rem;
	cursor: pointer;
	transition: transform .2s ease, background .2s ease, color .2s ease;
}

.khe-resume-arrow:hover {
	background: var(--khe-text);
	color: white;
	transform: translateY(-3px);
}

.khe-resume-counter {
	min-width: 72px;
	text-align: center;
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .1em;
}

.khe-resume-stage {
	position: relative;
	overflow: hidden;
	border: 1px solid var(--khe-text);
	background: rgba(255,255,255,.42);
	box-shadow: 14px 14px 0 rgba(21,21,21,.08);
}

.khe-resume-track {
	display: flex;
	width: 200%;
	transition: transform .8s cubic-bezier(.16,1,.3,1);
}

.khe-resume-slide {
	width: 50%;
	display: grid;
	grid-template-columns: minmax(220px, .7fr) minmax(0, 2.3fr);
	gap: clamp(34px, 5vw, 80px);
	padding: clamp(28px, 5vw, 72px);
	opacity: .35;
	transform: scale(.985);
	transition: opacity .5s ease, transform .6s ease;
}

.khe-resume-slide.is-active {
	opacity: 1;
	transform: scale(1);
}

.khe-resume-slide-label {
	position: sticky;
	top: 120px;
	align-self: start;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.khe-resume-slide-label span {
	font-size: .8rem;
	font-weight: 900;
	letter-spacing: .14em;
}

.khe-resume-slide-label strong {
	font-size: clamp(2.4rem, 4.6vw, 5rem);
	line-height: .92;
	letter-spacing: -.055em;
}

.khe-resume-items {
	border-top: 1px solid var(--khe-border);
}

.khe-resume-item {
	position: relative;
	display: grid;
	grid-template-columns: 150px minmax(0, 1.4fr) minmax(220px, .9fr);
	gap: 24px;
	align-items: center;
	padding: 24px 0;
	border-bottom: 1px solid var(--khe-border);
	transition: padding-left .25s ease, background .25s ease;
}

.khe-resume-item:hover {
	padding-left: 18px;
	background: rgba(255,255,255,.54);
}

.khe-resume-item::before {
	content: "";
	position: absolute;
	left: -8px;
	top: 50%;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--khe-accent);
	transform: translateY(-50%) scale(0);
	transition: transform .2s ease;
}

.khe-resume-item:hover::before { transform: translateY(-50%) scale(1); }

.khe-resume-item > span {
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--khe-muted);
}

.khe-resume-item h3 {
	margin: 0;
	font-size: clamp(1.35rem, 2.2vw, 2.3rem);
	line-height: 1.08;
	letter-spacing: -.03em;
}

.khe-resume-item p {
	margin: 0;
	color: var(--khe-muted);
	line-height: 1.5;
}

.khe-resume-stage.is-transitioning .khe-resume-slide.is-active .khe-resume-item {
	animation: khe-resume-item-in .55s cubic-bezier(.16,1,.3,1) both;
}

.khe-resume-stage.is-transitioning .khe-resume-slide.is-active .khe-resume-item:nth-child(2) { animation-delay: .05s; }
.khe-resume-stage.is-transitioning .khe-resume-slide.is-active .khe-resume-item:nth-child(3) { animation-delay: .1s; }
.khe-resume-stage.is-transitioning .khe-resume-slide.is-active .khe-resume-item:nth-child(4) { animation-delay: .15s; }
.khe-resume-stage.is-transitioning .khe-resume-slide.is-active .khe-resume-item:nth-child(5) { animation-delay: .2s; }

@keyframes khe-resume-item-in {
	from { opacity: 0; transform: translateX(28px); }
	to { opacity: 1; transform: translateX(0); }
}

@media (max-width: 1000px) {
	.khe-resume-head { align-items: flex-start; flex-direction: column; }
	.khe-resume-slide { grid-template-columns: 1fr; }
	.khe-resume-slide-label { position: relative; top: auto; }
	.khe-resume-item { grid-template-columns: 120px 1fr; }
	.khe-resume-item p { grid-column: 2; }
}

@media (max-width: 720px) {
	.khe-resume-controls { width: 100%; justify-content: space-between; }
	.khe-resume-slide { padding: 24px; }
	.khe-resume-item { grid-template-columns: 1fr; gap: 8px; }
	.khe-resume-item p { grid-column: 1; }
}


/* v1.6 — impact bricks become simple object builds */
.khe-impact-card {
	grid-template-columns: 210px 1fr;
}

.khe-impact-bricks-wrap {
	min-height: 220px;
}

.khe-impact-bricks {
	width: 176px;
	height: 176px;
}

.khe-brick {
	transition: transform .78s cubic-bezier(.22,1,.36,1), opacity .62s ease, box-shadow .3s ease, filter .3s ease;
}

/* 01 — HOUSE */
.khe-impact-card--budget .khe-brick--1{--brick-top:#ffb64b;--brick-bottom:#ff8f1f;width:62px;height:28px;left:24px;top:122px;--intro-x:-54px;--intro-y:26px;--intro-r:-20deg;--scatter-x:-72px;--scatter-y:22px;--scatter-r:-30deg;}
.khe-impact-card--budget .khe-brick--2{--brick-top:#ffd36b;--brick-bottom:#ffb938;width:62px;height:28px;left:86px;top:122px;--intro-x:52px;--intro-y:28px;--intro-r:18deg;--scatter-x:70px;--scatter-y:24px;--scatter-r:28deg;}
.khe-impact-card--budget .khe-brick--3{--brick-top:#7ec7ff;--brick-bottom:#398cf8;width:52px;height:26px;left:30px;top:94px;--intro-x:-60px;--intro-y:6px;--intro-r:-18deg;--scatter-x:-78px;--scatter-y:2px;--scatter-r:-28deg;}
.khe-impact-card--budget .khe-brick--4{--brick-top:#cbff6f;--brick-bottom:#8bd93f;width:52px;height:26px;left:88px;top:94px;--intro-x:60px;--intro-y:8px;--intro-r:18deg;--scatter-x:78px;--scatter-y:4px;--scatter-r:28deg;}
.khe-impact-card--budget .khe-brick--5{--brick-top:#ff8b69;--brick-bottom:#ff5c35;width:68px;height:24px;left:22px;top:66px;--intro-x:-42px;--intro-y:-44px;--intro-r:-24deg;--scatter-x:-60px;--scatter-y:-52px;--scatter-r:-38deg;}
.khe-impact-card--budget .khe-brick--6{--brick-top:#ff8b69;--brick-bottom:#ff5c35;width:68px;height:24px;left:84px;top:66px;--intro-x:42px;--intro-y:-44px;--intro-r:24deg;--scatter-x:60px;--scatter-y:-52px;--scatter-r:38deg;}
.khe-impact-card--budget .khe-brick--7{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:22px;height:34px;left:76px;top:116px;--intro-x:0px;--intro-y:54px;--intro-r:0deg;--scatter-x:0px;--scatter-y:72px;--scatter-r:10deg;}
.khe-impact-card--budget .khe-brick--8{--brick-top:#c9b4ff;--brick-bottom:#8c64ff;width:22px;height:22px;left:118px;top:44px;--intro-x:42px;--intro-y:-60px;--intro-r:18deg;--scatter-x:58px;--scatter-y:-76px;--scatter-r:28deg;}

/* 02 — HAMMER */
.khe-impact-card--web .khe-brick--1{--brick-top:#ffd87a;--brick-bottom:#ffb938;width:24px;height:40px;left:70px;top:112px;--intro-x:-20px;--intro-y:40px;--intro-r:-10deg;--scatter-x:-28px;--scatter-y:54px;--scatter-r:-18deg;}
.khe-impact-card--web .khe-brick--2{--brick-top:#ffd87a;--brick-bottom:#ffb938;width:24px;height:40px;left:70px;top:74px;--intro-x:-6px;--intro-y:10px;--intro-r:-6deg;--scatter-x:-10px;--scatter-y:10px;--scatter-r:-14deg;}
.khe-impact-card--web .khe-brick--3{--brick-top:#ffd87a;--brick-bottom:#ffb938;width:24px;height:32px;left:70px;top:42px;--intro-x:12px;--intro-y:-24px;--intro-r:6deg;--scatter-x:16px;--scatter-y:-34px;--scatter-r:14deg;}
.khe-impact-card--web .khe-brick--4{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:74px;height:26px;left:30px;top:24px;--intro-x:-52px;--intro-y:-40px;--intro-r:-20deg;--scatter-x:-70px;--scatter-y:-52px;--scatter-r:-28deg;}
.khe-impact-card--web .khe-brick--5{--brick-top:#7ec7ff;--brick-bottom:#398cf8;width:54px;height:26px;left:102px;top:24px;--intro-x:56px;--intro-y:-42px;--intro-r:22deg;--scatter-x:76px;--scatter-y:-54px;--scatter-r:34deg;}
.khe-impact-card--web .khe-brick--6{--brick-top:#ff8b69;--brick-bottom:#ff5c35;width:24px;height:22px;left:124px;top:50px;--intro-x:58px;--intro-y:-10px;--intro-r:18deg;--scatter-x:76px;--scatter-y:-12px;--scatter-r:30deg;}
.khe-impact-card--web .khe-brick--7{--brick-top:#cbff6f;--brick-bottom:#8bd93f;width:34px;height:20px;left:52px;top:154px;--intro-x:-40px;--intro-y:46px;--intro-r:-14deg;--scatter-x:-56px;--scatter-y:58px;--scatter-r:-22deg;}
.khe-impact-card--web .khe-brick--8{--brick-top:#c9b4ff;--brick-bottom:#8c64ff;width:34px;height:20px;left:88px;top:154px;--intro-x:40px;--intro-y:46px;--intro-r:14deg;--scatter-x:56px;--scatter-y:58px;--scatter-r:22deg;}

/* 03 — CAR */
.khe-impact-card--strategy .khe-brick--1{--brick-top:#ff8b69;--brick-bottom:#ff5c35;width:74px;height:28px;left:18px;top:112px;--intro-x:-60px;--intro-y:24px;--intro-r:-18deg;--scatter-x:-78px;--scatter-y:22px;--scatter-r:-28deg;}
.khe-impact-card--strategy .khe-brick--2{--brick-top:#ffd87a;--brick-bottom:#ffb938;width:58px;height:28px;left:92px;top:112px;--intro-x:48px;--intro-y:24px;--intro-r:16deg;--scatter-x:68px;--scatter-y:20px;--scatter-r:24deg;}
.khe-impact-card--strategy .khe-brick--3{--brick-top:#7ec7ff;--brick-bottom:#398cf8;width:44px;height:24px;left:42px;top:86px;--intro-x:-30px;--intro-y:-10px;--intro-r:-12deg;--scatter-x:-44px;--scatter-y:-16px;--scatter-r:-22deg;}
.khe-impact-card--strategy .khe-brick--4{--brick-top:#cbff6f;--brick-bottom:#8bd93f;width:44px;height:24px;left:86px;top:86px;--intro-x:30px;--intro-y:-10px;--intro-r:12deg;--scatter-x:44px;--scatter-y:-16px;--scatter-r:22deg;}
.khe-impact-card--strategy .khe-brick--5{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:26px;height:26px;left:30px;top:142px;--intro-x:-26px;--intro-y:38px;--intro-r:-16deg;--scatter-x:-44px;--scatter-y:48px;--scatter-r:-26deg;}
.khe-impact-card--strategy .khe-brick--6{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:26px;height:26px;left:112px;top:142px;--intro-x:26px;--intro-y:38px;--intro-r:16deg;--scatter-x:44px;--scatter-y:48px;--scatter-r:26deg;}
.khe-impact-card--strategy .khe-brick--7{--brick-top:#c9b4ff;--brick-bottom:#8c64ff;width:22px;height:20px;left:12px;top:116px;--intro-x:-54px;--intro-y:10px;--intro-r:-18deg;--scatter-x:-72px;--scatter-y:10px;--scatter-r:-28deg;}
.khe-impact-card--strategy .khe-brick--8{--brick-top:#c9b4ff;--brick-bottom:#8c64ff;width:22px;height:20px;left:136px;top:116px;--intro-x:54px;--intro-y:10px;--intro-r:18deg;--scatter-x:72px;--scatter-y:10px;--scatter-r:28deg;}

/* 04 — TREE */
.khe-impact-card--brands .khe-brick--1{--brick-top:#ffb64b;--brick-bottom:#a85d10;width:22px;height:40px;left:76px;top:118px;--intro-x:0px;--intro-y:42px;--intro-r:0deg;--scatter-x:0px;--scatter-y:58px;--scatter-r:10deg;}
.khe-impact-card--brands .khe-brick--2{--brick-top:#ffb64b;--brick-bottom:#a85d10;width:22px;height:28px;left:76px;top:92px;--intro-x:0px;--intro-y:12px;--intro-r:0deg;--scatter-x:0px;--scatter-y:18px;--scatter-r:8deg;}
.khe-impact-card--brands .khe-brick--3{--brick-top:#cbff6f;--brick-bottom:#8bd93f;width:58px;height:28px;left:28px;top:66px;--intro-x:-50px;--intro-y:-20px;--intro-r:-16deg;--scatter-x:-68px;--scatter-y:-28px;--scatter-r:-24deg;}
.khe-impact-card--brands .khe-brick--4{--brick-top:#7ec7ff;--brick-bottom:#398cf8;width:58px;height:28px;left:86px;top:66px;--intro-x:50px;--intro-y:-20px;--intro-r:16deg;--scatter-x:68px;--scatter-y:-28px;--scatter-r:24deg;}
.khe-impact-card--brands .khe-brick--5{--brick-top:#cbff6f;--brick-bottom:#8bd93f;width:46px;height:26px;left:54px;top:38px;--intro-x:-20px;--intro-y:-56px;--intro-r:-8deg;--scatter-x:-24px;--scatter-y:-72px;--scatter-r:-18deg;}
.khe-impact-card--brands .khe-brick--6{--brick-top:#cbff6f;--brick-bottom:#8bd93f;width:46px;height:26px;left:98px;top:38px;--intro-x:26px;--intro-y:-54px;--intro-r:10deg;--scatter-x:34px;--scatter-y:-70px;--scatter-r:20deg;}
.khe-impact-card--brands .khe-brick--7{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:36px;height:22px;left:42px;top:16px;--intro-x:-30px;--intro-y:-78px;--intro-r:-12deg;--scatter-x:-44px;--scatter-y:-94px;--scatter-r:-22deg;}
.khe-impact-card--brands .khe-brick--8{--brick-top:#ffcfde;--brick-bottom:#ff74a2;width:36px;height:22px;left:94px;top:12px;--intro-x:32px;--intro-y:-82px;--intro-r:12deg;--scatter-x:46px;--scatter-y:-98px;--scatter-r:22deg;}

@media (max-width: 1000px) {
	.khe-impact-card { grid-template-columns: 184px 1fr; }
}

@media (max-width: 720px) {
	.khe-impact-card { grid-template-columns: 1fr; }
}


/* v1.7 — psychology/communication-focused service cards with stronger reveal */
.khe-service-grid {
	gap: 20px;
	perspective: 1400px;
}

.khe-service-card {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	min-height: 390px;
	padding: clamp(30px, 4vw, 56px);
	border: 1px solid rgba(14, 37, 67, .72);
	background: var(--khe-paper);
	box-shadow: 0 0 0 rgba(0,0,0,0);
	transition: transform .2s ease, border-color .3s ease, box-shadow .35s ease;
	opacity: 0;
	transform: translateY(34px) scale(.965);
}

.khe-service-card.is-visible {
	opacity: 1;
	transform: translateY(0) scale(1);
}

.khe-service-card::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(520px circle at var(--mx, 50%) var(--my, 50%), rgba(255,255,255,.18), transparent 42%),
		linear-gradient(135deg, rgba(255,255,255,.14), rgba(255,255,255,0) 42%);
	opacity: 0;
	transition: opacity .35s ease;
	z-index: 0;
}

.khe-service-card::after {
	content: "";
	position: absolute;
	top: -18%;
	left: -42%;
	width: 28%;
	height: 140%;
	background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.28), rgba(255,255,255,0));
	transform: rotate(18deg);
	opacity: 0;
	pointer-events: none;
	z-index: 1;
}

.khe-service-card.is-visible::after {
	opacity: 1;
	animation: khe-service-sheen 1.05s cubic-bezier(.22,1,.36,1) forwards;
}

.khe-service-card:nth-child(2).is-visible::after { animation-delay: .08s; }
.khe-service-card:nth-child(3).is-visible::after { animation-delay: .16s; }
.khe-service-card:nth-child(4).is-visible::after { animation-delay: .24s; }

.khe-service-card > * {
	position: relative;
	z-index: 2;
}

.khe-service-card--light {
	background: #f3efe6;
	color: var(--khe-text);
}

.khe-service-card--dark {
	background: var(--khe-text);
	color: #f3efe6;
	border-color: rgba(243, 239, 230, .2);
}

.khe-service-card--accent { background: #f3efe6; }

.khe-service-card > span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 999px;
	border: 1px solid currentColor;
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .1em;
	margin-bottom: 12px;
}

.khe-service-card h3 {
	max-width: 9ch;
	margin: auto 0 18px;
	font-size: clamp(2.7rem, 5vw, 5rem);
	line-height: .92;
}

.khe-service-card p {
	max-width: 540px;
	font-size: 1.08rem;
	line-height: 1.58;
}

.khe-service-card em {
	margin-top: 30px;
	display: inline-block;
	padding-top: 18px;
	border-top: 1px solid currentColor;
}

.khe-service-card:hover {
	border-color: currentColor;
	box-shadow: 0 20px 50px rgba(4, 12, 24, .16);
}

.khe-service-card:hover::before {
	opacity: 1;
}

.khe-service-card:hover .khe-service-card__meta,
.khe-service-card:hover h3,
.khe-service-card:hover p,
.khe-service-card:hover em,
.khe-service-card:hover > span {
	transform: translateZ(22px);
}

.khe-service-card > span,
.khe-service-card h3,
.khe-service-card p,
.khe-service-card em {
	transition: transform .28s ease;
}

/* subtle inner patterns per card */
.khe-service-card--behaviour {
	background-image: linear-gradient(180deg, rgba(14,37,67,.03), rgba(14,37,67,0));
}
.khe-service-card--behaviour::selection { background: rgba(14,37,67,.18); }
.khe-service-card--behaviour .khe-card-orbit,
.khe-service-card--behaviour::marker { content: none; }
.khe-service-card--behaviour::before {
	background:
		radial-gradient(520px circle at var(--mx, 50%) var(--my, 50%), rgba(14,37,67,.10), transparent 42%),
		radial-gradient(circle at 78% 24%, rgba(14,37,67,.07) 0 9px, transparent 10px),
		radial-gradient(circle at 84% 30%, rgba(14,37,67,.05) 0 28px, transparent 29px),
		linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,0) 42%);
}

.khe-service-card--communication::before {
	background:
		radial-gradient(520px circle at var(--mx, 50%) var(--my, 50%), rgba(243,239,230,.12), transparent 42%),
		radial-gradient(circle at 80% 24%, rgba(243,239,230,.16) 0 12px, transparent 13px),
		radial-gradient(circle at 72% 30%, rgba(243,239,230,.08) 0 38px, transparent 39px),
		linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,0) 42%);
}

.khe-service-card--digital::before {
	background:
		radial-gradient(520px circle at var(--mx, 50%) var(--my, 50%), rgba(14,37,67,.10), transparent 42%),
		repeating-linear-gradient(0deg, rgba(14,37,67,.035) 0 2px, transparent 2px 18px),
		linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,0) 42%);
}

.khe-service-card--traditional::before {
	background:
		radial-gradient(520px circle at var(--mx, 50%) var(--my, 50%), rgba(243,239,230,.12), transparent 42%),
		linear-gradient(90deg, rgba(243,239,230,.06) 0 1px, transparent 1px 100%),
		linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,0) 42%);
	background-size: auto, 22px 22px, auto;
}

@keyframes khe-service-sheen {
	0% { transform: translateX(0) rotate(18deg); }
	100% { transform: translateX(520%) rotate(18deg); }
}

@media (max-width: 900px) {
	.khe-service-card {
		min-height: 330px;
	}
	.khe-service-card h3 {
		max-width: none;
	}
}


/* v1.7.1 — tighter service spacing + smaller titles */
.khe-services.khe-section {
	padding-top: clamp(72px, 8vw, 112px);
	padding-bottom: clamp(34px, 4.5vw, 64px);
}

.khe-services .khe-section-head {
	margin-bottom: 22px;
}

.khe-service-grid {
	gap: 18px;
}

.khe-service-card {
	min-height: 340px;
	padding: clamp(26px, 3.2vw, 46px);
}

.khe-service-card h3 {
	font-size: clamp(2.2rem, 3.85vw, 4.1rem);
	line-height: .94;
	letter-spacing: -.05em;
	max-width: 10.5ch;
	margin-bottom: 16px;
}

.khe-service-card p {
	font-size: 1rem;
	line-height: 1.48;
}

.khe-service-card em {
	margin-top: 22px;
	padding-top: 14px;
}

.khe-work.khe-section {
	padding-top: clamp(42px, 5vw, 72px);
}

@media (max-width: 1200px) {
	.khe-service-card h3 {
		font-size: clamp(2rem, 3.5vw, 3.6rem);
		max-width: 11ch;
	}
}

@media (max-width: 900px) {
	.khe-services.khe-section {
		padding-bottom: 42px;
	}
	.khe-service-card {
		min-height: 310px;
	}
	.khe-service-card h3 {
		font-size: clamp(2rem, 5vw, 3rem);
		max-width: none;
	}
}


/* v1.8 — hero refinement, starships and mascot logo */
.khe-cursor-orb {
	background: #264d86;
}

.khe-hero {
	padding: 28px 0 20px;
}

.khe-hero-inner {
	min-height: calc(100svh - 72px);
}

.khe-hero-topline {
	position: relative;
	z-index: 3;
}

.khe-hero-focus {
	max-width: 620px;
	margin: 18px 0 0;
	font-size: .95rem;
	font-weight: 700;
	line-height: 1.45;
	color: #264d86;
	letter-spacing: -.01em;
}

.khe-hero-title {
	max-width: min(1120px, 72%);
	margin: 54px 0 52px;
	font-size: clamp(3.35rem, 8vw, 8.4rem);
	line-height: .86;
}

.khe-line--accent {
	color: #264d86;
}

.khe-hero-bottom {
	max-width: 70%;
	grid-template-columns: minmax(0, 1.35fr) minmax(260px, .7fr);
	gap: 36px;
}

.khe-hero-bottom > p {
	font-size: clamp(1.05rem, 1.65vw, 1.72rem);
	max-width: 760px;
}

.khe-hero .khe-button:hover {
	box-shadow: 7px 7px 0 #264d86;
}

.khe-floating-ships {
	position: absolute;
	inset: 0;
	z-index: 2;
}

.khe-starship {
	position: absolute;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 11px 22px 11px 18px;
	min-width: 116px;
	border: 1px solid rgba(21, 21, 21, .46);
	border-radius: 999px 18px 18px 999px;
	background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(237,237,237,.94));
	box-shadow: 0 10px 22px rgba(21,21,21,.1), inset 0 1px 0 rgba(255,255,255,.8);
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	transform: rotate(var(--r));
	animation: khe-ship-float 6.5s ease-in-out infinite;
	filter: drop-shadow(0 0 10px rgba(38,77,134,.08));
}

.khe-starship > span {
	position: relative;
	z-index: 2;
}

.khe-starship::before {
	content: "";
	position: absolute;
	right: -13px;
	top: 50%;
	width: 18px;
	height: 18px;
	background: linear-gradient(135deg, #f8fbff, #d9e4f8);
	border-top: 1px solid rgba(21,21,21,.46);
	border-right: 1px solid rgba(21,21,21,.46);
	transform: translateY(-50%) rotate(45deg);
	border-radius: 3px;
}

.khe-starship::after {
	content: "";
	position: absolute;
	left: -18px;
	top: 50%;
	width: 22px;
	height: 12px;
	transform: translateY(-50%);
	background: radial-gradient(circle at 85% 50%, rgba(99,160,255,.85), rgba(99,160,255,0) 70%);
	filter: blur(1px);
	opacity: .9;
}

.khe-starship .khe-fin { display:none; }

.khe-tag--one { right: 7%; top: 23%; --r: 7deg; }
.khe-tag--two { left: 3%; top: 48%; --r: -10deg; animation-delay: -.9s; }
.khe-tag--three { right: 18%; bottom: 25%; --r: -6deg; animation-delay: -1.8s; }
.khe-tag--four { left: 34%; top: 14%; --r: 4deg; animation-delay: -2.6s; }

@keyframes khe-ship-float {
	0%, 100% { translate: 0 0; }
	25% { translate: 10px -10px; }
	50% { translate: 24px -4px; }
	75% { translate: 8px 9px; }
}

.khe-hero-mascot {
	position: absolute;
	right: clamp(8px, 3vw, 40px);
	bottom: 18px;
	width: min(22vw, 300px);
	min-width: 210px;
	z-index: 2;
	pointer-events: auto;
}

.khe-hero-mascot img {
	display: block;
	width: 100%;
	height: auto;
	filter: drop-shadow(0 18px 28px rgba(21,21,21,.12));
}

.khe-mascot-bulb {
	position: absolute;
	left: 10%;
	top: 3%;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: radial-gradient(circle at 38% 32%, #ffffff 0 16%, #f9f4cf 17%, #ecd477 52%, #d7ba4d 70%, rgba(215,186,77,.1) 100%);
	border: 2px solid rgba(21,21,21,.44);
	box-shadow: 0 0 0 rgba(237, 212, 109, 0);
	transition: box-shadow .28s ease, transform .28s ease, filter .28s ease;
	z-index: 3;
}

.khe-mascot-bulb::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 12px;
	width: 10px;
	height: 13px;
	border: 2px solid rgba(21,21,21,.6);
	border-top: 0;
	border-radius: 0 0 8px 8px;
	transform: translateX(-50%);
}

.khe-mascot-bulb::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -10px;
	width: 18px;
	height: 12px;
	background: linear-gradient(180deg, #5f636e, #2f323a);
	border-radius: 4px;
	transform: translateX(-50%);
	box-shadow: inset 0 2px 0 rgba(255,255,255,.22);
}

.khe-hero-mascot:hover .khe-mascot-bulb,
.khe-hero-mascot:focus-within .khe-mascot-bulb {
	transform: translateY(-2px) scale(1.06);
	box-shadow: 0 0 24px rgba(245, 221, 116, .78), 0 0 52px rgba(245, 221, 116, .42), 0 0 90px rgba(245,221,116,.22);
	filter: brightness(1.08);
	animation: khe-bulb-pulse 1.2s ease-in-out infinite alternate;
}

@keyframes khe-bulb-pulse {
	from { box-shadow: 0 0 24px rgba(245, 221, 116, .72), 0 0 52px rgba(245,221,116,.38), 0 0 90px rgba(245,221,116,.18); }
	to { box-shadow: 0 0 32px rgba(255, 232, 130, .95), 0 0 74px rgba(255,232,130,.5), 0 0 112px rgba(255,232,130,.28); }
}

@media (max-width: 1200px) {
	.khe-hero-title {
		max-width: 78%;
		font-size: clamp(3.1rem, 7.2vw, 7rem);
	}
	.khe-hero-bottom {
		max-width: 74%;
	}
	.khe-hero-mascot {
		width: min(24vw, 250px);
	}
}

@media (max-width: 900px) {
	.khe-hero-title,
	.khe-hero-bottom {
		max-width: 100%;
	}
	.khe-hero-mascot {
		position: relative;
		right: auto;
		bottom: auto;
		margin: 28px 0 0 auto;
		width: 220px;
	}
	.khe-hero-bottom {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 720px) {
	.khe-hero-focus {
		font-size: .9rem;
	}
	.khe-hero-title {
		font-size: clamp(3rem, 14vw, 5.8rem);
		margin-top: 70px;
	}
	.khe-starship {
		min-width: auto;
		padding: 9px 16px 9px 14px;
		font-size: .68rem;
	}
	.khe-tag--three,
	.khe-tag--four {
		display: inline-flex;
	}
}


/* v1.8.1 — transparent mascot, signature, star icons */
.khe-hero-signature {
	max-width: 460px;
	margin: 16px 0 0;
	font-family: "Brush Script MT", "Segoe Script", "Lucida Handwriting", cursive;
	font-size: clamp(1.55rem, 2.5vw, 2.35rem);
	line-height: 1;
	color: rgba(38, 77, 134, .78);
	letter-spacing: .01em;
	transform: rotate(-2.5deg);
	opacity: .92;
}

.khe-hero-focus { display: none; }

.khe-line--accent {
	color: #264d86;
}

.khe-floating-ships {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
}

.khe-starship {
	pointer-events: auto;
	position: absolute;
	display: inline-grid;
	place-items: center;
	width: 108px;
	height: 108px;
	padding: 18px;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	filter: drop-shadow(0 12px 22px rgba(14,37,67,.16));
	animation: khe-star-float 6.8s ease-in-out infinite;
	transition: transform .25s ease, filter .25s ease;
}

.khe-starship > span {
	position: relative;
	z-index: 2;
	display: inline-block;
	max-width: 74px;
	text-align: center;
	font-size: .74rem;
	line-height: 1.15;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--star-text, #0e2543);
}

.khe-starship::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--star-color, #dbe7ff);
	clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 94%, 50% 72%, 21% 94%, 32% 57%, 2% 35%, 39% 35%);
	border: 1px solid rgba(14,37,67,.22);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 10px 20px rgba(14,37,67,.12);
}

.khe-starship::after {
	content: "";
	position: absolute;
	inset: 18px;
	clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 94%, 50% 72%, 21% 94%, 32% 57%, 2% 35%, 39% 35%);
	background: linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,0));
	opacity: .68;
}

.khe-starship:hover {
	transform: rotate(var(--r)) translateY(-6px) scale(1.06);
	filter: drop-shadow(0 18px 28px rgba(14,37,67,.22));
}

.khe-starship:hover::before {
	background: var(--star-hover, #ffd7a1);
}

.khe-starship.khe-tag--one {
	--star-color: #dce8ff;
	--star-hover: #c4dafd;
	--star-text: #153760;
	right: 7%; top: 23%; --r: 6deg;
}
.khe-starship.khe-tag--two {
	--star-color: #dff5e6;
	--star-hover: #cdeed8;
	--star-text: #184a36;
	left: 4%; top: 49%; --r: -8deg; animation-delay: -.9s;
}
.khe-starship.khe-tag--three {
	--star-color: #f7e3f0;
	--star-hover: #f2d4e7;
	--star-text: #603256;
	right: 18%; bottom: 25%; --r: -5deg; animation-delay: -1.8s;
}
.khe-starship.khe-tag--four {
	--star-color: #fff0c9;
	--star-hover: #ffe4a1;
	--star-text: #694b00;
	left: 35%; top: 14%; --r: 4deg; animation-delay: -2.6s;
}

@keyframes khe-star-float {
	0%, 100% { translate: 0 0; }
	25% { translate: 8px -10px; }
	50% { translate: 16px -2px; }
	75% { translate: 4px 8px; }
}

.khe-hero-mascot {
	width: min(21vw, 265px);
	min-width: 180px;
	right: clamp(10px, 3vw, 38px);
	bottom: 6px;
}

.khe-hero-mascot img {
	background: transparent !important;
	filter: drop-shadow(0 18px 28px rgba(21,21,21,.12));
}

.khe-mascot-bulb {
	left: 12%;
	top: 3%;
}

@media (max-width: 1200px) {
	.khe-hero-mascot {
		width: min(22vw, 230px);
	}
}

@media (max-width: 900px) {
	.khe-hero-mascot {
		width: 200px;
	}
}

@media (max-width: 720px) {
	.khe-hero-signature {
		font-size: 1.5rem;
	}
	.khe-starship {
		width: 84px;
		height: 84px;
		padding: 12px;
	}
	.khe-starship > span {
		max-width: 60px;
		font-size: .62rem;
	}
}


/* v1.8.2 — cleaner mascot cutout + no wrapped star labels */
.khe-hero-mascot,
.khe-hero-mascot * {
	background: transparent !important;
}

.khe-hero-mascot img {
	mix-blend-mode: multiply;
	isolation: isolate;
}

.khe-starship {
	width: 124px;
	height: 124px;
	padding: 18px 14px;
}

.khe-starship > span {
	max-width: none;
	white-space: nowrap;
	font-size: .66rem;
	line-height: 1;
	letter-spacing: .07em;
}

.khe-starship.khe-tag--three > span,
.khe-starship.khe-tag--four > span {
	font-size: .6rem;
}

@media (max-width: 720px) {
	.khe-starship {
		width: 92px;
		height: 92px;
		padding: 10px;
	}
	.khe-starship > span,
	.khe-starship.khe-tag--three > span,
	.khe-starship.khe-tag--four > span {
		font-size: .5rem;
	}
}


/* v1.8.3 — use user-supplied transparent mascot + larger floating labels */
.khe-hero-mascot {
	width: min(22.5vw, 285px);
	min-width: 205px;
	right: clamp(12px, 3vw, 42px);
	bottom: 10px;
}

.khe-hero-mascot img {
	display: block;
	width: 100%;
	height: auto;
	background: transparent !important;
	mix-blend-mode: normal;
	image-rendering: auto;
}

.khe-starship {
	width: 132px;
	height: 132px;
	padding: 18px 12px;
}

.khe-starship > span {
	max-width: none;
	white-space: nowrap;
	font-size: .72rem;
	line-height: 1;
	letter-spacing: .075em;
}

.khe-starship.khe-tag--three > span,
.khe-starship.khe-tag--four > span {
	font-size: .66rem;
}

/* slightly rebalance the star positions after scaling */
.khe-starship.khe-tag--one {
	right: 6.5%;
	top: 21.5%;
}

.khe-starship.khe-tag--two {
	left: 3.5%;
	top: 47.5%;
}

.khe-starship.khe-tag--three {
	right: 16.5%;
	bottom: 22.5%;
}

.khe-starship.khe-tag--four {
	left: 33.5%;
	top: 12.5%;
}

@media (max-width: 1200px) {
	.khe-hero-mascot {
		width: min(23vw, 250px);
		min-width: 185px;
	}
	.khe-starship {
		width: 118px;
		height: 118px;
	}
	.khe-starship > span {
		font-size: .64rem;
	}
	.khe-starship.khe-tag--three > span,
	.khe-starship.khe-tag--four > span {
		font-size: .58rem;
	}
}

@media (max-width: 720px) {
	.khe-hero-mascot {
		width: 190px;
		min-width: 0;
	}
	.khe-starship {
		width: 96px;
		height: 96px;
		padding: 10px 8px;
	}
	.khe-starship > span {
		font-size: .52rem;
	}
	.khe-starship.khe-tag--three > span,
	.khe-starship.khe-tag--four > span {
		font-size: .47rem;
	}
}


/* v1.8.4 — hard cache-busted transparent mascot */
.khe-hero-mascot {
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	border: 0 !important;
	overflow: visible !important;
}

.khe-hero-mascot::before,
.khe-hero-mascot::after {
	display: none !important;
	content: none !important;
}

.khe-hero-mascot img {
	background: transparent !important;
	box-shadow: none !important;
	border: 0 !important;
	outline: 0 !important;
	border-radius: 0 !important;
	object-fit: contain;
}


/* v1.8.5 — larger mascot and re-positioned floating stars */
.khe-hero-mascot {
	width: min(26vw, 340px);
	min-width: 250px;
	right: clamp(18px, 4vw, 58px);
	bottom: 26px;
	z-index: 3;
}

.khe-hero-mascot img {
	filter: drop-shadow(0 18px 26px rgba(21,21,21,.10));
}

.khe-floating-ships {
	z-index: 2;
}

.khe-starship {
	width: 148px;
	height: 148px;
	padding: 18px 12px;
}

.khe-starship > span {
	font-size: .82rem;
	line-height: 1;
	white-space: nowrap;
	letter-spacing: .075em;
}

.khe-starship.khe-tag--three > span,
.khe-starship.khe-tag--four > span {
	font-size: .76rem;
}

/* move them so they visually land on the typography / mascot area */
.khe-starship.khe-tag--one {
	right: 9.5%;
	top: 19%;
}

.khe-starship.khe-tag--two {
	left: 2.5%;
	top: 48.5%;
}

.khe-starship.khe-tag--three {
	right: 11%;
	bottom: 22%;
}

.khe-starship.khe-tag--four {
	left: 38%;
	top: 11%;
}

@media (max-width: 1200px) {
	.khe-hero-mascot {
		width: min(25vw, 290px);
		min-width: 220px;
		right: 18px;
		bottom: 18px;
	}
	.khe-starship {
		width: 130px;
		height: 130px;
	}
	.khe-starship > span {
		font-size: .72rem;
	}
	.khe-starship.khe-tag--three > span,
	.khe-starship.khe-tag--four > span {
		font-size: .66rem;
	}
}

@media (max-width: 900px) {
	.khe-hero-mascot {
		width: 230px;
		min-width: 0;
		margin-top: 18px;
	}
	.khe-starship {
		width: 114px;
		height: 114px;
	}
	.khe-starship > span {
		font-size: .62rem;
	}
	.khe-starship.khe-tag--three > span,
	.khe-starship.khe-tag--four > span {
		font-size: .58rem;
	}
	.khe-starship.khe-tag--one {
		right: 7%;
		top: 23%;
	}
	.khe-starship.khe-tag--two {
		left: 2%;
		top: 49%;
	}
	.khe-starship.khe-tag--three {
		right: 8%;
		bottom: 26%;
	}
	.khe-starship.khe-tag--four {
		left: 35%;
		top: 14%;
	}
}

@media (max-width: 720px) {
	.khe-hero-mascot {
		width: 205px;
	}
	.khe-starship {
		width: 98px;
		height: 98px;
		padding: 10px 8px;
	}
	.khe-starship > span {
		font-size: .54rem;
	}
	.khe-starship.khe-tag--three > span,
	.khe-starship.khe-tag--four > span {
		font-size: .5rem;
	}
}


/* v1.9.1 — social bar replaces CV slider, hero restored */
.khe-social-bar-section {
	position: relative;
	overflow: hidden;
	padding-top: clamp(70px, 8vw, 118px);
	padding-bottom: clamp(70px, 8vw, 118px);
	background:
		radial-gradient(circle at 10% 20%, rgba(38,77,134,.08), transparent 26%),
		radial-gradient(circle at 90% 80%, rgba(255,95,65,.07), transparent 24%),
		var(--khe-paper);
}

.khe-social-bar-head {
	display: grid;
	grid-template-columns: minmax(0, 1.45fr) minmax(280px, .7fr);
	gap: clamp(24px, 5vw, 72px);
	align-items: end;
	margin-bottom: 34px;
}

.khe-social-bar-head h2 {
	margin: 12px 0 0;
	font-size: clamp(2.45rem, 5vw, 5.7rem);
	line-height: .94;
	letter-spacing: -.055em;
	max-width: 12ch;
}

.khe-social-bar-head > p {
	margin: 0;
	font-size: 1rem;
	line-height: 1.55;
	color: rgba(21,21,21,.66);
}

.khe-social-bar {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 18px;
	width: 100%;
	margin-inline: auto;
}

.khe-social-tile {
	--platform: #264d86;
	position: relative;
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 16px;
	min-height: 118px;
	padding: 22px;
	border-radius: 24px;
	border: 1px solid rgba(14,37,67,.14);
	background: rgba(255,255,255,.66);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	color: var(--khe-text);
	text-decoration: none;
	overflow: hidden;
	isolation: isolate;
	box-shadow: 0 14px 34px rgba(14,37,67,.08);
	transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}

.khe-social-tile::before {
	content: '';
	position: absolute;
	inset: -60%;
	background: conic-gradient(from 0deg, transparent 0 72%, color-mix(in srgb, var(--platform) 28%, transparent) 78%, transparent 84%);
	animation: khe-social-orbit 7s linear infinite;
	z-index: -2;
	opacity: .6;
}

.khe-social-tile::after {
	content: '';
	position: absolute;
	inset: 2px;
	border-radius: 22px;
	background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(246,244,239,.92));
	z-index: -1;
}

.khe-social-tile:hover,
.khe-social-tile:focus-visible {
	transform: translateY(-7px) scale(1.015);
	border-color: color-mix(in srgb, var(--platform) 45%, rgba(14,37,67,.18));
	box-shadow: 0 22px 48px rgba(14,37,67,.14), 0 0 0 1px color-mix(in srgb, var(--platform) 18%, transparent);
}

.khe-social-icon {
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	border-radius: 18px;
	background: color-mix(in srgb, var(--platform) 15%, white 85%);
	color: var(--platform);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 8px 20px color-mix(in srgb, var(--platform) 14%, transparent);
	transition: transform .32s ease, background .32s ease, color .32s ease;
}

.khe-social-icon svg {
	width: 28px;
	height: 28px;
	fill: currentColor;
	stroke: currentColor;
	stroke-width: 1.6;
}

.khe-social-tile:hover .khe-social-icon {
	transform: rotate(-8deg) scale(1.08);
	background: var(--platform);
	color: white;
}

.khe-social-tile-copy {
	display: flex;
	flex-direction: column;
	gap: 5px;
	min-width: 0;
}

.khe-social-tile-copy strong {
	font-size: 1.12rem;
	line-height: 1.1;
}

.khe-social-tile-copy small {
	font-size: .9rem;
	color: rgba(21,21,21,.62);
}

.khe-social-arrow {
	font-size: 1.3rem;
	transition: transform .25s ease;
}

.khe-social-tile:hover .khe-social-arrow {
	transform: translate(4px,-4px);
}

.khe-social-tile--facebook { --platform: #1877f2; }
.khe-social-tile--instagram { --platform: #d946ef; }
.khe-social-tile--tiktok { --platform: #111111; }
.khe-social-tile--linkedin { --platform: #0a66c2; }
.khe-social-tile--youtube { --platform: #ff0000; }

/* unique platform motion */
.khe-social-tile--facebook .khe-social-icon { animation: khe-fb-breathe 3.2s ease-in-out infinite; }
.khe-social-tile--instagram::before { animation-duration: 4.8s; }
.khe-social-tile--tiktok:hover .khe-social-icon { text-shadow: -3px 0 #25f4ee, 3px 0 #fe2c55; }
.khe-social-tile--linkedin:hover .khe-social-icon { transform: translateY(-4px) scale(1.08); }
.khe-social-tile--youtube:hover .khe-social-icon { animation: khe-yt-pulse .7s ease-in-out infinite alternate; }

@keyframes khe-social-orbit { to { transform: rotate(360deg); } }
@keyframes khe-fb-breathe { 50% { box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 0 24px rgba(24,119,242,.2); } }
@keyframes khe-yt-pulse { to { transform: scale(1.14); } }

@media (max-width: 900px) {
	.khe-social-bar-head { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
	.khe-social-bar { grid-template-columns: 1fr; }
	.khe-social-tile { min-height: 104px; }
}


/* v1.9.2 — Instagram icon fix + cleaner social header + richer subtle background */
.khe-social-bar-section {
	background:
		radial-gradient(circle at 12% 18%, rgba(38,77,134,.11), transparent 28%),
		radial-gradient(circle at 88% 24%, rgba(217,70,239,.07), transparent 24%),
		radial-gradient(circle at 76% 82%, rgba(255,120,90,.06), transparent 26%),
		linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,0) 32%),
		var(--khe-paper);
}

.khe-social-bar-section::before,
.khe-social-bar-section::after {
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.khe-social-bar-section::before {
	background-image:
		linear-gradient(rgba(14,37,67,.035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(14,37,67,.035) 1px, transparent 1px);
	background-size: 42px 42px;
	mask-image: linear-gradient(to bottom, transparent 0%, #000 16%, #000 84%, transparent 100%);
	opacity: .7;
}

.khe-social-bar-section::after {
	inset: 8% 5% auto auto;
	width: 210px;
	height: 210px;
	border-radius: 50%;
	border: 1px solid rgba(38,77,134,.08);
	box-shadow:
		0 0 0 34px rgba(38,77,134,.025),
		0 0 0 72px rgba(38,77,134,.018);
	opacity: .65;
}

.khe-social-bar-section .khe-shell {
	position: relative;
	z-index: 1;
}

.khe-social-bar-head {
	grid-template-columns: minmax(0, 1fr);
	margin-bottom: 30px;
}

.khe-social-bar-head h2 {
	max-width: 13ch;
}

.khe-social-icon svg {
	fill: currentColor;
	stroke: none;
}

.khe-social-tile--instagram .khe-social-icon {
	background:
		linear-gradient(135deg, rgba(245,133,41,.16), rgba(221,42,123,.18) 48%, rgba(129,52,175,.18));
}

.khe-social-tile--instagram:hover .khe-social-icon,
.khe-social-tile--instagram:focus-visible .khe-social-icon {
	background: linear-gradient(135deg, #f58529 0%, #dd2a7b 46%, #8134af 100%);
	color: #fff;
}


/* v1.9.3 — mobile-only hero mascot cleanup */
@media (max-width: 768px) {
	.khe-hero {
		overflow: hidden;
	}

	.khe-hero-inner {
		min-height: auto;
		display: flex;
		flex-direction: column;
	}

	.khe-hero-mascot {
		position: relative !important;
		right: auto !important;
		bottom: auto !important;
		left: auto !important;
		order: 4;
		width: min(62vw, 230px) !important;
		min-width: 0 !important;
		margin: 18px auto 8px !important;
		z-index: 2;
		transform: none !important;
	}

	.khe-hero-mascot img {
		width: 100%;
		height: auto;
		filter: drop-shadow(0 14px 22px rgba(21,21,21,.12));
	}

	.khe-mascot-bulb {
		width: 32px;
		height: 32px;
		left: 8%;
		top: 0;
	}

	.khe-hero-title {
		position: relative;
		z-index: 3;
	}

	.khe-hero-bottom {
		position: relative;
		z-index: 3;
	}
}

/* On very small screens the mascot starts to crowd the hero, so hide it cleanly. */
@media (max-width: 480px) {
	.khe-hero-mascot {
		display: none !important;
	}
}


/* v2.0.4 — compact five-column featured projects */
.khe-work .khe-section-head {
	margin-bottom: 34px;
}

.khe-work .khe-section-head h2 {
	max-width: 780px;
	font-size: clamp(2.9rem, 5.4vw, 5.9rem);
}

.khe-work .khe-projects {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 16px;
}

.khe-work .khe-project,
.khe-work .khe-project:nth-child(n) {
	position: relative;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	overflow: visible;
}

.khe-work .khe-project::before,
.khe-work .khe-project::after {
	display: none;
}

.khe-work .khe-project a,
.khe-work .khe-project:nth-child(even) a {
	display: flex;
	flex-direction: column;
	gap: 0;
	min-height: 100%;
	border-radius: 22px;
	background: rgba(255,255,255,.52);
	border: 1px solid rgba(16,32,54,.13);
	box-shadow: 0 10px 30px rgba(18,30,52,.06);
	overflow: hidden;
	transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease, border-color .35s ease;
}

.khe-work .khe-project:hover a {
	transform: translateY(-8px);
	box-shadow: 0 22px 48px rgba(18,30,52,.12);
	border-color: rgba(36,78,134,.28);
}

.khe-work .khe-project-image,
.khe-work .khe-project:nth-child(even) .khe-project-image {
	order: 1;
	position: relative;
	width: 100%;
	max-width: none;
	aspect-ratio: 4 / 5;
	margin: 0;
	border: 0;
	box-shadow: none;
	transform: none;
	background: #f7f4ed;
	overflow: hidden;
}

.khe-work .khe-project-image::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 55%, rgba(7,17,31,.24));
	opacity: .45;
	transition: opacity .35s ease;
}

.khe-work .khe-project:hover .khe-project-image {
	transform: none;
	box-shadow: none;
}

.khe-work .khe-project-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.001);
	transition: transform .7s cubic-bezier(.16,1,.3,1), filter .45s ease;
}

.khe-work .khe-project:hover .khe-project-image img {
	transform: scale(1.07);
	filter: saturate(1.06) contrast(1.02);
}

.khe-work .khe-project:hover .khe-project-image::after {
	opacity: .18;
}

.khe-work .khe-project-number {
	top: 14px;
	right: 14px;
	width: 44px;
	height: 44px;
	font-size: .78rem;
	background: rgba(248,246,241,.92);
	backdrop-filter: blur(8px);
	border: 1px solid rgba(16,32,54,.12);
	z-index: 2;
}

.khe-work .khe-project-copy,
.khe-work .khe-project:nth-child(even) .khe-project-copy {
	order: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	padding: 20px 18px 18px;
	min-height: 178px;
}

.khe-work .khe-project-meta {
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin: 0;
	gap: 8px;
}

.khe-work .khe-project-meta span {
	padding: 0;
	min-height: auto;
	border: 0;
	background: transparent;
	font-size: .63rem;
	letter-spacing: .11em;
	color: rgba(16,32,54,.58);
}

.khe-work .khe-project h3 {
	margin: 0;
	font-size: clamp(1.45rem, 2vw, 2rem);
	line-height: .95;
	letter-spacing: -.04em;
}

.khe-project-category {
	display: inline-flex;
	align-items: center;
	min-height: 28px;
	padding: 6px 10px;
	border-radius: 999px;
	background: rgba(36,78,134,.08);
	color: #244e86;
	font-size: .65rem;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.khe-work .khe-project p {
	display: none;
}

.khe-work .khe-project-cta {
	margin-top: auto;
	padding-bottom: 3px;
	font-size: .72rem;
	letter-spacing: .1em;
	border-bottom-width: 1px;
}

@media (max-width: 1280px) {
	.khe-work .khe-projects {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 820px) {
	.khe-work .khe-projects {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.khe-work .khe-projects {
		display: flex;
		overflow-x: auto;
		gap: 14px;
		padding-bottom: 10px;
		scroll-snap-type: x proximity;
	}

	.khe-work .khe-project {
		min-width: 78vw;
		scroll-snap-align: start;
	}
}


/* v2.0.5 — space backdrop for featured projects */
.khe-work {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	background:
		radial-gradient(circle at 18% 32%, rgba(72, 113, 173, .24), transparent 34%),
		radial-gradient(circle at 84% 22%, rgba(122, 84, 180, .16), transparent 30%),
		radial-gradient(circle at 72% 88%, rgba(255, 92, 53, .10), transparent 28%),
		linear-gradient(180deg, #07111f 0%, #02060c 100%);
	color: #f7f5ef;
}

.khe-work::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		radial-gradient(circle, rgba(255,255,255,.92) 0 1px, transparent 1.4px),
		radial-gradient(circle, rgba(255,255,255,.46) 0 1px, transparent 1.4px),
		radial-gradient(circle, rgba(139,190,255,.52) 0 1px, transparent 1.4px);
	background-size: 76px 76px, 118px 118px, 166px 166px;
	background-position: 10px 24px, 38px 8px, 18px 56px;
	opacity: .34;
	animation: khe-work-stars 38s linear infinite;
	z-index: -2;
}

.khe-work::after {
	content: "";
	position: absolute;
	width: 760px;
	height: 760px;
	right: -290px;
	top: -240px;
	border-radius: 50%;
	border: 1px solid rgba(255,255,255,.11);
	box-shadow:
		0 0 0 90px rgba(255,255,255,.025),
		0 0 0 180px rgba(255,255,255,.018);
	pointer-events: none;
	z-index: -1;
}

.khe-work .khe-shell {
	position: relative;
	z-index: 2;
}

.khe-work .khe-kicker,
.khe-work .khe-section-head h2,
.khe-work .khe-text-link {
	color: #f7f5ef;
}

.khe-work .khe-text-link {
	border-bottom-color: rgba(247,245,239,.72);
}

.khe-work .khe-project a,
.khe-work .khe-project:nth-child(even) a {
	background:
		linear-gradient(180deg, rgba(255,255,255,.96), rgba(244,246,250,.92));
	border-color: rgba(255,255,255,.28);
	box-shadow:
		0 18px 42px rgba(0,0,0,.28),
		inset 0 1px 0 rgba(255,255,255,.82);
}

.khe-work .khe-project:hover a {
	border-color: rgba(156,198,255,.52);
	box-shadow:
		0 26px 58px rgba(0,0,0,.34),
		0 0 36px rgba(91,147,224,.16);
}

.khe-work .khe-project h3,
.khe-work .khe-project-cta {
	color: #101f35;
}

.khe-work .khe-project-meta span {
	color: rgba(16,32,54,.58);
}

.khe-work .khe-project-category {
	background: rgba(36,78,134,.09);
	color: #244e86;
}

@keyframes khe-work-stars {
	from { background-position: 10px 24px, 38px 8px, 18px 56px; }
	to { background-position: 86px 100px, 156px 126px, 184px 222px; }
}

@media (prefers-reduced-motion: reduce) {
	.khe-work::before {
		animation: none;
	}
}


/* v2.0.6 — lighter space section + corrected text contrast */
.khe-work {
	background:
		radial-gradient(circle at 18% 30%, rgba(99, 148, 214, .32), transparent 36%),
		radial-gradient(circle at 82% 18%, rgba(135, 112, 210, .22), transparent 32%),
		radial-gradient(circle at 70% 86%, rgba(255, 124, 92, .12), transparent 30%),
		linear-gradient(180deg, #0e1b2d 0%, #091321 56%, #07101b 100%);
	color: #f8fbff;
}

.khe-work::before {
	opacity: .46;
}

.khe-work::after {
	border-color: rgba(255,255,255,.16);
	box-shadow:
		0 0 0 90px rgba(255,255,255,.035),
		0 0 0 180px rgba(255,255,255,.024);
}

.khe-work .khe-kicker {
	color: rgba(247,250,255,.92) !important;
}

.khe-work .khe-section-head h2 {
	color: #f8fbff !important;
	text-shadow: 0 2px 18px rgba(0,0,0,.22);
}

.khe-work .khe-text-link {
	color: #ffffff !important;
	border-bottom-color: rgba(255,255,255,.86) !important;
	text-shadow: 0 1px 10px rgba(0,0,0,.22);
}

.khe-work .khe-text-link:hover {
	color: #cfe1ff !important;
	border-bottom-color: #cfe1ff !important;
}

/* Make sure no inherited dark heading color wins */
.khe-work h2,
.khe-work .khe-section-title,
.khe-work .khe-section-head * {
	color: #f8fbff;
}

@media (max-width: 720px) {
	.khe-work {
		background:
			radial-gradient(circle at 20% 22%, rgba(99, 148, 214, .28), transparent 38%),
			radial-gradient(circle at 86% 12%, rgba(135, 112, 210, .18), transparent 34%),
			linear-gradient(180deg, #102036 0%, #0a1627 100%);
	}
}


/* v2.0.7 — smaller featured project cards only on phones */
@media (max-width: 560px) {
	.khe-work .khe-projects {
		gap: 12px;
		padding: 0 18px 12px 0;
		scroll-padding-left: 0;
	}

	.khe-work .khe-project {
		flex: 0 0 auto;
		min-width: 64vw;
		width: 64vw;
		max-width: 286px;
	}

	.khe-work .khe-project a,
	.khe-work .khe-project:nth-child(even) a {
		border-radius: 18px;
	}

	.khe-work .khe-project-image,
	.khe-work .khe-project:nth-child(even) .khe-project-image {
		aspect-ratio: 4 / 3;
		min-height: 0;
	}

	.khe-work .khe-project-image img {
		object-fit: contain;
		padding: 12px;
		background: #f7f7f5;
	}

	.khe-work .khe-project-number {
		top: 10px;
		right: 10px;
		width: 36px;
		height: 36px;
		font-size: .68rem;
	}

	.khe-work .khe-project-copy,
	.khe-work .khe-project:nth-child(even) .khe-project-copy {
		gap: 9px;
		min-height: 150px;
		padding: 15px 14px 14px;
	}

	.khe-work .khe-project-meta {
		gap: 6px;
	}

	.khe-work .khe-project-meta span {
		font-size: .55rem;
		letter-spacing: .09em;
	}

	.khe-work .khe-project h3 {
		font-size: 1.28rem;
		line-height: 1;
	}

	.khe-project-category {
		min-height: 24px;
		padding: 5px 8px;
		font-size: .56rem;
	}

	.khe-work .khe-project-cta {
		font-size: .62rem;
		letter-spacing: .09em;
	}

	.khe-work .khe-project:hover a {
		transform: none;
	}
}

@media (max-width: 380px) {
	.khe-work .khe-project {
		min-width: 70vw;
		width: 70vw;
		max-width: 250px;
	}
}


/* v2.1.5 — astronaut moon mascot with hover moon glow */
.khe-hero-mascot--astronaut {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
	overflow: visible !important;
	width: min(29vw, 390px);
	min-width: 270px;
	right: clamp(24px, 4vw, 68px);
	bottom: 14px;
	isolation: isolate;
}

.khe-hero-mascot--astronaut::before,
.khe-hero-mascot--astronaut::after {
	content: "";
	position: absolute;
	pointer-events: none;
	transition: opacity .35s ease, transform .35s ease, filter .35s ease;
}

.khe-hero-mascot--astronaut::before {
	left: 4%;
	bottom: 6%;
	width: 58%;
	height: 58%;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255, 223, 102, 0.42) 0%, rgba(255, 201, 92, 0.22) 38%, rgba(255, 180, 68, 0.10) 58%, rgba(255, 180, 68, 0) 76%);
	filter: blur(22px);
	opacity: .22;
	transform: scale(.9);
	z-index: 0;
}

.khe-hero-mascot--astronaut::after {
	left: 16%;
	top: 10%;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255,255,255,.92) 0%, rgba(184,224,255,.78) 42%, rgba(184,224,255,0) 76%);
	box-shadow: 0 0 18px rgba(184,224,255,.45);
	opacity: .7;
	z-index: 0;
}

.khe-hero-mascot--astronaut img {
	display: block;
	width: 100%;
	height: auto;
	background: transparent !important;
	position: relative;
	z-index: 2;
	filter: drop-shadow(0 16px 28px rgba(10, 16, 40, 0.16));
	transition: transform .35s ease, filter .35s ease;
}

.khe-hero-mascot--astronaut:hover::before,
.khe-hero-mascot--astronaut:focus-within::before {
	opacity: .7;
	transform: scale(1.08);
	filter: blur(28px);
}

.khe-hero-mascot--astronaut:hover img,
.khe-hero-mascot--astronaut:focus-within img {
	transform: translateY(-5px) scale(1.015);
	filter: drop-shadow(0 16px 28px rgba(10, 16, 40, 0.16)) drop-shadow(0 0 18px rgba(255, 224, 108, 0.35)) drop-shadow(-8px 10px 28px rgba(255, 196, 73, 0.24));
}

.khe-mascot-bulb {
	display: none !important;
}

@media (max-width: 1200px) {
	.khe-hero-mascot--astronaut {
		width: min(27vw, 330px);
		min-width: 230px;
		right: 18px;
	}
}

@media (max-width: 900px) {
	.khe-hero-mascot--astronaut {
		width: 250px;
		min-width: 0;
	}
}

@media (max-width: 768px) {
	.khe-hero-mascot--astronaut {
		width: min(68vw, 270px) !important;
		margin: 20px auto 10px !important;
		right: auto !important;
		bottom: auto !important;
	}
}


/* v2.1.6 — stronger moon glow + hover stars */
.khe-hero-mascot--astronaut {
	position: relative;
}

.khe-hero-mascot--astronaut .khe-mascot-stars,
.khe-hero-mascot--astronaut .khe-mascot-stars::before,
.khe-hero-mascot--astronaut .khe-mascot-stars::after {
	content: "";
	position: absolute;
	opacity: 0;
	pointer-events: none;
	transition: opacity .3s ease, transform .35s ease, filter .35s ease;
	z-index: 1;
}

.khe-hero-mascot--astronaut .khe-mascot-stars {
	left: 9%;
	top: 17%;
	width: 12px;
	height: 12px;
	background: radial-gradient(circle, rgba(255,255,255,.98) 0%, rgba(255,247,196,.92) 18%, rgba(255,233,134,.55) 44%, rgba(255,233,134,0) 72%);
	clip-path: polygon(50% 0%, 61% 37%, 100% 50%, 61% 63%, 50% 100%, 39% 63%, 0% 50%, 39% 37%);
	filter: drop-shadow(0 0 12px rgba(255, 228, 118, .55));
	transform: scale(.4) translateY(8px);
}

.khe-hero-mascot--astronaut .khe-mascot-stars::before {
	left: 178px;
	top: 44px;
	width: 10px;
	height: 10px;
	background: radial-gradient(circle, rgba(255,255,255,.96) 0%, rgba(198,232,255,.8) 26%, rgba(198,232,255,0) 72%);
	clip-path: polygon(50% 0%, 61% 37%, 100% 50%, 61% 63%, 50% 100%, 39% 63%, 0% 50%, 39% 37%);
	filter: drop-shadow(0 0 10px rgba(198,232,255,.55));
	transform: scale(.5) rotate(14deg);
}

.khe-hero-mascot--astronaut .khe-mascot-stars::after {
	left: 96px;
	top: 166px;
	width: 8px;
	height: 8px;
	background: radial-gradient(circle, rgba(255,255,255,.96) 0%, rgba(255,220,122,.85) 24%, rgba(255,220,122,0) 72%);
	clip-path: polygon(50% 0%, 61% 37%, 100% 50%, 61% 63%, 50% 100%, 39% 63%, 0% 50%, 39% 37%);
	filter: drop-shadow(0 0 10px rgba(255,220,122,.5));
	transform: scale(.45) rotate(-8deg);
}

.khe-hero-mascot--astronaut::before {
	background: radial-gradient(circle, rgba(255, 241, 167, 0.7) 0%, rgba(255, 214, 92, 0.38) 28%, rgba(255, 188, 71, 0.18) 48%, rgba(255, 188, 71, 0.08) 60%, rgba(255, 188, 71, 0) 80%);
	filter: blur(26px);
	opacity: .32;
}

.khe-hero-mascot--astronaut:hover::before,
.khe-hero-mascot--astronaut:focus-within::before {
	opacity: .98;
	transform: scale(1.18);
	filter: blur(34px);
}

.khe-hero-mascot--astronaut:hover .khe-mascot-stars,
.khe-hero-mascot--astronaut:focus-within .khe-mascot-stars,
.khe-hero-mascot--astronaut:hover .khe-mascot-stars::before,
.khe-hero-mascot--astronaut:focus-within .khe-mascot-stars::before,
.khe-hero-mascot--astronaut:hover .khe-mascot-stars::after,
.khe-hero-mascot--astronaut:focus-within .khe-mascot-stars::after {
	opacity: 1;
}

.khe-hero-mascot--astronaut:hover .khe-mascot-stars,
.khe-hero-mascot--astronaut:focus-within .khe-mascot-stars {
	transform: scale(1) translateY(0);
	animation: kheAstronautStarPulse 1.9s ease-in-out infinite alternate;
}

.khe-hero-mascot--astronaut:hover .khe-mascot-stars::before,
.khe-hero-mascot--astronaut:focus-within .khe-mascot-stars::before {
	animation: kheAstronautStarPulse2 2.3s ease-in-out infinite alternate;
}

.khe-hero-mascot--astronaut:hover .khe-mascot-stars::after,
.khe-hero-mascot--astronaut:focus-within .khe-mascot-stars::after {
	animation: kheAstronautStarPulse3 1.7s ease-in-out infinite alternate;
}

@keyframes kheAstronautStarPulse {
	0% { opacity: .4; transform: scale(.85) translateY(2px); }
	100% { opacity: 1; transform: scale(1.15) translateY(-2px); }
}

@keyframes kheAstronautStarPulse2 {
	0% { opacity: .35; transform: scale(.8) rotate(8deg); }
	100% { opacity: 1; transform: scale(1.2) rotate(18deg); }
}

@keyframes kheAstronautStarPulse3 {
	0% { opacity: .35; transform: scale(.75) rotate(-10deg); }
	100% { opacity: 1; transform: scale(1.15) rotate(2deg); }
}


/* v2.1.7 — homepage astronaut mascot fixed to the right with stronger glow + visible stars */
@media (min-width: 901px) {
	.khe-hero-inner {
		position: relative;
	}

	.khe-hero-title {
		max-width: min(980px, 66%);
	}

	.khe-hero-bottom {
		max-width: 63%;
	}

	.khe-hero-mascot.khe-hero-mascot--astronaut {
		position: absolute !important;
		right: clamp(36px, 5vw, 96px) !important;
		top: clamp(360px, 55vh, 690px) !important;
		bottom: auto !important;
		left: auto !important;
		width: clamp(250px, 24vw, 380px) !important;
		min-width: 250px !important;
		margin: 0 !important;
		z-index: 3;
		overflow: visible !important;
		transform: translateY(-8%);
	}
}

.khe-hero-mascot.khe-hero-mascot--astronaut {
	position: relative;
	overflow: visible !important;
}

.khe-hero-mascot--astronaut::before {
	left: 2%;
	bottom: 6%;
	width: 66%;
	height: 66%;
	background: radial-gradient(circle, rgba(255, 244, 170, 0.95) 0%, rgba(255, 225, 106, 0.62) 22%, rgba(255, 196, 76, 0.34) 42%, rgba(255, 176, 70, 0.18) 58%, rgba(255, 176, 70, 0.0) 78%);
	filter: blur(34px);
	opacity: .38;
	transform: scale(.96);
}

.khe-hero-mascot--astronaut::after {
	opacity: .9;
	filter: blur(.2px);
}

.khe-hero-mascot--astronaut:hover::before,
.khe-hero-mascot--astronaut:focus-within::before {
	opacity: 1;
	transform: scale(1.24);
	filter: blur(42px);
}

.khe-hero-mascot--astronaut:hover img,
.khe-hero-mascot--astronaut:focus-within img {
	transform: translateY(-6px) scale(1.02);
	filter: drop-shadow(0 20px 36px rgba(10, 16, 40, 0.18)) drop-shadow(0 0 28px rgba(255, 226, 122, 0.55)) drop-shadow(-10px 14px 40px rgba(255, 197, 72, 0.34));
}

.khe-hero-mascot--astronaut .khe-mascot-stars {
	left: 8%;
	top: 14%;
	width: 16px;
	height: 16px;
	transform: scale(.2) translateY(10px);
	background: radial-gradient(circle, rgba(255,255,255,1) 0%, rgba(255,251,216,.98) 18%, rgba(255,230,126,.82) 40%, rgba(255,230,126,0) 72%);
	filter: drop-shadow(0 0 18px rgba(255, 230, 126, .95));
}

.khe-hero-mascot--astronaut .khe-mascot-stars::before {
	left: 204px;
	top: 34px;
	width: 14px;
	height: 14px;
	background: radial-gradient(circle, rgba(255,255,255,1) 0%, rgba(205,236,255,.96) 22%, rgba(205,236,255,0) 72%);
	filter: drop-shadow(0 0 18px rgba(205,236,255,.9));
}

.khe-hero-mascot--astronaut .khe-mascot-stars::after {
	left: 130px;
	top: 198px;
	width: 12px;
	height: 12px;
	background: radial-gradient(circle, rgba(255,255,255,1) 0%, rgba(255,233,134,.94) 24%, rgba(255,233,134,0) 74%);
	filter: drop-shadow(0 0 16px rgba(255,233,134,.85));
}

.khe-hero-mascot--astronaut:hover .khe-mascot-stars,
.khe-hero-mascot--astronaut:focus-within .khe-mascot-stars,
.khe-hero-mascot--astronaut:hover .khe-mascot-stars::before,
.khe-hero-mascot--astronaut:focus-within .khe-mascot-stars::before,
.khe-hero-mascot--astronaut:hover .khe-mascot-stars::after,
.khe-hero-mascot--astronaut:focus-within .khe-mascot-stars::after {
	opacity: 1;
}

.khe-hero-mascot--astronaut:hover .khe-mascot-stars,
.khe-hero-mascot--astronaut:focus-within .khe-mascot-stars {
	transform: scale(1) translateY(0);
	animation: kheAstronautStarPulse 1.5s ease-in-out infinite alternate;
}

.khe-hero-mascot--astronaut:hover .khe-mascot-stars::before,
.khe-hero-mascot--astronaut:focus-within .khe-mascot-stars::before {
	animation: kheAstronautStarPulse2 1.8s ease-in-out infinite alternate;
}

.khe-hero-mascot--astronaut:hover .khe-mascot-stars::after,
.khe-hero-mascot--astronaut:focus-within .khe-mascot-stars::after {
	animation: kheAstronautStarPulse3 1.4s ease-in-out infinite alternate;
}

@media (max-width: 900px) {
	.khe-hero-mascot.khe-hero-mascot--astronaut {
		position: relative !important;
		top: auto !important;
		right: auto !important;
		left: auto !important;
		bottom: auto !important;
		transform: none !important;
		margin: 24px auto 0 !important;
	}
}


/* v2.1.8 — raise and enlarge homepage astronaut mascot on desktop */
@media (min-width: 901px) {
	.khe-hero-mascot.khe-hero-mascot--astronaut {
		right: clamp(28px, 4.6vw, 88px) !important;
		top: clamp(190px, 24vh, 320px) !important;
		width: clamp(320px, 28vw, 430px) !important;
		min-width: 320px !important;
		transform: none !important;
	}
}


/* v2.1.9 — homepage hero mascot positioning + floating labels cleanup */
.khe-floating-tags {
	z-index: 4;
}

@media (min-width: 901px) {
	.khe-hero-topline {
		justify-content: flex-start;
	}

	.khe-hero-mascot.khe-hero-mascot--astronaut {
		right: clamp(-8px, 1vw, 24px) !important;
		top: clamp(190px, 24vh, 320px) !important;
		width: clamp(340px, 29vw, 450px) !important;
		min-width: 340px !important;
	}

	.khe-starship.khe-tag--one {
		right: 7.5%;
		top: 20%;
	}

	.khe-starship.khe-tag--two {
		left: 5.5%;
		top: 50.5%;
	}

	.khe-starship.khe-tag--three {
		right: 17%;
		bottom: 13%;
	}

	.khe-starship.khe-tag--four {
		left: 41%;
		top: 14.5%;
	}
}


/* v2.1.10 — refine the Websites built metric into an adjustable wrench */
.khe-impact-card--web .khe-impact-bricks {
	width: 182px;
	height: 182px;
}

/* adjustable-wrench silhouette */
.khe-impact-card--web .khe-brick--1{--brick-top:#ffd87a;--brick-bottom:#ffb938;width:24px;height:40px;left:68px;top:112px;--intro-x:-18px;--intro-y:40px;--intro-r:-12deg;--scatter-x:-26px;--scatter-y:54px;--scatter-r:-20deg;}
.khe-impact-card--web .khe-brick--2{--brick-top:#ffd87a;--brick-bottom:#ffb938;width:24px;height:40px;left:72px;top:76px;--intro-x:-4px;--intro-y:12px;--intro-r:-6deg;--scatter-x:-10px;--scatter-y:14px;--scatter-r:-14deg;}
.khe-impact-card--web .khe-brick--3{--brick-top:#ffd87a;--brick-bottom:#ffb938;width:24px;height:30px;left:76px;top:48px;--intro-x:12px;--intro-y:-18px;--intro-r:6deg;--scatter-x:16px;--scatter-y:-26px;--scatter-r:14deg;}
.khe-impact-card--web .khe-brick--4{--brick-top:#ffffff;--brick-bottom:#d8e1f5;width:64px;height:24px;left:28px;top:22px;--intro-x:-52px;--intro-y:-38px;--intro-r:-20deg;--scatter-x:-70px;--scatter-y:-50px;--scatter-r:-28deg;}
.khe-impact-card--web .khe-brick--5{--brick-top:#7ec7ff;--brick-bottom:#398cf8;width:50px;height:24px;left:90px;top:28px;--intro-x:54px;--intro-y:-40px;--intro-r:22deg;--scatter-x:74px;--scatter-y:-52px;--scatter-r:34deg;}
.khe-impact-card--web .khe-brick--6{--brick-top:#ff8b69;--brick-bottom:#ff5c35;width:22px;height:22px;left:120px;top:52px;--intro-x:58px;--intro-y:-8px;--intro-r:18deg;--scatter-x:76px;--scatter-y:-10px;--scatter-r:30deg;}
.khe-impact-card--web .khe-brick--7{--brick-top:#cbff6f;--brick-bottom:#8bd93f;width:34px;height:20px;left:50px;top:154px;--intro-x:-38px;--intro-y:46px;--intro-r:-14deg;--scatter-x:-54px;--scatter-y:58px;--scatter-r:-22deg;}
.khe-impact-card--web .khe-brick--8{--brick-top:#c9b4ff;--brick-bottom:#8c64ff;width:34px;height:20px;left:86px;top:154px;--intro-x:38px;--intro-y:46px;--intro-r:14deg;--scatter-x:54px;--scatter-y:58px;--scatter-r:22deg;}


/* v2.1.11 — make “Websites built” read clearly as an adjustable wrench */
.khe-impact-card--web .khe-impact-bricks {
	width: 190px !important;
	height: 190px !important;
	position: relative;
	transform: rotate(-8deg);
}

.khe-impact-card--web .khe-brick {
	display: none !important;
}

/* diagonal metal handle */
.khe-impact-card--web .khe-impact-bricks::before {
	content: "";
	position: absolute;
	left: 74px;
	top: 62px;
	width: 34px;
	height: 116px;
	border-radius: 18px;
	background:
		linear-gradient(90deg, rgba(255,255,255,.72), rgba(255,255,255,.18) 22%, rgba(20,35,58,.12) 78%, rgba(0,0,0,.24)),
		linear-gradient(180deg, #eef5ff 0%, #9bb2d4 52%, #5e789f 100%);
	box-shadow:
		inset 0 2px 0 rgba(255,255,255,.72),
		inset 0 -8px 12px rgba(0,0,0,.18),
		0 18px 26px rgba(0,0,0,.28),
		0 0 28px rgba(126,199,255,.13);
	transform: rotate(38deg);
	transform-origin: 50% 22%;
	z-index: 2;
}

/* open adjustable jaw/head */
.khe-impact-card--web .khe-impact-bricks::after {
	content: "";
	position: absolute;
	left: 33px;
	top: 19px;
	width: 94px;
	height: 72px;
	background:
		radial-gradient(circle at 67% 48%, transparent 0 18px, #cfdcf0 19px 29px, transparent 30px),
		linear-gradient(135deg, #ffffff 0%, #dbe7f6 34%, #91a7c7 68%, #5b739b 100%);
	clip-path: polygon(
		10% 48%,
		26% 12%,
		48% 7%,
		39% 27%,
		57% 38%,
		83% 18%,
		94% 34%,
		68% 58%,
		76% 82%,
		52% 94%,
		28% 82%
	);
	border-radius: 22px;
	box-shadow:
		inset 0 2px 0 rgba(255,255,255,.78),
		inset 0 -8px 14px rgba(0,0,0,.16),
		0 18px 26px rgba(0,0,0,.24),
		0 0 32px rgba(126,199,255,.16);
	transform: rotate(38deg);
	z-index: 3;
}

/* small colored lego studs/details so it still belongs with the other brick builds */
.khe-impact-card--web .khe-impact-bricks .khe-brick--1,
.khe-impact-card--web .khe-impact-bricks .khe-brick--2,
.khe-impact-card--web .khe-impact-bricks .khe-brick--3 {
	display: block !important;
	z-index: 4;
	opacity: 0;
}

.khe-impact-card--web .khe-brick--1 {
	--brick-top: #7ec7ff;
	--brick-bottom: #398cf8;
	width: 28px !important;
	height: 18px !important;
	left: 70px !important;
	top: 72px !important;
	border-radius: 10px !important;
	--intro-x: -36px;
	--intro-y: -32px;
	--intro-r: -20deg;
	--scatter-x: -58px;
	--scatter-y: -44px;
	--scatter-r: -34deg;
	transform: translate(var(--intro-x), var(--intro-y)) rotate(var(--intro-r)) scale(.76);
}

.khe-impact-card--web .khe-brick--2 {
	--brick-top: #ff8b69;
	--brick-bottom: #ff5c35;
	width: 24px !important;
	height: 18px !important;
	left: 92px !important;
	top: 96px !important;
	border-radius: 10px !important;
	--intro-x: 34px;
	--intro-y: -18px;
	--intro-r: 22deg;
	--scatter-x: 58px;
	--scatter-y: -28px;
	--scatter-r: 38deg;
	transform: translate(var(--intro-x), var(--intro-y)) rotate(var(--intro-r)) scale(.76);
}

.khe-impact-card--web .khe-brick--3 {
	--brick-top: #cbff6f;
	--brick-bottom: #8bd93f;
	width: 30px !important;
	height: 18px !important;
	left: 116px !important;
	top: 132px !important;
	border-radius: 10px !important;
	--intro-x: 38px;
	--intro-y: 36px;
	--intro-r: 18deg;
	--scatter-x: 62px;
	--scatter-y: 54px;
	--scatter-r: 32deg;
	transform: translate(var(--intro-x), var(--intro-y)) rotate(var(--intro-r)) scale(.76);
}

.khe-impact-card--web.is-visible .khe-brick--1,
.khe-impact-card--web.is-visible .khe-brick--2,
.khe-impact-card--web.is-visible .khe-brick--3 {
	opacity: 1;
	transform: translate(0, 0) rotate(0deg) scale(1);
}

.khe-impact-card--web:hover .khe-impact-bricks::before,
.khe-impact-card--web:hover .khe-impact-bricks::after {
	filter: brightness(1.1) saturate(1.08);
}

.khe-impact-card--web:hover .khe-brick--1,
.khe-impact-card--web:hover .khe-brick--2,
.khe-impact-card--web:hover .khe-brick--3 {
	transform: translate(var(--scatter-x), var(--scatter-y)) rotate(var(--scatter-r)) scale(.97);
}


/* v2.1.12 — refreshed story block + tighter contact spacing */
.khe-human.khe-section {
	padding-top: clamp(70px, 8vw, 110px);
	padding-bottom: clamp(28px, 4vw, 52px);
}

.khe-contact.khe-section {
	padding-top: clamp(20px, 3vw, 44px);
	padding-bottom: 110px;
}

.khe-human-card {
	position: relative;
	overflow: hidden;
	border-radius: 34px;
	border: 1px solid rgba(21,21,21,.14);
	background:
		radial-gradient(circle at 88% 12%, rgba(255, 92, 53, .18), transparent 22%),
		radial-gradient(circle at 12% 18%, rgba(255,255,255,.25), transparent 24%),
		linear-gradient(135deg, #9ed0ff 0%, #7ebeff 48%, #9fceff 100%);
	box-shadow: 0 24px 60px rgba(16, 25, 41, .12), 20px 20px 0 rgba(255,92,53,.92);
}

.khe-human-card::before {
	content: '';
	position: absolute;
	inset: auto auto -90px -90px;
	width: 260px;
	height: 260px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255,255,255,.26) 0%, rgba(255,255,255,0) 72%);
	pointer-events: none;
}

.khe-human-layout {
	display: grid;
	grid-template-columns: minmax(0, 1.55fr) minmax(260px, .85fr);
	gap: clamp(28px, 4vw, 64px);
	align-items: center;
}

.khe-human-copy {
	max-width: 850px;
}

.khe-human-card h2 {
	max-width: 13ch;
	margin: 18px 0 22px;
	font-size: clamp(3rem, 6.2vw, 6.25rem);
	line-height: .94;
}

.khe-human-lead {
	max-width: 820px;
	margin: 0 0 22px;
	font-size: clamp(1.08rem, 1.8vw, 1.28rem);
	line-height: 1.65;
	color: rgba(21,21,21,.82);
}

.khe-human-highlights {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 20px;
}

.khe-human-highlights span {
	display: inline-flex;
	align-items: center;
	padding: 10px 16px;
	border-radius: 999px;
	border: 1px solid rgba(21,21,21,.14);
	background: rgba(255,255,255,.52);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	font-size: .82rem;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	box-shadow: 0 8px 22px rgba(17, 28, 48, .08);
}

.khe-human-credentials {
	list-style: none;
	padding: 0;
	margin: 0 0 26px;
	display: grid;
	gap: 12px;
	max-width: 860px;
}

.khe-human-credentials li {
	position: relative;
	padding: 16px 18px 16px 50px;
	border-radius: 20px;
	border: 1px solid rgba(21,21,21,.12);
	background: rgba(255,255,255,.5);
	box-shadow: 0 10px 24px rgba(17, 28, 48, .07);
	font-size: 1.02rem;
	line-height: 1.55;
}

.khe-human-credentials li::before {
	content: '';
	position: absolute;
	left: 18px;
	top: 20px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, #fff2a9 0 18%, #ffb547 46%, #ff5c35 100%);
	box-shadow: 0 0 0 5px rgba(255,255,255,.25);
}

.khe-human-link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 22px;
	border-radius: 999px;
	background: rgba(21,21,21,.92);
	color: #fff !important;
	text-decoration: none;
	box-shadow: 0 18px 34px rgba(21,21,21,.14);
	transition: transform .22s ease, box-shadow .22s ease, background .22s ease;
}

.khe-human-link:hover {
	transform: translateY(-2px);
	background: #101826;
	box-shadow: 0 24px 38px rgba(16,24,38,.18);
}

.khe-rocket-launcher {
	position: relative;
	display: grid;
	place-items: center;
	min-height: 460px;
	padding: 34px 24px 28px;
	border: 1px solid rgba(255,255,255,.28);
	border-radius: 30px;
	background: linear-gradient(180deg, rgba(16,24,38,.9) 0%, rgba(15,30,60,.82) 100%);
	box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 26px 54px rgba(11, 20, 38, .22);
	overflow: hidden;
	cursor: pointer;
	appearance: none;
}

.khe-rocket-launcher::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image:
		radial-gradient(circle, rgba(255,255,255,.95) 0 1.2px, transparent 1.8px),
		radial-gradient(circle, rgba(150, 197, 255, .75) 0 1.2px, transparent 1.8px);
	background-size: 70px 70px, 110px 110px;
	background-position: 14px 22px, 40px 65px;
	opacity: .55;
	pointer-events: none;
}

.khe-rocket-orbit {
	position: absolute;
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 50%;
	pointer-events: none;
}

.khe-rocket-orbit--one { width: 340px; height: 340px; }
.khe-rocket-orbit--two { width: 430px; height: 430px; opacity: .58; }

.khe-rocket-stage {
	position: relative;
	display: block;
	width: 190px;
	height: 300px;
	z-index: 2;
	transform-origin: 50% 90%;
	transition: transform .2s ease;
}

.khe-rocket-launcher:hover .khe-rocket-stage {
	transform: translateY(-6px);
}

.khe-rocket-body {
	position: absolute;
	left: 50%;
	top: 34px;
	width: 96px;
	height: 184px;
	transform: translateX(-50%);
	border-radius: 52px 52px 26px 26px;
	background: linear-gradient(180deg, #fff 0%, #f2f5fb 48%, #c9d3e5 100%);
	box-shadow: inset -16px -18px 22px rgba(79,94,120,.26), inset 12px 8px 18px rgba(255,255,255,.85), 0 18px 28px rgba(5,8,18,.24);
}

.khe-rocket-body::before {
	content: '';
	position: absolute;
	left: 50%;
	top: -30px;
	width: 64px;
	height: 74px;
	transform: translateX(-50%);
	border-radius: 56px 56px 20px 20px;
	background: linear-gradient(180deg, #ff7a54 0%, #ff5c35 100%);
	box-shadow: inset 0 10px 10px rgba(255,255,255,.28), 0 6px 16px rgba(255,92,53,.38);
}

.khe-rocket-window {
	position: absolute;
	left: 50%;
	top: 28px;
	width: 34px;
	height: 34px;
	transform: translateX(-50%);
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #d9f4ff 0 18%, #58b5ff 45%, #19458d 100%);
	border: 4px solid #f4f7fd;
	box-shadow: 0 0 0 4px rgba(22,33,56,.08);
}

.khe-rocket-fin {
	position: absolute;
	bottom: 34px;
	width: 36px;
	height: 64px;
	background: linear-gradient(180deg, #ff825e 0%, #ff5c35 100%);
	box-shadow: inset 0 8px 10px rgba(255,255,255,.22);
}

.khe-rocket-fin--left {
	left: -18px;
	border-radius: 28px 12px 14px 28px;
	transform: skewY(10deg);
}

.khe-rocket-fin--right {
	right: -18px;
	border-radius: 12px 28px 28px 14px;
	transform: skewY(-10deg);
}

.khe-rocket-flame {
	position: absolute;
	left: 50%;
	bottom: -34px;
	width: 30px;
	height: 62px;
	transform: translateX(-50%);
	border-radius: 50% 50% 60% 60%;
	background: linear-gradient(180deg, #fff0a7 0%, #ffb73c 45%, #ff6a00 75%, #ff4316 100%);
	filter: blur(.2px);
	box-shadow: 0 0 16px rgba(255,162,54,.65);
	animation: khe-flame-flicker 1s ease-in-out infinite;
	transform-origin: 50% 0;
}

.khe-rocket-smoke {
	position: absolute;
	bottom: 8px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, rgba(255,255,255,.85) 0%, rgba(210,220,240,.68) 62%, rgba(210,220,240,0) 100%);
	opacity: .82;
	filter: blur(1px);
}

.khe-rocket-smoke--one { left: 38px; width: 42px; height: 42px; }
.khe-rocket-smoke--two { left: 68px; width: 56px; height: 56px; bottom: -2px; }
.khe-rocket-smoke--three { right: 34px; width: 46px; height: 46px; bottom: 4px; }

.khe-rocket-label {
	position: absolute;
	left: 24px;
	right: 24px;
	bottom: 22px;
	text-align: center;
	font-size: .74rem;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: rgba(255,255,255,.8);
}

.khe-rocket-star {
	position: absolute;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: radial-gradient(circle, #ffffff 0%, #cde3ff 65%, rgba(205,227,255,0) 100%);
	box-shadow: 0 0 14px rgba(255,255,255,.6);
	animation: khe-star-pulse 2.4s ease-in-out infinite;
}

.khe-rocket-star--one { top: 84px; left: 58px; }
.khe-rocket-star--two { top: 126px; right: 64px; width: 8px; height: 8px; animation-delay: .8s; }
.khe-rocket-star--three { bottom: 106px; right: 92px; width: 12px; height: 12px; animation-delay: 1.5s; }

.khe-rocket-launcher:focus-visible {
	outline: 3px solid rgba(255,255,255,.85);
	outline-offset: 4px;
}

.khe-rocket-launcher.is-launched .khe-rocket-stage {
	animation: khe-rocket-launch 2.2s cubic-bezier(.16,.88,.22,1) forwards;
}

.khe-rocket-launcher.is-launched .khe-rocket-flame {
	animation: khe-flame-launch .28s linear infinite;
	box-shadow: 0 0 28px rgba(255,162,54,.9), 0 0 46px rgba(255,106,0,.55);
}

.khe-rocket-launcher.is-launched .khe-rocket-smoke--one { animation: khe-smoke-one 1.4s ease-out forwards; }
.khe-rocket-launcher.is-launched .khe-rocket-smoke--two { animation: khe-smoke-two 1.5s ease-out forwards; }
.khe-rocket-launcher.is-launched .khe-rocket-smoke--three { animation: khe-smoke-three 1.45s ease-out forwards; }
.khe-rocket-launcher.is-launched .khe-rocket-label { opacity: .35; }

@keyframes khe-flame-flicker {
	0%,100% { transform: translateX(-50%) scaleY(1); }
	50% { transform: translateX(-50%) scaleY(1.14) scaleX(.92); }
}

@keyframes khe-star-pulse {
	0%,100% { opacity: .55; transform: scale(.85); }
	50% { opacity: 1; transform: scale(1.2); }
}

@keyframes khe-rocket-launch {
	0% { transform: translateY(0) scale(1) rotate(0deg); opacity: 1; }
	18% { transform: translateY(-16px) scale(1.02) rotate(-1deg); }
	55% { transform: translateY(-200px) scale(.92) rotate(4deg); opacity: 1; }
	100% { transform: translateY(-520px) scale(.72) rotate(8deg); opacity: 0; }
}

@keyframes khe-flame-launch {
	0% { transform: translateX(-50%) scaleY(1.05); }
	50% { transform: translateX(-50%) scaleY(1.55) scaleX(.9); }
	100% { transform: translateX(-50%) scaleY(1.08) scaleX(1.04); }
}

@keyframes khe-smoke-one {
	0% { transform: translate(0,0) scale(1); opacity: .8; }
	100% { transform: translate(-48px, 28px) scale(1.55); opacity: 0; }
}

@keyframes khe-smoke-two {
	0% { transform: translate(0,0) scale(1); opacity: .78; }
	100% { transform: translate(0, 34px) scale(1.75); opacity: 0; }
}

@keyframes khe-smoke-three {
	0% { transform: translate(0,0) scale(1); opacity: .8; }
	100% { transform: translate(52px, 26px) scale(1.6); opacity: 0; }
}

@media (max-width: 1080px) {
	.khe-human-layout {
		grid-template-columns: 1fr;
	}
	.khe-rocket-launcher {
		min-height: 360px;
	}
}

@media (max-width: 720px) {
	.khe-human.khe-section { padding-bottom: 20px; }
	.khe-contact.khe-section { padding-top: 12px; }
	.khe-human-card { box-shadow: 10px 10px 0 rgba(255,92,53,.92); border-radius: 24px; }
	.khe-human-card h2 { max-width: 100%; font-size: clamp(2.4rem, 11vw, 4rem); }
	.khe-human-highlights { gap: 8px; }
	.khe-human-highlights span { font-size: .7rem; padding: 8px 12px; }
	.khe-human-credentials li { padding: 14px 16px 14px 42px; font-size: .94rem; border-radius: 16px; }
	.khe-human-credentials li::before { left: 14px; top: 18px; width: 14px; height: 14px; }
	.khe-rocket-launcher { min-height: 300px; padding: 20px 16px 24px; border-radius: 24px; }
	.khe-rocket-orbit--one { width: 250px; height: 250px; }
	.khe-rocket-orbit--two { width: 320px; height: 320px; }
	.khe-rocket-stage { width: 150px; height: 230px; }
	.khe-rocket-body { width: 78px; height: 150px; top: 22px; }
	.khe-rocket-body::before { width: 54px; height: 62px; top: -24px; }
	.khe-rocket-window { width: 28px; height: 28px; top: 24px; }
	.khe-rocket-fin { width: 28px; height: 52px; bottom: 28px; }
	.khe-rocket-fin--left { left: -14px; }
	.khe-rocket-fin--right { right: -14px; }
	.khe-rocket-flame { width: 24px; height: 50px; bottom: -30px; }
	.khe-contact h2 { margin-bottom: 36px; }
}


/* v2.1.39 — mobile hero rhythm, subtle expertise ticker, compact homepage contact */
.khe-marquee{padding:9px 0;background:rgba(255,255,255,.94);box-shadow:none}
.khe-marquee-track{gap:14px;font-size:.78rem;letter-spacing:.115em;animation-duration:30s;padding-inline:10px}
.khe-marquee-track span{color:#1a2540}
.khe-marquee-track b{color:#7190bd;font-size:1.05rem;line-height:1;font-weight:900;opacity:.74}
.khe-marquee-track i,.khe-marquee-planet{display:none!important}

.khe-home-contact{position:relative;overflow:hidden;padding:clamp(52px,6vw,82px) 0;background:linear-gradient(135deg,#f7f2e9,#eee7dc);border-top:1px solid rgba(23,47,77,.1)}
.khe-home-contact::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.52;background-image:linear-gradient(rgba(23,47,77,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(23,47,77,.06) 1px,transparent 1px),radial-gradient(circle,rgba(46,101,180,.44) 0 1.5px,transparent 2px),radial-gradient(circle,rgba(255,202,112,.5) 0 1px,transparent 1.6px);background-size:78px 78px,78px 78px,210px 210px,320px 320px;background-position:0 0,0 0,20px 34px,110px 162px}
.khe-home-contact__layout{display:grid;grid-template-columns:minmax(220px,.62fr) minmax(0,1.38fr);gap:clamp(22px,4vw,54px);align-items:center}
.khe-home-contact__copy{position:relative;z-index:1}.khe-home-contact__copy .khe-kicker{margin-bottom:12px}.khe-home-contact__copy h2{max-width:7ch;margin:0 0 14px;font-size:clamp(2.25rem,4vw,4.4rem);line-height:.91;letter-spacing:-.065em}.khe-home-contact__copy p{max-width:42ch;margin:0;color:rgba(23,47,77,.76);font-size:1.02rem;line-height:1.62}.khe-home-contact__email{display:inline-block;margin-top:18px;color:#17304d;font-weight:900;text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:3px}
.khe-home-contact__form{position:relative;z-index:1;padding:19px 20px 18px;border-radius:26px;overflow:hidden;background:linear-gradient(145deg,#132b52,#1f477d 54%,#10203d);border:1px solid rgba(220,235,255,.28);box-shadow:0 24px 50px rgba(14,30,54,.18);color:#fff}.khe-home-contact__form::after{content:"";position:absolute;inset:10px;border:1px solid rgba(255,255,255,.09);border-radius:19px;pointer-events:none}.khe-home-contact__magic{position:absolute;inset:0;pointer-events:none}.khe-home-contact__magic span{position:absolute;border-radius:50%;filter:blur(1px);animation:khe-home-orb 6.5s ease-in-out infinite}.khe-home-contact__magic span:nth-child(1){width:116px;height:116px;right:-22px;top:-40px;background:radial-gradient(circle,rgba(255,211,121,.27),transparent 68%)}.khe-home-contact__magic span:nth-child(2){width:130px;height:130px;left:24%;bottom:-88px;background:radial-gradient(circle,rgba(173,140,255,.18),transparent 68%);animation-delay:1.3s}.khe-home-contact__magic i{position:absolute;right:23px;bottom:14px;color:#ffd47f;font-size:1.35rem;font-style:normal;text-shadow:0 0 16px rgba(255,211,121,.7);animation:khe-home-spark 2.1s ease-in-out infinite}@keyframes khe-home-orb{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes khe-home-spark{0%,100%{opacity:.44;transform:scale(.82) rotate(0)}50%{opacity:1;transform:scale(1.14) rotate(25deg)}}
.khe-home-contact__form-head{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:baseline;gap:14px;margin:0 0 11px}.khe-home-contact__form-head span{font-size:.67rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:#ffd27a}.khe-home-contact__form-head strong{font-size:1.1rem;color:#fff}
.khe-home-contact__form .wpforms-container{position:relative;z-index:2;margin:0}.khe-home-contact__form .wpforms-field-container{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 12px}.khe-home-contact__form .wpforms-field{padding:6px 0!important;grid-column:span 6}.khe-home-contact__form .wpforms-field-email,.khe-home-contact__form .wpforms-field-textarea{grid-column:1/-1}.khe-home-contact__form .wpforms-field-label{color:#f7fbff!important;font-size:.83rem!important;font-weight:800!important}.khe-home-contact__form .wpforms-field-sublabel{color:rgba(235,242,255,.7)!important;font-size:.7rem!important}.khe-home-contact__form .wpforms-field input,.khe-home-contact__form .wpforms-field textarea,.khe-home-contact__form .wpforms-field select{background:linear-gradient(145deg,#fffdf6,#f7f0dd)!important;border:1px solid rgba(255,221,150,.5)!important;border-radius:15px!important;color:#1a314e!important;padding:11px 13px!important;font-size:.93rem!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 8px 15px rgba(3,9,18,.13)!important}.khe-home-contact__form .wpforms-field textarea{min-height:86px!important}.khe-home-contact__form .wpforms-field input:focus,.khe-home-contact__form .wpforms-field textarea:focus{border-color:#f4c76d!important;box-shadow:0 0 0 3px rgba(255,207,117,.18)!important}.khe-home-contact__form .wpforms-submit-container{padding-top:7px!important}.khe-home-contact__form .wpforms-submit{border:1px solid rgba(255,231,181,.55)!important;background:linear-gradient(145deg,#fff2ca,#e1aa48)!important;color:#17304d!important;border-radius:999px!important;padding:11px 20px!important;font-weight:900!important;box-shadow:0 14px 22px rgba(3,9,18,.22)!important;transition:transform .25s ease,filter .25s ease!important}.khe-home-contact__form .wpforms-submit:hover{transform:translateY(-2px)!important;filter:brightness(1.05)}.khe-home-contact__placeholder{position:relative;z-index:2;padding:15px;border:1px dashed rgba(255,255,255,.32);border-radius:15px;color:rgba(255,255,255,.9);font-size:.9rem;line-height:1.55}
@media(max-width:720px){.khe-hero{min-height:unset!important;padding-bottom:22px!important}.khe-hero-inner{min-height:unset!important}.khe-hero-title{margin-bottom:32px!important}.khe-hero-bottom{margin-bottom:0!important}.khe-marquee{padding:7px 0}.khe-marquee-track{font-size:.68rem;gap:10px;animation-duration:28s}.khe-home-contact{padding:42px 0}.khe-home-contact__layout{grid-template-columns:1fr;gap:22px}.khe-home-contact__copy h2{font-size:clamp(2.25rem,11vw,3.5rem)}.khe-home-contact__form{padding:16px;border-radius:22px}.khe-home-contact__form .wpforms-field{grid-column:1/-1}.khe-home-contact__form .wpforms-field-container{grid-template-columns:1fr}.khe-home-contact__form-head{align-items:flex-start;flex-direction:column;gap:4px}.khe-home-contact__form .wpforms-field textarea{min-height:100px!important}}


/* v2.1.40 — tighten the post-ticker handoff, especially on mobile */
.khe-intro.khe-section{padding-top:clamp(52px,6vw,84px)}
@media(max-width:720px){
  .khe-intro.khe-section{padding-top:34px!important;padding-bottom:64px!important}
  .khe-intro .khe-two-col{gap:26px!important}
  .khe-intro .khe-intro-aside{margin:0!important}
}


/* v2.1.41 — more compact selected-work presentation */
.khe-work.khe-section{
  padding-top:clamp(54px,6vw,84px);
  padding-bottom:clamp(60px,7vw,92px);
}
.khe-work .khe-section-head{
  margin-bottom:24px;
  align-items:end;
}
.khe-work .khe-section-head h2{
  max-width:620px;
  font-size:clamp(2.35rem,4.25vw,4.45rem);
  line-height:.92;
}
.khe-work .khe-projects{
  grid-template-columns:repeat(auto-fit,minmax(210px,246px));
  justify-content:start;
  gap:18px;
}
.khe-work .khe-project a,
.khe-work .khe-project:nth-child(even) a{
  border-radius:20px;
}
.khe-work .khe-project-image,
.khe-work .khe-project:nth-child(even) .khe-project-image{
  aspect-ratio:1 / .88;
}
.khe-work .khe-project-image img{
  object-fit:contain;
  padding:12px;
  background:linear-gradient(180deg,#ffffff,#f0f3f7);
}
.khe-work .khe-project-number{
  top:10px;
  right:10px;
  width:34px;
  height:34px;
  font-size:.64rem;
}
.khe-work .khe-project-copy,
.khe-work .khe-project:nth-child(even) .khe-project-copy{
  gap:8px;
  min-height:126px;
  padding:14px 14px 15px;
}
.khe-work .khe-project-meta span{
  font-size:.55rem;
  letter-spacing:.09em;
}
.khe-work .khe-project h3{
  font-size:1.36rem;
  line-height:.98;
}
.khe-work .khe-project-category{
  min-height:23px;
  padding:5px 8px;
  font-size:.55rem;
}
.khe-work .khe-project-cta{display:none}
@media(max-width:560px){
  .khe-work.khe-section{padding-top:44px;padding-bottom:54px}
  .khe-work .khe-section-head h2{font-size:clamp(2.15rem,10vw,3.3rem)}
  .khe-work .khe-projects{gap:11px;padding-right:12px}
  .khe-work .khe-project{min-width:56vw;width:56vw;max-width:230px}
  .khe-work .khe-project-image,
  .khe-work .khe-project:nth-child(even) .khe-project-image{aspect-ratio:1 / .82}
  .khe-work .khe-project-copy,
  .khe-work .khe-project:nth-child(even) .khe-project-copy{min-height:112px;padding:12px}
  .khe-work .khe-project h3{font-size:1.18rem}
}

/* v2.1.45 — refined homepage typography and polished selected-work cards */
/* A small global scale adjustment keeps the homepage bold without overwhelming the composition. */
.khe-big-copy{
  font-size:clamp(2.7rem,5.75vw,6.05rem);
  max-width:940px;
  line-height:.93;
}
.khe-section-head h2{
  font-size:clamp(2.65rem,5.15vw,5.3rem);
  line-height:.93;
}
.khe-impact h2{
  font-size:clamp(2.75rem,5.65vw,5.95rem);
  max-width:12ch;
}
.khe-contact h2{
  font-size:clamp(2.65rem,5vw,5rem);
  line-height:.93;
}
.khe-work .khe-section-head h2{
  max-width:560px;
  font-size:clamp(2.15rem,3.75vw,3.85rem);
  line-height:.93;
}

/* More considered project-card finish — same footprint, clearer visual hierarchy. */
.khe-work .khe-projects{
  gap:18px;
}
.khe-work .khe-project,
.khe-work .khe-project:nth-child(n){
  position:relative;
  padding:0;
  border:1px solid rgba(220,229,244,.5);
  border-radius:22px;
  overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(233,239,250,.98));
  box-shadow:0 18px 36px rgba(2,14,35,.18), inset 0 1px 0 rgba(255,255,255,.75);
  transition:transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s ease,border-color .28s ease;
}
.khe-work .khe-project::before{
  width:150px;
  height:150px;
  right:-62px;
  top:-64px;
  opacity:.56;
  filter:blur(12px);
}
.khe-work .khe-project::after{
  left:14px;
  top:14px;
  width:7px;
  height:7px;
  box-shadow:14px 0 0 rgba(23,47,77,.12);
  opacity:.88;
}
.khe-work .khe-project:hover{
  transform:translateY(-6px);
  border-color:rgba(255,255,255,.84);
  box-shadow:0 26px 46px rgba(2,14,35,.28),0 0 0 1px rgba(116,176,255,.22),inset 0 1px 0 rgba(255,255,255,.94);
}
.khe-work .khe-project a,
.khe-work .khe-project:nth-child(even) a{
  display:flex;
  flex-direction:column;
  min-height:0;
  gap:0;
  color:inherit;
  text-decoration:none;
}
.khe-work .khe-project-image,
.khe-work .khe-project:nth-child(even) .khe-project-image{
  order:0;
  width:100%;
  max-width:none;
  aspect-ratio:1/.88;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 12%,rgba(116,176,255,.16),transparent 26%),
    radial-gradient(circle at 86% 86%,rgba(255,122,84,.13),transparent 30%),
    linear-gradient(160deg,#fff,#edf1f8);
  transform:none;
  border-bottom:1px solid rgba(23,47,77,.08);
}
.khe-work .khe-project-image::after{
  content:"";
  position:absolute;
  inset:12px;
  border:1px solid rgba(23,47,77,.08);
  border-radius:14px;
  pointer-events:none;
}
.khe-work .khe-project-image img{
  position:relative;
  z-index:1;
  width:76%;
  height:76%;
  object-fit:contain;
  padding:0;
  background:transparent;
  filter:drop-shadow(0 12px 15px rgba(21,41,75,.1));
  transition:transform .38s cubic-bezier(.2,.7,.2,1),filter .38s ease;
}
.khe-work .khe-project:hover .khe-project-image img{
  transform:scale(1.055) rotate(-1.2deg);
  filter:drop-shadow(0 16px 18px rgba(21,41,75,.16));
}
.khe-work .khe-project-number{
  top:12px;
  right:12px;
  z-index:3;
  width:32px;
  height:32px;
  color:#314c75;
  background:rgba(255,255,255,.8);
  border:1px solid rgba(23,47,77,.12);
  backdrop-filter:blur(8px);
  box-shadow:0 6px 14px rgba(23,47,77,.08);
}
.khe-work .khe-project-copy,
.khe-work .khe-project:nth-child(even) .khe-project-copy{
  order:1;
  width:100%;
  min-height:118px;
  padding:14px 15px 16px;
  gap:7px;
  background:linear-gradient(180deg,rgba(250,252,255,.8),rgba(229,235,246,.94));
}
.khe-work .khe-project-meta{
  gap:8px;
}
.khe-work .khe-project-meta span{
  color:#6c7a91;
  font-size:.54rem;
  font-weight:900;
  letter-spacing:.11em;
}
.khe-work .khe-project h3{
  margin:0;
  color:#15233a;
  font-size:1.28rem;
  line-height:.98;
  letter-spacing:-.05em;
}
.khe-work .khe-project-category{
  align-self:flex-start;
  min-height:auto;
  padding:5px 9px;
  border:1px solid rgba(46,101,180,.12);
  color:#2d5d9f;
  background:rgba(52,100,179,.1);
  font-size:.54rem;
  letter-spacing:.1em;
  box-shadow:none;
}
.khe-work .khe-project-cta{display:none!important}

@media(max-width:720px){
  .khe-big-copy{font-size:clamp(2.45rem,10.6vw,4.15rem)}
  .khe-section-head h2{font-size:clamp(2.2rem,9.6vw,3.45rem)}
  .khe-impact h2{font-size:clamp(2.45rem,10vw,4rem)}
  .khe-work .khe-section-head h2{font-size:clamp(2rem,9vw,3.05rem)}
}


/* v2.1.46 — remove metrics disclaimer and tighten the impact section footprint */
.khe-impact.khe-section {
  padding-top: clamp(62px, 7vw, 100px);
  padding-bottom: clamp(54px, 6vw, 84px);
}
.khe-impact .khe-impact-top {
  margin-bottom: clamp(30px, 3.6vw, 44px);
}
@media (max-width: 720px) {
  .khe-impact.khe-section {
    padding-top: 52px;
    padding-bottom: 48px;
  }
}

/* v2.1.47 — compact, vertically centred “What I bring” block */
.khe-intro.khe-section{
  padding-top:clamp(54px,5.2vw,76px);
  padding-bottom:clamp(56px,5.4vw,78px);
}
.khe-intro .khe-two-col{
  grid-template-columns:minmax(300px,.82fr) minmax(0,1.55fr);
  gap:clamp(34px,4.2vw,72px);
  align-items:center;
}
.khe-intro-aside,
.khe-intro .khe-two-col>div:last-child{
  align-self:center;
}
.khe-intro .khe-interactive-field.khe-solar-system{
  height:clamp(390px,31vw,452px);
  min-height:clamp(390px,31vw,452px);
  margin-top:18px;
}
.khe-intro .khe-two-col>div:last-child{
  justify-content:center;
  min-height:clamp(390px,31vw,452px);
}
.khe-intro .khe-big-copy{
  max-width:800px;
  margin:0!important;
}
.khe-intro .khe-body-copy{
  max-width:760px;
  margin-top:26px!important;
  line-height:1.48;
}
@media(max-width:1000px){
  .khe-intro .khe-two-col>div:last-child{min-height:0}
  .khe-intro .khe-interactive-field.khe-solar-system{
    height:430px;
    min-height:430px;
  }
}
@media(max-width:720px){
  .khe-intro.khe-section{padding-top:42px!important;padding-bottom:50px!important}
  .khe-intro .khe-two-col{gap:24px!important}
  .khe-intro .khe-interactive-field.khe-solar-system{
    height:320px;
    min-height:320px;
    margin-top:12px;
  }
  .khe-intro .khe-body-copy{margin-top:20px!important}
}


/* v2.1.51 — fix broken mobile layout for the “What I bring” section */
@media (max-width: 900px) {
  .khe-intro .khe-two-col {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    align-items: start !important;
  }

  .khe-intro-aside {
    order: 2;
    width: 100%;
  }

  .khe-intro .khe-two-col > div:last-child {
    order: 1;
    min-height: 0 !important;
    width: 100%;
    justify-content: flex-start !important;
  }

  .khe-intro .khe-big-copy {
    max-width: 11ch;
    width: 100%;
    margin: 0 !important;
    font-size: clamp(2.6rem, 11vw, 4.3rem) !important;
    line-height: 0.96;
    letter-spacing: -0.055em;
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
  }

  .khe-intro .khe-body-copy {
    max-width: 100%;
    margin: 18px 0 0 !important;
    font-size: clamp(1rem, 4.5vw, 1.28rem);
    line-height: 1.5;
  }
}

@media (max-width: 720px) {
  .khe-intro.khe-section {
    padding-top: 34px !important;
    padding-bottom: 42px !important;
  }

  .khe-intro .khe-two-col {
    gap: 20px !important;
  }

  .khe-intro .khe-big-copy {
    max-width: 9.5ch;
    font-size: clamp(2.35rem, 10.2vw, 3.6rem) !important;
  }

  .khe-intro .khe-interactive-field.khe-solar-system {
    width: 100%;
    height: min(72vw, 320px);
    min-height: min(72vw, 320px);
    margin-top: 8px;
  }
}


/* v2.1.52 — hard mobile stack fix for “What I bring” */
@media (max-width: 1024px) {
  .khe-intro .khe-shell.khe-two-col {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 24px !important;
  }

  .khe-intro .khe-shell.khe-two-col > * {
    width: 100% !important;
    max-width: 100% !important;
  }

  .khe-intro .khe-shell.khe-two-col > div:last-child {
    order: 1 !important;
    min-height: 0 !important;
    justify-content: flex-start !important;
  }

  .khe-intro .khe-intro-aside {
    order: 2 !important;
    margin: 0 !important;
  }
}

@media (max-width: 767px) {
  .khe-intro.khe-section {
    padding-top: 34px !important;
    padding-bottom: 42px !important;
  }

  .khe-intro .khe-big-copy {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    font-size: clamp(2.35rem, 11.2vw, 3.85rem) !important;
    line-height: 0.95 !important;
    letter-spacing: -0.05em !important;
    text-wrap: balance;
    word-break: keep-all !important;
    overflow-wrap: break-word;
    hyphens: none !important;
  }

  .khe-intro .khe-body-copy {
    width: 100% !important;
    max-width: 100% !important;
    margin: 18px 0 0 !important;
    font-size: 1.02rem !important;
    line-height: 1.55 !important;
  }

  .khe-intro .khe-interactive-field.khe-solar-system {
    width: 100% !important;
    height: min(78vw, 340px) !important;
    min-height: min(78vw, 340px) !important;
    margin-top: 10px !important;
  }
}


/* v2.1.53 — definitive mobile repair for the “What I bring” section.
   This deliberately replaces the two-column composition before it can narrow
   the heading into a broken vertical strip. */
@media screen and (max-width: 1280px) {
  body.khe-homepage .khe-main .khe-intro > .khe-shell.khe-two-col {
    display: block !important;
    width: min(100% - 32px, 760px) !important;
    margin-inline: auto !important;
  }

  body.khe-homepage .khe-main .khe-intro > .khe-shell.khe-two-col > .khe-intro-aside,
  body.khe-homepage .khe-main .khe-intro > .khe-shell.khe-two-col > div:last-child {
    display: block !important;
    position: static !important;
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  body.khe-homepage .khe-main .khe-intro > .khe-shell.khe-two-col > div:last-child {
    margin-bottom: 28px !important;
  }

  body.khe-homepage .khe-main .khe-intro .khe-big-copy {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: clamp(2.65rem, 7vw, 4.7rem) !important;
    line-height: .96 !important;
    letter-spacing: -.055em !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    white-space: normal !important;
    hyphens: none !important;
  }

  body.khe-homepage .khe-main .khe-intro .khe-body-copy {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 20px 0 0 !important;
    font-size: clamp(1.05rem, 2.4vw, 1.25rem) !important;
    line-height: 1.55 !important;
  }

  body.khe-homepage .khe-main .khe-intro .khe-intro-aside {
    margin-top: 0 !important;
  }

  body.khe-homepage .khe-main .khe-intro .khe-interactive-field.khe-solar-system {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: min(78vw, 400px) !important;
    min-height: min(78vw, 400px) !important;
    margin: 0 !important;
  }
}

@media screen and (max-width: 767px) {
  body.khe-homepage .khe-main .khe-intro.khe-section {
    padding-top: 34px !important;
    padding-bottom: 42px !important;
  }

  body.khe-homepage .khe-main .khe-intro > .khe-shell.khe-two-col {
    width: calc(100% - 28px) !important;
  }

  body.khe-homepage .khe-main .khe-intro .khe-big-copy {
    font-size: clamp(2.45rem, 10.8vw, 3.55rem) !important;
    line-height: .97 !important;
    letter-spacing: -.052em !important;
  }

  body.khe-homepage .khe-main .khe-intro .khe-body-copy {
    font-size: 1.02rem !important;
    line-height: 1.55 !important;
  }

  body.khe-homepage .khe-main .khe-intro .khe-interactive-field.khe-solar-system {
    height: min(84vw, 350px) !important;
    min-height: min(84vw, 350px) !important;
  }
}


/* v2.1.54 – mobile spacing fix for homepage intro */
@media screen and (max-width: 767px) {
  body.khe-homepage .khe-main .khe-intro > .khe-shell.khe-two-col > div:last-child {
    margin-top: 24px !important;
  }
  body.khe-homepage .khe-main .khe-intro .khe-body-copy {
    margin-top: 22px !important;
  }
}


/* v2.1.67 — homepage contact: human copy and reliable Greek line wrapping */
.khe-home-contact__copy h2{
  max-width:14ch;
  font-size:clamp(2.05rem,3.1vw,3.55rem);
  line-height:.98;
  letter-spacing:-.055em;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
.khe-home-contact__copy p{
  max-width:48ch;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
@media (min-width:721px){
  .khe-home-contact__layout{grid-template-columns:minmax(360px,.78fr) minmax(0,1.22fr)}
}
@media (max-width:720px){
  .khe-home-contact__copy h2{
    max-width:none;
    font-size:clamp(2.25rem,10vw,3.25rem);
    line-height:1;
  }
  .khe-home-contact__copy p{max-width:42ch;}
}


/* v2.1.69 — Greek philosophy cards: calmer titles, natural wrapping */
html[lang^="el"] .khe-service-card h3,
body.pll-lang-el .khe-service-card h3 {
	font-size: clamp(2rem, 3.15vw, 3.35rem);
	line-height: 1.02;
	letter-spacing: -.045em;
	max-width: 13ch;
	text-wrap: balance;
	overflow-wrap: normal;
	word-break: normal;
	hyphens: none;
}

html[lang^="el"] .khe-service-card p,
body.pll-lang-el .khe-service-card p {
	max-width: 38ch;
	line-height: 1.52;
}

@media (min-width: 901px) {
	html[lang^="el"] .khe-service-card,
	body.pll-lang-el .khe-service-card {
		min-height: 330px;
	}
}

@media (max-width: 900px) {
	html[lang^="el"] .khe-service-card h3,
	body.pll-lang-el .khe-service-card h3 {
		font-size: clamp(2rem, 8.5vw, 2.8rem);
		max-width: 14ch;
	}
}


/* v2.1.71 — Greek hero: shorter editorial copy, stable lines */
html[lang^="el"] .khe-hero-title,
body.pll-lang-el .khe-hero-title {
  max-width: min(1160px, 74%);
  font-size: clamp(3.25rem, 7.25vw, 7.45rem);
  line-height: .9;
  letter-spacing: -.067em;
  text-transform: uppercase;
}
html[lang^="el"] .khe-hero-title .khe-line > span,
body.pll-lang-el .khe-hero-title .khe-line > span {
  white-space: nowrap;
}
html[lang^="el"] .khe-hero-bottom > p,
body.pll-lang-el .khe-hero-bottom > p {
  max-width: 68ch;
  font-size: clamp(1.02rem, 1.45vw, 1.45rem);
  line-height: 1.48;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
@media (max-width: 900px) {
  html[lang^="el"] .khe-hero-title,
  body.pll-lang-el .khe-hero-title {
    max-width: 100%;
    font-size: clamp(3rem, 11.2vw, 5.9rem);
    line-height: .92;
  }
  html[lang^="el"] .khe-hero-title .khe-line > span,
  body.pll-lang-el .khe-hero-title .khe-line > span {
    white-space: normal;
  }
}


/* v2.1.72: Greek homepage hero gets a deliberate fourth editorial line. */
.khe-hero-title .khe-line--greek-tail:empty { display: none; }
html[lang="el"] .khe-hero-title .khe-line--greek-tail {
	display: block;
	margin-top: .03em;
}
html[lang="el"] .khe-hero-title .khe-line--greek-tail > span {
	color: var(--khe-blue, #2d5aa2);
}
@media (max-width: 720px) {
	html[lang="el"] .khe-hero-title .khe-line--greek-tail { margin-top: .06em; }
}


/* v2.1.73 — tighten the Greek homepage hero title so it clears the astronaut mascot. */
@media (min-width: 901px) {
  html[lang^="el"] .khe-hero-title,
  body.pll-lang-el .khe-hero-title {
    max-width: min(1080px, 61%) !important;
    font-size: clamp(3.05rem, 5.65vw, 6.15rem) !important;
    line-height: .91 !important;
    letter-spacing: -.062em !important;
  }

  html[lang^="el"] .khe-hero-title .khe-line--greek-tail > span,
  body.pll-lang-el .khe-hero-title .khe-line--greek-tail > span {
    font-size: .94em;
  }
}

/* v2.1.74 — compact the Greek homepage hero vertically while preserving the four-line editorial title. */
@media (min-width: 901px) {
  html[lang^="el"] .khe-hero,
  body.pll-lang-el .khe-hero {
    min-height: 0 !important;
    padding: 22px 0 28px !important;
  }

  html[lang^="el"] .khe-hero-inner,
  body.pll-lang-el .khe-hero-inner {
    display: block !important;
    min-height: 760px !important;
  }

  html[lang^="el"] .khe-hero-signature,
  body.pll-lang-el .khe-hero-signature {
    margin-top: 11px !important;
  }

  html[lang^="el"] .khe-hero-title,
  body.pll-lang-el .khe-hero-title {
    margin: 118px 0 30px !important;
  }

  html[lang^="el"] .khe-hero-bottom,
  body.pll-lang-el .khe-hero-bottom {
    margin: 0 !important;
    gap: 26px !important;
  }
}


/* v2.1.76 — Greek selected-work heading: single clean title, no orphaned label spacing */
.khe-work .khe-section-head--greek-work{
  margin-top:0;
  margin-bottom:22px;
  align-items:center;
}
.khe-work .khe-section-head--greek-work > div{
  margin:0;
  padding:0;
}
.khe-work .khe-section-head--greek-work h2{
  margin:0;
  max-width:none;
  font-size:clamp(2.2rem,3.45vw,3.55rem);
  line-height:.98;
}
@media(max-width:720px){
  .khe-work .khe-section-head--greek-work{
    margin-bottom:18px;
    align-items:flex-start;
    gap:14px;
  }
  .khe-work .khe-section-head--greek-work h2{
    font-size:clamp(2rem,9vw,3rem);
  }
}


/* v2.1.77 — compact bilingual impact heading */
.khe-impact .khe-impact-top--compact {
	max-width: 760px;
	margin: 0 0 28px;
}

.khe-impact .khe-impact-top--compact h2 {
	margin: 0;
	font-size: clamp(2.6rem, 5.4vw, 5.5rem);
	line-height: .96;
	letter-spacing: -.055em;
}

@media (max-width: 720px) {
	.khe-impact .khe-impact-top--compact {
		margin-bottom: 22px;
	}

	.khe-impact .khe-impact-top--compact h2 {
		font-size: clamp(2.35rem, 12vw, 3.5rem);
		line-height: .98;
	}
}


/* v2.1.78 — compact bilingual impact heading and tighter section rhythm */
.khe-impact.khe-section {
  padding-top: clamp(56px, 6.5vw, 96px);
  padding-bottom: clamp(64px, 7.25vw, 108px);
}

.khe-impact .khe-impact-top--compact {
  max-width: 680px;
  margin-bottom: 20px;
}

.khe-impact .khe-impact-top--compact h2 {
  max-width: 12.5ch;
  margin: 0;
  font-size: clamp(2.35rem, 4.35vw, 4.6rem);
  line-height: .94;
  letter-spacing: -.058em;
}

.khe-impact-pours {
  gap: 18px;
}

@media (max-width: 720px) {
  .khe-impact.khe-section {
    padding-top: 46px;
    padding-bottom: 58px;
  }

  .khe-impact .khe-impact-top--compact {
    margin-bottom: 18px;
  }

  .khe-impact .khe-impact-top--compact h2 {
    max-width: 11.5ch;
    font-size: clamp(2.15rem, 10.4vw, 3.15rem);
    line-height: .96;
  }
}

/* Homepage: What I Do — personal brand bridge between psychology and marketing */
.khe-what-i-do {
	position: relative;
	overflow: hidden;
	background: #071a38;
	color: #f8f4eb;
	padding: clamp(5rem, 9vw, 8.5rem) 0;
}
.khe-what-i-do::before {
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: .54;
	background-image: radial-gradient(circle at 10% 17%, rgba(223, 234, 255, .72) 0 1.5px, transparent 2px), radial-gradient(circle at 80% 26%, rgba(118, 178, 255, .55) 0 2px, transparent 2.8px), radial-gradient(circle at 50% 78%, rgba(255, 203, 103, .56) 0 1.4px, transparent 2px);
	background-size: 137px 137px, 211px 211px, 179px 179px;
}
.khe-what-i-do .khe-shell { position: relative; z-index: 1; }
.khe-what-i-do-head {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(16rem, .85fr);
	gap: clamp(1.8rem, 7vw, 8rem);
	align-items: end;
	margin-bottom: clamp(2.4rem, 5vw, 4.5rem);
}
.khe-what-i-do-head .khe-kicker { color: #ffca6a; }
.khe-what-i-do-head h2 {
	margin: .5rem 0 0;
	max-width: 13ch;
	font-size: clamp(2.7rem, 5.9vw, 5.95rem);
	line-height: .91;
	letter-spacing: -.075em;
	color: #fffdf8;
}
.khe-what-i-do-head h2 span {
	display: block;
	white-space: nowrap;
}
.khe-what-i-do-head > p {
	margin: 0 0 .35rem;
	max-width: 34rem;
	font-size: clamp(1.05rem, 1.65vw, 1.38rem);
	line-height: 1.55;
	color: #cdd8eb;
}
@media (max-width: 680px) {
	.khe-what-i-do-head h2 span { white-space: normal; }
}
.khe-what-i-do-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 1rem;
}
.khe-what-card {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	min-height: 23.5rem;
	padding: clamp(1.35rem, 2.5vw, 2rem);
	border: 1px solid rgba(209, 224, 250, .32);
	border-radius: 1.65rem;
	background: linear-gradient(145deg, rgba(255,255,255,.97), rgba(232, 240, 255, .9));
	color: #102b53;
	box-shadow: 0 1.25rem 2.5rem rgba(0,0,0,.16);
	transition: transform .45s cubic-bezier(.2,.75,.25,1), box-shadow .45s ease, border-color .45s ease;
}
.khe-what-card:nth-child(-n+3) { grid-column: span 2; }
.khe-what-card:nth-child(4) { grid-column: 2 / span 2; }
.khe-what-card:nth-child(5) { grid-column: 4 / span 2; }
.khe-what-card::before {
	content: '';
	position: absolute;
	z-index: -1;
	inset: auto -12% -36% auto;
	width: 13rem;
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255,203,103,.56), rgba(255,203,103,0) 68%);
	filter: blur(3px);
	transform: translate3d(30%, 28%, 0) scale(.72);
	transition: transform .65s ease, opacity .55s ease;
	opacity: .6;
}
.khe-what-card:hover,
.khe-what-card:focus-within {
	transform: translateY(-10px);
	box-shadow: 0 1.9rem 3.7rem rgba(0,0,0,.28);
	border-color: rgba(255, 209, 119, .82);
}
.khe-what-card:hover::before,
.khe-what-card:focus-within::before { transform: translate3d(4%, 4%, 0) scale(1.18); opacity: 1; }
.khe-what-card-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.khe-what-card-top > span {
	display: grid;
	place-items: center;
	width: 2.45rem;
	aspect-ratio: 1;
	border: 1px solid currentColor;
	border-radius: 50%;
	font-size: .74rem;
	font-weight: 800;
	letter-spacing: .08em;
}
.khe-what-card-top small {
	font-size: .69rem;
	font-weight: 850;
	letter-spacing: .15em;
	text-transform: uppercase;
}
.khe-what-card h3 {
	max-width: 14ch;
	margin: clamp(3.5rem, 6vw, 6.2rem) 0 .85rem;
	font-size: clamp(1.7rem, 2.5vw, 2.5rem);
	line-height: .98;
	letter-spacing: -.055em;
}
.khe-what-card p {
	max-width: 31rem;
	margin: 0;
	font-size: 1rem;
	line-height: 1.53;
	color: #52647d;
}
.khe-what-card-arrow {
	position: absolute;
	right: 1.55rem;
	bottom: 1.35rem;
	font-size: 1.55rem;
	font-weight: 500;
	transition: transform .35s ease;
}
.khe-what-card:hover .khe-what-card-arrow { transform: translate(4px, -4px); }
.khe-what-orbit { position: absolute; top: 1.25rem; right: 1.25rem; width: 6.2rem; aspect-ratio: 1; opacity: .85; pointer-events: none; }
.khe-what-orbit::before, .khe-what-orbit::after, .khe-what-orbit i { content: ''; position: absolute; border: 1px solid rgba(30, 85, 151, .28); border-radius: 50%; }
.khe-what-orbit::before { inset: .1rem; }
.khe-what-orbit::after { inset: 1.2rem -.45rem; }
.khe-what-orbit i { inset: -.45rem 1.2rem; }
.khe-what-orbit b { position: absolute; top: 46%; left: -1px; width: .55rem; aspect-ratio: 1; border-radius: 50%; background: #ffca6a; box-shadow: 0 0 1rem rgba(255,202,106,.75); transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.khe-what-card:hover .khe-what-orbit { animation: khe-what-orbit-turn 7s linear infinite; }
.khe-what-card:hover .khe-what-orbit b { transform: translateX(5rem) scale(1.35); }
.khe-what-card--marketing {
	background: linear-gradient(140deg, #173c77, #0b2148 72%);
	color: #fffdf8;
	border-color: rgba(183, 211, 255, .36);
}
.khe-what-card--marketing p { color: #c7d4ea; }
.khe-what-card--marketing::before { background: radial-gradient(circle, rgba(112, 183, 255, .48), rgba(112,183,255,0) 68%); }
.khe-what-signal { position: absolute; top: 1.5rem; right: 1.55rem; display: flex; gap: .35rem; align-items: end; height: 3.1rem; pointer-events: none; }
.khe-what-signal i { width: .34rem; border-radius: 999px; background: #ffca6a; box-shadow: 0 0 .8rem rgba(255,202,106,.45); transform-origin: bottom; transition: transform .45s ease; }
.khe-what-signal i:nth-child(1) { height: 28%; }.khe-what-signal i:nth-child(2) { height: 50%; }.khe-what-signal i:nth-child(3) { height: 76%; }.khe-what-signal i:nth-child(4) { height: 100%; }
.khe-what-card--marketing:hover .khe-what-signal i:nth-child(1) { transform: scaleY(2.2); }.khe-what-card--marketing:hover .khe-what-signal i:nth-child(2) { transform: scaleY(.55); }.khe-what-card--marketing:hover .khe-what-signal i:nth-child(3) { transform: scaleY(1.45); }.khe-what-card--marketing:hover .khe-what-signal i:nth-child(4) { transform: scaleY(.72); }
@keyframes khe-what-orbit-turn { to { transform: rotate(360deg); } }
@media (max-width: 920px) {
	.khe-what-i-do-head { grid-template-columns: 1fr; gap: 1.2rem; }
	.khe-what-i-do-head h2 { max-width: 15ch; }
	.khe-what-i-do-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.khe-what-card:nth-child(n) { grid-column: auto; }
	.khe-what-card:last-child { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
	.khe-what-i-do { padding: 4.25rem 0; }
	.khe-what-i-do-head h2 { font-size: clamp(2.65rem, 13vw, 4.2rem); }
	.khe-what-i-do-grid { grid-template-columns: 1fr; }
	.khe-what-card:nth-child(n) { grid-column: auto; min-height: 20.8rem; }
	.khe-what-card h3 { margin-top: 4rem; max-width: 16ch; }
}


/* v2.2.6 — compact What I Do cards (both English and Greek) */
@media (min-width: 621px) {
	.khe-what-i-do-grid { gap: .9rem; }
	.khe-what-card {
		min-height: 19rem;
		padding: clamp(1.2rem, 2vw, 1.65rem);
		border-radius: 1.42rem;
	}
	.khe-what-card h3 {
		margin: clamp(2.55rem, 4vw, 3.9rem) 0 .7rem;
		font-size: clamp(1.55rem, 2.15vw, 2.18rem);
		line-height: 1.01;
	}
	.khe-what-card p {
		font-size: .95rem;
		line-height: 1.48;
	}
	.khe-what-card-arrow { right: 1.3rem; bottom: 1.12rem; font-size: 1.4rem; }
	.khe-what-orbit { top: 1.1rem; right: 1.1rem; width: 5.6rem; }
	.khe-what-signal { top: 1.25rem; right: 1.35rem; height: 2.7rem; }
}
@media (min-width: 921px) {
	.khe-what-card { min-height: 18.25rem; }
}

/* v2.2.7 — compact, calmer human side section */
.khe-human.khe-section {
	padding-top: clamp(46px, 6vw, 78px);
	padding-bottom: clamp(20px, 3vw, 38px);
}

.khe-human-card {
	border-color: rgba(24, 50, 88, .18);
	background: #f4f0e9;
	box-shadow: 0 18px 42px rgba(16, 25, 41, .10);
}

.khe-human-card::before {
	width: 220px;
	height: 220px;
	background: radial-gradient(circle, rgba(102, 151, 215, .12) 0%, rgba(102, 151, 215, 0) 72%);
}

.khe-human-layout {
	grid-template-columns: minmax(0, 1.55fr) minmax(250px, .72fr);
	gap: clamp(24px, 3vw, 48px);
	padding: clamp(28px, 4vw, 48px);
}

.khe-human-copy {
	max-width: 760px;
}

.khe-human-card h2 {
	max-width: 15ch;
	margin: 14px 0 16px;
	font-size: clamp(2.7rem, 5vw, 5rem);
	line-height: .96;
}

.khe-human-lead {
	max-width: 720px;
	margin-bottom: 16px;
	font-size: clamp(1rem, 1.45vw, 1.16rem);
	line-height: 1.55;
	color: rgba(24, 50, 88, .82);
}

.khe-human-highlights {
	gap: 8px;
	margin-bottom: 14px;
}

.khe-human-highlights span {
	padding: 8px 13px;
	border-color: rgba(24, 50, 88, .16);
	background: rgba(255,255,255,.72);
	font-size: .72rem;
	box-shadow: 0 6px 16px rgba(17, 28, 48, .06);
}

.khe-human-credentials {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 9px;
	max-width: none;
	margin-bottom: 18px;
}

.khe-human-credentials li {
	padding: 12px 13px 12px 35px;
	border-radius: 15px;
	border-color: rgba(24, 50, 88, .13);
	background: rgba(255,255,255,.58);
	box-shadow: none;
	font-size: .86rem;
	line-height: 1.44;
}

.khe-human-credentials li::before {
	left: 13px;
	top: 17px;
	width: 11px;
	height: 11px;
	box-shadow: 0 0 0 4px rgba(255,255,255,.7);
}

.khe-human-link {
	padding: 12px 18px;
	box-shadow: 0 12px 24px rgba(21,21,21,.12);
}

.khe-rocket-launcher {
	min-height: 350px;
	padding: 24px 18px 22px;
	border-radius: 26px;
	box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 18px 36px rgba(11, 20, 38, .18);
}

.khe-rocket-orbit--one { width: 280px; height: 280px; }
.khe-rocket-orbit--two { width: 360px; height: 360px; }
.khe-rocket-stage { width: 160px; height: 245px; }
.khe-rocket-body { width: 82px; height: 158px; top: 24px; }
.khe-rocket-body::before { width: 56px; height: 64px; top: -25px; }
.khe-rocket-window { width: 29px; height: 29px; top: 24px; }
.khe-rocket-fin { width: 30px; height: 54px; bottom: 29px; }
.khe-rocket-fin--left { left: -15px; }
.khe-rocket-fin--right { right: -15px; }
.khe-rocket-flame { width: 25px; height: 51px; bottom: -30px; }
.khe-rocket-label { left: 16px; right: 16px; bottom: 16px; font-size: .66rem; }

@media (max-width: 1080px) {
	.khe-human-credentials { grid-template-columns: 1fr; }
	.khe-rocket-launcher { min-height: 320px; }
}

@media (max-width: 720px) {
	.khe-human.khe-section { padding-top: 36px; }
	.khe-human-card { border-radius: 24px; box-shadow: 0 14px 28px rgba(16,25,41,.09); }
	.khe-human-layout { padding: 26px 20px; gap: 24px; }
	.khe-human-card h2 { font-size: clamp(2.35rem, 10vw, 3.5rem); margin-bottom: 14px; }
	.khe-human-lead { font-size: 1rem; }
	.khe-human-credentials { grid-template-columns: 1fr; }
	.khe-rocket-launcher { min-height: 280px; }
}


/* v2.2.8 — mobile repair + distinct home human section */
.khe-human.khe-section {
	background: linear-gradient(180deg, #e8eef7 0%, #dde7f4 100%);
	padding-top: clamp(42px, 5vw, 70px);
	padding-bottom: clamp(42px, 5vw, 70px);
}

.khe-human-card {
	background: linear-gradient(135deg, rgba(246,249,253,.96) 0%, rgba(224,235,248,.96) 100%);
	border-color: rgba(29, 59, 104, .16);
	box-shadow: 0 18px 40px rgba(26, 49, 82, .10);
}

.khe-human-card::before {
	background: radial-gradient(circle, rgba(90, 141, 212, .18) 0%, rgba(90, 141, 212, 0) 72%);
}

.khe-human-layout {
	grid-template-columns: minmax(0, 1.55fr) minmax(250px, .72fr);
}

@media (max-width: 1080px) {
	.khe-human-layout {
		grid-template-columns: minmax(0, 1fr) !important;
	}
	.khe-human-copy {
		min-width: 0;
	}
}

@media (max-width: 720px) {
	.khe-human.khe-section {
		padding: 30px 0 34px;
	}
	.khe-human-card {
		border-radius: 22px;
	}
	.khe-human-layout {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 22px;
		padding: 24px 20px;
	}
	.khe-human-copy,
	.khe-human-copy > * {
		min-width: 0;
		max-width: 100%;
	}
	.khe-human-card h2 {
		max-width: 11.5ch;
		font-size: clamp(2.05rem, 10.2vw, 3rem);
		line-height: .98;
		word-break: normal;
		overflow-wrap: normal;
	}
	.khe-human-lead {
		font-size: .98rem;
		line-height: 1.52;
	}
	.khe-human-highlights {
		margin-bottom: 10px;
	}
	.khe-human-highlights span {
		font-size: .62rem;
		letter-spacing: .065em;
		padding: 7px 10px;
	}
	.khe-human-credentials {
		gap: 8px;
		margin-bottom: 14px;
	}
	.khe-human-credentials li {
		padding: 10px 11px 10px 30px;
		font-size: .8rem;
		line-height: 1.42;
	}
	.khe-human-credentials li::before {
		left: 11px;
		top: 15px;
		width: 9px;
		height: 9px;
	}
	.khe-human-link {
		padding: 10px 14px;
		font-size: .85rem;
	}
	.khe-rocket-launcher {
		width: 100%;
		min-height: 285px;
		padding: 18px 14px 20px;
	}
}

/* v2.2.10 — compact, more balanced What I Do cards */
@media (min-width: 621px) {
  .khe-what-i-do-grid { gap: .82rem; }
  .khe-what-card {
    min-height: 15.75rem;
    padding: 1.15rem 1.3rem 1.2rem;
    border-radius: 1.3rem;
  }
  .khe-what-card h3 {
    margin: 2.4rem 0 .62rem;
    max-width: 15ch;
    font-size: clamp(1.5rem, 2vw, 2.02rem);
    line-height: 1.02;
  }
  .khe-what-card p {
    max-width: 28rem;
    font-size: .91rem;
    line-height: 1.46;
  }
  .khe-what-card-top > span { width: 2.2rem; font-size: .68rem; }
  .khe-what-card-top small { font-size: .63rem; letter-spacing: .13em; }
  .khe-what-card-arrow { right: 1.15rem; bottom: .95rem; font-size: 1.28rem; }
  .khe-what-orbit { width: 5rem; top: .85rem; right: .85rem; }
  .khe-what-signal { top: 1rem; right: 1.1rem; height: 2.35rem; }
}
@media (min-width: 921px) {
  .khe-what-card { min-height: 15.25rem; }
}
@media (max-width: 620px) {
  .khe-what-card:nth-child(n) { min-height: 17.1rem; padding: 1.2rem 1.25rem; }
  .khe-what-card h3 { margin-top: 3.3rem; font-size: clamp(1.65rem, 8.5vw, 2.15rem); }
  .khe-what-card p { font-size: .94rem; line-height: 1.48; }
}


/* v2.2.12 — home What I Do title and card title refinements */
.khe-what-card--workpsych h3 {
	max-width: none;
	font-size: clamp(1.32rem, 1.72vw, 1.72rem);
	line-height: 1.04;
	letter-spacing: -.045em;
}
.khe-what-card--strategy h3 {
	max-width: 14ch;
}
@media (min-width: 621px) {
	.khe-what-card--workpsych h3 {
		font-size: clamp(1.28rem, 1.62vw, 1.62rem);
	}
}
@media (max-width: 620px) {
	.khe-what-i-do-head h2 {
		font-size: clamp(2.3rem, 11vw, 3.65rem);
	}
	.khe-what-card--workpsych h3 {
		font-size: clamp(1.55rem, 7vw, 1.95rem);
		max-width: 12ch;
	}
}


/* v2.2.21 — selected Thinking Room notes on the homepage */
.khe-home-notes {
	position: relative;
	padding: clamp(3.8rem, 6vw, 6rem) 0;
	background: #f7f2e9;
	border-top: 1px solid rgba(19, 47, 88, .09);
	border-bottom: 1px solid rgba(19, 47, 88, .09);
}
.khe-home-notes::before {
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: .42;
	background-image: linear-gradient(rgba(35,61,103,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(35,61,103,.045) 1px, transparent 1px);
	background-size: 38px 38px;
}
.khe-home-notes .khe-shell { position: relative; z-index: 1; }
.khe-home-notes__head {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 2rem;
	margin-bottom: clamp(1.7rem, 3vw, 2.5rem);
}
.khe-home-notes__head h2 {
	max-width: 15ch;
	margin: .4rem 0 0;
	font-size: clamp(2rem, 4.2vw, 3.75rem);
	line-height: .98;
	letter-spacing: -.06em;
	color: #132f58;
}
.khe-home-notes__all {
	flex: 0 0 auto;
	padding: .72rem 1rem;
	border: 1px solid rgba(19,47,88,.18);
	border-radius: 999px;
	background: rgba(255,255,255,.56);
	color: #173c77;
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .035em;
	text-decoration: none;
	transition: transform .25s ease, background .25s ease, border-color .25s ease;
}
.khe-home-notes__all:hover { transform: translateY(-2px); background: #fffdf8; border-color: rgba(19,47,88,.38); }
.khe-home-notes__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(.85rem, 1.7vw, 1.2rem);
}
.khe-home-note {
	min-width: 0;
	border: 1px solid rgba(19,47,88,.13);
	border-radius: 1.25rem;
	overflow: hidden;
	background: rgba(255,255,255,.68);
	box-shadow: 0 .9rem 2rem rgba(20,37,68,.08);
	transition: transform .35s cubic-bezier(.2,.75,.25,1), box-shadow .35s ease, border-color .35s ease;
}
.khe-home-note__link { display: grid; grid-template-columns: 42% 58%; min-height: 11.5rem; color: inherit; text-decoration: none; }
.khe-home-note__media { position: relative; overflow: hidden; background: #193d78; }
.khe-home-note__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.75,.25,1), filter .45s ease; }
.khe-home-note__number { position: absolute; top: .65rem; right: .65rem; display: grid; place-items: center; width: 1.8rem; aspect-ratio: 1; border: 1px solid rgba(255,255,255,.8); border-radius: 50%; background: rgba(7,27,59,.62); color: #fffdf8; font-size: .58rem; font-weight: 800; letter-spacing: .08em; }
.khe-home-note__placeholder { position: absolute; inset: 0; overflow: hidden; background: linear-gradient(145deg, #183c77, #09204b); }
.khe-home-note__placeholder::before, .khe-home-note__placeholder::after { content: ''; position: absolute; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; }
.khe-home-note__placeholder::before { width: 9rem; height: 9rem; right: -2.5rem; bottom: -3.5rem; }
.khe-home-note__placeholder::after { width: 6rem; height: 6rem; left: 1.3rem; top: 1.15rem; }
.khe-home-note__placeholder i { position: absolute; width: .8rem; height: .8rem; right: 1.2rem; top: 1.25rem; border-radius: 50%; background: #ffca6a; box-shadow: 0 0 1.1rem rgba(255,202,106,.6); }
.khe-home-note__placeholder b { position: absolute; width: .45rem; height: .45rem; left: 1.6rem; bottom: 1.4rem; border-radius: 50%; background: #83bdff; }
.khe-home-note--marketing .khe-home-note__media, .khe-home-note--marketing .khe-home-note__placeholder { background: linear-gradient(145deg, #9e4c35, #eaa541); }
.khe-home-note--current-affairs .khe-home-note__media, .khe-home-note--current-affairs .khe-home-note__placeholder, .khe-home-note--epikairotita .khe-home-note__media, .khe-home-note--epikairotita .khe-home-note__placeholder { background: linear-gradient(145deg, #49306f, #214a84); }
.khe-home-note__body { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 1rem 1rem .95rem; }
.khe-home-note__meta { display: flex; width: 100%; justify-content: space-between; gap: .55rem; color: #637693; font-size: .56rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.khe-home-note__meta span { color: #1a4b90; }
.khe-home-note h3 { margin: .5rem 0 .45rem; color: #142f58; font-size: clamp(1.05rem, 1.35vw, 1.35rem); line-height: 1.06; letter-spacing: -.04em; }
.khe-home-note p { display: -webkit-box; margin: 0; overflow: hidden; color: #60718b; font-size: .78rem; line-height: 1.42; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.khe-home-note__cta { margin-top: auto; padding-top: .72rem; color: #174889; font-size: .63rem; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.khe-home-note__cta b { display: inline-block; margin-left: .15rem; transition: transform .3s ease; }
.khe-home-note:hover { transform: translateY(-6px); border-color: rgba(255,183,64,.72); box-shadow: 0 1.4rem 2.6rem rgba(20,37,68,.16); }
.khe-home-note:hover img { transform: scale(1.08); filter: saturate(1.08); }
.khe-home-note:hover .khe-home-note__cta b { transform: translate(3px,-3px); }
@media (max-width: 980px) { .khe-home-notes__grid { grid-template-columns: 1fr; } .khe-home-note__link { grid-template-columns: 30% 70%; min-height: 9.4rem; } }
@media (max-width: 620px) { .khe-home-notes { padding: 3.2rem 0; } .khe-home-notes__head { align-items: flex-start; flex-direction: column; gap: 1rem; } .khe-home-notes__head h2 { font-size: clamp(2rem, 10vw, 3rem); } .khe-home-note__link { grid-template-columns: 36% 64%; min-height: 9rem; } .khe-home-note__body { padding: .85rem; } .khe-home-note p { display: none; } .khe-home-note h3 { font-size: 1.08rem; } .khe-home-note__meta time { display:none; } }


/* v2.2.22 — richer cosmic editorial treatment for homepage Thinking Room notes */
.khe-home-notes {
	isolation: isolate;
	overflow: hidden;
	background:
		radial-gradient(circle at 4% 104%, rgba(20, 55, 107, .12) 0 10%, transparent 26%),
		radial-gradient(circle at 95% 3%, rgba(255, 194, 100, .17) 0 1%, transparent 20%),
		linear-gradient(145deg, #fbf5eb 0%, #f5eee2 48%, #f9f2e8 100%);
	border-color: rgba(33, 55, 88, .12);
}
.khe-home-notes::before {
	opacity: 1;
	background-image:
		radial-gradient(circle at 7% 21%, rgba(24, 53, 100, .62) 0 1px, transparent 1.6px),
		radial-gradient(circle at 84% 71%, rgba(204, 141, 51, .66) 0 1.5px, transparent 2.1px),
		radial-gradient(circle at 36% 75%, rgba(59, 99, 164, .42) 0 1px, transparent 1.7px),
		linear-gradient(rgba(27, 50, 91, .038) 1px, transparent 1px),
		linear-gradient(90deg, rgba(27, 50, 91, .038) 1px, transparent 1px);
	background-size: 154px 154px, 211px 211px, 173px 173px, 42px 42px, 42px 42px;
}
.khe-home-notes::after {
	content: '';
	position: absolute;
	z-index: 0;
	pointer-events: none;
	width: min(56vw, 760px);
	aspect-ratio: 1;
	right: -19vw;
	top: -31vw;
	border: 1px solid rgba(148, 111, 65, .20);
	border-radius: 50%;
	box-shadow:
		0 0 0 68px rgba(148, 111, 65, .07),
		0 0 0 136px rgba(148, 111, 65, .035);
	transform: rotate(-17deg);
}
.khe-home-notes__head {
	position: relative;
}
.khe-home-notes__head::after {
	content: '✦';
	position: absolute;
	left: min(39vw, 31rem);
	top: clamp(1.3rem, 3vw, 2.8rem);
	color: #c98a3f;
	font-size: clamp(1rem, 1.5vw, 1.45rem);
	text-shadow: 0 0 1rem rgba(217, 150, 60, .35);
	animation: kheHomeNoteTwinkle 4.5s ease-in-out infinite;
}
.khe-home-notes__head .khe-kicker {
	position: relative;
	padding-left: 1.35rem;
}
.khe-home-notes__head .khe-kicker::before {
	content: '✦';
	position: absolute;
	left: 0;
	color: #c98a3f;
	font-size: .93em;
}
.khe-home-notes__all {
	position: relative;
	overflow: hidden;
	border-color: rgba(21, 57, 108, .30);
	background: rgba(255, 253, 248, .78);
	box-shadow: 0 .85rem 1.6rem rgba(38, 51, 72, .08);
}
.khe-home-notes__all::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(115deg, transparent 25%, rgba(255, 201, 112, .35) 48%, transparent 69%);
	transform: translateX(-145%);
	transition: transform .65s ease;
}
.khe-home-notes__all:hover::before { transform: translateX(145%); }
.khe-home-notes__all:hover {
	transform: translateY(-4px) scale(1.015);
	background: #102c58;
	border-color: #102c58;
	color: #fffdf8;
	box-shadow: 0 1.15rem 2.15rem rgba(16, 44, 88, .22);
}
.khe-home-notes__grid { position: relative; }
.khe-home-note {
	position: relative;
	border-color: rgba(24, 49, 88, .17);
	background: rgba(255, 253, 248, .82);
	box-shadow: 0 1rem 2.25rem rgba(26, 43, 73, .09);
	will-change: transform;
}
.khe-home-note::before {
	content: '';
	position: absolute;
	z-index: 2;
	inset: 0;
	pointer-events: none;
	border-radius: inherit;
	padding: 1px;
	background: linear-gradient(135deg, rgba(255, 207, 124, 0), rgba(255, 207, 124, .95), rgba(84, 143, 223, .46), rgba(255,255,255,0));
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	opacity: 0;
	transition: opacity .45s ease;
}
.khe-home-note::after {
	content: '✦';
	position: absolute;
	z-index: 3;
	right: .75rem;
	bottom: .58rem;
	color: #ffca6a;
	font-size: 1.05rem;
	opacity: 0;
	transform: scale(.4) rotate(-20deg);
	transition: opacity .38s ease, transform .45s cubic-bezier(.2,.75,.25,1);
	text-shadow: 0 0 1rem rgba(255, 188, 84, .68);
}
.khe-home-note__media::after {
	content: '';
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 76% 16%, rgba(255, 211, 123, .40) 0 1px, transparent 2px),
		radial-gradient(circle at 14% 78%, rgba(139, 190, 255, .43) 0 1px, transparent 2px),
		linear-gradient(145deg, rgba(13, 36, 72, .10), transparent 42%, rgba(255, 198, 99, .16));
	background-size: 36px 36px, 47px 47px, auto;
	mix-blend-mode: screen;
	opacity: .72;
	transition: opacity .4s ease, transform .55s ease;
}
.khe-home-note__number {
	z-index: 4;
	backdrop-filter: blur(8px);
	box-shadow: 0 .4rem 1rem rgba(0,0,0,.2);
	transition: transform .4s cubic-bezier(.2,.75,.25,1), background .35s ease, color .35s ease;
}
.khe-home-note__body { position: relative; }
.khe-home-note__meta span { color: #17549a; }
.khe-home-note__cta {
	position: relative;
	padding-bottom: .15rem;
}
.khe-home-note__cta::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 0;
	height: 1px;
	background: linear-gradient(90deg, #164888, #ffbc59);
	transition: width .42s ease;
}
.khe-home-note:hover {
	transform: translateY(-10px) rotate(-.35deg);
	border-color: rgba(214, 151, 65, .72);
	box-shadow: 0 1.7rem 3.35rem rgba(22, 41, 74, .18), 0 0 0 5px rgba(255, 211, 133, .09);
}
.khe-home-note:nth-child(2):hover { transform: translateY(-12px) rotate(.32deg); }
.khe-home-note:nth-child(3):hover { transform: translateY(-10px) rotate(-.2deg); }
.khe-home-note:hover::before { opacity: 1; }
.khe-home-note:hover::after { opacity: 1; transform: scale(1) rotate(0); }
.khe-home-note:hover .khe-home-note__media::after { opacity: 1; transform: scale(1.08); }
.khe-home-note:hover .khe-home-note__number { transform: rotate(360deg) scale(1.08); background: #ffca6a; color: #102b53; }
.khe-home-note:hover .khe-home-note__cta::after { width: calc(100% - 1.2rem); }
@keyframes kheHomeNoteTwinkle {
	0%,100% { opacity: .52; transform: scale(.78) rotate(0); }
	50% { opacity: 1; transform: scale(1.12) rotate(18deg); }
}
@media (max-width: 980px) {
	.khe-home-notes::after { width: 680px; right: -330px; top: -260px; }
}
@media (max-width: 620px) {
	.khe-home-notes::after { width: 370px; right: -220px; top: -140px; box-shadow: 0 0 0 36px rgba(148,111,65,.06), 0 0 0 72px rgba(148,111,65,.03); }
	.khe-home-notes__head::after { display: none; }
	.khe-home-note:hover, .khe-home-note:nth-child(2):hover, .khe-home-note:nth-child(3):hover { transform: translateY(-5px); }
}


/* v2.2.27 — mobile solar system: readable, separated and touch-friendly */
@media (max-width: 720px) {
  .khe-interactive-field {
    height: 390px;
    cursor: default;
  }
  .khe-solar-hint {
    right: 14px;
    bottom: 13px;
    font-size: .57rem;
    letter-spacing: .1em;
  }
  .khe-solar-hint::before { content: 'Αγγίξτε για κίνηση'; }
  html[lang^="en"] .khe-solar-hint::before { content: 'Touch to explore'; }
  .khe-solar-hint { font-size: 0; }
  .khe-solar-hint::before { font-size: .57rem; }

  /* Keep the familiar orbits as a quiet backdrop, but turn planets into a clean mobile constellation. */
  .khe-orbit {
    width: 0 !important;
    height: 0 !important;
    border: 0 !important;
    animation: none !important;
    transform: none !important;
    margin: 0 !important;
    z-index: 7;
  }
  .khe-orbit--mercury { left: 24%; top: 28%; }
  .khe-orbit--passion { left: 71%; top: 23%; }
  .khe-orbit--earth { left: 76%; top: 49%; }
  .khe-orbit--mars { left: 22%; top: 66%; }
  .khe-orbit--creativity { left: 77%; top: 73%; }
  .khe-orbit--saturn { left: 44%; top: 82%; }

  .khe-planet {
    left: 0;
    top: 0;
    transform: translate(-50%, -50%);
    animation: khe-mobile-planet-float 4.2s ease-in-out infinite;
    will-change: transform;
  }
  .khe-orbit--passion .khe-planet { animation-delay: -.8s; }
  .khe-orbit--earth .khe-planet { animation-delay: -1.7s; }
  .khe-orbit--mars .khe-planet { animation-delay: -2.6s; }
  .khe-orbit--creativity .khe-planet { animation-delay: -3.3s; }
  .khe-orbit--saturn .khe-planet { animation-delay: -1.2s; }

  .khe-planet span {
    top: calc(100% + 8px);
    padding: 4px 7px;
    font-size: .5rem;
    letter-spacing: .07em;
    line-height: 1;
    transform: translateX(-50%);
  }
  .khe-planet--creativity span { left: auto; right: 50%; transform: translateX(50%); }
  .khe-planet--saturn span { top: auto; bottom: calc(100% + 9px); }
  .khe-orbit--mercury { display: none; }
  .khe-planet--earth { width: 38px; height: 38px; }
  .khe-planet--mars { width: 30px; height: 30px; }
  .khe-planet--creativity { width: 35px; height: 35px; }
  .khe-planet--saturn { width: 46px; height: 46px; }
  .khe-planet--saturn:before { width: 72px; height: 20px; }
  .khe-sun { width: 106px; height: 106px; }
  .khe-sun span { font-size: .68rem; }
}
@keyframes khe-mobile-planet-float {
  0%, 100% { transform: translate(-50%, -50%) translate3d(0, 0, 0); }
  50% { transform: translate(-50%, -50%) translate3d(0, -8px, 0); }
}


/* v2.2.28 — Keep Greek homepage note imagery as balanced as the English cards */
html[lang^="el"] .khe-home-note__link {
	grid-template-columns: 43% 57%;
	height: 16.5rem;
	min-height: 0;
}
html[lang^="el"] .khe-home-note__media {
	min-height: 0;
}
html[lang^="el"] .khe-home-note__media img {
	object-position: center center;
}
html[lang^="el"] .khe-home-note h3 {
	font-size: clamp(1rem, 1.18vw, 1.26rem);
	line-height: 1.05;
}
html[lang^="el"] .khe-home-note__body {
	min-height: 0;
}
@media (max-width: 980px) {
	html[lang^="el"] .khe-home-note__link {
		height: auto;
		min-height: 10.3rem;
	}
}
@media (max-width: 620px) {
	html[lang^="el"] .khe-home-note__link {
		grid-template-columns: 36% 64%;
		min-height: 9rem;
	}
}

/* v2.2.38 — compact pathfinder doors */
.khe-pathfinder { padding-top: clamp(3.8rem, 7vw, 6.8rem); padding-bottom: clamp(3.8rem, 7vw, 6.8rem); }
.khe-pathfinder-frame { position: relative; isolation: isolate; overflow: hidden; padding: clamp(1.35rem, 3vw, 2.7rem); border: 1px solid rgba(22, 54, 99, .16); border-radius: 1.7rem; background: linear-gradient(135deg, #eef5fb 0%, #fffaf1 56%, #edf1ff 100%); box-shadow: 0 1.2rem 3.2rem rgba(30, 59, 108, .09); }
.khe-pathfinder-frame::before { content: ''; position: absolute; z-index: -1; width: 30rem; height: 30rem; right: -16rem; top: -22rem; border: 1px solid rgba(28, 66, 122, .10); border-radius: 50%; box-shadow: 0 0 0 4rem rgba(28, 66, 122, .028), 0 0 0 8rem rgba(28, 66, 122, .018); pointer-events: none; }
.khe-pathfinder-intro { display: grid; grid-template-columns: minmax(13rem, .62fr) minmax(18rem, 1fr); column-gap: clamp(1.3rem, 5vw, 6rem); align-items: end; max-width: 58rem; }
.khe-pathfinder-intro .khe-kicker { grid-column: 1; margin: 0 0 .5rem; }
.khe-pathfinder-intro h2 { grid-column: 1; margin: 0; color: #102f5d; font-family: inherit; font-size: clamp(1.8rem, 3.7vw, 3.3rem); line-height: .96; letter-spacing: -.06em; }
.khe-pathfinder-intro > p:last-child { grid-column: 2; margin: 0 0 .15rem; color: rgba(19,44,80,.77); font-size: clamp(.88rem, 1.18vw, 1rem); line-height: 1.52; }
.khe-pathfinder-doors { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; margin-top: clamp(1.5rem, 3vw, 2.5rem); }
.khe-pathfinder-door { position: relative; display: grid; grid-template-columns: 2.1rem 3.4rem minmax(0, 1fr) 1.2rem; align-items: center; gap: .55rem; min-height: 7.15rem; padding: .85rem .8rem; overflow: hidden; border: 1px solid rgba(18, 50, 94, .13); border-radius: 1.1rem; background: rgba(255,255,255,.52); color: #14335f; text-decoration: none; box-shadow: 0 .45rem 1.1rem rgba(31,55,96,.045); transition: transform .3s ease, background .3s ease, box-shadow .3s ease, border-color .3s ease; }
.khe-pathfinder-door::before { content: ''; position: absolute; z-index: -1; inset: auto -20% -90% 20%; height: 8rem; background: radial-gradient(ellipse, rgba(255,214,132,.34), transparent 70%); opacity: .65; transition: opacity .35s ease; }
.khe-pathfinder-door:hover, .khe-pathfinder-door:focus-visible { transform: translateY(-5px); border-color: rgba(20,58,108,.36); background: rgba(255,255,255,.83); box-shadow: 0 1.1rem 2rem rgba(23,53,98,.13); outline: none; }
.khe-pathfinder-door__number { align-self: start; color: #be7647; font-size: .61rem; font-weight: 800; letter-spacing: .12em; }
.khe-pathfinder-door__frame { position: relative; display: block; width: 3.2rem; height: 4.75rem; border: .22rem solid #173a6d; border-bottom-width: .14rem; border-radius: .55rem .55rem .15rem .15rem; background: #0f2c55; box-shadow: inset 0 0 0 .08rem rgba(255,255,255,.13), 0 .35rem .7rem rgba(20,48,90,.16); perspective: 24rem; }
.khe-pathfinder-door__leaf { position: absolute; inset: .2rem; border-radius: .26rem .26rem .04rem .04rem; background: linear-gradient(135deg,#2c5b95,#15345e); transform-origin: left center; transition: transform .58s cubic-bezier(.2,.7,.15,1), filter .58s ease; }
.khe-pathfinder-door__leaf::before { content: ''; position: absolute; width: .24rem; height: .24rem; right: .25rem; top: 50%; border-radius: 50%; background: #ffd27e; box-shadow: 0 0 .4rem rgba(255,210,126,.72); }
.khe-pathfinder-door__light { position: absolute; z-index: -1; inset: .4rem -.9rem .25rem 1.2rem; opacity: 0; background: linear-gradient(90deg, rgba(255,223,156,.76), rgba(255,255,255,0)); filter: blur(.25rem); transform: skewY(-9deg) scaleX(.28); transform-origin: left center; transition: opacity .42s ease .12s, transform .58s cubic-bezier(.2,.7,.15,1); }
.khe-pathfinder-door__copy { display: grid; gap: .27rem; min-width: 0; }
.khe-pathfinder-door__copy strong { font-size: clamp(.78rem, 1vw, .91rem); line-height: 1.15; letter-spacing: -.025em; }
.khe-pathfinder-door__copy small { color: rgba(20,51,95,.63); font-size: .67rem; line-height: 1.28; }
.khe-pathfinder-door__arrow { justify-self: end; color: #ca844a; font-size: 1.1rem; transition: transform .3s ease; }
.khe-pathfinder-door:hover .khe-pathfinder-door__leaf, .khe-pathfinder-door:focus-visible .khe-pathfinder-door__leaf, .khe-pathfinder-door.is-opening .khe-pathfinder-door__leaf { transform: rotateY(-77deg); filter: brightness(1.08); }
.khe-pathfinder-door:hover .khe-pathfinder-door__light, .khe-pathfinder-door:focus-visible .khe-pathfinder-door__light, .khe-pathfinder-door.is-opening .khe-pathfinder-door__light { opacity: 1; transform: skewY(-9deg) scaleX(1); }
.khe-pathfinder-door:hover .khe-pathfinder-door__arrow, .khe-pathfinder-door:focus-visible .khe-pathfinder-door__arrow { transform: translateX(4px); }
.khe-pathfinder-door.is-opening { pointer-events: none; transform: translateY(-4px) scale(1.015); border-color: rgba(20,58,108,.5); }
.khe-pathfinder-door.is-opening::before { opacity: 1; }
@media (max-width: 1020px) { .khe-pathfinder-doors { grid-template-columns: repeat(2, minmax(0,1fr)); } .khe-pathfinder-door { min-height: 6.3rem; } }
@media (max-width: 700px) { .khe-pathfinder-intro { display:block; } .khe-pathfinder-intro .khe-kicker { margin-bottom:.5rem; } .khe-pathfinder-intro > p:last-child { margin-top:.8rem; } }
@media (max-width: 520px) { .khe-pathfinder-frame { padding: 1.15rem; border-radius: 1.3rem; } .khe-pathfinder-doors { grid-template-columns: 1fr; gap: .55rem; margin-top: 1.35rem; } .khe-pathfinder-door { grid-template-columns: 1.8rem 3rem minmax(0,1fr) 1.1rem; min-height: 5.6rem; padding: .65rem .7rem; border-radius: .95rem; } .khe-pathfinder-door__frame { width: 2.85rem; height: 4.15rem; } .khe-pathfinder-door__copy strong { font-size: .9rem; } .khe-pathfinder-door__copy small { font-size: .68rem; } }
@media (prefers-reduced-motion: reduce) { .khe-pathfinder-door, .khe-pathfinder-door__leaf, .khe-pathfinder-door__light, .khe-pathfinder-door__arrow { transition: none; } }



/* v2.2.39 — larger pathfinder doors, positioned after the introductory proposition */
.khe-pathfinder { padding-top: clamp(4.9rem, 8vw, 7.8rem); padding-bottom: clamp(4.9rem, 8vw, 7.8rem); }
.khe-pathfinder-frame { padding: clamp(1.6rem, 3.5vw, 3.25rem); }
.khe-pathfinder-doors { gap: clamp(.8rem, 1.25vw, 1.15rem); margin-top: clamp(1.8rem, 3.5vw, 2.85rem); }
.khe-pathfinder-door { grid-template-columns: 2.25rem 4.1rem minmax(0, 1fr) 1.3rem; gap: .7rem; min-height: clamp(8.6rem, 12vw, 10.25rem); padding: 1.05rem .95rem; border-radius: 1.2rem; }
.khe-pathfinder-door__number { font-size: .68rem; }
.khe-pathfinder-door__frame { width: 3.85rem; height: 5.85rem; }
.khe-pathfinder-door__copy { gap: .38rem; }
.khe-pathfinder-door__copy strong { font-size: clamp(.9rem, 1.18vw, 1.06rem); line-height: 1.18; }
.khe-pathfinder-door__copy small { font-size: clamp(.72rem, .87vw, .79rem); line-height: 1.38; }
.khe-pathfinder-door__arrow { font-size: 1.25rem; }
@media (max-width: 1020px) { .khe-pathfinder-door { min-height: 8.2rem; } }
@media (max-width: 520px) { .khe-pathfinder { padding-top: 3.8rem; padding-bottom: 3.8rem; } .khe-pathfinder-door { grid-template-columns: 1.9rem 3.35rem minmax(0,1fr) 1.1rem; min-height: 6.7rem; padding: .8rem .78rem; } .khe-pathfinder-door__frame { width: 3.2rem; height: 4.7rem; } .khe-pathfinder-door__copy strong { font-size: .95rem; } .khe-pathfinder-door__copy small { font-size: .72rem; } }

/* v2.2.40 — tighten the transition from the pathfinder to the next homepage section */
/* The four-door module remains spacious internally, but no longer creates a large visual pause below it. */
.khe-pathfinder {
	padding-bottom: clamp(2.5rem, 4.25vw, 4.25rem);
}
.khe-pathfinder + .khe-services.khe-section {
	padding-top: clamp(3.25rem, 5vw, 4.9rem);
}
@media (max-width: 520px) {
	.khe-pathfinder { padding-bottom: 2.65rem; }
	.khe-pathfinder + .khe-services.khe-section { padding-top: 3rem; }
}
