:root {
	--white: #ffffff;
	--white-rgb: 255, 255, 255;
	--black: #000000;
	--black-rgb: 0, 0, 0;
	
	--primary: #003462;
	--primary-rgb: 0, 52, 98;
	--secondary: #698094;
	--secondary-rgb: 105, 128, 148;
	--pressed: #00192F;
	--pressed-rgb: 0, 25, 47;
	
    --orange-600: #BD550D;
    --orange-600-rgb: 189, 85, 13;
    --orange-500: #ED6A10;
    --orange-500-rgb: 237, 106, 16;
    --orange-200: #FFD0AF;
    --orange-200-rgb: 255, 208, 175;
    --orange-50: #FFE9DA;
    --orange-50-rgb: 255, 233, 218;

    --turquoise-800: #007876;
    --turquoise-800-rgb: 0, 120, 118;
    --turquoise-700: #00ABA8;
    --turquoise-700-rgb: 0, 171, 168;
    --turquoise-200: #D0FFFE;
    --turquoise-200-rgb: 208, 255, 254;
    --turquoise-50: #F4FFFF;
    --turquoise-50-rgb: 244, 255, 255;
    
    --success-600: #00B956;
    --success-600-rgb: 0, 185, 86;
    --success-50: #DDFFEC;
    --success-50-rgb: 221, 255, 236;
    --danger-400: #F62434;
    --danger-400-rgb: 246, 36, 52;
    --danger-100: #FFC5C9;
    --danger-100-rgb: 255, 197, 201
    --warning-500: #FFA717;
    --warning-500-rgb: 255, 167, 23;
    --warning-100: #FFEDD1;
    --warning-100-rgb: 255, 237, 209;
    --info-400: #3CB9FF;
    --info-400-rgb: 60, 185, 255;
    --info-100: #D8F1FF;
    --info-100-rgb: 216, 241, 255;

    --turquoise-gray-600: #508080;
    --turquoise-gray-600-rgb: 80, 128, 128;
	--turquoise-gray-500: #649F9F;
    --turquoise-gray-500-rgb: 100, 159, 159;
    --turquoise-gray-400: #84B2B2;
	--turquoise-gray-400-rgb: 132, 178, 178;
    --turquoise-gray-300: #A3C6C6;
    --turquoise-gray-300-rgb: 163, 198, 198;
    --turquoise-gray-200: #C3D9D9;
    --turquoise-gray-200-rgb: 195, 217, 217;
    --turquoise-gray-100: #E2EDED;
    --turquoise-gray-100-rgb: 226, 237, 237;
    --turquoise-gray-50: #F4FAFA;
    --turquoise-gray-50-rgb: 244, 250, 250;
    
    --overlay-1: #007C7A99;
    --overlay-2: #007C7A33;

    --sp4: 4px;
    --sp8: 8px;
    --sp16: 16px;
    --sp24: 24px;
    --sp32: 32px;
    --sp40: 40px;
    --sp48: 48px;
    --sp60: 60px;
    --sp120: 120px;
	--sp124: 124px;
    --sp264: 264px;
    
    --r12: 12px;
    --r16: 16px;
    --r28: 28px;
    --r48: 48px;
    --r80: 80px;

    --text-h1: 60px;
    --text-h2: 48px;
    --text-h3: 40px;
    --text-h4: 34px;
    --text-h5: 24px;
    --text-body: 18px;
    --text-small: 14px;
    --text-button-1: 24px;
    --text-button-2: 18px;
    --text-number-large: 100px;
    --text-number-medium: 48px;

    --transition-1: ease-out 300ms;

	--bg-opacity: 1;

	
	--shadow: 0px 8px 20px 0px rgba(80, 128, 128, 0.12);
	--shadow-small: 0px 4px 8px 0px rgba(80, 128, 128, 0.04);
	--shadow-card: 0px 4px 40px 0px rgba(227, 246, 246, 1);
	--shadow-card-hover: 0px 4px 40px 0px rgba(195, 244, 243, 1);
	
	
	--header-logo-width: 191px;
	--header-logo-height: 40px;
	--footer-logo-width: 300px;
	--footer-logo-height: 63px;
	--bs-border-opacity: 1;
	--bs-modal-width: 432px;
}

:focus {
    box-shadow: none !important;
    outline: 0 !important;
}

html, body {
	min-height: 100vh;
	margin: 0;
	padding: 0;
    display: flex;
    flex-direction: column;
}
html {
	scroll-behavior: auto !important;
}
body {
    font-family: Roboto;
    font-weight: 400;
    font-size: var(--text-body);
    line-height: 140%;
    color: var(--primary);
    background-color: var(--white);
    position: relative;
}
.page_content {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

p:last-child {
	margin-bottom: 0;
}

a {
	text-decoration: none !important;
	color: var(--info-400);
}

.fh {
    display: flex;
    flex-direction: row;
}
.fv {
    display: flex;
    flex-direction: column;
}


h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
	margin: 0;
}

