/*
 * Siemens 2026 brand kit — Siemens Sans Pro web font.
 * Mirrors the email head @font-face block so split.css can stand alone
 * (HTML preloads still apply for first-paint speed).
 */
@font-face {
	font-family: "Siemens Sans Pro";
	font-display: swap;
	font-style: normal;
	font-weight: 400;
	src: url("https://www.mendix.com/wp-content/themes/mendix/ui/fonts/SiemensSansPro_W_Rm.woff2")
		format("woff2");
}
@font-face {
	font-family: "Siemens Sans Pro";
	font-display: swap;
	font-style: italic;
	font-weight: 400;
	src: url("https://www.mendix.com/wp-content/themes/mendix/ui/fonts/SiemensSansPro_W_It.woff2")
		format("woff2");
}
@font-face {
	font-family: "Siemens Sans Pro";
	font-display: swap;
	font-style: normal;
	font-weight: 600;
	src: url("https://www.mendix.com/wp-content/themes/mendix/ui/fonts/SiemensSansPro_W_SBd.woff2")
		format("woff2");
}
@font-face {
	font-family: "Siemens Sans Pro";
	font-display: swap;
	font-style: italic;
	font-weight: 600;
	src: url("https://www.mendix.com/wp-content/themes/mendix/ui/fonts/SiemensSansPro_W_SBdIt.woff2")
		format("woff2");
}
@font-face {
	font-family: "Siemens Sans Pro";
	font-display: swap;
	font-style: normal;
	font-weight: 700;
	src: url("https://www.mendix.com/wp-content/themes/mendix/ui/fonts/SiemensSansPro_W_Bd.woff2")
		format("woff2");
}
@font-face {
	font-family: "Siemens Sans Pro";
	font-display: swap;
	font-style: italic;
	font-weight: 700;
	src: url("https://www.mendix.com/wp-content/themes/mendix/ui/fonts/SiemensSansPro_W_BdIt.woff2")
		format("woff2");
}
/*
 * Siemens 2026: rebranded :root token palette.
 * Every other rule in this file consumes these variables — flipping them
 * here cascades the brand across the whole page (canvas, text, links,
 * borders, buttons, focus rings, form validity states).
 */
