/* Figtree */
@font-face {
	font-family: 'Figtree';
	font-style: italic;
	font-weight: 300 900;
	font-display: swap;
	src: url(https://fonts.gstatic.com/s/figtree/v9/_Xmu-HUzqDCFdgfMm4GNAa5o_ik.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Figtree';
	font-style: italic;
	font-weight: 300 900;
	font-display: swap;
	src: url(https://fonts.gstatic.com/s/figtree/v9/_Xmu-HUzqDCFdgfMm4GND65o.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
	font-family: 'Figtree';
	font-style: normal;
	font-weight: 300 900;
	font-display: swap;
	src: url(https://fonts.gstatic.com/s/figtree/v9/_Xms-HUzqDCFdgfMm4q9DbZs.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Figtree';
	font-style: normal;
	font-weight: 300 900;
	font-display: swap;
	src: url(https://fonts.gstatic.com/s/figtree/v9/_Xms-HUzqDCFdgfMm4S9DQ.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	/* Colors
	-------------------------------------------------------------- */
	--so-color-primary: #0072BB;
	--so-color-primary-dark: #142129;
	--so-color-primary-light: #EBF1F5;
	--so-color-secondary: #76B72D;
	--so-color-secondary-dark: #3f5a1f;
	--so-color-secondary-light: #9ee948;
	--so-color-tertiary: #C43007;
	--so-color-tertiary-dark: #420F01;
	--so-color-tertiary-light: #FFDCD5;

	--so-color-text: #1E1E1E;

	--so-color-bg-1: #EBF1F5;
	--so-color-bg1-Container-1: #E4EBF0;
	--so-color-bg1-Container-2: #DDE5EB;
	--so-color-bg1-Container-3: #CED9E0;
	--so-color-bg1-Container-4: #C1CED6;
	--so-color-bg1-Container-5: #B3C2CC;

	--so-color-bg-2: #142129;
	--so-color-bg2-Container-1: #1C2A33;
	--so-color-bg2-Container-2: #22333D;
	--so-color-bg2-Container-3: #223141;
	--so-color-bg2-Container-4: #22333D;
	--so-color-bg2-Container-5: #22333D;

	--so-color-text1-on-bg-1: #142129;
	--so-color-text2-on-bg-1: #808080;
	--so-color-text1-on-bg-2: #FFFFFF;
	--so-color-text2-on-bg-2: #999999;

	--so-color-error: #A8001B;
	--so-color-success: #36A652;

	--so-color-white: #FFFFFF;
	--so-color-grey-98: #f9f9f9;
	--so-color-grey-92: #EBEBEB;
	--so-color-grey-80: #CCCCCC;
	--so-color-grey-70: #B3B3B3;
	--so-color-grey-60: #999999;
	--so-color-grey-50: #808080;
	--so-color-grey-40: #666666;
	--so-color-grey-30: #4C4C4C;
	--so-color-grey-20: #333333;
	--so-color-grey-10: #191919;
	--so-color-grey-5: #0D0D0D;

	/* Color filters
	-------------------------------------------------------------- */
	--so-filter-primary: brightness(0) invert(29%) sepia(88%) saturate(5125%) hue-rotate(188deg) brightness(94%) contrast(102%);
	--so-filter-primary-dark: brightness(0) invert(7%) sepia(19%) saturate(1619%) hue-rotate(159deg) brightness(91%) contrast(88%);
	--so-filter-primary-light: brightness(0) invert(98%) sepia(16%) saturate(493%) hue-rotate(172deg) brightness(96%) contrast(101%);
	--so-filter-secondary: brightness(0) invert(63%) sepia(36%) saturate(804%) hue-rotate(46deg) brightness(94%) contrast(90%);
	--so-filter-secondary-dark: brightness(0) invert(29%) sepia(37%) saturate(694%) hue-rotate(45deg) brightness(95%) contrast(93%);
	--so-filter-secondary-light: brightness(0) invert(81%) sepia(82%) saturate(391%) hue-rotate(29deg) brightness(93%) contrast(96%);
	--so-filter-tertiary: brightness(0) invert(17%) sepia(64%) saturate(4675%) hue-rotate(15deg) brightness(99%) contrast(94%);
	--so-filter-tertiary-dark: brightness(0) invert(7%) sepia(37%) saturate(6544%) hue-rotate(8deg) brightness(92%) contrast(99%);
	--so-filter-tertiary-light: brightness(0) invert(86%) sepia(12%) saturate(696%) hue-rotate(317deg) brightness(103%) contrast(101%);

	--so-filter-bg-1: brightness(0) invert(98%) sepia(11%) saturate(717%) hue-rotate(173deg) brightness(99%) contrast(95%);
	--so-filter-bg1-Container-1: brightness(0) invert(97%) sepia(13%) saturate(592%) hue-rotate(172deg) brightness(95%) contrast(98%);
	--so-filter-bg1-Container-2: brightness(0) invert(97%) sepia(2%) saturate(1962%) hue-rotate(176deg) brightness(93%) contrast(98%);
	--so-filter-bg1-Container-3: brightness(0) invert(96%) sepia(3%) saturate(1438%) hue-rotate(173deg) brightness(91%) contrast(93%);

	--so-filter-bg-2: brightness(0) invert(17%) sepia(64%) saturate(4675%) hue-rotate(15deg) brightness(99%) contrast(94%);
	--so-filter-bg2-Container-1: brightness(0) invert(8%) sepia(54%) saturate(447%) hue-rotate(159deg) brightness(100%) contrast(93%);
	--so-filter-bg2-Container-2: brightness(0) invert(18%) sepia(11%) saturate(1409%) hue-rotate(159deg) brightness(93%) contrast(95%);
	--so-filter-bg2-Container-3: brightness(0) invert(14%) sepia(13%) saturate(1587%) hue-rotate(159deg) brightness(96%) contrast(87%);

	--so-filter-text1-on-bg-1: brightness(0) invert(8%) sepia(9%) saturate(2930%) hue-rotate(159deg) brightness(92%) contrast(90%);
	--so-filter-text2-on-bg-1: brightness(0) invert(58%) sepia(0%) saturate(1%) hue-rotate(136deg) brightness(86%) contrast(87%);
	--so-filter-text1-on-bg-2: brightness(0) invert(98%) sepia(95%) saturate(0%) hue-rotate(125deg) brightness(104%) contrast(103%);
	--so-filter-text2-on-bg-2: brightness(0) invert(63%) sepia(99%) saturate(0%) hue-rotate(226deg) brightness(87%) contrast(60%);

	--so-filter-grey-70: brightness(0) invert(81%) sepia(2%) saturate(14%) hue-rotate(316deg) brightness(89%) contrast(91%);

	--so-filter-error: brightness(0) invert(29%) sepia(96%) saturate(3389%) hue-rotate(334deg) brightness(62%) contrast(130%);
	--so-filter-success: brightness(0) invert(47%) sepia(25%) saturate(1021%) hue-rotate(83deg) brightness(108%) contrast(95%);

	--so-filter-white: brightness(0) invert(100%) sepia(100%) saturate(0%) hue-rotate(127deg) brightness(104%) contrast(101%);

	/* Typografie
	-------------------------------------------------------------- */
	/* Body font */
	--so-font-family: 'Figtree', sans-serif;
	--so-fontsize-body: 18px;
	--so-fontsize-body-line-height: 1.5;
	--so-fontsize-body-letter-spacing: 0;

	/* Heading font */
	--so-font-family-heading: 'Figtree', sans-serif;
	--so-fontsize-h1: 72px;
	--so-fontsize-h2: 48px;
	--so-fontsize-h3: 36px;
	--so-fontsize-h4: 28px;
	--so-fontsize-h5: 20px;
	--so-fontsize-h6: 16px;
	
	/* Heading spacing bottom */
	--so-fontsize-h-default-spacing-bottom: 32px;
	--so-fontsize-h1-spacing-bottom: var(--so-fontsize-h-default-spacing-bottom);
	--so-fontsize-h2-spacing-bottom: var(--so-fontsize-h-default-spacing-bottom);
	--so-fontsize-h3-spacing-bottom: var(--so-fontsize-h-default-spacing-bottom);
	--so-fontsize-h4-spacing-bottom: 28px;
	--so-fontsize-h5-spacing-bottom: 20px;
	--so-fontsize-h6-spacing-bottom: 14px;

	/* Heading line height */
	--so-fontsize-h-default-line-height: 1.2;
	--so-fontsize-h1-line-height: 64px;
	--so-fontsize-h2-line-height: 48px;
	--so-fontsize-h3-line-height: 36px;
	--so-fontsize-h4-line-height: 28px;
	--so-fontsize-h5-line-height: 20px;
	--so-fontsize-h6-line-height: 16px;
	
	/* Heading letter spacing */
	--so-fontsize-h-default-letter-spacing: -5%;
	--so-fontsize-h1-letterspacing: var(--so-fontsize-h-default-letter-spacing);
	--so-fontsize-h2-letterspacing: var(--so-fontsize-h-default-letter-spacing);
	--so-fontsize-h3-letterspacing: var(--so-fontsize-h-default-letter-spacing);
	--so-fontsize-h4-letterspacing: var(--so-fontsize-h-default-letter-spacing);
	--so-fontsize-h5-letterspacing: var(--so-fontsize-h-default-letter-spacing);
	--so-fontsize-h6-letterspacing: var(--so-fontsize-h-default-letter-spacing);

	/* Heading font weight */
	--so-fontsize-h-font-weight: 600;

	/* Paddings en marges
	-------------------------------------------------------------- */
	--so-group-spacing: 128px;
	--so-body-spacing: 16px;
	--so-container-size: 1312px;
	--so-transition-speed: 0.35s;
	--so-block-gap: 32px;

	--so-border-radius: 8px;

	--so-transition: all .1s ease-in-out;

	@media (width <= 1312px) {
		--so-group-spacing: 80px;
	}

	@media (width <= 768px) {
		--so-group-spacing: 64px;
		--so-block-gap: 24px;
	}

	@media (width <= 650px) {
		--so-fontsize-h1: 48px;
		--so-fontsize-h2: 36px;
		--so-fontsize-h3: 28px;
		--so-fontsize-h4: 24px;
		--so-fontsize-h5: 18px;
		--so-fontsize-h6: 16px;
		
		--so-fontsize-h-default-spacing-bottom: 16px;

		--so-fontsize-h-default-line-height: 1;
		--so-fontsize-h1-line-height: 1;
		--so-fontsize-h2-line-height: 1;
		--so-fontsize-h3-line-height: 1;
		--so-fontsize-h4-line-height: 1;
		--so-fontsize-h5-line-height: 1;
		--so-fontsize-h6-line-height: 1;
	}
}
/* Slick slider */
.slick-slider{position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:#fff0}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:none}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto}.slick-track:before,.slick-track:after{display:table;content:''}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir='rtl'] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid #fff0}.slick-arrow.slick-hidden{display:none}


/* Reset & normalize
-------------------------------------------------------------- */
 html {
	line-height: var(--so-fontsize-body-line-height);
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
}

hr {
	box-sizing: content-box;
	height: 0;
}

pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

b,
strong {
	font-weight: 700;
}

code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	margin: 0;
}

button,
select {
	text-transform: none;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

fieldset {
	padding: 0.35em 0.75em 0.625em;
}

legend {
	padding: 0;
}

progress {
	vertical-align: baseline;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

details {
	display: block;
}

summary {
	display: list-item;
}

*, *:before, *:after {
	box-sizing: border-box;
}


/* List items
-------------------------------------------------------------- */
ul {
	padding-left: 18px;

	li p {
		margin: 0;
	}
}

/* CTA, logo, and rich text images
-------------------------------------------------------------- */
.hs_cos_wrapper_type_cta img,
.hs_cos_wrapper_type_logo img,
.hs_cos_wrapper_type_rich_text img {
	height: auto;
	max-width: 100%;
}


/* Buttons & knoppen
-------------------------------------------------------------- */
form input[type=submit],
form .hs-button,
button,
.button,
.hs-button {
	cursor: pointer;
	display: inline-block;
	text-align: center;
	transition: all 0.15s linear;
	white-space: normal;
}

form input[type=submit]:disabled,
form .hs-button:disabled,
button:disabled,
.button:disabled,
.hs-button:disabled {
	background-color: #D0D0D0;
	border-color: #D0D0D0;
	color: #E6E6E6;
}


/* Formuliervelden & Forms
-------------------------------------------------------------- */
.hs-form-field {
	margin-bottom: 1.4rem;
}

form label {
	display: block;
	font-size: 0.875rem;
	margin-bottom: 0.35rem;
}

.form-title {
	margin-bottom: 0;
}

form legend {
	font-size: 0.875rem;
}

form input[type=text],
form input[type=search],
form input[type=email],
form input[type=password],
form input[type=tel],
form input[type=number],
form input[type=file],
form select,
form textarea {
	display: inline-block;
	font-size: 0.875rem;
	padding: 0.7rem;
	width: 100%;
}

form textarea {
	resize: vertical;
}

form fieldset {
	max-width: 100% !important;
}

form .inputs-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

form .inputs-list > li {
	display: block;
	margin: 0.7rem 0;
}

form .inputs-list input,
form .inputs-list span {
	vertical-align: middle;
}

form input[type=checkbox],
form input[type=radio] {
	cursor: pointer;
	margin-right: 0.35rem;
}

.hs-dateinput {
	position: relative;
}

.hs-dateinput:before {
	content:'\01F4C5';
	position: absolute;
	right: 10%;
	top: 50%;
	transform: translateY(-50%);
}

.fn-date-picker .pika-table thead th {
	color: #FFF;
}

.fn-date-picker td.is-selected .pika-button {
	border-radius: 0;
	box-shadow: none;
}

.fn-date-picker td .pika-button:hover,
.fn-date-picker td .pika-button:focus {
	border-radius: 0 !important;
	color: #FFF;
}

form input[type=file] {
	background-color: transparent;
	border: initial;
	padding: initial;
}

form .hs-richtext,
form .hs-richtext p {
	font-size: 0.875rem;
	margin: 0 0 1.4rem;
}

form .hs-richtext img {
	max-width: 100% !important;
}

.legal-consent-container .hs-form-booleancheckbox-display > span,
.legal-consent-container .hs-form-booleancheckbox-display > span p {
	margin-left: 1rem !important;
}

.hs-form-required {
	color: #EF6B51;
}

.hs-input.invalid.error {
	border-color: #EF6B51;
}

.hs-error-msg {
	color: #EF6B51;
	margin-top: 0.35rem;
}

.grecaptcha-badge {
	margin: 0 auto;
}


/* Table
-------------------------------------------------------------- */
table {
	border-collapse: collapse;
	margin-bottom: 1.4rem;
	overflow-wrap: break-word;
}

td,
th {
	vertical-align: top;
}

thead th {
	vertical-align: bottom;
}


/* Drag & Drop containers & functies
-------------------------------------------------------------- */
.content-wrapper {
	margin: 0 auto;
	padding: 0 1rem;
}

@media screen and (min-width: 1380px) {
	.content-wrapper {
		padding: 0;
	}
}

.dnd-section > .row-fluid {
	margin: 0 auto;
}

.dnd-section .dnd-column {
	padding: 0 16px;
}

@media (max-width: 767px) {
	.dnd-section .dnd-column {
		padding: 0;
	}
}



:root {
	--column-gap: 2.13%;
	--column-width-multiplier: 8.333;
}

.row-fluid {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}


	.row-fluid .span1,
	.row-fluid .span2,
	.row-fluid .span3,
	.row-fluid .span4,
	.row-fluid .span5,
	.row-fluid .span6,
	.row-fluid .span7,
	.row-fluid .span8,
	.row-fluid .span9,
	.row-fluid .span10,
	.row-fluid .span11,
	.row-fluid .span12{
	min-height: 1px;
	width: 100%;
}

@media (min-width: 768px) {
	.row-fluid {
		flex-wrap: nowrap;
		justify-content: space-between;
	}

	
		.row-fluid .span1 {
			width: calc(var(--column-width-multiplier) * 1% * 1 - var(--column-gap) * (11 * var(--column-width-multiplier) / 100));
		}
	
		.row-fluid .span2 {
			width: calc(var(--column-width-multiplier) * 1% * 2 - var(--column-gap) * (10 * var(--column-width-multiplier) / 100));
		}
	
		.row-fluid .span3 {
			width: calc(var(--column-width-multiplier) * 1% * 3 - var(--column-gap) * (9 * var(--column-width-multiplier) / 100));
		}
	
		.row-fluid .span4 {
			width: calc(var(--column-width-multiplier) * 1% * 4 - var(--column-gap) * (8 * var(--column-width-multiplier) / 100));
		}
	
		.row-fluid .span5 {
			width: calc(var(--column-width-multiplier) * 1% * 5 - var(--column-gap) * (7 * var(--column-width-multiplier) / 100));
		}
	
		.row-fluid .span6 {
			width: calc(var(--column-width-multiplier) * 1% * 6 - var(--column-gap) * (6 * var(--column-width-multiplier) / 100));
		}
	
		.row-fluid .span7 {
			width: calc(var(--column-width-multiplier) * 1% * 7 - var(--column-gap) * (5 * var(--column-width-multiplier) / 100));
		}
	
		.row-fluid .span8 {
			width: calc(var(--column-width-multiplier) * 1% * 8 - var(--column-gap) * (4 * var(--column-width-multiplier) / 100));
		}
	
		.row-fluid .span9 {
			width: calc(var(--column-width-multiplier) * 1% * 9 - var(--column-gap) * (3 * var(--column-width-multiplier) / 100));
		}
	
		.row-fluid .span10 {
			width: calc(var(--column-width-multiplier) * 1% * 10 - var(--column-gap) * (2 * var(--column-width-multiplier) / 100));
		}
	
		.row-fluid .span11 {
			width: calc(var(--column-width-multiplier) * 1% * 11 - var(--column-gap) * (1 * var(--column-width-multiplier) / 100));
		}
	
}
/* Container
-------------------------------------------------------------- */
main#main-content {
	max-width: 100vw;
	overflow-x: clip;
}
.container,
main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > * {
	max-width: calc(var(--so-container-size) + 40px);
	padding-left: 20px;
	padding-right: 20px;
	margin-left: auto;
	margin-right: auto;
}
main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > *:not([class*=background-color]):not([class*=full-width-section]):not([class*=background-image]),
.container {
	max-width: calc(var(--so-container-size) + 40px) !important;
}

main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > div[class*="background-image"]:not([class*="full-width-section"]) {
	margin-top: 40px;
	margin-bottom: 40px;
}
	
main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > *:not([class*=max-width-section-centering]) > .row-fluid {
	max-width: var(--so-container-size) !important;
}

main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > div[class*="full-width-section"] {
	width: 100%;
	max-width: 100vw;
	padding-top: var(--so-group-spacing);
	padding-bottom: var(--so-group-spacing);
	padding-left: 0;
	padding-right: 0;
	margin-top: var(--so-group-spacing);
	margin-bottom: var(--so-group-spacing);
}

main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > div[class*="full-width-section"]:has( + div[class*="full-width-section"]) {
	margin-bottom: 0;
}
main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > div[class*="full-width-section"] + div[class*="full-width-section"] {
	margin-top: 0;
}

main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > .dnd-section[class*="full-width-section"]:has(+ .dnd-section:not([class*="full-width-section"]) + .dnd-section[class*="full-width-section"]) {
	margin-bottom: 0;
}
main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > .dnd-section[class*="full-width-section"] + .dnd-section:not([class*="full-width-section"]) + .dnd-section[class*="full-width-section"] {
	margin-top: 0;
}

main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > .dnd-section:has(+ .dnd-section:not([class*="background-color"])) {
	margin-bottom: 0;
}
main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > .dnd-section:not([class*="background-color"]) + .dnd-section {
	margin-top: 0;
}

main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > div[class*="full-width-section"] > .row-fluid {
	max-width: calc(var(--so-container-size) + 40px) !important;
	width: 100% !important;
	margin-left: auto;
	margin-right: auto;
	padding-left: 20px;
	padding-right: 20px;
}

main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > div[class*="background-color"]:not([class*="full-width-section"]) {
	border-radius: 24px;
	margin-top: var(--so-group-spacing);
	margin-bottom: var(--so-group-spacing);
	padding-top: calc(var(--so-group-spacing) * 2);
	padding-bottom: calc(var(--so-group-spacing) * 2);
	padding-left: 20px;
	padding-right: 20px;
}

@media screen and (max-width: 767px) {
	main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > div[class*="background-color"]:not([class*="full-width-section"]) {
		padding-top: var(--so-group-spacing);
		padding-bottom: var(--so-group-spacing);
	}	
}

main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > div[class*="background-color"]:not([class*="full-width-section"]) > * {
	margin: 0 auto !important;
	max-width: 100% !important;
	width: 100% !important;
}

main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > div:last-child:is([class*="full-width-section"]) {
	margin-bottom: 0;
}

@media (max-width: 1372px) {
	main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > div[class*="background-color"]:not([class*="full-width-section"]),
	main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > div[class*="background-image"]:not([class*="full-width-section"]) {
		margin-left: 20px;
		margin-right: 20px;
	}
}

@media (max-width: 767px) {
	.container,
	main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > div[class*="full-width-section"] > .row-fluid {
		max-width: 100vw;
		width: 100vw;
		padding-left: 20px;
		padding-right: 20px;
		margin-left: auto;
		margin-right: auto;
	}
	main#main-content > .container-fluid > .row-fluid-wrapper > .row-fluid > .widget-span > *:not([class*=max-width-section-centering]) > .row-fluid {
		margin-left: 0;
		margin-right: 0;
		width: 100% !important;
	}	
}

.dnd-section[class*="-background-image"] {
	background-color: var(--so-color-bg-2);
}


/* Typografie
-------------------------------------------------------------- */
html,
body {
	font-family: var(--so-font-family);
	font-size: var(--so-fontsize-body);
	line-height: var(--so-fontsize-body-line-height);
	letter-spacing: var(--so-fontsize-body-letter-spacing);
	background-color: var(--so-color-bg-1);
	color: var(--so-color-text);
	font-weight: 300;
	scroll-behavior: smooth;
	scroll-padding-top: 80px;
}

a {
	color: inherit;
	text-decoration: underline;
	text-decoration-thickness: 0.5px;
	text-decoration-color: var(--so-color-text);
	text-underline-offset: 4px;
	transition: var(--so-transition);
	outline: 2px solid transparent;
	border-radius: 2px;

	@media (pointer: fine) {
		&:hover {
			text-decoration-color: var(--so-color-primary);
			color: var(--so-color-primary);
		}
	}

	&:focus {
		outline: 2px solid var(--so-color-primary-dark);
	}
}

/* Headings */
h1,
.h1 {
	font-size: var(--so-fontsize-h1);
	font-family: var(--so-font-family-heading);
	margin-bottom: 0;
	line-height: var(--so-fontsize-h1-line-height);
	letter-spacing: var(--so-fontsize-h1-letterspacing);
	font-weight: var(--so-fontsize-h-font-weight);
	margin-top: 0;

	&:has(+ *) {
		margin-bottom: var(--so-fontsize-h1-spacing-bottom);
	}

	@media screen and (max-width: 767px) {
		margin-bottom: var(--so-fontsize-h1-spacing-bottom);
	}
}

h2,
.h2 {
	font-size: var(--so-fontsize-h2);
	font-family: var(--so-font-family-heading);
	margin-bottom: 0;
	line-height: var(--so-fontsize-h2-line-height);
	letter-spacing: var(--so-fontsize-h2-letterspacing);
	font-weight: var(--so-fontsize-h-font-weight);
	margin-top: 0;

	&:has(+ *) {
		margin-bottom: var(--so-fontsize-h2-spacing-bottom);
	}

	@media screen and (max-width: 767px) {
		margin-bottom: var(--so-fontsize-h2-spacing-bottom);
	}
}

h3,
.h3 {
	font-size: var(--so-fontsize-h3);
	font-family: var(--so-font-family-heading);
	margin-bottom: 0;
	line-height: var(--so-fontsize-h3-line-height);
	letter-spacing: var(--so-fontsize-h3-letterspacing);
	font-weight: var(--so-fontsize-h-font-weight);
	margin-top: 0;

	&:has(+ *) {
		margin-bottom: var(--so-fontsize-h3-spacing-bottom);
	}

	@media screen and (max-width: 767px) {
		margin-bottom: var(--so-fontsize-h3-spacing-bottom);
	}
}

h4,
.h4 {
	font-size: var(--so-fontsize-h4);
	font-family: var(--so-font-family-heading);
	margin-bottom: 0;
	line-height: var(--so-fontsize-h4-line-height);
	letter-spacing: var(--so-fontsize-h4-letterspacing);
	font-weight: var(--so-fontsize-h-font-weight);
	margin-top: 0;

	&:has(+ *) {
		margin-bottom: var(--so-fontsize-h4-spacing-bottom);
	}

	@media screen and (max-width: 767px) {
		margin-bottom: var(--so-fontsize-h4-spacing-bottom);
	}
}

h5,
.h5 {
	font-size: var(--so-fontsize-h5);
	font-family: var(--so-font-family-heading);
	margin-bottom: 0;
	line-height: var(--so-fontsize-h5-line-height);
	letter-spacing: var(--so-fontsize-h5-letterspacing);
	font-weight: var(--so-fontsize-h-font-weight);
	margin-top: 0;

	&:has(+ *) {
		margin-bottom: var(--so-fontsize-h5-spacing-bottom);
	}

	@media screen and (max-width: 767px) {
		margin-bottom: var(--so-fontsize-h5-spacing-bottom);
	}
}

h6,
.h6 {
	font-size: var(--so-fontsize-h6);
	font-family: var(--so-font-family-heading);
	margin-bottom: 0;
	line-height: var(--so-fontsize-h6-line-height);
	letter-spacing: var(--so-fontsize-h6-letterspacing);
	font-weight: var(--so-fontsize-h-font-weight);
	margin-top: 0;

	&:has(+ *) {
		margin-bottom: var(--so-fontsize-h6-spacing-bottom);
	}

	@media screen and (max-width: 767px) {
		margin-bottom: var(--so-fontsize-h6-spacing-bottom);
	}
}

p + h2,
p + h3,
p + h4,
p + h5,
p + h6 {
	margin-top: 32px;
}

p {
	font-family: var(--so-font-family);
	font-size: var(--so-fontsize-body);
	line-height: var(--so-fontsize-body-line-height);
	letter-spacing: var(--so-fontsize-body-letter-spacing);
	font-weight: 400;
	margin-bottom: 0;
}

p:not(:last-child) {
	margin-bottom: var(--so-fontsize-h-default-spacing-bottom);
}

.dnd-section .dnd-column {
	padding: 0;
}

.dnd-section .dnd-column > .dnd-row:not(:last-child) {
	margin-bottom: var(--so-block-gap);
}

.blog-post-body p:has(strong):has(+ h2, + h3) {
	margin-bottom: 0!important;
	color: var(--so-color-primary);
}
.blog-post-body P:has(strong) + :is(h2, h3) {
	margin-top: 0!important;
}


/* Icons
De flow is als volgt:
Zoek icoon op https://icones.js.org/ en kopieer in het zwart (Snippets -> SVG (vinkje 'copy with color' aan))
Gebruik https://svgcrop.com/ om de svg te croppen en de viewbox te optimaliseren
Gebruik https://jakearchibald.github.io/svgomg/ om de svg code te optimaliseren
Gebruik https://yoksel.github.io/url-encoder/ om de svg te encoden en in de css te plakken
-------------------------------------------------------------- */
[class^="icon-"], [class*=" icon-"] {
	display: inline-block;
	background-repeat: no-repeat;
	background-position: center;
}
.icon-arrow-right {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 7 10'%3E%3Cpath fill='%23000' d='M3.833 5 0 1.167 1.167 0l5 5-5 5L0 8.833z'/%3E%3C/svg%3E");
}
.icon-arrow-left {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='4 6 16 12'%3E%3Cpath d='m10 18-6-6 6-6 1.4 1.45L7.85 11H20v2H7.85l3.55 3.55z'/%3E%3C/svg%3E");
}
.icon-email {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3E%3Cpath fill='%23000' d='M18.335 4.999c0-.917-.75-1.667-1.667-1.667H3.335c-.917 0-1.667.75-1.667 1.667v10c0 .916.75 1.666 1.667 1.666h13.333c.917 0 1.667-.75 1.667-1.666zm-1.667 0-6.667 4.166L3.335 5zm0 10H3.335V6.665L10 10.832l6.667-4.167z'/%3E%3C/svg%3E");
}
.icon-linkedin {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 15.11'%3E%3Cpath fill='%23000' d='M3.358 1.68A1.679 1.679 0 1 1 0 1.678a1.679 1.679 0 0 1 3.358.002m.05 2.921H.05v10.51h3.358zm5.306 0H5.373v10.51H8.68V9.596c0-3.073 4.004-3.358 4.004 0v5.515H16V8.454c0-5.18-5.927-4.986-7.32-2.443z'/%3E%3C/svg%3E");
}

/* Form
-------------------------------------------------------------- */
form {
	:is(h1, h2, h3, h4, h5, h6) {
		font-family: var(--so-font-family-heading) !important;
		color: var(--so-color-text) !important;
		font-weight: var(--so-fontsize-h-font-weight) !important;
	}

	h1 {
		font-size: var(--so-fontsize-h1);
		margin-bottom: var(--so-fontsize-h1-spacing-bottom);
		line-height: var(--so-fontsize-h1-line-height);
		letter-spacing: var(--so-fontsize-h1-letterspacing);
		font-weight: var(--so-fontsize-h-font-weight);
		margin-top: 0;
	}

	h2 {
		font-size: var(--so-fontsize-h2);
		margin-bottom: var(--so-fontsize-h2-spacing-bottom);
		line-height: var(--so-fontsize-h2-line-height);
		letter-spacing: var(--so-fontsize-h2-letterspacing);
		font-weight: var(--so-fontsize-h-font-weight);
		margin-top: 0;
	}

	h3 {
		font-size: var(--so-fontsize-h3);
		margin-bottom: var(--so-fontsize-h3-spacing-bottom);
		line-height: var(--so-fontsize-h3-line-height);
		letter-spacing: var(--so-fontsize-h3-letterspacing);
		font-weight: var(--so-fontsize-h-font-weight);
		margin-top: 0;
	}

	h4 {
		font-size: var(--so-fontsize-h4);
		margin-bottom: var(--so-fontsize-h4-spacing-bottom);
		line-height: var(--so-fontsize-h4-line-height);
		letter-spacing: var(--so-fontsize-h4-letterspacing);
		font-weight: var(--so-fontsize-h-font-weight);
		margin-top: 0;
	}

	h5 {
		font-size: var(--so-fontsize-h5);
		margin-bottom: var(--so-fontsize-h5-spacing-bottom);
		line-height: var(--so-fontsize-h5-line-height);
		letter-spacing: var(--so-fontsize-h5-letterspacing);
		font-weight: var(--so-fontsize-h-font-weight);
		margin-top: 0;
	}

	h6 {
		font-size: var(--so-fontsize-h6);
		margin-bottom: var(--so-fontsize-h6-spacing-bottom);
		line-height: var(--so-fontsize-h6-line-height);
		letter-spacing: var(--so-fontsize-h6-letterspacing);
		font-weight: var(--so-fontsize-h-font-weight);
		margin-top: 0;
	}

	.hsfc-Step__Content {
		display: flex;
		flex-direction: column;
		padding: 0 !important;
	}

	.hsfc-Row {
		gap: 16px !important;
		margin-bottom: 16px !important;
	}

	/* Progress */
	.hsfc-Step__Content {
		.hsfc-Row:has(> .hsfc-ProgressBar) {
			order: -1;

			.hsfc-ProgressBar__Text {
				margin: 0;
				text-transform: uppercase;
				font-size: 12px;
				color: var(--so-color-text);

				&:before {
					content: var(--form-steps-label);
				}
			}

			.hsfc-ProgressBar__Progress {
				display: none;
			}
		}

		.hsfc-NavigationRow__Buttons {
			display: flex;
			justify-content: flex-end;
			gap: 8px;

			button {
				padding: 0 24px;
				background: var(--so-color-text1-on-bg-1);
				font-family: var(--so-font-family-heading);
				font-size: 16px;
				font-weight: var(--so-fontsize-h-font-weight);
				transform: translateY(0) !important;
				display: flex;
				align-self: center;
				gap: 8px;

				&:after {
					content: '';
					aspect-ratio: 1/1;
					flex: 0 0 20px;
					background-image: url("data:image/svg+xml,%3Csvg width='8' height='12' viewBox='0 0 8 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.6 6L0 1.4L1.4 0L7.4 6L1.4 12L0 10.6L4.6 6Z' fill='black'/%3E%3C/svg%3E%0A");
					background-size: 8px;
					background-repeat: no-repeat;
					background-position: center;
					filter: var(--so-filter-white);
				}

				&:hover {
					background: var(--so-color-primary);
				}
			}

			button[type="button"]:has(+ button[type="button"]),
			button[type="button"]:has(+ button[type="submit"]) {
				background: var(--so-color-primary-light);
				color: var(--so-color-text1-on-bg-1);

				&:after {
					display: none;
				}

				&:hover {
					background: var(--so-color-grey-80);
				}

				&:before {
					content: '';
					aspect-ratio: 1/1;
					flex: 0 0 20px;
					background-image: url("data:image/svg+xml,%3Csvg width='8' height='12' viewBox='0 0 8 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.6 6L0 1.4L1.4 0L7.4 6L1.4 12L0 10.6L4.6 6Z' fill='black'/%3E%3C/svg%3E%0A");
					background-size: 8px;
					background-repeat: no-repeat;
					background-position: center;
					filter: var(--so-filter-text1-on-bg-1);
					transform: rotate(180deg);
				}
			}

			button[type="submit"] {
				background: var(--so-color-secondary);

				&:hover {
					background: var(--so-color-primary);
				}
			}

			@media screen and (max-width: 430px) {
				flex-direction: row;

				button {
					flex: unset;
					width: auto;
				}
			}
		}
	}

	/* Inputs */

	.hsfc-PhoneInput, 
	input[type="text"],
	input[type="password"],
	input[type="tel"],
	input[type="email"],
	input[type="checkbox"] {
		height: 56px;
	}

	.hsfc-PhoneInput__FlagAndCaret {
		background-color: var(--so-color-white) !important;
		border-color: var(--so-color-grey-80) !important;
		border-top-right-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
		border-top-left-radius: 8px !important;
		border-bottom-left-radius: 8px !important;
		
		.hsfc-PhoneInput__FlagAndCaret__Flag {
			font-family: var(--so-font-family) !important;
		}
	}

	.hsfc-PhoneInput:has(.hsfc-PhoneInput__FlagAndCaret) {
		input[type="tel"] {
			border-top-left-radius: 0 !important;
			border-bottom-left-radius: 0 !important;
			border-left: none !important;
		}
	}

	input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="tel"],
	input[type="search"],
	input[type="checkbox"],
	textarea {
		background-color: var(--so-color-white) !important;
		border: 1px solid var(--so-color-grey-80) !important;
		border-radius: 8px !important;
		font-size: 14px !important;
		line-height: 1 !important;
		color: var(--so-color-text) !important;
		font-family: var(--so-font-family) !important;
		padding-left: 16px !important;
		padding-right: 16px !important;
		transition: var(--so-transition) !important;
		margin-bottom: 0 !important;

		&::placeholder {
			color: var(--so-color-grey-50) !important;
			font-family: var(--so-font-family) !important;
			font-size: 14px !important;
		}

		&:hover {
			border-color: var(--so-color-primary-dark) !important;
		}

		&:focus {
			box-shadow: none !important;
			border-color: var(--so-color-primary-dark) !important;
		}
	}

	textarea {
		min-height: 120px;
		line-height: 1.5 !important;
		padding-top: 16px !important;
		padding-bottom: 16px !important;
		transition: border .1s ease-in-out !important;

		&::placeholder {
			line-height: 1.5 !important;
		}
	}

	.hsfc-FieldLabel {
		margin-bottom: 8px !important;
		display: flex;
		gap: 8px;
	}

	label span {
		font-size: 12px;
		line-height: 1;
		color: var(--so-color-text);
		font-family: var(--so-font-family);
		font-weight: 500;
	}

	.hsfc-ErrorAlert {
		font-size: 12px !important;
		line-height: 1 !important;
		color: var(--so-color-error) !important;
		font-family: var(--so-font-family) !important;
		margin-top: 8px !important;
	}

	/* Select */
	select {
		appearance: none;
		-webkit-appearance: none;
		-moz-appearance: none;

		&::-ms-expand {
			display: none;
		}

		background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 4.6L10.6 -6.11959e-08L12 1.4L6 7.4L-6.11959e-08 1.4L1.4 -4.63341e-07L6 4.6Z' fill='%23142129'/%3E%3C/svg%3E%0A");
		background-size: 10px;
		background-repeat: no-repeat;
		background-position: right 22px center;
		padding-right: 32px;
		padding-left: 16px;
	}

	/* Radio input */
	.hsfc-RadioFieldGroup {
		> label {
			font-family: var(--so-font-family-heading) !important;
			font-weight: var(--so-fontsize-h-font-weight) !important;
			line-height: var(--so-fontsize-h4-line-height) !important;
			letter-spacing: var(--so-fontsize-h4-letterspacing) !important;
			color: var(--so-color-text) !important;
			margin-bottom: 24px !important;

			span {
				font-size: var(--so-fontsize-h4) !important;
			}
		}

		.hsfc-RadioFieldGroup__Options {
			display: flex;
			flex-direction: column;

			label {
				padding: 28px 24px;
				box-sizing: border-box;
				border-radius: 8px;
				border: 1px solid var(--so-color-grey-80);
				background-color: var(--so-color-white);
				display: flex;
				align-items: center;
				gap: 16px;
				transition: var(--so-transition);
				font-family: var(--so-font-family);
				line-height: 1;
				color: var(--so-color-text);

				span {
					font-size: var(--so-fontsize-body) !important;
				}

				&:before {
					content: '';
					width: 16px;
					flex: 0 0 16px;
					aspect-ratio: 1/1;
					border-radius: 50%;
					transition: var(--so-transition);
					border: 1px solid var(--so-color-grey-80);
				}

				input[type="radio"] {
					appearance: none;
					-webkit-appearance: none;
					-moz-appearance: none;
					display: none;
				}

				&:has(input[type="radio"]:checked) {
					border-color: var(--so-color-primary);

					&:before {
						background: var(--so-color-white);
						border-color: var(--so-color-primary);
						box-shadow: inset 0 0 0 4px var(--so-color-primary);
					}
				}

				&:not(:has(input[type="radio"]:checked)) {
					cursor: pointer;

					&:focus {
						border-color: var(--so-color-primary-dark);
					}
				
					&:hover {
						border-color: var(--so-color-primary-dark);
					}
				}
			}
		}
	}

	.hsfc-DataPrivacyField,
	.hsfc-RichText {
		font-size: 12px;
		line-height: 15px;
		color: var(--so-color-text);
	}
}

.hsfc-NavigationRow {
	margin-top: 0 !important;

	.hsfc-NavigationRow__Alerts:empty {
		display: none;
	}
}

.hsfc-Heading {
	margin-bottom: 16px !important;
}

.hsfc-Row:last-child {
	margin-bottom: 0 !important;
}

.hs_cos_wrapper.form-title:is(:empty) {
	display: none;
}



/* List
-------------------------------------------------------------- */
.hs_cos_wrapper_type_rich_text ul {
	padding-left: 4px;
	display: flex;
	flex-direction: column;
	gap: 8px;

	li {
		list-style: none;
		padding-left: 20px;
		position: relative;
		font-size: var(--so-fontsize-body);
		line-height: var(--so-fontsize-body-line-height);
		font-weight: 400;

		&::before {
			content: "";
			position: absolute;
			left: 0;
			top: 0.6em;
			width: 6px;
			height: 6px;
			border-radius: 50%;
			background-color: var(--so-color-primary);
		}
	}
}

.hs_cos_wrapper_type_rich_text ol {
	padding-left: 20px;

	li {
		list-style: inherit;
		padding-left: 0;
		font-weight: 400;

		&::before {
			display: none;
		}

		&::marker {
			color: var(--so-color-primary);
			font-weight: 600;
		}
	}
}


/* Website header
-------------------------------------------------------------- */






.blog-post,
.blog-header__inner,
.blog-related-posts {
	padding: px 0;
}

/* Blog post */

.blog-post__meta a {
	color: ;
}

.blog-post__tag-link {
	color: ;
}

.blog-post__tag-link:hover,
.blog-post__tag-link:focus {
	color: ;
}

.blog-post__tag-link:active {
	color: ;
}

/* Blog related posts */

.blog-related-posts__title-link,
.blog-related-posts__title-link:hover,
.blog-related-posts__title-link:focus,
.blog-related-posts__title-link:active {
	;
	text-transform: ;
}

.blog-related-posts__title-link {
	color: ;
}

.blog-related-posts__title-link:hover,
.blog-related-posts__title-link:focus {
	color: ;
}

.blog-related-posts__title-link:active {
	color: ;
}

/* Blog comments */

.blog-comments {
	margin-bottom: px;
}

#comments-listing .comment-reply-to {
	color: ;
}

#comments-listing .comment-reply-to:hover,
#comments-listing .comment-reply-to:focus {
	color: ;
}

#comments-listing .comment-reply-to:active {
	color: ;
}





