/* Foundation */
@keyframes opacity {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
@keyframes rotate {
	from {
		rotate: 0deg;
	}
	to {
		rotate: 360deg;
	}
}
:root {
	--border-xsmall-primary: var(--border-size-xsmall) solid var(--color-border-primary);
	--border-xsmall-secondary: var(--border-size-xsmall) solid var(--color-border-secondary);
	--border-xsmall-tertiary: var(--border-size-xsmall) solid var(--color-border-tertiary);
	--border-small-primary: var(--border-size-small) solid var(--color-border-primary);
	--border-small-primary-inverse: var(--border-size-small) solid var(--color-border-primary-inverse);
	--border-small-secondary: var(--border-size-small) solid var(--color-border-secondary);
	--border-small-secondary-inverse: var(--border-size-small) solid var(--color-border-secondary-inverse);
	--border-small-tertiary: var(--border-size-small) solid var(--color-border-tertiary);
	--border-small-tertiary-inverse: var(--border-size-small) solid var(--color-border-tertiary-inverse);
}
/* Naming of colors and fonts inspired by Uber Base (https://base.uber.com/6d2425e9f/p/8898fb-color-legacy/b/065744) */
:root {
	/* Color Primitives */
	--color-white: hsl(0, 0%, 100%);
	--color-gray-20: hsl(0, 0%, 97.5%);
	--color-gray-50: hsl(0, 0%, 95%);
	--color-gray-100: hsl(0, 0%, 92%);
	--color-gray-150: hsl(0, 0%, 89%);
	--color-gray-200: hsl(0, 0%, 83%);
	--color-gray-300: hsl(0, 0%, 70%);
	--color-gray-400: hsl(0, 0%, 60%);
	--color-gray-500: hsl(0, 0%, 50%);
	--color-gray-600: hsl(0, 0%, 40%);
	--color-gray-700: hsl(0, 0%, 33%);
	--color-gray-800: hsl(0, 0%, 23%);
	--color-gray-900: hsl(0, 0%, 13%);
	--color-gray-950: hsl(0, 0%, 8%);
	--color-black: hsl(0, 0%, 2%);

	--color-red-20: hsl(0, 64%, 97%);
	--color-red-50: hsl(0, 64%, 95%);
	--color-red-100: hsl(0, 64%, 90%);
	--color-red-150: hsl(0, 64%, 85%);
	--color-red-200: hsl(0, 64%, 80%);
	--color-red-300: hsl(0, 64%, 70%);
	--color-red-400: hsl(0, 60%, 60%);
	--color-red-500: hsl(0, 64%, 50%);
	--color-red-600: hsl(0, 64%, 40%);
	--color-red-700: hsl(0, 64%, 30%);
	--color-red-800: hsl(0, 64%, 20%);
	--color-red-900: hsl(0, 64%, 10%);

	--color-orange-50: hsl(37, 70%, 95%);
	--color-orange-100: hsl(37, 70%, 90%);
	--color-orange-150: hsl(37, 70%, 83%);
	--color-orange-200: hsl(37, 70%, 80%);
	--color-orange-300: hsl(37, 70%, 70%);
	--color-orange-400: hsl(37, 70%, 60%);
	--color-orange-500: hsl(37, 70%, 50%);
	--color-orange-600: hsl(37, 70%, 40%);
	--color-orange-700: hsl(37, 70%, 30%);
	--color-orange-800: hsl(37, 70%, 20%);
	--color-orange-900: hsl(37, 70%, 10%);

	--color-yellow-50: hsl(60, 80%, 95%);
	--color-yellow-100: hsl(60, 80%, 90%);
	--color-yellow-150: hsl(60, 80%, 85%);
	--color-yellow-200: hsl(60, 80%, 80%);
	--color-yellow-300: hsl(60, 80%, 70%);
	--color-yellow-400: hsl(60, 80%, 60%);
	--color-yellow-500: hsl(60, 80%, 50%);
	--color-yellow-600: hsl(60, 80%, 40%);
	--color-yellow-700: hsl(60, 80%, 30%);
	--color-yellow-800: hsl(60, 80%, 20%);
	--color-yellow-900: hsl(60, 80%, 10%);

	--color-green-50: hsl(79, 35%, 95%);
	--color-green-100: hsl(82, 35%, 90%);
	--color-green-150: hsl(85, 50%, 85%);
	--color-green-200: hsl(88, 36%, 80%);
	--color-green-300: hsl(91, 36%, 70%);
	--color-green-400: hsl(94, 37%, 60%);
	--color-green-500: hsl(97, 37%, 50%);
	--color-green-600: hsl(100, 38%, 40%);
	--color-green-700: hsl(102, 39%, 30%);
	--color-green-800: hsl(103, 64%, 22%); /* brand green #285A14 */
	--color-green-900: hsl(103, 65%, 11%);

	--color-turquoise-50: hsl(170, 58%, 95%);
	--color-turquoise-100: hsl(170, 58%, 90%);
	--color-turquoise-150: hsl(170, 58%, 83%);
	--color-turquoise-200: hsl(170, 58%, 80%);
	--color-turquoise-300: hsl(170, 58%, 70%);
	--color-turquoise-400: hsl(170, 58%, 60%);
	--color-turquoise-500: hsl(170, 58%, 50%);
	--color-turquoise-600: hsl(170, 58%, 40%);
	--color-turquoise-700: hsl(170, 58%, 30%);
	--color-turquoise-800: hsl(170, 58%, 20%);
	--color-turquoise-900: hsl(170, 58%, 10%);

	--color-blue-50: hsl(210, 58%, 95%);
	--color-blue-100: hsl(210, 58%, 90%);
	--color-blue-150: hsl(210, 58%, 83%);
	--color-blue-200: hsl(210, 58%, 80%);
	--color-blue-300: hsl(210, 58%, 70%);
	--color-blue-400: hsl(210, 58%, 60%);
	--color-blue-500: hsl(210, 58%, 50%);
	--color-blue-600: hsl(210, 58%, 40%);
	--color-blue-700: hsl(210, 58%, 30%);
	--color-blue-800: hsl(210, 58%, 20%);
	--color-blue-900: hsl(210, 58%, 10%);

	--color-purple-50: hsl(285, 67%, 95%);
	--color-purple-100: hsl(285, 67%, 91%);
	--color-purple-150: hsl(285, 67%, 83%);
	--color-purple-200: hsl(285, 67%, 80%);
	--color-purple-300: hsl(285, 67%, 70%);
	--color-purple-400: hsl(285, 67%, 60%);
	--color-purple-500: hsl(285, 67%, 50%);
	--color-purple-600: hsl(285, 67%, 40%);
	--color-purple-700: hsl(285, 67%, 30%);
	--color-purple-800: hsl(285, 67%, 20%);
	--color-purple-900: hsl(285, 67%, 10%);

	/* Foundation Colors */
	--color-brand: #285A14;
	--color-negative: var(--color-red-400);
	--color-warning: var(--color-yellow-400);
	--color-positive: var(--color-green-400);

	/* Core Colors */
	--color-background-primary: var(--color-gray-20);
	--color-background-secondary: var(--color-white);
	--color-background-tertiary: var(--color-gray-100);
	--color-background-primary-inverse: var(--color-gray-900);
	--color-background-secondary-inverse: var(--color-gray-700);
	--color-background-brand: hsl(from var(--color-brand) h calc(s - 40) calc(l + 65));
	--color-background-brand-inverse: var(--color-brand);

	--color-content-primary: var(--color-gray-900);
	--color-content-secondary: var(--color-gray-600);
	--color-content-tertiary: var(--color-gray-400);
	--color-content-primary-inverse: var(--color-white);
	--color-content-secondary-inverse: var(--color-gray-200);
	--color-content-tertiary-inverse: var(--color-gray-400);

	--color-backdrop: hsl(from var(--color-black) h s l / 0.1);

	--color-border-primary: var(--color-gray-700);
	--color-border-primary-inverse: var(--color-gray-200);
	--color-border-secondary: var(--color-gray-200);
	--color-border-secondary-inverse: var(--color-gray-500);
	--color-border-tertiary: var(--color-white);
	--color-border-tertiary-inverse: var(--color-gray-800);
	--color-border-brand: hsl(from var(--color-brand) h calc(s + 5) calc(l + 5));

	/* Shadows */
	--box-shadow: 0 1px 10px -calc(10rem / 16) hsl(0deg 0 0 / 0.1),
	              0 1.5px 20px -calc(10rem / 16) hsl(0deg 0 0 / 0.1),
	              0 2px 30px -calc(10rem / 16) hsl(0deg 0 0 / 0.1);

	--background-root: fixed var(--color-background-primary) url('/assets/images/grid.png') center -1px repeat;
	--background-color-backdrop: hsl(from var(--color-gray-400) h s l / 0);
	--backdrop-filter: blur(4px) contrast(0.2) brightness(1.55); /* used for underline and border highlight (a-nav-item-sidebar) */
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
:root {
		--background-root: fixed var(--color-background-primary) url('/assets/images/grid@2x.png') center -1px / calc(20rem / 16) repeat;
}
	}
@media (prefers-color-scheme: dark) {
:root {
		/** @todo */
}
	}
:root [data-theme="dark"] {
		/* same as @media (prefers-color-scheme: dark) */
	}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: normal;
	font-weight: 100;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Thin.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: normal;
	font-weight: 100;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Thin.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: italic;
	font-weight: 100;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Thin_Italic.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: italic;
	font-weight: 100;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Thin_Italic.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: normal;
	font-weight: 200;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_ExtraLight.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: normal;
	font-weight: 200;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_ExtraLight.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: italic;
	font-weight: 200;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_ExtraLight_Italic.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: italic;
	font-weight: 200;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_ExtraLight_Italic.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: normal;
	font-weight: 300;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Light.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: normal;
	font-weight: 300;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Light.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: italic;
	font-weight: 300;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Light_Italic.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: italic;
	font-weight: 300;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Light_Italic.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: normal;
	font-weight: 400;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Regular.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: normal;
	font-weight: 400;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Regular.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: italic;
	font-weight: 400;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Italic.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: italic;
	font-weight: 400;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Italic.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: normal;
	font-weight: 450;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Normal.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: normal;
	font-weight: 450;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Normal.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: italic;
	font-weight: 450;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Normal_Italic.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: italic;
	font-weight: 450;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Normal_Italic.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: normal;
	font-weight: 500;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Medium.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: normal;
	font-weight: 500;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Medium.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: italic;
	font-weight: 500;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Medium_Italic.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: italic;
	font-weight: 500;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Medium_Italic.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: normal;
	font-weight: 600;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_DemiBold.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: normal;
	font-weight: 600;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_DemiBold.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: italic;
	font-weight: 600;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_DemiBold_Italic.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: italic;
	font-weight: 600;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_DemiBold_Italic.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: normal;
	font-weight: 700;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Bold.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: normal;
	font-weight: 700;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Bold.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: italic;
	font-weight: 700;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Bold_Italic.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: italic;
	font-weight: 700;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Bold_Italic.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: normal;
	font-weight: 800;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_ExtraBold.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: normal;
	font-weight: 800;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_ExtraBold.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: italic;
	font-weight: 800;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_ExtraBold_Italic.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: italic;
	font-weight: 800;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_ExtraBold_Italic.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: normal;
	font-weight: 900;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Black.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: normal;
	font-weight: 900;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Black.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: italic;
	font-weight: 900;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Black_Italic.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: italic;
	font-weight: 900;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_Black_Italic.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: normal;
	font-weight: 950;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_ExtraBlack.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: normal;
	font-weight: 950;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_ExtraBlack.woff2') format('woff2');
	unicode-range: U+004D;
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms';
	font-style: italic;
	font-weight: 950;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_ExtraBlack_Italic.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'TT Norms M';
	font-style: italic;
	font-weight: 950;
	src: url('/assets/fonts/tt-norms/TT_Norms_Pro_ExtraBlack_Italic.woff2') format('woff2');
	unicode-range: U+004D;
}
:root {
	--duration-xsmall: 0s;
	--duration-small: 0s;
	--duration-medium: 0s;
	--duration-large: 0s;
	--duration-xlarge: 0s;
	--duration-rotate-loader: 0s;

	--ease-out: cubic-bezier(0.215, 0.610, 0.275, 1.000);
}
@media (prefers-reduced-motion: no-preference) {
:root {
		--duration-xsmall: 120ms;
		--duration-small: 160ms;
		--duration-medium: 200ms;
		--duration-large: 400ms;
		--duration-xlarge: 550ms;
		--duration-rotate-loader: 1000ms;
}
	}