:root {
	--color-bg: #f3f3f0; /* Light Sand canvas — matches email BgEmailColor */
	--color-error: #ee0048; /* Siemens red-pink */
	--color-valid: #00ffb9; /* Bold Green */
	--color-border: #ccccd4; /* Sand 30 — matches email dividers */
	--color-placeholder: #66667e; /* Deep Blue 60 */
	--color-heading: #000028; /* Deep Blue */
	--color-hover: #00ffb9; /* Bold Green — link/button hover */
	--color-link: #000028; /* Deep Blue */
	--color-text: #000028; /* Deep Blue */
	--color-highlight: #00ffb9; /* Bold Green — <mark>, accents */
	--button-bg: #000028; /* Primary button bg = Deep Blue (matches email) */
	--button-bg2: #00ffb9; /* Bold Green — drives the visible 2px button border + .hollow variant */
	--button-fg: #00ffb9; /* Primary button label = Bold Green (matches email) */
	--loading-bg: #eceff1;
	--loading-bg2: #f6f7f8;
	--nav-button-bg: #000028;
	--nav-button-fg: var(--white);
	--height-breadcrumbs: 0px;
	--height-form-element: 3rem;
	--height-header-row-1: 0px;
	--height-header-row-2: 68px;
	--height-site-header: 0px;
	--height-subnav: 0px;
	--height-wpadminbar: 0px;
	--border-radius-1: 0px; /* Siemens 2026: square corners */
	--border-radius-2: 0px; /* Siemens 2026: square corners (cards, mxpq bg) */
	--z-site-header: 999;
	--z-header-overlay: 998;
}
.admin-bar {
	--height-wpadminbar: 46px;
}
@media screen and (min-width: 783px) {
	.admin-bar {
		--height-wpadminbar: 32px;
	}
}
.has-subnav {
	--height-subnav: 40px;
}
.has-breadcrumbs {
	--height-breadcrumbs: 48px;
}
body {
	color: var(--color-text);
	position: relative;
	--height-total-header-unstuck: calc(
		var(--height-wpadminbar) + var(--height-announcement) +
			var(--height-header-row-2) + var(--height-subnav) +
			var(--height-breadcrumbs)
	);
	--height-total-header-stuck: calc(
		var(--height-wpadminbar) + var(--height-header-row-2) +
			var(--height-subnav)
	);
}
a {
	color: var(--color-link);
	transition: all 300ms ease;
	text-underline-offset: 4px;
}
a:hover,
a:focus {
	color: var(--color-hover);
}
a:focus-visible {
	outline: 1px solid currentColor;
}
.link {
	outline: 0;
	text-decoration: underline;
	text-underline-offset: 0.25em;
	text-decoration-thickness: 2px;
	display: inline-block;
	font-weight: bold;
}
.link:focus-visible {
	outline: 1px solid currentColor;
}
.link.black {
	--color-link: black;
}
.body + a,
.wysiwyg + a {
	margin-top: 1rem;
}
.mktoButton,
.button {
	-webkit-appearance: none;
	align-items: center;
	background-color: var(--button-bg);
	/* Siemens 2026: 2px Bold Green border (var(--button-bg2)) is always visible against the Deep Blue button bg — matches the email primary button treatment. */
	border: 2px solid var(--button-bg2);
	border-radius: 0;
	color: var(--button-fg);
	cursor: pointer;
	display: inline-flex;
	font-family: inherit;
	font-weight: bold;
	font-size: 1rem;
	padding: 1rem 1.5rem;
	text-align: center;
	transition: all 300ms ease;
	vertical-align: middle;
	text-decoration: none;
}
[data-whatinput="mouse"] .mktoButton,
[data-whatinput="mouse"] .button {
	outline: 0;
}
.mktoButton .text,
.button .text {
	color: var(--button-fg);
	position: relative;
	display: inline-block;
	transition: transform 700ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transform: translate(15px, 0);
}
.mktoButton.disabled,
.button.disabled {
	pointer-events: none;
	opacity: 0.5;
}
.mktoButton.small,
.button.small {
	padding: 0.5rem;
}
.black .mktoButton,
.black .button {
	--button-bg: black;
}
.mktoButton.white,
.white .mktoButton,
.button.white,
.white .button {
	--button-bg: white;
	--button-bg2: white;
	--button-fg: #000028;
}
.mktoButton > .logo,
.button > .logo {
	width: 17px;
	height: 17px;
	margin-right: 0.5rem;
	display: inline-block;
}
.mktoButton > .logo .icon-play-cutout,
.button > .logo .icon-play-cutout {
	transform: translate(-8px, -6px);
}
.mktoButton > .logo .logo-apple,
.button > .logo .logo-apple {
	transform: translate(-12px, -10px);
}
.mktoButton > .logo .logo-windows,
.button > .logo .logo-windows {
	transform: translate(-12px, -8px);
}
.mktoButton:not(.arrow):hover,
.mktoButton:not(.arrow):focus,
.button:not(.arrow):hover,
.button:not(.arrow):focus {
	filter: brightness(1.1);
}
.mktoButton.arrow svg.arrow,
.button.arrow svg.arrow {
	transition: opacity 300ms ease;
	margin-left: 8px;
	opacity: 0;
}
.mktoButton.arrow:hover,
.mktoButton.arrow:focus,
.button.arrow:hover,
.button.arrow:focus {
	transform: translate(0, 0);
	color: var(--button-fg);
}
.mktoButton.arrow:hover .arrow,
.mktoButton.arrow:focus .arrow,
.button.arrow:hover .arrow,
.button.arrow:focus .arrow {
	opacity: 1;
}
.mktoButton.arrow:hover .text,
.mktoButton.arrow:focus .text,
.button.arrow:hover .text,
.button.arrow:focus .text {
	transition: transform 300ms ease;
	transform: translate(0, 0);
}
.mktoButton.hollow,
.mktoButton.arrow + .mktoButton.arrow,
.button.hollow,
.mktoButton.arrow + .button.arrow,
.button.arrow + .mktoButton.arrow,
.button.arrow + .button.arrow {
	--button-fg: var(--button-bg2);
	border-color: var(--button-bg2);
	background-color: rgba(0, 0, 0, 0);
}
p ~ .mktoButton,
p ~ .button {
	margin-top: 1rem;
	margin-right: 1rem;
}
@media (max-width: 63.99em) {
	.large-button svg.arrow {
		display: none;
	}
}
@media (min-width: 64em) {
	.large-button {
		-webkit-appearance: none;
		align-items: center;
		background-color: var(--button-bg);
		/* Siemens 2026: 2px Bold Green border — matches .btn / .button / .mktoButton. */
		border: 2px solid var(--button-bg2);
		border-radius: 0;
		color: var(--button-fg);
		cursor: pointer;
		display: inline-flex;
		font-family: inherit;
		font-weight: bold;
		font-size: 1rem;
		padding: 1rem 1.5rem;
		text-align: center;
		transition: all 300ms ease;
		vertical-align: middle;
		text-decoration: none;
	}
	[data-whatinput="mouse"] .large-button {
		outline: 0;
	}
	.large-button .text {
		color: var(--button-fg);
		position: relative;
		display: inline-block;
		transition: transform 700ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
		transform: translate(15px, 0);
	}
	.large-button.disabled {
		pointer-events: none;
		opacity: 0.5;
	}
	.large-button.small {
		padding: 0.5rem;
	}
	.black .large-button {
		--button-bg: black;
	}
	.large-button.white,
	.white .large-button {
		--button-bg: white;
		--button-bg2: white;
		--button-fg: #000028;
	}
	.large-button > .logo {
		width: 17px;
		height: 17px;
		margin-right: 0.5rem;
		display: inline-block;
	}
	.large-button > .logo .icon-play-cutout {
		transform: translate(-8px, -6px);
	}
	.large-button > .logo .logo-apple {
		transform: translate(-12px, -10px);
	}
	.large-button > .logo .logo-windows {
		transform: translate(-12px, -8px);
	}
	.large-button:not(.arrow):hover,
	.large-button:not(.arrow):focus {
		filter: brightness(1.1);
	}
	.large-button.arrow svg.arrow {
		transition: opacity 300ms ease;
		margin-left: 8px;
		opacity: 0;
	}
	.large-button.arrow:hover,
	.large-button.arrow:focus {
		transform: translate(0, 0);
		color: var(--button-fg);
	}
	.large-button.arrow:hover .arrow,
	.large-button.arrow:focus .arrow {
		opacity: 1;
	}
	.large-button.arrow:hover .text,
	.large-button.arrow:focus .text {
		transition: transform 300ms ease;
		transform: translate(0, 0);
	}
	.large-button.hollow,
	.large-button.arrow + .large-button.arrow {
		--button-fg: var(--button-bg2);
		border-color: var(--button-bg2);
		background-color: rgba(0, 0, 0, 0);
	}
	p ~ .large-button {
		margin-top: 1rem;
		margin-right: 1rem;
	}
}
[class*="normal"] {
	font-weight: normal;
}
[class*="normal"] > * {
	font-weight: normal;
}
[class*="normal"] > b {
	font-weight: bold;
}
[class*="lighter"] {
	font-weight: 100 !important;
}
[class*="lighter"] > * {
	font-weight: 100;
}
[class*="heading"] + p:not([class*="mt"]):not([class*="ma"]) {
	margin-top: 0.5em;
}
figure + [class^="copy"],
figure + p:not([class*="mt"]):not([class*="ma"]),
img + [class^="copy"],
img + p:not([class*="mt"]):not([class*="ma"]) {
	margin-top: 2rem;
}
i,
.italic {
	font-style: italic;
}
i > *,
.italic > * {
	font-style: italic;
}
b,
.bold {
	font-weight: bold;
}
b > *,
.bold > * {
	font-weight: bold;
}
.monospace {
	font-family: "Noto Mono", monospace;
	font-style: normal;
	font-weight: 400;
}
.uppercase {
	text-transform: uppercase;
}
.heading1 {
	/* Siemens 2026: Display headline — Siemens Sans Pro Light 300 */
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	font-size: 3rem;
	line-height: 1.125;
	font-weight: 300;
	color: var(--color-heading);
}
@media (min-width: 64em) {
	.heading1 {
		font-size: 4rem;
	}
}
.heading2 {
	/* Siemens 2026: Hero/event headline — Siemens Sans Pro Light 300 (matches email Event Name 36px) */
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	font-size: 2.2rem;
	line-height: 1.125;
	font-weight: 300;
	color: var(--color-heading);
}
@media (min-width: 64em) {
	.heading2 {
		font-size: 3rem;
	}
}
.heading3 {
	/* Siemens 2026: Confirmation/section headline — Siemens Sans Pro Light */
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	font-size: 1.8rem;
	line-height: 1.2;
	font-weight: 300;
	color: var(--color-heading);
}
@media (min-width: 64em) {
	.heading3 {
		font-size: 2.5rem;
	}
}
.heading4 {
	/* Siemens 2026: Accordion title / asset name — Siemens Sans Pro Light */
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	font-size: 1.4rem;
	line-height: 1.25;
	font-weight: 300;
	color: var(--color-heading);
}
@media (min-width: 64em) {
	.heading4 {
		font-size: 2rem;
	}
}
.heading5 {
	/* Siemens 2026: Speaker name / mini sub-title — Siemens Sans Pro Light */
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	font-size: 1.075rem;
	line-height: 1.333;
	font-weight: 300;
}
@media (min-width: 64em) {
	.heading5 {
		font-size: 1.5rem;
	}
}
.heading6 {
	font-weight: bold;
}
.heading1,
.heading2 {
	text-wrap: balance;
	max-width: 26ch;
}
.text-center .heading1,
.text-center .heading2 {
	margin: 0 auto;
}
.headings-reduced h2,
.wysiwyg.headings-reduced h2 {
	/* Siemens 2026: Reduced-size H2 — Siemens Sans Pro */
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	font-size: 1.4rem;
	line-height: 1.25;
	font-weight: 300;
	color: var(--color-heading);
	position: relative;
	width: 100%;
}
@media (min-width: 64em) {
	.headings-reduced h2,
	.wysiwyg.headings-reduced h2 {
		font-size: 2rem;
	}
}
.headings-reduced h3,
.headings-reduced h4,
.wysiwyg.headings-reduced h3,
.wysiwyg.headings-reduced h4 {
	font-size: 1.075rem;
	line-height: 1.333;
	font-weight: bold;
	width: 100%;
}
@media (min-width: 64em) {
	.headings-reduced h3,
	.headings-reduced h4,
	.wysiwyg.headings-reduced h3,
	.wysiwyg.headings-reduced h4 {
		font-size: 1.5rem;
	}
}
.headings-reduced h5 h6,
.wysiwyg.headings-reduced h5 h6 {
	font-weight: bold;
	width: 100%;
}
.heading-link {
	position: absolute;
}
.heading-link svg {
	color: #b7bbc3;
	pointer-events: none;
	transform: translate(0.25em, 0.1em);
	height: 1em;
}
.kicker {
	font-size: 0.875rem;
	line-height: 1.5;
	font-size: 1rem;
	font-family: "Noto Mono", monospace;
	text-transform: uppercase;
}
@media (min-width: 64em) {
	.kicker {
		font-size: 1rem;
	}
}
.kicker + .heading1 {
	margin-top: 0.1em;
}
.subhead {
	font-size: 1.2rem;
	line-height: 1.286;
}
@media (min-width: 64em) {
	.subhead {
		font-size: 1.75rem;
	}
}
.minihead {
	font-size: 1.075rem;
	line-height: 1.333;
	font-weight: bold;
}
@media (min-width: 64em) {
	.minihead {
		font-size: 1.5rem;
	}
}
.body-l {
	font-size: 1.075rem;
	line-height: 1.333;
}
@media (min-width: 64em) {
	.body-l {
		font-size: 1.25rem;
	}
}
.small {
	font-size: 0.875rem;
	line-height: 1.5;
}
@media (min-width: 64em) {
	.small {
		font-size: 0.875rem;
	}
}
.x-small {
	font-size: 0.75rem;
	line-height: 1.5;
}
@media (min-width: 64em) {
	.x-small {
		font-size: 0.75rem;
	}
}
.small-caps {
	font-size: 0.875rem;
	line-height: 1.5;
	letter-spacing: 1px;
	text-transform: uppercase;
}
@media (min-width: 64em) {
	.small-caps {
		font-size: 0.875rem;
	}
}
.wysiwyg {
	color: var(--color-text);
}
.wysiwyg > * + * {
	margin-top: 1em;
}
.wysiwyg p:not(:empty),
.wysiwyg ul,
.wysiwyg ol,
.wysiwyg aside,
.wysiwyg figure {
	width: 100%;
}
.wysiwyg a:not([class]) {
	outline: 0;
	text-underline-offset: 0.25em;
	text-decoration: underline;
	color: var(--color-text);
}
.wysiwyg a:not([class]):hover,
.wysiwyg a:not([class]):focus {
	color: var(--color-hover);
}
.wysiwyg ul:not(.no-bullet):not(.accordion):not([class*="list-"]) li {
	padding-left: 8px;
	margin-left: 16px;
	list-style-type: disc;
}
.wysiwyg ul,
.wysiwyg ol {
	display: block;
}
.wysiwyg ol li {
	margin-left: 16px;
	list-style-type: decimal;
}
.wysiwyg h1 {
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	font-size: 3rem;
	line-height: 1.125;
	font-weight: 300;
	color: var(--color-heading);
}
@media (min-width: 64em) {
	.wysiwyg h1 {
		font-size: 4rem;
	}
}
.wysiwyg h2 {
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	font-size: 2.2rem;
	line-height: 1.125;
	font-weight: 300;
	color: var(--color-heading);
}
@media (min-width: 64em) {
	.wysiwyg h2 {
		font-size: 3rem;
	}
}
.wysiwyg h3 {
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	font-size: 1.8rem;
	line-height: 1.2;
	font-weight: 300;
	color: var(--color-heading);
}
@media (min-width: 64em) {
	.wysiwyg h3 {
		font-size: 2.5rem;
	}
}
.wysiwyg h4 {
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	font-size: 1.4rem;
	line-height: 1.25;
	font-weight: 300;
	color: var(--color-heading);
}
@media (min-width: 64em) {
	.wysiwyg h4 {
		font-size: 2rem;
	}
}
.wysiwyg h5 {
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	font-size: 1.075rem;
	line-height: 1.333;
	font-weight: 300;
}
@media (min-width: 64em) {
	.wysiwyg h5 {
		font-size: 1.5rem;
	}
}
.wysiwyg h6 {
	font-weight: bold;
}
.wysiwyg table {
	margin: 16px auto 0;
	color: #000028;
	border: 1px solid #000028;
	border-collapse: collapse;
}
.wysiwyg table thead th,
.wysiwyg table tfoot th {
	color: var(--color-text);
	background: #e7e7e9;
}
.wysiwyg table caption {
	padding: 0.5em;
}
.wysiwyg table th,
.wysiwyg table td {
	padding: 0.5em;
	/* Siemens 2026: Sand 30 inner cell borders — matches email calendar widget divider. */
	border: 1px solid var(--color-border);
	color: var(--color-text);
}
@media (max-width: 39.99em) {
	.wysiwyg table th,
	.wysiwyg table td {
		display: block;
		width: 100% !important;
	}
}
.wysiwyg .button {
	margin-top: 1rem;
	margin-right: 1rem;
}
.wysiwyg .pullquote blockquote p {
	font-size: 1.4rem;
	line-height: 1.25;
	font-weight: bold;
	color: var(--color-heading);
	margin-top: 0;
}
@media (min-width: 64em) {
	.wysiwyg .pullquote blockquote p {
		font-size: 2rem;
	}
}
.wysiwyg .pullquote blockquote .byline {
	font-size: 0.875rem;
	line-height: 1.5;
	font-size: 1rem;
	font-family: "Noto Mono", monospace;
	text-transform: uppercase;
	margin-top: 0.5rem;
}
@media (min-width: 64em) {
	.wysiwyg .pullquote blockquote .byline {
		font-size: 1rem;
	}
}
.wysiwyg .pullquote blockquote .byline::before {
	content: "— ";
}
.wysiwyg .pullquote--stat {
	--color-heading: #000028;
	--color-text: #000028;
}
.wysiwyg .pullquote--stat p {
	font-size: 0.875rem;
	line-height: 1.5;
	font-size: 1rem;
	font-family: "Noto Mono", monospace;
	text-transform: uppercase;
	margin-top: 0;
}
@media (min-width: 64em) {
	.wysiwyg .pullquote--stat p {
		font-size: 1rem;
	}
}
.wysiwyg .mxstat__heading,
.wysiwyg .pullquote--stat p i {
	font-size: 1.8rem;
	line-height: 1.2;
	font-weight: bold;
	color: var(--color-heading);
	/* Siemens 2026: mxstat numeric stat — Siemens Sans Pro Bold */
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	text-transform: none;
	font-style: normal;
	display: block;
}
@media (min-width: 64em) {
	.wysiwyg .mxstat__heading,
	.wysiwyg .pullquote--stat p i {
		font-size: 2.5rem;
	}
}
.wysiwyg .mxpq,
.wysiwyg .mxstat {
	--color-heading: #000028;
	--color-text: #000028;
}
.wysiwyg .mxpq {
	padding-top: 1rem;
}
.wysiwyg .pullquote {
	--color-heading: #000028;
	--color-text: #000028;
	padding-top: 1rem;
	padding-bottom: 1rem;
}
.wysiwyg .mxpq.--bg {
	--color-heading: white;
	--color-text: white;
	margin-left: -0.25rem;
	margin-right: -0.25rem;
	margin-top: 2rem;
	padding: 2rem;
	border-radius: var(--border-radius-2);
	background-color: #000028;
}
.wysiwyg .mxpq__source {
	font-size: 0.875rem;
	line-height: 1.5;
	font-size: 1rem;
	font-family: "Noto Mono", monospace;
	text-transform: uppercase;
	margin-top: 0.25rem;
}
@media (min-width: 64em) {
	.wysiwyg .mxpq__source {
		font-size: 1rem;
	}
}
.wysiwyg .vidyard-lightbox-image,
.wysiwyg .vidyard-player-container {
	padding-top: 2rem;
	padding-bottom: 1rem;
}
@media (min-width: 40em) {
	.wysiwyg .mxstat blockquote,
	.wysiwyg .pullquote--stat blockquote {
		float: right;
		clear: right;
		width: 44%;
		padding: 0 0 1rem 2rem;
	}
}
@media (min-width: 64em) {
	.wysiwyg .mxstat blockquote,
	.wysiwyg .pullquote--stat blockquote {
		width: 33%;
	}
}
.underline {
	position: relative;
	display: inline-block;
}
.underline .text {
	position: relative;
	z-index: 9;
}
.underline svg {
	position: absolute;
	bottom: -3px;
	z-index: 1;
	left: 0;
	max-width: 100%;
	overflow: hidden;
}
h1 .underline svg,
h2 .underline svg {
	bottom: 2px;
}
.underline.animation.active svg path {
	animation: dash 0.75s cubic-bezier(0.445, 0.05, 0.55, 0.95) 2s forwards;
}
@keyframes dash {
	to {
		stroke-dashoffset: 0;
	}
}
mark {
	background-color: var(--color-highlight);
}
img {
	max-width: 100%;
}
html,
body {
	/* Siemens 2026: Siemens Sans Pro is the primary brand font. Helvetica/Arial fallback ensures graceful render if the WOFF2 is blocked. */
	font-family: "Siemens Sans Pro", Helvetica, Arial, sans-serif;
	background-color: var(--color-bg);
	color: var(--color-text);
	height: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
html {
	scroll-behavior: smooth;
}
@media screen and (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}
[type="checkbox"] + label,
[type="radio"] + label {
	display: inline-block;
	vertical-align: baseline;
	margin-left: 0.5rem;
	margin-right: 1rem;
	margin-bottom: 0;
}
.empty:empty {
	display: none;
}
.tags__item__link {
	font-size: 0.875rem;
	line-height: 1.4;
	letter-spacing: 1px;
	text-transform: uppercase;
	display: inline-block;
	margin-top: 4px;
	margin-right: 4px;
	color: var(--color-text);
	border: 1px solid var(--color-text);
	border-radius: 2px;
	padding: 2px 6px;
	transition: all 200ms ease;
	white-space: nowrap;
	max-width: -moz-fit-content;
	max-width: fit-content;
}
.accordion-title {
	color: var(--color-text);
	text-align: left;
	border: 0;
	display: flex;
	padding: 0;
	background-color: rgba(0, 0, 0, 0);
	margin-bottom: 0;
}
*::-moz-placeholder {
	color: #999;
}
*::placeholder {
	color: #999;
}
.btn {
	-webkit-appearance: none;
	align-items: center;
	background-color: var(--button-bg);
	/* Siemens 2026: 2px Bold Green border — matches the email + other button variants. */
	border: 2px solid var(--button-bg2);
	border-radius: 0;
	color: var(--button-fg);
	cursor: pointer;
	display: inline-flex;
	font-family: inherit;
	font-weight: bold;
	font-size: 1rem;
	padding: 1rem 1.5rem;
	text-align: center;
	transition: all 300ms ease;
	vertical-align: middle;
	text-decoration: none;
}
[data-whatinput="mouse"] .btn {
	outline: 0;
}
.btn .text {
	color: var(--button-fg);
	position: relative;
	display: inline-block;
	transition: transform 700ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transform: translate(15px, 0);
}
.btn.disabled {
	pointer-events: none;
	opacity: 0.5;
}
.btn.small {
	padding: 0.5rem;
}
.black .btn {
	--button-bg: black;
}
.btn.white,
.white .btn {
	--button-bg: white;
	--button-bg2: white;
	--button-fg: #000028;
}
.btn > .logo {
	width: 17px;
	height: 17px;
	margin-right: 0.5rem;
	display: inline-block;
}
.btn > .logo .icon-play-cutout {
	transform: translate(-8px, -6px);
}
.btn > .logo .logo-apple {
	transform: translate(-12px, -10px);
}
.btn > .logo .logo-windows {
	transform: translate(-12px, -8px);
}
.btn:not(.arrow):hover,
.btn:not(.arrow):focus {
	filter: brightness(1.1);
}
.btn.arrow svg.arrow {
	transition: opacity 300ms ease;
	margin-left: 8px;
	opacity: 0;
}
.btn.arrow:hover,
.btn.arrow:focus {
	transform: translate(0, 0);
	color: var(--button-fg);
}
.btn.arrow:hover .arrow,
.btn.arrow:focus .arrow {
	opacity: 1;
}
.btn.arrow:hover .text,
.btn.arrow:focus .text {
	transition: transform 300ms ease;
	transform: translate(0, 0);
}
.btn.hollow,
.btn.arrow + .btn.arrow {
	--button-fg: var(--button-bg2);
	border-color: var(--button-bg2);
	background-color: rgba(0, 0, 0, 0);
}
p ~ .btn {
	margin-top: 1rem;
	margin-right: 1rem;
}
.mt-section {
	margin-top: 1rem;
}
.mt-section .collapse {
	padding-top: 1rem;
}
.social-icon {
	display: inline;
}
.social-icon a {
	display: inline-block;
	width: 40px;
	height: 40px;
	margin-right: 0.25em;
	font-size: 1.5rem;
}
.speaker-name p,
.speaker-title p,
.speaker-company p {
	margin-bottom: 0;
}
#article-section img,
#article-section video {
	border-radius: var(--border-radius-2);
	margin-bottom: 1rem;
}
#header {
	position: fixed;
	z-index: 999;
	width: 100vw;
	/* Siemens 2026: Locked Deep Blue header bar — matches email LogoModule00. White Mendix logo PNG sits on this in the HTML. */
	background-color: #000028;
	border-bottom: 0;
	top: 0;
}
#hero {
	margin-top: 5rem;
}
#hero .list-inline li {
	display: inline-block;
}
@media only screen and (max-width: 768px) {
	.accordion-title:after {
		font-family: "Font Awesome 5 Free";
		text-rendering: auto;
		font-size: 0.7em;
		margin-top: 0.45rem;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		content: "";
		transform: rotate(0deg);
		transition: all linear 250ms;
		margin-left: 1em;
	}
	.accordion-title[aria-expanded="true"] {
		border-bottom: none;
	}
	.accordion-title[aria-expanded="true"]:after {
		transform: rotate(90deg);
	}
}
@media screen and (min-width: 992px) {
	.mt-section .collapse {
		padding-bottom: 3rem;
	}
}