.hs-search-results__title {
	;
	color: ;
}





/* Blog listing */

.hs-blog-post-listing__post-title-link,
.hs-blog-post-listing__post-title-link:hover,
.hs-blog-post-listing__post-title-link:focus,
.hs-blog-post-listing__post-title-link:active {
	;
	text-transform: ;
}

.hs-blog-post-listing__post-title-link {
	color: ;
}

.hs-blog-post-listing__post-title-link:hover,
.hs-blog-post-listing__post-title-link:focus {
	color: ;
}

.hs-blog-post-listing__post-title-link:active {
	color: ;
}


.hs-blog-post-listing__post-tag,
.hs-blog-post-listing__post-author-name {
	color: ;
}

/* Blog pagination */

.hs-pagination__link-text,
.hs-pagination__link--number {
	color: ;
}

.hs-pagination__link:hover .hs-pagination__link-text,
.hs-pagination__link:focus .hs-pagination__link-text,
.hs-pagination__link--number:hover,
.hs-pagination__link--number:focus {
	color: ;
}

.hs-pagination__link:active .hs-pagination__link-text,
.hs-pagination__link--number:active {
	color: ;
}

.hs-pagination__link-icon svg {
	fill: ;
}

/* Pricing card */

.card__price {
	;
	color: ;
	font-size: ;
}

