/* Fonts */

@font-face {
	font-family: 'PT Sans';
	font-style: normal;
	font-weight: 400;
	src: url("../fonts/ptsans-regular-VqhtDak.woff2") format(woff2);
}

@font-face {
	font-family: 'PT Sans';
	font-style: normal;
	font-weight: 700;
	src: url("../fonts/ptsans-bold-oV7zxLL.woff2") format(woff2);
}

@font-face {
	font-family: 'PT Sans';
	font-style: italic;
	font-weight: 400;
	src: url("../fonts/ptsans-italic-esdIsqD.woff2") format(woff2);
}

@font-face {
	font-family: 'PT Sans';
	font-style: italic;
	font-weight: 700;
	src: url("../fonts/ptsans-bolditalic-tShimpJ.woff2") format(woff2);
}

/* Root */

:root {
	--color-blue: #1b9cb5;
	--color-blue-dark: #0f5164;
	--color-blue-darker: #0b1f3d;
	--color-blue-light: #92ebf9;
	--color-gray: #313131;
	--color-pale: #f5fafb;
	--color-red: #f62924;
	--color-yellow: #e1f992;
}

/* Base */

html {
	scroll-behavior: smooth;
}

body {
	font: 400 1rem/1.2 'PT Sans', sans-serif;
	color: var(--color-blue-darker);
	overflow-x: hidden;
}

/* Layout */

.section {
	padding: 4rem 2rem;
}

.section--narrow {
	padding: 2.5em;
}

@media (min-width: 1024px) {

	.section {
		padding: 6rem 2rem;
	}

	.section--narrow {
		padding: 2.5em;
	}
}

.section--narrower {
	padding: 1.75em;
}

.container {
	margin-left: auto;
	margin-right: auto;
}

.container--sm {
	max-width: 640px;
}

.container--md {
	max-width: 736px;
}

.container--lg {
	max-width: 900px;
}

.container--xl {
	max-width: 1184px;
}

/* Grid*/

.grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2em;
}

.grid--align-center {
	align-items: center;
}

.grid--justify-center {
	justify-items: center;
}