* {
	margin: 0;
	padding: 0;
}
html {
	font-family: system-ui, sans-serif;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
	color-scheme: dark light;
	box-sizing: border-box;
}
html *, html *::before, html *::after {
		box-sizing: inherit;
	}
@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}
body {
	min-block-size: 100%;
	min-block-size: 100dvb;
}
dialog {
	margin: auto;
	border: 0;
}
[popover] {
	border: 0;
}
a {
	color: inherit;
	text-underline-offset: 0.2ex;
}
picture, video, canvas, audio, iframe, embed, object, summary {
	display: block;
}
img, svg {
	vertical-align: middle;
}
img, picture, svg {
	max-inline-size: 100%;
	block-size: auto;
}
p, h1, h2, h3, h4, h5, h6 {
	overflow-wrap: break-word;
}
iframe, fieldset {
	border: 0;
}
button {
	text-align: start;
}
button, summary {
	border: 0;
	cursor: pointer;
}
label {
	display: block;
}
input,
textarea,
button {
	font: inherit;
	line-height: inherit;
	color: inherit;
	border-radius: 0;
	border-width: 1px;
	border-style: solid;
	background-color: transparent;
}
input[type="date"],
input[type="time"] {
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
	/* ::-webkit-calendar-picker-indicator {
		display: none;
	} */
}
input[type="date"]::-webkit-date-and-time-value, input[type="time"]::-webkit-date-and-time-value {
		text-align: inherit;
	}
textarea {
	resize: vertical;
	resize: block;
}
hr {
	border: none;
	-webkit-border-before: 1px solid currentcolor;
	        border-block-start: 1px solid currentcolor;
	color: inherit;
	block-size: 0;
	overflow: visible;
}
table {
	border-collapse: collapse;
}
nav ul {
	list-style: none;
}
:disabled, [aria-disabled="true"] {
	cursor: not-allowed;
}
:focus-visible {
	outline: 2px solid Highlight;
	outline-offset: 2px;
}
[hidden]:not([hidden="until-found"]) {
	display: none !important;
}
/**
 * Each size should divide by 4.
 * Breakpoints:
 *  - on-screen nav: (min-width: 64em)
 */
:root {
	--size-10: calc(1rem / 16);
	--size-50: calc(2rem / 16);
	--size-100: calc(4rem / 16);
	--size-150: calc(6rem / 16);
	--size-200: calc(8rem / 16);
	--size-250: calc(10rem / 16);
	--size-300: calc(12rem / 16);
	--size-400: calc(16rem / 16);
	--size-500: calc(20rem / 16);
	--size-600: calc(28rem / 16);
	--size-700: calc(40rem / 16);
	--size-800: calc(56rem / 16);
	--size-900: calc(80rem / 16);
	--size-1000: calc(140rem / 16);

	/* Grid */
	--gap-inline: var(--size-200);
	--gap-block: var(--size-500);
	--gap-block-header: var(--size-700);
	--gap-text-paragraph: var(--size-400);
	--gap-text-heading: var(--size-800);

	/* Sizes */
	--max-width-content: calc(1380rem / 16);
	--max-width-text: calc(660rem / 16);

	--height-header: calc(60rem / 16);

	/* Z-index */
	--z-index-main-wrapper: 20;
	--z-index-dialog: 90;
	--z-index-header: 100;
	--z-index-popover: 1000;
	/* Use px values instead of rem */
	--border-size-xsmall: 1px;
	--border-size-small: 2px;
	--border-size-medium: 3px;
	--border-radius-xsmall: 1px;
	--border-radius-small: 2px;
	--border-radius-medium: 4px;
	--border-radius-large: 8px;

	/* Border */
}
@media (min-width: 32em) {
:root {
		--gap-inline: var(--size-500);
}
	}
@media (min-width: 94em) {
:root {
		--max-width-content: calc(1500rem / 16);
}
	}
/**
 * Each size should divide by 4.
 */
:root {
	/* Font family */
	--font-family: 'TT Norms M', 'TT Norms', Avenir, sans-serif;
	--font-family-code: ui-monospace, monospace;


	/* Font size */
	--font-size-heading-xxlarge: calc(40rem / 16);
	--font-size-heading-xlarge: calc(37rem / 16);
	--font-size-heading-large: calc(32rem / 16);
	--font-size-heading-medium: calc(29rem / 16);
	--font-size-heading-small: calc(24rem / 16);
	--font-size-heading-xsmall: calc(20rem / 16);
	--font-size-heading-xxsmall: calc(16rem / 16);

	--font-size-label-xlarge: calc(23rem / 16);
	--font-size-label-large: calc(18rem / 16);
	--font-size-label-medium: calc(16rem / 16);
	--font-size-label-small: calc(14rem / 16);
	--font-size-label-xsmall: calc(12rem / 16);

	--font-size-paragraph-xlarge: calc(23rem / 16);
	--font-size-paragraph-large: calc(18rem / 16);
	--font-size-paragraph-medium: calc(16rem / 16);
	--font-size-paragraph-small: calc(14rem / 16);
	--font-size-paragraph-xsmall: calc(12rem / 16);

	--font-size-code-large: calc(17rem / 16);
	--font-size-code-medium: calc(15rem / 16);
	--font-size-code-small: calc(14rem / 16);

	/* Line height */
	--line-height-heading-xxlarge: calc(40 / 40);
	--line-height-heading-xlarge: calc(40 / 37);
	--line-height-heading-large: calc(36 / 32);
	--line-height-heading-medium: calc(32 / 29);
	--line-height-heading-small: calc(28 / 24);
	--line-height-heading-xsmall: calc(24 / 20);
	--line-height-heading-xxsmall: calc(20 / 16);

	--line-height-label-xlarge: calc(26 / 18);
	--line-height-label-large: calc(24 / 18);
	--line-height-label-medium: calc(20 / 16);
	--line-height-label-small: calc(20 / 14);
	--line-height-label-xsmall: calc(16 / 12);

	--line-height-paragraph-xlarge: calc(28 / 23);
	--line-height-paragraph-large: calc(28 / 18);
	--line-height-paragraph-medium: calc(24 / 16);
	--line-height-paragraph-small: calc(20 / 14);
	--line-height-paragraph-xsmall: calc(16 / 12);

	--line-height-code-large: calc(28 / 17);
	--line-height-code-medium: calc(24 / 15);
	--line-height-code-small: calc(20 / 14);

	/* Font */
	--font-heading-xxlarge: 700 var(--font-size-heading-xxlarge)/var(--line-height-heading-xxlarge) var(--font-family);
	--font-heading-xlarge: 700 var(--font-size-heading-xlarge)/var(--line-height-heading-xlarge) var(--font-family);
	--font-heading-large: 700 var(--font-size-heading-large)/var(--line-height-heading-large) var(--font-family);
	--font-heading-medium: 700 var(--font-size-heading-medium)/var(--line-height-heading-medium) var(--font-family);
	--font-heading-small: 700 var(--font-size-heading-small)/var(--line-height-heading-small) var(--font-family);
	--font-heading-xsmall: 700 var(--font-size-heading-xsmall)/var(--line-height-heading-xsmall) var(--font-family);
	--font-heading-xxsmall: 700 var(--font-size-heading-xxsmall)/var(--line-height-heading-xxsmall) var(--font-family);

	--font-label-xlarge: 450 var(--font-size-label-xlarge)/var(--line-height-label-xlarge) var(--font-family);
	--font-label-large: 450 var(--font-size-label-large)/var(--line-height-label-large) var(--font-family);
	--font-label-medium: 450 var(--font-size-label-medium)/var(--line-height-label-medium) var(--font-family);
	--font-label-small: 450 var(--font-size-label-small)/var(--line-height-label-small) var(--font-family);
	--font-label-xsmall: 450 var(--font-size-label-xsmall)/var(--line-height-label-xsmall) var(--font-family);

	--font-paragraph-xlarge: 450 var(--font-size-paragraph-xlarge)/var(--line-height-paragraph-xlarge) var(--font-family);
	--font-paragraph-large: 450 var(--font-size-paragraph-large)/var(--line-height-paragraph-large) var(--font-family);
	--font-paragraph-medium: 450 var(--font-size-paragraph-medium)/var(--line-height-paragraph-medium) var(--font-family);
	--font-paragraph-small: 450 var(--font-size-paragraph-small)/var(--line-height-paragraph-small) var(--font-family);
	--font-paragraph-xsmall: 450 var(--font-size-paragraph-xsmall)/var(--line-height-paragraph-xsmall) var(--font-family);

	--font-code-large: 500 var(--font-size-code-large)/var(--line-height-code-large) var(--font-family-code);
	--font-code-medium: 500 var(--font-size-code-medium)/var(--line-height-code-medium) var(--font-family-code);
	--font-code-small: 500 var(--font-size-code-small)/var(--line-height-code-small) var(--font-family-code);

	--font: var(--font-paragraph-medium);

	/* Letter spacing */
	--leter-spacing-display: -0.003em;

	/* Other */
	--hyphenate-limit: 7;

	/* Font feature settings */
	--font-variant-alternates-display: styleset(display);
}
:root * {
		font-variant-alternates: styleset(alternates);
	}
/*
 * @author tobias.wolf@wagnerwagner.de
 * We want the M with ss19 (styleset 19).
 * Therefore we define a "TT Norms M" in tt-norms.css with unicode range "U+004D" (uppercase M)
 * This results in a M rendered with ss19 and all other characters rendered without styleset.
 */
@font-feature-values 'TT Norms M' {
	@styleset {
		alternates: 19;
		display: 19;
	}
}
@font-feature-values 'TT Norms' {
	@styleset {
		display: 18;
	}
}
/* HELPER/DEBUG */
/** DEBUG */
body[data-show-grid] {
	--_color: hsla(0, 0%, 0%, 5%);
	--_grid-vertical: calc(4rem / 16);
	--_grid-gap: var(--gap-inline);
	--_grid-column: calc((var(--max-width) - var(--_grid-gap) * 11) / 12);

	background:
		center/calc(var(--_grid-column) + var(--_grid-gap)) 100%
		linear-gradient(90deg, var(--_color) calc(var(--_grid-column) * 0.5), transparent calc(var(--_grid-column) * 0.5), transparent calc(var(--_grid-column) * 0.5 + var(--_grid-gap)), var(--_color) calc(var(--_grid-column) * 0.5 + var(--_grid-gap))),
		top/100% calc(var(--_grid-vertical) * 2)
		linear-gradient(transparent var(--_grid-vertical), var(--_color) var(--_grid-vertical));
}
/* Atoms */
.a-button-hamburger {
	display: grid;
	grid-auto-flow: column;
	grid-template-rows: 1fr auto auto auto 1fr;
	-moz-column-gap: var(--size-200);
	     column-gap: var(--size-200);
	row-gap: calc(3rem / 16);
	align-items: center;
	align-content: center;
	padding-block: var(--size-400);
	padding-inline: var(--size-400);
	border: 0;
}
.a-button-hamburger > span {
		grid-column-start: 1;
		inline-size: var(--size-300);
		block-size: var(--border-size-small);
		background-color: currentcolor;
	}
.a-button-hamburger > span:nth-of-type(1) {
		grid-row-start: 2;
	}
.a-button-hamburger > span:nth-of-type(2) {
		grid-row-start: 3;
	}
.a-button-hamburger > span:nth-of-type(3) {
		grid-row-start: 4;
	}
.a-button-hamburger > i {
		grid-column-start: 2;
		grid-row-end: span 5;
		font: var(--font-label-medium);
	}