.card__body svg {
	fill: ;
}

/* Social follow */

.social-links__icon {
	background-color: ;
}

.social-links__icon:hover,
.social-links__icon:focus {
	background-color: ;
}

.social-links__icon:active {
	background-color: ;
	;
	color: ;
	font-size: ;
}



/* Card styling
-------------------------------------------------------------- */
.card {
	position: relative;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	gap: 16px;

	@media (width <= 576px) {
		gap: 12px;
	}

	&, * {
		transition: var(--so-transition-speed) ease all;
		margin: 0;
	}

	a {
		text-decoration: none;
	}

	.card-link:before {
		content: '';
		position: absolute;
		inset: 0;
		z-index: 1;
	}

	.card-tag-link {
		position: relative;
		z-index: 2;
	}

	figure {
		display: flex;
		overflow: hidden;
		border-radius: var(--so-border-radius);
		margin: 0;

		img {
			width: 100%;
			aspect-ratio: 3/2;
			object-fit: cover;
			transform: scale(1);
		}
	}

	ul {
		padding: 0;
		margin: 0;
		list-style: none;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 6px 12px;
	}

	&:hover img {
		transform: scale(1.1);
	}

	@media (max-width: 576px) {
		header {

			.h4 {
				font-size: 18px;
			}
		}
	}
}