h1, .h1 {
    font-family: Roboto;
    font-weight: 700;
    font-size: var(--text-h1);
    line-height: 110%;
}
h2, .h2 {
    font-family: Roboto;
    font-weight: 700;
    font-size: var(--text-h2);
    line-height: 110%;
}
h3, .h3 {
    font-family: Roboto;
    font-weight: 700;
    font-size: var(--text-h3);
    line-height: 110%;
}
h4, .h4 {
    font-family: Roboto;
    font-weight: 700;
    font-size: var(--text-h4);
    line-height: 120%;
}
h5, .h5 {
    font-family: Roboto;
    font-weight: 700;
    font-size: var(--text-h5);
    line-height: 130%;
}
h1.h3, .h1.h3 {
    line-height: 120%;
}

.text-body {
    font-family: Roboto;
    font-weight: 400;
    font-size: var(--text-body);
    line-height: 140%;
}
.text-small {
    font-family: Roboto;
    font-weight: 400;
    font-size: var(--text-small);
    line-height: 150%;
}
.text-button-1 {
    font-family: Roboto;
    font-weight: 700;
    font-size: var(--text-button-1);
    line-height: 100%;
}
.text-button-2 {
    font-family: Roboto;
    font-weight: 500;
    font-size: var(--text-button-2);
    line-height: 100%;
}
.text-number-large {
    font-family: 'Marck Script';
    font-weight: 400;
    font-size: var(--text-number-large);
    line-height: 40%;
}
.text-number-medium {
    font-family: 'Marck Script';
    font-weight: 400;
    font-size: var(--text-number-medium);
    line-height: 80%;
}


.color-white {
    color: var(--white) !important;
}
.color-black {
    color: var(--black) !important;
}
.color-primary {
    color: var(--primary) !important;
}
.color-secondary {
    color: var(--secondary) !important;
}
.color-pressed {
    color: var(--pressed) !important;
}
.color-orange-600 {
    color: var(--orange-600) !important;
}
.color-orange-500 {
    color: var(--orange-500) !important;
}
.color-orange-200 {
    color: var(--orange-200) !important;
}
.color-orange-50 {
    color: var(--orange-50) !important;
}
.color-turquoise-800 {
    color: var(--turquoise-800) !important;
}
.color-turquoise-700 {
    color: var(--turquoise-700) !important;
}
.color-turquoise-200 {
    color: var(--turquoise-200) !important;
}
.color-turquoise-50 {
    color: var(--turquoise-50) !important;
}
.color-turquoise-gray-600 {
    color: var(--turquoise-gray-600) !important;
}
.color-turquoise-gray-500 {
    color: var(--turquoise-gray-500) !important;
}
.color-turquoise-gray-400 {
    color: var(--turquoise-gray-400) !important;
}
.color-turquoise-gray-300 {
    color: var(--turquoise-gray-300) !important;
}
.color-turquoise-gray-200 {
    color: var(--turquoise-gray-200) !important;
}
.color-turquoise-gray-100 {
    color: var(--turquoise-gray-100) !important;
}
.color-turquoise-gray-50 {
    color: var(--turquoise-gray-50) !important;
}
.color-success-600 {
    color: var(--success-600) !important;
}
.color-success-50 {
    color: var(--success-50) !important;
}
.color-danger-400 {
    color: var(--danger-400) !important;
}
.color-danger-100 {
    color: var(--danger-100) !important;
}
.color-warning-500 {
    color: var(--warning-500) !important;
}
.color-warning-100 {
    color: var(--warning-100) !important;
}
.color-info-400 {
    color: var(--info-400) !important;
}
.color-info-100 {
    color: var(--info-100) !important;
}