.a-button-hamburger:has(~ :where(.m-nav-main, .m-nav-sidebars)[popover]:popover-open) {
		color: var(--color-content-tertiary);
	}
.a-button-hamburger[popovertarget="sidebar-navs"] {
		-webkit-margin-start: auto;
		        margin-inline-start: auto;
		min-inline-size: calc(146rem / 16);
		padding-block: var(--size-300);
		justify-content: start;
		color: var(--color-content-secondary);
	}
@media (min-width: 64em) {
.a-button-hamburger {
		display: none;
}
	}
.a-button-search {
	border: 0;
	padding-inline: var(--size-400);
	padding-block: var(--size-400);
	font: var(--font-label-medium);
}
.a-button-search:has(~ .m-search-dialog[popover]:popover-open) {
		color: var(--color-content-tertiary);
	}
.a-button {
	--_padding-inline: var(--size-300);
	--_padding-block: var(--size-150);
	--_font: var(--font-label-medium);
	--_border-size: var(--border-size-small);
	--_border-color: hsl(from var(--_background-color) h calc(s - 5) calc(l - 7));
	--_border-radius: var(--border-radius-xsmall);
	--_color: var(--color-content-primary-inverse);
	--_background-color: var(--color-background-primary-inverse);

	display: inline-flex;
	-moz-column-gap: calc(var(--_padding-inline) * 0.75);
	     column-gap: calc(var(--_padding-inline) * 0.75);
	text-decoration: none;
	font: var(--_font);
	color: var(--_color);
	border: var(--_border-size) solid var(--_border-color);
	border-radius: var(--_border-radius);
	background-color: var(--_background-color);
	padding-inline: calc(var(--_padding-inline) - var(--_border-size));
	padding-block: calc(var(--_padding-block) - var(--_border-size));
}
.a-button[data-size="large"] {
		--_font: var(--font-label-large);
		--_padding-inline: var(--size-300);
		--_padding-block: var(--size-200);
	}
.a-button[data-size="small"] {
		--_font: var(--font-label-medium);
		--_border-size: var(--border-size-xsmall);
		--_padding-inline: var(--size-200);
		--_padding-block: calc(2rem / 16);
	}
.a-button[data-size="xsmall"] {
		--_font: var(--font-label-small);
		--_border-size: var(--border-size-xsmall);
		--_padding-inline: var(--size-150);
		--_padding-block: calc(3rem / 16);
	}
.a-button[data-kind="secondary"] {
		/* --_color: var(--color-content-secondary-inverse); */
		--_background-color: var(--color-background-secondary-inverse);
	}
.a-button[data-kind="tertiary"] {
		--_color: var(--color-content-primary);
		--_background-color: var(--color-background-tertiary);
	}
.a-button[data-kind="brand"] {
		--_background-color: var(--color-brand);
	}
.a-button[data-shape="squared"] {
		--_padding-inline: var(--_padding-block);

		justify-content: center;
		block-size: calc(1lh + var(--_padding-block) * 2 + var(--_border-size) * 2);
		inline-size: calc(1lh + var(--_padding-block) * 2 + var(--_border-size) * 2);
	}
.a-button[data-variant="ghost"],
	.a-button[data-variant="outline"],
	.a-button[data-variant="text"] {
		--_color: var(--color-content-primary);
	}
.a-button[data-variant="ghost"][data-kind="secondary"], .a-button[data-variant="outline"][data-kind="secondary"], .a-button[data-variant="text"][data-kind="secondary"] {
			--_color: var(--color-content-secondary);
		}
.a-button[data-variant="ghost"][data-kind="tertiary"], .a-button[data-variant="outline"][data-kind="tertiary"], .a-button[data-variant="text"][data-kind="tertiary"] {
			--_color: var(--color-content-tertiary);
		}
.a-button[data-variant="ghost"] {
		--_border-color: transparent;
		--_background-color: transparent;
	}
.a-button[data-variant="ghost"][data-selected] {
			--_color: var(--color-content-primary-inverse);
			--_background-color: var(--color-background-brand-inverse);
		}
.a-button[data-variant="outline"] {
		--_border-color: currentcolor;
		--_background-color: var(--color-background-secondary);
	}
.a-button[data-variant="outline"][data-kind="brand"] {
			--_color: var(--color-brand);
		}
.a-button[data-variant="text"] {
		--_padding-block: 0;
		--_padding-inline: 0;
		--_border-size: 0;
		--_background-color: transparent;
	}
.a-button[data-typography="code"] {
		font: var(--font-code-small);
	}
.a-button:where(:focus-visible, :hover) {
		background-color: hsl(from var(--_background-color) h s calc(l - 3));
	}
.a-display {
	-webkit-margin-start: -0.02em;
	        margin-inline-start: -0.02em;
	font: var(--font-heading-xlarge);
	font-variant-alternates: var(--font-variant-alternates-display);
	text-wrap-style: balance;
}
.a-heading {
	font: var(--font-heading-medium);
	text-wrap-style: pretty;
}
.a-heading > a {
		display: inline-block;
		text-decoration-thickness: var(--border-size-small);
		-webkit-text-decoration-color: var(--color-border-primary);
		        text-decoration-color: var(--color-border-primary);
	}
h1.a-heading,
.a-heading[data-size="xxlarge"] {
	font: var(--font-heading-xxlarge);
}
h2.a-heading,
.a-heading[data-size="xlarge"] {
	font: var(--font-heading-xlarge);
}
h3.a-heading,
.a-heading[data-size="large"] {
	font: var(--font-heading-large);
}
h4.a-heading,
.a-heading[data-size="medium"] {
	font: var(--font-heading-medium);
}
h5.a-heading,
.a-heading[data-size="small"] {
	font: var(--font-heading-small);
}
h6.a-heading,
.a-heading[data-size="xsmall"] {
	font: var(--font-heading-xsmall);
}
.a-icon {
	display: inline-block;
	block-size: 1lh;
	aspect-ratio: 1;
	vertical-align: top;
}
.a-icon * {
		fill: currentcolor;
	}
.a-icon[data-color="brand"] {
		color: var(--color-brand);
	}
/* Typography */
.a-label {
	font: var(--font-label-medium);
}
.a-label[data-size="large"] {
		font: var(--font-label-large);
	}
.a-label[data-size="medium"] {
		font: var(--font-label-medium);
	}
.a-label[data-size="small"] {
		font: var(--font-label-small);
	}
.a-label[data-size="xsmall"] {
		font: var(--font-label-xsmall);
	}
.a-logo-header {
	padding-inline: var(--size-400);
	padding-block: var(--size-400);
	display: grid;
	align-items: center;
	align-self: stretch;
}
.a-nav-item-primary {
	block-size: 100%;
	display: grid;
	grid-template-rows: 1fr 0;
	align-items: center;
	padding-inline: var(--size-400);
	font: var(--font-label-medium);
	text-decoration: none;
}
.a-nav-item-primary::after {
		content: '';
		-webkit-margin-after: calc(var(--border-size-small) * -1);
		        margin-block-end: calc(var(--border-size-small) * -1);
		display: block;
		inline-size: 100%;
		block-size: var(--border-size-small);
		background-color: transparent;
	}
.a-nav-item-primary:where(button) {
		border: 0;
	}
.a-nav-item-primary[data-variant="step"] {
		padding-inline: var(--size-400);
	}
@media (min-width: 64em) {
		.a-nav-item-primary::after {
			content: '';
			-webkit-margin-after: calc(var(--border-size-small) * -1);
			        margin-block-end: calc(var(--border-size-small) * -1);
			display: block;
			inline-size: 100%;
			block-size: var(--border-size-small);
			background-color: transparent;
		}
			.a-nav-item-primary[data-state="open"]::after {
				background-color: var(--color-gray-300);
			}
	}
@media not (min-width: 64em) {
.a-nav-item-primary {
		text-align: end;
		font: var(--font-label-large);
		padding-block: var(--size-400);
		-webkit-padding-end: calc(var(--size-400) + 52rem / 16);
		        padding-inline-end: calc(var(--size-400) + 52rem / 16);
}

		.a-nav-item-primary[data-state="open"] {
			text-decoration: underline;
			-webkit-text-decoration-color: var(--color-gray-300);
			        text-decoration-color: var(--color-gray-300);
			text-underline-offset: 0.2em;
		}
	}
.a-nav-item-sidebar {
	--_padding-inline: calc(var(--size-400) - var(--border-size-small));
	--_border-size: var(--border-size-small);

	text-decoration: none;
	display: grid;
	grid-template-columns: 0 1fr;
	-moz-column-gap: var(--_padding-inline);
	     column-gap: var(--_padding-inline);
	font: var(--font-label-medium);
	text-wrap-style: pretty;
	padding-block: var(--size-150);
	-webkit-padding-end: var(--_padding-inline);
	        padding-inline-end: var(--_padding-inline);
}
.a-nav-item-sidebar > small {
		-webkit-margin-before: var(--size-100);
		        margin-block-start: var(--size-100);
		font: var(--font-label-small);
		color: var(--color-content-secondary);
	}
.a-nav-item-sidebar::before {
		content: '';
		grid-row: 1 / span 2;
		-webkit-margin-start: calc(var(--border-size-small) * -0.5 + var(--_border-size) * -0.5);
		        margin-inline-start: calc(var(--border-size-small) * -0.5 + var(--_border-size) * -0.5);
		display: block;
		inline-size: 100%;
		inline-size: var(--_border-size);
		background-color: transparent;
	}
.a-nav-item-sidebar > * {
		grid-column-start: 2;
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
	}
.a-nav-item-sidebar[data-variant="category"] {
		padding-block: var(--size-250);
		font-weight: 700;
	}
.a-nav-item-sidebar[data-variant="tertiary"] {
		padding-block: calc(var(--size-250) - var(--border-size-small) * 0.5);
	}
.a-nav-item-sidebar[data-state="open"]::before {
			background-color: var(--color-border-brand);
		}
.a-pagination {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
.a-separator {
  color: var(--color-content-tertiary);
}
/** a or code element */
.a-type {
	--_background-color: var(--color-background-tertiary);
	--_border-color: hsl(from var(--_background-color) h calc(s - 5) calc(l - 7));
	--_padding-inline: calc(var(--size-150) - var(--border-size-xsmall));

	display: inline-flex;
	gap: var(--_padding-inline);
	padding-inline: var(--_padding-inline);
	font: var(--font-code-small);
	border: var(--border-size-xsmall) solid var(--_border-color);
	border-radius: var(--border-radius-xsmall);
	background-color: var(--_background-color);
}
.a-type:where([data-type="class"], [data-type="object"]) {
		--_background-color: var(--color-green-200);
	}
.a-type:where([data-type="bool"]) {
		--_background-color: var(--color-purple-150);
	}
.a-type:where([data-type="null"]) {
		--_background-color: var(--color-purple-100);
	}
.a-type:where([data-type="int"]) {
		--_background-color: var(--color-orange-150);
	}
.a-type:where([data-type="float"], [data-type="number"]) {
		--_background-color: var(--color-red-150);
	}
.a-type:where([data-type="string"]) {
		--_background-color: var(--color-yellow-200);
	}
.a-type:where([data-type="array"], [data-type="callable"]) {
		--_background-color: var(--color-blue-150);
	}
.a-type:where(a) {
		text-decoration: none;
	}
.a-type:where(a):where(:focus-visible, :hover) {
			background-color: hsl(from var(--_background-color) h s calc(l - 3));
		}
.a-visually-hidden {
	-webkit-clip-path: inset(50%) !important;
	        clip-path: inset(50%) !important;
	height: 1px !important;
	width: 1px !important;
	overflow: hidden !important;
	position: absolute !important;
	white-space: nowrap !important;
	border: 0 !important;
}
/* Molecules */
.m-callout {
	padding: calc(var(--size-500) - var(--border-size-medium));
	font: var(--font-paragraph-large);
	font-weight: 500;
	border-radius: var(--border-radius-small);
	border: var(--border-size-medium) solid var(--color-blue-400);
	background-color: var(--color-blue-50);
}
.m-callout[data-theme="tip"] {
		border-color: var(--color-green-500);
		background-color: var(--color-green-50);
	}
.m-callout[data-theme="important"] {
		border-color: var(--color-purple-500);
		background-color: var(--color-purple-50);
	}
.m-callout[data-theme="warning"] {
		border-color: var(--color-orange-500);
		background-color: var(--color-orange-50);
	}
.m-callout[data-theme="caution"] {
		border-color: var(--color-red-500);
		background-color: var(--color-red-50);
	}
.m-text > .m-callout {
		margin-inline: calc(var(--border-size-small) * -0.5);
	}
.m-cart {
	display: grid;
	row-gap: var(--size-500);
	padding: var(--size-500);
	font: var(--font-paragraph-medium);
	font-variant-numeric: tabular-nums;
	border-radius: var(--border-radius-small);
	border: var(--border-xsmall-secondary);
	background-color: var(--color-background-secondary);
}
.m-cart__item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--size-400);
}
.m-cart__item > div:first-child {
		display: grid;
		row-gap: var(--size-50);
	}
