/**
 * Hero artwork for Host Portal workspaces.
 *
 * The workspace heroes carried a flat gradient with one small mock UI card, so
 * every page read the same and none of them read as designed. This adds depth
 * behind the copy with a soft aurora wash and gives each workspace its own
 * accent hue, so the pages feel related without looking identical.
 *
 * Deliberately no linework. It is colour and light only, which lets the glass
 * card be the single object in the hero rather than competing with shapes.
 */

body.twe-site :is(
	.twe-journey-hero,
	.twe-legacy-hero,
	.twe-command-hero,
	.twe-exec-hero,
	.twe-intelligence-hero,
	.twe-relationship-hero,
	.twe-conversion-hero,
	.twe-engagement-hero,
	.twe-lifecycle-hero,
	.twe-social-hero,
	.twe-ops-hero,
	.twe-platform-hero,
	.twe-onboarding-hero,
	.twe-support-hero,
	.twe-help-hero
) {
	--twe-hero-accent: 268;
	--twe-hero-accent-2: 43;
	position: relative;
	isolation: isolate;
	overflow: hidden;
}

/* Aurora wash. Two large, very soft radial pools, one in the accent hue and
 * one in gold, sitting behind everything. */
body.twe-site :is(
	.twe-journey-hero,.twe-legacy-hero,.twe-command-hero,.twe-exec-hero,
	.twe-intelligence-hero,.twe-relationship-hero,.twe-conversion-hero,
	.twe-engagement-hero,.twe-lifecycle-hero,.twe-social-hero,.twe-ops-hero,
	.twe-platform-hero,.twe-onboarding-hero,.twe-support-hero,.twe-help-hero
)::before {
	content: "";
	position: absolute;
	inset: -10% -5% -20%;
	z-index: -2;
	pointer-events: none;
	background:
		radial-gradient(54% 66% at 76% 28%, hsl(var(--twe-hero-accent) 70% 56% / .26) 0%, transparent 72%),
		radial-gradient(42% 52% at 98% 78%, hsl(var(--twe-hero-accent-2) 66% 54% / .12) 0%, transparent 74%),
		radial-gradient(58% 68% at 4% 96%, hsl(var(--twe-hero-accent) 58% 38% / .20) 0%, transparent 76%);
	filter: blur(10px);
}

/* No ring motif here on purpose. An earlier version drew concentric orbits and
 * a dashed path across the hero, and read as stray squiggles behind the card
 * rather than as depth. The aurora wash above does the work instead: it gives
 * the panel dimension without putting shapes on screen that have to mean
 * something. If artwork returns here it should be a single deliberate object,
 * not scattered linework. */

/* Per-workspace accent hue, so the pages are a family rather than clones. */
body.twe-site .twe-journey-hero      { --twe-hero-accent: 276; }
body.twe-site .twe-legacy-hero       { --twe-hero-accent: 288; }
body.twe-site .twe-command-hero      { --twe-hero-accent: 262; }
body.twe-site .twe-exec-hero         { --twe-hero-accent: 246; }
body.twe-site .twe-intelligence-hero { --twe-hero-accent: 232; }
body.twe-site .twe-relationship-hero { --twe-hero-accent: 318; }
body.twe-site .twe-conversion-hero   { --twe-hero-accent: 300; }
body.twe-site .twe-engagement-hero   { --twe-hero-accent: 330; }
body.twe-site .twe-lifecycle-hero    { --twe-hero-accent: 254; }
body.twe-site .twe-social-hero       { --twe-hero-accent: 284; }
body.twe-site .twe-ops-hero          { --twe-hero-accent: 206; }
body.twe-site .twe-platform-hero     { --twe-hero-accent: 218; }
body.twe-site .twe-onboarding-hero   { --twe-hero-accent: 270; }
body.twe-site .twe-support-hero      { --twe-hero-accent: 292; }
body.twe-site .twe-help-hero         { --twe-hero-accent: 264; }

/* The mock cards now sit on real artwork, so they read as glass rather than as
 * a grey box: deeper blur, a lit top edge, and a softer shadow. */
body.twe-site :is(
	.twe-journey-hero-visual,
	.twe-legacy-hero-art,
	.twe-social-hero-card
) {
	border: 1px solid rgba(255,255,255,.2) !important;
	background:
		linear-gradient(150deg, rgba(255,255,255,.16), rgba(255,255,255,.03)) !important;
	box-shadow:
		0 1px 0 rgba(255,255,255,.28) inset,
		0 40px 90px rgba(0,0,0,.42) !important;
	backdrop-filter: blur(16px) saturate(115%) !important;
	-webkit-backdrop-filter: blur(16px) saturate(115%) !important;
}

/* Respect reduced-motion and low-power preferences by dropping the blur work
 * rather than the artwork itself. */
@media (prefers-reduced-motion: reduce) {
	body.twe-site :is(
		.twe-journey-hero,.twe-legacy-hero,.twe-command-hero,.twe-exec-hero,
		.twe-intelligence-hero,.twe-relationship-hero,.twe-conversion-hero,
		.twe-engagement-hero,.twe-lifecycle-hero,.twe-social-hero,.twe-ops-hero,
		.twe-platform-hero,.twe-onboarding-hero,.twe-support-hero,.twe-help-hero
	)::before {
		filter: none;
	}
}