.bg-white {
	background-color: rgba(var(--white-rgb), var(--bg-opacity)) !important;
}
.bg-black {
	background-color: rgba(var(--black-rgb), var(--bg-opacity)) !important;
}
.bg-primary {
	background-color: rgba(var(--primary-rgb), var(--bg-opacity)) !important;
}
.bg-secondary {
	background-color: rgba(var(--secondary-rgb), var(--bg-opacity)) !important;
}
.bg-pressed {
	background-color: rgba(var(--pressed-rgb), var(--bg-opacity)) !important;
}
.bg-orange-600 {
	background-color: rgba(var(--orange-600-rgb), var(--bg-opacity)) !important;
}
.bg-orange-500 {
	background-color: rgba(var(--orange-500-rgb), var(--bg-opacity)) !important;
}
.bg-orange-200 {
	background-color: rgba(var(--orange-200-rgb), var(--bg-opacity)) !important;
}
.bg-orange-50 {
	background-color: rgba(var(--orange-50-rgb), var(--bg-opacity)) !important;
}
.bg-turquoise-800 {
	background-color: rgba(var(--turquoise-800-rgb), var(--bg-opacity)) !important;
}
.bg-turquoise-700 {
	background-color: rgba(var(--turquoise-700-rgb), var(--bg-opacity)) !important;
}
.bg-turquoise-200 {
	background-color: rgba(var(--turquoise-200-rgb), var(--bg-opacity)) !important;
}
.bg-turquoise-50 {
	background-color: rgba(var(--turquoise-50-rgb), var(--bg-opacity)) !important;
}
.bg-turquoise-gray-600 {
	background-color: rgba(var(--turquoise-gray-600-rgb), var(--bg-opacity)) !important;
}
.bg-turquoise-gray-500 {
	background-color: rgba(var(--turquoise-gray-500-rgb), var(--bg-opacity)) !important;
}
.bg-turquoise-gray-400 {
	background-color: rgba(var(--turquoise-gray-400-rgb), var(--bg-opacity)) !important;
}
.bg-turquoise-gray-300 {
	background-color: rgba(var(--turquoise-gray-300-rgb), var(--bg-opacity)) !important;
}
.bg-turquoise-gray-200 {
	background-color: rgba(var(--turquoise-gray-200-rgb), var(--bg-opacity)) !important;
}
.bg-turquoise-gray-100 {
	background-color: rgba(var(--turquoise-gray-100-rgb), var(--bg-opacity)) !important;
}
.bg-turquoise-gray-50 {
	background-color: rgba(var(--turquoise-gray-50-rgb), var(--bg-opacity)) !important;
}
.bg-success-600 {
	background-color: rgba(var(--success-600-rgb), var(--bg-opacity)) !important;
}
.bg-success-50 {
	background-color: rgba(var(--success-50-rgb), var(--bg-opacity)) !important;
}
.bg-danger-400 {
	background-color: rgba(var(--danger-400-rgb), var(--bg-opacity)) !important;
}
.bg-danger-100 {
	background-color: rgba(var(--danger-100-rgb), var(--bg-opacity)) !important;
}
.bg-warning-500 {
	background-color: rgba(var(--warning-500-rgb), var(--bg-opacity)) !important;
}
.bg-warning-100 {
	background-color: rgba(var(--warning-100-rgb), var(--bg-opacity)) !important;
}
.bg-info-400 {
	background-color: rgba(var(--info-400-rgb), var(--bg-opacity)) !important;
}
.bg-info-100 {
	background-color: rgba(var(--info-100-rgb), var(--bg-opacity)) !important;
}

.bg-opacity-75 {
    --bg-opacity: 0.75;
}
.bg-opacity-50 {
    --bg-opacity: 0.5;
}
.bg-opacity-25 {
    --bg-opacity: 0.25;
}

.bg-overlay-1 {
	background-color: var(--overlay-1);
}
.bg-overlay-2 {
	background-color: var(--overlay-2);
}



.border-white {
	border-color: rgba(var(--white-rgb), var(--bs-border-opacity)) !important;
}
.border-black {
	border-color: rgba(var(--black-rgb), var(--bs-border-opacity)) !important;
}
.border-primary {
	border-color: rgba(var(--primary-rgb), var(--bs-border-opacity)) !important;
}
.border-secondary {
	border-color: rgba(var(--secondary-rgb), var(--bs-border-opacity)) !important;
}
.border-pressed {
	border-color: rgba(var(--pressed-rgb), var(--bs-border-opacity)) !important;
}
.border-orange-600 {
	border-color: rgba(var(--orange-600-rgb), var(--bs-border-opacity)) !important;
}
.border-orange-500 {
	border-color: rgba(var(--orange-500-rgb), var(--bs-border-opacity)) !important;
}
.border-orange-200 {
	border-color: rgba(var(--orange-200-rgb), var(--bs-border-opacity)) !important;
}
.border-orange-50 {
	border-color: rgba(var(--orange-50-rgb), var(--bs-border-opacity)) !important;
}
.border-turquoise-800 {
	border-color: rgba(var(--turquoise-800-rgb), var(--bs-border-opacity)) !important;
}
.border-turquoise-700 {
	border-color: rgba(var(--turquoise-700-rgb), var(--bs-border-opacity)) !important;
}
.border-turquoise-200 {
	border-color: rgba(var(--turquoise-200-rgb), var(--bs-border-opacity)) !important;
}
.border-turquoise-50 {
	border-color: rgba(var(--turquoise-50-rgb), var(--bs-border-opacity)) !important;
}
.border-turquoise-gray-600 {
	border-color: rgba(var(--turquoise-gray-600-rgb), var(--bs-border-opacity)) !important;
}
.border-turquoise-gray-500 {
	border-color: rgba(var(--turquoise-gray-500-rgb), var(--bs-border-opacity)) !important;
}
.border-turquoise-gray-400 {
	border-color: rgba(var(--turquoise-gray-400-rgb), var(--bs-border-opacity)) !important;
}
.border-turquoise-gray-300 {
	border-color: rgba(var(--turquoise-gray-300-rgb), var(--bs-border-opacity)) !important;
}
.border-turquoise-gray-200 {
	border-color: rgba(var(--turquoise-gray-200-rgb), var(--bs-border-opacity)) !important;
}
.border-turquoise-gray-100 {
	border-color: rgba(var(--turquoise-gray-100-rgb), var(--bs-border-opacity)) !important;
}
.border-turquoise-gray-50 {
	border-color: rgba(var(--turquoise-gray-50-rgb), var(--bs-border-opacity)) !important;
}
.border-success-600 {
	border-color: rgba(var(--success-600-rgb), var(--bs-border-opacity)) !important;
}
.border-success-50 {
	border-color: rgba(var(--success-50-rgb), var(--bs-border-opacity)) !important;
}
.border-danger-400 {
	border-color: rgba(var(--danger-400-rgb), var(--bs-border-opacity)) !important;
}
.border-danger-100 {
	border-color: rgba(var(--danger-100-rgb), var(--bs-border-opacity)) !important;
}
.border-warning-500 {
	border-color: rgba(var(--warning-500-rgb), var(--bs-border-opacity)) !important;
}
.border-warning-100 {
	border-color: rgba(var(--warning-100-rgb), var(--bs-border-opacity)) !important;
}
.border-info-400 {
	border-color: rgba(var(--info-400-rgb), var(--bs-border-opacity)) !important;
}
.border-info-100 {
	border-color: rgba(var(--info-100-rgb), var(--bs-border-opacity)) !important;
}