.m-cart__item strong {
		font: var(--font-label-large);
	}
.m-cart__item small {
		font: var(--font-paragraph-small);
		color: var(--color-content-secondary);
	}
.m-cart__quantity {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}
.m-cart__quantity > output {
		min-inline-size: 3ch;
		text-align: center;
		font: var(--font-label-large);
	}
.m-cart__quantity > button {
		display: grid;
		place-items: center;
		inline-size: calc(32rem / 16);
		block-size: calc(32rem / 16);
		padding: 0;
		font: var(--font-label-large);
		line-height: 1;
		border: var(--border-xsmall-secondary);
		border-radius: var(--border-radius-small);
		background-color: var(--color-background-primary);
		cursor: pointer;
	}
.m-cart__quantity > button:where(:hover, :focus-visible):not(:disabled) {
			border-color: var(--color-border-primary);
		}
.m-cart__quantity > button:disabled {
			color: var(--color-content-tertiary);
			cursor: default;
		}
.m-cart__totals {
	display: grid;
	row-gap: var(--size-200);
	-webkit-padding-before: var(--size-400);
	        padding-block-start: var(--size-400);
	-webkit-border-before: var(--border-xsmall-secondary);
	        border-block-start: var(--border-xsmall-secondary);
	transition: opacity var(--duration-medium);
}
.m-cart__totals > div {
		display: flex;
		justify-content: space-between;
		gap: var(--size-400);
	}
.m-cart__totals dt {
		color: var(--color-content-secondary);
	}
[data-busy] > .m-cart__totals {
		opacity: 0.4;
	}
.m-cart__total {
	-webkit-margin-before: var(--size-200);
	        margin-block-start: var(--size-200);
	-webkit-padding-before: var(--size-300);
	        padding-block-start: var(--size-300);
	-webkit-border-before: var(--border-xsmall-secondary);
	        border-block-start: var(--border-xsmall-secondary);
	font: var(--font-heading-xsmall);
}
.m-cart__total > dt {
		color: inherit;
	}
.m-cart__note {
	font: var(--font-paragraph-small);
	color: var(--color-content-secondary);
}
.m-case {
	display: grid;
	grid-template-columns: 1fr 1fr;
	-moz-column-gap: var(--gap-inline);
	     column-gap: var(--gap-inline);
	box-sizing: border-box;
	-webkit-margin-before: var(--size-500);
	        margin-block-start: var(--size-500);
}
.m-case figure {
		position: relative;
		margin: 0;
		-webkit-padding-before: calc(70% + var(--size-200));
		        padding-block-start: calc(70% + var(--size-200));
		overflow: hidden;
	}
.m-case figure figcaption {
			position: absolute;
			z-index: 1;
			left: 0;
			right: 0;
			bottom: 0;
			box-sizing: border-box;
			padding-block: var(--size-100);
			padding-inline: var(--size-300);
			text-align: center;
			font: var(--font-code-medium);
			color: var(--color-content-secondary);
			background-color: var(--color-background-secondary);
			-webkit-border-before: var(--border-size-small) solid var(--color-border-secondary);
			        border-block-start: var(--border-size-small) solid var(--color-border-secondary);
			transition-duration: var(--duration-medium);
			transition-property: color;
		}
.m-case > div.-figure figure {
			padding-top: calc(70%);
		}
.m-case img {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		width: 100%;
		height: auto;
		transform: translateY(0);
		transition-duration: var(--duration-large);
		transition-property: transform;
	}
.m-case > div.-figure,
	.m-case > a {
		display: block;
		width: 100%;
	}
:is(.m-case > div.-figure:hover,.m-case > a:focus,.m-case > a:hover) img {
			transform: translateY(-33.333%);
			transition-timing-function: ease-in-out;
		}
:is(.m-case > div.-figure:hover,.m-case > a:focus,.m-case > a:hover) figure figcaption {
				color: var(--color-content-primary);
			}
.m-case__copy {
	-webkit-padding-before: var(--size-700);
	        padding-block-start: var(--size-700);
	padding-inline: var(--size-1000);
}
.m-case__copy header small {
			font: var(--font-label-medium);
		}
.m-case__copy h2 a {
			text-decoration: none;
		}
.m-case__copy h2 a:focus,
			body:not(.is-touch) :is(.m-case__copy h2 a):hover {
				text-decoration: underline;
			}
/* Website is no longer available online. */
.m-case__copy > div > em {
		display: block;
		-webkit-margin-before: var(--size-500);
		        margin-block-start: var(--size-500);
	}
.m-case__copy h3 {
		-webkit-margin-before: var(--size-500);
		        margin-block-start: var(--size-500);
		font-size: inherit;
		display: inline-block;
		padding-inline: var(--size-100);
		color: var(--color-white);
		background-color: var(--color-brand);
	}
.m-case__copy ul,
	.m-case__copy p {
		-webkit-margin-before: 0;
		        margin-block-start: 0;
		margin-bottom: 0;
	}
.m-case__copy ul {
		-webkit-margin-before: var(--size-300);
		        margin-block-start: var(--size-300);
		padding-left: 0;
	}
.m-case__copy ul li {
			position: relative;
			padding-left: calc(16rem / 16);
			list-style: none;
		}
.m-case__copy ul li::before {
				content: '';
				position: absolute;
				left: 0;
				top: calc(10.5rem / 16);
				height: calc(2rem / 16);
				width: calc(8rem / 16);
				background-color: var(--color-content-secondary);
			}
:is(.m-case__copy ul li) + li {
				-webkit-margin-before: var(--size-100);
				        margin-block-start: var(--size-100);
			}
.m-case:where(:nth-child(2n)) .m-case__copy {
		order: 2;
	}
/* PrismJS 1.30.0
https://prismjs.com/download#themes=prism-dark&languages=markup+css+clike+javascript */
/**
 * prism.js Dark theme for JavaScript, CSS and HTML
 * Based on the slides of the talk “/Reg(exp){2}lained/”
 * @author Lea Verou
 */
.m-code {
	max-inline-size: 100%;
	color: var(--color-white);
	font: var(--font-code-medium);
	overflow: auto;
	border-radius: var(--border-radius-small);
	background-color: var(--color-background-primary-inverse);
}
.m-code:where(figure) {
		border: var(--border-size-small) solid var(--color-black);
	}
.m-code > figcaption {
		padding-block: var(--size-200);
		padding-inline: var(--size-400);
		color: var(--color-content-secondary-inverse);
		-webkit-border-after: var(--border-small-tertiary-inverse);
		        border-block-end: var(--border-small-tertiary-inverse);
	}
.m-code pre {
		padding: var(--size-400);
		text-align: left;
		white-space: pre;
		word-spacing: normal;
		word-break: normal;
		word-wrap: normal;
		-moz-tab-size: 2;
		  -o-tab-size: 2;
		     tab-size: 2;
		-webkit-hyphens: none;
		        hyphens: none;
		font: inherit;
	}
.m-code code {
		font: inherit;
	}
/** @todo Improve colors similar to https://github.com/getkirby/getkirby.com/blob/e6352626f704531b9981f60ae69ea2a2c7b005e8/assets/css/site/code.css */
.m-code .token.class-name,
	.m-code .token.package,
	.m-code .token.scope {
		color: var(--color-green-400);
	}
.m-code .token.function {
		color: var(--color-blue-300);
	}
.m-code .token.comment,
	.m-code .token.prolog,
	.m-code .token.doctype,
	.m-code .token.cdata {
		color: var(--color-gray-300);
	}
.m-code .token.punctuation {
		color: var(--color-gray-150);
	}
.m-code .token.namespace {
		opacity: .7;
	}
.m-code .token.boolean,
	.m-code .token.atrule,
	.m-code .token.keyword {
		color: var(--color-purple-300);
	}
.m-code .token.attr-value {
		color: var(--color-green-400);
	}
.m-code .token.null {
		color: var(--color-purple-200);
	}
.m-code .token.property,
	.m-code .token.tag,
	.m-code .token.number,
	.m-code .token.constant,
	.m-code .token.symbol,
	.m-code .token.operator,
	.m-code .token.entity,
	.m-code .token.url,
	.m-code .language-css .token.string,
	.m-code .style .token.string,
	.m-code .token.variable,
	.m-code .token.key {
		color: var(--color-red-200);
	}
.m-code .token.deleted {
		color: var(--color-red-500);
	}
.m-code .token.selector,
	.m-code .token.attr-name,
	.m-code .token.string,
	.m-code .token.char,
	.m-code .token.builtin,
	.m-code .token.inserted {
		color: var(--color-yellow-400);
	}
.m-code .token.regex,
	.m-code .token.important {
		color: var(--color-orange-400);
	}
.m-code .token.bold {
		font-weight: bold;
	}
.m-code .token.italic {
		font-style: italic;
	}
.m-code .token.entity {
		cursor: help;
	}
.o-reference > .m-text > .m-code {
		--_margin-inline: calc(min(var(--size-300), calc(var(--gap-inline) + var(--border-size-xsmall))) * -1);
		margin-inline: var(--_margin-inline);
		max-inline-size: calc(100% + var(--_margin-inline) * -2);
	}
.m-field {
	display: flex;
	flex-direction: column;
	row-gap: var(--size-100);
}
.m-field > div {
		font: var(--font-label-medium);
	}
.m-field > input,
	.m-field > select {
		inline-size: 100%;
		font: var(--font-label-medium);
		padding-inline: var(--size-200);
		padding-block: calc(var(--size-200) - var(--border-size-small) * 0.5);
		background-color: var(--color-background-secondary);
		border-radius: var(--border-radius-small);
		border: var(--border-size-xsmall) solid var(--color-gray-400);
	}
.m-field > input::-moz-placeholder {
		color: var(--color-content-tertiary);
	}
.m-field > input::placeholder {
		color: var(--color-content-tertiary);
	}
.m-field > select {
		-webkit-appearance: none;
		   -moz-appearance: none;
		        appearance: none;
		background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23888"><path d="M12 15.0006L7.75732 10.758L9.17154 9.34375L12 12.1722L14.8284 9.34375L16.2426 10.758L12 15.0006Z"></path></svg>');
		background-size: calc(24rem / 16);
		background-repeat: no-repeat;
		background-position: right var(--size-200) top 50%;
	}
.m-field > small {
		font: var(--font-paragraph-small);
	}
.m-field[data-type="checkbox"] {
		flex-direction: row;
		align-items: baseline;
		-moz-column-gap: var(--size-300);
		     column-gap: var(--size-300);
	}
.m-field[data-type="checkbox"] > input {
			flex-shrink: 0;
			inline-size: 1em;
			block-size: 1em;
			padding: 0;
			border: none;
			background: none;
			-webkit-appearance: auto;
			   -moz-appearance: auto;
			        appearance: auto;
			accent-color: var(--color-brand);
		}
.m-field[data-type="checkbox"] > div {
			font: var(--font-paragraph-medium);
		}