/*
 * Siemens 2026: Footer band — locked Siemens Petrol (#009999) in both
 * light and dark modes. White social icons + white copyright text.
 * Mirrors email FooterModule01/02 treatment.
 */
footer {
	background-color: #009999;
	color: #ffffff;
	border-top: 0 !important;
}
footer .copyright,
footer .copyright p {
	color: #ffffff;
}
footer .social-icon a,
footer .social-icon a:link,
footer .social-icon a:visited {
	color: #ffffff;
}
footer .social-icon a:hover,
footer .social-icon a:focus {
	color: #00ffb9; /* Bold Green on hover */
}

/*
 * Siemens 2026: Light-theme MAIN content area.
 * The dark-filled SVG icons (calendar/clock/location/LinkedIn) and the
 * Marketo form chrome don't have light-mode counterparts available in
 * the WP media library, so we lock <main> to a Light Sand surface with
 * Deep Blue text + Petrol links. Header (Deep Blue) and footer (Petrol)
 * still ride above/below this band and keep their inverted treatment.
 * Token overrides cascade to every descendant rule that already
 * consumes var(--color-*), so headings, agenda tables, accordions, form
 * labels, etc. all flip automatically without per-selector edits.
 */
main {
	--color-bg: #f3f3f0; /* Light Sand */
	--color-text: #000028; /* Deep Blue */
	--color-heading: #000028; /* Deep Blue */
	--color-link: #009999; /* Petrol — AA-compliant on Light Sand */
	--color-hover: #000028; /* Deep Blue on hover for emphasis */
	--color-border: #ccccd4; /* Sand 30 dividers */
	--color-placeholder: #66667e; /* Deep Blue 60 */
	color-scheme: light;
	background-color: var(--color-bg);
	color: var(--color-text);
}
/* Main-area links: Petrol default, Deep Blue underline on hover.
   Underline is always on so the link affordance reads on the Sand bg
   even before hover (Petrol on Sand without underline is borderline). */