.p4 {
	padding: var(--sp4) !important;
}
.pt4 {
	padding-top: var(--sp4) !important;
}
.pb4 {
	padding-bottom: var(--sp4) !important;
}
.ps4 {
	padding-left: var(--sp4) !important;
}
.pe4 {
	padding-right: var(--sp4) !important;
}

.p8 {
	padding: var(--sp8) !important;
}
.pt8 {
	padding-top: var(--sp8) !important;
}
.pb8 {
	padding-bottom: var(--sp8) !important;
}
.ps8 {
	padding-left: var(--sp8) !important;
}
.pe8 {
	padding-right: var(--sp8) !important;
}

.p16 {
	padding: var(--sp16) !important;
}
.pt16 {
	padding-top: var(--sp16) !important;
}
.pb16 {
	padding-bottom: var(--sp16) !important;
}
.ps16 {
	padding-left: var(--sp16) !important;
}
.pe16 {
	padding-right: var(--sp16) !important;
}

.p24 {
	padding: var(--sp24) !important;
}
.pt24 {
	padding-top: var(--sp24) !important;
}
.pb24 {
	padding-bottom: var(--sp24) !important;
}
.ps24 {
	padding-left: var(--sp24) !important;
}
.pe24 {
	padding-right: var(--sp24) !important;
}

.p32 {
	padding: var(--sp32) !important;
}
.pt32 {
	padding-top: var(--sp32) !important;
}
.pb32 {
	padding-bottom: var(--sp32) !important;
}
.ps32 {
	padding-left: var(--sp32) !important;
}
.pe32 {
	padding-right: var(--sp32) !important;
}

.p40 {
	padding: var(--sp40) !important;
}
.pt40 {
	padding-top: var(--sp40) !important;
}
.pb40 {
	padding-bottom: var(--sp40) !important;
}
.ps40 {
	padding-left: var(--sp40) !important;
}
.pe40 {
	padding-right: var(--sp40) !important;
}

.p48 {
	padding: var(--sp48) !important;
}
.pt48 {
	padding-top: var(--sp48) !important;
}
.pb48 {
	padding-bottom: var(--sp48) !important;
}
.ps48 {
	padding-left: var(--sp48) !important;
}
.pe48 {
	padding-right: var(--sp48) !important;
}

.p60 {
	padding: var(--sp60) !important;
}
.pt60 {
	padding-top: var(--sp60) !important;
}
.pb60 {
	padding-bottom: var(--sp60) !important;
}
.ps60 {
	padding-left: var(--sp60) !important;
}
.pe60 {
	padding-right: var(--sp60) !important;
}

.p120 {
	padding: var(--sp120) !important;
}
.pt120 {
	padding-top: var(--sp120) !important;
}
.pb120 {
	padding-bottom: var(--sp120) !important;
}
.ps120 {
	padding-left: var(--sp120) !important;
}
.pe120 {
	padding-right: var(--sp120) !important;
}

.p124 {
	padding: var(--sp124) !important;
}
.pt124 {
	padding-top: var(--sp124) !important;
}
.pb124 {
	padding-bottom: var(--sp124) !important;
}
.ps124 {
	padding-left: var(--sp124) !important;
}
.pe124 {
	padding-right: var(--sp124) !important;
}

.p264 {
	padding: var(--sp264) !important;
}
.pt264 {
	padding-top: var(--sp264) !important;
}
.pb264 {
	padding-bottom: var(--sp264) !important;
}
.ps264 {
	padding-left: var(--sp264) !important;
}
.pe264 {
	padding-right: var(--sp264) !important;
}


