@charset "UTF-8";
@media only screen and (min-width: 1024px) {


    .banner-material{
        background: var(--black);
        border-radius: 25px;
        display: grid;
        grid-template-columns: 1fr 600px;
        gap: 35px;
        overflow: hidden;
    }

    .banner-material .bg-img img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: left top;
    }

		.title1 {
				font-size: 46px;
		}
		.title2 {
				font-size: 42px;
		}
		.title3 {
				font-size: 32px;
		}
		.title4 {
				font-size: 24px;
		}
		.title5 {
				font-size: 20px;
		}
		.btn-big {
				height: 58px;
				font-size: 17px;
				line-height: 22px;
		}
		.header {
				margin-top: 23px;
				margin-bottom: 23px;
		}
		.header .menu:before {
				height: 124px;
		}
		.header .logo img {
				height: 64px;
		}
		.footer .menu {
				display: flex;
				flex-wrap: wrap;
				flex: 0 0 auto;
				max-width: 100%;
				align-items: center;
				justify-content: center;
				font-size: 14px;
				line-height: 18px;
		}
		.footer .top {
				padding-top: 50px;
				padding-bottom: 50px;
		}
		.top-index {
				padding-bottom: 80px;
		}
		@media only screen and (max-width: 1279px) {
				.top-index .bg {
						padding-bottom: 368px;
				}
		}
		.top-index .title1 .border {
				font-size: 0.397em;
				padding: 0.259em 0.48148em 0.37037em 0.48148em;
				border-radius: 0.37037em;
				margin: 0;
		}
		.top-index .title1 .sparkles:after {
				transform: scale(1);
		}
		.top-index .bg .text {
				font-size: 19px;
				margin-top: 10px;
		}
		.top-index .image {
				padding: 12px;
				border-radius: 27px;
				margin-top: -294px;
				margin-bottom: 80px;
		}
		.top-index .blocks {
				gap: 30px;
				grid-template-columns: 57.2% auto;
		}
		.top-index .el {
				font-size: 22px;
				padding: 30px;
		}
		.top-index .el.bg3 {
				padding-bottom: 30px;
				padding-right: 30px;
		}
		.about {
				padding-top: 80px;
				padding-bottom: 80px;
		}
		.about .top {
				margin-top: 100px;
				font-size: 20px;
		}
		.about .title2 {
				margin-bottom: 30px;
		}
		.about .video div {
				font-size: 16px;
		}
		.about .video div:before {
				width: 64px;
				height: 64px;
				margin-bottom: 25px;
				background-size: auto 20px;
		}
		.about ul {
				margin-top: 88px;
				gap: 52px 31px;
				font-size: 18px;
		}
		.about li {
				padding: 61px 28px 43px 28px;
		}
		.about .pic {
				left: 28px;
				width: 70px;
				height: 70px;
				margin: -35px 0;
		}
		.about .pic img {
				max-width: 34px;
				max-height: 34px;
		}
		.features {
				padding-top: 100px;
				padding-bottom: 143px;
		}
		.features .title2 {
				margin-bottom: 30px;
		}
		.features .top {
				margin-bottom: 83px;
				font-size: 20px;
		}
		.features ol {
				font-size: 18px;
				gap: 220px;
		}
		.features li {
				gap: 60px;
		}
		.features .image {
				width: 66%;
		}
		.features .title4 {
				margin-bottom: 30px;
		}
		.features li .num {
				font-size: 93px;
		}
		.more-about {
				padding-top: 50px;
				padding-bottom: 60px;
		}
		.more-about a {
				padding-bottom: 6px;
				border-bottom-width: 4px;
				margin-bottom: -10px;
		}
		.more-about .text:after {
				content: '';
				position: absolute;
				bottom: -60px;
				left: 100%;
				background: url("../img/more-about/desktop.svg") no-repeat 50% 100%;
				background-size: contain;
				width: 379px;
				height: 222px;
				margin: 0 -27px;
		}
		.usage {
				padding-top: 100px;
				padding-bottom: 100px;
		}
		.usage .title2 {
				margin-bottom: -45px;
		}
		.usage .title2 span {
				font-size: 0.4218em;
				padding: 0.259em 0.481em 0.37em 0.481em;
				border-radius: 0.37em;
				margin: 0;
		}
		.usage .title4 {
				font-size: 28px;
		}
		.usage .el {
				margin-top: 123px;
		}
		.usage .image {
				width: 57.2%;
		}
		.usage .text {
				margin-top: 30px;
				padding: 29px;
		}
		.usage .title4 {
				margin-bottom: 20px;
		}
		.usage .title4 span {
				font-size: 11px;
				padding: 10px 12px;
				margin-bottom: 15px;
		}
		.usage ul {
				font-size: 13px;
				gap: 6px;
				margin-top: 20px;
		}
		.usage li {
				padding-top: 10px;
				padding-bottom: 10px;
		}
		.usage .el.before .text {
				margin-right: -335px;
				padding-right: 364px;
		}
		.usage .el.after .text {
				margin-left: -335px;
				padding-left: 364px;
		}
		.strategies {
				padding-top: 80px;
				padding-bottom: 80px;
				font-size: 20px;
		}
		.strategies .container {
				gap: 30px;
		}
		.strategies .title2 {
				margin-bottom: 30px;
		}
		.try-now {
				padding-top: 50px;
				padding-bottom: 50px;
				font-size: 19px;
				background-image: url("../img/try-now/l.svg"), url("../img/try-now/r.svg");
				background-repeat: no-repeat;
				background-position: calc(50% - 580px) 50%, calc(50% + 580px) 50%;
				background-size: 328px auto;
		}
		.try-now .title3 {
				margin-bottom: 20px;
		}
		.try-now .btn {
				height: 58px;
				padding: 0 34px;
		}
		.section-title {
				font-size: 19px;
		}
		.section-title .title1 {
				margin-bottom: 30px;
		}
		.section-title .bg {
				padding-top: 30px;
				padding-bottom: 0;
		}
		/*.section-title.title-materials .bg {*/
		/*		background-size: auto 694px;*/
		/*		background-position: calc(100% + 140px) 50%;*/
		/*		padding-bottom: 136px;*/
		/*}*/
		.section-title.title-faq .bg {
				background-size: auto 441px;
				background-position: calc(100% - 30px) calc(50% + 45px);
		}
		.section-title.title-partners .bg {
				background-size: 425px auto;
				background-position: calc(100% + 10px) calc(50% - 7px);
		}
		.breadcrumbs {
				gap: 6px;
				margin-bottom: 40px;
		}
		.breadcrumbs > * {
				font-size: 12px;
				padding: 5px 9px;
		}
		.new-materials {
				margin-top: -84px;
				margin-bottom: 50px;
		}
		.new-materials .title2 {
				font: 500 22px/1.2 var(--font);
				letter-spacing: normal;
				margin: 0 0 10px 0;
		}
		.new-materials .swiper {
				margin: 0 -15px !important;
		}
		.new-materials .swiper-slide {
				padding: 0 15px;
		}
		.article-mini .name {
				font-size: 18px;
		}
		.article-mini .date {
				font-size: 11px;
				padding: 6px 10px;
		}
		.materials-list .title2 {
				display: none;
		}
		.article-card {
				font-size: 16px;
				gap: 10px;
		}
		.article-card .text {
				background: var(--white);
				border-radius: 15px;
				padding: 30px;
		}
		.article-card .name {
				font-size: 24px;
				margin-bottom: 15px;
		}
		.article-card .bottom {
				padding-top: 20px;
				flex-direction: row-reverse;
				justify-content: space-between;
				gap: 6px;
		}
		.article-card .bottom > * {
				font-size: 12px;
				padding: 6px 10px;
		}
		.materials-list {
				margin-top: 50px;
				margin-bottom: 80px;
		}
		.pagination {
				margin-top: 50px;
				gap: 8px;
		}
		.pagination .prev, .pagination .next {
				padding: 0 16px;
				margin: 0 8px;
		}
		.pagination > * {
				font-size: 24px;
				letter-spacing: -0.04em;
				min-width: 52px;
				height: 52px;
				line-height: 48px;
		}
		.faq {
				margin-top: 50px;
				margin-bottom: 80px;
		}
		.faq .section {
				margin-top: 50px;
		}
		.faq .title3 {
				margin-bottom: 30px;
		}
		.faq .qu {
				margin: 15px 0 0 79px;
				font-size: 18px;
		}
		.faq .title5 {
				padding: 20px;
		}
		.faq .plus {
				right: auto;
				left: -79px;
				width: 69px;
				height: 69px;
				border-radius: 15px;
				padding: 10px;
		}
		.faq .plus:after {
				background-size: 20px auto;
		}
		.faq .ind {
				padding: 0 20px 20px 20px;
		}
		.faq .images {
				gap: 20px 0;
				margin: 20px 0;
		}
		.faq .images img {
				border-radius: 8px;
		}
		.faq .images > * {
				border-radius: 8px;
		}
		.partners {
				margin-top: 50px;
				margin-bottom: 80px;
		}
		.partner {
				gap: 10px;
				font-size: 14px;
		}
		.partner .logo {
				width: 140px;
				height: 140px;
		}
		/*edited 05.04.23 start*/
		.partner .head {
				padding: 10px 20px;
				gap: 14px;
				width: calc(38.5% + 150px);
		}
		.partner .logo ~ .head {
				width: 38.5%;
		}
		.partner .name {
				font-size: 24px;
		}
		.partner .info {
				font-size: 13px;
		}
		.partner .info li {
				padding: 10px 14px;
		}
		.partner .text {
				padding: 10px 20px;
		}
		/*edited 05.04.23 end*/
		.article {
				font-size: 18px;
				margin-bottom: 80px;
		}
		.article h1, .article h2, .article h3, .article h4, .article h5, .article h6 {
				font-size: 24px;
				margin-top: 30px;
				line-height: 1;
				margin-bottom: 15px;
				letter-spacing: -0.05em;
		}
		.article h1 {
				font-size: 48px;
				margin-top: 0;
				margin-bottom: 30px;
		}
		.article h2 {
				font-size: 32px;
				margin-bottom: 20px;
		}
		.article p, .article ul, .article ol, .article li {
				margin: 12px 0;
		}
		.article li {
				padding-left: 33px;
		}
		.article li:before {
				left: 5px;
				width: 14px;
				height: 14px;
				margin: -7px 0;
		}
		.article ul > li:after {
				left: 9px;
				width: 10px;
				height: 10px;
				margin: -7px 0;
		}
		.article blockquote {
				margin-top: 57px;
				margin-bottom: 30px;
				padding: 47px 30px 30px 30px;
		}
		.article blockquote:before {
				width: 54px;
				height: 54px;
				top: -27px;
				left: 30px;
		}
		.article .image {
				margin-top: 30px;
				margin-bottom: 30px;
		}
		.article .image .caption {
				font-size: 14px;
				padding: 10px 20px 15px 20px;
		}
		.article .image .caption p {
				margin: 5px 0;
		}
		.article-head {
				padding-top: 60px;
				padding-bottom: 60px;
				margin-bottom: 40px;
		}
		.article-head .breadcrumbs {
				margin-bottom: 20px;
		}
		.article-head .top-image {
				position: absolute;
				top: 0;
				left: 0;
				bottom: 0;
				right: 0;
				margin: 0;
				padding: 0;
				border: 0;
				outline: none;
				border-radius: 25px;
		}
		.article-head .top-image img {
				width: 100%;
				height: 100%;
				border-radius: inherit;
				object-fit: cover;
				object-position: center;
		}
		.article-head .top-image:after {
				content: '';
				position: absolute;
				top: 0;
				left: 0;
				bottom: 0;
				right: 0;
				border-radius: inherit;
				background: linear-gradient(0deg, rgba(224, 245, 74, 0.85), rgba(224, 245, 74, 0.85));
		}
		.article-head .title3 {
				margin: 0 0 15px 0;
		}
		@media only screen and (max-width: 767px) {
				.article-head .title3 {
						font-size: 26px;
				}
		}
		.article-head .max {}
}