.m-form-checkout {
	display: grid;
	row-gap: var(--size-700);
	font: var(--font-paragraph-large);
}
.m-form-checkout > fieldset {
		display: grid;
		grid-template-columns: repeat(6, minmax(0, 1fr));
		row-gap: var(--size-400);
		-moz-column-gap: var(--gap-inline);
		     column-gap: var(--gap-inline);
		min-inline-size: 0;
		margin: 0;
		padding: 0;
		border: none;
	}
.m-form-checkout > fieldset > * {
			grid-column-end: span 6;
		}
.m-form-checkout > fieldset > legend {
			-webkit-margin-after: var(--size-400);
			        margin-block-end: var(--size-400);
			padding: 0;
		}
.m-form-checkout > fieldset > *[data-span="2"] {
			grid-column-end: span 2;
		}
.m-form-checkout > fieldset > *[data-span="4"] {
			grid-column-end: span 4;
		}
.m-form-checkout__payment-fields {
	min-block-size: calc(120rem / 16);
}
.m-form-checkout__submit {
	display: flex;
	justify-content: end;
}
.m-form-checkout__error {
	font: var(--font-paragraph-small);
	color: var(--color-red-600);
}
@media not (min-width: 22em) {
.m-nav-main {
		inset-inline-start: var(--gap-inline);
		inline-size: calc(100% - var(--gap-inline) * 2);
}
	}
@media not (min-width: 64em) {
.m-nav-main {
		position: fixed;
		inset-block-start: var(--height-header);
		inset-inline-start: auto;
		inset-inline-end: var(--gap-inline);
		-webkit-padding-before: var(--size-500);
		        padding-block-start: var(--size-500);
		-webkit-padding-after: var(--size-500);
		        padding-block-end: var(--size-500);
		flex-direction: column;
		border: var(--border-size-small) solid var(--color-border-tertiary);
		-webkit-border-before: 0;
		        border-block-start: 0;
		background: var(--background-root);
}

		.m-nav-main:popover-open {
			display: flex;
		}

		.m-nav-main::backdrop {
			inset-block-start: var(--height-header);
			background-color: var(--background-color-backdrop);
			-webkit-backdrop-filter: var(--backdrop-filter);
			        backdrop-filter: var(--backdrop-filter);
		}
	}
@media (min-width: 64em) {
.m-nav-main {
		display: flex;
}
	}
.m-nav-main__list {
	display: flex;
}
@media not (min-width: 64em) {
.m-nav-main__list {
		flex-direction: column;
}
	}
.m-nav-main__steps {
	display: flex;
}
.m-nav-main__steps li + li {
		display: flex;
		align-items: center;
	}
.m-nav-main__steps li + li:before {
			content: '›';
			color: var(--color-content-secondary);
		}
@media not (min-width: 64em) {
.m-nav-main__steps {
		-webkit-margin-before: var(--size-300);
		        margin-block-start: var(--size-300);
		justify-content: end;
		padding-inline: calc(52rem / 16);
}
	}
.m-nav-overview > ul {
		display: grid;
		gap: var(--gap-inline);
		grid-template-columns: repeat(auto-fill, minmax(calc(200rem / 16), 1fr));
	}
.m-nav-overview > ul > li > a {
		text-decoration: none;
		display: grid;
	}
.m-nav-overview > ul > li > a > strong {
			font: var(--font-label-large);
			text-decoration: underline;
			-webkit-text-decoration-color: inherit;
			        text-decoration-color: inherit;
		}
.m-nav-overview > ul > li > a > small {
			font: var(--font-paragraph-small);
			text-wrap-style: balance;
		}
nav.m-nav-sidebar {
	position: -webkit-sticky;
	position: sticky;
	-webkit-padding-before: calc(var(--size-700) - var(--size-250));
	        padding-block-start: calc(var(--size-700) - var(--size-250));
	-webkit-padding-after: var(--size-700);
	        padding-block-end: var(--size-700);
	-webkit-padding-start: calc(3rem / 16);
	        padding-inline-start: calc(3rem / 16);
	max-block-size: calc(100vh - var(--height-header));
	-webkit-border-end: var(--border-size-small) solid var(--color-border-tertiary);
	        border-inline-end: var(--border-size-small) solid var(--color-border-tertiary);
	overflow: auto;
}
:is(nav.m-nav-sidebar > ul) > li + li {
      -webkit-margin-before: var(--size-400);
              margin-block-start: var(--size-400);
    }
:is(nav.m-nav-sidebar[data-variant="tertiary"] > ul) > li + li {
				-webkit-margin-before: 0;
				        margin-block-start: 0;
				-webkit-border-before: var(--border-small-tertiary);
				        border-block-start: var(--border-small-tertiary);
			}
@media not (min-width: 64em) {
nav.m-nav-sidebar {
		-webkit-margin-start: calc(3rem / -16);
		        margin-inline-start: calc(3rem / -16);
		max-block-size: 100%;
}

		nav.m-nav-sidebar:last-of-type {
			-webkit-border-end: 0;
			        border-inline-end: 0;
		}
	}
@media (min-width: 64em) {
nav.m-nav-sidebar {
		inset-block-start: var(--height-header);
		-webkit-margin-start: calc(3rem / -16);
		        margin-inline-start: calc(3rem / -16);
}
	}
@media not (min-width: 64em) {
.m-nav-sidebars {
		--_inset-block-start: calc(var(--height-header) + calc(44rem / 16));

		overflow: auto;
		inset-block-start: calc(var(--_inset-block-start) + var(--border-size-small));
		inset-inline-start: auto;
		inset-inline-end: calc(var(--gap-inline));
		max-inline-size: calc(100% - (var(--gap-inline) * 2));
		min-inline-size: 50%;
		-webkit-border-end: var(--border-size-small) solid var(--color-border-tertiary);
		        border-inline-end: var(--border-size-small) solid var(--color-border-tertiary);
		block-size: calc(100% - var(--_inset-block-start));
		background: var(--background-root);
}

		.m-nav-sidebars::before {
			content: '';
			position: fixed;
			z-index: -1;
			inset-block: 0;
			inline-size: var(--border-size-small);
			background-color: var(--color-border-tertiary);
		}

		.m-nav-sidebars::before {
			inset-inline-start: var(--gap-inline);
		}

		.m-nav-sidebars > div {
			block-size: 100%;
			-webkit-padding-start: var(--border-size-small);
			        padding-inline-start: var(--border-size-small);
			display: grid;
			grid-auto-flow: column;
			grid-auto-columns: 1fr;
		}

		.m-nav-sidebars::backdrop {
			-webkit-border-before: var(--border-size-small) solid var(--color-border-tertiary);
			        border-block-start: var(--border-size-small) solid var(--color-border-tertiary);
			inset-block-start: var(--_inset-block-start);
			background-color: var(--background-color-backdrop);
			-webkit-backdrop-filter: var(--backdrop-filter);
			        backdrop-filter: var(--backdrop-filter);
		}
	}
@media (min-width: 64em) {
		.m-nav-sidebars > div {
			block-size: 100%;
			-webkit-padding-start: var(--border-size-small);
			        padding-inline-start: var(--border-size-small);
			display: grid;
			grid-auto-flow: column;
			grid-auto-columns: 1fr;
		}
	}
.m-reference-children {
	margin-inline: calc(var(--gap-inline) * -1);
	overflow: hidden;
}
.m-reference-children > ul {
		margin: calc(var(--border-size-small) * -0.5);
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(calc(240rem / 16), 1fr));
		list-style: none;
	}
.m-reference-children > ul > li {
		margin: calc(var(--border-size-small) * -0.5);
		border: var(--border-small-tertiary);
	}
.m-reference-children > ul > li > a {
		text-decoration: none;
		display: grid;
		-moz-column-gap: var(--size-400);
		     column-gap: var(--size-400);
		font: var(--font-label-medium);
		text-wrap-style: pretty;
		padding-block: var(--size-150);
		padding-inline: var(--gap-inline);
	}
.m-reference-children > ul > li > a > small {
			-webkit-margin-before: var(--size-100);
			        margin-block-start: var(--size-100);
			font: var(--font-label-small);
			color: var(--color-content-secondary);
		}
@media (min-width: 64em) {
.m-reference-children {
		display: none;
}
	}
.m-release-feature {
	display: grid;
	row-gap: var(--size-600);
	align-items: start;
	scroll-margin-block-start: var(--size-900);

	/* A feature with a visual next to it */
}
@media (min-width: 64em) {
.m-release-feature:has(> .m-release-feature__visual) {
			grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
			-moz-column-gap: var(--size-800);
			     column-gap: var(--size-800);
	}
		}
.m-release-feature__copy {
	display: grid;
	justify-items: start;
	row-gap: var(--size-300);
}
.m-release-feature__copy > .m-text {
		max-inline-size: var(--max-width-text);
	}
.m-release-feature__label {
	font: var(--font-label-medium);
	color: var(--color-brand);
}
.m-release-feature__visual {
	display: grid;
	row-gap: var(--size-400);
}
.m-release-feature__visual img {
		display: block;
		inline-size: 100%;
		border: var(--border-small-tertiary);
		border-radius: var(--border-radius-small);
	}
.m-release-feature__visual figure:has(> img) {
		margin: 0;
	}
.m-search-dialog {
	position: fixed;
	inset-block-start: var(--height-header);
	width: auto;
	height: auto;
	-webkit-padding-before: calc(var(--gap-block) - var(--border-size-small) * 0.5);
	        padding-block-start: calc(var(--gap-block) - var(--border-size-small) * 0.5);
	display: none;
	background-color: transparent;
}
.m-search-dialog > div {
		overflow: auto;
		max-block-size: 100%;
		-webkit-padding-after: var(--size-1000);
		        padding-block-end: var(--size-1000);
		padding-inline: calc(var(--gap-inline) + var(--size-400));
		pointer-events: none;
	}
.m-search-dialog > div > * {
			pointer-events: auto;
		}
.m-search-dialog:popover-open {
		display: block;
	}
.m-search-dialog::backdrop {
		inset-block-start: var(--height-header);
		background-color: var(--background-color-backdrop);
		-webkit-backdrop-filter: var(--backdrop-filter);
		        backdrop-filter: var(--backdrop-filter);
	}
.m-search {
	margin-inline: auto;
	max-inline-size: calc(502rem / 16);
}
.m-search[data-variant="combobox"]{
		background-color: var(--color-background-primary);
	}
.m-search__field {
	position: -webkit-sticky;
	position: sticky;
	inset-block-start: 0;
	z-index: 2;
	display: grid;
	align-items: center;
	justify-items: start;
}
.m-search__field > * {
		grid-area: 1 / 1;
	}
.m-search__field > input {
		inline-size: 100%;
		-webkit-padding-start: var(--size-700);
		        padding-inline-start: var(--size-700);
		-webkit-padding-end: var(--size-200);
		        padding-inline-end: var(--size-200);
		padding-block: calc(var(--size-200) - var(--border-size-small) * 0.5);
		background-color: var(--color-background-secondary);
		border: var(--border-size-small) solid var(--color-border-primary);
	}
.m-search__field > input:focus-visible {
			outline: none;
		}
.m-search__submit {
	-webkit-padding-start: var(--size-100);
	        padding-inline-start: var(--size-100);
}
.m-search__info {
	padding-block: calc(var(--size-300) - var(--border-size-small));
	font: var(--font-label-medium);
	color: var(--color-content-secondary);
}
.m-search__info:empty {
		padding-block: 0;
	}
.m-search[data-variant="combobox"] .m-search__info {
		padding-inline: var(--gap-inline);
	}
.m-search__results {
	list-style: none;
}
.m-search__results > li {
		-webkit-margin-before: calc(var(--border-size-small) * -1);
		        margin-block-start: calc(var(--border-size-small) * -1);
	}
.m-search__results > li > a {
		display: grid;
		padding-block: var(--size-300);
		text-decoration: none;
		border-block: var(--border-size-small) solid var(--color-border-secondary);
	}
.m-search__results > li > a > small {
			block-size: 1lh;
			overflow: hidden;
			text-overflow: ellipsis;
			font: var(--font-label-small);
			color: var(--color-content-secondary);
		}