.gap4 {
    gap: var(--sp4);
}
.gap8 {
    gap: var(--sp8);
}
.gap16 {
    gap: var(--sp16);
}
.gap24 {
    gap: var(--sp24);
}
.gap32 {
    gap: var(--sp32);
}
.gap40 {
    gap: var(--sp40);
}
.gap48 {
    gap: var(--sp48);
}
.gap60 {
    gap: var(--sp60);
}
.gap120 {
    gap: var(--sp120);
}
.gap124 {
    gap: var(--sp124);
}


.row4 {
	--bs-gutter-x: var(--sp4);
	--bs-gutter-y: var(--sp4);
}
.row8 {
	--bs-gutter-x: var(--sp8);
	--bs-gutter-y: var(--sp8);
}
.row16 {
	--bs-gutter-x: var(--sp16);
	--bs-gutter-y: var(--sp16);
}
.row24 {
	--bs-gutter-x: var(--sp24);
	--bs-gutter-y: var(--sp24);
}
.row48 {
	--bs-gutter-x: var(--sp48);
	--bs-gutter-y: var(--sp48);
}


.br12 {
	--bs-border-radius: var(--r12);
	border-radius: var(--bs-border-radius);
	overflow: hidden;
}
.br16 {
	--bs-border-radius: var(--r16);
	border-radius: var(--bs-border-radius);
	overflow: hidden;
}
.br28 {
	--bs-border-radius: var(--r28);
	border-radius: var(--bs-border-radius);
	overflow: hidden;
}
.br48 {
	--bs-border-radius: var(--r48);
	border-radius: var(--bs-border-radius);
	overflow: hidden;
}
.br80 {
	--bs-border-radius: var(--r80);
	border-radius: var(--bs-border-radius);
	overflow: hidden;
}

.bw1 {
	width: 1px !important;
	min-width: 1px !important;
}
.bh1 {
	width: 100%;
	height: 1px !important;
	min-height: 1px !important;
}


.op35 {
	opacity: 35%;
}


.button {
    width: max-content;
    padding: var(--sp16) var(--sp32);
    display: flex;
    text-wrap: nowrap;
    justify-content: center;
    align-items: center;
    transition: var(--transition-1);
    border: 1px solid transparent;
    border-radius: var(--r16);
    background-color: transparent;
    gap: 8px;
    position: relative;
    z-index: 2;
}

.button-primary {
    background-color: var(--orange-500);
    color: var(--white);
    padding-right: var(--sp24);
    padding-left: var(--sp32);
    height: 60px;
}
.button-primary:hover {
    background-color: var(--orange-600);
}
.button-primary:active {
    background-color: var(--pressed);
}

.button-primary-turquoise {
    background-color: var(--turquoise-700);
    color: var(--white);
    padding: 0 var(--sp32);
    height: 52px;
}
.button-primary-turquoise:hover {
    background-color: var(--turquoise-800);
}
.button-primary-turquoise:active {
    background-color: var(--pressed);
}

.button-primary-orange {
    background-color: var(--orange-500);
    color: var(--white);
    padding: 0 var(--sp32);
    height: 52px;
}
.button-primary-orange:hover {
    background-color: var(--orange-600);
}
.button-primary-orange:active {
    background-color: var(--pressed);
}

.button-secondary {
    background-color: var(--white);
    color: var(--orange-500);
    padding: 0 var(--sp32);
    height: 52px;
}
.button-secondary-2 {
    background-color: var(--turquoise-gray-50);
}
.button-secondary:hover {
    background-color: var(--turquoise-gray-100);
}
.button-secondary:active {
    background-color: var(--pressed);
}

.button-secondary-base {
    background-color: var(--turquoise-700);
    color: var(--white);
    padding: 0 var(--sp32);
    border-radius: var(--r16);
    height: 52px;
}
.button-secondary-base:hover {
    background-color: var(--turquoise-800);
}
.button-secondary-base:active {
    background-color: var(--pressed);
}

.button-secondary-small {
    background-color: var(--white);
    color: var(--turquoise-700);
    padding: 0 var(--sp32);
    border-radius: var(--r12);
    height: 40px;
}
.button-secondary-small:hover {
    background-color: var(--turquoise-gray-100);
}
.button-secondary-small:active {
    background-color: var(--pressed);
}

.button-card {
    background-color: var(--turquoise-50);
    color: var(--turquoise-700);
    padding: 0 var(--sp24);
    height: 66px;
    width: 100%;
    gap: var(--sp16);
    border-radius: 0 0 var(--r16) var(--r16);
}
.button-card:hover {
    background-color: var(--turquoise-700);
    color: var(--white);
}
.button-card:active {
    background-color: var(--pressed);
}

.button-underlined {
	position: relative;
	display: inline-block;
	text-decoration: none;
}
.button-underlined::before {
	content: '';
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 0%;
	height: 1px;
	background-color: currentColor;
	transition: var(--transition-1)
}
.button-underlined:hover::before {
	width: 100%;
}