/* Blog posts row
-------------------------------------------------------------- */
.blog-posts {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px var(--so-block-gap, 32px);
	max-width: var(--so-container-size);
	margin: 32px auto;

	@media (width <= 880px) {
		grid-template-columns: repeat(2, 1fr);
		gap: 24px;
	}

	@media (width <= 576px) {
		grid-template-columns: repeat(1, 1fr);
		gap: 48px;
	}
}

.template-blog-index .blog-posts {
	margin:64px auto;
}

/* Buttons
-------------------------------------------------------------- */
.buttons-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;

	&:has(> a.button ~ :is(a.button, .button-wrapper)),
	&:has(> .button-wrapper ~ :is(a.button, .button-wrapper)) {
		.button.link {
			height: 56px;
			padding-left: 24px;
			padding-right: 24px;
			color: inherit;

			&.has-arrow {
				padding-right: 12px;
			}
		}
	}

	&.alignment-left {
		justify-content: flex-start;
	}

	&.alignment-center {
		justify-content: center;
	}
	&.alignment-right {
		justify-content: flex-end;
	}

	@media screen and (max-width: 767px) {
		&.alignment-center, &.alignment-right {
			justify-content: flex-start;
		}
	}

	@media screen and (max-width: 576px) {
		&:not(:has(> .button.link:only-child)) > * {
			flex: 0 0 100%;
		}

		.button {
			justify-content: center;

			&.expert {
				position: relative;
				padding-left: 64px;
				padding-right: 64px;

				> figure {
					position: absolute;
					left: 4px;
					top: 4px;
					width: 48px;
				}

				@media screen and (max-width: 340px) {
					padding-right: 16px;
				}
			}
		}
	}
}

.button-wrapper {
	display: flex;
	flex-direction: column;

	.expert-quote {
		font-size: 12px;
		color: var(--so-color-text);
		line-height: 1;
		padding: 8px 4px 4px 4px;
		border-bottom-left-radius: 4px;
		border-bottom-right-radius: 4px;
		margin-top: -4px;
		font-family: var(--so-font-family);
		backdrop-filter: blur(25px);
		background: rgba(235, 241, 245, .24);
		font-weight: 400;

		@media screen and (max-width: 576px) {
			text-align: center;
		}

		:is(strong, b) {
			font-weight: 700;
		}
	}
}

.buttons-wrapper:has( + *) {
	margin-bottom: 24px;
}

button,
a.button {
	border-radius: 4px;
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	max-width: 100%;
	overflow: hidden;
	text-align: left;
	text-overflow: ellipsis;
	background: var(--so-color-text1-on-bg-1);
	color: var(--so-color-white);
	border: none;
	text-decoration: none !important;
	min-height: 56px;
	height: fit-content !important;
	padding: 8px 24px;
	box-sizing: border-box;
	gap: 8px;
	font-family: var(--so-font-family-heading);
	position: relative;
	transition: var(--so-transition);
	font-size: 16px;
	outline: 2px solid transparent;
	line-height: 1;
	font-weight: 500;
	overflow: visible;

	@media (pointer: fine) {
		&:hover {
			background: var(--so-color-primary);
		}
	}
		
	&:focus {
		outline: 2px solid var(--so-color-primary-dark);
	}

	&.has-arrow {
		padding-right: 12px;

		&:after {
			content: '';
			aspect-ratio: 1/1;
			margin-left: 4px;
			flex: 0 0 20px;
			background-image: url("data:image/svg+xml,%3Csvg width='8' height='12' viewBox='0 0 8 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.6 6L0 1.4L1.4 0L7.4 6L1.4 12L0 10.6L4.6 6Z' fill='black'/%3E%3C/svg%3E%0A");
			background-size: 8px;
			background-repeat: no-repeat;
			background-position: center;
			filter: var(--so-filter-white);
		}
	}

	&.green,
	&.expert {
		background: var(--so-color-secondary);

		@media (pointer: fine) {
			&:hover {
				background: var(--so-color-primary);
			}
		}
	}

	&.fade {
		backdrop-filter: blur(25px);
		background: rgba(235, 241, 245, .24);
		border: 1px solid rgba(255, 255, 255, .3);
		color: var(--so-color-white);

		@media (pointer: fine) {
			&:hover {
				background: var(--so-color-white);
				color: var(--so-color-text1-on-bg-1);

				&:after {
					filter: var(--so-filter-text1-on-bg-1);
				}
			}
		}
	}

	&.expert {
		position: relative;
		z-index: 1;

		&:has(> figure) {
			padding-left: 4px;
		}

		figure {
			flex: 0 0 48px;
			aspect-ratio: 1/1;
			border-radius: 2px;
			overflow: hidden;
			margin: 0 !important;

			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: center;
			}
		}
	}

	&.blue {
		background: var(--so-color-primary);
		color: var(--so-color-white);

		@media (pointer: fine) {
			&:hover {
				background: var(--so-color-primary-light);
				color: var(--so-color-text1-on-bg-1);

				&:after {
					filter: var(--so-filter-text1-on-bg-1);
				}
			}
		}
	}

	&.grey {
		background: var(--so-color-primary-light);
		color: var(--so-color-text1-on-bg-1);

		&:after {
			filter: var(--so-filter-text1-on-bg-1);
		}

		@media (pointer: fine) {
			&:hover {
				background: var(--so-color-primary);
				color: var(--so-color-white);

				&:after {
					filter: var(--so-filter-white);
				}
			}
		}
	}

	&.ghost {
		background: transparent;
		border: 1px solid var(--so-color-grey-70);
		color: inherit;

		&:after {
			filter: var(--so-filter-text1-on-bg-1);
		}

		@media (pointer: fine) {
			&:hover {
				border: 1px solid var(--so-color-bg-2);
			}
		}
	}

	&.link {
		height: fit-content;
		padding: 0;
		color: var(--so-color-text1-on-bg-1);
		text-decoration: underline !important;
		background: transparent !important;
		color: inherit;

		&:after {
			filter: var(--so-filter-text1-on-bg-1);
		}

		&:hover {
			text-decoration-color: var(--so-color-primary);
			color: var(--so-color-primary);

			&:after {
				filter: var(--so-filter-primary);
			}
		}
	}
}

.dnd-section[class*="-background-layers"]:not(.so-section) a.button.link,
.dnd-section[class*="-background-image":not(.so-section)] a.button.link {
	color: var(--so-color-white) !important;
	transition: 350ms ease all;
}
.dnd-section[class*="-background-layers"]:not(.so-section) a.button.link:after,
.dnd-section[class*="-background-image"]:not(.so-section) a.button.link:after {
	filter: invert(1);
	transition: 350ms ease all;
}

.dnd-section[class*="-background-layers"]:not(.so-section) a.button.link:hover,
.dnd-section[class*="-background-image"]:not(.so-section) a.button.link:hover {
	filter: opacity(0.7);
}
.dnd-section[class*="-background-layers"]:not(.so-section) a.button.link:hover:after,
.dnd-section[class*="-background-image"]:not(.so-section) a.button.link:hover:after {
	transform: translateX(4px);
}

button.hs-sprocket-button {
	max-width: unset !important;
}

/* Slideout
-------------------------------------------------------------- */
.slideout-wrapper {
	position: fixed;
	inset: 0;
	display: flex;
	z-index: 100;
	justify-content: flex-end;
	pointer-events: none;
	transition: var(--so-transition);
	background-color: transparent;
	
	.slideout {
		padding: 0;
		background: var(--so-color-white);
		height: 100%;
		transform: translateX(100%);
		transition: var(--so-transition);
		display: flex;
		flex-direction: column;
		align-items: flex-end;
		padding: 48px;
		max-width: 764px;
		width: 100%;

		.close-slideout {
			display: flex;
			align-items: center;
			padding: 0;
			font-family: var(--so-font-family);
			font-size: 14px;
			line-height: 1;
			color: var(--so-color-text);
			background-color: transparent;
			border: none;
			cursor: pointer;
			transition: var(--so-transition);
			font-weight: 600;
			gap: 8px;
			outline: none;
			height: fit-content;
	
			.icon-close {
				display: inline-block;
				background-color: var(--so-color-primary-light);
				background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.6667 1.175L10.4917 0L5.83333 4.65833L1.175 0L0 1.175L4.65833 5.83333L0 10.4917L1.175 11.6667L5.83333 7.00833L10.4917 11.6667L11.6667 10.4917L7.00833 5.83333L11.6667 1.175Z' fill='%23142129'/%3E%3C/svg%3E%0A");
				background-size: 12px;
				background-repeat: no-repeat;
				background-position: center;
				height: 40px;
				aspect-ratio: 1/1;
				border-radius: 2px;
				transition: var(--so-transition);
				outline: 2px solid transparent;
			}

			&:focus {
				.icon-close {
					outline: 2px solid var(--so-color-primary-dark);
				}
			}

			&:hover {
				.icon-close {
					background-color: var(--so-color-primary);
					background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.6667 1.175L10.4917 0L5.83333 4.65833L1.175 0L0 1.175L4.65833 5.83333L0 10.4917L1.175 11.6667L5.83333 7.00833L10.4917 11.6667L11.6667 10.4917L7.00833 5.83333L11.6667 1.175Z' fill='white'/%3E%3C/svg%3E%0A");
				}
			}
		}

		.slideout-form {
			width: 100%;
			max-height: calc(100dvh - 80px);
			height: 100%;
			overflow-y: auto;
			flex: 0 0 100%;

			.hsfc-Row:has(> .hsfc-ProgressBar) {
				order: -1;

				.hsfc-ProgressBar__Text {
					margin: 0;
					text-transform: uppercase;
					font-size: 12px;
					color: var(--so-color-text);

					&:before {
						content: var(--form-steps-label);
					}
				}

				.hsfc-ProgressBar__Progress {
					display: none;
				}
			}

			.hsfc-Row {
				margin-bottom: 16px;
				gap: 16px;
			}
		}
	}

	&.active {
		pointer-events: auto;
		background-color: rgba(0, 0, 0, .2);

		.slideout {
			transform: translateX(0);
		}
	}

	@media screen and (max-width: 1298px) {
		.slideout {
			padding: 24px;
		}
	}

	@media screen and (max-width: 764px) {
		.slideout {
			padding: 10px 20px 20px 20px;
			gap: 10px;
		}
	}
}

body:has(.slideout-wrapper.active) {
	overflow: hidden;
}



/* Image */
.hs_cos_wrapper_type_linked_image img {
	border-radius: 12px;
}

.row-depth-1:has(> .row-fluid > .widget-span > .hs_cos_wrapper_widget > .hs_cos_wrapper_widget > img[style*="max-width"]) {
	margin-top: auto;
}

/* Sections */
.so-section.has-bg-primary-dark {
	color: var(--so-color-white);
}
/* =============================================================================
	HEADER — BASIS & LAYOUT
============================================================================= */

.header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 99;
	padding: 10px 0;
	transition: backdrop-filter 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
}

.header .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: clamp(16px, calc(16px + (100vw - 1250px) * 0.271), 80px);
	transition: gap var(--so-transition-speed) ease;
}

.header * {
	transition: color 0.3s ease;
}

.header ul {
	all: unset;
}

.header li {
	list-style: none;
	padding: 0;
	margin: 0;
}

.header .button,
.header button {
	height: 40px !important;
}

.header .button {
	padding: 12px 16px;
	font-size: 14px;
}


/* =============================================================================
	2. HEADER — SCROLLED STAAT
============================================================================= */

.scrolled .header {
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px); /* Safari support */
	background-color: color-mix(in srgb, var(--so-color-white) 70%, transparent);
	box-shadow: 0 2px 20px hsl(0 0% 0% / 0.1);
}

body.scrolled .main-menu {
	box-shadow: none;
	backdrop-filter: none;
	background: none;
}

body.scrolled .main-menu a {
	color: var(--so-color-text);
}

body.scrolled .main-menu a:after {
	filter: unset;
}


/* =============================================================================
	HEADER — NAVIGATIE & NAV-UTILITIES
============================================================================= */

.header-nav {
	display: flex;
	flex: 1;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-width: 0;
}

.header-nav-utilities {
	display: flex;
	align-items: center;
	gap: 8px;
}

.header-nav .main-menu {
	margin-right: auto;
}


/* =============================================================================
	4. HEADER — LOGO
============================================================================= */

.header-logo-link {
	display: inline-block;
	flex-shrink: 0;
	text-decoration: none;
}

.header-logo {
	width: 207px;
	height: 32px;
	display: none;
}

.header-logo-scrolled {
	display: block;
}

/* Dark mode logo logica */
body:has(.so-hero.dark-mode) .header-logo-scrolled {
	display: none;
}

body:has(.so-hero.dark-mode) .header-logo-default {
	display: block;
}

body:has(.so-hero.dark-mode).scrolled .header-logo-default {
	display: none;
}

body:has(.so-hero.dark-mode).scrolled .header-logo-scrolled {
	display: block;
}

body:has(.so-hero.dark-mode):not(.scrolled) .header #hs_cos_wrapper_action_buttons .button {
	background: var(--so-color-primary-light) !important;
	color: var(--so-color-text);
}


