@media only screen and (max-width: 519px) {}
@media only screen and (min-width: 520px) and (max-width: 959px) {}
@media only screen and (min-width: 960px) and (max-width: 1279px) {}
@media only screen and (min-width: 1280px) and (max-width: 1599px) {}
@media only screen and (min-width: 1600px) {}


:root {

	--white: hsla(0, 0%, 100%, 1);
	--bright-snow: hsla(180, 9%, 98%, 1);
	--white-smoke: hsla(0, 0%, 96%, 1);
	--racing-red: hsla(0, 100%, 45%, 1);
	--alabaster-grey: hsla(0, 0%, 89%, 1);
	--cool-steel: hsla(214, 7%, 62%, 1);
	--dusk-blue: hsla(214, 41%, 31%, 1);
	--gunmetal: hsla(60, 1%, 24%, 1);


	--color--text-main:					#3c3c3c;
	--color--text-sec:					#444;
	
	--color--accent-main: 				#0034a2;
	--color--accent-sec: 				#68b0ff;

	--color--csa-red: 					#ca0100;
	--color--csa-reds: 					#4c4c4c;
	--color--csa-red-sec: 				#cc0000;

	--color--bg-main:					#efefef;
	--color--bg-sub:					#dee7f1;

	--color--border-main:				#d8e4fa;
	--color--border-sec:;

	--border-radius-desktop: 			0px;
	--border-radius-tablet: 			0px;
	--border-radius-mobile: 			0px;

	--color-sidepanel-bg: 				#eee;


	--color--dimmerbg-on:				rgb(77 77 77 / 77%);
	--color--dimmerbg-off:				rgb(0 0 0 / .4);

	--servicepage--color-obj-bg:	 	#f7f7f7;;

}

*, *:before, *:after {
  box-sizing: inherit;
  -webkit-tap-highlight-color: transparent;
/*  user-select: none;*/
}
html {
    box-sizing: border-box;
    scroll-behavior: smooth; 
    overflow-x: hidden;
    text-rendering: optimizeLegibility
    -moz-osx-font-smoothing: grayscale
    -webkit-font-smoothing: antialiased
}
html, body {
	margin: 0px;
	padding: 0px;
}
body {
	position: relative;
	display: block;
	font-family: "Inter", sans-serif;
	color: var(--color--text-main);
}
body * {}

body.no-scroll,
html.no-scroll {
  overflow: hidden;
}



/* ----- PAGE TYPES ------ */
body.pt-s {
	background-color: var(--color--bg-main);
}

a {
	text-decoration: none;
	outline: none;
	cursor: pointer;
}

ul {
	padding-left: 0px;
	padding: 0px;
	margin: 0px;
	list-style: none;
}
h1, h2, h2, h4, h5 {
	padding: 0px;
	margin: 0px;
}

.container, .row {
	position: relative;
	display: block;
	margin: auto;
}
.container {}
.row {}

.img-wrapper > img {
	position: relative;
	display: block;
	width:100%;
	border-radius: var(--border-radius-desktop);
}

/* Animations */

@keyframes shine {
	  from {
        background-position: 150%
    }

    to {
        background-position: -50%
    }
}
@-webkit-keyframes shine {
    from {
        background-position: 150%
    }

    to {
        background-position: -50%
    }
}

.mt10 { margin-top: 10px!important; }
.mt20 { margin-top: 20px!important; }
.mt30 { margin-top: 30px!important; }
.mt40 { margin-top: 40px!important; }
.mt50 { margin-top: 50px!important; }
.mt60 { margin-top: 60px!important; }
.mt70 { margin-top: 70px!important; }
.mt80 { margin-top: 80px!important; }
.mt90 { margin-top: 90px!important; }
.mt100 { margin-top: 100px!important; }
.mb10 { margin-bottom: 10px!important; }
.mb20 { margin-bottom: 20px!important; }
.mb30 { margin-bottom: 30px!important; }
.mb40 { margin-bottom: 40px!important; }
.mb50 { margin-bottom: 50px!important; }
.mb60 { margin-bottom: 60px!important; }
.mb70 { margin-bottom: 70px!important; }
.mb80 { margin-bottom: 80px!important; }
.mb90 { margin-bottom: 90px!important; }
.mb100 { margin-bottom: 100px!important; }