.button-phone {
	color: var(--white);
    text-wrap: nowrap;
    transition: var(--transition-1);
}
.button-phone:hover {
	color: var(--turquoise-gray-200);
}
.button-phone-large {
	font-size: var(--text-h4);
}

.button-menu {
	width: 32px;
	height: 32px;
	border-radius: 50rem;
	padding: 0;
}

.button-close {
	width: 32px;
	height: 32px;
	border-radius: 50rem;
	padding: 0;
    background-color: var(--turquoise-gray-50);
    color: var(--turquoise-gray-500);
}
.button-close:hover {
    background-color: var(--turquoise-gray-100);
    color: var(--turquoise-gray-600);
}

.button-play {
	width: 70px;
	height: 70px;
	border-radius: 50rem;
	padding: 0;
    background-color: var(--orange-500);
}
.button-play:hover,
a:has(.button-play):hover .button-play {
    background-color: var(--orange-600);
}


.form-control,
.form-floating > .form-control {
	border-radius: 16px;
	background-color: var(--white);
	border: 1px solid var(--turquoise-gray-100);
	padding: 18px 16px !important;
	gap: 8px;
	height: 60px !important;
	min-height: auto !important;
	font-size: var(--text-body);
	caret-color: var(--orange-500);
}
.form-control:hover,
.form-control:active,
.form-control:focus {
	border: 1px solid var(--orange-500);
}
.form-floating > .form-control:focus,
.form-floating > .form-control:not(:placeholder-shown) {
	padding-top: 31px !important;
}
.form-floating > label {
	color: var(--secondary);
	font-size: var(--text-body);
	transition: 0.1s;
}
.form-floating > label > span {
	color: var(--danger-400);
}
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label {
	font-size: var(--text-small);
	transform: none;
	background-color: transparent;
	padding: 4px 0 0 16px;
}
.form-floating > .form-control:focus ~ label::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label::after {
	display: none;
}


.form-check-input {
	width: 20px;
	height: 20px;
	background-color: var(--white);
	border: 2px solid var(--turquoise-gray-200);
	opacity: 1 !important;
	filter: none !important;
	margin: 4px;
}
.form-check-input[type="checkbox"] {
	border-radius: 4px;
}
.form-check-input[type="radio"] {
	border-radius: 50%;
}
.form-check-input:hover {
	border-color: var(--orange-600);
}
.form-check-input:focus {
	border-color: var(--orange-600);
}
.form-check-input:checked {
	background-color: var(--orange-500);
	border-color: var(--orange-500);
}
/*.form-check-input:checked[type="checkbox"] {
	--bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}*/
.form-check-input:checked[type="radio"] {
	--bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%234CC9BE'/%3e%3c/svg%3e");
	background-color: var(--white);
}
.form-check-input:disabled {
	pointer-events: none;
	background-color: var(--turquoise-gray-100);
	border-color: var(--turquoise-gray-200);
}
.form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label {
	cursor: default;
	color: var(--turquoise-gray-500);
}










.shadow {
	box-shadow: var(--shadow);
}
.shadow-small {
	box-shadow: var(--shadow-small);
}
.shadow-card {
	box-shadow: var(--shadow-card);
}
.shadow-card:hover {
	box-shadow: var(--shadow-card-hover);
}




.glass-card {
	background: linear-gradient(138.03deg, rgba(106, 102, 110, 0.2) 0%, rgba(64, 53, 75, 0.2) 99.94%);
	backdrop-filter: blur(20px);
}
.glass-card::before {
	content: '';
	position: absolute;
	inset: 0;
	padding: 2px;
	border-radius: var(--r16);
	background: linear-gradient(164.59deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.05) 49.52%, rgba(255, 255, 255, 0.5) 100%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	mask-composite: exclude;
}

.badge {
	border: 1px solid var(--turquoise-gray-100);
	border-radius: 50rem;
	padding: 4px 16px;
	color: var(--secondary);
}


.breadcrumbs {
	color: var(--primary);
}
.breadcrumbs a {
	color: var(--secondary);
}
.breadcrumbs a:hover {
	color: var(--turquoise-700);
}
.breadcrumbs a:active {
	color: var(--primary);
}
.breadcrumbs-dark {
	color: var(--white);
}
.breadcrumbs-dark a {
	color: var(--turquoise-gray-200);
}
.breadcrumbs-dark a:hover {
	color: var(--orange-500);
}
.breadcrumbs-dark a:active {
	color: var(--white);
}


.tabs {
	overflow-x: auto;
}
.tab {
    color: var(--secondary);
	padding: var(--sp8) var(--sp16);
	text-wrap: nowrap;
}
.tab:hover,
.tab:active,
.tab.active {
	color: var(--orange-500);
	background-color: var(--orange-50);
	border-radius: 50rem;
}

