:root {
	--corner-radius: 2px;
}

[contenteditable] { white-space: pre }

#elevator-pitch {
	& .big {
		font-size: 1.4em;
	}

	& em {
		font-style: unset;
		color: var(--secondary-4);
		@container style(--color-scheme: dark) {
			color: var(--secondary-7);
		}
	}
}

p.important {
	font-size: 1.2em;
}

page-hero {
	background-image:
		radial-gradient(ellipse at 100% -40%, #fff0, #ccaaff06 70%, #fff0 70%),
		radial-gradient(ellipse at -40% -20%, #fff0, #bb88ff02 60%, #fff0 60%),
		radial-gradient(ellipse at 180% 180%, #fff0, #bb88ff02 60%, #fff0 60%),
		linear-gradient(to top left, #a2f1, transparent),
		linear-gradient(to top right, #c2d1, transparent);
	&::after {
		content: '';
		display: block;
		position: absolute;
		bottom: 0;
		height: .2rem;
		left: 0;
		right: 0;
		background-image: linear-gradient(to right, #0660, #0f6, #0660);
		background-image: linear-gradient(to right in hsl, #6060, #f0f, #6060);
		filter: saturate(.4) opacity(.2);
	}
}

skooma-showcase {
	--padding: .6em;
	border-radius: var(--corner-radius);
	padding: var(--padding);
	background-color: #fff1;
	--hr-color: var(--primary-4);
	tab-size: 3;
}

type-writer {
	font-weight: bold;
	&:defined::after {
		content: "|";
		opacity: 0.5;
	}
}

main {
	line-height: 1.2em;

	p {
		line-height: 1.6em;
	}
}