.m-search:not([data-variant="combobox"]) .m-search__results > li > a:where(:hover, :focus-visible) > strong {
				text-decoration: underline;
			}
.m-search[data-variant="combobox"] .m-search__results > li > a {
			padding-inline: var(--gap-inline);
			border-inline: var(--border-size-small) solid var(--color-border-secondary);
		}
.m-search[data-variant="combobox"] .m-search__results > li[aria-selected="true"] > a {
			position: relative;
			z-index: 1;
			border-color: var(--color-background-brand-inverse);
			color: var(--color-content-primary-inverse);
			background-color: var(--color-background-brand-inverse);
		}
.m-search[data-variant="combobox"] .m-search__results > li[aria-selected="true"] > a > small {
				color: var(--color-content-secondary-inverse);
			}
.m-search:not([data-variant="combobox"]) .m-search__info + .m-search__results {
		-webkit-margin-before: var(--size-500);
		        margin-block-start: var(--size-500);
	}
.m-showcase-item > a {
	display: grid;
	row-gap: var(--size-150);
	text-decoration: none;
}
.m-showcase-item > a > strong {
		font: var(--font-label-large);
	}
.m-showcase-item > a > small {
		font: var(--font-label-small);
	}
.m-stack {
	--_space: var(--gap-block);

	display: flex;
	flex-direction: column;
	align-items: start;
	gap: var(--_space);
}
.m-stack[data-direction="inline"] {
		--_space: var(--gap-inline);
		flex-direction: row;
	}
.m-stack[data-space="small"] {
		--_space: var(--size-400);
	}
.m-stack[data-space="xsmall"] {
		--_space: var(--size-300);
	}
.m-stack[data-space="xxsmall"] {
		--_space: var(--size-200);
	}
.m-table {
	max-inline-size: 100%;
	overflow: auto;
	background-color: var(--color-background-secondary);
	border: var(--border-xsmall-secondary);
	border-radius: var(--border-radius-small);
	font: var(--font-paragraph-medium);
	font-variant-numeric: tabular-nums;
}
.m-table > table {
		inline-size: 100%;
	}
.m-table > table td, .m-table > table th {
			padding-block: var(--size-200);
			padding-inline: var(--size-300);
			text-align: start;
		}
.m-table > table th {
			-webkit-border-after: var(--border-xsmall-secondary);
			        border-block-end: var(--border-xsmall-secondary);
		}
.m-table > table tr:not(:last-child) td {
			-webkit-border-after: var(--border-xsmall-secondary);
			        border-block-end: var(--border-xsmall-secondary);
		}
.o-reference > .m-text > .m-table {
	--_margin-inline: calc(min(var(--size-300), calc(var(--gap-inline) + var(--border-size-xsmall))) * -1);
	margin-inline: var(--_margin-inline);
	max-inline-size: calc(100% + var(--_margin-inline) * -2);
}
.m-text {
	/* Caution: default size is large (not medium) */
	font: var(--font-paragraph-large);

	/* Child elements */
}
.m-text > h1 {
		font: var(--font-heading-large);
	}
.m-text > h2 {
		font: var(--font-heading-medium);
	}
.m-text > h3 {
		font: var(--font-heading-small);
	}
.m-text > h4 {
		font: var(--font-heading-xsmall);
	}
.m-text > :is(h2, h3, h4) {
		text-wrap-style: pretty;

		/* Anchor links */
	}
.m-text > :is(h2, h3, h4) > a[href^="#"] {
			position: relative;
			display: inline-flex;
			align-items: baseline;
			text-decoration: none;
		}
.m-text > :is(h2, h3, h4) > a[href^="#"]::before {
				content: '#';
				position: absolute;
				inset-inline-start: -1.5ch;
				display: block;
				inline-size: 1.5ch;
				font-feature-settings: "c2sc";
				color: var(--color-content-tertiary);
				pointer-events: none;
				opacity: 0;
				transition-property: opacity;
				transition-duration: var(--duration-medium);
			}
.m-text > :is(h2, h3, h4) > a[href^="#"]:where(:focus-visible, :hover)::before {
					pointer-events: auto;
					opacity: 1;
					transition-delay: var(--duration-xsmall);
				}
.m-text > :where(ul, ol) {
		-webkit-padding-start: 2ch;
		        padding-inline-start: 2ch;
		text-wrap-style: pretty;
	}
.m-text > :where(ul, ol) ul {
			list-style-type: disc;
		}
.m-text > :where(ul, ol) > li :where(ul, ol) {
			-webkit-margin-before: calc(var(--gap-text-paragraph) * 0.5);
			        margin-block-start: calc(var(--gap-text-paragraph) * 0.5);
			-webkit-padding-start: 2ch;
			        padding-inline-start: 2ch;
		}
:is(.m-text > :where(ul, ol)) * + :where(ul, ol, li) {
			-webkit-margin-before: calc(var(--gap-text-paragraph) * 0.5);
			        margin-block-start: calc(var(--gap-text-paragraph) * 0.5);
		}
/* elements, that are not child of another molecule or atom */
:is(.m-text,.m-text *:not([class^="m-"], [class^="a-"])) a {
			-webkit-text-decoration-color: hsl(from var(--color-border-brand) h s l / 0.7);
			        text-decoration-color: hsl(from var(--color-border-brand) h s l / 0.7);
		}
/* Modifications */
.m-text[data-size="xlarge"] {
		font: var(--font-paragraph-xlarge);
		text-wrap-style: pretty;
	}
.m-text[data-size="large"] {
		font: var(--font-paragraph-large);
		text-wrap-style: pretty;
	}
.m-text[data-size="medium"] {
		font: var(--font-paragraph-medium);
	}
.m-text[data-size="small"] {
		font: var(--font-paragraph-small);
	}
.m-text[data-size="xsmall"] {
		font: var(--font-paragraph-xsmall);
	}
/* Stack */
.m-text > * + * {
		-webkit-margin-before: var(--gap-text-paragraph);
		        margin-block-start: var(--gap-text-paragraph);
	}
.m-text > :where([class^="m-"]) + *,
	.m-text > * + :where([class^="m-"]) {
		-webkit-margin-before: var(--size-600);
		        margin-block-start: var(--size-600);
	}
.m-text > * + :where(h2) {
		-webkit-margin-before: var(--size-800);
		        margin-block-start: var(--size-800);
	}
.m-text > * + :where(h3) {
		-webkit-margin-before: var(--size-700);
		        margin-block-start: var(--size-700);
	}
.m-text > * + :where(h4) {
		-webkit-margin-before: var(--size-600);
		        margin-block-start: var(--size-600);
	}
.m-text[data-variant="callout"] {
		font-weight: 500;
	}
.a-display + .m-text {
	-webkit-margin-before: var(--gap-text-paragraph);
	        margin-block-start: var(--gap-text-paragraph);
}
.m-toc {
	--_padding-block: var(--size-100);
	--_padding-inline: var(--gap-inline);

	-webkit-margin-start: calc(var(--border-size-small) * -1);

	        margin-inline-start: calc(var(--border-size-small) * -1);
	padding-block: var(--gap-block-header);
	font: var(--font-label-medium);
}
.m-toc > h2 {
		padding-inline: var(--_padding-inline);
		-webkit-padding-after: var(--_padding-block);
		        padding-block-end: var(--_padding-block);
		font-size: inherit;
		font-weight: 700;
	}
.m-toc > ol {
		list-style: none;
	}
.m-toc__link {
	display: block;
	padding-block: var(--_padding-block);
	padding-inline: var(--_padding-inline);
	color: var(--color-content-secondary);
	text-decoration: none;
	text-wrap-style: pretty;
}
.m-toc__link[aria-current="true"] {
		color: var(--color-content-primary);
	}
/* Organisms */
.o-article {
	align-self: center;
	/* margin-block-start: 20px; */
	max-width: var(--max-width-content);
	padding-inline: var(--gap-inline);
}
.o-cases {
	z-index: var(--z-index-main-wrapper);
	inline-size: 100%;
	padding-inline: var(--gap-inline);
	-webkit-border-after: var(--border-small-tertiary);
	        border-block-end: var(--border-small-tertiary);
	background: inherit;
}
.o-cases__box {
	max-inline-size: calc(var(--max-width-content) + var(--border-size-small));
	margin-inline: auto;
	border-inline: var(--border-size-small) solid var(--color-border-tertiary);
	-webkit-border-after: var(--border-size-small) solid var(--color-border-tertiary);
	        border-block-end: var(--border-size-small) solid var(--color-border-tertiary);
}
.o-cases__title {
	padding-block: calc(var(--gap-inline) * 3);
	padding-inline: var(--size-1000);
}
.o-cases__grid {
	display: grid;
	row-gap: var(--size-800);
}
.o-checkout {
	z-index: var(--z-index-main-wrapper);
	inline-size: 100%;
	padding-inline: var(--gap-inline);
	-webkit-border-after: var(--border-small-tertiary);
	        border-block-end: var(--border-small-tertiary);
	background: inherit;

	/* Every section shares the bordered column of the home page */
}
.o-checkout > * {
		max-inline-size: calc(var(--max-width-content) + var(--border-size-small));
		margin-inline: auto;
		padding-block: var(--size-800);
		padding-inline: var(--size-400);
		border-inline: var(--border-small-tertiary);
		-webkit-border-after: var(--border-small-tertiary);
		        border-block-end: var(--border-small-tertiary);
	}
@media (min-width: 64em) {
.o-checkout > * {
			padding-inline: calc(var(--size-500) * 3 - var(--border-size-small));
	}
		}
@media (min-width: 80em) {
.o-checkout > * {
			padding-inline: calc(var(--size-1000) - var(--border-size-small));
	}
		}
.o-checkout > :last-child {
		-webkit-border-after: none;
		        border-block-end: none;
	}
.o-checkout__header {
	padding-block: var(--size-900) var(--size-800);
	display: grid;
	row-gap: var(--size-500);
}
.o-checkout__header > .m-text {
		max-inline-size: var(--max-width-text);
	}
.o-checkout__form {
	display: grid;
	align-items: start;
	-moz-column-gap: var(--size-800);
	     column-gap: var(--size-800);
	row-gap: var(--size-700);
}
@media (min-width: 64em) {
.o-checkout__form {
		grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
}

		.o-checkout__form > .m-form-checkout {
			grid-column: 1;
			grid-row: 1;
		}
	}
@media (min-width: 64em) {
.o-checkout__cart {
		grid-column: 2;
		grid-row: 1;
		position: -webkit-sticky;
		position: sticky;
		inset-block-start: calc(var(--height-header) + var(--size-500));
}
	}
.o-features {
	max-inline-size: calc(var(--max-width-content) + var(--border-size-small));
	margin-inline: auto;
	border-inline: var(--border-size-small) solid var(--color-border-tertiary);
	padding-block: var(--size-800);
	padding-inline: var(--size-400);
	display: grid;
	-moz-column-gap: calc(var(--gap-inline) * 3 - var(--border-size-small));
	     column-gap: calc(var(--gap-inline) * 3 - var(--border-size-small));
	row-gap: calc(var(--gap-inline) * 2);
	-webkit-border-after: var(--border-size-small) solid var(--color-border-tertiary);
	        border-block-end: var(--border-size-small) solid var(--color-border-tertiary);
}
@media (min-width: 38em) {
.o-features {
		grid-template-columns: repeat(2, 1fr);
}
	}
@media (min-width: 64em) {
.o-features {
		grid-template-columns: repeat(3, 1fr);
		padding-inline: calc(var(--size-500) * 3 - var(--border-size-small));
}
	}
@media (min-width: 80em) {
.o-features {
		padding-inline: calc(var(--size-1000) - var(--border-size-small));
}
	}
.o-features__item {
	display: grid;
	row-gap: var(--size-200);
}
.o-footer {
	position: -webkit-sticky;
	position: sticky;
	bottom: 0;
	-webkit-margin-before: auto;
	        margin-block-start: auto;
	-webkit-padding-before: var(--size-800);
	        padding-block-start: var(--size-800);
	-webkit-padding-after: var(--size-700);
	        padding-block-end: var(--size-700);
	background: inherit;
	background-color: var(--color-gray-100);
}
.o-footer > div {
		display: grid;
		max-inline-size: var(--max-width-content);
		margin-inline: auto;
		padding-inline: var(--gap-inline);
		row-gap: var(--size-600);
	}