.container:has(.cookie-bar) {
	position: fixed;
	bottom: var(--sp48);
	left: 0;
	right: 0;
	z-index: 10;
}
.cookie-bar {
	padding: var(--sp24);
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: var(--sp48);
	background-color: var(--white);
	box-shadow: var(--shadow-small);
}


.swiper-pagination-bullet {
  background-color: var(--primary) !important;
  opacity: 0.25 !important;
  transition: var(--transition-1) !important;
}
.swiper-pagination-bullet-active {
  opacity: 1 !important;
  width: 20px !important;
  border-radius: 50rem !important;
}

.carousel-prev,
.carousel-next,
.carousel-prev:focus,
.carousel-next:focus {
	width: 48px !important;
	height: 48px !important;
	margin-top: -24px !important;
	padding: 0;
	border-radius: 50rem;
	background-color: var(--white) !important;
	opacity: 1 !important;
    transition: var(--transition-1);
    box-shadow: var(--shadow-small) !important;
    color: var(--primary) !important;
}

.carousel-prev {
	left: -24px !important;
}
.carousel-next {
	right: -24px !important;
}

.carousel-prev:hover,
.carousel-next:hover {
    box-shadow: var(--shadow) !important;
}
.carousel-prev::after,
.carousel-next::after {
	display: none;
}
.carousel-prev.swiper-button-disabled,
.carousel-next.swiper-button-disabled {
	color: var(--secondary) !important;
}
.carousel-prev.swiper-button-lock, 
.carousel-next.swiper-button-lock {
	display: none !important;
}


/*
.marquee-wrapper {
   display: flex;
   gap: 24px;
   overflow-x: hidden;
}

.marquee-wrapper div {
  white-space: nowrap;
  display: inline-block;
}

.marquee-text-1 {
    animation: marquee1 30s infinite linear;
    animation-delay: -30s;
}

.marquee-text-2 {
    animation: marquee2 30s infinite linear;
    animation-delay: -15s;
}

@keyframes marquee1 {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(-100%);
    }
}

@keyframes marquee2 {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(-200%);
    }
}
*/

body:has(.menu-open) {
	overflow: hidden;
}

body:has(.modal.show)::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	background: linear-gradient(138.03deg, rgba(106, 102, 110, 0.2) 0%, rgba(64, 53, 75, 0.2) 99.94%);
	backdrop-filter: blur(10px);
}

.header .menu-burger,
.header.menu-open .menu-cancel {
	display: flex;
}
.header.menu-open .menu-burger,
.header .menu-cancel {
	display: none;
}

.header .logo {
	width: var(--header-logo-width);
	height: var(--header-logo-height);
}

#footer .logo {
	width: var(--footer-logo-width);
	height: var(--footer-logo-height);
}

.logo_container {
	position: relative;
	overflow: hidden;
	background-color: #00ABA8;
}
.logo_foreground svg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.logo_background svg {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(100%, -50%);
	transition: transform 1.2s linear;
}
.logo_container:hover .logo_background svg {
	transform: translateX(-100%);
}


#solutions_video_link {
	background-image: url('/assets/images/video-bg.svg');
	background-repeat: no-repeat;
	background-position-x: 25%;
	background-position-y: bottom;
	background-color: var(--turquoise-700);
	transition: var(--transition-1);
	background-size: contain;
}

#solutions_video_link:hover {
	background-color: var(--turquoise-800);
}

[data-bs-toggle="collapse"] .button svg {
	transition: var(--transition-1);
}
[data-bs-toggle="collapse"]:not(.collapsed) .button svg {
	transform: rotate(180deg);
}


.intro-3 {
	-webkit-line-clamp: 3;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
}


.stages {
	height: 96px !important;
	background-image: url('/assets/images/stages-bg.svg');
	background-repeat: repeat-x;
	background-size: contain;
}
.slide-stages-wrapper {
	width: 100%;
	height: 100%;
	margin: 0 var(--sp32);
}
.stage {
	clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 50%, calc(100% - 30px) 100%, 0 100%, 30px 50%, 0 0);
	flex-grow: 1;
}
.stage-wrapper {
	padding: 0 30px;
	transition: width 0.5s ease;
}
.slide-stage-wrapper {
	padding: 0 30px;
}
.stage-wrapper .stage-info {
	display: none;
	opacity: 0;
    transition: opacity 1s ease;
}
.stage-wrapper.active .stage-info,
.slide-stage-wrapper .stage-info {
	display: flex;
	opacity: 1;
}
.stage-number {
	color: var(--orange-500);
	background-color: var(--orange-50);
	min-height: 48px;
	min-width: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100px 28px;
}


.square-80 {
	aspect-ratio: 1/1;
	min-width: 80px;
	min-height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
}


.service_cover_bg {
	background-image: url('/assets/images/pattern1.svg'), url('/assets/images/pattern2.svg');
	background-position: left bottom 35%, right top 30%;
	background-repeat: no-repeat;
	background-size: auto 70%, auto 70%;
}