/* =============================================================================
	5. HEADER — ZOEKBALK
============================================================================= */

.header .search-wrapper {
	position: relative;
}

.header .search-wrapper .search-bar form label {
	position: absolute;
	visibility: hidden;
}

.header .search-wrapper .search-bar {
	position: absolute;
	white-space: nowrap;
	top: 0;
	right: 48px;
	width: 0;
	height: 100%;
	overflow: hidden;
	transition: width 0.3s ease;
	z-index: 1;
}

.header .search-wrapper.active .search-bar {
	width: 300px;
	overflow: visible;
}

.header .hs-search-field__input {
	padding-top: 11px;
	padding-bottom: 11px;
}

.header .hs-search-field__button {
	background-color: var(--so-color-primary);
	color: white;
	fill: white;
	box-shadow: none;
	padding: 13px;
	transform: translateX(-8px);
}

.header .hs-search-field__button span {
	width: 14.575px;
	height: 14.575px;
}

.header .hs-search-field__button:hover {
	box-shadow: 0 0 0 1px #fff;
}

.scrolled .header .hs-search-field__button:hover {
	background: var(--so-color-primary-dark);
}

body:not(.scrolled) .header .hs-search-field__button {
	fill: var(--so-color-white);
}

.hs-search-field__bar button svg {
	width: 14.575px;
	height: 14.575px !important;
}

#autocomplete-results {
	display: block;
	z-index: 99;
	position: relative;
	border: 1px solid hsl(0 0% 100% / 0.3);
	background: white;
	padding: 12px;
	border-radius: 4px;

	&:has(li.show-for-sr) {
		padding: 0;
		border: none;
	}

	li {
		white-space: wrap;
	}
}


/* =============================================================================
	6. HEADER — ZOEKKNOP (TOGGLE)
============================================================================= */

.header .search-toggle-button {
	width: 56px;
	height: 56px;
	align-items: center;
	justify-content: center;
	z-index: 2;
	border-radius: 4px;
	border: 1px solid hsl(0 0% 100% / 0.3);
	background: color-mix(in srgb, var(--so-color-primary-light) 24%, transparent) !important;
	backdrop-filter: blur(12.5px);
	display: flex;
	padding: 12px;
	transition: all var(--so-transition-speed) ease;
}

.header .search-toggle-button:hover {
	background: color-mix(in srgb, var(--so-color-primary-light) 24%, transparent) !important;
}

body:not(:has(.so-hero.dark-mode)):not(.scrolled) .header .search-toggle-button {
	border-color: #b3b3b3;
}

body.scrolled .header .search-toggle-button {
	background: var(--so-color-primary-light) !important;
	border-color: var(--so-color-primary-light) !important;
	backdrop-filter: unset;
}

/* Zoekknop icoon */
.header .search-toggle-button .search-toggle-button-icon {
	width: 14.575px;
	height: 14.575px;
	background-image: url("data:image/svg+xml,%3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' aria-hidden='true'%3E%3Cg id='search2_layer'%3E%3Cpath d='M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
	background-size: 14.575px 14.575px;
	background-repeat: no-repeat;
	background-position: center;
	filter: invert(0);
}

body:has(.so-hero.dark-mode) .header .search-toggle-button .search-toggle-button-icon {
	filter: invert(1);
}

body:has(.so-hero.dark-mode).scrolled .header .search-toggle-button .search-toggle-button-icon {
	filter: invert(0);
}


/* =============================================================================
	7. HOOFD MENU — BASIS
============================================================================= */

.main-menu {
	border-radius: 62px;
	background: rgba(26, 30, 33, 0.3);
	box-shadow: 0 21px 60px 0 rgba(2, 2, 2, 0.08);
	backdrop-filter: blur(10px);
}

.main-menu ul {
	display: flex;
	gap: 18px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.main-menu li {
	position: relative;
}

.main-menu a {
	color: #fff;
	font-size: 14px;
	line-height: 14px;
	padding: 16px;
	text-decoration: none;
	white-space: nowrap;
	transition: background 0.2s;
	display: block;
	border-radius: 62px;
}

.main-menu a.disabled-link {
	pointer-events: none;
	cursor: pointer;
}

.header .main-menu a {
	font-family: var(--so-font-family-heading);
	font-weight: 600;
	letter-spacing: -0.031em;
	padding-left: 16px;
	padding-right: 16px;
}

.main-menu li:hover > a,
.main-menu li:focus-within > a {
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(10px);
}

.main-menu a:focus-visible {
	outline: 2px solid var(--so-color-primary);
	outline-offset: 2px;
}


/* =============================================================================
	8. HOOFD MENU — SUBMENU
============================================================================= */

.main-menu .submenu {
	display: none;
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	background: #fff;
	border-radius: 12px;
	min-width: 302px;
	gap: 0;
	padding: 8px;
	flex-direction: column;
	z-index: 10;

	@media (min-width: 991px) {
		max-height: calc(100svh - 100px);
		overflow-y: auto;
	}
}

@media (hover: hover) and (pointer: fine) {
	.main-menu li:hover > .submenu {
		display: flex;
	}
}

.main-menu li:focus-within > .submenu {
	display: flex;
}

.main-menu .submenu a {
	width: 100%;
	background: #fff;
	transition: background 0.2s;
	border-radius: 12px;
	padding: 24px;
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--so-color-text);
	font-family: var(--so-font-family-heading);
	font-weight: 600;
	font-size: 18px;
}

.main-menu .submenu img {
	width: 40px;
	object-fit: contain;
	object-position: center;
	height: 32px;
}

.main-menu .submenu li:not(:last-child) {
	border-bottom: 1px solid var(--so-color-primary-light);
}

.main-menu .submenu a:after {
	content: '';
	display: block;
	margin-left: auto;
	width: 12px;
	height: 12px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 7.4 12'%3E%3Cpath fill='%23142129' d='M4.6 6 0 1.4 1.4 0l6 6-6 6L0 10.6z'%3E%3C/path%3E%3C/svg%3E");
	background-size: auto 12px;
	background-repeat: no-repeat;
	background-position: center;
	margin-right: 8px;
	transition: margin-right 0.2s;
}

.main-menu .submenu a:hover:after,
.main-menu .submenu a:focus:after {
	margin-right: 0px;
}

.main-menu .submenu li:has(+ li a:hover),
.main-menu .submenu li:has(a:hover) {
	border-bottom: 1px solid transparent;
}

.main-menu .submenu a:hover,
.main-menu .submenu a:focus {
	background: var(--so-color-primary-light);
	border-radius: 12px;
}

/* Submenu pijl op parent link */
.main-menu .has-submenu > a:after {
	content: '';
	display: inline-block;
	vertical-align: middle;
	width: 12px;
	height: 12px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 7.4 12'%3E%3Cpath fill='%23142129' d='M4.6 6 0 1.4 1.4 0l6 6-6 6L0 10.6z'%3E%3C/path%3E%3C/svg%3E");
	background-size: auto 12px;
	background-repeat: no-repeat;
	background-position: center;
	margin-left: 8px;
	transform: rotate(90deg);
	filter: invert(1);
}


/* =============================================================================
	9. ACTIEBUTTONS
============================================================================= */

.action-buttons .button-wrapper {
	margin: 0;
}

#hs_cos_wrapper_action_buttons .button.black {
	background: var(--so-color-bg2-Container-4);
}

#hs_cos_wrapper_action_buttons .button.black:hover {
	background: var(--so-color-bg2-Container-1);
}

/* =============================================================================
	10. TAALWISSELAAR
============================================================================= */

.header .hs-language-switcher__button {
	background: none;
	color: black;
}

.header .hs-language-switcher__button:hover {
	background-color: transparent;
}

.header nav.hs-language-switcher {
	z-index: 1;
}

.header ul.hs-language-switcher__menu {
	display: block;
	position: absolute;
	top: 100%;
	left: 0;
	height: 0;
	max-height: 0;
	overflow: scroll;
	transition: height 0.3s ease;
}

.header nav.hs-language-switcher:hover ul.hs-language-switcher__menu,
.header nav.hs-language-switcher:focus-within ul.hs-language-switcher__menu {
	height: auto;
	max-height: 300px;
}

#hs_cos_wrapper_language-switcher .hs-language-switcher__menu {
	background: var(--so-color-white);
	border-radius: 4px;
	padding-left: 16px;
	padding-right: 16px;
	border: none !important;
	left: 50% !important;
	transform: translateX(-50%);
	background: #fff;
	border-radius: 12px;
	min-width: 302px;
	gap: 0;
	padding: 0 8px;
	flex-direction: column;
	z-index: 10;
}

#hs_cos_wrapper_language-switcher nav.hs-language-switcher:hover .hs-language-switcher__menu {
	padding: 8px;
}

#hs_cos_wrapper_language-switcher .hs-language-switcher__menu a {
	outline: none;
	text-decoration: none;
}

.hs-language-switcher__current-language {
	color: var(--so-color-text);
	font-family: var(--so-font-family-heading);
	font-weight: 600;
	letter-spacing: -.031em;
	font-size: 14px;
	line-height: 14px;
}

/* Taalwisselaar items (gedeeld met submenu) */
.header .hs-language-switcher__item a {
	width: 100%;
	background: #fff;
	transition: background 0.2s;
	border-radius: 12px;
	padding: 24px;
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--so-color-text);
	font-family: var(--so-font-family-heading);
	font-weight: 600;
	font-size: 18px;
}

.header .hs-language-switcher__item:not(:last-child) {
	border-bottom: 1px solid var(--so-color-primary-light);
}

.header .hs-language-switcher__item a:after {
	content: '';
	display: block;
	margin-left: auto;
	width: 12px;
	height: 12px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 7.4 12'%3E%3Cpath fill='%23142129' d='M4.6 6 0 1.4 1.4 0l6 6-6 6L0 10.6z'%3E%3C/path%3E%3C/svg%3E");
	background-size: auto 12px;
	background-repeat: no-repeat;
	background-position: center;
	margin-right: 8px;
	transition: margin-right 0.2s;
}

.header .hs-language-switcher__item a:hover:after,
.header .hs-language-switcher__item a:focus:after {
	margin-right: 0px;
}

.header .hs-language-switcher__item:has(+ li a:hover) a:hover,
.header .hs-language-switcher__item:has(a:hover) {
	border-bottom: 1px solid transparent;
}

.header .hs-language-switcher__item a:hover,
.header .hs-language-switcher__item a:focus {
	background: var(--so-color-primary-light);
	border-radius: 12px;
}

/* Dark mode taalwisselaar */
body:has(.so-hero.dark-mode) .hs-language-switcher__current-language {
	color: var(--so-color-white);
}

body:has(.so-hero.dark-mode).scrolled .hs-language-switcher__current-language {
	color: var(--so-color-text);
}


/* =============================================================================
	11. MOBIEL MENU — KNOP
============================================================================= */

.mobile-menu-backdrop {
	display: none;
}

.mobile-menu-button {
	position: relative;
	z-index: 101;
	display: flex;
	width: 40px;
	min-width: 40px;
	min-height: 40px;
	cursor: pointer;
	padding: 10px;
	margin: 0;
	border: 1px solid hsl(0 0% 100% / 0.3);
	border-radius: 4px;
	background: color-mix(in srgb, var(--so-color-primary-light) 24%, transparent);
	backdrop-filter: blur(12.5px);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M2.5 15H17.5V13.3333H2.5V15ZM2.5 10.8333H17.5V9.16667H2.5V10.8333ZM2.5 5V6.66667H17.5V5H2.5Z' fill='white'/%3E%3C/svg%3E");
	background-position: center;
	background-repeat: no-repeat;
}

body:not(:has(.so-hero.dark-mode)) .mobile-menu-button {
	background-color: var(--so-color-primary-light);
	border-color: var(--so-color-bg2-Container-3);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3E%3Cpath fill='%23000' d='M2.5 15h15v-1.667h-15zm0-4.167h15V9.167h-15zM2.5 5v1.667h15V5z'/%3E%3C/svg%3E");
}

.mobile-menu-button.active,
body.scrolled .mobile-menu-button.active {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3C!-- Icon from Material Symbols by Google - https://github.com/google/material-design-icons/blob/master/LICENSE --%3E%3Cpath fill='%23ffffff' d='M6.4 19L5 17.6l5.6-5.6L5 6.4L6.4 5l5.6 5.6L17.6 5L19 6.4L13.4 12l5.6 5.6l-1.4 1.4l-5.6-5.6z'/%3E%3C/svg%3E") !important;
}

.mobile-menu-button:focus-visible {
	outline: 2px solid var(--so-color-primary);
	outline-offset: 2px;
}


/* =============================================================================
	12. DESKTOP — MEDIA QUERY (min-width: 991px)
============================================================================= */

@media (min-width: 991px) {
	.mobile-menu-button,
	.mobile-menu-backdrop {
		display: none;
	}

	.header-nav-scroll,
	.header-nav-footer {
		display: contents;
	}

	.header-nav .main-menu {
		margin-right: auto;
	}
}


/* =============================================================================
	13. MOBIEL — MEDIA QUERY (max-width: 990px)
============================================================================= */