@media (min-width: 64em) {
		.o-footer > div {
			grid-template-columns: 1fr auto;
			-moz-column-gap: var(--gap-inline);
			     column-gap: var(--gap-inline);
		}
	}
.o-footer__info {
	align-self: end;
	text-wrap-style: balance;
	font: var(--font-paragraph-medium);
	max-inline-size: 40ch;
	-webkit-padding-after: calc(4rem / 16);
	        padding-block-end: calc(4rem / 16);
}
@media not (min-width: 64em) {
.o-footer__info {
		order: 1;
}
	}
.o-footer__logo-link {
	-webkit-margin-before: -0.1em;
	        margin-block-start: -0.1em;
	display: inline-block;
	vertical-align: middle;
}
.o-footer__logo-link > img {
		inline-size: auto;
		block-size: calc(18rem / 16);
	}
.o-footer__nav {
	font: var(--font-label-medium);
}
.o-footer__nav > ul {
		display: grid;
		grid-template-columns: 1fr 1fr;
		-moz-column-gap: var(--gap-inline);
		     column-gap: var(--gap-inline);
	}
.o-footer__nav strong, .o-footer__nav a {
		display: block;
		padding-block: calc(2rem / 16);
	}
.o-footer__nav a {
		text-decoration: none;
	}
.o-footer__nav a > small {
			-webkit-margin-start: -0.1em;
			        margin-inline-start: -0.1em;
			font-size: inherit;
			color: var(--color-content-secondary);
		}
@media (min-width: 64em) {
		.o-footer__nav > ul {
			grid-template-columns: 220px 220px;
		}
	}
.o-header {
	z-index: var(--z-index-header);
	position: -webkit-sticky;
	position: sticky;
	inset-block-start: 0;
	block-size: var(--height-header);
	-webkit-border-after: var(--border-size-small) solid var(--color-border-tertiary);
	        border-block-end: var(--border-size-small) solid var(--color-border-tertiary);
	padding-inline: var(--gap-inline);
	background: inherit;
}
.o-header__center {
	block-size: 100%;
	max-inline-size: calc(var(--max-width-content) + var(--border-size-small));
	margin-inline: auto;
	border-inline: var(--border-size-small) solid var(--color-border-tertiary);
	display: grid;
	grid-template-columns: 1fr auto auto;
	justify-items: start;
	align-items: end;
}
@media (min-width: 64em) {
.o-header__center {
		align-items: stretch;
}
	}
.o-hero {
	max-inline-size: calc(var(--max-width-content) + var(--border-size-small));
	margin-inline: auto;
	display: grid;
	border-inline: var(--border-size-small) solid var(--color-border-tertiary);
	-webkit-border-after: var(--border-size-small) solid var(--color-border-tertiary);
	        border-block-end: var(--border-size-small) solid var(--color-border-tertiary);
}
@media (min-width: 64em) {
.o-hero {
		grid-template-columns: 1fr 1fr;
		-moz-column-gap: calc(var(--size-500) - var(--border-size-small));
		     column-gap: calc(var(--size-500) - var(--border-size-small));
}
	}
.o-hero__copy {
	padding-inline: var(--size-400);
	padding-block: var(--size-900);
	display: grid;
	row-gap: var(--size-600);
	align-items: start;
	align-content: start;
}
@media (min-width: 64em) {
.o-hero__copy {
		-webkit-padding-start: calc(var(--size-500) * 3 - var(--border-size-small));
		        padding-inline-start: calc(var(--size-500) * 3 - var(--border-size-small));
		-webkit-padding-end: calc(var(--size-400) - var(--border-size-small));
		        padding-inline-end: calc(var(--size-400) - var(--border-size-small));
}
	}
@media (min-width: 80em) {
.o-hero__copy {
		-webkit-padding-start: calc(var(--size-1000) - var(--border-size-small));
		        padding-inline-start: calc(var(--size-1000) - var(--border-size-small));
}
	}
.o-hero__buttons {
	display: flex;
	-moz-column-gap: var(--size-500);
	     column-gap: var(--size-500);
}
.o-hero__buttons > div {
		display: grid;
		justify-items: start;
		row-gap: var(--size-100);
	}
.o-hero__image > a {
		display: block;
	}
.o-hero__image > a > img {
		inline-size: 100%;
	}
.o-home {
	z-index: var(--z-index-main-wrapper);
	inline-size: 100%;
	padding-inline: var(--gap-inline);
	-webkit-border-after: var(--border-small-tertiary);
	        border-block-end: var(--border-small-tertiary);
	background: inherit;
}
.o-main-wrapper {
	--_width-nav: calc(260rem / 16);

	z-index: var(--z-index-main-wrapper);
	inline-size: 100%;
	padding-inline: var(--gap-inline);
	-webkit-border-after: var(--border-small-tertiary);
	        border-block-end: var(--border-small-tertiary);
	background: inherit;
}
.o-main-wrapper > div {
		max-inline-size: calc(var(--max-width-content) + var(--border-size-small));
		min-block-size: calc(100vh - var(--height-header));
		margin-inline: auto;
		border-inline: var(--border-size-small) solid var(--color-border-tertiary);
	}
@media (min-width: 64em) {
		.o-main-wrapper > div {
			display: grid;
			grid-template-columns:
				var(--_width-nav)
				1fr;
		}
			.o-main-wrapper[data-layout="ref"] > div {
				grid-template-columns:
					calc(var(--_width-nav) * 2)
					1fr;
			}
	}
.o-main {
	--_gap-inline-text: calc(var(--gap-inline) * 2);

	display: grid;
	grid-template-columns:
		var(--_gap-inline-text)
		minmax(0, 1fr)
		var(--_gap-inline-text)
	;
	min-block-size: 100%;
}
.o-main > * {
		margin-inline: auto;
		max-inline-size: var(--max-width-text);
		inline-size: 100%;
		grid-column: 2 / 3;
	}
@media (min-width: 64em) {
.o-main {
		grid-template-rows:
			auto
			1fr
		;
		grid-template-columns:
			var(--_gap-inline-text)
			minmax(0, 1fr)
			var(--_gap-inline-text)
			var(--border-size-small)
			calc(260rem / 16 - var(--border-size-small))
		;
		align-items: start;
		align-content: start;
}
	}
.o-main__header {
	-webkit-padding-before: var(--gap-block-header);
	        padding-block-start: var(--gap-block-header);
}
@media (min-width: 64em) {
.o-main__dashed-line {
		--_dash: calc(8rem / 16);
		--_gap: calc(12rem / 16);

		grid-column: 4 / 5;
		grid-row: 1 / -1;
		position: -webkit-sticky;
		position: sticky;
		inset-block-start: var(--height-header);
		max-block-size: calc(100vh - var(--height-header));
		inline-size: var(--border-size-small);
		background-image: linear-gradient(to bottom, var(--color-border-tertiary), var(--color-border-tertiary) var(--_dash), transparent var(--_dash), transparent);
		background-size: 100% calc(var(--_dash) + var(--_gap));
		background-repeat: repeat-y;
		background-position: center calc(var(--_dash) * -0.5 - var(--border-size-small) * 0.5);
		align-self: stretch;
}
	}
@media (min-width: 64em) {
.o-main__toc {
		grid-column: -2 / -1;
		grid-row: 1 / 4;
		position: -webkit-sticky;
		position: sticky;
		inset-block-start: var(--height-header);
		align-self: start;
		margin-inline: 0;
}
	}
.o-main__text {
	-webkit-margin-before: var(--size-700);
	        margin-block-start: var(--size-700);
	-webkit-padding-after: max(var(--gap-block-header), 50vh);
	        padding-block-end: max(var(--gap-block-header), 50vh); /* @todo remove 50vh */
}
.o-order {
	z-index: var(--z-index-main-wrapper);
	inline-size: 100%;
	padding-inline: var(--gap-inline);
	-webkit-border-after: var(--border-small-tertiary);
	        border-block-end: var(--border-small-tertiary);
	background: inherit;
}
.o-order__box {
	max-inline-size: calc(var(--max-width-content) + var(--border-size-small));
	margin-inline: auto;
	padding-block: var(--size-900);
	padding-inline: var(--size-400);
	border-inline: var(--border-small-tertiary);
	display: grid;
	row-gap: var(--size-700);

	/* Every child shares the width of the invoice */
}
.o-order__box > * {
		inline-size: 100%;
		max-inline-size: calc(900rem / 16);
		margin-inline: auto;
	}
.o-order__header {
	display: grid;
	row-gap: var(--size-400);
}
.o-order__meta {
	color: var(--color-content-secondary);
	font-variant-numeric: tabular-nums;
}
.o-order__licenses {
	display: grid;
	row-gap: var(--size-300);
}
.o-order__licenses > ul {
		display: grid;
		row-gap: var(--size-200);
		list-style: none;
	}
.o-order__licenses code {
		display: inline-block;
		padding-block: var(--size-200);
		padding-inline: var(--size-400);
		font: var(--font-code-large);
		border-radius: var(--border-radius-small);
		background-color: var(--color-background-secondary);
		border: var(--border-xsmall-secondary);
		-webkit-user-select: all;
		   -moz-user-select: all;
		        user-select: all;
	}
.o-order__invoice {
	display: grid;
	row-gap: var(--size-700);
	padding: var(--size-500);
	font: var(--font-paragraph-medium);
	background-color: var(--color-background-secondary);
	border: var(--border-xsmall-secondary);
	border-radius: var(--border-radius-small);
}
@media (min-width: 38em) {
.o-order__invoice {
		padding: var(--size-700);
}
	}
.o-order__invoice-header {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: baseline;
	gap: var(--size-400);
}
.o-order__details {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--size-500);
}
@media (min-width: 38em) {
.o-order__details {
		grid-template-columns: repeat(4, auto);
		justify-content: start;
		-moz-column-gap: var(--size-800);
		     column-gap: var(--size-800);
}
	}
.o-order__details dt {
		font: var(--font-label-small);
		color: var(--color-content-secondary);
	}
.o-order__details dd {
		font-variant-numeric: tabular-nums;
	}
.o-order__addresses {
	display: grid;
	gap: var(--size-500);
}
@media (min-width: 38em) {
.o-order__addresses {
		grid-template-columns: repeat(2, 1fr);
}
	}
.o-order__addresses > div {
		display: grid;
		align-content: start;
		row-gap: var(--size-200);
	}
.o-order__addresses h3 {
		font: var(--font-label-small);
		color: var(--color-content-secondary);
	}
.o-order__items {
	inline-size: 100%;
	border-collapse: collapse;
	font-variant-numeric: tabular-nums;
}
.o-order__items th,
	.o-order__items td {
		padding-block: var(--size-200);
		text-align: end;
		vertical-align: baseline;
	}
.o-order__items :is(th, td):first-child {
		text-align: start;
	}
.o-order__items :is(th, td):not(:first-child) {
		-webkit-padding-start: var(--size-400);
		        padding-inline-start: var(--size-400);
		white-space: nowrap;
	}
.o-order__items thead th {
		font: var(--font-label-small);
		color: var(--color-content-secondary);
		-webkit-border-after: var(--border-xsmall-primary);
		        border-block-end: var(--border-xsmall-primary);
	}
.o-order__items tbody td {
		-webkit-border-after: var(--border-xsmall-secondary);
		        border-block-end: var(--border-xsmall-secondary);
	}
.o-order__items tfoot th {
		font-weight: inherit;
	}
.o-order__items tfoot tr:first-child :is(th, td) {
		-webkit-padding-before: var(--size-400);
		        padding-block-start: var(--size-400);
	}
.o-order__items tfoot .o-order__total :is(th, td) {
		font: var(--font-heading-xsmall);
	}