.index_cover_bg,
.contacts_cover_bg {
	background-image: url('/assets/images/pattern1.png'), url('/assets/images/pattern2.png');
	background-position: left bottom, right top 20%;
	background-repeat: no-repeat;
	background-size: auto 55%, auto 55%;
}

.contact_form_bg {
	background-image: url('/assets/images/pattern1.svg'), url('/assets/images/pattern2.svg');
	background-position: bottom left, top right;
	background-repeat: no-repeat;
	background-size: contain, contain;
}


.container,
.container-fluid,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl {
	max-width: none;
	padding-right: var(--sp264);
	padding-left: var(--sp264);
}

.modal-close {
	position: absolute;
	top: var(--sp48);
	right: var(--sp48);
}
.modal-content {
	border: none !important;
	box-shadow: var(--shadow);
}


video {
	filter: brightness(99%);
}


#categories_tabs.is-sticky {
	position: fixed;
	left: 0;
	right: 0;
	z-index: 999;
	padding: var(--sp8) var(--sp264);
	background-color: var(--white);
}


@media (max-width: 1919px) {
	:root {
	    --sp24: 28px;
	    --sp32: 32px;
	    --sp40: 36px;
	    --sp48: 40px;
	    --sp60: 40px;
	    --sp120: 80px;
	    --sp124: 116px;
	    --sp264: 116px;
	    
	    --r48: 40px;
	    --r80: 64px;
	
	    --text-h1: 46px;
	    --text-h2: 40px;
	    --text-h3: 34px;
	    --text-h4: 28px;
	    --text-h5: 22px;
	    --text-body: 16px;
	    --text-small: 12px;
	    --text-button-1: 20px;
	    --text-button-2: 16px;
	    --text-number-large: 76px;
	    --text-number-medium: 40px;

		--bs-modal-width: 376px;
	}
}

@media (max-width: 1439px) {
	:root {
	    --sp32: 24px;
	    --sp40: 28px;
	    --sp48: 32px;
	    --sp60: 32px;
	    --sp120: 64px;
	    --sp124: 108px;
	    --sp264: 80px;
	    
	    --text-h1: 40px;
	    --text-h2: 34px;
	    --text-h3: 28px;
	    --text-h4: 24px;
	    --text-h5: 20px;
	    --text-body: 14px;
	    --text-small: 10px;
	    --text-button-1: 18px;
	    --text-button-2: 14px;
	    --text-number-large: 66px;
	    --text-number-medium: 36px;

		--bs-modal-width: 351px;
	}
}

@media (max-width: 1279px) {
	:root {
	    --sp32: 20px;
	    --sp60: 28px;
	    --sp120: 56px;
	    --sp124: 96px;
	    --sp264: 40px;
	    
	    --r48: 36px;
	    --r80: 48px;
	
	    --text-h1: 34px;
	    --text-h2: 28px;
	    --text-h3: 24px;
	    --text-h4: 20px;
	    --text-h5: 18px;
	    --text-body: 14px;
	    --text-small: 10px;
	    --text-button-1: 18px;
	    --text-button-2: 14px;
	    --text-number-large: 54px;
	    --text-number-medium: 36px;
	    
		--header-logo-width: 152px;
		--header-logo-height: 32px;
		--bs-modal-width: 100%;
	}

	

	.stages {
		background-size: cover;
	}
	
	.index_cover_bg,
	.contacts_cover_bg {
		background-size: 45% auto, 45% auto;
	}
	
	.contact_form_bg {
		background-size: 45% auto, 45% auto;
	}
	
	.service_cover_bg {
		background-position: left bottom 7%, right top 7%;
		background-size: 45% auto, 45% auto;
	}
}

@media (max-width: 767px) {
	:root {
	    --sp16: 12px;
	    --sp24: 16px;
	    --sp32: 16px;
	    --sp40: 24px;
	    --sp48: 16px;
	    --sp60: 24px;
	    --sp120: 48px;
	    --sp124: 80px;
	    --sp264: 16px;
	    
	    --r12: 8px;
	    --r16: 12px;
	    --r28: 20px;
	    --r48: 24px;
	    --r80: 24px;
	
	    --text-h1: 28px;
	    --text-h2: 24px;
	    --text-h3: 20px;
	    --text-h4: 18px;
	    --text-h5: 16px;
	    --text-body: 14px;
	    --text-small: 10px;
	    --text-button-1: 16px;
	    --text-button-2: 14px;
	    --text-number-large: 40px;
	    --text-number-medium: 36px;
	    
	    --footer-logo-width: 238px;
		--footer-logo-height: 50px;
	}
	
	
	#solutions_video_link {
		background-position-x: -185px;
		background-size: auto;
	}
	
	.index_cover_bg,
	.contacts_cover_bg {
		background-position: left bottom, right top 10%;
	}
	
	.service_cover_bg {
		background-position: left bottom 10%, right top 10%;
		background-size: 75% auto, 75% auto;
	}

}