.fw800, .fw800 * { font-weight: 800; }
.fw700, .fw700 * { font-weight: 700; }
.fw600, .fw600 * { font-weight: 600; }

section {
	position: relative;
	display: block;
}
div {
	position: relative;
}

.csa-button {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    height: 60px;
    align-items: center;
    color: #fff!important;
    text-decoration: none!important;
    transition: .2s;
    border-radius: var(--border-radius-desktop);
    background-color: #ca0100;
    background-image: linear-gradient(-45deg, #ca0100 30%, #f00001 50%, #ca0100 70%);
    background-size: 200%;
    transition: transform ease .3s;
    -webkit-animation: shine 3s infinite;
    animation: shine 3s infinite;
    height: 70px;
    border: 0px;
}
.csa-button:hover {
	opacity: .8;
}
.csa-button.p22 {
	padding: 0px 22px;
}

.global-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(255, 255, 255, 0.9	);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9998;
	opacity: 0;
	pointer-events: none; /* клики сквозь оверлей, пока скрыт */
	transition: opacity 0.2s ease;
}

.global-overlay.active {
	opacity: 1;
	pointer-events: auto; /* перехватываем клики, когда виден */
}
.global-overlay > .cbtn {
	position: absolute;
	display: block;
	top: 60px;
	right: 60px;
	width: 24px;
	height: 24px;	
}
.global-overlay > .cbtn:before, .global-overlay > .cbtn:after {
	content: '';
    position: absolute;
    display: block;
    width: 24px;
    height: 4px;
    top: 10px;
    left: 0px;
    transform: rotate(45deg);
    background-color: grey;
    border-radius: 20px;
    transition: .2s;	
} 
.global-overlay > .cbtn:after {
	transform: rotate(-45deg);
}
.global-overlay > .cbtn:hover:before, .global-overlay > .cbtn:hover:after {
	background-color: var(--color--csa-red);
}

@media only screen and (max-width: 519px) {
	.container {
		width: 90%;		
	}
	.hideonmobile {
		display: none!important;
	}
}
@media only screen and (min-width: 520px) and (max-width: 959px) {
	.hideontablet {
		display: none!important;
	}
}
@media only screen and (min-width: 960px) and (max-width: 1279px) {
	.container.content {
		max-width: 980px;
	}	
	.hideondesktop {
		display: none!important;
	}
}
@media only screen and (min-width: 1280px) and (max-width: 1599px) {
	.container {
		max-width: calc(100% - 80px);
	}
	.container.content {
		max-width: 1260px;
	}
	.hideondesktop {
		display: none!important;
	}
}
@media only screen and (min-width: 1600px) {
	.container {
		max-width: 1560px;
	}
	.container.content {
		max-width: 1460px;
	}
	.hideondesktop {
		display: none!important;
	}
}


/* Heading Wrappers */

.heading-wrapper {}
.heading-wrapper.toleft {}
.heading-wrapper.toright {}
.heading-wrapper.tocenter {}

.heading-wrapper > .preheading-wrapper {}
.heading-wrapper > .preheading-wrapper > .element {
	position:relative;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	padding: 8px 12px;
	border: 1px solid var(--color--accent-main);
	border-radius: 50px;
	width: max-content;
}
.heading-wrapper > .preheading-wrapper > .element > div {
	color: var(--color--accent-main);
}
.heading-wrapper > .preheading-wrapper > .element > div:last-child {
	margin-left: 8px;
	padding-left: 8px;
	border-left: 1px solid var(--color--accent-main);
	font-size: 10pt;
}

.heading-wrapper.h1 {}
.heading-wrapper.h1 > h1 {
	margin: 0px;
}

.heading-wrapper.h2 {}
.heading-wrapper.h2 > h2 {
	font-weight: 500;
	font-size: 44pt;
	line-height: 48pt;
}
.heading-wrapper.h2 > h2 > span {
	color: var(--color--accent-main);
}


