@layer features.home;

@layer features.home{

.wheel-opening-transition-source--active:not(:has(.wheel-card-thumbnail)),
.wheel-opening-transition-source--active .wheel-card-thumbnail,
.wheel-opening-transition-target {
	view-transition-name: wheel-opening-surface;
}

html:active-view-transition-type(wheel-opening-forward)::view-transition-old(root),
html:active-view-transition-type(wheel-opening-forward)::view-transition-new(root) {
	animation-timing-function: ease-out;
	animation-direction: normal;
	mix-blend-mode: normal;
}

html:active-view-transition-type(wheel-opening-forward)::view-transition-old(root) {
	animation-name: wheel-opening-root-fade-away;
	animation-duration: 180ms;
}

html:active-view-transition-type(wheel-opening-forward)::view-transition-new(root) {
	animation: none;
	opacity: 1;
}

html:active-view-transition-type(wheel-opening-forward)::view-transition-group(wheel-opening-surface) {
	z-index: 2;
	overflow: clip;
	border-radius: var(--app-radius-2xl);
	animation-duration: 540ms;
	animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}

html:active-view-transition-type(wheel-opening-forward)::view-transition-old(wheel-opening-surface),
html:active-view-transition-type(wheel-opening-forward)::view-transition-new(wheel-opening-surface) {
	transform-origin: center;
	animation-duration: 540ms;
	animation-fill-mode: both;
	animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
	mix-blend-mode: normal;
}

html:active-view-transition-type(wheel-opening-forward)::view-transition-old(wheel-opening-surface) {
	animation-name: wheel-opening-source-press-away;
	animation-duration: 170ms;
	animation-timing-function: cubic-bezier(0.32, 0, 0.67, 0);
}

html:active-view-transition-type(wheel-opening-forward)::view-transition-new(wheel-opening-surface) {
	animation-name: wheel-opening-target-open;
}

@keyframes wheel-opening-root-fade-away {
	from {
		opacity: 1;
	}

	to {
		opacity: 0;
	}
}

@keyframes wheel-opening-source-press-away {
	0% {
		transform: scale(1);
		opacity: 1;
	}

	42% {
		transform: scale(0.94);
		opacity: 0.28;
	}

	100% {
		transform: scale(0.86);
		opacity: 0;
	}
}

@keyframes wheel-opening-target-open {
	0% {
		clip-path: inset(46% 44% 46% 44% round var(--app-button-radius));
		transform: scale(0.9);
		opacity: 0.08;
	}

	18% {
		clip-path: inset(30% 28% 30% 28% round var(--app-radius-lg));
		transform: scale(0.97);
		opacity: 0.7;
	}

	58% {
		clip-path: inset(8% 6% 8% 6% round var(--app-radius-xl));
		transform: scale(0.995);
		opacity: 0.96;
	}

	100% {
		clip-path: inset(0 round var(--app-radius-2xl));
		transform: scale(1);
		opacity: 1;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wheel-opening-transition-source--active:not(:has(.wheel-card-thumbnail)),
	.wheel-opening-transition-source--active .wheel-card-thumbnail,
	.wheel-opening-transition-target {
		view-transition-name: none;
	}

	html:active-view-transition-type(wheel-opening-forward)::view-transition-new(root),
	html:active-view-transition-type(wheel-opening-forward)::view-transition-old(root),
	html:active-view-transition-type(wheel-opening-forward)::view-transition-group(wheel-opening-surface),
	html:active-view-transition-type(wheel-opening-forward)::view-transition-new(wheel-opening-surface),
	html:active-view-transition-type(wheel-opening-forward)::view-transition-old(wheel-opening-surface) {
		animation: none;
	}
}
}

@layer features.home {
	body.home-marketing-page .home-hero {
		--app-home-hero-logo-backdrop-opacity: 0.3;
		position: relative;
		isolation: isolate;
		display: grid;
		grid-template-columns: minmax(0, 0.9fr) minmax(19rem, 0.82fr);
		align-items: center;
		gap: clamp(var(--app-space-5), 4vw, var(--app-space-8));
		margin-bottom: var(--app-space-7);
		padding: clamp(var(--app-space-6), 4vw, var(--app-space-8));
		overflow: hidden;
		border: 1px solid rgba(255, 255, 255, 0.12);
		border-radius: var(--app-radius-4xl);
		background:
			radial-gradient(circle at 10% 86%, rgba(34, 211, 238, 0.18), transparent 30%),
			linear-gradient(98deg, rgba(8, 13, 32, 0.99), rgba(25, 39, 107, 0.96) 38%, rgba(47, 107, 255, 0.9) 70%, rgba(112, 66, 214, 0.88));
		box-shadow: var(--app-shadow-lg);
		color: #ffffff;
	}

	body.home-marketing-page .home-hero::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 0;
		background:
			repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.065) 0 1px, transparent 1px 1.15rem),
			linear-gradient(90deg, rgba(34, 211, 238, 0.18), transparent 38%, rgba(255, 255, 255, 0.08));
		mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.62) 42%, rgba(0, 0, 0, 0.78) 78%, rgba(0, 0, 0, 0.36));
		opacity: 0.22;
		pointer-events: none;
	}

	body.home-marketing-page .home-hero::after {
		content: "";
		position: absolute;
		inset: 1px;
		z-index: 1;
		border-radius: calc(var(--app-radius-4xl) - 1px);
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24), inset 0 -1px 0 rgba(15, 23, 42, 0.14);
		pointer-events: none;
	}

	body.home-marketing-page .home-hero__eyebrow {
		display: inline-block;
		color: #dbeafe;
		font-size: 0.78rem;
		font-weight: 800;
		letter-spacing: 0.16em;
		line-height: 1.2;
		text-shadow: 0 0.35rem 1.2rem rgba(8, 13, 32, 0.28);
		text-transform: uppercase;
	}

	body.home-marketing-page .home-hero__logo-backdrop {
		position: absolute;
		bottom: -15.5rem;
		left: -14.5rem;
		z-index: 1;
		width: clamp(30rem, 44vw, 48rem);
		height: auto;
		opacity: 0;
		animation: home-hero-logo-backdrop-fade 820ms var(--app-motion-ease-standard) 260ms forwards;
		filter: blur(0.9rem) saturate(1.16);
		mix-blend-mode: screen;
		pointer-events: none;
		transform: rotate(-10deg);
		user-select: none;
	}

	body.home-marketing-page .home-hero__copy {
		position: relative;
		z-index: 3;
		display: grid;
		align-content: center;
		gap: clamp(var(--app-space-3), 1.8vw, var(--app-space-4));
		max-width: min(100%, 46rem);
		min-width: 0;
	}

	body.home-marketing-page .home-hero__title {
		max-width: 17ch;
		margin: 0;
		color: #ffffff;
		font-size: clamp(2.65rem, 4.9vw, 4rem);
		font-weight: 800;
		letter-spacing: 0;
		line-height: 1.04;
		text-shadow: 0 0.5rem 1.8rem rgba(8, 13, 32, 0.34);
		text-wrap: balance;
	}

	body.home-marketing-page .home-hero__lead {
		max-width: min(100%, 46rem);
		margin: 0;
		color: rgba(248, 250, 252, 0.96);
		font-size: clamp(1rem, 1.2vw, 1.12rem);
		line-height: 1.7;
		text-shadow: 0 0.35rem 1.35rem rgba(8, 13, 32, 0.32);
		text-wrap: pretty;
	}

	body.home-marketing-page .home-hero__actions,
	body.home-marketing-page .home-use-cases__actions {
		justify-content: flex-start;
	}

	body.home-marketing-page .home-hero__actions {
		width: fit-content;
		margin-top: var(--app-space-1);
		padding: 0.45rem;
		border: 1px solid rgba(255, 255, 255, 0.2);
		border-radius: var(--app-radius-xl);
		background: rgba(8, 13, 32, 0.24);
		box-shadow: 0 1rem 2rem rgba(8, 13, 32, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.12);
	}

	body.home-marketing-page .home-hero__visual {
		position: relative;
		z-index: 3;
		justify-self: stretch;
		min-width: 0;
	}

	body.home-marketing-page .home-hero--solo {
		grid-template-columns: minmax(0, 1fr);
	}

	body.home-marketing-page .home-live-demo {
		--app-home-live-demo-screen-background:
			linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(236, 246, 255, 0.94) 48%, rgba(221, 255, 252, 0.9));
		--app-home-live-demo-bezel-color: rgba(15, 23, 42, 0.14);
		--app-home-live-demo-screen-border-color: rgba(226, 232, 240, 0.86);
		--app-home-live-demo-screen-shadow: 0 1.4rem 2.8rem rgba(8, 13, 32, 0.28), 0 0.35rem 1rem rgba(37, 99, 235, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.94);
		--app-home-live-demo-chrome-background: linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(241, 245, 249, 0.72));
		--app-home-live-demo-display-background:
			linear-gradient(135deg, rgba(255, 255, 255, 0.64), rgba(224, 242, 254, 0.42)),
			radial-gradient(ellipse at 18% 86%, rgba(34, 211, 238, 0.16), transparent 44%),
			radial-gradient(ellipse at 84% 16%, rgba(129, 140, 248, 0.18), transparent 48%);
		position: relative;
		isolation: isolate;
		display: grid;
		align-content: center;
		justify-items: center;
		min-height: clamp(19.5rem, 29vw, 23rem);
		overflow: visible;
		padding: clamp(var(--app-space-2), 1.8vw, var(--app-space-4)) 0 var(--app-space-1);
	}

	body.home-marketing-page .home-live-demo::before {
		content: "";
		position: absolute;
		inset: auto 8% 0.55rem;
		z-index: 0;
		height: clamp(2.75rem, 7vw, 4.5rem);
		border-radius: 50%;
		background:
			linear-gradient(90deg, transparent, rgba(14, 165, 233, 0.24) 24%, rgba(79, 70, 229, 0.22) 54%, rgba(16, 185, 129, 0.18) 76%, transparent),
			radial-gradient(ellipse at center, rgba(8, 13, 32, 0.36), transparent 72%);
		filter: blur(1.05rem);
		opacity: 0.72;
		pointer-events: none;
	}

	body.home-marketing-page .home-live-demo__screen {
		position: relative;
		z-index: 3;
		display: grid;
		grid-template-rows: auto minmax(0, 1fr);
		width: min(100%, 31rem);
		min-height: clamp(16.6rem, 24vw, 19.2rem);
		overflow: hidden;
		border: 1px solid var(--app-home-live-demo-screen-border-color);
		border-radius: var(--app-radius-3xl);
		background: var(--app-home-live-demo-screen-background);
		box-shadow: var(--app-home-live-demo-screen-shadow);
	}

	body.home-marketing-page .home-live-demo__screen::after {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 4;
		border-radius: inherit;
		border: 0.28rem solid var(--app-home-live-demo-bezel-color);
		background: linear-gradient(116deg, rgba(255, 255, 255, 0.36), transparent 32%, transparent 64%, rgba(255, 255, 255, 0.22));
		background-clip: padding-box;
		opacity: 0.82;
		pointer-events: none;
	}

	body.home-marketing-page .home-live-demo__screen-chrome {
		position: relative;
		z-index: 2;
		display: grid;
		grid-template-columns: auto minmax(3rem, 1fr) auto;
		align-items: center;
		gap: 0.7rem;
		padding: 0.72rem 0.9rem 0.64rem;
		border-bottom: 1px solid rgba(148, 163, 184, 0.22);
		background: var(--app-home-live-demo-chrome-background);
	}

	body.home-marketing-page .home-live-demo__screen-dots {
		display: block;
		width: 2.28rem;
		height: 0.56rem;
		background:
			radial-gradient(circle at 0.28rem 50%, #fb7185 0 0.2rem, transparent 0.21rem),
			radial-gradient(circle at 1.14rem 50%, #f59e0b 0 0.2rem, transparent 0.21rem),
			radial-gradient(circle at 2rem 50%, #10b981 0 0.2rem, transparent 0.21rem);
	}

	body.home-marketing-page .home-live-demo__screen-address,
	body.home-marketing-page .home-live-demo__screen-status {
		display: block;
		height: 0.62rem;
		border: 1px solid rgba(148, 163, 184, 0.2);
		border-radius: var(--app-radius-pill);
		background: rgba(255, 255, 255, 0.72);
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
	}

	body.home-marketing-page .home-live-demo__screen-address {
		width: min(100%, 11.6rem);
	}

	body.home-marketing-page .home-live-demo__screen-status {
		width: 3.5rem;
		background: linear-gradient(90deg, rgba(91, 95, 248, 0.16), rgba(34, 211, 238, 0.2));
	}

	body.home-marketing-page .home-live-demo__display {
		position: relative;
		display: grid;
		place-items: center;
		min-height: clamp(13.8rem, 20vw, 16.1rem);
		overflow: hidden;
		padding: clamp(var(--app-space-3), 2.6vw, var(--app-space-5));
		background: var(--app-home-live-demo-display-background);
	}

	body.home-marketing-page .home-live-demo__display::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 0;
		background:
			radial-gradient(ellipse at 50% 46%, rgba(255, 255, 255, 0.62), transparent 34%),
			radial-gradient(ellipse at 20% 72%, rgba(139, 92, 246, 0.14), transparent 42%),
			radial-gradient(ellipse at 78% 68%, rgba(34, 211, 238, 0.16), transparent 42%);
		pointer-events: none;
	}

	body.home-marketing-page .home-live-demo__display::after {
		content: "";
		position: absolute;
		top: -18%;
		right: 7%;
		z-index: 1;
		width: 34%;
		height: 140%;
		background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.28), transparent);
		opacity: 0.58;
		pointer-events: none;
		transform: rotate(18deg);
	}

	body.home-marketing-page .home-live-demo__thumbnail {
		--app-home-hero-thumbnail-shell-scale: calc(160 / 108);
		--app-home-hero-thumbnail-wheel-diameter: calc(13.2rem * 0.86);
		position: relative;
		z-index: 2;
		width: min(100%, calc(var(--app-home-hero-thumbnail-wheel-diameter) * var(--app-home-hero-thumbnail-shell-scale)));
		filter: drop-shadow(0 1.05rem 1.5rem rgba(8, 17, 32, 0.24));
	}

	body.home-marketing-page .home-live-demo__stand {
		position: relative;
		z-index: 1;
		display: block;
		width: clamp(4.8rem, 18%, 6.4rem);
		height: clamp(1.45rem, 3vw, 2rem);
		margin-top: -1.15rem;
		background: linear-gradient(180deg, rgba(226, 232, 240, 0.94), rgba(148, 163, 184, 0.84));
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 0.75rem 1.4rem rgba(8, 13, 32, 0.16);
		clip-path: polygon(32% 0, 68% 0, 84% 100%, 16% 100%);
	}

	body.home-marketing-page .home-live-demo__table {
		position: relative;
		z-index: 0;
		display: block;
		width: min(72%, 24rem);
		height: clamp(0.7rem, 1.4vw, 1rem);
		margin-top: -0.06rem;
		border-radius: 50%;
		background: radial-gradient(ellipse at center, rgba(8, 13, 32, 0.4), rgba(30, 64, 175, 0.18) 45%, transparent 74%);
		filter: blur(0.08rem);
	}

	body.home-marketing-page .home-live-demo__thumbnail .wheel-card-thumbnail__wheel-layer {
		animation: home-hero-wheel-spin 36s linear infinite;
		contain: paint;
		will-change: rotate;
	}

	body.home-marketing-page .home-section {
		margin-bottom: var(--app-space-8);
		scroll-margin-top: var(--app-space-6);
	}

	body.home-marketing-page .home-section__header {
		display: grid;
		gap: var(--app-space-2);
		max-width: var(--app-width-68);
		margin-bottom: var(--app-space-4);
	}

	body.home-marketing-page .home-section__header h2,
	body.home-marketing-page .home-proof-card h2 {
		margin: 0;
		letter-spacing: 0;
		line-height: 1.12;
	}

	body.home-marketing-page .home-section__header p,
	body.home-marketing-page .home-proof-card p,
	body.home-marketing-page .home-capability-card p {
		margin: 0;
		color: var(--app-supporting-copy-color);
		line-height: 1.65;
	}

	body.home-marketing-page .home-realtime {
		--app-surface-frame-background: var(--app-surface-strong);
		--app-surface-frame-radius: var(--app-radius-3xl);
		padding: var(--app-space-6);
	}

	body.home-marketing-page .home-realtime-flow {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--app-space-3);
		padding: 0;
		margin: 0;
		list-style: none;
	}

	body.home-marketing-page .home-realtime-flow__item,
	body.home-marketing-page .home-capability-card {
		--app-surface-frame-border-color: rgba(91, 95, 248, 0.16);
		--app-surface-frame-background: rgba(238, 242, 255, 0.74);
		--app-surface-frame-radius: var(--app-radius-2xl);
		display: grid;
		gap: var(--app-space-2);
		min-height: 100%;
		padding: var(--app-space-5);
	}

	body.home-marketing-page .home-realtime-flow__item {
		--app-surface-frame-border-color: rgba(148, 163, 184, 0.22);
		--app-surface-frame-background: rgba(255, 255, 255, 0.72);
		--app-surface-frame-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
		grid-template-columns: auto minmax(0, 1fr);
		grid-template-rows: auto minmax(0, 1fr);
		align-items: start;
		gap: 0.35rem var(--app-space-4);
		padding: var(--app-space-4) 1.05rem;
	}

	body.home-marketing-page .home-realtime-flow__item h3,
	body.home-marketing-page .home-capability-card h3 {
		margin: 0;
		font-size: 1.08rem;
		letter-spacing: 0;
	}

	body.home-marketing-page .home-realtime-flow__item h3,
	body.home-marketing-page .home-realtime-flow__item p {
		grid-column: 2;
		min-width: 0;
	}

	body.home-marketing-page .home-realtime-flow__item h3 {
		align-self: center;
		padding-top: 0.18rem;
	}

	body.home-marketing-page .home-realtime-flow__item p {
		margin: 0;
		color: var(--app-supporting-copy-color);
		line-height: 1.58;
	}

	body.home-marketing-page .home-realtime-flow__step {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		grid-row: 1 / span 2;
		width: var(--app-space-7);
		height: var(--app-space-7);
		border-radius: var(--app-radius-pill);
		background: linear-gradient(135deg, rgba(91, 95, 248, 0.18), rgba(47, 107, 255, 0.12));
		color: var(--app-indigo-600);
		font-size: 0.88rem;
		font-weight: 800;
		line-height: 1;
	}

	body.home-marketing-page .home-proof-grid {
		display: grid;
		grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
		gap: var(--app-space-4);
	}

	body.home-marketing-page .home-proof-card {
		--app-surface-frame-background: var(--app-surface-color);
		--app-surface-frame-radius: var(--app-radius-3xl);
		display: grid;
		align-content: space-between;
		gap: var(--app-space-5);
		min-height: 100%;
		padding: var(--app-space-6);
	}

	body.home-marketing-page .home-proof-card--segments {
		--app-surface-frame-background:
			linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(238, 242, 255, 0.82));
	}

	body.home-marketing-page .home-proof-card--colors {
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
	}

	body.home-marketing-page .home-proof-card__eyebrow {
		display: inline-block;
		margin-bottom: var(--app-space-2);
		color: #4f46e5;
		font-size: 0.76rem;
		font-weight: 800;
		letter-spacing: 0.06em;
		line-height: 1.2;
		text-transform: uppercase;
	}

	body.home-marketing-page .home-segment-count__value {
		display: inline-block;
		min-width: 4.8ch;
		color: #4f46e5;
		font-variant-numeric: tabular-nums;
	}

	body.home-marketing-page .home-color-swatches {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		gap: 0.78rem;
		max-width: 14.5rem;
		padding: 0;
		margin: 0;
		list-style: none;
	}

	body.home-marketing-page .home-color-swatch {
		display: block;
		width: 2.72rem;
		aspect-ratio: 1;
		border: 1px solid rgba(255, 255, 255, 0.66);
		border-radius: 50%;
		box-shadow: 0 0.7rem 1.35rem rgba(8, 17, 32, 0.16), inset 0 0 0 0.16rem rgba(255, 255, 255, 0.24);
	}

	body.home-marketing-page .home-color-swatch--indigo {
		background: #5b5ff8;
	}

	body.home-marketing-page .home-color-swatch--blue {
		background: #2f6bff;
	}

	body.home-marketing-page .home-color-swatch--violet {
		background: #7c3aed;
	}

	body.home-marketing-page .home-color-swatch--cyan {
		background: #22d3ee;
	}

	body.home-marketing-page .home-color-swatch--emerald {
		background: #10b981;
	}

	body.home-marketing-page .home-color-swatch--rose {
		background: #e11d48;
	}

	body.home-marketing-page .home-featured-showcase {
		--app-surface-frame-border-color: rgba(91, 95, 248, 0.16);
		--app-surface-frame-background:
			linear-gradient(145deg, rgba(248, 250, 252, 0.98), rgba(238, 242, 255, 0.84));
		--app-surface-frame-radius: var(--app-radius-3xl);
		padding: var(--app-space-6);
	}

	body.home-marketing-page .home-featured-grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		align-items: start;
		gap: var(--app-space-3);
	}

	body.home-marketing-page .home-featured-grid .wheel-card {
		--app-wheel-card-background: var(--app-surface-color);
		--app-wheel-card-hover-lift: -2px;
		height: 100%;
		margin-bottom: 0;
		padding: var(--app-space-4);
	}

	body.home-marketing-page .home-featured-grid .wheel-card__title {
		color: var(--bs-heading-color);
		font-size: 1.05rem;
		font-weight: 800;
		line-height: 1.22;
	}

	body.home-marketing-page .home-featured-grid .wheel-card__meta {
		color: var(--app-supporting-copy-color);
		font-size: 0.84rem;
	}

	body.home-marketing-page .home-capability-grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--app-space-3);
	}

	body.home-marketing-page .home-capability-card {
		--app-surface-frame-background: var(--app-surface-color);
		--app-surface-frame-shadow: var(--app-shadow-sm);
		grid-template-columns: auto minmax(0, 1fr);
		grid-template-rows: auto minmax(0, 1fr);
		align-items: start;
		column-gap: var(--app-space-3);
	}

	body.home-marketing-page .home-capability-card__icon {
		grid-column: 1;
		grid-row: 1;
		align-self: center;
		width: 1.35rem;
		height: 1.35rem;
		color: #4f46e5;
	}

	body.home-marketing-page .home-capability-card h3,
	body.home-marketing-page .home-capability-card p {
		grid-column: 2;
		min-width: 0;
	}

	body.home-marketing-page .home-use-cases {
		--app-surface-frame-border-color: rgba(91, 95, 248, 0.16);
		--app-surface-frame-background:
			linear-gradient(145deg, rgba(255, 255, 255, 0.94), rgba(238, 242, 255, 0.82));
		--app-surface-frame-radius: var(--app-radius-3xl);
		display: grid;
		gap: var(--app-space-4);
		padding: var(--app-space-6);
	}

	body.home-marketing-page .home-use-cases .home-section__header {
		margin-bottom: 0;
	}

	@media (max-width: 991.98px) {
		body.home-marketing-page .home-hero,
		body.home-marketing-page .home-proof-grid,
		body.home-marketing-page .home-proof-card--colors {
			grid-template-columns: minmax(0, 1fr);
		}

		body.home-marketing-page .home-hero__title {
			max-width: 16ch;
			font-size: clamp(2.35rem, 8vw, 3rem);
		}

		body.home-marketing-page .home-live-demo {
			min-height: clamp(18.5rem, 52vw, 22rem);
		}

		body.home-marketing-page .home-live-demo__screen {
			width: min(100%, 34rem);
		}

		body.home-marketing-page .home-realtime-flow,
		body.home-marketing-page .home-capability-grid {
			grid-template-columns: minmax(0, 1fr);
		}

		body.home-marketing-page .home-featured-grid {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}

		body.home-marketing-page .home-color-swatches {
			justify-content: flex-start;
			max-width: none;
		}
	}

	@media (max-width: 575.98px) {
		body.home-marketing-page .home-hero,
		body.home-marketing-page .home-realtime,
		body.home-marketing-page .home-proof-card,
		body.home-marketing-page .home-featured-showcase,
		body.home-marketing-page .home-use-cases {
			padding: var(--app-space-5);
			border-radius: var(--app-radius-2xl);
		}

		body.home-marketing-page .home-hero__title {
			font-size: clamp(2.05rem, 12vw, 2.55rem);
		}

		body.home-marketing-page .home-live-demo {
			min-height: 16.5rem;
			padding: var(--app-space-1) 0 0;
		}

		body.home-marketing-page .home-live-demo__screen {
			width: 100%;
			min-height: 14.75rem;
			border-radius: var(--app-radius-2xl);
		}

		body.home-marketing-page .home-live-demo__screen-chrome {
			grid-template-columns: auto minmax(0, 1fr);
			gap: 0.55rem;
			padding: 0.58rem 0.7rem 0.5rem;
		}

		body.home-marketing-page .home-live-demo__screen-status {
			display: none;
		}

		body.home-marketing-page .home-live-demo__display {
			min-height: 12rem;
			padding: var(--app-space-3);
		}

		body.home-marketing-page .home-live-demo__thumbnail {
			--app-home-hero-thumbnail-wheel-diameter: calc(13.8rem * 0.86);
		}

		body.home-marketing-page .home-live-demo__stand {
			height: 0.8rem;
			margin-top: -0.48rem;
		}

		body.home-marketing-page .home-hero__actions,
		body.home-marketing-page .home-use-cases__actions {
			width: 100%;
		}

		body.home-marketing-page .home-featured-grid {
			grid-template-columns: minmax(0, 1fr);
		}
	}

	@media (prefers-reduced-motion: reduce) {
		body.home-marketing-page .home-hero__logo-backdrop {
			opacity: var(--app-home-hero-logo-backdrop-opacity);
			animation: none;
		}

		body.home-marketing-page .home-live-demo__thumbnail .wheel-card-thumbnail__wheel-layer {
			animation: none;
			will-change: auto;
		}
	}

	@media (prefers-color-scheme: dark) {
		body.home-marketing-page .home-hero {
			background:
				radial-gradient(circle at 10% 86%, rgba(34, 211, 238, 0.14), transparent 30%),
				linear-gradient(98deg, rgba(7, 12, 31, 0.99), rgba(30, 42, 106, 0.96) 42%, rgba(30, 64, 175, 0.82) 70%, rgba(67, 56, 202, 0.78));
		}

		body.home-marketing-page .home-live-demo {
			--app-home-live-demo-screen-background:
				linear-gradient(145deg, rgba(15, 23, 42, 0.98), rgba(30, 41, 59, 0.94) 44%, rgba(12, 74, 110, 0.78));
			--app-home-live-demo-bezel-color: rgba(2, 6, 23, 0.72);
			--app-home-live-demo-screen-border-color: rgba(148, 163, 184, 0.3);
			--app-home-live-demo-screen-shadow: 0 1.4rem 3rem rgba(2, 6, 23, 0.62), 0 0.35rem 1.2rem rgba(14, 165, 233, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.1);
			--app-home-live-demo-chrome-background: linear-gradient(180deg, rgba(15, 23, 42, 0.94), rgba(30, 41, 59, 0.84));
			--app-home-live-demo-display-background:
				linear-gradient(135deg, rgba(15, 23, 42, 0.82), rgba(30, 64, 175, 0.3)),
				radial-gradient(ellipse at 18% 86%, rgba(34, 211, 238, 0.18), transparent 46%),
				radial-gradient(ellipse at 84% 16%, rgba(129, 140, 248, 0.22), transparent 48%);
		}

		body.home-marketing-page .home-live-demo__screen::after {
			background: linear-gradient(116deg, rgba(255, 255, 255, 0.08), transparent 32%, transparent 64%, rgba(34, 211, 238, 0.12));
			opacity: 0.95;
		}

		body.home-marketing-page .home-live-demo__screen-chrome {
			border-bottom-color: rgba(148, 163, 184, 0.18);
		}

		body.home-marketing-page .home-live-demo__screen-address,
		body.home-marketing-page .home-live-demo__screen-status {
			border-color: rgba(148, 163, 184, 0.24);
			background: rgba(15, 23, 42, 0.78);
			box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
		}

		body.home-marketing-page .home-live-demo__screen-status {
			background: linear-gradient(90deg, rgba(91, 95, 248, 0.28), rgba(34, 211, 238, 0.24));
		}

		body.home-marketing-page .home-live-demo__display::before {
			background:
				radial-gradient(ellipse at 50% 46%, rgba(255, 255, 255, 0.08), transparent 34%),
				radial-gradient(ellipse at 20% 72%, rgba(139, 92, 246, 0.2), transparent 42%),
				radial-gradient(ellipse at 78% 68%, rgba(34, 211, 238, 0.18), transparent 42%);
		}

		body.home-marketing-page .home-live-demo__stand {
			background: linear-gradient(180deg, rgba(51, 65, 85, 0.96), rgba(15, 23, 42, 0.88));
			box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 0.85rem 1.55rem rgba(2, 6, 23, 0.34);
		}

		body.home-marketing-page .home-realtime,
		body.home-marketing-page .home-proof-card,
		body.home-marketing-page .home-featured-showcase,
		body.home-marketing-page .home-capability-card {
			--app-surface-frame-background: var(--app-surface-color);
		}

		body.home-marketing-page .home-realtime-flow__item {
			--app-surface-frame-border-color: rgba(129, 140, 248, 0.24);
			--app-surface-frame-background: rgba(49, 46, 129, 0.26);
			--app-surface-frame-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
		}

		body.home-marketing-page .home-realtime-flow__step {
			background: linear-gradient(135deg, rgba(79, 70, 229, 0.32), rgba(59, 130, 246, 0.18));
			color: #c7d2fe;
		}

		body.home-marketing-page .home-proof-card--segments,
		body.home-marketing-page .home-use-cases {
			--app-surface-frame-background:
				linear-gradient(145deg, rgba(30, 41, 59, 0.92), rgba(49, 46, 129, 0.32));
		}

		body.home-marketing-page .home-proof-card__eyebrow,
		body.home-marketing-page .home-segment-count__value,
		body.home-marketing-page .home-capability-card__icon {
			color: #c7d2fe;
		}
	}

	@media (prefers-contrast: more) {
		body.home-marketing-page .home-hero {
			--app-home-hero-logo-backdrop-opacity: 0;
			border-color: rgba(255, 255, 255, 0.64);
			background: #081120;
			box-shadow: none;
		}

		body.home-marketing-page .home-hero::before,
		body.home-marketing-page .home-hero__logo-backdrop {
			display: none;
		}

		body.home-marketing-page .home-hero__eyebrow,
		body.home-marketing-page .home-hero__title,
		body.home-marketing-page .home-hero__lead {
			color: #ffffff;
			text-shadow: none;
		}

		body.home-marketing-page .home-hero__actions {
			border-color: rgba(255, 255, 255, 0.72);
			background: #081120;
			box-shadow: none;
		}

		body.home-marketing-page .home-live-demo::before,
		body.home-marketing-page .home-live-demo__screen::after,
		body.home-marketing-page .home-live-demo__display::after,
		body.home-marketing-page .home-live-demo__table {
			display: none;
		}

		body.home-marketing-page .home-live-demo,
		body.home-marketing-page .home-live-demo__screen,
		body.home-marketing-page .home-live-demo__display,
		body.home-marketing-page .home-realtime-flow__item,
		body.home-marketing-page .home-proof-card,
		body.home-marketing-page .home-featured-showcase,
		body.home-marketing-page .home-featured-grid .wheel-card,
		body.home-marketing-page .home-capability-card,
		body.home-marketing-page .home-use-cases {
			border-color: var(--app-border-color-strong);
			box-shadow: none;
		}

		body.home-marketing-page .home-live-demo__screen,
		body.home-marketing-page .home-live-demo__display {
			background: #ffffff;
		}
	}

	@media (forced-colors: active) {
		body.home-marketing-page .home-hero,
		body.home-marketing-page .home-live-demo,
		body.home-marketing-page .home-live-demo__screen,
		body.home-marketing-page .home-live-demo__display,
		body.home-marketing-page .home-realtime,
		body.home-marketing-page .home-realtime-flow__item,
		body.home-marketing-page .home-proof-card,
		body.home-marketing-page .home-featured-showcase,
		body.home-marketing-page .home-featured-grid .wheel-card,
		body.home-marketing-page .home-capability-card,
		body.home-marketing-page .home-use-cases {
			border-color: CanvasText;
			background: Canvas;
			box-shadow: none;
			color: CanvasText;
		}

		body.home-marketing-page .home-hero__eyebrow,
		body.home-marketing-page .home-hero__title,
		body.home-marketing-page .home-hero__lead,
		body.home-marketing-page .home-segment-count__value,
		body.home-marketing-page .home-featured-grid .wheel-card__title,
		body.home-marketing-page .home-featured-grid .wheel-card__meta,
		body.home-marketing-page .home-featured-grid .wheel-card__cta {
			color: CanvasText;
		}

		body.home-marketing-page .home-hero__actions {
			border-color: CanvasText;
			background: Canvas;
			box-shadow: none;
		}

		body.home-marketing-page .home-color-swatch {
			border-color: CanvasText;
			background: Canvas;
			box-shadow: none;
		}

		body.home-marketing-page .home-live-demo__thumbnail {
			filter: none;
		}

		body.home-marketing-page .home-realtime-flow__step {
			background: Highlight;
			color: HighlightText;
			box-shadow: none;
		}

		body.home-marketing-page .home-hero__logo-backdrop {
			display: none;
		}

		body.home-marketing-page .home-hero::before,
		body.home-marketing-page .home-hero::after,
		body.home-marketing-page .home-live-demo::before,
		body.home-marketing-page .home-live-demo__screen::after,
		body.home-marketing-page .home-live-demo__screen-chrome,
		body.home-marketing-page .home-live-demo__display::before,
		body.home-marketing-page .home-live-demo__display::after,
		body.home-marketing-page .home-live-demo__stand,
		body.home-marketing-page .home-live-demo__table {
			display: none;
		}
	}

	@keyframes home-hero-wheel-spin {
		from {
			rotate: 0deg;
		}

		to {
			rotate: 360deg;
		}
	}

	@keyframes home-hero-logo-backdrop-fade {
		from {
			opacity: 0;
		}

		to {
			opacity: var(--app-home-hero-logo-backdrop-opacity);
		}
	}
}

@view-transition {
	navigation: auto;
}