@media (max-width: 990px) {

	.hs-tools-menu {
		display: none;
	}

	/* --- Variabelen & body --- */
	:root {
		--header-mobile-height: 67px;
	}


	body.mobile-menu-open {
		overflow: hidden;
	}

	/* --- Header container --- */
	.header .container {
		position: relative;
		z-index: 100;
		gap: 16px;
	}

	/* --- Logo --- */
	.header-logo-link {
		position: relative;
		z-index: 1;
	}

	body.mobile-menu-open .header-logo-link {
		z-index: 99;
	}

	body:has(.so-hero.dark-mode).scrolled.mobile-menu-open .header-logo-default,
	body.mobile-menu-open .header-logo.header-logo-default {
		display: block;
	}

	body:has(.so-hero.dark-mode).scrolled.mobile-menu-open .header-logo-scrolled,
	body.mobile-menu-open .header-logo.header-logo-scrolled {
		display: none;
	}

	/* --- Navigatie overlay --- */
	.header-nav {
		position: fixed;
		inset: 0;
		z-index: 98;
		flex: none;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		gap: 0;
		width: 100%;
		height: 100dvh;
		max-height: 100dvh;
		padding: 0;
		background-color: var(--so-color-bg-2);
		color: var(--so-color-text1-on-bg-2);
		overflow: hidden;
		visibility: hidden;
		transform: translateX(100%);
		transition: transform var(--so-transition-speed) ease, visibility var(--so-transition-speed) ease;
	}

	body.mobile-menu-open .header-nav {
		visibility: visible;
		transform: translateX(0);
	}

	.header-nav-scroll {
		flex: 1;
		min-height: 0;
		overflow-x: hidden;
		overflow-y: auto;
		padding: calc(var(--header-mobile-height) + 24px) 20px 24px;
		-webkit-overflow-scrolling: touch;
		position: relative;
	}
	.header-nav-scroll:before {
		content: '';
		display: block;
		width: 100%;
		height: var(--header-mobile-height);
		background-color: var(--so-color-bg-2);
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1;
	}

	.header-nav-footer {
		flex-shrink: 0;
		display: flex;
		flex-direction: column;
		gap: 16px;
		padding: 16px 20px 32px;
		border-top: 1px solid var(--so-color-bg2-Container-2);
	}

	.header-nav-utilities {
		gap: 16px;
		align-items: flex-end;
	}

	/* --- Hoofd menu (mobiel) --- */
	.header-nav .main-menu {
		border-radius: 0;
		background: none;
		box-shadow: none;
		backdrop-filter: none;
		position: relative;
	}

	.header-nav .main-menu ul {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.header-nav .main-menu a {
		font-size: 18px;
		padding: 16px 0;
		border-bottom: 1px solid var(--so-color-bg2-Container-2);
		border-radius: 0;
	}

	.header-nav .main-menu li:hover a,
	.header-nav .main-menu li:focus-within > a {
		background: none;
		backdrop-filter: none;
	}

	.header-nav .main-menu .has-submenu > a:after {
		filter: invert(1);
		float: right;
		margin-top: 4px;
		margin-right: 10px;
	}

	/* --- Submenu (mobiel) --- */
	/* Only .active opens submenus — no :hover/:focus-within (causes double-tap on touch) */
	.main-menu li:hover > .submenu,
	.main-menu li:focus-within > .submenu {
		display: none;
	}

	.main-menu li > .submenu {
		pointer-events: none;
	}

	.main-menu li.active > .submenu {
		display: flex;
		pointer-events: auto;
	}

	.header-nav .main-menu .submenu {
		display: none;
		position: relative;
		width: 100%;
		left: 0;
		transform: none;
		min-width: 0;
		padding: 0;
		background-color: transparent;
		z-index: 0;
	}

	.header-nav .main-menu li.has-submenu.active > .submenu {
		display: flex;
	}

	.header-nav .main-menu .submenu a {
		padding: 16px 0 16px 16px;
		font-size: 16px;
		line-height: 1.2;
		color: var(--so-color-text1-on-bg-2);
		background: transparent;
		border-radius: 0;
		border-bottom: 1px solid var(--so-color-bg2-Container-2);
	}

	.header-nav .main-menu .submenu a:after {
		display: none;
	}

	.header-nav .main-menu .submenu a:hover,
	.header-nav .main-menu .submenu a:focus {
		background: var(--so-color-bg2-Container-1);
		border-radius: 0;
	}

	.header-nav .main-menu .submenu li:not(:last-child) {
		border-bottom: 0px solid;
	}

	/* --- Submenu terug-knop & titel --- */
	.header-nav .main-menu .menu-back button {
		display: flex;
		align-items: center;
		gap: 8px;
		width: 100%;
		padding: 16px 0;
	}

	.header-nav .main-menu .menu-back button:before {
		content: '';
		display: inline-block;
		width: 12px;
		height: 12px;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 7.4 12'%3E%3Cpath fill='%23FFFFFF' d='M2.8 6 7.4 1.4 6 0l-6 6 6 6 1.4-1.4z'%3E%3C/path%3E%3C/svg%3E");
		background-size: auto 12px;
		background-repeat: no-repeat;
		background-position: center;
	}

	.header-nav .main-menu .menu-title {
		padding: 8px 0 16px;
		font-size: 14px;
	}

	/* --- Mobiel menu knop (staten) --- */
	body.scrolled .mobile-menu-button {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M2.5 15H17.5V13.3333H2.5V15ZM2.5 10.8333H17.5V9.16667H2.5V10.8333ZM2.5 5V6.66667H17.5V5H2.5Z' fill='black'/%3E%3C/svg%3E");
	}

	body.mobile-menu-open .mobile-menu-button {
		border-color: var(--so-color-bg2-Container-3) !important;
		background-color: var(--so-color-bg2-Container-1) !important;
	}

	.scrolled .mobile-menu-button {
		border-color: var(--so-color-bg2-Container-3);
		background-color: var(--so-color-primary-light);
	}

	.header-nav .hs-search-field__form,
	.header-nav .hs-search-field__bar {
		width: 100%;
	}

	.header-nav .hs-search-field__form input,
	.header-nav .hs-search-field__label {
		display: block;
	}

	.header-nav .hs-search-field__label {
		display: none;
	}

	body:has(.so-hero.dark-mode) .header .search-toggle-button .search-toggle-button-icon,
	body.scrolled .header .search-toggle-button .search-toggle-button-icon {
		filter: invert(0);
	}

	.header .search-toggle-button, .header .search-toggle-button:hover, .header .search-toggle-button:focus-visible,
	body.scrolled .header .search-toggle-button {
		background: var(--so-color-primary-light) !important;
		border-color: var(--so-color-primary-light) !important;
	}


	/* --- Taalwisselaar (mobiel) --- */
	#hs_cos_wrapper_language-switcher .hs-language-switcher__icon {
		display: none !important;
	}
	#hs_cos_wrapper_language-switcher .hs-language-switcher__current-language {
		color: var(--so-color-text);
		display: block !important;
		padding-left: 0;
	}

	#hs_cos_wrapper_language-switcher nav.hs-language-switcher:hover .hs-language-switcher__menu {
		left: 0 !important;
		transform: none;
		overflow-y: scroll;
	}

	.hs-language-switcher__inner-wrapper {
		display: flex !important;
		flex-direction: column-reverse;
		gap: 12px;
		align-items: flex-start;
	}

	.header-nav .language-switcher {
		width: 100%;
	}	

	.header-nav .hs-language-switcher__button {
		width: fit-content;
		justify-content: space-between;
		padding: 12px 16px;
		border-radius: 4px;
	}

	.header-nav .hs-language-switcher__current-language {
		color: var(--so-color-text1-on-bg-2);
	}

	.header-nav nav.hs-language-switcher {
		width: 100%;
	}

	.header-nav ul.hs-language-switcher__menu {
		display: none;
		visibility: hidden;
		position: static;
		width: 100%;
		height: auto;
		max-height: none;
		margin-top: 0;
		padding: 0;
		border: 0;
		overflow: hidden;
		background-color: transparent;
		transition: none;
	}

	.header-nav .hs-language-switcher__item {
		display: none;
	}

	.header-nav .language-switcher.is-open ul.hs-language-switcher__menu,
	.header-nav nav.hs-language-switcher.is-open ul.hs-language-switcher__menu {
		display: block;
		visibility: visible;
		margin-top: 8px;
		padding: 8px 16px;
		border-radius: 4px;
		background-color: var(--so-color-bg2-Container-1);
	}

	.header-nav .language-switcher.is-open .hs-language-switcher__item,
	.header-nav nav.hs-language-switcher.is-open .hs-language-switcher__item {
		display: block;
	}

	.header-nav #hs_cos_wrapper_language-switcher .hs-language-switcher {
		text-align: left;
	}

	/* --- Actiebuttons (mobiel) --- */
	.header-nav .action-buttons .button-wrapper {
		width: 100%;
	}

	.header-nav .action-buttons .button {
		width: 100%;
		min-height: 48px;
		justify-content: center;
	}

	body:not(.scrolled) .header-nav .action-buttons .button {
		background-color: var(--so-color-white);
		color: var(--so-color-grey-10);
	}

	/* --- Open menu staten --- */
	body.mobile-menu-open .main-menu a {
		color: var(--so-color-white);
	}

	body.mobile-menu-open .main-menu li.has-submenu > a.disabled-link {
		pointer-events: auto;
	}

	body.mobile-menu-open .button {
		background: var(--so-color-white) !important;
		color: var(--so-color-text) !important;
	}

	body.mobile-menu-open .hs-language-switcher__button {
		color: var(--so-color-text);
		background: var(--so-color-white) !important;
	}

	body.mobile-menu-open .hs-search-field__suggestions-container {
		display: none;
	}
}

/* --- Zoekbalk --- */
.search-bar-wrapper {
	position: fixed;
	inset: 0;
	align-items: flex-start;
	z-index: 9999;
	background-color: rgba(0, 0, 0, .6);
	backdrop-filter: blur(12px);
	display: flex;
	justify-content: center;
	padding: 20dvh var(--so-body-spacing, 16px) var(--so-body-spacing, 16px) var(--so-body-spacing, 16px);
	opacity: 0;
	pointer-events: none;
	transition: all var(--so-transition-speed) ease;

	.search-form-wrapper {
		max-width: var(--so-container-size, 1312px);
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		transition: all var(--so-transition-speed) ease;
		transform: translateY(20px);
		opacity: 0;
		display: flex;
		gap: 16px;

		#hs_cos_wrapper_site_search {
			flex: 1;
			height: fit-content;

			.hs-search-field__label {
				display: none;
			}

			input[type="search"] {
				border-top-right-radius: 0 !important;
				border-bottom-right-radius: 0 !important;
				outline: none !important;
				border: none !important;
			}

			button {
				border-top-left-radius: 0;
				border-bottom-left-radius: 0;
				background-color: var(--so-color-primary);
				width: 56px;
				padding: 0;
				align-items: center;
				justify-content: center;

				svg {
					filter: var(--so-filter-white);
				}
			}

			#autocomplete-results {
				margin-top: 4px;
				max-width: calc(100% - 56px);
				max-height: 80dvh;
                overflow-y: auto;
			}
		}

		.search-close-button {
			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
			background-repeat: no-repeat;
			background-position: center;
			background-size: 16px;
			background-color: var(--so-color-primary-light);
			width: 56px;
			height: 56px;

			&:hover {
				background-color: var(--so-color-text2-on-bg-2);
			}
		}

		@media screen and (max-width: 990px) {
			gap: 8px;
		}
	}

	@media screen and (max-width: 990px) {
		padding-top: 80px;
	}
}

body:has(.search-wrapper.active) .search-bar-wrapper {
	opacity: 1;
	pointer-events: auto;

	.search-form-wrapper {
		transform: translateY(0);
		opacity: 1;
	}
}

html:has(.search-wrapper.active) {
	overflow: hidden;
}