.col {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.col-center {
	justify-content: center;
	align-items: center;
}

@media (max-width: 1023px) {
	
	.col--center-mobile {
		align-items: center;
	}
}

@media (min-width: 1024px) {

	.grid {
		gap: 3em;
	}

	.grid-cols-1 {
		gap: 1em;
	}

	.grid-large {
		gap: 6vw;
	}

	.grid-cols-2 {
		grid-template-columns: 1fr 1fr;
	}

	.grid-cols-3 {
		grid-template-columns: 1fr 1fr 1fr;
	}

	.grid-cols-4 {
		grid-template-columns: 1fr 1fr 1fr 1fr;
	}

	.grid-cols-5 {
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	}

	.col-span-2 {
		grid-column: span 2;
	}

	.col-span-3 {
		grid-column: span 3;
	}

	.col-span-4 {
		grid-column: span 4;
	}

	.col-2 {
		grid-column: 2;
	}

	.col-3 {
		grid-column: 3;
	}

	.col-4 {
		grid-column: 4;
	}

	.col-2-span-3 {
		grid-column: 2 / span 3;
	}
}

/* Spacing */

.mb-5 {
	margin-bottom: 2rem;
}

.mb-6 {
	margin-bottom: 4rem;
}

.mt-2 {
	margin-top: 0.5rem;
}

.mt-3 {
	margin-top: 1rem;
}

.mt-4 {
	margin-top: 1.25rem;
}

.mt-5 {
	margin-top: 2rem;
}

.mt-6 {
	margin-top: 3.5rem;
}

/* Position */

.position-relative {
	position: relative;
}

.position-absolute {
	position: absolute;
}

.bottom-0 {
	bottom: 0;	
}

.top-0 {
	top: 0;	
}

.right-0 {
	right: 0;	
}

/* Typography */

.h1 {
	font-size: clamp(2.25rem, 3.75vw, 3.375rem);
	line-height: 1;
}

.h2 {
	font-size: clamp(2.25rem, 3.125vw, 2.8125rem);
	line-height: 1;
}

.h2 sup {
	font-size: 0.6em;
	margin-left: 0.05em;
}

.fs-1 {
	font-size: 2rem;
}

.fs-2 {
	font-size: 1.5rem;
}

.fs-3 {
	font-size: 1.375rem;
}

.fs-4 {
	font-size: 1.25rem;
}

.fs-5 {
	font-size: 1.125rem;
}

.fs-6 {
	font-size: 1rem;
}

.fs-7 {
	font-size: 0.875rem;
}

.fs-8 {
	font-size: 0.75rem;
}

.fw-bold {
	font-weight: 700;
}

@media (min-width: 1024px) {
	.fw-bold-desktop {
		font-weight: 700;
	}
}

.fs-italicontainer {
	font-style: italic;
}

.fs-bolditalic {
	font-style: italic;
	font-weight: 700;
}

.fs-normal {
	font-style: normal;
}

/* Buttons */

.btn {
	display: inline-block;
	padding: 1em 1.5em;
	border: 0;
	border-radius: 0.66em;
	line-height: 1;
	text-align: center;
	vertical-align: middle;
	user-select: none;
	cursor: pointer;
	outline: none;
	font-weight: 700;
	transition-property: background-color, color;
	transition-duration: 250ms;
	transition-timing-function: ease-in-out;
}

.btn--smaller {
	min-width: 128px;
}

.btn--small {
	min-width: 192px;
}

.btn--large {
	min-width: 288px;
}

.btn--light {
	background-color: #fff;
	color: var(--color-blue-darker);
}

.btn--light:hover {
	background-color: var(--color-blue);
	color: #fff;
}

.btn--dark,
.btn--link {
	background-color: var(--color-blue);
	color: #fff;
}

.btn--link {
	border-radius: 9999px;
}

.btn--dark:hover,
.btn--link:hover {
	background-color: var(--color-blue-light);
}

.btn-group {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2em;
}

.btn:disabled {
	opacity: 0.5;
}

@media (min-width: 768px) {
	.btn-group {
		flex-direction: row;
	}

	.btn-group--center {
		justify-content: center;
	}
}

/* Badges */

.badge {
	display: inline-block;
	padding: 0.66em;
	background-color: rgb(55, 115, 125);
	border: 2px solid rgb(105, 165, 175);
	color: #fff;
	border-radius: 1.3825em;
	font-weight: 700;
	line-height: 1;
}

/* Dialog */

.dialog {
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	margin: 0;
	border: none;
	border-radius: 0.5em;
	padding: 1.5em;
	width: min(100dvw, 600px);
	max-height: 100%;
	z-index: 1;
	overflow: auto;
	background: #fff;
}

.dialog::backdrop {
	background: rgba(0, 0, 0, 0.5);
}

.dialog__close {
	appearance: none;

	background: none;
	background-color: transparent;
	border: none;
	border-radius: 0;
	box-shadow: none;

	margin: 0;
	padding: 0;

	cursor: pointer;
	
	position: absolute;
	top: 0.5em;
	right: 0.5em;
}

.dialog>video {
	margin: 0 auto;
}

@media (min-width: 1024px) {

	.dialog {
		left: 50%;
		transform: translate(-50%, -50%);
		padding: 3em;
	}

	.dialog__close {
		top: 1.25em;
		right: 1.25em;
	}
}

/* Tabs */

/* hide the actual radio inputs */
.tabs input[type="radio"] {
	display: none;
}

.tabs label {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 0.75em 1.25em;
	cursor: pointer;
	border-bottom: 4px solid transparent;
	position: relative;
	transition: background-color 200ms ease-in-out;
}

.tabs label:hover {
	background-color: var(--color-pale);
}

@media (max-width: 1023px) {

	.tabs label::after {
		content: '\e801';
		font-family: 'icons';
		font-weight: 400;
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		color: var(--color-blue);
	}

	.tabs input[type="radio"]:checked+label::after {
		content: '\e802';
	}
}

/* accordion panel: hidden by default, shown when its radio is checked */
.tab-panel {
	display: none;
	padding: 1.4em 0;
}

.tabs input[type="radio"]:checked+label+.tab-panel {
	display: block;
}

/* highlight active label */
.tabs input[type="radio"]:checked+label {
	background: #fff;
	font-weight: 700;
	border-bottom: 4px solid var(--color-blue);
}

/* --- Desktop: switch to tab layout --- */
@media (min-width: 1024px) {
	.tabs {
		display: flex;
		flex-wrap: wrap;
	}

	.tabs label {
		order: 1;
		flex-grow: 1;
		align-items: center;
		text-align: center;
	}

	.tab-panel {
		padding: 1.4em;
		order: 2;
		width: 100%;
		border-top: 1px solid #ddd;
	}
}

/* Highlights */

.highlight {
	padding: 2em;
	border-radius: 0.5em;
}

.highlight--light {
	box-shadow: 0px 7.03px 16.88px 0px rgba(0, 67, 101, 0.2);
}

.highlight--blue {
	padding: 1.5em;
	background-color: rgba(164, 199, 215, 0.15);
	box-shadow: 0 5.625px 14.063px 0 rgba(158, 218, 229, 0.25);
	height: 100%;
}

.highlight--pale {
	background-color: var(--color-pale);
}

@media (min-width: 1024px) {

	.highlight--blue {
		padding: 2em;
	}

	.highlight--light {
		padding-right: 360px;
	}
}

/* Separator */

.separator {
	border: none;
	border-top: 2px solid  #e8e8e8;
}

/* Lists */

.list-group {
	display: flex;
	flex-direction: column;
	gap: 1.5em;
	padding-left: 1em;
}

.list-group--compact {
	gap: 0.25em;
}

.list-group--bullet {
	list-style-type: disc;
}

.list-group--numbered {
	list-style-type: decimal;
}

.list-group--grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2em;
	counter-reset: group;
	padding-left: 0;
}