.heading-wrapper.h3 {}
.heading-wrapper.h3 > h3 {

}


.heading-wrapper.h2.seclink {
	position: relative;
	display: flex;
	flex-flow: row wrap;
	align-items: end;
}
.heading-wrapper.h2.seclink > .heading {
	flex: 0 0 60%;
}
.heading-wrapper.h2.seclink > .heading > h2 {
	font-weight: 300;
	font-size: 40pt;
	line-height: 44pt;
}
.heading-wrapper.h2.seclink > .heading > .bh {
	margin-top: 24px;
  font-size: 14pt;
  font-weight: 300;
  max-width: 60%;
}
.heading-wrapper.h2.seclink > .seclink-wrapper {
	flex: 0 0 40%;
	display: flex;
	justify-content: right;
}
.heading-wrapper.h2.seclink > .seclink-wrapper > a {
	display: flex;
	flex-flow: row wrap;
}
.heading-wrapper.h2.seclink > .seclink-wrapper > a > span {
	margin-right: 20px;
}
.heading-wrapper.h2.seclink > .seclink-wrapper > a > div {
	display:flex;
	flex-flow: row wrap;
	align-items: center;
}
.heading-wrapper.h2.seclink > .seclink-wrapper > a > div > span:nth-child(1) {
	flex: 0 0 60px;
	position: relative;
	display: block;
	height: 2px;
	width: 60px;
	background-color: var(--color--text-main);
}
.heading-wrapper.h2.seclink > .seclink-wrapper > a > div > span:nth-child(2) {
	flex: 0 0 auto;
	position:relative;
	display:block;
	width: 10px;
	height: 10px;
	border-top:2px solid var(--color--text-main);
	border-right:2px solid var(--color--text-main);
	transform: rotate(45deg);
	margin-left: -10px;
}

.heading-wrapper.h2.bl {
	border-left: 10px solid #dfdfdf;
	padding-left: 40px;
}


.heading-wrapper.h2.hp {
	width: 40%;
}
.heading-wrapper.h2.hp > h2 {
	font-size: 34pt;
    line-height: 36pt;
}
.heading-wrapper.h2.hp > .item--csa-graph-el {
	margin-bottom: 40px;
}
.heading-wrapper.h2.hp > .subh {
	margin-top: 20px;
    font-size: 14pt;
    line-height: 20pt;
}

.framed-wrapper {
    padding: 1em 2em;
    border: 2px solid var(--color--csa-red);
    border-radius: 6px;	
}

@media only screen and (max-width: 519px) {}
@media only screen and (min-width: 520px) and (max-width: 959px) {}
@media only screen and (min-width: 960px) and (max-width: 1279px) {
	.heading-wrapper.h2 {
		max-width: 80%;
	}	
}
@media only screen and (min-width: 1280px) and (max-width: 1599px) {
	.heading-wrapper.h2 {
		max-width: 80%;
	}	
}
@media only screen and (min-width: 1600px) {
	.heading-wrapper.h2 {
		max-width: 80%;
	}
}


.x2obj {
	position: relative;
	display: flex;
	flex-flow: row wrap;
	align-item: top;
}
.x2obj > .object {
	position: relative;
    display: block;
    background: #fcfcfc!important;
    flex: 0 0 calc(50% - .5em);
    overflow: hidden;
}
.x2obj > .object:before {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    background: url(/app/static/pattern-001.webp);
    mix-blend-mode: hard-light;
    opacity: .1;
}
.x2obj > .object:nth-child(2) {
	margin-left: 1em;
}
@media only screen and (max-width: 519px) {

	.x2obj > .object {
		flex: 0 0 100%;
	}
	.x2obj > .object:nth-child(2) {
		margin-left: 0em;
		margin-top: 2em;
	}

}


.sec--serviceheader {
	background: #eaeaea;
    padding: 70px 0px;	
}
@media only screen and (max-width: 519px) {
	.sec--serviceheader {
		padding: 126px 0px 70px;
	}
}