/* Tijdelijk uitzetten language switcher */
header ul.hs-language-switcher__menu > li:has(a[lang="en-gb"]),
header ul.hs-language-switcher__menu > li:has(a[lang="en-ie"]) {
	display: none;
}
.footer {
	position: relative;
	isolation: isolate;
	padding-top: 64px;
	background-color: var(--so-color-bg-2);
	color: var(--so-color-text1-on-bg-2);
	overflow: hidden;
	background-image: url(https://146722076.fs1.hubspotusercontent-eu1.net/hubfs/146722076/raw_assets/public/coolworld/images/coolworld-grid-fade-top.svg);
	background-size: cover;
	background-position: top center;
	background-repeat: no-repeat;
}

.footer-inner {
	position: relative;
	z-index: 1;
}

.footer ul,
.footer li {
	all: unset;
}

.footer li {
	list-style: none;
}

.footer a {
	color: inherit;
	text-decoration: none;
}

.footer a:hover {
	text-decoration: underline;
}

.footer a:focus-visible {
	outline: 2px solid var(--so-color-primary);
	outline-offset: 2px;
}

.footer-top {
	display: flex;
	align-items: stretch;
}

.footer-brand {
	display: flex;
	flex-direction: column;
	gap: 64px;
	flex: 0 0 416px;
	max-width: 100%;
	padding: 64px 0;
	border-top: 1px solid hsl(0 0% 100% / 0.2);
	border-bottom: 1px solid hsl(0 0% 100% / 0.2);
	border-right: 1px solid hsl(0 0% 100% / 0.2);
}

.footer-brand-header {
	display: flex;
	flex-direction: column;
	gap: var(--so-fontsize-h-default-spacing-bottom);
}

.footer-tagline-logo {
	display: block;
	max-width: 279px;
	height: auto;
}

.footer .social-links a:hover {
	border-radius: 4px;
	border: 1px solid #FFF;
	background: rgba(235, 241, 245, 0.24);
}

.footer-logo-link {
	display: inline-block;
}

.footer .social-links {
	gap: var(--so-body-spacing);
}

.footer .social-link {
	width: 40px;
	height: 40px;
	border-radius: 4px;
	border: 1px solid hsl(0 0% 100% / 0.3);
	background-color: color-mix(in srgb, var(--so-color-primary-light) 24%, transparent);
	backdrop-filter: blur(12.5px);
	-webkit-backdrop-filter: blur(12.5px);
}

.footer .social-link-icon svg {
	height: 16px;
}

.footer-office {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.footer-office h2 {
	font-size: var(--so-fontsize-h5);
	color: var(--so-color-white);
	line-height: 100%;
	font-weight: var(--so-fontsize-h-font-weight) !important;
	font-family: var(--so-font-family-heading);
	letter-spacing: -0.4px;
}

.footer-office p {
	font-size: 14px;
	letter-spacing: -0.011em;
	font-style: normal;
}

.footer-office-button .button-wrapper {
	margin: 0;
}

.footer-menus {
	flex: 1;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: 54px;
	row-gap: 48px;
	padding: 64px 80px;
	border-top: 1px solid hsl(0 0% 100% / 0.2);
	border-bottom: 1px solid hsl(0 0% 100% / 0.2);
}

.footer-menu-col {
	display: flex;
	flex-direction: column;
	gap: var(--so-block-gap);
	min-width: 0;
}

.footer-menu-title {
	margin: 0;
	font-family: var(--so-font-family-heading);
	font-size: var(--so-fontsize-h4);
	font-weight: 500;
	line-height: var(--so-fontsize-h4-line-height);
	letter-spacing: var(--so-fontsize-h4-letterspacing);
	color: var(--so-color-text1-on-bg-2);
}

.footer-menu-col ul {	
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.footer-menu-col a {
	font-family: var(--so-font-family-heading);
	font-weight: 300;
}

.footer-bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 48px;
	min-height: 80px;
}

.footer-copyright {
	margin: 0 !important;
	font-size: 12px;
	line-height: 1.25;
}

.footer-bottom .hs_cos_wrapper_type_menu ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}

.footer-bottom .hs_cos_wrapper_type_menu a {
	font-size: 12px;
	text-decoration: underline;
}

@media (max-width: 1024px) {
	.footer-top {
		flex-direction: column;
	}

	.footer-brand {
		flex: none;
		width: 100%;
		border-right: none;
		padding-left: 0;
		padding-right: 0;
	}

	.footer-menus {
		padding: 48px 0;
	}
}

@media (max-width: 768px) {
	.footer-menu-col ul {
		gap: 12px;
	}
	.footer-brand {
		border-top:none;
	}
	.footer .social-links {
		justify-content: flex-end;
	}

	.footer-office-button .button.blue.has-arrow {
		justify-content:center;
	}

	.footer-office-button .button.blue.has-arrow:after {
		margin-left:0!important;
	}

	.footer {
		padding-top: 48px;
	}

	.footer-brand {
		gap: 48px;
		padding: 48px 0;
	}

	.footer-menus {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: var(--so-block-gap);
		row-gap: 40px;
		padding: 40px 0;
	}

	.footer-bottom {
		gap: var(--so-body-spacing);
		color: var(--so-color-white, #FFF);
		font-size: 12px;
		line-height: 125%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.footer .social-link {
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
	}
}
/* Blog index */
.template-blog-index {
	background-color: white;
}
.so-hero-blog {
	padding-top: 80px;
	padding-bottom: 64px;
	background-color: var(--so-color-bg-1);
	background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='1920' height='1094' fill='none' viewBox='0 0 1920 1094'%3E%3Cpath fill='url(%23a)' d='M-5-38h1440v-96h578v1442H-5zm2017-95h-95v95h95zm-97 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-192 95v-95h-95v95zm96-95h-94v95h94zm-192 96h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0H93v95h94zm-96 0H-4v95h95zm1440 1h-94v94h94zm481 0h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm385 96h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0H93v94h94zm-96 0H-4v94h95zm1921 96h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0H93v94h94zm-96 0H-4v94h95zm1921 96h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0H93v94h94zm-96 0H-4v94h95zm1921 96h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0H93v94h94zm-96 0H-4v94h95zm1921 96h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0H93v94h94zm-96 0H-4v94h95zm1921 96h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0H93v94h94zm-96 0H-4v94h95zm1921 96h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0H93v94h94zm-96 0H-4v94h95zm1921 96h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0H93v94h94zm-96 0H-4v94h95zm1921 96h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0H93v94h94zm-96 0H-4v94h95zm1921 96h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0H93v94h94zm-96 0H-4v94h95zm1921 96h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0H93v94h94zm-96 0H-4v94h95zm1921 96h-95v94h95zm-97 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0h-94v94h94zm-96 0H93v94h94zm-96 0H-4v94h95zm1921 96h-95v95h95zm-97 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0h-94v95h94zm-96 0H93v95h94zm-96 0H-4v95h95z'/%3E%3Cdefs%3E%3CradialGradient id='a' cx='0' cy='0' r='1' gradientTransform='rotate(178.837 494.11 142.029)scale(960.698 1344.44)' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='.266' stop-color='%23fff' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23fff' stop-opacity='.8'/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;

	.breadcrumbs {
		margin-bottom: 32px;
	}

	#hs_cos_wrapper_intro {
		max-width: 752px;
		display: block;
	}
}



/* Blog
-------------------------------------------------------------- */
.template-blog-post {
	background-color: var(--so-color-white);

	.so-hero-blog {
		padding-bottom: var(--so-group-spacing);

		.breadcrumbs {
			margin-bottom: 32px;
		}

		h1 {
			margin-left: auto;
			margin-right: auto;
			text-align: center;
			max-width: 864px;
			margin-bottom: 24px;
		}
	}
}

.blog-post-meta {
	display: flex;
	flex-direction: row;
	justify-content: center;
	gap: 6px 40px;
	flex-wrap: wrap;
	align-items: center;
	font-size: 18px;
	font-weight: 400;
	line-height: 150%;
	color: var(--so-color-text);
	margin-bottom: 32px;

	> * {
		position: relative;
	}

	> *:not(:last-child):after {
		content: '';
		position: absolute;
		right: -24px;
		top: 50%;
		transform: translateY(-50%);
		width: 8px;
		height: 8px;
		background-color: var(--so-color-primary-dark);
		border-radius: 2px;
	}

	@media (width <= 576px) {
		flex-direction: column;
		> *:not(:last-child):after {
			content: none;
		}
	}
}

.blog-post-tags {
	display: flex;
	justify-content: center;

	ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 4px;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	li {
		display: flex;
		align-items: center;
		padding: 6px 8px;
		border-radius: 999px;
		background-color: var(--so-color-white);
	}

	li:has(.card-tag--blog-type) {
		background-color: var(--so-color-primary);
	}

	.card-tag--blog-type {
		color: var(--so-color-white);
	}

	.card-tag {
		display: inline-block;
		font-size: 12px;
		line-height: 1;
		font-family: var(--so-font-family-heading);
		font-weight: 500;
	}
}

.blog-post-image-wrapper {
	margin-bottom: var(--so-group-spacing);
	margin-top: calc(-0.5 * var(--so-group-spacing));

	figure {
		all: unset;
		display: block;
		margin: 0;
		padding: 0;
		width: 100%;
		height: 100%;
		aspect-ratio: 1312/600;
		border-radius: 12px;
		overflow: hidden;
		
		img {
			object-fit: cover;
			width: 100%;
			height: 100%;
		}

		@media (width <= 768px) {
			aspect-ratio: 4/3;
		}
	}
}

.blog-post-main {
	display: flex;
	align-items: flex-start;
	gap: 80px;
	position: relative;
	
	@media (width <= 1070px) {
		gap: 32px;
	}

	@media (width <= 768px) {
		gap: 24px;
	}
}

.blog-post-table-of-contents {
	flex: 1;
	max-width: 336px;
	position: sticky;
	top: 120px;

	&:before {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		width: 2px;
		height: 100%;
		background-color: var(--so-color-bg1-Container-3);
		z-index: -1;
	}
	
	.blog-post-table-of-contents-progress {
		position: absolute;
		left: 0;
		top: 0;
		width: 2px;
		height: 4px;
		background-color: var(--so-color-primary-dark);
		z-index: 1;
	}


	ul, li {
		all: unset;
	}

	ul {
		display: flex;
		flex-direction: column;
		padding-left: 16px;
		gap: 8px;

		li a {
			font-size: 14px;
			text-decoration: none;
			color: var(--so-color-bg1-Container-5);
			font-weight: 700;
			line-height: 18px;
		}

		li.active a {
			color: var(--so-color-text);
		}
	}

	@media (width <= 1070px) {
		max-width: 25%;
	}

	@media (width <= 768px) {
		top: 80px;
		max-width: 12px;
		height: calc(100vh - 100px);

		ul {
			display: none;
		}
	}
}


.blog-post-body {
	flex: 1;
	min-width: 0;
	max-width: 752px;

	@media (width <= 1070px) {
		max-width: 75%;
	}

	@media (width <= 768px) {
		max-width: 100%;
	}
}

.blog-post-summary {
	margin-bottom: 24px;
	padding: 24px;
	background: var(--so-color-primary-light);
	border-radius: 12px;
	
	h2, h3, h4, h5, h6 {
		margin-bottom: 24px !important;
	}
	
	ul li:before {
		background-color: var(--so-color-text);
		scale: 0.6;
	}

	span.blog-post-summary-title {
		display: block;
		margin-bottom: 24px;
	}

	span.blog-post-summary-label {
		padding: 6px 8px;
		border-radius: 999px;
		background-color: var(--so-color-white);
		font-size: 12px;
		line-height: 1;
		font-family: var(--so-font-family-heading);
		font-weight: 500;
		color: var(--so-color-text);
		display: block;
		width: fit-content;
		margin-bottom: 12px;
	}
}

.blog-post {
	padding-bottom: var(--so-group-spacing);

	h2, h3 {
		margin-bottom: 24px !important;
	}

	h4, h5, h6 {
		margin-bottom: 16px !important;
	}

	ul + h2, ul + h3, ul + h4, ul + h5, ul + h6 ,
	p + h2, p + h3, p + h4, p + h5, p + h6 {
		margin-top: 48px !important;
	}

	p:has( + ul) {
		margin-bottom: 0 !important;
	}

	ul:has( + p) {
		margin-bottom: 32px !important;
	}

	.hs-video-widget,
	.hs-video-container {
		border-radius: 12px;
		overflow: hidden;
		margin: 48px 0;
	}

	iframe {
		display: block;
		width: 100%;
		aspect-ratio: 16 / 9;
		height: auto;
		border: 0;
		border-radius: 12px;
		margin: 48px 0;
	}
}


hr:has( + .blog-author) {
	margin: 40px 0;
	border: 0;
	border-top: 1px solid var(--so-color-bg1-Container-3);
}

.blog-author {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 16px;
	margin: 24px 0;

	h5 {
		margin-bottom: 10px !important;
	}

	p {
		color: #808080;
		font-size: 16px;
		font-weight: 400;
		line-height: 150%;
		margin-top: 0 !important;
	}

	.blog-author-avatar {
		margin: 0;

		img {
			border-radius: 100%;
			width: 100px;
			height: 100px;
			object-fit: cover;
		}
	}
}

.blog-related-posts-header {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 16px;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 36px;

	h2 {
		white-space: nowrap;
		margin: 0 !important;
	}
}

.template-blog-post > section:not(.blog-post-cta) {
	padding-top: var(--so-group-spacing);
	padding-bottom: var(--so-group-spacing);
	position: relative;
	z-index: 1;

	* {
		position: relative;
	}

	&:before {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		margin-left: calc(-100vw / 2 + 100% / 2);
		margin-right: calc(-100vw / 2 + 100% / 2);
		width: 100vw;
		height: 100%;
		background-color: var(--so-color-bg-1);
		z-index: 0;
	}

}

/* Blog card */
.blog-posts .card header {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.blog-posts .card {
	border-radius: 12px;
	overflow: hidden;

	a:hover {
		color: unset
	}
}

.blog-posts .card .artikel-card__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
	font-size: 12px;
	font-weight: 500;
	line-height: 12px;
	color: var(--so-color-text2-on-bg-1);
	font-family: var(--so-font-family-heading);
}

.blog-posts .card nav {
	z-index: 2;
}

.blog-posts .card nav ul {
	gap: 4px;
}

.blog-posts .card nav ul li {
	background-color: var(--so-color-white);
	padding-left: 8px;
	padding-right: 8px;
	border-radius: 999px;
	vertical-align: middle;
	display: flex;
	align-items: center;
	padding-top: 6px;
	padding-bottom: 6px;
}

.blog-posts .card nav ul li:first-child {
	background-color: var(--so-color-primary);
}

.blog-posts .card nav ul li:first-child .card-tag--blog-type {
	color: var(--so-color-white);
	font-size: 12px;
}

.blog-posts .card nav ul li .card-tag {
	display: inline-block;
	font-size: 12px;
	line-height: 1;
	color: var(--so-color-text);
}
/* Industries card */
.industry-card {
	background: var(--so-color-bg2-Container-1);
	border-radius: 12px;
	padding: 32px;
	color: var(--so-color-white);
	position: relative;
	aspect-ratio: 1/1;
	flex-wrap: nowrap;
	transform-origin: left top;

	&:hover {
		transform: scale(1.02);
	}

	> figure {
		position: absolute;
		inset: 0;
		z-index: 1;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
		border-radius: 12px;
		overflow: hidden;
		opacity: 0;
	}

	&:hover {
		> figure {
			opacity: 0.5;
		}
	}

	header {
		display: flex;
		justify-content: space-between;
		gap: 8px;
		flex-wrap: nowrap;
		z-index: 3;

		a:before {
			content: '';
			position: absolute;
			inset: 0;
			z-index: 2;
		}

		h3 {
			color: var(--so-color-white);
		}

		figure {
			margin: 0;
			width: 32px;
			aspect-ratio: 1/1;
			flex: 0 0 32px;

			img {
				width: 100%;
				height: 100%;
				object-fit: contain;
				object-position: center;
				transform: scale(1) !important;
			}
		}

		@media screen and (max-width: 576px) {
			margin-bottom: auto;
		}
	}

	p {
		margin-top: auto;
		margin-bottom: 0 !important;
		font-size: 14px;
		overflow: hidden;
		text-overflow: ellipsis;
		position: relative;
		z-index: 2;
	}

	.buttons-wrapper {
		position: relative;
		z-index: 2;
	}

	.button {
		position: relative;
		z-index: 1;
		background-color: var(--so-color-bg2-Container-5);
		flex: unset;
		width: fit-content;
		font-size: 14px;
		padding-left: 8px;
		padding-right: 8px;
		height: 40px;

		&:after {
			flex: 0 0 12px !important;
			background-size: 6px !important;
		}

		&:focus {
			outline: 2px solid var(--so-color-white);
		}
	}

	@media screen and (max-width: 576px) {
		.buttons-wrapper > * {
			flex: unset !important;
			width: fit-content;
		}
	}

	@media (pointer: fine) {
		&:hover .button {
			background-color: var(--so-color-primary);
		}
	}

	@media screen and (max-width: 650px) {
		padding: 16px;
		aspect-ratio: unset;

		p {
			margin: 16px 0 0 0;
		}
	}
}

/* Solutions*/
.solutions-wrapper {
	box-shadow: 0 21px 60px 0 rgba(2, 2, 2, 0.08);
	border-radius: 12px;
	backdrop-filter: blur(10px);
	max-width: 1086px;
	width: 100%;
	padding: 12px;
	background: rgba(211, 228, 238, 0.24);
	margin-left: auto;
	margin-right: auto;

	.solutions {
		background: var(--so-color-white);
		border-radius: 8px;
		overflow: hidden;

		nav {
			border-bottom: 1px solid #D3E3EE;
			display: flex;
			padding: 0 40px;

			.solution-tab-label {
				margin: 0;
			}
			
			[role="tab"] {
				display: flex;
				flex-direction: column;
				position: relative;
				padding: 24px 16px;
				text-align: center;
				align-items: center;
				color: var(--so-color-text);
				gap: 8px;
				flex-grow: 1;
				transition: var(--so-transition);

				&:focus-visible {
					outline: 2px solid var(--so-color-primary-dark);
					outline-offset: 2px;
				}

				figure {
					height: 40px;
					flex: 0 0 40px;
					aspect-ratio: 1/1;
					margin: 0;

					img {
						width: 100%;
						height: 100%;
						object-fit: contain;
						object-position: center;
					}
				}

				&:not(:has(input:checked)) {
					cursor: pointer;
				}
				
				@media (pointer: fine) {
					&:hover {
						background-color: var(--so-color-primary-light);
					}
				}

				&:first-child {
					position: relative;

					&:before {
						content: '';
						position: absolute;
						top: 0;
						bottom: 0;
						left: 0;
						transform: translateX(-100%);
						width: 40px;
						transition: var(--so-transition);
					}

					@media (pointer: fine) {
						&:hover:before {
							background-color: var(--so-color-primary-light);
						}
					}
				}

				&:last-child {
					position: relative;

					&:before {
						content: '';
						position: absolute;
						top: 0;
						bottom: 0;
						right: 0;
						transform: translateX(100%);
						width: 40px;
						transition: var(--so-transition);
					}

					@media (pointer: fine) {
						&:hover:before {
							background-color: var(--so-color-primary-light);
						}
					}
				}

				&:after {
					content: '';
					position: absolute;
					left: 12px;
					width: calc(100% - 24px);
					bottom: 0;
					height: 4px;
					opacity: 0;
					background: var(--so-color-primary);
					border-radius: 3px 3px 0 0;
					transition: var(--so-transition);
				}

				input,
				.solution-tab-input {
					display: none;
					appearance: none;
				}

				&:has(input:checked):after,
				&.slick-current:after {
					opacity: 1;
				}
			}
		}

		.solution-content {
			.solution-item {
				display: none;

				&[aria-hidden="false"] {
					display: flex;
				}

				.content {
					padding: 48px 112px 48px 48px;
					display: flex;
					flex-direction: column;

					h2 {
						max-width: 280px;
					}

					p {
						margin-top: auto;
						font-size: 16px;
					}
				}

				figure {
					flex: 0 0 500px;
					aspect-ratio: 4/3;
					margin: 16px;
					position: relative;

					img {
						position: absolute;
						inset: 0;
						width: 100%;
						height: 100%;
						object-fit: cover;
						object-position: center;
						border-radius: 8px;
					}
				}

				@media screen and (max-width: 1088px) {
					.content {
						padding: 48px;
					}

					figure {
						flex: 0 0 50%;
					}
				}
			}
		}
	}

	@media screen and (max-width: 1102px) {
		margin-left: -8px;
		margin-right: -8px;
		padding: 8px;
		max-width: unset;
		width: calc(100vw - 24px);
	}

	@media screen and (max-width: 900px) {
		.solutions {
			nav {
				padding: 0;
			}

			.solution-content {
				.solution-item {
					.content {
						padding: 24px 32px;
					}
				}
			}
		}
	}

	@media screen and (max-width: 768px) {
		.solutions {
			nav {
				display: block;
				position: relative;
				overflow: hidden;

				[role=tab] {
					padding: 24px 0 8px 0;

					.solution-tab-label {
						margin-bottom: 16px;
					}
				}

				.slick-list {
					padding: 0 !important;
					margin: 0 -12px !important;
				};

				.slick-track {
					display: flex;
				}

				.slick-slide {
					height: auto;
					margin: 0 12px;
				}

				.slick-arrow {
					position: absolute;
					top: 50%;
					transform: translateY(-50%);
					left: 8px;
					z-index: 1;
					background-color: var(--so-color-grey-92);
					width: 40px;
					height: 40px;
					display: flex;
					align-items: center;
					justify-content: center;
					padding: 0;
					outline: none;

					&:before {
						content: '';
						width: 20px;
						aspect-ratio: 1/1;
						background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.4987 10L13.332 13.8333L12.1654 15L7.16536 10L12.1654 5L13.332 6.16667L9.4987 10Z' fill='black'/%3E%3C/svg%3E%0A");
						background-size: contain;
						background-repeat: no-repeat;
						background-position: center;
						filter: var(--so-filter-text1-on-bg-1);
					}

					&.slick-next {
						left: unset;
						right: 8px;

						&:before {
							background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.5013 10L6.66797 6.16667L7.83464 5L12.8346 10L7.83464 15L6.66797 13.8333L10.5013 10Z' fill='black'/%3E%3C/svg%3E%0A");
						}
					}

					&.slick-disabled:before {
						filter: var(--so-filter-grey-70);
					}
				}
			}

			.solution-content {
				.solution-item {
					flex-direction: column;

					.content {
						h2 {
							max-width: unset;
							margin-bottom: 60px;
							font-size: 48px;
						}
					}

					figure {
						flex: 0 0 100%;
						margin: 8px;
					}
				}
			}
		}
	}

	@media screen and (max-width: 560px) {
		.solutions {
			nav {
				[role=tab] {
					border-radius: 0;

					&:after {
						left: 0;
						width: 100%;
					}
				}
			}

			.solution-content {
				.solution-item {
					.content {
						h2 {
							font-size: 32px;
							line-height: 36px;
						}
					}
				}
			}
		}
	}
}

/* Breadcrumbs */
.breadcrumbs {
	font-size: 16px;
	font-weight: 500;
	display: flex;
	letter-spacing: -0.02em;
	align-items: center;
	margin-bottom: 16px;
	min-width: 0;
	width: 100%;

	* {
		color: var(--so-color-text1-on-bg-1);
		font-size: 12px;
		line-height: 14px;
		text-decoration: none;
	}

	a {
		color: var(--so-color-text1-on-bg-1);
		transition: var(--so-transition);
		line-height: 1;

		&:hover {
			color: var(--so-color-primary);
			text-decoration: underline;
		}
	}

	.hs-breadcrumb-menu {
		display: flex;
		align-items: center;
		list-style-type: none;
		padding: 0;
		flex-wrap: wrap;
		gap: 8px;

		.hs-breadcrumb-menu-item {
			padding: 0;
		}

		.hs-breadcrumb-menu-item:not(.first-crumb):before {
			content: '';
			width: 12px;
			aspect-ratio: 1/1;
			background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.05664 10.115L3.94164 11L8.94164 6L3.94164 1L3.05664 1.885L7.17164 6L3.05664 10.115Z' fill='black'/%3E%3C/svg%3E%0A");
			background-size: 12px;
			background-repeat: no-repeat;
			background-position: center;
			display: inline-block;
			margin-right: 4px;
			filter: var(--so-filter-text1-on-bg-1);
			vertical-align: middle;
		}

		.hs-breadcrumb-menu-item.last-crumb {
			opacity: .6;

			.hs-breadcrumb-label {
				color: var(--so-color-text2-on-bg-1);
				vertical-align: middle;
			}
		}

		@media screen and (max-width: 576px) {
			flex-wrap: nowrap;
			width: 100%;
			min-width: 0;

			.hs-breadcrumb-menu-item {
				flex: 0 0 auto;
				white-space: nowrap;

				&.last-crumb {
					min-width: 0;
					flex: 1 1 auto;
					display:flex;
					overflow: hidden;

					.hs-breadcrumb-label {
						display: block;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
					}
				}
			}
		}
	}

	&.dark-mode {
		* {
			color: var(--so-color-text1-on-bg-2);
		}

		a {
			color: var(--so-color-text1-on-bg-2);

			&:focus {
				outline: 2px solid var(--so-color-text1-on-bg-2);
			}
		}

		.hs-breadcrumb-menu {
			.hs-breadcrumb-menu-item:not(.first-crumb):before {
				filter: var(--so-filter-text1-on-bg-2);
			}
		}

		.hs-breadcrumb-menu-item.last-crumb {
			.hs-breadcrumb-label {
				color: var(--so-color-text1-on-bg-2);
			}
		}
	}
}

.dnd-section:has(.breadcrumbs) {
	padding: 20px var(--so-body-spacing, 16px) var(--so-group-padding, 80) var(--so-body-spacing, 16px);
}


/* Accordion card */
.so-accordion {
	margin-bottom: var(--so-block-gap, 32px);
}

.accordion-card {
	display: flex;
	flex-direction: column;
	background: var(--so-color-white);
	border: 1px solid var(--so-color-bg1-Container-2);
	border-radius: 12px;
	
	.accordion-card-heading {
		margin: 0;
	}

	.accordion-card-trigger {
		width: 100%;
		padding: 24px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 8px;
		white-space: normal;
		flex-wrap: nowrap;
		cursor: pointer;
		margin: 0;
		border: none;
		background: none;
		font: inherit;
		font-size: var(--so-fontsize-h5);
		line-height: var(--so-fontsize-h5-line-height);
		letter-spacing: var(--so-fontsize-h5-letterspacing);
		font-weight: var(--so-fontsize-h-font-weight);
		color: var(--so-color-text);
		text-align: left;
		height: fit-content;
		border-radius: 12px;
		outline: none !important;

		&:after {
			content: '';
			width: 40px;
			aspect-ratio: 1/1;
			flex: 0 0 40px;
			background-color: var(--so-color-primary-light);
			transition: var(--so-transition);
			border-radius: 4px;
			background-size: 12px;
			background-repeat: no-repeat;
			background-position: center;
			background-image: url("data:image/svg+xml,%3Csvg width='10' height='7' viewBox='0 0 10 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.175 0L5 3.81667L8.825 0L10 1.175L5 6.175L0 1.175L1.175 0Z' fill='%23142129'/%3E%3C/svg%3E%0A");
		}

		@media (pointer: fine) {
			&:hover {
				background: transparent;

				&:after {
					background-color: var(--so-color-primary);
					background-image: url("data:image/svg+xml,%3Csvg width='10' height='7' viewBox='0 0 10 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.175 0L5 3.81667L8.825 0L10 1.175L5 6.175L0 1.175L1.175 0Z' fill='white'/%3E%3C/svg%3E%0A");
				}
			}
		}
	}

	@media (pointer: fine) {
		&:hover {
			&:not(.active) {
				border-color: var(--so-color-primary-dark);
			}
		}

		&.active .accordion-card-trigger:hover:after {
			background-image: url("data:image/svg+xml,%3Csvg width='10' height='7' viewBox='0 0 10 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.175 6.175L5 2.35833L8.825 6.175L10 5L5 0L0 5L1.175 6.175Z' fill='white'/%3E%3C/svg%3E%0A");
		}
	}

	.accordion-card-content {
		display: flex;
		flex-direction: column;
		gap: 24px;
		padding: 0 24px;
		transition: var(--so-transition);
		max-height: 0;
		overflow: hidden;

		> * {
			margin: 0;
		}

		.buttons-wrapper {
			.button {
				padding-left: 16px;
				padding-right: 16px;
				height: 48px;
				font-size: 16px;
				line-height: 1;

				&.link {
					padding-left: 0;
					padding-right: 0;
					white-space: normal;
					text-align: left;
                    line-height: 1.6;
					height: fit-content;

					&.has-arrow {
						display: block;

						&:after {
							display: inline-block;
							width: 20px;
							height: 10px;
							background-size: contain;
						}
					}
				}
			}
		}
	}

	&.active {
		.accordion-card-trigger:after {
			background-image: url("data:image/svg+xml,%3Csvg width='10' height='7' viewBox='0 0 10 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.175 6.175L5 2.35833L8.825 6.175L10 5L5 0L0 5L1.175 6.175Z' fill='%23142129'/%3E%3C/svg%3E%0A");
		}

		.accordion-card-content {
			padding-bottom: 24px;
			max-height: 1000px;
		}
	}
}

*:has(> .accordion-card) {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

/* Product card */
.product {
	flex-wrap: unset;
	gap: 10px;

	.card-link:before {
		z-index: 4;
	}

	figure {
		aspect-ratio: 5/6;
		overflow: hidden;
		border-radius: 12px;
		padding: 48px;
		background-color: var(--so-color-primary-light);
		margin: 0;
		position: relative;

		img {
			left: 16px;
			top: 16px;
			width: calc(100% - 32px);
			height: calc(100% - 32px);
			object-fit: contain;
			object-position: center;
			z-index: 2;
			position: relative;
		}

		figcaption {
			position: absolute;
			width: calc(100% - 32px);
			left: 16px;
			top: 20%;
			opacity: 0;
			text-align: center;
			z-index: 1;
		}
	}

	&:hover {
		transform: translateY(-4px);

		figcaption {
			opacity: 1;
			top: 48px;
		}

		img {
			transform: unset;
		}

		footer {
			border-color: var(--so-color-primary-dark);
		}
	}

	header {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.button {
		position: unset;
		padding: unset;
		width: 40px;
		min-width: 40px;
		max-width: 40px;
		height: 40px;
		min-height: 40px;
		max-height: 40px;

		i {
			filter: invert(1);
			width: 12px;
			height: 12px;
			display: inline-block;
			margin: 0 auto;
			background-position: center;
		}
	}

	footer {
		display: flex;
		flex-direction: row;
		align-items: flex-start;
		padding: 12px 24px;
		border-radius: 8px;
		border: 1px solid var(--so-color-grey-92);
		margin-top: auto;

		.product-specification {
			display: flex;
			flex: 0 0 50%;
			flex-direction: column;
			gap: 5px;

			p {
				margin: 0;
				font-size: 12px;
				white-space: nowrap;
			}
			.h6 {
				margin: 0;
				font-weight: 600;
				white-space: nowrap;
			}
		}
		.product-specification:nth-child(odd) {
			border-right: 1px solid var(--so-color-grey-92);
			padding-right: 24px;
		}
		.product-specification:nth-child(even) {
			padding-left: 24px;
		}

		@media (width <= 1080px) {
			flex-direction: column;

			.product-specification {
				width: 100%;
			}

			.product-specification:nth-child(odd) {
				border-right: none;
				padding-right: 0;
				padding-bottom: 12px;
				border-bottom: 1px solid var(--so-color-grey-92);
			}
			.product-specification:nth-child(even) {
				padding-left: 0;
				padding-top: 12px;
			}
		}
		@media (width <= 576px) {
			padding: 12px;
		}
	}

	@media (width <= 680px) {
		figure {
			padding: 24px;
		}
	}

	@media (width <= 576px) {
		gap: 10px;
	}
}