.list-group--grid .list-group-item {
	padding: 1.5em 2em;
	border-radius: 1.25em;
	box-shadow: 0px 7.03px 16.88px 0px rgba(0, 67, 101, 0.2);
}

.list-group--grid .list-group-item::before {
	counter-increment: group;
	content: counter(group);
	width: 2em;
	height: 2em;
	aspect-ratio: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 0.5em;
	margin-bottom: 1em;
	font-weight: 700;
	background-color: var(--color-pale);
	border-radius: 0.45em;
	box-shadow: 0px 1.03px 4.11px 0px rgba(99, 99, 99, 0.2);
	color: var(--color-blue);
}

.list-group-item.list-group-item--danger,
.list-group-item.list-group-item--danger::before {
	color: var(--color-red);
}

@media (min-width: 1024px) {

	.list-group {
		padding-left: 1.5em;
	}
	.list-group--grid {
		grid-template-columns: repeat(3, 1fr);
		padding-left: 0;
	}
}

/* Video */

.video {
	appearance: none;
	background: none;
	background-color: #fff;
	border: none;
	border-radius: 1em;
	box-shadow: 0 0.75em 2em 0 rgba(149, 157, 165, 0.20);
	overflow: hidden;
	
	margin: 0;
	padding: 0;
	text-align: left;
	max-width: 336px;

}

.video[data-modal-target="buttonOpen"] {
	cursor: pointer;
}

.video__thumbnail_wrapper {
	aspect-ratio: 2/1;
	position: relative;
}

.video__thumbnail_wrapper::after {
	content: '';
	position: absolute;
	width: 32px;
	aspect-ratio: 1;
	border-radius: 50%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: url("../images/icon-play-blue-W-QeLxd.svg") center/104% auto;
	box-shadow: 0.804px 0.804px 16.071px 0 rgba(158, 218, 229, 0.50);
}

.video__thumbnail_wrapper img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.video__body {
	padding: 1.5em 2em;
	display: flex;
	flex-direction: column;
	gap: 0.5em;
	color: var(--color-blue-darker);
	min-height: 160px;
}

/* Form */

.form {
	max-width: 850px;
}

.form-item-group {
	display: flex;
	flex-direction: column;
	gap: 1em;
}

.form-item {
	display: flex;
	flex-direction: column;
	gap: 0.5em;	
}