main a,
main .wysiwyg a:not([class]) {
	color: var(--color-link);
	text-decoration: underline;
	text-underline-offset: 4px;
}
main a:hover,
main a:focus,
main .wysiwyg a:not([class]):hover,
main .wysiwyg a:not([class]):focus {
	color: var(--color-hover);
}
/* Accordion section titles (Event Agenda, Location, Meet the Speakers,
   Register, etc.) — Deep Blue text with a Sand 30 bottom rule so each
   section has a clear visual break against the Sand canvas. */
main .accordion-title {
	color: var(--color-heading);
	border-bottom: 1px solid var(--color-border);
	padding-bottom: 0.5rem;
	width: 100%;
}
/* Speaker card details — Deep Blue name + body, Petrol italic title. */
main .speaker-name,
main .speaker-name h3 {
	color: var(--color-heading);
}
main .speaker-title {
	color: var(--color-link); /* Petrol */
}
main .speaker-text {
	color: var(--color-text);
}
/* Speaker LinkedIn glyph: Deep Blue on Sand, Petrol on hover.
   The .icon class is FontAwesome glyph color — works for both the
   single-speaker and multi-speaker sections. */
main .speaker-text + .mktoText .icon,
main li .icon,
main .icon {
	color: var(--color-heading);
}
main .icon:hover,
main .icon:focus {
	color: var(--color-link); /* Petrol */
}
/* Agenda table — Deep Blue text, Sand 30 dividers, Sand row highlight
   on header. Inherits from .wysiwyg table rules but we re-state for the
   non-.wysiwyg .table.table-sm Bootstrap variant used in the markup. */
main table.table th,
main table.table td {
	color: var(--color-text);
	border-color: var(--color-border);
}
main table.table thead th {
	background-color: #e7e7e9; /* Sand tint, matches .wysiwyg table thead */
	color: var(--color-heading);
}

/*
 * Siemens 2026: Dark mode parity — narrowed to the header/footer chrome
 * only. Per design feedback the <main> content area must stay light in
 * both color schemes (so the dark-filled icon SVGs keep contrast), so
 * this block intentionally does NOT invert the canvas. Header and
 * footer are already locked Deep Blue / Petrol so they read correctly
 * in dark UI; we just re-state to override any UA-injected styling and
 * keep the form fields' chrome readable.
 */
@media (prefers-color-scheme: dark) {
	#header {
		background-color: #000028; /* Stays locked Deep Blue */
	}
	footer {
		background-color: #009999; /* Stays locked Petrol */
		color: #ffffff;
	}
	/* <main> intentionally stays light — no token overrides here. */
}
