@charset "UTF-8";

@keyframes plyr-progress {
	to {
		background-position: 25px 0;
		background-position: var(--plyr-progress-loading-size, 25px) 0
	}
}

@keyframes plyr-popup {
	0% {
		opacity: .5;
		transform: translateY(10px)
	}

	to {
		opacity: 1;
		transform: translateY(0)
	}
}

@keyframes plyr-fade-in {
	0% {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

.plyr {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	align-items: center;
	direction: ltr;
	display: flex;
	flex-direction: column;
	font-family: inherit;
	font-family: var(--plyr-font-family, inherit);
	font-variant-numeric: tabular-nums;
	font-weight: 400;
	font-weight: var(--plyr-font-weight-regular, 400);
	line-height: 1.7;
	line-height: var(--plyr-line-height, 1.7);
	max-width: 100%;
	min-width: 200px;
	position: relative;
	text-shadow: none;
	transition: box-shadow .3s ease;
	z-index: 0
}

.plyr audio,
.plyr iframe,
.plyr video {
	display: block;
	height: 100%;
	width: 100%
}

.plyr button {
	font: inherit;
	line-height: inherit;
	width: auto
}

.plyr:focus {
	outline: 0
}

.plyr--full-ui {
	box-sizing: border-box
}

.plyr--full-ui *,
.plyr--full-ui :after,
.plyr--full-ui :before {
	box-sizing: inherit
}

.plyr--full-ui a,
.plyr--full-ui button,
.plyr--full-ui input,
.plyr--full-ui label {
	touch-action: manipulation
}

.plyr__badge {
	background: #4a5464;
	background: var(--plyr-badge-background, #4a5464);
	border-radius: 2px;
	border-radius: var(--plyr-badge-border-radius, 2px);
	color: #fff;
	color: var(--plyr-badge-text-color, #fff);
	font-size: 9px;
	font-size: var(--plyr-font-size-badge, 9px);
	line-height: 1;
	padding: 3px 4px
}

.plyr--full-ui ::-webkit-media-text-track-container {
	display: none
}

.plyr__captions {
	animation: plyr-fade-in .3s ease;
	bottom: 0;
	display: none;
	font-size: 13px;
	font-size: var(--plyr-font-size-small, 13px);
	left: 0;
	padding: 10px;
	padding: var(--plyr-control-spacing, 10px);
	position: absolute;
	text-align: center;
	transition: transform .4s ease-in-out;
	width: 100%
}

.plyr__captions span:empty {
	display: none
}

@media (min-width:480px) {
	.plyr__captions {
		font-size: 15px;
		font-size: var(--plyr-font-size-base, 15px);
		padding: 20px;
		padding: calc(var(--plyr-control-spacing, 10px)*2)
	}
}

@media (min-width:768px) {
	.plyr__captions {
		font-size: 18px;
		font-size: var(--plyr-font-size-large, 18px)
	}
}

.plyr--captions-active .plyr__captions {
	display: block
}

.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty)~.plyr__captions {
	transform: translateY(-40px);
	transform: translateY(calc(var(--plyr-control-spacing, 10px)*-4))
}

.plyr__caption {
	background: #000c;
	background: var(--plyr-captions-background, #000c);
	border-radius: 2px;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
	color: #fff;
	color: var(--plyr-captions-text-color, #fff);
	line-height: 185%;
	padding: .2em .5em;
	white-space: pre-wrap
}

.plyr__caption div {
	display: inline
}

.plyr__control {
	background: #0000;
	border: 0;
	border-radius: 4px;
	border-radius: var(--plyr-control-radius, 4px);
	color: inherit;
	cursor: pointer;
	flex-shrink: 0;
	overflow: visible;
	padding: 7px;
	padding: calc(var(--plyr-control-spacing, 10px)*.7);
	position: relative;
	transition: all .3s ease
}

.plyr__control svg {
	fill: currentColor;
	display: block;
	height: 18px;
	height: var(--plyr-control-icon-size, 18px);
	pointer-events: none;
	width: 18px;
	width: var(--plyr-control-icon-size, 18px)
}

.plyr__control:focus {
	outline: 0
}

.plyr__control:focus-visible {
	outline: 2px dashed #00b2ff;
	outline: 2px dashed var(--plyr-focus-visible-color, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
	outline-offset: 2px
}

a.plyr__control {
	text-decoration: none
}

.plyr__control.plyr__control--pressed .icon--not-pressed,
.plyr__control.plyr__control--pressed .label--not-pressed,
.plyr__control:not(.plyr__control--pressed) .icon--pressed,
.plyr__control:not(.plyr__control--pressed) .label--pressed,
a.plyr__control:after,
a.plyr__control:before {
	display: none
}

.plyr--full-ui ::-webkit-media-controls {
	display: none
}

.plyr__controls {
	align-items: center;
	display: flex;
	justify-content: flex-end;
	text-align: center
}

.plyr__controls .plyr__progress__container {
	flex: 1;
	min-width: 0
}

.plyr__controls .plyr__controls__item {
	margin-left: 2.5px;
	margin-left: calc(var(--plyr-control-spacing, 10px)/4)
}

.plyr__controls .plyr__controls__item:first-child {
	margin-left: 0;
	margin-right: auto
}

.plyr__controls .plyr__controls__item.plyr__progress__container {
	padding-left: 2.5px;
	padding-left: calc(var(--plyr-control-spacing, 10px)/4)
}

.plyr__controls .plyr__controls__item.plyr__time {
	padding: 0 5px;
	padding: 0 calc(var(--plyr-control-spacing, 10px)/2)
}

.plyr__controls .plyr__controls__item.plyr__progress__container:first-child,
.plyr__controls .plyr__controls__item.plyr__time+.plyr__time,
.plyr__controls .plyr__controls__item.plyr__time:first-child {
	padding-left: 0
}

.plyr [data-plyr=airplay],
.plyr [data-plyr=captions],
.plyr [data-plyr=fullscreen],
.plyr [data-plyr=pip],
.plyr__controls:empty {
	display: none
}

.plyr--airplay-supported [data-plyr=airplay],
.plyr--captions-enabled [data-plyr=captions],
.plyr--fullscreen-enabled [data-plyr=fullscreen],
.plyr--pip-supported [data-plyr=pip] {
	display: inline-block
}

.plyr__menu {
	display: flex;
	position: relative
}

.plyr__menu .plyr__control svg {
	transition: transform .3s ease
}

.plyr__menu .plyr__control[aria-expanded=true] svg {
	transform: rotate(90deg)
}

.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip {
	display: none
}

.plyr__menu__container {
	animation: plyr-popup .2s ease;
	background: #ffffffe6;
	background: var(--plyr-menu-background, #ffffffe6);
	border-radius: 8px;
	border-radius: var(--plyr-menu-radius, 8px);
	bottom: 100%;
	box-shadow: 0 1px 2px #00000026;
	box-shadow: var(--plyr-menu-shadow, 0 1px 2px #00000026);
	color: #4a5464;
	color: var(--plyr-menu-color, #4a5464);
	font-size: 15px;
	font-size: var(--plyr-font-size-base, 15px);
	margin-bottom: 10px;
	position: absolute;
	right: -3px;
	text-align: left;
	white-space: nowrap;
	z-index: 3
}

.plyr__menu__container>div {
	overflow: hidden;
	transition: height .35s cubic-bezier(.4, 0, .2, 1), width .35s cubic-bezier(.4, 0, .2, 1)
}

.plyr__menu__container:after {
	border: 4px solid #0000;
	border: var(--plyr-menu-arrow-size, 4px) solid #0000;
	border-top-color: var(--plyr-menu-background, #ffffffe6);
	content: "";
	height: 0;
	position: absolute;
	right: 14px;
	right: calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7 - var(--plyr-menu-arrow-size, 4px)/2);
	top: 100%;
	width: 0
}

.plyr__menu__container [role=menu] {
	padding: 7px;
	padding: calc(var(--plyr-control-spacing, 10px)*.7)
}

.plyr__menu__container [role=menuitem],
.plyr__menu__container [role=menuitemradio] {
	margin-top: 2px
}

.plyr__menu__container [role=menuitem]:first-child,
.plyr__menu__container [role=menuitemradio]:first-child {
	margin-top: 0
}

.plyr__menu__container .plyr__control {
	align-items: center;
	color: #4a5464;
	color: var(--plyr-menu-color, #4a5464);
	display: flex;
	font-size: 13px;
	font-size: var(--plyr-font-size-menu, var(--plyr-font-size-small, 13px));
	padding: 4.66667px 10.5px;
	padding: calc(var(--plyr-control-spacing, 10px)*.7/1.5) calc(var(--plyr-control-spacing, 10px)*.7*1.5);
	-webkit-user-select: none;
	user-select: none;
	width: 100%
}

.plyr__menu__container .plyr__control>span {
	align-items: inherit;
	display: flex;
	width: 100%
}

.plyr__menu__container .plyr__control:after {
	border: 4px solid #0000;
	border: var(--plyr-menu-item-arrow-size, 4px) solid #0000;
	content: "";
	position: absolute;
	top: 50%;
	transform: translateY(-50%)
}

.plyr__menu__container .plyr__control--forward {
	padding-right: 28px;
	padding-right: calc(var(--plyr-control-spacing, 10px)*.7*4)
}

.plyr__menu__container .plyr__control--forward:after {
	border-left-color: #728197;
	border-left-color: var(--plyr-menu-arrow-color, #728197);
	right: 6.5px;
	right: calc(var(--plyr-control-spacing, 10px)*.7*1.5 - var(--plyr-menu-item-arrow-size, 4px))
}

.plyr__menu__container .plyr__control--forward:focus-visible:after,
.plyr__menu__container .plyr__control--forward:hover:after {
	border-left-color: initial
}

.plyr__menu__container .plyr__control--back {
	font-weight: 400;
	font-weight: var(--plyr-font-weight-regular, 400);
	margin: 7px;
	margin: calc(var(--plyr-control-spacing, 10px)*.7);
	margin-bottom: 3.5px;
	margin-bottom: calc(var(--plyr-control-spacing, 10px)*.7/2);
	padding-left: 28px;
	padding-left: calc(var(--plyr-control-spacing, 10px)*.7*4);
	position: relative;
	width: calc(100% - 14px);
	width: calc(100% - var(--plyr-control-spacing, 10px)*.7*2)
}

.plyr__menu__container .plyr__control--back:after {
	border-right-color: #728197;
	border-right-color: var(--plyr-menu-arrow-color, #728197);
	left: 6.5px;
	left: calc(var(--plyr-control-spacing, 10px)*.7*1.5 - var(--plyr-menu-item-arrow-size, 4px))
}

.plyr__menu__container .plyr__control--back:before {
	background: #dcdfe5;
	background: var(--plyr-menu-back-border-color, #dcdfe5);
	box-shadow: 0 1px 0 #fff;
	box-shadow: 0 1px 0 var(--plyr-menu-back-border-shadow-color, #fff);
	content: "";
	height: 1px;
	left: 0;
	margin-top: 3.5px;
	margin-top: calc(var(--plyr-control-spacing, 10px)*.7/2);
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 100%
}

.plyr__menu__container .plyr__control--back:focus-visible:after,
.plyr__menu__container .plyr__control--back:hover:after {
	border-right-color: initial
}

.plyr__menu__container .plyr__control[role=menuitemradio] {
	padding-left: 7px;
	padding-left: calc(var(--plyr-control-spacing, 10px)*.7)
}

.plyr__menu__container .plyr__control[role=menuitemradio]:after,
.plyr__menu__container .plyr__control[role=menuitemradio]:before {
	border-radius: 100%
}

.plyr__menu__container .plyr__control[role=menuitemradio]:before {
	background: #0000001a;
	content: "";
	display: block;
	flex-shrink: 0;
	height: 16px;
	margin-right: 10px;
	margin-right: var(--plyr-control-spacing, 10px);
	transition: all .3s ease;
	width: 16px
}

.plyr__menu__container .plyr__control[role=menuitemradio]:after {
	background: #fff;
	border: 0;
	height: 6px;
	left: 12px;
	opacity: 0;
	top: 50%;
	transform: translateY(-50%) scale(0);
	transition: transform .3s ease, opacity .3s ease;
	width: 6px
}

.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:before {
	background: #00b2ff;
	background: var(--plyr-control-toggle-checked-background, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)))
}

.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:after {
	opacity: 1;
	transform: translateY(-50%) scale(1)
}

.plyr__menu__container .plyr__control[role=menuitemradio]:focus-visible:before,
.plyr__menu__container .plyr__control[role=menuitemradio]:hover:before {
	background: #23282f1a
}

.plyr__menu__container .plyr__menu__value {
	align-items: center;
	display: flex;
	margin-left: auto;
	margin-right: -5px;
	margin-right: calc(var(--plyr-control-spacing, 10px)*.7*-1 + 2px);
	overflow: hidden;
	padding-left: 24.5px;
	padding-left: calc(var(--plyr-control-spacing, 10px)*.7*3.5);
	pointer-events: none
}

.plyr--full-ui input[type=range] {
	-webkit-appearance: none;
	appearance: none;
	background: #0000;
	border: 0;
	border-radius: 26px;
	border-radius: calc(var(--plyr-range-thumb-height, 13px)*2);
	color: #00b2ff;
	color: var(--plyr-range-fill-background, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
	display: block;
	height: 19px;
	height: calc(var(--plyr-range-thumb-active-shadow-width, 3px)*2 + var(--plyr-range-thumb-height, 13px));
	margin: 0;
	min-width: 0;
	padding: 0;
	transition: box-shadow .3s ease;
	width: 100%
}

.plyr--full-ui input[type=range]::-webkit-slider-runnable-track {
	background: #0000;
	background-image: linear-gradient(90deg, currentColor, #0000 0);
	background-image: linear-gradient(to right, currentColor var(--value, 0), #0000 var(--value, 0));
	border: 0;
	border-radius: 2.5px;
	border-radius: calc(var(--plyr-range-track-height, 5px)/2);
	height: 5px;
	height: var(--plyr-range-track-height, 5px);
	-webkit-transition: box-shadow .3s ease;
	transition: box-shadow .3s ease;
	-webkit-user-select: none;
	user-select: none
}

.plyr--full-ui input[type=range]::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	background: #fff;
	background: var(--plyr-range-thumb-background, #fff);
	border: 0;
	border-radius: 100%;
	box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33;
	box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33);
	height: 13px;
	height: var(--plyr-range-thumb-height, 13px);
	margin-top: -4px;
	margin-top: calc((var(--plyr-range-thumb-height, 13px) - var(--plyr-range-track-height, 5px))/2*-1);
	position: relative;
	-webkit-transition: all .2s ease;
	transition: all .2s ease;
	width: 13px;
	width: var(--plyr-range-thumb-height, 13px)
}

.plyr--full-ui input[type=range]::-moz-range-track {
	background: #0000;
	border: 0;
	border-radius: 2.5px;
	border-radius: calc(var(--plyr-range-track-height, 5px)/2);
	height: 5px;
	height: var(--plyr-range-track-height, 5px);
	-moz-transition: box-shadow .3s ease;
	transition: box-shadow .3s ease;
	user-select: none
}

.plyr--full-ui input[type=range]::-moz-range-thumb {
	background: #fff;
	background: var(--plyr-range-thumb-background, #fff);
	border: 0;
	border-radius: 100%;
	box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33;
	box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33);
	height: 13px;
	height: var(--plyr-range-thumb-height, 13px);
	position: relative;
	-moz-transition: all .2s ease;
	transition: all .2s ease;
	width: 13px;
	width: var(--plyr-range-thumb-height, 13px)
}

.plyr--full-ui input[type=range]::-moz-range-progress {
	background: currentColor;
	border-radius: 2.5px;
	border-radius: calc(var(--plyr-range-track-height, 5px)/2);
	height: 5px;
	height: var(--plyr-range-track-height, 5px)
}

.plyr--full-ui input[type=range]::-ms-track {
	color: #0000
}

.plyr--full-ui input[type=range]::-ms-fill-upper,
.plyr--full-ui input[type=range]::-ms-track {
	background: #0000;
	border: 0;
	border-radius: 2.5px;
	border-radius: calc(var(--plyr-range-track-height, 5px)/2);
	height: 5px;
	height: var(--plyr-range-track-height, 5px);
	-ms-transition: box-shadow .3s ease;
	transition: box-shadow .3s ease;
	user-select: none
}

.plyr--full-ui input[type=range]::-ms-fill-lower {
	background: #0000;
	background: currentColor;
	border: 0;
	border-radius: 2.5px;
	border-radius: calc(var(--plyr-range-track-height, 5px)/2);
	height: 5px;
	height: var(--plyr-range-track-height, 5px);
	-ms-transition: box-shadow .3s ease;
	transition: box-shadow .3s ease;
	user-select: none
}

.plyr--full-ui input[type=range]::-ms-thumb {
	background: #fff;
	background: var(--plyr-range-thumb-background, #fff);
	border: 0;
	border-radius: 100%;
	box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33;
	box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33);
	height: 13px;
	height: var(--plyr-range-thumb-height, 13px);
	margin-top: 0;
	position: relative;
	-ms-transition: all .2s ease;
	transition: all .2s ease;
	width: 13px;
	width: var(--plyr-range-thumb-height, 13px)
}

.plyr--full-ui input[type=range]::-ms-tooltip {
	display: none
}

.plyr--full-ui input[type=range]::-moz-focus-outer {
	border: 0
}

.plyr--full-ui input[type=range]:focus {
	outline: 0
}

.plyr--full-ui input[type=range]:focus-visible::-webkit-slider-runnable-track {
	outline: 2px dashed #00b2ff;
	outline: 2px dashed var(--plyr-focus-visible-color, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
	outline-offset: 2px
}

.plyr--full-ui input[type=range]:focus-visible::-moz-range-track {
	outline: 2px dashed #00b2ff;
	outline: 2px dashed var(--plyr-focus-visible-color, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
	outline-offset: 2px
}

.plyr--full-ui input[type=range]:focus-visible::-ms-track {
	outline: 2px dashed #00b2ff;
	outline: 2px dashed var(--plyr-focus-visible-color, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
	outline-offset: 2px
}

.plyr__poster {
	background-color: #000;
	background-color: var(--plyr-video-background, var(--plyr-video-background, #000));
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: contain;
	height: 100%;
	opacity: 0;
	transition: opacity .2s ease;
	width: 100%;
	z-index: 1
}

.plyr--stopped.plyr__poster-enabled .plyr__poster {
	opacity: 1
}

.plyr--youtube.plyr--paused.plyr__poster-enabled:not(.plyr--stopped) .plyr__poster {
	display: none
}

.plyr__time {
	font-size: 13px;
	font-size: var(--plyr-font-size-time, var(--plyr-font-size-small, 13px))
}

.plyr__time+.plyr__time:before {
	content: "⁄";
	margin-right: 10px;
	margin-right: var(--plyr-control-spacing, 10px)
}

@media (max-width:767px) {
	.plyr__time+.plyr__time {
		display: none
	}
}

.plyr__tooltip {
	background: #fff;
	background: var(--plyr-tooltip-background, #fff);
	border-radius: 5px;
	border-radius: var(--plyr-tooltip-radius, 5px);
	bottom: 100%;
	box-shadow: 0 1px 2px #00000026;
	box-shadow: var(--plyr-tooltip-shadow, 0 1px 2px #00000026);
	color: #4a5464;
	color: var(--plyr-tooltip-color, #4a5464);
	font-size: 13px;
	font-size: var(--plyr-font-size-small, 13px);
	font-weight: 400;
	font-weight: var(--plyr-font-weight-regular, 400);
	left: 50%;
	line-height: 1.3;
	margin-bottom: 10px;
	margin-bottom: calc(var(--plyr-control-spacing, 10px)/2*2);
	opacity: 0;
	padding: 5px 7.5px;
	padding: calc(var(--plyr-control-spacing, 10px)/2) calc(var(--plyr-control-spacing, 10px)/2*1.5);
	pointer-events: none;
	position: absolute;
	transform: translate(-50%, 10px) scale(.8);
	transform-origin: 50% 100%;
	transition: transform .2s ease .1s, opacity .2s ease .1s;
	white-space: nowrap;
	z-index: 2
}

.plyr__tooltip:before {
	border-left: 4px solid #0000;
	border-left: var(--plyr-tooltip-arrow-size, 4px) solid #0000;
	border-right: 4px solid #0000;
	border-right: var(--plyr-tooltip-arrow-size, 4px) solid #0000;
	border-top: 4px solid #fff;
	border-top: var(--plyr-tooltip-arrow-size, 4px) solid var(--plyr-tooltip-background, #fff);
	bottom: -4px;
	bottom: calc(var(--plyr-tooltip-arrow-size, 4px)*-1);
	content: "";
	height: 0;
	left: 50%;
	position: absolute;
	transform: translateX(-50%);
	width: 0;
	z-index: 2
}

.plyr .plyr__control:focus-visible .plyr__tooltip,
.plyr .plyr__control:hover .plyr__tooltip,
.plyr__tooltip--visible {
	opacity: 1;
	transform: translate(-50%) scale(1)
}

.plyr .plyr__control:hover .plyr__tooltip {
	z-index: 3
}

.plyr__controls>.plyr__control:first-child .plyr__tooltip,
.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip {
	left: 0;
	transform: translateY(10px) scale(.8);
	transform-origin: 0 100%
}

.plyr__controls>.plyr__control:first-child .plyr__tooltip:before,
.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip:before {
	left: 16px;
	left: calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7)
}

.plyr__controls>.plyr__control:last-child .plyr__tooltip {
	left: auto;
	right: 0;
	transform: translateY(10px) scale(.8);
	transform-origin: 100% 100%
}

.plyr__controls>.plyr__control:last-child .plyr__tooltip:before {
	left: auto;
	right: 16px;
	right: calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7);
	transform: translateX(50%)
}

.plyr__controls>.plyr__control:first-child .plyr__tooltip--visible,
.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip--visible,
.plyr__controls>.plyr__control:first-child+.plyr__control:focus-visible .plyr__tooltip,
.plyr__controls>.plyr__control:first-child+.plyr__control:hover .plyr__tooltip,
.plyr__controls>.plyr__control:first-child:focus-visible .plyr__tooltip,
.plyr__controls>.plyr__control:first-child:hover .plyr__tooltip,
.plyr__controls>.plyr__control:last-child .plyr__tooltip--visible,
.plyr__controls>.plyr__control:last-child:focus-visible .plyr__tooltip,
.plyr__controls>.plyr__control:last-child:hover .plyr__tooltip {
	transform: translate(0) scale(1)
}

.plyr__progress {
	left: 6.5px;
	left: calc(var(--plyr-range-thumb-height, 13px)*.5);
	margin-right: 13px;
	margin-right: var(--plyr-range-thumb-height, 13px);
	position: relative
}

.plyr__progress input[type=range],
.plyr__progress__buffer {
	margin-left: -6.5px;
	margin-left: calc(var(--plyr-range-thumb-height, 13px)*-.5);
	margin-right: -6.5px;
	margin-right: calc(var(--plyr-range-thumb-height, 13px)*-.5);
	width: calc(100% + 13px);
	width: calc(100% + var(--plyr-range-thumb-height, 13px))
}

.plyr__progress input[type=range] {
	position: relative;
	z-index: 2
}

.plyr__progress .plyr__tooltip {
	left: 0;
	max-width: 120px;
	overflow-wrap: break-word
}

.plyr__progress__buffer {
	-webkit-appearance: none;
	background: #0000;
	border: 0;
	border-radius: 100px;
	height: 5px;
	height: var(--plyr-range-track-height, 5px);
	left: 0;
	margin-top: -2.5px;
	margin-top: calc((var(--plyr-range-track-height, 5px)/2)*-1);
	padding: 0;
	position: absolute;
	top: 50%
}

.plyr__progress__buffer::-webkit-progress-bar {
	background: #0000
}

.plyr__progress__buffer::-webkit-progress-value {
	background: currentColor;
	border-radius: 100px;
	min-width: 5px;
	min-width: var(--plyr-range-track-height, 5px);
	-webkit-transition: width .2s ease;
	transition: width .2s ease
}

.plyr__progress__buffer::-moz-progress-bar {
	background: currentColor;
	border-radius: 100px;
	min-width: 5px;
	min-width: var(--plyr-range-track-height, 5px);
	-moz-transition: width .2s ease;
	transition: width .2s ease
}

.plyr__progress__buffer::-ms-fill {
	border-radius: 100px;
	-ms-transition: width .2s ease;
	transition: width .2s ease
}

.plyr--loading .plyr__progress__buffer {
	animation: plyr-progress 1s linear infinite;
	background-image: linear-gradient(-45deg, #23282f99 25%, #0000 0, #0000 50%, #23282f99 0, #23282f99 75%, #0000 0, #0000);
	background-image: linear-gradient(-45deg, var(--plyr-progress-loading-background, #23282f99) 25%, #0000 25%, #0000 50%, var(--plyr-progress-loading-background, #23282f99) 50%, var(--plyr-progress-loading-background, #23282f99) 75%, #0000 75%, #0000);
	background-repeat: repeat-x;
	background-size: 25px 25px;
	background-size: var(--plyr-progress-loading-size, 25px) var(--plyr-progress-loading-size, 25px);
	color: #0000
}

.plyr--video.plyr--loading .plyr__progress__buffer {
	background-color: #ffffff40;
	background-color: var(--plyr-video-progress-buffered-background, #ffffff40)
}

.plyr--audio.plyr--loading .plyr__progress__buffer {
	background-color: #c1c8d199;
	background-color: var(--plyr-audio-progress-buffered-background, #c1c8d199)
}

.plyr__progress__marker {
	background-color: #fff;
	background-color: var(--plyr-progress-marker-background, #fff);
	border-radius: 1px;
	height: 5px;
	height: var(--plyr-range-track-height, 5px);
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 3px;
	width: var(--plyr-progress-marker-width, 3px);
	z-index: 3
}

.plyr__volume {
	align-items: center;
	display: flex;
	position: relative
}

.plyr__volume input[type=range] {
	margin-left: 5px;
	margin-left: calc(var(--plyr-control-spacing, 10px)/2);
	margin-right: 5px;
	margin-right: calc(var(--plyr-control-spacing, 10px)/2);
	max-width: 90px;
	min-width: 60px;
	position: relative;
	z-index: 2
}

.plyr--audio {
	display: block
}

.plyr--audio .plyr__controls {
	background: #fff;
	background: var(--plyr-audio-controls-background, #fff);
	border-radius: inherit;
	color: #4a5464;
	color: var(--plyr-audio-control-color, #4a5464);
	padding: 10px;
	padding: var(--plyr-control-spacing, 10px)
}

.plyr--audio .plyr__control:focus-visible,
.plyr--audio .plyr__control:hover,
.plyr--audio .plyr__control[aria-expanded=true] {
	background: #00b2ff;
	background: var(--plyr-audio-control-background-hover, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
	color: #fff;
	color: var(--plyr-audio-control-color-hover, #fff)
}

.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track {
	background-color: #c1c8d199;
	background-color: var(--plyr-audio-range-track-background, var(--plyr-audio-progress-buffered-background, #c1c8d199))
}

.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track {
	background-color: #c1c8d199;
	background-color: var(--plyr-audio-range-track-background, var(--plyr-audio-progress-buffered-background, #c1c8d199))
}

.plyr--full-ui.plyr--audio input[type=range]::-ms-track {
	background-color: #c1c8d199;
	background-color: var(--plyr-audio-range-track-background, var(--plyr-audio-progress-buffered-background, #c1c8d199))
}

.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb {
	box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33, 0 0 0 3px #23282f1a;
	box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33), 0 0 0 var(--plyr-range-thumb-active-shadow-width, 3px) var(--plyr-audio-range-thumb-active-shadow-color, #23282f1a)
}

.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb {
	box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33, 0 0 0 3px #23282f1a;
	box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33), 0 0 0 var(--plyr-range-thumb-active-shadow-width, 3px) var(--plyr-audio-range-thumb-active-shadow-color, #23282f1a)
}

.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb {
	box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33, 0 0 0 3px #23282f1a;
	box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33), 0 0 0 var(--plyr-range-thumb-active-shadow-width, 3px) var(--plyr-audio-range-thumb-active-shadow-color, #23282f1a)
}

.plyr--audio .plyr__progress__buffer {
	color: #c1c8d199;
	color: var(--plyr-audio-progress-buffered-background, #c1c8d199)
}

.plyr--video {
	overflow: hidden
}

.plyr--video.plyr--menu-open {
	overflow: visible
}

.plyr__video-wrapper {
	background: #000;
	background: var(--plyr-video-background, var(--plyr-video-background, #000));
	border-radius: inherit;
	margin: auto;
	overflow: hidden
}

.plyr__video-embed,
.plyr__video-wrapper--fixed-ratio {
	aspect-ratio: 16/9
}

@supports not (aspect-ratio:16/9) {

	.plyr__video-embed,
	.plyr__video-wrapper--fixed-ratio {
		height: 0;
		padding-bottom: 56.25%;
		position: relative
	}
}

.plyr__video-embed iframe,
.plyr__video-wrapper--fixed-ratio video {
	border: 0;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%
}

.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container {
	padding-bottom: 240%;
	position: relative;
	transform: translateY(-38.28125%)
}

.plyr--video .plyr__controls {
	background: linear-gradient(#0000, #000000bf);
	background: var(--plyr-video-controls-background, linear-gradient(#0000, #000000bf));
	border-bottom-left-radius: inherit;
	border-bottom-right-radius: inherit;
	bottom: 0;
	color: #fff;
	color: var(--plyr-video-control-color, #fff);
	left: 0;
	padding: 5px;
	padding: calc(var(--plyr-control-spacing, 10px)/2);
	padding-top: 20px;
	padding-top: calc(var(--plyr-control-spacing, 10px)*2);
	position: absolute;
	right: 0;
	transition: opacity .4s ease-in-out, transform .4s ease-in-out;
	z-index: 3
}

@media (min-width:480px) {
	.plyr--video .plyr__controls {
		padding: 10px;
		padding: var(--plyr-control-spacing, 10px);
		padding-top: 35px;
		padding-top: calc(var(--plyr-control-spacing, 10px)*3.5)
	}
}

.plyr--video.plyr--hide-controls .plyr__controls {
	opacity: 0;
	pointer-events: none;
	transform: translateY(100%)
}

.plyr--video .plyr__control:focus-visible,
.plyr--video .plyr__control:hover,
.plyr--video .plyr__control[aria-expanded=true] {
	background: #00b2ff;
	background: var(--plyr-video-control-background-hover, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
	color: #fff;
	color: var(--plyr-video-control-color-hover, #fff)
}

.plyr__control--overlaid {
	background: #00b2ff;
	background: var(--plyr-video-control-background-hover, var(--plyr-color-main, var(--plyr-color-main, #00b2ff)));
	border: 0;
	border-radius: 100%;
	color: #fff;
	color: var(--plyr-video-control-color, #fff);
	display: none;
	left: 50%;
	opacity: .9;
	padding: 15px;
	padding: calc(var(--plyr-control-spacing, 10px)*1.5);
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	transition: .3s;
	z-index: 2
}

.plyr__control--overlaid svg {
	left: 2px;
	position: relative
}

.plyr__control--overlaid:focus,
.plyr__control--overlaid:hover {
	opacity: 1
}

.plyr--playing .plyr__control--overlaid {
	opacity: 0;
	visibility: hidden
}

.plyr--full-ui.plyr--video .plyr__control--overlaid {
	display: block
}

.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track {
	background-color: #ffffff40;
	background-color: var(--plyr-video-range-track-background, var(--plyr-video-progress-buffered-background, #ffffff40))
}

.plyr--full-ui.plyr--video input[type=range]::-moz-range-track {
	background-color: #ffffff40;
	background-color: var(--plyr-video-range-track-background, var(--plyr-video-progress-buffered-background, #ffffff40))
}

.plyr--full-ui.plyr--video input[type=range]::-ms-track {
	background-color: #ffffff40;
	background-color: var(--plyr-video-range-track-background, var(--plyr-video-progress-buffered-background, #ffffff40))
}

.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb {
	box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33, 0 0 0 3px #ffffff80;
	box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33), 0 0 0 var(--plyr-range-thumb-active-shadow-width, 3px) var(--plyr-audio-range-thumb-active-shadow-color, #ffffff80)
}

.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb {
	box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33, 0 0 0 3px #ffffff80;
	box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33), 0 0 0 var(--plyr-range-thumb-active-shadow-width, 3px) var(--plyr-audio-range-thumb-active-shadow-color, #ffffff80)
}

.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb {
	box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33, 0 0 0 3px #ffffff80;
	box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33), 0 0 0 var(--plyr-range-thumb-active-shadow-width, 3px) var(--plyr-audio-range-thumb-active-shadow-color, #ffffff80)
}

.plyr--video .plyr__progress__buffer {
	color: #ffffff40;
	color: var(--plyr-video-progress-buffered-background, #ffffff40)
}

.plyr:fullscreen {
	background: #000;
	border-radius: 0 !important;
	height: 100%;
	margin: 0;
	width: 100%
}

.plyr:fullscreen video {
	height: 100%
}

.plyr:fullscreen .plyr__control .icon--exit-fullscreen {
	display: block
}

.plyr:fullscreen .plyr__control .icon--exit-fullscreen+svg {
	display: none
}

.plyr:fullscreen.plyr--hide-controls {
	cursor: none
}

@media (min-width:1024px) {
	.plyr:fullscreen .plyr__captions {
		font-size: 21px;
		font-size: var(--plyr-font-size-xlarge, 21px)
	}
}

.plyr--fullscreen-fallback {
	background: #000;
	border-radius: 0 !important;
	bottom: 0;
	height: 100%;
	left: 0;
	margin: 0;
	position: fixed;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 10000000
}

.plyr--fullscreen-fallback video {
	height: 100%
}

.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen {
	display: block
}

.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen+svg {
	display: none
}

.plyr--fullscreen-fallback.plyr--hide-controls {
	cursor: none
}

@media (min-width:1024px) {
	.plyr--fullscreen-fallback .plyr__captions {
		font-size: 21px;
		font-size: var(--plyr-font-size-xlarge, 21px)
	}
}

.plyr__ads {
	border-radius: inherit;
	bottom: 0;
	cursor: pointer;
	left: 0;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 0;
	z-index: -1
}

.plyr__ads>div,
.plyr__ads>div iframe {
	height: 100%;
	position: absolute;
	width: 100%
}

.plyr__ads:after {
	background: #23282f;
	border-radius: 2px;
	bottom: 10px;
	bottom: var(--plyr-control-spacing, 10px);
	color: #fff;
	content: attr(data-badge-text);
	font-size: 11px;
	padding: 2px 6px;
	pointer-events: none;
	position: absolute;
	right: 10px;
	right: var(--plyr-control-spacing, 10px);
	z-index: 3
}

.plyr__ads:empty:after {
	display: none
}

.plyr__cues {
	background: currentColor;
	display: block;
	height: 5px;
	height: var(--plyr-range-track-height, 5px);
	left: 0;
	opacity: .8;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 3px;
	z-index: 3
}

.plyr__preview-thumb {
	background-color: #fff;
	background-color: var(--plyr-tooltip-background, #fff);
	border-radius: 8px;
	border-radius: var(--plyr-menu-radius, 8px);
	bottom: 100%;
	box-shadow: 0 1px 2px #00000026;
	box-shadow: var(--plyr-tooltip-shadow, 0 1px 2px #00000026);
	margin-bottom: 10px;
	margin-bottom: calc(var(--plyr-control-spacing, 10px)/2*2);
	opacity: 0;
	padding: 3px;
	pointer-events: none;
	position: absolute;
	transform: translateY(10px) scale(.8);
	transform-origin: 50% 100%;
	transition: transform .2s ease .1s, opacity .2s ease .1s;
	z-index: 2
}

.plyr__preview-thumb--is-shown {
	opacity: 1;
	transform: translate(0) scale(1)
}

.plyr__preview-thumb:before {
	border-left: 4px solid #0000;
	border-left: var(--plyr-tooltip-arrow-size, 4px) solid #0000;
	border-right: 4px solid #0000;
	border-right: var(--plyr-tooltip-arrow-size, 4px) solid #0000;
	border-top: 4px solid #fff;
	border-top: var(--plyr-tooltip-arrow-size, 4px) solid var(--plyr-tooltip-background, #fff);
	bottom: -4px;
	bottom: calc(var(--plyr-tooltip-arrow-size, 4px)*-1);
	content: "";
	height: 0;
	left: calc(50% + var(--preview-arrow-offset));
	position: absolute;
	transform: translateX(-50%);
	width: 0;
	z-index: 2
}

.plyr__preview-thumb__image-container {
	background: #c1c8d1;
	border-radius: 7px;
	border-radius: calc(var(--plyr-menu-radius, 8px) - 1px);
	overflow: hidden;
	position: relative;
	z-index: 0
}

.plyr__preview-thumb__image-container img,
.plyr__preview-thumb__image-container:after {
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%
}

.plyr__preview-thumb__image-container:after {
	border-radius: inherit;
	box-shadow: inset 0 0 0 1px #00000026;
	content: "";
	pointer-events: none
}

.plyr__preview-thumb__image-container img {
	max-height: none;
	max-width: none
}

.plyr__preview-thumb__time-container {
	background: linear-gradient(#0000, #000000bf);
	background: var(--plyr-video-controls-background, linear-gradient(#0000, #000000bf));
	border-bottom-left-radius: 7px;
	border-bottom-left-radius: calc(var(--plyr-menu-radius, 8px) - 1px);
	border-bottom-right-radius: 7px;
	border-bottom-right-radius: calc(var(--plyr-menu-radius, 8px) - 1px);
	bottom: 0;
	left: 0;
	line-height: 1.1;
	padding: 20px 6px 6px;
	position: absolute;
	right: 0;
	z-index: 3
}

.plyr__preview-thumb__time-container span {
	color: #fff;
	font-size: 13px;
	font-size: var(--plyr-font-size-time, var(--plyr-font-size-small, 13px))
}

.plyr__preview-scrubbing {
	bottom: 0;
	filter: blur(1px);
	height: 100%;
	left: 0;
	margin: auto;
	opacity: 0;
	overflow: hidden;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
	transition: opacity .3s ease;
	width: 100%;
	z-index: 1
}

.plyr__preview-scrubbing--is-shown {
	opacity: 1
}

.plyr__preview-scrubbing img {
	height: 100%;
	left: 0;
	max-height: none;
	max-width: none;
	object-fit: contain;
	position: absolute;
	top: 0;
	width: 100%
}

.plyr--no-transition {
	transition: none !important
}

.plyr__sr-only {
	clip: rect(1px, 1px, 1px, 1px);
	border: 0 !important;
	height: 1px !important;
	overflow: hidden;
	padding: 0 !important;
	position: absolute !important;
	width: 1px !important
}

.plyr [hidden] {
	display: none !important
}

*,
:after,
:before {
	box-sizing: border-box
}

blockquote,
body,
dd,
dl,
figcaption,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
html,
li,
ol,
p,
ul {
	margin: 0;
	padding: 0
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-size: inherit;
	font-weight: 400
}

body,
html {
	height: 100%;
	width: 100%;
	-webkit-font-smoothing: antialiased;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

body {
	min-height: 100vh;
	scroll-behavior: smooth;
	text-rendering: optimizeSpeed
}

ol,
ul {
	list-style: none
}

a {
	color: inherit;
	text-decoration: none
}

img {
	display: block;
	max-width: 100%
}

button,
input,
select,
textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: none;
	border: none;
	color: inherit;
	font: inherit;
	outline: 0;
	overflow: auto;
	resize: none
}

@media(prefers-reduced-motion:reduce) {
	* {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: .01ms !important
	}
}

button,
input,
select,
textarea {
	background-color: transparent;
	border-radius: 0;
	padding: 0
}

button {
	color: inherit;
	cursor: pointer;
	font: inherit
}

address {
	font-size: inherit;
	font-style: normal;
	font-weight: 400
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

iframe {
	border: 0
}

:root {
	--color-background-primary: #133547;
	--color-background-secondary: #133547;
	--color-background-tertiary: #0b1e28;
	--color-background-brand: #0078d4;
	--color-neutral-white: #fff;
	--color-neutral-alpha-white-30: hsla(0, 0%, 100%, .3);
	--color-neutral-grey-96: #f5f5f5;
	--color-neutral-grey-90: #e6e6e6;
	--color-neutral-grey-84: #d6d6d6;
	--color-neutral-grey-85: #d5d5d5;
	--color-neutral-grey-80: #ccc;
	--color-neutral-grey-70: #b3b3b3;
	--color-neutral-grey-60: #999;
	--color-neutral-grey-50: grey;
	--color-neutral-grey-40: #666;
	--color-neutral-grey-32: #4d4d4d;
	--color-neutral-grey-24: #3d3d3d;
	--color-neutral-grey-20: #333;
	--color-neutral-grey-16: #282828;
	--color-neutral-grey-10: #171717;
	--color-neutral-grey-4: #0a0a0a;
	--color-neutral-grey-11: #1a1a1a;
	--color-neutral-black: #000;
	--color-neutral-alpha-black-60: rgba(0, 0, 0, .6);
	--color-neutral-alpha-black-20: rgba(0, 0, 0, .2);
	--color-light-base-1: #e9f6ff;
	--color-light-base-2: #dad1ec;
	--color-light-base-3: #e7e7f2;
	--color-hero-base-1: #807dc0;
	--color-hero-base-2: #8191cc;
	--color-carousel-category-mobile: #c1beff;
	--color-brand-blue-1: #0167b8;
	--color-brand-blue-2: #0f6cbd;
	--color-brand-blue-3: #3aa0fa;
	--color-brand-highlight: #4fe6ff;
	--color-brand-light-blue: #e9f6ff;
	--color-hero-dark-blue: #1b3073;
	--color-section-dark-navy: #0a1e2c;
	--color-campaign-blue-green-95: #e8ecee;
	--color-campaign-blue-green-90: #d1d9dd;
	--color-campaign-blue-green-85: #bac5cc;
	--color-campaign-blue-green-80: #a3b2bb;
	--color-campaign-blue-green-70: #748c98;
	--color-campaign-blue-green-60: #466576;
	--color-campaign-blue-green: #183f54;
	--color-campaign-blue-green-40: #133243;
	--color-campaign-blue-green-30: #0e2632;
	--color-campaign-blue-green-20: #0a1922;
	--color-campaign-blue-green-10: #050d11;
	--color-utilities-partner: #ff31b3;
	--color-brand-purple: #5257a4;
	--color-brand-purple-hover: #3c22e3;
	--color-surface-light-purple: #dfdeef;
	--color-gradient-purple-light: #8378de;
	--color-gradient-purple-deep: #5b52b8;
	--color-accent-1: #b6e5fe;
	--color-accent-2: #8f4490;
	--color-accent-3: #3c22e3;
	--color-microsoft-dark-teal-blue-60: #466576;
	--font-primary: "Segoe UI", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
	--container-width: 1500px;
	--distributor-container-width: 1600px;
	--padding-main-desktop: 80px;
	--padding-main-mobile: 24px;
	--corner-radius: 8px;
	--spacing-4: 4px;
	--spacing-8: 8px;
	--spacing-12: 12px;
	--spacing-16: 16px;
	--spacing-24: 24px;
	--spacing-40: 40px;
	--spacing-64: 64px;
	--spacing-80: 80px;
	--spacing-120: 120px;
	--grid-desktop-columns: 12;
	--grid-desktop-margin: 80px;
	--grid-desktop-gutter: 24px;
	--grid-mobile-columns: 4;
	--grid-mobile-margin: 24px;
	--grid-mobile-gutter: 16px;
	--padding-8: 8px;
	--padding-12: 12px;
	--padding-16: 16px;
	--padding-24: 24px;
	--padding-32: 32px;
	--padding-40: 40px
}

@font-face {
	font-family: Segoe UI;
	font-style: normal;
	font-weight: 400;
	src: url(../fonts/SegoeUI.ttf) format("truetype")
}

@font-face {
	font-family: Segoe UI;
	font-style: italic;
	font-weight: 400;
	src: url(../fonts/SegoeUIItalic.otf) format("opentype")
}

@font-face {
	font-family: Segoe UI;
	font-style: normal;
	font-weight: 600;
	src: url(../fonts/SegoeUISemibold.ttf) format("truetype")
}

@font-face {
	font-family: Segoe UI;
	font-style: italic;
	font-weight: 600;
	src: url(../fonts/SegoeUISemiboldItalic.otf) format("opentype")
}

@font-face {
	font-family: Segoe UI;
	font-style: normal;
	font-weight: 700;
	src: url(../fonts/SegoeUIBold.ttf) format("truetype")
}

@font-face {
	font-family: Segoe UI;
	font-style: italic;
	font-weight: 700;
	src: url(../fonts/SegoeUIBoldItalic.otf) format("opentype")
}

body {
	font-family: var(--font-primary)
}

.text-caption-2,
.text-caption-2-strong {
	font-size: 10px;
	font-weight: 400;
	line-height: 1.4
}

.text-caption-2-strong {
	font-weight: 600
}

.text-caption-1,
.text-caption-1-strong,
.text-caption-1-stronger {
	font-size: 12px;
	font-weight: 400;
	line-height: 1.33
}

.text-caption-1-strong {
	font-weight: 600
}

.text-caption-1-stronger {
	font-weight: 700
}

.form-field__input[type=email],
.form-field__input[type=text],
.form-field__label,
.text-body-1,
.text-body-1-strong,
.text-body-1-stronger {
	font-size: 14px;
	font-weight: 400;
	line-height: 1.43
}

.text-body-1-strong {
	font-weight: 600
}

.text-body-1-stronger {
	font-weight: 700
}

.skip-to-content-main-link span,
.text-body-2 {
	font-size: 16px;
	font-weight: 400;
	line-height: 1.375
}

[class*=text-body] p:not(:last-child) {
	margin-bottom: 1.25em
}

[class*=text-body] ul {
	list-style-type: disc;
	margin-left: 1em
}

.in-page-nav,
.text-subtitle-2 {
	font-size: 16px;
	font-weight: 600;
	line-height: 1.375
}

.text-subtitle-2-stronger {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.375
}

.text-subtitle-1 {
	font-size: 20px;
	font-weight: 600;
	line-height: 1.4
}

.text-title-3 {
	font-size: 24px;
	font-weight: 600;
	line-height: 1.33
}

@media(max-width:768px) {
	.text-title-3 {
		font-size: 20px;
		line-height: 1.4
	}
}

.text-title-2 {
	font-size: 28px;
	font-weight: 600;
	line-height: 1.285
}

@media(max-width:768px) {
	.text-title-2 {
		font-size: 24px;
		line-height: 1.33
	}
}

.text-title-1 {
	font-size: 32px;
	font-weight: 600;
	line-height: 1.25
}

@media(max-width:768px) {
	.text-title-1 {
		font-size: 28px;
		line-height: 1.435
	}
}

.text-title-large {
	font-size: 48px;
	font-weight: 600;
	line-height: 1.083
}

@media(max-width:768px) {
	.text-title-large {
		font-size: 32px;
		line-height: 1.25
	}
}

.text-display,
.text-display-strong {
	font-size: 50px;
	font-weight: 600;
	font-weight: 400;
	line-height: 1.25;
	line-height: 1.2
}

@media(max-width:768px) {

	.text-display,
	.text-display-strong {
		font-size: 32px;
		line-height: 1.25
	}
}

.text-display-strong {
	font-weight: 600
}

.text-display--distributor-hero {
	font-size: 48px;
	font-style: normal;
	font-weight: 400;
	line-height: 52px
}

@media(max-width:1024px) {
	.text-display--distributor-hero {
		font-size: 50px;
		letter-spacing: -1px;
		line-height: 60px
	}
}

.inline-product-name {
	white-space: nowrap
}

.content-card [class^=text-body] a,
.disclaimers a,
.faq__answer a,
.form-field__label a,
.inline-link {
	color: var(--color-brand-blue-1);
	text-decoration: underline;
	-webkit-text-decoration-skip-ink: none;
	text-decoration-skip-ink: none;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px
}

.text-gradient-light-blue-white {
	background: linear-gradient(90deg, var(--color-brand-blue-3) 0, var(--color-brand-light-blue) 100%);
	-webkit-background-clip: text;
	max-width: 100%;
	-webkit-text-fill-color: transparent;
	background-clip: text
}

.text-gradient-purple-blue {
	background: linear-gradient(90deg, var(--color-accent-2) 33.47%, var(--color-hero-dark-blue) 68.5%);
	-webkit-background-clip: text;
	max-width: 100%;
	-webkit-text-fill-color: transparent;
	background-clip: text
}

.text-gradient-white-light-blue {
	background: linear-gradient(90deg, #fff, #b6e5fe 56.72%);
	-webkit-background-clip: text;
	max-width: 100%;
	-webkit-text-fill-color: transparent;
	background-clip: text
}

.text-gradient-distributor {
	background: linear-gradient(90deg, #fff 1.71%, #c4e7ff 50.116%);
	-webkit-background-clip: text;
	max-width: 100%;
	-webkit-text-fill-color: transparent;
	background-clip: text
}

@media(max-width:768px) {
	.text-gradient-distributor {
		background: linear-gradient(90deg, #fff, #9fd8ff 82.692%);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		background-clip: text
	}
}

html {
	-webkit-text-size-adjust: 100%
}

body {
	color: var(--color-neutral-white)
}

.container,
.hero__container,
.in-page-nav__container,
.section__container {
	margin: 0 auto;
	max-width: var(--container-width);
	padding: 0 var(--padding-main-desktop)
}

@media(max-width:768px) {

	.container,
	.hero__container,
	.in-page-nav__container,
	.section__container {
		padding: 0 var(--padding-main-mobile)
	}
}

.distributor-container {
	margin: 0 auto;
	max-width: var(--distributor-container-width);
	padding: 0 var(--padding-main-desktop)
}

@media(max-width:768px) {
	.distributor-container {
		padding: 0 var(--padding-main-mobile)
	}
}

.distributor-container--top-features {
	padding: 0
}

.clearfix:after {
	clear: both;
	content: "";
	display: table
}

.corner-s {
	border-radius: 8px;
	isolation: isolate;
	overflow: hidden
}

.pin-spacer {
	background-color: var(--color-background-primary) !important
}

sup {
	font-size: .7em
}

.text-display sup {
	font-size: 21px
}

.parallax {
	will-change: transform
}

.parallax-wrapper {
	transform: scale(1.3);
	transform-origin: center
}

.footer,
.hero,
.section {
	max-width: 100vw;
	max-width: 100%
}

.skip-to-content-main-link {
	height: 1px;
	left: 0;
	overflow: hidden;
	position: absolute;
	top: 0;
	width: 1px
}

.skip-to-content-main-link span {
	color: var(--color-brand-blue-1);
	text-decoration: underline
}

.skip-to-content-main-link:active,
.skip-to-content-main-link:focus {
	align-items: center;
	background-color: var(--color-neutral-grey-90);
	display: flex;
	height: 102px;
	justify-content: center;
	overflow: visible;
	width: 100%;
	z-index: 10000
}

.text-dark {
	color: #000000 !important;
}

@media(max-width:600px) {
	.mobile-hide {
		display: none
	}
}

.ms-logo-icon {
	height: auto;
	width: auto
}

.icon {
	display: inline-block;
	height: 24px;
	vertical-align: middle;
	width: 24px
}

.icon svg {
	height: 100%;
	width: 100%;
	fill: currentColor
}

.icon svg use {
	pointer-events: none
}

.button {
	align-items: center;
	border: none;
	cursor: pointer;
	display: inline-flex;
	font-size: 16px;
	justify-content: center;
	line-height: 1;
	text-decoration: none;
	transition: background-color .3s ease;
	width: -moz-fit-content;
	width: fit-content
}

.button--campaign-primary,
.button--campaign-secondary,
.button--primary,
.button--secondary,
.button--small {
	border-radius: 4px;
	font-weight: 600;
	padding: 13.5px 16px
}

.button--primary {
	background: var(--color-neutral-white);
	color: var(--color-hero-dark-blue)
}

.has-hovers .button--primary:hover {
	background: #d9deec
}

.button--primary:active {
	background: #bec7e4
}

.button--secondary {
	background: var(--color-hero-dark-blue);
	color: var(--color-neutral-white)
}

.has-hovers .button--secondary:hover {
	background: var(--color-brand-purple)
}

.button--secondary:active {
	background: #302b5f
}

.button--primary-outline {
	background: var(--color-neutral-white);
	border: 1px solid var(--color-hero-base-1);
	color: var(--color-hero-dark-blue);
	font-weight: 600;
	line-height: 22px;
	padding: 5.86px 21px
}

.has-hovers .button--primary-outline:hover {
	background: #d9deec
}

.button--primary-outline:active {
	background: #bec7e4
}

.button--secondary-outline {
	background: var(--color-hero-dark-blue);
	border: 1px solid var(--color-neutral-white);
	color: var(--color-neutral-white);
	font-weight: 600;
	line-height: 22px;
	padding: 5.86px 21px
}

.has-hovers .button--secondary-outline:hover {
	background: var(--color-brand-purple)
}

.button--secondary-outline:active {
	background: #302b5f
}

.button--tertiary {
	align-items: center;
	-webkit-backdrop-filter: blur(29.8050003052px);
	backdrop-filter: blur(29.8050003052px);
	background: linear-gradient(263deg, rgba(10, 30, 44, .5) -100%, rgba(10, 30, 44, .12));
	border-radius: 8px;
	color: var(--color-neutral-white);
	display: flex;
	font-size: 14px;
	font-weight: 600;
	justify-content: center;
	line-height: 20px;
	min-height: 48px;
	padding: 8px 13px
}

.has-hovers .button--tertiary:hover {
	background: linear-gradient(263deg, rgba(10, 30, 44, .75) -100%, rgba(10, 30, 44, .18))
}

.button--tertiary:active {
	background: linear-gradient(263deg, var(--color-section-dark-navy) -100%, rgba(10, 30, 44, .24) 100%)
}

.button--campaign-primary,
.button--campaign-secondary {
	background: #dfdeef;
	border-radius: 8px;
	isolation: isolate;
	overflow: hidden;
	position: relative
}

.button--campaign-primary:after,
.button--campaign-secondary:after {
	background: radial-gradient(100% 163.88% at 100% 0, hsla(0, 0%, 100%, .24) 0, hsla(0, 0%, 100%, .08) 100%);
	content: "";
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	transition: all .3s ease;
	width: 100%
}

.has-hovers .button--campaign-primary:hover:after,
.has-hovers .button--campaign-secondary:hover:after {
	opacity: 1
}

.button--campaign-primary:active:after,
.button--campaign-secondary:active:after {
	background: radial-gradient(100% 163.88% at 100% 0, hsla(0, 0%, 100%, .48) 0, hsla(0, 0%, 100%, .16) 100%);
	opacity: 1
}

.button--campaign-primary {
	background: #dfdeef;
	color: var(--color-neutral-black);
	padding: 12.5px 16px
}

.has-hovers .button--campaign-primary:hover {
	background: var(--color-surface-light-purple)
}

.button--campaign-primary:active {
	background: #c7c5dd
}

@media(max-width:1023px) {
	.button--campaign-primary {
		background: var(--color-hero-dark-blue);
		color: var(--color-neutral-white);
		transition: background-color .3s ease
	}

	.has-hovers .button--campaign-primary:hover {
		background: var(--color-brand-purple)
	}

	.button--campaign-primary:focus-visible {
		outline: 2px dashed var(--color-neutral-white) !important
	}
}

.button--small {
	padding: 5px 8px
}

.button--distributor-hero {
	height: 48px;
	padding: 16px 24px;
	width: 192px
}

.button:disabled {
	background: #141414;
	color: #5c5c5c;
	cursor: not-allowed
}

a:focus-visible {
	outline: .1875rem dotted currentColor
}

.button:focus-visible,
[role=button]:focus-visible,
button:focus-visible {
	outline: .1875rem dotted currentColor;
	outline-offset: -8px
}

.section--banner {
	display: flex;
	flex-direction: row;
	gap: 114px
}

@media(max-width:1024px) {
	.section--banner {
		flex-direction: column;
		gap: 24px
	}
}

.section--banner__content {
	display: flex;
	flex-direction: column;
	gap: 16px;
	max-width: 660px
}

@media(max-width:1024px) {
	.section--banner__content {
		gap: 24px
	}
}

.section--banner__content h2 {
	letter-spacing: -1px
}

@media(max-width:1024px) {
	.section--banner__content h2 {
		font-size: 36px;
		letter-spacing: normal;
		line-height: 40px
	}
}

.section--banner__content p {
	font-weight: 400
}

@media(max-width:1024px) {
	.section--banner__content p {
		font-size: 21px;
		font-weight: 600;
		line-height: 25.2px
	}
}

.section--banner__download {
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	background: hsla(0, 0%, 100%, .08);
	border: 1px solid var(--color-neutral-white);
	border-radius: 8px;
	display: flex;
	flex-direction: row;
	gap: 32px;
	max-width: 588px;
	padding: 31px 34px
}

@media(max-width:1024px) {
	.section--banner__download {
		flex-direction: column;
		gap: 16px;
		max-width: 100%;
		padding: 17.39px 24.13px
	}
}

.section--banner__download-item {
	height: 62px;
	width: 82px
}

@media(max-width:1024px) {
	.section--banner__download-item {
		height: 46px;
		width: 46px
	}
}

.section--banner__download-item img {
	height: 100%;
	width: 100%
}

.section--banner__download-content {
	display: flex;
	flex-direction: column;
	gap: 24px;
	max-width: 70%
}

@media(max-width:1024px) {
	.section--banner__download-content {
		gap: 16px;
		max-width: 100%
	}
}

.section--banner__download-text {
	font-size: 21px;
	font-weight: 600;
	line-height: 25.2px
}

@media(max-width:1024px) {
	.section--banner__download-text {
		font-size: 16px;
		font-weight: 400;
		line-height: 22px
	}
}

.section--banner__download a {
	padding: 16px 24px
}

@media(max-width:1024px) {
	.section--banner__download a {
		font-size: 8.978px;
		line-height: 12.345px;
		padding: 8.98px 13.47px
	}
}

.sticky-banner {
	background: rgba(10, 30, 44, .85);
	border-top: 1px solid #c1c1c1;
	bottom: 0;
	color: var(--color-neutral-white);
	left: 0;
	position: fixed;
	transform: translateY(100%);
	transition: transform .3s ease-in-out;
	width: 100%;
	z-index: 1000
}

.sticky-banner.show {
	transform: translateY(0)
}

.sticky-banner.hide {
	transform: translateY(100%)
}

.sticky-banner__container {
	align-items: center;
	display: flex;
	height: 75px;
	justify-content: end;
	margin-right: 46px
}

@media(max-width:600px) {
	.sticky-banner__container {
		height: 80px;
		margin: 0 14px
	}

	.sticky-banner__container--distributor {
		justify-content: center
	}

	.sticky-banner__button {
		min-width: 100%
	}

	.sticky-banner__button--distributor {
		border-radius: 8px;
		font-size: 19px;
		min-width: unset;
		padding: 16px 24px;
		width: -moz-fit-content;
		width: fit-content
	}
}

body {
	padding-bottom: 60px
}

@media(max-width:600px) {
	body {
		padding-bottom: 64px
	}
}

.content-card-container {
	display: flex;
	gap: 24px
}

.content-card-container--pillars {
	align-items: flex-start;
	justify-content: center
}

.content-card {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 24px
}

.content-card .image {
	border-radius: 10px;
	overflow: hidden;
	width: 100%
}

.content-card p+p {
	margin-top: 16px
}

.content-card [class^=disclaimer-sup].text-neutral-white a {
	color: #fff;
	text-decoration: none
}

.content-card [class^=disclaimer-sup].text-neutral-black a {
	color: var(--color-neutral-black);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 1px
}

.content-card--image-top {
	flex: 1 1 0;
	gap: 0;
	max-width: 448px;
	min-width: 300px
}

.content-card--image-top .content-card__image {
	border-radius: 8px;
	height: 261px;
	overflow: hidden;
	position: relative;
	width: 100%
}

.content-card--image-top .content-card__image img {
	display: block;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	width: 100%
}

.content-card--image-top .content-card__content {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding-top: 24px
}

.content-card--image-top .content-card__content--pillars {
	gap: 24px;
	padding-top: 0
}

.content-card [class^=text-body] .content-card--image-top .content-card__content a,
.content-card--image-top .content-card__content .content-card [class^=text-body] a,
.content-card--image-top .content-card__content .inline-link {
	align-items: center;
	color: var(--color-hero-dark-blue, #1b3073);
	display: inline-flex;
	font-weight: 600;
	gap: 4px;
	text-decoration: none;
	transition: gap .2s ease
}

.content-card [class^=text-body] .content-card--image-top .content-card__content a:hover,
.content-card--image-top .content-card__content .content-card [class^=text-body] a:hover,
.content-card--image-top .content-card__content .inline-link:hover {
	gap: 8px;
	text-decoration: underline
}

.content-card [class^=text-body] .content-card--image-top .content-card__content a.inline-link--blue,
.content-card--image-top .content-card__content .content-card [class^=text-body] a.inline-link--blue,
.content-card--image-top .content-card__content .inline-link.inline-link--blue {
	color: var(--color-hero-dark-blue, #1b3073);
	font-size: 16px;
	line-height: 1;
	padding: 6px 2px;
	width: -moz-fit-content;
	width: fit-content
}

.content-card [class^=text-body] .content-card--image-top .content-card__content a.inline-link--blue .icon,
.content-card--image-top .content-card__content .content-card [class^=text-body] a.inline-link--blue .icon,
.content-card--image-top .content-card__content .inline-link.inline-link--blue .icon {
	align-items: center;
	display: flex;
	height: 14px;
	justify-content: center;
	transform: scaleY(-1);
	width: 14px
}

.content-card [class^=text-body] .content-card--image-top .content-card__content a.inline-link--blue .icon svg,
.content-card--image-top .content-card__content .content-card [class^=text-body] a.inline-link--blue .icon svg,
.content-card--image-top .content-card__content .inline-link.inline-link--blue .icon svg {
	display: block;
	height: 100%;
	width: 100%
}

.content-card [class^=text-body] .content-card--image-top .content-card__content a.inline-link--purple,
.content-card--image-top .content-card__content .content-card [class^=text-body] a.inline-link--purple,
.content-card--image-top .content-card__content .inline-link.inline-link--purple {
	color: var(--color-brand-purple);
	font-size: 16px;
	line-height: 16px
}

.content-card [class^=text-body] .content-card--image-top .content-card__content a.inline-link--purple:hover,
.content-card--image-top .content-card__content .content-card [class^=text-body] a.inline-link--purple:hover,
.content-card--image-top .content-card__content .inline-link.inline-link--purple:hover {
	color: var(--color-brand-purple-hover);
	text-decoration: none
}

.content-card [class^=text-body] .content-card--image-top .content-card__content a .icon,
.content-card--image-top .content-card__content .content-card [class^=text-body] a .icon,
.content-card--image-top .content-card__content .inline-link .icon {
	height: 16px;
	min-width: 16px;
	width: 14px
}

.content-card [class^=text-body] .content-card--image-top .content-card__content a .icon svg,
.content-card--image-top .content-card__content .content-card [class^=text-body] a .icon svg,
.content-card--image-top .content-card__content .inline-link .icon svg {
	height: 100%;
	width: 100%
}

@media(max-width:1024px) {
	.content-card-container {
		align-items: center;
		flex-direction: column
	}

	.content-card-container--pillars {
		align-items: stretch;
		gap: 24px
	}

	.content-card,
	.content-card--image-top {
		max-width: 100%
	}
}

@media(max-width:768px) {
	.content-card--image-top .content-card__image {
		border-radius: 6px;
		height: 184px
	}

	.content-card--image-top .content-card__content {
		gap: 16px
	}

	.content-card--image-top .content-card__content .text-title-3 {
		font-size: 20px;
		line-height: 28px
	}

	.content-card--image-top .content-card__content .text-body-2 {
		font-size: 16px;
		line-height: 22px
	}

	.content-card--image-top .content-card__content--pillars,
	.content-card--image-top .content-card__content--pillars-text {
		gap: 8px
	}
}

.carousel-card {
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	background: linear-gradient(180deg, rgba(10, 30, 44, 0), rgba(10, 30, 44, .75)), linear-gradient(90deg, hsla(0, 0%, 100%, .17), hsla(0, 0%, 100%, .17));
	border-radius: 8px;
	display: flex;
	flex-direction: column;
	gap: 26.03px;
	height: 100%;
	overflow: hidden;
	padding-bottom: 42px;
	padding-top: 12px
}

.carousel-card__image {
	border-radius: 8px;
	flex-shrink: 0;
	height: auto;
	margin: 0 auto;
	overflow: hidden;
	padding-left: 12px;
	padding-right: 12px;
	width: 100%
}

.carousel-card__image img {
	border-radius: 8px;
	display: block;
	height: auto;
	-o-object-fit: cover;
	object-fit: cover;
	width: 100%
}

.carousel-card__content {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 6.51px;
	justify-content: flex-start;
	padding: 0 24px
}

.carousel-card__category {
	align-items: center;
	color: var(--color-light-base-2);
	display: flex;
	font-family: Segoe UI, sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .96px;
	line-height: 14px;
	text-transform: uppercase
}

.carousel-card__title {
	color: #f2f2f2;
	font-size: 24px;
	font-weight: 600;
	line-height: 32px
}

.carousel-card__description,
.carousel-card__title {
	font-family: Segoe UI, sans-serif;
	font-style: normal;
	margin: 0
}

.carousel-card__description {
	color: var(--color-neutral-white);
	font-size: 20px;
	font-weight: 400;
	letter-spacing: -.48px;
	line-height: 28px
}

.swiper-slide--offset {
	padding-top: 72px
}

.swiper-slide--offset .carousel-card__category {
	margin-top: 22px
}

@media(width:375px) {
	.swiper-slide--offset {
		padding-top: 58.576px
	}

	.carousel-card {
		height: 450px;
		padding-bottom: 34.169px;
		padding-top: 9.763px
	}

	.carousel-card__image {
		height: auto;
		width: 100%
	}

	.carousel-card__content {
		padding: 0 19.53px
	}

	.carousel-card__category {
		color: var(--color-carousel-category-mobile)
	}

	.carousel-card__title {
		font-size: 19.525px;
		font-style: normal;
		font-weight: 600;
		line-height: 26.034px
	}

	.carousel-card__description {
		font-size: 16px;
		font-style: normal;
		font-weight: 400;
		letter-spacing: -.48px;
		line-height: 22px
	}
}

@media(width:1600px) {
	.swiper-slide--offset {
		padding-top: 72px
	}

	.swiper-slide--offset .carousel-card__category {
		margin-top: 28px
	}

	.carousel-card {
		gap: 32px;
		height: 540px;
		padding-bottom: 42px;
		padding-top: 12px
	}

	.carousel-card__image {
		height: auto;
		min-width: 336px
	}

	.carousel-card__content {
		gap: 8px;
		padding: 32px 24px 0
	}

	.carousel-card__category {
		font-size: 12px;
		letter-spacing: .96px;
		line-height: 14px
	}

	.carousel-card__title {
		font-size: 24px;
		font-style: normal;
		font-weight: 600;
		line-height: 32px
	}

	.carousel-card__description {
		font-size: 20px;
		font-style: normal;
		font-weight: 400;
		letter-spacing: -.48px;
		line-height: 28px
	}
}

@media(max-width:480px) {
	.swiper-slide--offset {
		padding-top: 58.576px
	}

	.carousel-card {
		height: 450px;
		padding-bottom: 34.169px;
		padding-top: 9.763px
	}

	.carousel-card__image {
		height: auto;
		width: 100%
	}

	.carousel-card__content {
		padding: 0 19.53px
	}

	.carousel-card__category {
		color: var(--color-carousel-category-mobile)
	}

	.carousel-card__title {
		font-size: 19.525px;
		font-style: normal;
		font-weight: 600;
		line-height: 26.034px
	}

	.carousel-card__description {
		font-size: 16px;
		font-style: normal;
		font-weight: 400;
		letter-spacing: -.48px;
		line-height: 22px
	}
}

@media(min-width:1400px) {
	.swiper-slide--offset {
		padding-top: 72px
	}

	.swiper-slide--offset .carousel-card__category {
		margin-top: 26px
	}

	.carousel-card {
		gap: 32px;
		height: 540px;
		padding-bottom: 42px;
		padding-top: 12px
	}

	.carousel-card__image {
		height: auto;
		min-width: 336px
	}

	.carousel-card__content {
		gap: 8px;
		padding: 0 24px
	}

	.carousel-card__category {
		font-size: 12px;
		letter-spacing: .96px;
		line-height: 14px;
		margin-bottom: 0
	}

	.carousel-card__title {
		font-size: 24px;
		font-style: normal;
		font-weight: 600;
		line-height: 32px
	}

	.carousel-card__description {
		font-size: 20px;
		font-style: normal;
		font-weight: 400;
		letter-spacing: -.48px;
		line-height: 28px
	}
}

.product-card-container {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(3, 1fr)
}

.product-card {
	background: hsla(0, 0%, 100%, .04);
	border-radius: var(--corner-radius);
	padding: 16px
}

.product-card__image {
	align-items: center;
	aspect-ratio: 432/324;
	border-radius: 4px;
	display: flex;
	justify-content: center;
	margin-bottom: 16px;
	overflow: hidden
}

.product-card__image img {
	width: 100%
}

.product-card__content {
	display: flex;
	gap: 24px
}

.product-card__info {
	display: flex;
	flex-direction: column;
	gap: 8px
}

.product-card__cta {
	align-self: flex-end;
	white-space: nowrap
}

@media(max-width:1400px) {
	.product-card__content {
		flex-direction: column
	}

	.product-card__cta {
		align-self: flex-start
	}
}

@media(max-width:1024px) {
	.product-card-container {
		grid-template-columns: repeat(2, 1fr)
	}
}

@media(max-width:600px) {
	.product-card-container {
		grid-template-columns: 1fr
	}

	.product-card__image {
		aspect-ratio: 295/221
	}
}

.image {
	border-radius: 10px
}

.swiper {
	opacity: 0;
	position: relative
}

.swiper.swiper-initialized {
	opacity: 1
}

.swiper-wrapper {
	box-sizing: content-box;
	display: flex;
	height: -moz-max-content;
	height: max-content;
	position: relative;
	transform: translateZ(0);
	transition-property: transform;
	transition-timing-function: cubic-bezier(.33, 1, .68, 1);
	width: 100%;
	will-change: transform, opacity;
	z-index: 1
}

.swiper-fade .swiper-slide,
.swiper-fade .swiper-wrapper {
	transition-property: opacity
}

.swiper-fade .swiper-slide {
	opacity: 0
}

.swiper-slide {
	flex-shrink: 0;
	height: -moz-max-content;
	height: max-content;
	min-height: 162px;
	pointer-events: auto;
	position: relative;
	transform: translateZ(0);
	transition-property: transform;
	width: 100%
}

.swiper-slide[aria-hidden=true] [tabindex]:not([tabindex="-1"]),
.swiper-slide[aria-hidden=true] a,
.swiper-slide[aria-hidden=true] button,
.swiper-slide[aria-hidden=true] input,
.swiper-slide[aria-hidden=true] select,
.swiper-slide[aria-hidden=true] textarea {
	pointer-events: none
}

.swiper-slide[aria-hidden=true] [tabindex]:not([tabindex="-1"]):focus,
.swiper-slide[aria-hidden=true] a:focus,
.swiper-slide[aria-hidden=true] button:focus,
.swiper-slide[aria-hidden=true] input:focus,
.swiper-slide[aria-hidden=true] select:focus,
.swiper-slide[aria-hidden=true] textarea:focus {
	outline: none
}

/*.form {
	display:grid;
	gap:24px;
	grid-template-columns:1fr 1fr;
	max-width:100%;
	width:464px
}*/
.form button[type=submit] {
	justify-self: start;
	width: auto
}

.form-field {
	display: flex;
	flex-direction: column;
	gap: 8px;
	grid-column: span 2;
	width: 100%
}

.form-field__label {
	order: -1
}

.form-field__label a {
	color: inherit
}

.form-field__input[type=email],
.form-field__input[type=text] {
	background-color: var(--color-neutral-white);
	border-radius: 8px;
	color: var(--color-neutral-black);
	padding: 16px;
	width: 100%
}

.form-field__input[type=checkbox]+label {
	border-radius: 8px;
	padding-left: 36px;
	position: relative
}

.form-field__input[type=checkbox]+label:after,
.form-field__input[type=checkbox]+label:before {
	border-radius: 4px;
	box-sizing: border-box;
	content: "";
	display: block;
	height: 16px;
	left: 8px;
	position: absolute;
	top: 8px;
	width: 16px
}

.form-field__input[type=checkbox]+label:before {
	border: 1px solid #fff;
	z-index: 1
}

.form-field__input[type=checkbox]:checked+label:before {
	background-color: var(--color-background-brand);
	border-color: var(--color-background-brand)
}

.form-field__input[type=checkbox]:checked+label:after {
	background-color: #fff;
	-webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='6' fill='none' viewBox='0 0 8 6'%3E%3Cpath fill='%23fff' d='M7.765.205a.75.75 0 0 1 .03 1.06l-4.25 4.5a.75.75 0 0 1-1.075.015L.22 3.53a.75.75 0 1 1 1.06-1.06l1.705 1.704L6.705.235a.75.75 0 0 1 1.06-.03'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='6' fill='none' viewBox='0 0 8 6'%3E%3Cpath fill='%23fff' d='M7.765.205a.75.75 0 0 1 .03 1.06l-4.25 4.5a.75.75 0 0 1-1.075.015L.22 3.53a.75.75 0 1 1 1.06-1.06l1.705 1.704L6.705.235a.75.75 0 0 1 1.06-.03'/%3E%3C/svg%3E");
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 8px 6px;
	mask-size: 8px 6px;
	z-index: 2
}

.form-field__input:focus-visible {
	box-shadow: inset 0 0 0 2px #fff, inset 0 0 0 5px #5257a4
}

.form-field__input:focus-visible[type=checkbox]+label {
	box-shadow: inset 0 0 0 2px #fff, inset 0 0 0 5px #5257a4
}

.form-field--50 {
	grid-column: span 1
}

@media(max-width:1024px) {
	.form {
		margin-bottom: 40px
	}

	.form-field--50 {
		grid-column: span 2
	}
}

:root {
	--plyr-color-main: var(--color-brand-blue-3);
	--plyr-font-family: var(--font-primary)
}

.media-video {
	position: relative
}

.media-video,
.media-video__media,
.media-video__wrapper {
	height: 100%;
	width: 100%
}

.media-video__media {
	background: #000;
	display: block;
	-o-object-fit: cover;
	object-fit: cover
}

.plyr {
	height: 100%;
	width: 100%
}

.plyr__poster {
	background-color: transparent !important;
	background-position: 50% !important;
	background-repeat: no-repeat !important;
	background-size: cover !important;
	height: 100% !important;
	left: 0;
	pointer-events: none;
	position: absolute;
	top: 0;
	width: 100% !important
}

.plyr__video-wrapper {
	background: none !important;
	border: none !important;
	height: 100%;
	position: relative;
	width: 100%
}

.header {
	align-items: center;
	background: var(--color-neutral-white);
	display: flex;
	height: 80px
}

.header .container {
	width: 100%
}

@media(max-width:768px) {
	.header {
		height: 122px
	}
}

.header-logos {
	align-items: center;
	display: flex;
	justify-content: space-between
}

@media(max-width:768px) {
	.header-logos {
		align-items: flex-start;
		flex-direction: column;
		gap: var(--padding-16);
		justify-items: flex-start
	}
}


/* form section*/
.bg-black {
	background: #000000 !important;
}

.form-field label {
	display: block;
	color: #cacaca;
	margin-bottom: 5px;
	cursor: pointer;
}

.form-check-label {
	display: block;
	color: #cacaca;
	margin-bottom: 5px;
	cursor: pointer;
}

.form-field input {
	color: #f3f3f3;
	background-color: #000000;
	border: solid 1px #dadada;
	padding: 10px;
	margin-bottom: 5px;
	display: block;
	width: 100%;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
}

.form-field input::placeholder {
	color: #464646;
}

.form-field input:focus {
	outline: none;
}

.form-field.error input {
	border-color: #282833;
}

.form-field.success input {
	border-color: #00ad5f;
}

.form-field .errorMessage {
	color: #f84153;
}

.form-check.error input {
	border-color: #f84153;
}

.form-check.success input {
	border-color: #00ad5f;
}

.form-check .errorMessage {
	color: #f84153;
}

.form-check a {
	color: #202020;
}

.form-check a:hover,
.form-check a:active,
.form-check a:focus {
	color: #0A58CA;
}

.form-field label span {
	color: #f84153;
	padding-left: 2px;
}

.form-check label u {
	color: #67bafa !important;
}

.form-field select {
	color: #f3f3f3;
	background-color: #000000;
	border: solid 1px #dadada;
	padding: 10px;
	margin-bottom: 15px;
	display: block;
	width: 100%;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
}

.form-field select:focus {
	color: #212529;
	background-color: #ffffff;
}

.form-field small {
	color: #f84153;
}

.form-select {
	background-image: url('../images/arw.svg');
}


.header-logos__microsoft-logo {
	padding: 2px
}

.header-logos__microsoft-logo:focus,
.header-logos__microsoft-logo:focus-visible {
	outline: 1px dashed var(--color-hero-dark-blue)
}

.section {
	padding: 80px 0
}

.footer {
	padding: 30px 0
}

.section {
	background-color: var(--color-campaign-blue-green);
	color: var(--color-neutral-white);
	scroll-margin-top: 96px !important
}

.section__header {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 24px;
	margin: 0 auto 64px;
	max-width: 847px;
	text-align: center
}

.section__header-logo {
	max-height: 56px;
	width: auto
}

.section__header [class^=text-body] {
	max-width: 700px
}

.section__content {
	display: flex;
	flex-direction: column;
	gap: 24px;
	text-align: left
}

.section__image {
	border-radius: 10px;
	overflow: hidden;
	width: 100%
}

.section__image img {
	width: 100%
}

.section__columns {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	justify-content: space-evenly;
	margin: 40px auto 0
}

.section__columns .card {
	flex: 1
}

.section__icon-list {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(2, 1fr)
}

.section--50 .section__container,
.section--icon-list .section__container {
	align-items: center;
	display: grid;
	gap: 40px;
	grid-template-columns: 1fr 1fr
}

.section--50 .section__header,
.section--icon-list .section__header {
	align-items: flex-start;
	text-align: left
}

.section--1-2 .section__container {
	display: grid;
	gap: 24px;
	grid-template-columns: 1fr 2fr
}

.section--1-2 .section__header {
	align-items: flex-start;
	text-align: left
}

@media(min-width:1025px) {
	.section--1-2 .section__header {
		align-self: start;
		margin-bottom: 0;
		position: sticky;
		top: 16px
	}
}

.section--highlight .section__container {
	display: flex;
	gap: 40px
}

.section--icon-list {
	position: relative
}

.section--icon-list .section__container {
	align-items: start
}

.section--icon-list .section__header {
	position: sticky;
	top: 40px
}

.section--feature-content {
	padding: 40px 0
}

.section--feature-content .section__header {
	margin: 0 auto;
	max-width: 100%;
	text-align: center
}

.section--feature-content .section__header .text-display {
	max-width: 16em
}

@media(max-width:1024px) {
	.section__image {
		border-radius: 0
	}

	.section__columns {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		margin-top: 24px
	}

	.section--icon-list .section__header {
		position: static
	}

	.section--icon-list .section__icon-list {
		grid-template-columns: repeat(3, 1fr)
	}

	.section--1-2 .section__container,
	.section--icon-list .section__container {
		grid-template-columns: 1fr
	}

	.section--1-2 .section__header,
	.section--icon-list .section__header {
		align-items: center;
		text-align: center
	}

	.section--50 .section__container {
		align-items: start;
		grid-template-columns: 2fr 3fr
	}
}

@media(max-width:768px) {
	.section {
		padding: 40px 0 64px
	}

	.section__header-logo {
		max-height: 32px
	}

	.section--feature-content {
		padding: 64px 0 40px
	}

	.section--feature-content .section__header {
		text-align: left
	}

	.section--icon-list .section__icon-list {
		grid-template-columns: repeat(2, 1fr)
	}

	.section--1-2 .section__header {
		align-items: flex-start;
		text-align: left
	}

	.section--50 .section__container {
		grid-template-columns: 1fr
	}
}

@media(max-width:600px) {
	.section__header {
		align-items: flex-start;
		margin: 0 auto 40px;
		text-align: left
	}

	.section--icon-list .section__icon-list,
	.section__columns {
		grid-template-columns: 1fr
	}

	.section--1-2 .section__header,
	.section--icon-list .section__header {
		align-items: flex-start;
		text-align: left
	}

	.section--pillars {
		padding: 40px 24px 64px
	}

	.section--pillars .container,
	.section--pillars .section__container {
		padding: 0
	}

	.section--pillars .section__header {
		align-items: flex-start;
		margin-bottom: 24px;
		text-align: left
	}

	.section--icon-cards {
		padding: 48px 24px
	}

	.section--icon-cards .section__header {
		align-items: flex-start;
		margin-bottom: 24px;
		text-align: left
	}

	.section--50 {
		padding-top: 0
	}

	.section--50 .section__container {
		padding: 0
	}

	.section--50 .section__image {
		border-radius: 0
	}

	.section--50 .section__content {
		padding: 0 var(--padding-main-mobile)
	}
}

.section--top-features {
	background-color: #0a1e2c;
	padding: 80px 0
}

.section--top-features .section__header {
	margin-bottom: 63px;
	max-width: 900px
}

.section--top-features .section__header h2 {
	font-size: 50px;
	font-weight: 400;
	letter-spacing: -1px;
	line-height: 65px
}

.section--top-features .section__header-title--desktop,
.section--top-features .section__header-title--mobile {
	align-items: center;
	flex-direction: column;
	justify-content: center
}

.section--top-features .section__header-title--desktop {
	display: flex
}

.section--top-features .section__header-title--desktop span {
	display: block
}

.section--top-features .section__header-title--mobile {
	display: none
}

.section--top-features .section__header-title--mobile span {
	display: block
}

.section--top-features .section__header p {
	font-size: 16px;
	line-height: 22px
}

.section--top-features .section__header [class^=text-body] {
	max-width: 100%
}

.section--top-features .section__header .text-gradient-light-blue-white {
	background: linear-gradient(90deg, #3aa0fa, #e9f6ff);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text
}

.section--top-features .manual-carousel__contents-swiper {
	overflow: visible;
	padding-right: 2px
}

.section--top-features .manual-carousel__footer {
	margin-top: 40px
}

@media(max-width:768px) {
	.section--top-features {
		padding: 40px 0 64px
	}

	.section--top-features .section__header {
		margin-bottom: 40px;
		padding: 0 24px;
		text-align: center
	}

	.section--top-features .section__header h2 {
		font-size: 32px;
		line-height: 42px
	}

	.section--top-features .section__header-title--desktop {
		display: none
	}

	.section--top-features .section__header-title--mobile {
		display: flex;
		width: 100%
	}

	.section--top-features .manual-carousel__footer {
		margin-top: 24px
	}
}

.faq {
	padding: 80px 0
}

.faq__header {
	align-items: flex-start;
	display: flex;
	flex-direction: column;
	gap: 48px
}

.faq__header h2 {
	color: var(--color-neutral-black);
	font-family: var(--font-primary);
	font-size: 50px;
	font-weight: 600;
	line-height: 60px
}

.faq__controls {
	align-items: center;
	display: flex;
	gap: 0;
	height: 40px
}

.faq__controls-separator {
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px
}

.faq__collapse-all,
.faq__expand-all {
	background: none;
	border: none;
	color: var(--color-brand-blue-1);
	cursor: pointer;
	font-family: var(--font-primary);
	font-size: 16px;
	font-weight: 600;
	line-height: 22px;
	padding: 12px 14px 12px 21px;
	-webkit-text-decoration-skip-ink: none;
	text-decoration-skip-ink: none;
	text-underline-position: from-font
}

.faq__collapse-all:hover,
.faq__expand-all:hover {
	opacity: .8;
	text-decoration: underline
}

.faq__items {
	display: flex;
	flex-direction: column;
	margin-top: 12px
}

.faq__item {
	border-top: 1px solid var(--color-neutral-grey-70);
	padding: 0
}

.faq__question {
	align-items: center;
	background: none;
	border: none;
	border-radius: 2px;
	color: var(--color-neutral-black);
	cursor: pointer;
	display: flex;
	font-family: var(--font-primary);
	font-size: 16px;
	font-weight: 600;
	gap: 7px;
	line-height: 22px;
	padding: 26px 22px 26px 14px;
	position: relative;
	text-align: left;
	width: 100%
}

.faq__question .icon {
	align-items: center;
	display: flex;
	flex-shrink: 0;
	height: 24px;
	justify-content: center;
	margin-right: 6px;
	margin-top: 0;
	max-width: 24px;
	min-width: 24px;
	padding: 0;
	width: 24px
}

.faq__question .icon,
.faq__question .icon svg {
	transition: transform .3s ease
}

.faq__question[aria-expanded=true] .icon svg {
	transform: rotate(90deg)
}

.faq__question[aria-expanded=true]+.faq__answer>* {
	opacity: 1
}

.faq__question:not([aria-expanded=true])+.faq__answer>* {
	transition: opacity .25s ease
}

.faq__question span {
	flex: 1
}

.faq__answer {
	height: 0;
	overflow: hidden;
	padding-left: 40px;
	transition: height .5s ease;
	width: 100%
}

.faq__answer[aria-hidden=true] {
	visibility: hidden
}

.faq__answer>* {
	opacity: 0;
	transition: opacity .5s ease;
	transition-delay: .1s
}

.faq__answer p {
	font-size: 16px;
	line-height: 1.5;
	margin-bottom: 26px;
	width: 100%
}

.faq__answer a {
	color: var(--color-brand-blue-1)
}

.faq__answer .disclaimer-sup a {
	color: var(--color-neutral-black);
	text-decoration: none
}

.faq__answer ul {
	margin: 16px 0;
	padding-left: 24px;
	width: 100%
}

.faq__answer ul li {
	font-size: 16px;
	margin-bottom: 8px
}

@media(max-width:768px) {
	.faq {
		padding: 48px 0
	}

	.faq__header {
		gap: 40px
	}

	.faq__header h2 {
		font-size: 32px;
		line-height: 40px
	}

	.faq__expand-all {
		padding: 12px 14px 12px 0
	}

	.faq__collapse-all {
		padding-left: 21px
	}

	.faq__item {
		border-top: 1px solid hsla(0, 0%, 69%, .4)
	}

	.faq__question {
		font-weight: 700;
		gap: 16px;
		padding: 32px 0 32px 8px
	}

	.faq__question .icon {
		margin-right: 0;
		padding: 0
	}

	.faq__answer {
		padding-left: 48px
	}
}

.auto-carousel {
	display: flex;
	max-width: 100%;
	overflow: hidden
}

.auto-carousel__contents,
.auto-carousel__images {
	width: 50%
}

.auto-carousel__contents {
	flex: 1;
	padding-right: 40px;
	position: relative
}

.auto-carousel__contents-swiper {
	display: flex;
	flex-direction: column;
	gap: 40px;
	height: 100%;
	justify-content: center;
	padding-top: 26px
}

.auto-carousel__contents .swiper-slide,
.auto-carousel__images .swiper-slide {
	transition-timing-function: ease-in-out
}

.auto-carousel__progress {
	display: flex;
	gap: 4px;
	left: 0;
	margin-bottom: 16px;
	position: absolute;
	right: 0;
	top: 0
}

.auto-carousel__progress--is-relative {
	margin: 0;
	position: relative
}

.auto-carousel__controls {
	display: flex;
	gap: 16px;
	z-index: 1
}

.auto-carousel__step {
	background-color: hsla(0, 0%, 100%, .4);
	flex: 1;
	height: 2px;
	overflow: hidden
}

.auto-carousel__step-fill {
	background-color: #fff;
	height: 100%;
	transform: translateX(-101%)
}

.is-paused .auto-carousel__step.is-active .auto-carousel__step-fill {
	transform: translateX(0) !important;
	transition: transform .3s ease-in-out
}

.auto-carousel__button {
	align-items: center;
	-webkit-backdrop-filter: blur(30px);
	backdrop-filter: blur(30px);
	background-color: hsla(0, 0%, 100%, .3);
	border-radius: 50%;
	display: inline-flex;
	height: 40px;
	isolation: isolate;
	justify-content: center;
	overflow: hidden;
	position: relative;
	transform: translateZ(0);
	width: 40px
}

.auto-carousel__button:before {
	background-color: hsla(0, 0%, 100%, .4);
	content: "";
	inset: 0;
	opacity: 0;
	position: absolute;
	transition: opacity .3s ease
}

.has-hovers .auto-carousel__button:hover:before {
	opacity: 1
}

.auto-carousel__button:active:before {
	background: radial-gradient(100% 163.88% at 100% 0, hsla(0, 0%, 100%, .48) 0, hsla(0, 0%, 100%, .16) 100%);
	opacity: 1
}

.auto-carousel__button .icon,
.auto-carousel__button [class^=icon-] {
	border-radius: 50%;
	height: 40px;
	width: 40px
}

.auto-carousel__button--play {
	margin-right: auto
}

.auto-carousel__button--play .icon-play {
	display: none;
	height: 24px;
	width: 24px
}

.is-paused .auto-carousel__button--play .icon-play {
	display: inline-block
}

.is-paused .auto-carousel__button--play .icon-pause {
	display: none
}

@media(max-width:1024px) {
	.auto-carousel__contents {
		padding-right: 40px
	}

	.auto-carousel__controls {
		bottom: 24px
	}
}

@media(max-width:900px) {
	.auto-carousel {
		flex-direction: column;
		gap: 24px
	}

	.auto-carousel__contents,
	.auto-carousel__images {
		width: 100%
	}

	.auto-carousel__contents {
		order: 2;
		padding-right: 0
	}

	.auto-carousel__contents-swiper {
		padding-bottom: 0
	}

	.auto-carousel__controls {
		bottom: auto;
		position: relative
	}
}

.disclaimers {
	padding: 80px 0
}

@media(max-width:600px) {
	.disclaimers {
		padding: 40px 0 64px
	}
}

.disclaimers__list {
	counter-reset: disclaimer-counter
}

.disclaimers__list li:before {
	color: var(--color-brand-blue-1);
	content: "[" counter(disclaimer-counter) "] ";
	counter-increment: disclaimer-counter
}

.disclaimer-sup {
	font-size: .6em;
	text-decoration: none;
	vertical-align: text-top
}

.text-title-3 .disclaimer-sup {
	font-size: 10px
}

.sr-only {
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	clip: rect(0, 0, 0, 0);
	border: 0;
	white-space: nowrap
}

.in-page-nav {
	position: sticky;
	top: 0;
	z-index: 10
}

.in-page-nav-wrapper {
	position: relative
}

.in-page-nav__container {
	align-items: center;
	display: flex;
	gap: 24px;
	justify-content: space-between;
	padding-bottom: 8px
}

.in-page-nav__trigger {
	display: none
}

.in-page-nav__menu {
	border-bottom: 1px solid var(--color-neutral-grey-40);
	display: flex;
	justify-content: space-between;
	width: 100%
}

@media(max-width:1024px) {
	.in-page-nav__menu {
		border-bottom: none
	}
}

.in-page-nav__menu .menu-tab {
	color: #000;
	overflow: hidden;
	padding: 16px;
	position: relative;
	text-align: center;
	transition: color .3s ease
}

.in-page-nav__menu .menu-tab:after {
	background-color: var(--color-hero-dark-blue, #1b3073);
	bottom: 0;
	content: "";
	height: 3px;
	left: 0;
	opacity: 0;
	position: absolute;
	transition: opacity .3s ease;
	width: 100%
}

.has-hovers .in-page-nav__menu .menu-tab:hover {
	color: var(--color-brand-purple, #5257a4)
}

.has-hovers .in-page-nav__menu .menu-tab:hover:after {
	background-color: var(--color-brand-purple, #5257a4);
	opacity: 1
}

.in-page-nav__menu .menu-tab:active {
	color: var(--color-brand-purple, #5257a4)
}

.in-page-nav__menu .menu-tab:active:after {
	opacity: 1
}

.in-page-nav__menu .menu-tab:focus-visible {
	box-shadow: none;
	color: var(--color-brand-purple, #5257a4);
	outline: .1875rem dotted var(--color-brand-purple, #5257a4);
	outline-offset: -12px
}

.in-page-nav__menu .menu-tab:focus-visible:after {
	background-color: var(--color-brand-purple, #5257a4);
	opacity: 1
}

.in-page-nav__menu .menu-tab.is-active {
	color: var(--color-brand-purple)
}

.in-page-nav__menu .menu-tab.is-active:after {
	opacity: 1
}

.in-page-nav--distributor {
	font-size: 19px;
	font-weight: 600;
	line-height: 28.5px
}

@media(max-width:1024px) {
	.in-page-nav--distributor {
		font-size: 16px;
		font-weight: 700;
		line-height: 22px
	}
}

.in-page-nav--distributor .menu-tab {
	padding: 18px
}

.in-page-nav-dialog {
	background: none;
	border: none;
	color: #fff;
	inset: unset;
	max-height: none;
	position: fixed;
	z-index: 100
}

.in-page-nav-dialog,
.in-page-nav-dialog .in-page-nav__container {
	height: -moz-fit-content;
	height: fit-content;
	margin: 0;
	overflow: visible;
	padding: 0;
	width: 100%
}

.in-page-nav-dialog .in-page-nav__container {
	display: flex;
	flex-direction: column;
	gap: 0
}

.in-page-nav-dialog .in-page-nav__trigger {
	display: flex;
	padding: 16px;
	width: 100%
}

.in-page-nav-dialog .in-page-nav__menu {
	display: flex;
	flex-direction: column;
	width: 100%
}

.in-page-nav-dialog .in-page-nav__menu .menu-tab {
	align-items: center;
	border-bottom: 1px solid #d2d2d2;
	display: flex;
	font-family: Segoe UI, sans-serif;
	font-weight: 400;
	justify-content: space-between;
	line-height: 1.4;
	padding: 8px 12px 8px 24px;
	width: 100%
}

.in-page-nav-dialog .in-page-nav__button {
	display: block !important;
	margin-top: auto;
	padding: 16px;
	width: 100%
}

.in-page-nav-dialog .in-page-nav__button a {
	align-items: center;
	background: radial-gradient(141.42% 165% at 100% 0, hsla(0, 0%, 100%, .14) 0, hsla(0, 0%, 100%, .05) 100%);
	border-radius: 8px;
	display: flex;
	font-family: Segoe UI, sans-serif;
	font-weight: 600;
	justify-content: center;
	line-height: 8px;
	outline: 2px solid #fff;
	outline-offset: -2px;
	padding: 16px 24px;
	width: 100%
}

.in-page-nav-dialog .menu-button {
	align-items: center;
	display: flex;
	justify-content: center;
	margin: 13px 24px;
	padding: 13.5px 0;
	width: auto
}

.in-page-nav-dialog::backdrop {
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	background: transparent
}

.in-page-nav--brand-light-blue {
	background-color: var(--color-brand-light-blue)
}

.in-page-nav--light-base-3 {
	background-color: var(--color-light-base-3)
}

.in-page-nav-dialog--brand-light-blue .in-page-nav__menu {
	background: var(--color-brand-light-blue)
}

.in-page-nav-dialog--light-base-3 .in-page-nav__menu {
	background: var(--color-light-base-3)
}

@media(max-width:1024px) {
	.in-page-nav__container {
		flex-direction: column;
		margin: 0 auto;
		max-width: 100%;
		padding: 0
	}

	.in-page-nav__menu {
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
		background: none;
		display: none;
		flex-direction: column;
		width: 100%
	}

	.in-page-nav__menu .menu-tab {
		padding: 21px 16px;
		text-align: left
	}

	.in-page-nav__trigger {
		align-items: center;
		color: #0a1e2c;
		display: flex;
		gap: 4px;
		padding: 21px 24px;
		position: relative;
		text-align: left;
		width: 100%
	}

	.in-page-nav__trigger .icon {
		pointer-events: none;
		transform: rotate(90deg)
	}

	.in-page-nav__trigger-text {
		font-family: Segoe UI, sans-serif;
		font-weight: 700;
		line-height: 12px;
		pointer-events: none
	}

	.in-page-nav__trigger-text span {
		display: none
	}

	.in-page-nav[data-active="1"] .in-page-nav__trigger-text span:first-child {
		display: block
	}

	.in-page-nav[data-active="1"] .menu-tab:first-of-type {
		display: none
	}

	.in-page-nav[data-active="2"] .in-page-nav__trigger-text span:nth-child(2) {
		display: block
	}

	.in-page-nav[data-active="2"] .menu-tab:nth-of-type(2) {
		display: none
	}

	.in-page-nav[data-active="3"] .in-page-nav__trigger-text span:nth-child(3) {
		display: block
	}

	.in-page-nav[data-active="3"] .menu-tab:nth-of-type(3) {
		display: none
	}

	.in-page-nav[data-active="4"] .in-page-nav__trigger-text span:nth-child(4) {
		display: block
	}

	.in-page-nav[data-active="4"] .menu-tab:nth-of-type(4) {
		display: none
	}

	.in-page-nav[data-active="5"] .in-page-nav__trigger-text span:nth-child(5) {
		display: block
	}

	.in-page-nav[data-active="5"] .menu-tab:nth-of-type(5) {
		display: none
	}

	.in-page-nav__button {
		display: none;
		padding: 0 var(--padding-main-mobile) var(--padding-main-mobile);
		width: 100%
	}

	.in-page-nav__button .button {
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
		width: 100%
	}

	.in-page-nav.is-dropdown-active .in-page-nav__menu {
		display: flex
	}

	.in-page-nav.is-dropdown-active .in-page-nav__button {
		display: block
	}

	.in-page-nav.is-dropdown-active .in-page-nav__trigger .icon {
		transform: rotate(-90deg)
	}
}

.device-stats {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(2, 1fr)
}

.device-stat {
	background-image: url(../images/gradient-bg-1.png);
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	border-radius: var(--corner-radius);
	display: grid;
	gap: 24px;
	grid-template-columns: 1fr 1fr;
	padding: 24px
}

.device-stat:nth-child(2n) {
	background-image: url(../images/gradient-bg-2.png)
}

.device-stat__image {
	grid-column: span 2;
	width: 100%
}

@media(min-width:1024px) {
	.device-stat__image {
		aspect-ratio: 660/412
	}
}

.device-stat__content {
	display: flex;
	flex-direction: column
}

.device-stat .icon-card,
.device-stat__content {
	justify-content: space-between
}

@media(max-width:1024px) {
	.device-stats {
		grid-template-columns: 1fr
	}
}

@media(max-width:768px) {
	.device-stat {
		background-image: url(../images/gradient-bg-1-mobile.png);
		display: flex;
		flex-direction: column
	}

	.device-stat:nth-child(2n) {
		background-image: url(../images/gradient-bg-2-mobile.png)
	}
}

@media(max-width:600px) {
	.device-stat {
		padding: 16px
	}

	.device-stat .icon-card [class^=icon-] {
		height: 96px;
		width: 96px
	}

	.device-stat .icon-card [class^=icon-].icon-997percent {
		height: 96px;
		width: 142px
	}
}

.hero {
	background: var(--color-campaign-blue-green);
	color: var(--color-neutral-white);
	display: flex;
	flex-direction: column;
	min-height: 50vw;
	overflow: hidden;
	padding: 80px 0;
	position: relative
}

@media(max-width:1023px) {
	.hero {
		color: var(--color-section-dark-navy)
	}

	.hero .form-field__input[type=checkbox]+label:before {
		border: 1px solid var(--color-section-dark-navy)
	}
}

.hero__container {
	align-items: center;
	display: flex;
	flex: 1;
	position: relative;
	width: 100%;
	z-index: 1
}

.hero__bg {
	height: 100%;
	left: 0;
	order: -1;
	position: absolute;
	top: 0;
	width: 100%
}

.hero__bg-image {
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: 30% center;
	object-position: 30% center;
	width: 100%
}

.hero__content {
	align-items: flex-start;
	display: flex;
	flex-direction: column;
	gap: 24px;
	max-width: 464px;
	width: 100%
}

.hero__content .text-title-1,
.hero__content [class^=text-body] {
	max-width: 537px
}

.hero__content--narrow {
	max-width: 464px
}

.hero__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 24px
}

.hero__gradient-title {
	background: linear-gradient(90deg, var(--color-neutral-white) 0, var(--color-accent-1) 60.02%);
	-webkit-background-clip: text;
	max-width: 100%;
	-webkit-text-fill-color: transparent;
	background-clip: text
}

@media(max-width:1023px) {
	.hero__gradient-title {
		background: linear-gradient(90deg, #3d22e9 3.67%, #382b82 50.15%);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		background-clip: text
	}
}

.hero__gradient-title-thank-you {
	font-size: 68px;
	line-height: 84px
}

@media(max-width:1023px) {
	.hero__gradient-title-thank-you {
		font-size: 32px;
		line-height: 40px
	}
}

.hero--interactive {
	max-width: 100%;
	overflow: hidden;
	padding: 102.5px 0;
	width: 100vw
}

@media(max-width:1400px) {

	.hero--interactive,
	.hero--interactive .hero__container {
		padding-bottom: 100px
	}
}

@media(max-width:1023px) {
	.hero--interactive .hero__container {
		background: var(--color-surface-light-purple);
		padding-top: 80px
	}

	.hero--interactive {
		min-height: auto;
		padding: 0
	}

	.hero--interactive .hero__content {
		max-width: 100%
	}

	.hero--interactive .hero__content>:last-child {
		margin-bottom: 40px
	}

	.hero--interactive .hero__bg {
		position: relative
	}

	.hero--interactive .hero__bg img {
		transform: none !important
	}
}

@media(max-width:768px) {
	.hero {
		min-height: auto;
		padding: 0
	}

	.hero__content {
		max-width: 100%
	}

	.hero__content>:last-child:not(.hero__buttons) {
		margin-bottom: 40px
	}

	.hero__bg {
		position: relative
	}

	.hero .hero__container {
		padding: var(--padding-main-mobile) var(--padding-main-mobile) 64px
	}

	.hero--interactive .hero__container {
		padding: var(--padding-main-mobile)
	}
}

@media(max-width:600px) {
	.hero__bg {
		height: 70vw
	}

	.hero__content {
		gap: 24px
	}

	.hero__buttons {
		flex-direction: column;
		margin-top: 0
	}

	.hero__buttons,
	.hero__buttons .button {
		width: 100%
	}
}

.hero--split {
	height: clamp(600px, 45vh, 800px);
	min-height: clamp(600px, 45vh, 800px);
	overflow: hidden;
	padding: 0;
	position: relative
}

.hero--split .hero__container {
	align-items: stretch;
	display: flex;
	flex-direction: row;
	gap: 0;
	height: 100%;
	margin: 0;
	max-width: none;
	min-height: inherit;
	padding: 0;
	width: 100%
}

.hero--split .hero__text-content {
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	gap: var(--spacing-40);
	justify-content: center;
	max-width: 600px;
	min-width: 350px;
	padding-left: var(--spacing-80);
	padding-right: var(--spacing-40);
	position: relative;
	width: 35%;
	z-index: 2
}

.hero--split .hero__text-content .text-display,
.hero--split .hero__text-content .text-title-1 {
	background: linear-gradient(90deg, var(--color-neutral-white) 0, #b6e5fe 66.46%);
	-webkit-background-clip: text;
	max-width: 100%;
	-webkit-text-fill-color: transparent;
	background-clip: text
}

.hero--split .hero__text-content .text-body-1,
.hero--split .hero__text-content .text-body-2,
.hero--split .hero__text-content p {
	max-width: 100%
}

.hero--split .hero__headline--spaced {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-16)
}

.hero--split .hero__media {
	flex: 1 1 auto;
	height: 100%;
	margin: 0;
	overflow: hidden;
	padding: 0;
	position: relative;
	width: auto
}

.hero--split .hero__media--has-video .media-video,
.hero--split .hero__media--has-video .media-video__wrapper,
.hero--split .hero__media--has-video video {
	height: 100%;
	left: 0;
	-o-object-fit: cover;
	object-fit: cover;
	position: absolute;
	top: 0;
	width: 100%
}

.hero--split .hero__video-play-button {
	align-items: center;
	background-color: var(--color-neutral-grey-11);
	border-radius: 50%;
	box-shadow: 0 0 0 5px var(--color-neutral-alpha-white-30);
	cursor: pointer;
	display: flex;
	height: 86px;
	justify-content: center;
	left: 50%;
	padding: 0;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 86px;
	z-index: 2
}

@media(max-width:600px) {
	.hero--split .hero__video-play-button {
		height: 61px;
		width: 61px
	}
}

.hero--split .hero__video-play-button svg {
	height: 28px;
	width: 28px
}

.hero--split .hero__video-play-button:focus,
.hero--split .hero__video-play-button:hover {
	border: 2px solid var(--color-neutral-white);
	box-shadow: 0 0 0 3px var(--color-neutral-black)
}

.hero--split .hero__video-play-button:focus {
	outline: none
}

.hero--split .hero__video-play-button img {
	height: 100%;
	left: 0;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
	position: absolute;
	top: 0;
	width: 100%
}

@media(max-width:1280px) {
	.hero--split {
		height: auto;
		min-height: auto
	}

	.hero--split .hero__container {
		flex-direction: column;
		gap: 0;
		height: auto
	}

	.hero--split .hero__text-content {
		gap: var(--spacing-40);
		max-width: 100%;
		min-width: auto;
		order: 1;
		padding: 48px var(--spacing-80);
		padding-right: var(--spacing-80);
		width: 100%
	}

	.hero--split .hero__media {
		height: clamp(400px, 40vh, 550px);
		order: -1;
		width: 100%
	}
}

@media(max-width:1024px) {
	.hero--split .hero__text-content {
		padding: 40px 48px
	}

	.hero--split .hero__media {
		height: clamp(350px, 35vh, 450px)
	}
}

@media(max-width:768px) {
	.hero--split .hero__text-content {
		gap: var(--spacing-24);
		padding: var(--spacing-24);
		padding-bottom: 48px
	}

	.hero--split .hero__text-content .text-title-large {
		background: linear-gradient(90deg, var(--color-neutral-white) 0, #b6e5fe 66.46%);
		-webkit-background-clip: text;
		font-size: 32px;
		line-height: 40px;
		-webkit-text-fill-color: transparent;
		background-clip: text
	}

	.hero--split .hero__headline--spaced {
		gap: var(--spacing-16)
	}

	.hero--split .hero__media {
		height: 211px
	}
}

@media(max-width:600px) {
	.hero--split .hero__text-content {
		padding: var(--spacing-24);
		padding-bottom: 48px
	}

	.hero--split .hero__media {
		height: 211px
	}
}

@media(max-width:1024px) {
	.mobile-hide {
		display: none
	}
}

.hero__text-content--distributor-gradient {
	background-image: url(../images/distributor-gradient-bg.png);
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: cover
}

.hero__text-content--distributor-gradient:before {
	background: rgba(0, 0, 0, .2);
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
	z-index: 0
}

.hero__text-content--distributor-gradient>* {
	position: relative;
	z-index: 1
}

@media(max-width:1280px) {
	.hero--distributor .hero__container {
		flex-direction: column-reverse
	}
}

@media(max-width:1024px) {
	.hero--distributor .hero__text-content {
		padding: 40px 24px 64px
	}
}

.hero--distributor .hero__text-content .text-display.text-gradient-distributor,
.hero--distributor .hero__text-content .text-title-1.text-gradient-distributor {
	background: linear-gradient(90deg, #fff 1.71%, #c4e7ff 50.116%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text
}

@media(max-width:768px) {

	.hero--distributor .hero__text-content .text-display.text-gradient-distributor,
	.hero--distributor .hero__text-content .text-title-1.text-gradient-distributor {
		background: linear-gradient(90deg, #fff, #9fd8ff 82.692%);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		background-clip: text
	}
}

@media(max-width:375px) {
	.hero--distributor .text-display.break-title-mobile {
		max-width: 220px
	}
}

.hero--image {
	height: 600px;
	min-height: unset;
	overflow: hidden;
	padding: 0;
	position: relative
}

.hero--image .hero__container {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: var(--spacing-24);
	height: 100%;
	justify-content: center;
	margin: 0 auto;
	max-width: 1600px;
	padding: 0 10px;
	position: relative;
	width: 100%;
	z-index: 2
}

.hero--image .hero__background {
	height: 100%;
	left: 0;
	overflow: hidden;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 0
}

.hero--image .hero__background img {
	height: 100%;
	left: 0;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: top center;
	object-position: top center;
	position: absolute;
	top: 0;
	width: 100%
}

.hero--image .hero__background .hero__background-overlay {
	background: radial-gradient(50% 50% at 50% 50%, rgba(0, 0, 0, .6) 0, transparent 100%);
	height: 100%;
	left: 0;
	pointer-events: none;
	position: absolute;
	top: 0;
	width: 100%
}

@media(min-width:1024px) {
	.hero--image .hero__background .hero__background-overlay {
		display: none
	}
}

.hero--image .hero__content {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: var(--spacing-40);
	max-width: 1192px;
	text-align: center;
	z-index: 2
}

.hero--image .hero__content h1 {
	font-size: 90px;
	font-weight: 400;
	letter-spacing: -1.8px;
	line-height: 90px;
	margin: 0
}

.hero--image .hero__body {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: var(--spacing-40);
	max-width: 948px;
	text-align: center
}

.hero--image .hero__body p {
	color: #fff;
	font-size: 20px;
	font-weight: 400;
	line-height: 28px;
	margin: 0;
	max-width: 860px
}

.hero--image .hero__body .button--primary {
	height: 48px;
	width: 192px
}

@media(max-width:768px) {
	.hero--image {
		height: 516px;
		overflow: hidden
	}

	.hero--image .hero__container {
		padding: var(--spacing-40) var(--spacing-24) var(--spacing-64)
	}

	.hero--image .hero__background {
		height: 100%
	}
}

@media(max-width:768px)and (width:375px) {
	.hero--image .hero__background img {
		height: auto;
		-o-object-fit: none;
		object-fit: none;
		position: static;
		width: 375px
	}
}

@media(max-width:768px) {
	.hero--image .hero__background:after {
		background: transparent
	}

	.hero--image .hero__glow {
		height: 605px;
		left: calc(50% + 2px);
		top: -98px;
		transform: translateX(-50%);
		width: 595px
	}

	.hero--image .hero__content {
		gap: var(--spacing-24);
		max-width: 100%
	}

	.hero--image .hero__content h1 {
		font-size: 50px;
		letter-spacing: -1px;
		line-height: 60px;
		margin-bottom: 0 !important;
		white-space: normal
	}

	.hero--image .hero__body {
		gap: var(--spacing-24);
		max-width: 100%
	}

	.hero--image .hero__body p {
		max-width: 327px
	}
}

.hero-image-ungated {
	background-image: url(../images/CLE_Comarketing_Windows11Pro_hero_desktop.png);
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 600px;
	overflow: hidden;
	padding: 0;
	position: relative
}

.hero-image-ungated .hero__container {
	align-items: center;
	display: flex;
	height: 100%;
	margin: 0 auto;
	max-width: 1600px;
	padding: 80px;
	width: 100%
}

.hero-image-ungated .hero__content-wrapper {
	align-items: flex-start;
	display: flex;
	flex-direction: column;
	width: 100%
}

.hero-image-ungated .hero__content-wrapper .button--primary {
	font-size: 16px;
	font-weight: 600;
	line-height: 24px;
	padding: 12px 8px;
	width: 274px
}

.hero-image-ungated .hero__text-content {
	color: #fff;
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding-bottom: 24px
}

.hero-image-ungated .hero__text-content h1 {
	font-size: 50px;
	font-weight: 600;
	letter-spacing: -1.2px;
	line-height: 60px
}

.hero-image-ungated .hero__text-content h1,
.hero-image-ungated .hero__text-content p {
	color: #fff;
	font-family: Segoe UI, sans-serif;
	font-style: normal;
	margin: 0;
	max-width: 451px
}

.hero-image-ungated .hero__text-content p {
	font-size: 16px;
	font-weight: 400;
	line-height: 22px
}

.hero-image-ungated .hero__image-mobile {
	display: none
}

@media(max-width:768px) {
	.hero-image-ungated {
		background-image: none;
		background: transparent;
		display: block;
		min-height: auto;
		padding: 0
	}

	.hero-image-ungated .hero__image-mobile {
		display: block;
		height: 263px;
		overflow: hidden;
		width: 100%
	}

	.hero-image-ungated .hero__image-mobile img {
		display: block;
		height: 263px;
		-o-object-fit: cover;
		object-fit: cover;
		-o-object-position: 55.5% top;
		object-position: 55.5% top;
		width: 160%
	}

	.hero-image-ungated .hero__container {
		align-items: flex-start;
		background: var(--color-hero-dark-blue);
		padding: 32px 24px 40px
	}

	.hero-image-ungated .hero__content-wrapper {
		align-items: flex-start;
		display: flex;
		flex-direction: column;
		gap: 24px
	}

	.hero-image-ungated .hero__content-wrapper .button--primary {
		font-size: 16px;
		font-weight: 600;
		line-height: 24px;
		padding: 12px 8px;
		width: 274px
	}

	.hero-image-ungated .hero__text-content {
		align-items: flex-start;
		gap: 24px;
		padding-bottom: 0;
		text-align: left
	}

	.hero-image-ungated .hero__text-content h1 {
		font-size: 32px;
		font-style: normal;
		font-weight: 600;
		letter-spacing: -.8px;
		line-height: 40px;
		max-width: 300px
	}

	.hero-image-ungated .hero__text-content p {
		font-size: 16px;
		font-style: normal;
		font-weight: 400;
		line-height: 22px;
		max-width: 100%
	}
}

@media(min-width:768px)and (max-width:1280px) {
	.hero-image-ungated {
		background-image: none;
		background: transparent;
		display: block;
		min-height: auto;
		padding: 0
	}

	.hero-image-ungated .hero__image-mobile {
		display: block;
		height: 380px;
		overflow: hidden;
		width: 100%
	}

	.hero-image-ungated .hero__image-mobile img {
		display: block;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
		-o-object-position: center top;
		object-position: center top;
		width: 100%
	}

	.hero-image-ungated .hero__container {
		align-items: flex-start;
		background: var(--color-hero-dark-blue);
		padding: 40px 40px 60px
	}

	.hero-image-ungated .hero__content-wrapper {
		align-items: flex-start;
		display: flex;
		flex-direction: column;
		gap: 24px
	}

	.hero-image-ungated .hero__content-wrapper .button--primary {
		font-size: 16px;
		font-weight: 600;
		line-height: 24px;
		padding: 12px 8px;
		width: 274px
	}

	.hero-image-ungated .hero__text-content {
		align-items: flex-start;
		gap: 24px;
		padding-bottom: 0;
		text-align: left
	}

	.hero-image-ungated .hero__text-content h1 {
		font-size: 48px;
		letter-spacing: -1px;
		line-height: 58px;
		max-width: 100%
	}

	.hero-image-ungated .hero__text-content p {
		font-size: 16px;
		line-height: 24px;
		max-width: 100%
	}
}

@media(min-width:1281px) {
	.hero-image-ungated .hero__text-content {
		padding-bottom: 40px
	}
}

.header-subnav {
	background: var(--color-neutral-white);
	padding: 10px 0
}

.header-subnav .container {
	display: flex;
	justify-content: flex-end
}

.header-subnav__toggle {
	align-items: center;
	background: none;
	border: none;
	cursor: pointer;
	display: flex;
	font-family: var(--font-primary);
	gap: 10px;
	padding: 0 30px 0 20px
}

.header-subnav__toggle:focus {
	outline-offset: 2px
}

.header-subnav__toggle-label {
	color: var(--color-neutral-black);
	font-size: 13px;
	font-weight: 600;
	line-height: 16px
}

.header-subnav__toggle-divider {
	background-color: var(--color-neutral-grey-85);
	height: 15px;
	width: 2px
}

.header-subnav__toggle-switch {
	background: var(--color-brand-blue-1);
	border-radius: 20px;
	flex-shrink: 0;
	height: 20px;
	position: relative;
	transition: background-color .3s ease;
	width: 44px
}

.header-subnav__toggle:hover .header-subnav__toggle-switch {
	background: var(--color-brand-blue-2)
}

.header-subnav__toggle:focus .header-subnav__toggle-switch,
.header-subnav__toggle:focus-visible .header-subnav__toggle-switch {
	outline: .125rem dotted var(--color-neutral-white);
	outline-offset: -.22rem
}

.header-subnav__toggle-switch-knob {
	background: var(--color-neutral-white);
	border-radius: 50%;
	height: 10px;
	position: absolute;
	right: 4px;
	top: 50%;
	transform: translateY(-50%);
	transition: right .3s ease;
	width: 10px
}

.header-subnav__toggle[aria-checked=false] .header-subnav__toggle-switch {
	background: var(--color-neutral-grey-80)
}

.header-subnav__toggle[aria-checked=false] .header-subnav__toggle-switch-knob {
	right: 28px
}

.header-subnav__toggle-state {
	color: var(--color-neutral-black);
	font-size: 15px;
	font-weight: 400;
	line-height: 20px;
	text-align: left;
	width: 10px
}

.section--downloads {
	padding: 80px 0
}

.section--downloads .section__header {
	margin-bottom: 64px;
	max-width: 708px
}

.section--downloads .section__header-downloads {
	gap: 24px
}

.section--downloads .section__downloads {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	justify-content: center
}

@media(max-width:768px) {
	.section--downloads {
		padding: 40px 0 64px
	}

	.section--downloads .section__header {
		align-items: flex-start;
		margin-bottom: 24px;
		text-align: left
	}

	.section--downloads .section__header-downloads {
		gap: 12px
	}

	.section--downloads .section__downloads {
		flex-direction: column;
		gap: 32px
	}
}

.section--downloads-distribution {
	overflow: hidden;
	padding: 120px 0;
	position: relative
}

@media(max-width:1024px) {
	.section--downloads-distribution {
		padding: 40px 0 64px
	}
}

.section--downloads-distribution:before {
	background-image: url(../images/DISTI_Comarketing_Windows11Pro_downloads_bg.png);
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	bottom: 0;
	content: "";
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 0
}

@media(max-width:1024px) {
	.section--downloads-distribution:before {
		background-image: url(../images/DISTI_Comarketing_Windows11Pro_downloads_bg_mobile.png)
	}
}

.section--downloads-distribution .distributor-container {
	position: relative;
	z-index: 2
}

.section--downloads-distribution .downloads-wrapper {
	display: flex;
	flex-direction: column;
	gap: 36.28px
}

@media(max-width:1024px) {
	.section--downloads-distribution .downloads-wrapper {
		gap: 40px
	}
}

.section--downloads-distribution .download-card {
	display: flex;
	flex-direction: row;
	gap: 42px;
	max-width: none;
	width: 100%
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card {
		flex-direction: column-reverse;
		gap: 40px
	}
}

.section--downloads-distribution .download-card__image {
	aspect-ratio: unset;
	border-radius: unset;
	max-width: 828px
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card__image {
		max-width: 100%
	}
}

.section--downloads-distribution .download-card__image img {
	height: 100%;
	width: 100%
}

.section--downloads-distribution .download-card__button {
	padding: 16px 24px
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card__button {
		max-height: 40px
	}
}

.section--downloads-distribution .download-card__content {
	gap: 24px;
	justify-content: center;
	max-height: 467px
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card__content {
		max-height: none
	}
}

.section--downloads-distribution .download-card__text-content {
	display: flex;
	flex-direction: column;
	gap: 12px
}

.section--downloads-distribution .download-card__text-content h3 {
	font-size: 40px;
	font-weight: 400;
	line-height: 52px
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card__text-content h3 {
		font-size: 32px;
		line-height: 44px
	}
}

.section--downloads-distribution .download-card__text-content p {
	font-size: 16px;
	font-weight: 400;
	line-height: 22px
}

.section--downloads-distribution .download-card__text-content a {
	padding: 16px 24px
}

.section--downloads-distribution .download-card--assets {
	justify-content: space-between
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card--assets {
		flex-direction: column;
		gap: 46px
	}
}

.section--downloads-distribution .download-card--assets .download-card__content {
	max-width: 584px
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card--assets .download-card__content {
		max-width: none
	}
}

.section--downloads-distribution .download-card--assets .download-card__assets {
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	background: hsla(0, 0%, 100%, .08);
	border-radius: 8px;
	display: flex;
	flex-direction: row;
	max-width: 829px
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card--assets .download-card__assets {
		flex-direction: column;
		max-width: 100%
	}
}

.section--downloads-distribution .download-card--assets .download-card__assets-header {
	align-items: center;
	display: flex;
	flex-direction: row;
	gap: 24px
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card--assets .download-card__assets-header {
		align-items: flex-start;
		flex-direction: column;
		gap: 0
	}
}

.section--downloads-distribution .download-card--assets .download-card__assets-description {
	font-size: 16px;
	font-weight: 400;
	line-height: 22px
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card--assets .download-card__assets-description {
		line-height: 24px
	}
}

.section--downloads-distribution .download-card--assets .download-card__assets-icon {
	padding: 17px 7px
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card--assets .download-card__assets-icon {
		padding: 17px 13px 17px 7px
	}
}

.section--downloads-distribution .download-card--assets .download-card__assets-icon img {
	height: 96px;
	width: 96px
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card--assets .download-card__assets-icon img {
		height: 45px;
		width: 60px
	}
}

.section--downloads-distribution .download-card--assets .download-card__assets-text-content {
	display: flex;
	flex-direction: column;
	gap: 8px
}

.section--downloads-distribution .download-card--assets .download-card__assets-title {
	font-size: 32px;
	font-weight: 400;
	line-height: 44px
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card--assets .download-card__assets-title {
		font-size: 29px;
		font-weight: 600;
		line-height: 34.8px
	}
}

.section--downloads-distribution .download-card--assets .download-card__assets-info {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	max-width: 488px;
	padding: 40px 24px;
	width: 73%
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card--assets .download-card__assets-info {
		gap: 20px;
		max-width: 100%;
		padding: 24px;
		width: 100%
	}
}

.section--downloads-distribution .download-card--assets .download-card__assets-tags {
	align-content: flex-end;
	align-items: flex-end;
	display: flex;
	flex-wrap: wrap;
	gap: 8px
}

.section--downloads-distribution .download-card--assets .download-card__assets-images {
	max-width: 341px;
	min-height: 400px;
	width: 42%
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card--assets .download-card__assets-images {
		height: auto;
		max-width: none;
		min-height: unset;
		width: 100%
	}
}

.section--downloads-distribution .download-card--assets .download-card__assets-images img {
	border-radius: 0 8px 8px 0;
	height: 100%;
	width: 100%
}

@media(max-width:1024px) {
	.section--downloads-distribution .download-card--assets .download-card__assets-images img {
		border-radius: 0 0 8px 8px
	}
}

.download-card {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 24px;
	max-width: 732px
}

.download-card__image {
	aspect-ratio: 707/398;
	border-radius: 8px;
	overflow: hidden;
	width: 100%
}

.download-card__image img {
	display: block;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	width: 100%
}

.download-card__content {
	display: flex;
	flex-direction: column;
	gap: 16px
}

.download-card__content h3,
.download-card__content p {
	margin: 0
}

.download-card__content .button {
	align-self: flex-start
}

@media(max-width:768px) {
	.download-card {
		max-width: 100%
	}

	.download-card__content {
		gap: 12px
	}

	.download-card__content h3 {
		font-size: 24px;
		line-height: 32px
	}

	.download-card__content .button {
		margin-top: 4px
	}
}

@media(min-width:768px)and (max-width:1024px) {
	.download-card {
		max-width: 100%
	}
}

@media(max-width:768px) {
	.section--stats .section__header {
		text-align: center
	}
}

.stats-container {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(3, 1fr);
	max-width: 1440px
}

@media(max-width:992px) {
	.stats-container {
		gap: 40px;
		grid-template-columns: 1fr
	}
}

.stat-item {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 24px;
	text-align: center
}

.stat-visual {
	flex-shrink: 0;
	margin: 0 102px
}

@media(max-width:1400px) {
	.stat-visual {
		margin: 0 63.5px
	}
}

.stat-visual img {
	display: block;
	height: 200px;
	-o-object-fit: contain;
	object-fit: contain;
	width: 200px
}

@media(min-width:768px) {
	.stat-visual img {
		height: 260px;
		width: 260px
	}
}

.stat-content {
	color: #fff;
	flex: 1
}

@media(max-width:768px) {
	.stat-content {
		max-width: 275px
	}
}

.stat-title {
	-webkit-hyphens: none;
	hyphens: none;
	overflow-wrap: normal;
	word-break: keep-all
}

.section--stats-distribution {
	overflow: hidden;
	position: relative
}

.section--stats-distribution:before {
	background-image: url(../images/DISTI_Comarketing_Windows11Pro_stat_bg.png);
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	bottom: 0;
	content: "";
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 0
}

@media(max-width:1024px) {
	.section--stats-distribution:before {
		background-image: url(../images/DISTI_Comarketing_Windows11Pro_stat_bg_mobile.png)
	}
}

.section--stats-distribution .distributor-container {
	position: relative;
	z-index: 2
}

@media(max-width:1024px) {
	.section--stats-distribution .distributor-container .section__header {
		gap: 12px;
		text-align: center
	}
}

.section--stats-distribution .distributor-container .stats-grid {
	align-items: stretch;
	display: flex;
	flex-direction: row;
	gap: 24px
}

@media(max-width:1024px) {
	.section--stats-distribution .distributor-container .stats-grid {
		align-items: center;
		flex-direction: column
	}
}

.section--stats-distribution .distributor-container .stats-grid__picture {
	height: 100%;
	width: 100%
}

.section--stats-distribution .distributor-container .stats-grid__image {
	display: flex;
	max-width: 464px;
	width: 34%
}

@media(max-width:1024px) {
	.section--stats-distribution .distributor-container .stats-grid__image {
		max-width: none;
		width: 100%
	}
}

.section--stats-distribution .distributor-container .stats-grid__image img {
	border-radius: 8px;
	height: 100%;
	min-height: 437px;
	-o-object-fit: cover;
	object-fit: cover;
	width: 100%
}

.section--stats-distribution .distributor-container .stats-grid__cards {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(2, 1fr);
	width: 66%
}

@media(max-width:1024px) {
	.section--stats-distribution .distributor-container .stats-grid__cards {
		grid-template-columns: 1fr;
		width: 100%
	}
}

.section--stats-distribution .distributor-container .stats-grid__cards .stats-card {
	background: linear-gradient(180deg, rgba(13, 31, 89, .35), #3e5380);
	border-radius: 8px;
	display: flex;
	flex-direction: column;
	gap: 32px;
	max-width: 465px;
	min-height: 437px;
	padding: 36px
}

@media(max-width:1024px) {
	.section--stats-distribution .distributor-container .stats-grid__cards .stats-card {
		gap: 24px;
		max-width: none;
		min-height: auto;
		padding: 24px
	}
}

.section--stats-distribution .distributor-container .stats-grid__cards .stats-card__content {
	display: flex;
	flex-direction: column;
	gap: 16px
}

@media(max-width:1024px) {
	.section--stats-distribution .distributor-container .stats-grid__cards .stats-card__content {
		gap: 11.33px
	}
}

.section--stats-distribution .distributor-container .stats-grid__cards .stats-card__title {
	font-size: 24px;
	font-weight: 600;
	line-height: 32px
}

@media(max-width:1024px) {
	.section--stats-distribution .distributor-container .stats-grid__cards .stats-card__title {
		font-size: 20px;
		line-height: 28px
	}
}

.section--stats-distribution .distributor-container .stats-grid__cards .stats-card__description {
	font-size: 20px;
	font-weight: 400;
	line-height: 28px
}

@media(max-width:1024px) {
	.section--stats-distribution .distributor-container .stats-grid__cards .stats-card__description {
		font-size: 16px;
		line-height: 22px
	}
}

.section--stats-distribution .distributor-container .stats-grid__cards .stats-card__icon {
	align-items: center;
	background: rgba(10, 20, 44, .4);
	border-radius: 8px;
	display: flex;
	height: 100px;
	justify-content: center;
	width: 100px
}

@media(max-width:1024px) {
	.section--stats-distribution .distributor-container .stats-grid__cards .stats-card__icon {
		height: 85px;
		width: 85px
	}
}

.section--stats-distribution .section__header p {
	max-width: 812px
}

.section--devices .section__header {
	max-width: 708px
}

@media(max-width:600px) {
	.section--devices .section__header {
		align-items: center;
		text-align: center
	}
}

.section--devices .section__header .button {
	padding: 13.5px 16px
}

.section--devices .product-card-container {
	gap: 24px;
	grid-template-columns: repeat(4, 1fr);
	margin-top: 64px
}

@media(max-width:600px) {
	.section--devices .product-card-container {
		gap: 40px;
		grid-template-columns: 1fr;
		margin-top: 40px
	}
}

.section--devices .product-card-container .product-card {
	background: none;
	border-radius: 0;
	padding: 0
}

.section--devices .product-card-container .product-card .product-card__image {
	border-radius: 8px;
	margin-bottom: 24px
}

.section--devices .product-card-container .product-card .product-card__content {
	flex-direction: column
}

.section--devices .product-card-container .product-card .product-card__content .product-card__cta {
	align-self: flex-start
}

.section--devices .product-card-container .product-card .product-card__content .product-card__cta .inline-link {
	display: inline-flex;
	font-weight: 600;
	gap: 4px;
	text-decoration: none;
	transition: gap .2s ease-in-out
}

.section--devices .product-card-container .product-card .product-card__content .product-card__cta .inline-link:hover {
	gap: 8px;
	text-decoration: underline
}

.section__header--flip-cards {
	align-items: center;
	text-align: center
}

.section--flip-cards {
	padding: var(--spacing-80) 0
}

@media(max-width:768px) {
	.section--flip-cards {
		padding: var(--spacing-64) 0
	}
}

@media(max-width:600px) {
	.section--flip-cards {
		padding: var(--spacing-40) 0 var(--spacing-64)
	}
}

.section--flip-cards-distribution .section__header {
	max-width: 738px
}

.section--flip-cards-distribution .flip-card {
	height: 464px
}

@media(max-width:1024px) {
	.section--flip-cards-distribution .flip-card {
		min-height: 415px
	}
}

.section--flip-cards-distribution .flip-card__front {
	gap: 10px;
	padding-top: 20px
}

.section--flip-cards-distribution .flip-card__content {
	gap: 10px;
	min-height: 166px;
	padding: 12px 32px 6px
}

@media(max-width:1024px) {
	.section--flip-cards-distribution .flip-card__content {
		padding: 8px 24px 24px
	}
}

.section--flip-cards-distribution .flip-card__content h3 {
	font-size: 29px;
	line-height: 34.8px
}

@media(max-width:1024px) {
	.section--flip-cards-distribution .flip-card__content h3 {
		font-size: 24px;
		line-height: 32px
	}
}

.section--flip-cards-distribution .flip-card__image {
	flex: none;
	height: 176px;
	margin: 0 auto;
	width: 337px
}

@media(max-width:1024px) {
	.section--flip-cards-distribution .flip-card__image {
		height: 132px;
		width: 160px
	}
}

.section--flip-cards-distribution .flip-card__image img {
	min-height: 176px
}

@media(max-width:1024px) {
	.section--flip-cards-distribution .flip-card__image img {
		min-height: 132px
	}
}

.section--flip-cards-distribution .flip-card__toggle {
	align-items: center;
	background-color: var(--color-neutral-white);
	border: 1px solid var(--color-hero-base-1);
	border-radius: 6px;
	bottom: 29px;
	gap: 6px;
	height: unset;
	justify-content: center;
	min-height: 39px;
	right: 30px;
	width: unset
}

@media(max-width:1024px) {
	.section--flip-cards-distribution .flip-card__toggle {
		bottom: 24px;
		left: 50%;
		right: unset;
		transform: translateX(-50%)
	}
}

.section--flip-cards-distribution .flip-card__toggle .icon {
	height: 16px;
	width: 16px
}

.section--flip-cards-distribution .flip-card__toggle--back {
	background-color: var(--color-hero-dark-blue);
	border: 1px solid var(--color-neutral-white);
	color: var(--color-neutral-white)
}

.section--flip-cards-distribution .flip-card__toggle--back .icon {
	transform: rotate(-45deg)
}

.section--flip-cards-distribution .flip-card__toggle:focus-visible {
	outline: .1875rem dotted currentColor;
	outline-offset: -8px
}

.section--flip-cards-distribution .flip-card__back {
	padding: 29px 54px 8px
}

@media(max-width:1024px) {
	.section--flip-cards-distribution .flip-card__back {
		padding: 20px 32px 0
	}
}

.section--flip-cards-distribution .flip-card__back--content {
	display: flex;
	flex-direction: column;
	gap: 26px;
	margin: 12px 0
}

@media(max-width:1024px) {
	.section--flip-cards-distribution .flip-card__back--content {
		gap: 12px;
		margin: 8px 0 24px
	}
}

.section--flip-cards-distribution .flip-card__back--content .text-title-2 {
	font-size: 29px;
	line-height: 34.8px
}

@media(max-width:1024px) {
	.section--flip-cards-distribution .flip-card__back--content .text-title-2 {
		font-size: 24px;
		line-height: 32px
	}
}

.section--flip-cards-distribution .flip-card__back--content .text-body-2 {
	font-size: 24px;
	line-height: 30px
}

@media(max-width:1024px) {
	.section--flip-cards-distribution .flip-card__back--content .text-body-2 {
		font-size: 16px;
		line-height: 22px
	}
}

.bg-surface-light-purple {
	background-color: var(--color-surface-light-purple)
}

.text-gradient-productivity-protected {
	background: linear-gradient(90deg, var(--color-brand-purple-hover) 16.525%, var(--color-hero-dark-blue) 83.757%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text
}

@media(max-width:600px) {
	.text-gradient-productivity-protected {
		background: linear-gradient(90deg, var(--color-gradient-purple-light) 0, var(--color-gradient-purple-deep) 60%);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		background-clip: text
	}
}

.text-gradient-challenges {
	background: linear-gradient(90deg, var(--color-brand-purple-hover) 16.53%, var(--color-hero-dark-blue) 83.76%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	letter-spacing: -1px
}

@media(max-width:600px) {
	.text-gradient-challenges {
		background: linear-gradient(90deg, var(--color-brand-purple-hover) 16.53%, var(--color-hero-dark-blue) 83.76%);
		-webkit-background-clip: text;
		text-align: center;
		-webkit-text-fill-color: transparent;
		background-clip: text;
		letter-spacing: normal
	}
}

.inline-link--purple {
	align-items: center;
	color: var(--color-brand-purple);
	display: inline-flex;
	font-family: Segoe UI, sans-serif;
	font-size: 16px;
	font-weight: 600;
	gap: 4px;
	line-height: 16px;
	text-decoration: none;
	transition: gap .2s ease
}

.inline-link--purple:hover {
	color: var(--color-brand-purple);
	gap: 8px;
	text-decoration: underline
}

.inline-link--purple .icon {
	align-items: center;
	display: flex;
	height: 14px;
	justify-content: center;
	width: 14px
}

.inline-link--purple .icon svg {
	display: block;
	height: 100%;
	width: 100%
}

.flip-card-container {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	justify-content: center
}

@media(max-width:1024px) {
	.flip-card-container {
		align-items: center;
		flex-direction: column
	}
}

.flip-card {
	flex: 1 1 0;
	height: 491px;
	max-width: 480px;
	min-width: 0;
	perspective: 1000px
}

@media(max-width:1024px) {
	.flip-card {
		height: auto;
		max-width: 375px;
		min-height: 500px;
		width: 100%
	}
}

.flip-card__inner {
	height: 100%;
	position: relative;
	transform-style: preserve-3d;
	transition: transform .6s;
	width: 100%
}

.flip-card.is-flipped .flip-card__inner {
	transform: rotateY(180deg)
}

.flip-card.is-flipped .flip-card__front .flip-card__toggle {
	opacity: 0;
	pointer-events: none;
	transition: background-color .2s ease, opacity 0s, visibility 0s;
	visibility: hidden
}

.flip-card__back,
.flip-card__front {
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	background-color: var(--color-neutral-white);
	border-radius: 8px;
	height: 100%;
	overflow: hidden;
	position: absolute;
	width: 100%
}

.flip-card__front {
	display: flex;
	flex-direction: column;
	padding-top: 16px
}

@media(max-width:1024px) {
	.flip-card__front {
		padding-top: 20px
	}
}

.flip-card__back {
	display: flex;
	flex-direction: column;
	padding: 24px 24px 40px;
	transform: rotateY(180deg)
}

@media(max-width:1024px) {
	.flip-card__back {
		padding: 24px 12px 40px
	}
}

.flip-card__content {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-height: 232px;
	padding: 0 40px 24px;
	text-align: center
}

@media(max-width:1024px) {
	.flip-card__content {
		height: auto;
		min-height: auto;
		padding: 0 24px 16px
	}
}

.flip-card__content h3,
.flip-card__content p {
	margin: 0
}

@media(max-width:1024px) {
	.flip-card__content h3 {
		line-height: 40px
	}
}

.flip-card__content .inline-link {
	margin-top: auto;
	width: 110px
}

.flip-card__image {
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	flex: 1;
	overflow: hidden;
	position: relative
}

.flip-card__image img {
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
	width: 100%
}

@media(max-width:1024px) {
	.flip-card__image img {
		min-height: 220px
	}
}

.flip-card__toggle {
	align-items: center;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	background-color: var(--color-hero-dark-blue);
	border: none;
	border-radius: 50%;
	bottom: 21.93px;
	box-shadow: 0 2.679px 6.25px 0 rgba(0, 0, 0, .13), 0 .893px 1.786px 0 rgba(0, 0, 0, .11);
	cursor: pointer;
	display: flex;
	height: 45px;
	justify-content: center;
	position: absolute;
	right: 21.85px;
	transition: background-color .2s ease, opacity 0s .2s, visibility 0s .2s;
	width: 45px;
	z-index: 10
}

.flip-card__toggle:hover {
	background-color: #2a4189
}

.flip-card__toggle:focus {
	outline: 2px solid var(--color-brand-blue-2);
	outline-offset: 2px
}

.flip-card__toggle .icon {
	align-items: center;
	display: flex;
	height: 28.571px;
	justify-content: center;
	width: 28.571px
}

.flip-card__toggle .icon-plus {
	display: block
}

.flip-card__toggle .icon-close {
	display: none
}

@media(max-width:1024px) {
	.flip-card__toggle--back {
		bottom: 22.17px;
		left: auto;
		right: 22.35px;
		transform: none
	}
}

.flip-card__toggle--back .icon-plus {
	display: none
}

.flip-card__toggle--back .icon-close {
	display: block
}

.flip-card__list {
	color: var(--color-neutral-black);
	display: flex;
	flex-direction: column;
	gap: 16px;
	list-style: disc;
	margin: 0;
	padding-left: 36px
}

@media(max-width:1024px) {
	.flip-card__list {
		gap: 10px;
		padding-left: 24px
	}
}

.flip-card__list li {
	font-family: Segoe UI, sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 28.8px
}

@media(max-width:1024px) {
	.flip-card__list li {
		font-size: 20px;
		line-height: 28px
	}
}

.flip-card__list li strong {
	font-weight: 700
}

.vertical-shelves {
	align-items: center;
	display: grid;
	gap: 26px;
	grid-template-columns: 464fr 950fr;
	margin: 0 auto;
	max-width: 1440px
}

@media(max-width:1023px) {
	.vertical-shelves {
		gap: 32px;
		grid-template-columns: 1fr
	}
}

.vertical-shelves__content {
	display: flex;
	flex-direction: column;
	margin-left: 20px
}

.vertical-shelves__items {
	display: flex;
	flex-direction: column;
	gap: 24px
}

.vertical-shelves__item {
	position: relative
}

.vertical-shelves__item.is-active:before {
	background-color: var(--color-hero-dark-blue);
	bottom: 0;
	content: "";
	left: -20px;
	position: absolute;
	top: 0;
	width: 4px
}

@media(max-width:1023px) {
	.vertical-shelves__item.is-active:before {
		left: -16px
	}
}

.vertical-shelves__button {
	align-items: center;
	background: none;
	border: none;
	color: var(--color-hero-dark-blue);
	cursor: pointer;
	display: flex;
	gap: 12px;
	justify-content: flex-start;
	overflow: hidden;
	padding-bottom: 12px;
	text-align: left;
	transition: all .3s ease;
	width: 100%
}

.vertical-shelves__button:hover {
	opacity: .8
}

.vertical-shelves__button:focus-visible {
	outline-offset: 0
}

.vertical-shelves__button .icon {
	align-items: center;
	color: var(--color-neutral-grey-60);
	display: flex;
	height: 9.75px;
	justify-content: center;
	order: 2;
	transition: transform .3s ease, color .3s ease;
	width: 18px
}

.vertical-shelves__button .icon svg {
	height: 9.75px;
	width: 18px
}

.vertical-shelves__button[aria-expanded=true] .icon {
	color: var(--color-neutral-black)
}

.vertical-shelves__button:not([aria-expanded=true]) .icon {
	transform: rotate(180deg)
}

.vertical-shelves__title {
	color: var(--color-hero-dark-blue);
	flex: 1;
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.4;
	margin: 0
}

@media(max-width:1023px) {
	.vertical-shelves__title {
		font-size: 1.25rem
	}
}

.vertical-shelves__description {
	margin: 0;
	max-height: 0;
	overflow: hidden;
	transition: max-height .3s ease
}

.vertical-shelves__description>* {
	padding-bottom: 24px
}

.vertical-shelves__images {
	aspect-ratio: 16/10;
	border-radius: 8px;
	overflow: hidden;
	position: relative;
	width: 100%
}

@media(max-width:1023px) {
	.vertical-shelves__images {
		order: -1
	}
}

.vertical-shelves__image {
	height: 100%;
	left: 0;
	opacity: 0 !important;
	position: absolute;
	top: 0;
	transition: opacity .5s ease;
	visibility: hidden;
	width: 100%
}

.vertical-shelves__image.is-active {
	opacity: 1 !important;
	visibility: visible
}

.vertical-shelves__image img {
	display: block;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	width: 100%
}

.manual-carousel {
	display: flex;
	flex-direction: column;
	max-width: 100%;
	overflow: hidden;
	width: 100%
}

.manual-carousel__contents {
	min-width: 0;
	overflow: hidden;
	position: relative;
	width: 100%
}

.manual-carousel__contents-swiper {
	overflow: visible;
	padding-bottom: 24px;
	padding-left: 16px;
	padding-top: 0
}

.manual-carousel__contents-swiper .swiper-wrapper {
	align-items: flex-start
}

.manual-carousel__contents .swiper-slide {
	align-self: flex-start;
	height: auto;
	transition-timing-function: ease-in-out
}

.manual-carousel__contents .content-card {
	-webkit-backdrop-filter: blur(30px);
	backdrop-filter: blur(30px);
	background: hsla(0, 0%, 100%, .08);
	border: 1px solid hsla(0, 0%, 100%, .1);
	border-radius: 12px;
	display: flex;
	flex-direction: column;
	gap: 20px;
	height: 100%;
	min-height: 360px;
	padding: 40px;
	transition: transform .3s ease, box-shadow .3s ease
}

.has-hovers .manual-carousel__contents .content-card:hover {
	box-shadow: 0 12px 40px rgba(0, 0, 0, .3);
	transform: translateY(-4px)
}

.manual-carousel__contents .content-card h3 {
	font-size: 28px;
	font-weight: 600;
	line-height: 1.3;
	margin: 0
}

.manual-carousel__contents .content-card p {
	flex: 1;
	font-size: 16px;
	line-height: 1.5;
	margin: 0;
	opacity: .9
}

.manual-carousel__footer {
	align-items: center;
	display: flex;
	flex-direction: row;
	gap: 32px;
	grid-column: 1/-1;
	justify-content: center;
	padding: 40px 80px 0;
	width: 100%
}

@media(max-width:768px) {
	.manual-carousel__footer {
		padding-left: 24px;
		padding-right: 24px
	}
}

.manual-carousel__progress {
	align-items: center;
	display: flex;
	gap: 4px;
	justify-content: center;
	left: 0;
	margin-bottom: 16px;
	position: absolute;
	right: 0;
	top: 0
}

.manual-carousel__progress--is-relative {
	margin: 0;
	position: relative;
	width: 100%
}

.manual-carousel__controls {
	display: flex;
	gap: 10px;
	z-index: 1
}

.manual-carousel__button {
	align-items: center;
	background-color: #fff;
	border: 2px solid #d3d7d9;
	border-radius: 18px;
	cursor: pointer;
	display: inline-flex;
	height: 36px;
	isolation: isolate;
	justify-content: center;
	overflow: visible;
	padding: 0;
	position: relative;
	transform: translateZ(0);
	transition: all .2s ease;
	width: 36px
}

.manual-carousel__button:before {
	background-color: hsla(0, 0%, 100%, .4);
	border-radius: 18px;
	content: "";
	inset: 0;
	opacity: 0;
	position: absolute;
	transition: opacity .3s ease
}

.has-hovers .manual-carousel__button:hover:before {
	opacity: 1
}

.manual-carousel__button:active:before {
	background: radial-gradient(100% 163.88% at 100% 0, hsla(0, 0%, 100%, .48) 0, hsla(0, 0%, 100%, .16) 100%);
	opacity: 1
}

.manual-carousel__button--prev {
	border-color: #d3d7d9
}

.manual-carousel__button--prev .icon:after {
	opacity: .3
}

.manual-carousel__button--prev:not(:disabled) .icon:after {
	opacity: 1
}

.manual-carousel__button--next {
	border-color: #d3d7d9
}

.manual-carousel__button--next .icon:after {
	opacity: .3
}

.manual-carousel__button--next:not(:disabled) .icon:after {
	opacity: 1
}

.manual-carousel__button .icon,
.manual-carousel__button [class^=icon-] {
	align-items: center;
	display: flex;
	height: 14.142px;
	justify-content: center;
	position: relative;
	width: 14.142px
}

.manual-carousel__button .icon:after,
.manual-carousel__button [class^=icon-]:after {
	border: 2px solid #1b3073;
	border-right: none;
	border-top: none;
	content: "";
	display: block;
	height: 10px;
	position: relative;
	transform: rotate(45deg);
	width: 10px
}

.manual-carousel__button .icon svg,
.manual-carousel__button [class^=icon-] svg {
	display: none
}

.manual-carousel__button--prev .icon:after {
	left: 1px
}

.manual-carousel__button--next .icon:after {
	right: 1px;
	transform: rotate(-135deg)
}

.manual-carousel__button:disabled {
	cursor: unset
}

.manual-carousel__step {
	border-radius: 6px;
	flex: 1;
	height: 6px;
	overflow: hidden;
	transition: all .2s ease
}

.manual-carousel__step:not(.is-active) {
	background-color: #9c9c9c;
	height: 2px
}

.manual-carousel__step-fill {
	height: 100%;
	transform: translateX(-101%);
	transition: transform .15s ease-in-out
}

.manual-carousel__step.is-active {
	background-color: #fff
}

.manual-carousel__step.is-active .manual-carousel__step-fill {
	background-color: #fff;
	transform: translateX(0) !important
}

@media(min-width:768px)and (max-width:1023px) {
	.manual-carousel__progress {
		gap: 8px
	}
}

@media(max-width:1024px) {
	.manual-carousel__contents-swiper {
		padding-bottom: 20px;
		padding-left: 20px
	}
}

@media(min-width:1024px) {
	.manual-carousel__contents-swiper {
		padding-left: 40px
	}

	.manual-carousel__progress {
		gap: 10px
	}
}

@media(max-width:900px) {
	.manual-carousel__contents .content-card {
		min-height: 300px;
		padding: 32px
	}

	.manual-carousel__contents .content-card h3 {
		font-size: 24px
	}

	.manual-carousel__contents .content-card p {
		font-size: 15px
	}

	.manual-carousel__footer {
		gap: 24px;
		padding-top: 24px
	}

	.manual-carousel__controls {
		gap: 10px;
		justify-content: center
	}

	.manual-carousel__button {
		border-radius: 12px;
		height: 24px;
		width: 24px
	}

	.manual-carousel__button:before {
		border-radius: 12px
	}

	.manual-carousel__button .icon,
	.manual-carousel__button [class^=icon-] {
		height: 10px;
		width: 10px
	}

	.manual-carousel__button .icon:after,
	.manual-carousel__button [class^=icon-]:after {
		border-width: 1.5px;
		height: 7px;
		width: 7px
	}
}

.text-brand-blue-1 {
	color: var(--color-brand-blue-1)
}

.text-brand-blue-2 {
	color: var(--color-brand-blue-2)
}

.text-brand-blue-3 {
	color: var(--color-brand-blue-3)
}

.text-hero-dark-blue {
	color: var(--color-hero-dark-blue)
}

.text-brand-highlight {
	color: var(--color-brand-highlight)
}

.text-campaign-blue-green-95 {
	color: var(--color-campaign-blue-green-95)
}

.text-campaign-blue-green-90 {
	color: var(--color-campaign-blue-green-90)
}

.text-campaign-blue-green-85 {
	color: var(--color-campaign-blue-green-85)
}

.text-campaign-blue-green-80 {
	color: var(--color-campaign-blue-green-80)
}

.text-campaign-blue-green-70 {
	color: var(--color-campaign-blue-green-70)
}

.text-campaign-blue-green-60 {
	color: var(--color-campaign-blue-green-60)
}

.text-campaign-blue-green {
	color: var(--color-campaign-blue-green)
}

.text-campaign-blue-green-40 {
	color: var(--color-campaign-blue-green-40)
}

.text-campaign-blue-green-30 {
	color: var(--color-campaign-blue-green-30)
}

.text-campaign-blue-green-20 {
	color: var(--color-campaign-blue-green-20)
}

.text-campaign-blue-green-10 {
	color: var(--color-campaign-blue-green-10)
}

.text-microsoft-dark-teal-blue-60 {
	color: var(--color-microsoft-dark-teal-blue-60)
}

.text-neutral-white {
	color: var(--color-neutral-white)
}

.text-neutral-grey-96 {
	color: var(--color-neutral-grey-96)
}

.text-neutral-grey-90 {
	color: var(--color-neutral-grey-90)
}

.text-neutral-grey-84 {
	color: var(--color-neutral-grey-84)
}

.text-neutral-grey-80 {
	color: var(--color-neutral-grey-80)
}

.text-neutral-grey-70 {
	color: var(--color-neutral-grey-70)
}

.text-neutral-grey-60 {
	color: var(--color-neutral-grey-60)
}

.text-neutral-grey-50 {
	color: var(--color-neutral-grey-50)
}

.text-neutral-grey-40 {
	color: var(--color-neutral-grey-40)
}

.text-neutral-grey-32 {
	color: var(--color-neutral-grey-32)
}

.text-neutral-grey-24 {
	color: var(--color-neutral-grey-24)
}

.text-neutral-grey-20 {
	color: var(--color-neutral-grey-20)
}

.text-neutral-grey-16 {
	color: var(--color-neutral-grey-16)
}

.text-neutral-grey-10 {
	color: var(--color-neutral-grey-10)
}

.text-neutral-grey-4 {
	color: var(--color-neutral-grey-4)
}

.text-neutral-black {
	color: var(--color-neutral-black)
}

.text-dark-navy {
	color: var(--color-section-dark-navy)
}

.bg-campaign-blue-green-95 {
	background-color: var(--color-campaign-blue-green-95)
}

.bg-campaign-blue-green-90 {
	background-color: var(--color-campaign-blue-green-90)
}

.bg-campaign-blue-green-85 {
	background-color: var(--color-campaign-blue-green-85)
}

.bg-campaign-blue-green-80 {
	background-color: var(--color-campaign-blue-green-80)
}

.bg-campaign-blue-green-70 {
	background-color: var(--color-campaign-blue-green-70)
}

.bg-campaign-blue-green-60 {
	background-color: var(--color-campaign-blue-green-60)
}

.bg-campaign-blue-green {
	background-color: var(--color-campaign-blue-green)
}

.bg-campaign-blue-green-40 {
	background-color: var(--color-campaign-blue-green-40)
}

.bg-campaign-blue-green-30 {
	background-color: var(--color-campaign-blue-green-30)
}

.bg-campaign-blue-green-20 {
	background-color: var(--color-campaign-blue-green-20)
}

.bg-campaign-blue-green-10 {
	background-color: var(--color-campaign-blue-green-10)
}

.bg-microsoft-dark-teal-blue-60 {
	background-color: var(--color-microsoft-dark-teal-blue-60)
}

.bg-neutral-white {
	background-color: var(--color-neutral-white)
}

.bg-neutral-grey-96 {
	background-color: var(--color-neutral-grey-96)
}

.bg-neutral-grey-90 {
	background-color: var(--color-neutral-grey-90)
}

.bg-neutral-grey-84 {
	background-color: var(--color-neutral-grey-84)
}

.bg-neutral-grey-80 {
	background-color: var(--color-neutral-grey-80)
}

.bg-neutral-grey-70 {
	background-color: var(--color-neutral-grey-70)
}

.bg-neutral-grey-60 {
	background-color: var(--color-neutral-grey-60)
}

.bg-neutral-grey-50 {
	background-color: var(--color-neutral-grey-50)
}

.bg-neutral-grey-40 {
	background-color: var(--color-neutral-grey-40)
}

.bg-neutral-grey-32 {
	background-color: var(--color-neutral-grey-32)
}

.bg-neutral-grey-24 {
	background-color: var(--color-neutral-grey-24)
}

.bg-neutral-grey-20 {
	background-color: var(--color-neutral-grey-20)
}

.bg-neutral-grey-16 {
	background-color: var(--color-neutral-grey-16)
}

.bg-neutral-grey-10 {
	background-color: var(--color-neutral-grey-10)
}

.bg-neutral-grey-4 {
	background-color: var(--color-neutral-grey-4)
}

.bg-neutral-black {
	background-color: var(--color-neutral-black)
}

.bg-light-base-1 {
	background-color: var(--color-light-base-1)
}

.bg-light-base-2 {
	background-color: var(--color-light-base-2)
}

.bg-light-base-3 {
	background-color: var(--color-light-base-3)
}

.bg-hero-base-1 {
	background-color: var(--color-hero-base-1)
}

.bg-hero-base-2 {
	background-color: var(--color-hero-base-2)
}

.bg-background-primary {
	background-color: var(--color-background-primary)
}

.bg-background-secondary {
	background-color: var(--color-background-secondary)
}

.bg-background-tertiary {
	background-color: var(--color-background-tertiary)
}

.bg-gradient-primary-tertiary {
	background: linear-gradient(180deg, var(--color-background-primary) 0, var(--color-background-tertiary) 100%), var(--color-background-tertiary)
}

.bg-gradient-tertiary-primary {
	background: linear-gradient(180deg, var(--color-background-tertiary) 0, var(--color-background-primary) 100%)
}

.bg-gradient-light-blue-white {
	background: linear-gradient(180deg, var(--color-brand-light-blue) 0, var(--color-neutral-white) 100%)
}

.bg-utilities-partner {
	background-color: var(--color-utilities-partner) !important
}

.text-utilities-partner {
	color: var(--color-utilities-partner) !important
}

.bg-brand-light-blue {
	background-color: #e9f6ff !important
}

.bg-hero-dark-blue {
	background-color: var(--color-hero-dark-blue) !important
}

.bg-dark-navy {
	background-color: var(--color-section-dark-navy) !important
}