.form-item > ul {
	color: var(--color-red);
}

.form-item > label.required::after {
    content: " *";
    color: #e53935; /* red, or your brand's "danger/required" color */
    font-weight: bold;
}

.form-item.form-item--choice {
	flex-direction: row;
}

.form-item.form-item--choice>input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.form-item.form-item--choice > input + label {
	position: relative;
	padding-left: 2em;
}

.form-item.form-item--choice > input + label:before {
	content: '';
	width: 1em;
	height: 1em;
	aspect-ratio: 1;
	border: 1px solid #D9D9D9;
	border-radius: 0.1875em;
	position: absolute;
	top: 0;
	left: 0;
}

.form-item.form-item--choice > input:checked + label:before {
	background-color: var(--color-blue-dark);
	border-color: var(--color-blue-dark);
}

.form-input {
	padding: 0.8em;
	border: 0;
	border-bottom: 2px solid #d2d2d2;
	width: 100%;
}

.form-input::placeholder {
    color: #d2d2d2;
}

.form-input:focus {
    outline: none;
}

.form-check-group {
	display: flex;
	flex-direction: column;
	gap: 2em;
}

.form-check {
	font-size: 1rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	gap: 1em;
}

.form-check label {
	font-weight: 700;
	padding: 1.125em 1.375em;
	border: 1px solid #d2d2d2;
	border-radius: 0.75em;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	transition-property: background-color, color;
	transition-duration: 200ms;
}

.form-check input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.form-check input:checked + label {
	background-color: var(--color-pale);
	color: var(--color-blue);
}

@media (min-width: 1024px) {

	.form-check-group {
		flex-direction: row;
	}
}

/* Colors */

.blue {
	color: var(--color-blue);
}

.blue-light {
	color: var(--color-blue-light);
}

.red {
	color: var(--color-red);
}

.yellow {
	color: var(--color-yellow);
}

.white {
	color: #fff;
}

.bg-blue-dark {
	background-color: var(--color-blue-dark);
}

.bg-blue-gradient {
	background: linear-gradient(to bottom, #0b1f3d 0%, #1b9cb5 200%);
}

/* Other */

.address {
	display: flex;
	flex-direction: column;
}

.alert {
	display: flex;
	gap: 0.5em;
}

.flash-notice {
	color: var(--color-blue);
}

.icon-tile {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 5em;
	aspect-ratio: 1;
	border-radius: 1em;
	box-shadow: 0 0.1em 0.7em 0 rgba(99, 99, 99, 0.20);
}

.icon-tile>img {
	width: 60%;
}

@media (min-width: 1024px) {

	.footer__links {
		display: flex;
		justify-content: center;
		gap: 1em;
	}
	
	.footer__links li:not(:last-child)::after {
	    content: "—";
	    margin-left: 1em;
	    color: inherit;
	}
}

/* Utility */

.text-center {
	text-align: center;
}

@media (max-width: 1023px) {

	.text-center-mobile {
		text-align: center;
	}
}

.text-justify {
	text-align: justify;
}

.text-dimmed {
	opacity: 0.8;
}

.text-underline {
	text-decoration: underline;
}

.break-all {
	word-break: break-all;
}

@media (max-width: 1023px) {

	.hide-on-mobile {
		display: none;
	}
}

@media (min-width: 1024px) {
	
	.text-justify-desktop {
		text-align: justify;
	}
}

/* Specifics */

#hero {
	background: 
		linear-gradient(to left, rgba(27, 156, 181, 0.00) -50.27%, #0F5164 107.03%),
		transparent url("../images/hero-mobile-vurHAfk.webp") no-repeat right top/cover;	
}

#icaz-logo {
	top: 1.5rem;
	right: 3.61vw;
}

@media (min-width: 1024px) {

	#hero {
		background: 
			linear-gradient(to left, rgba(27, 156, 181, 0.00) 35.03%, #0F5164 117.52%),
			linear-gradient(to left, rgba(27, 156, 181, 0.00) 30.45%, rgba(12, 34, 64, 0.25) 76.13%),
			transparent url("../images/hero-desktop-_bkGQHV.webp") no-repeat right top/cover;	
	}
}