.o-order__notice {
	font: var(--font-paragraph-small);
	color: var(--color-content-secondary);
}
.o-order__seller {
	-webkit-padding-before: var(--size-400);
	        padding-block-start: var(--size-400);
	font: var(--font-paragraph-small);
	color: var(--color-content-secondary);
	-webkit-border-before: var(--border-xsmall-secondary);
	        border-block-start: var(--border-xsmall-secondary);
}
.o-order__actions {
	display: flex;
	justify-content: end;
}
@media print {
	.o-header,
	.o-footer,
	.o-order__header,
	.o-order__status,
	.o-order__licenses,
	.o-order__actions {
		display: none;
	}

	.o-order,
	.o-order__box,
	.o-order__invoice {
		padding: 0;
		border: none;
		background: none;
	}
}
.o-reference {
	max-inline-size: calc(var(--max-width-text) + var(--gap-inline) * 2);
	inline-size: 100%;
	margin-inline: auto;
	padding-block: var(--gap-block-header);
	padding-inline: var(--gap-inline);
}
.o-reference > * + * {
		-webkit-margin-before: var(--size-700);
		        margin-block-start: var(--size-700);
	}
.o-release {
	z-index: var(--z-index-main-wrapper);
	inline-size: 100%;
	padding-inline: var(--gap-inline);
	-webkit-border-after: var(--border-small-tertiary);
	        border-block-end: var(--border-small-tertiary);
	background: inherit;

	/* Every section shares the bordered column of the home page */
}
.o-release > * {
		max-inline-size: calc(var(--max-width-content) + var(--border-size-small));
		margin-inline: auto;
		padding-block: var(--size-800);
		padding-inline: var(--size-400);
		border-inline: var(--border-small-tertiary);
		-webkit-border-after: var(--border-small-tertiary);
		        border-block-end: var(--border-small-tertiary);
	}
@media (min-width: 64em) {
.o-release > * {
			padding-inline: calc(var(--size-500) * 3 - var(--border-size-small));
	}
		}
@media (min-width: 80em) {
.o-release > * {
			padding-inline: calc(var(--size-1000) - var(--border-size-small));
	}
		}
.o-release > :last-child {
		-webkit-border-after: none;
		        border-block-end: none;
	}
.o-release__hero {
	padding-block: var(--size-900);
	display: grid;
	justify-items: start;
	row-gap: var(--size-600);
}
.o-release__hero > .m-text {
		max-inline-size: var(--max-width-text);
	}
.o-release__title {
	-webkit-margin-start: -0.04em;
	        margin-inline-start: -0.04em;
	font-weight: 700;
	font-size: calc(80rem / 16);
	line-height: 1;
	letter-spacing: -0.02em;
	font-variant-alternates: var(--font-variant-alternates-display);
	color: var(--color-brand);
}
@media (min-width: 64em) {
.o-release__title {
		font-size: calc(140rem / 16);
}
	}
.o-release__title + .a-display {
		-webkit-margin-before: calc(var(--size-400) * -1);
		        margin-block-start: calc(var(--size-400) * -1);
	}
.o-release__buttons {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	-moz-column-gap: var(--size-500);
	     column-gap: var(--size-500);
	row-gap: var(--size-300);
}
.o-release__grid {
	display: grid;
	-moz-column-gap: calc(var(--gap-inline) * 3 - var(--border-size-small));
	     column-gap: calc(var(--gap-inline) * 3 - var(--border-size-small));
	row-gap: var(--size-800);
}
@media (min-width: 38em) {
.o-release__grid {
		grid-template-columns: repeat(2, 1fr);
}
	}
@media (min-width: 64em) {
.o-release__grid {
		grid-template-columns: repeat(3, 1fr);
}
	}
.o-release__more {
	display: grid;
	row-gap: var(--size-500);
}
@media (min-width: 38em) {
.o-release__more > .m-text > ul {
			-moz-columns: 2;
			     columns: 2;
			-moz-column-gap: calc(var(--gap-inline) * 3);
			     column-gap: calc(var(--gap-inline) * 3);
	}
		}
@media (min-width: 64em) {
.o-release__more > .m-text > ul {
			-moz-columns: 3;
			     columns: 3;
	}
		}
.o-release__more > .m-text > ul > li {
			-moz-column-break-inside: avoid;
			     break-inside: avoid;
		}
.o-release__outro {
	padding-block: var(--size-900);
	display: grid;
	justify-items: start;
	row-gap: var(--size-600);
}
.o-release__outro > .m-text {
		max-inline-size: var(--max-width-text);
	}
.o-search-results {
	z-index: var(--z-index-main-wrapper);
	background: inherit;
	-webkit-border-after: var(--border-size-small) solid var(--color-border-tertiary);
	        border-block-end: var(--border-size-small) solid var(--color-border-tertiary);
}
.o-search-results > div {
		max-inline-size: calc(var(--max-width-content) + var(--border-size-small));
		min-block-size: calc(100vh - var(--height-header));
		margin-inline: auto;
		border-inline: var(--border-size-small) solid var(--color-border-tertiary);
		-webkit-padding-after: max(var(--gap-block-header), 50vh);
		        padding-block-end: max(var(--gap-block-header), 50vh);
	}
.o-search-results__header {
	max-inline-size: calc(502rem / 16);
	margin-inline: auto;
	-webkit-padding-before: var(--gap-block-header);
	        padding-block-start: var(--gap-block-header);
}
.o-search-results__search {
	-webkit-margin-before: calc(var(--size-700) - var(--border-size-small));
	        margin-block-start: calc(var(--size-700) - var(--border-size-small));
}
.o-search-results__pagination {
	-webkit-margin-before: var(--size-700);
	        margin-block-start: var(--size-700);
}
.o-showcase-home {
	max-inline-size: calc(var(--max-width-content) + var(--border-size-small));
	margin-inline: auto;
	border-inline: var(--border-size-small) solid var(--color-border-tertiary);
	padding-block: var(--size-800);
	padding-inline: var(--size-400);
	display: grid;
	row-gap: var(--size-500);
}
.o-showcase-home > ul {
		-webkit-margin-before: var(--size-200);
		        margin-block-start: var(--size-200);
		display: grid;
		list-style: none;
		grid-template-columns: repeat(2, 1fr);
		-moz-column-gap: calc(var(--gap-inline) * 3 - var(--border-size-small));
		     column-gap: calc(var(--gap-inline) * 3 - var(--border-size-small));
		row-gap: var(--size-500);
	}
@media (min-width: 64em) {
.o-showcase-home {
		padding-inline: calc(var(--size-500) * 3 - var(--border-size-small));
}

		.o-showcase-home > ul {
			grid-template-columns: repeat(4, 1fr);
		}
	}
@media (min-width: 80em) {
.o-showcase-home {
		padding-inline: calc(var(--size-1000) - var(--border-size-small));
}
	}
.o-try {
	z-index: var(--z-index-main-wrapper);
	inline-size: 100%;
	padding-inline: var(--gap-inline);
	-webkit-border-after: var(--border-small-tertiary);
	        border-block-end: var(--border-small-tertiary);
	background: inherit;

	/* Every section shares the bordered column of the home page */
}
.o-try > * {
		max-inline-size: calc(var(--max-width-content) + var(--border-size-small));
		margin-inline: auto;
		padding-block: var(--size-800);
		padding-inline: var(--size-400);
		border-inline: var(--border-small-tertiary);
		-webkit-border-after: var(--border-small-tertiary);
		        border-block-end: var(--border-small-tertiary);
	}
@media (min-width: 64em) {
.o-try > * {
			padding-inline: calc(var(--size-500) * 3 - var(--border-size-small));
	}
		}
@media (min-width: 80em) {
.o-try > * {
			padding-inline: calc(var(--size-1000) - var(--border-size-small));
	}
		}
.o-try > :last-child {
		-webkit-border-after: none;
		        border-block-end: none;
	}
.o-try__header {
	padding-block: var(--size-900) var(--size-800);
	display: grid;
	row-gap: var(--size-500);
}
.o-try__header > .m-text {
		max-inline-size: var(--max-width-text);
	}
.o-try__options {
	display: grid;
	-moz-column-gap: var(--size-800);
	     column-gap: var(--size-800);
	row-gap: var(--size-900);
}
@media (min-width: 64em) {
.o-try__options {
		grid-template-columns: repeat(2, minmax(0, 1fr));
}
	}
.o-try__option {
	display: grid;
	grid-template-rows: auto auto 1fr auto;
	justify-items: start;
	row-gap: var(--size-400);
}
.o-try__option > .m-text {
		max-inline-size: var(--max-width-text);
	}
/* Screenshot and code box share one height, so the headings line up */
.o-try__visual {
	inline-size: 100%;
	aspect-ratio: 860 / 478;
	-webkit-margin-after: var(--size-300);
	        margin-block-end: var(--size-300);
	overflow: hidden;
	border-radius: var(--border-radius-small);
}
.o-try__visual:where(a) {
		display: block;
		border: var(--border-small-tertiary);
	}
.o-try__visual:where(a) > img {
			display: block;
			inline-size: 100%;
			block-size: 100%;
			-o-object-fit: cover;
			   object-fit: cover;
			-o-object-position: top;
			   object-position: top;
		}
.o-try__visual.m-code {
		display: grid;
		grid-template-rows: auto 1fr;

		/* One column: as high as the commands need */
	}
@media (max-width: 63.99em) {
.o-try__visual.m-code {
			aspect-ratio: auto;
	}
		}
/* Prism wraps the `pre` in a `.code-toolbar` */
.o-try__visual.m-code > :last-child {
			align-self: center;
		}
.o-try__visual.m-code pre {
			white-space: pre-wrap;
			overflow-wrap: anywhere;
		}
.o-try__buttons {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	-moz-column-gap: var(--size-500);
	     column-gap: var(--size-500);
	row-gap: var(--size-300);
}
.o-try__showcase {
	display: grid;
	row-gap: var(--size-500);
}
.o-try__showcase > .m-text {
		max-inline-size: var(--max-width-text);
	}
.o-try__showcase > ul {
		-webkit-margin-before: var(--size-200);
		        margin-block-start: var(--size-200);
		display: grid;
		list-style: none;
		grid-template-columns: repeat(2, 1fr);
		-moz-column-gap: calc(var(--gap-inline) * 3 - var(--border-size-small));
		     column-gap: calc(var(--gap-inline) * 3 - var(--border-size-small));
		row-gap: var(--size-500);
	}
@media (min-width: 64em) {
.o-try__showcase > ul {
			grid-template-columns: repeat(4, 1fr);
	}
		}
.o-try__faq {
	display: grid;
	justify-items: start;
	row-gap: var(--size-700);
}
.o-try__faq > dl {
		display: grid;
		-moz-column-gap: var(--size-800);
		     column-gap: var(--size-800);
		row-gap: var(--size-600);
	}
@media (min-width: 64em) {
.o-try__faq > dl {
			grid-template-columns: repeat(2, minmax(0, 1fr));
	}
		}
.o-try__faq > dl > div {
			display: grid;
			align-content: start;
			row-gap: var(--size-200);
			max-inline-size: var(--max-width-text);
		}
/* Templates */
:root {
	font-family: var(--font-family);
	scroll-padding-block-start: calc(var(--height-header) + var(--gap-block-header));
	-webkit-hyphens: auto;
	-webkit-hyphenate-limit-after: var(--hyphenate-limit);
	-webkit-hyphenate-limit-before: var(--hyphenate-limit);
}
@supports (hyphenate-limit-chars: 16 8 8) {
:root {
		-webkit-hyphens: auto;
		        hyphens: auto;
		hyphenate-limit-chars: calc(var(--hyphenate-limit) * 2) var(--hyphenate-limit) var(--hyphenate-limit);
}
	}
:root[data-no-scroll],
:root:has(:popover-open),[data-no-scroll]
:root :scope {
	overflow: hidden;
	block-size: 100%;
}
body {
	font: var(--font-paragraph-medium);
	color: var(--color-content-primary);
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: auto minmax(calc(100vh - var(--height-header)), 1fr);
	background: var(--background-root);
}
body > * {
		inline-size: 100%;
	}
code {
	font-family: var(--font-family-code);
}

/*# sourceMappingURL=index.css.map */