/*992-1200px*/

@media screen and (max-width: 1200px) {
	.header-menu {
		display: none;
	}
	.header-logo {
		width: 250px;
	}
	.hero-inner {
		justify-content: space-between;
		flex-wrap: wrap;
		gap: 20px;
	}
	.hero-video__box video {
		width: 100%;
		height: 600px;
	}
	.hero-video {
		max-width: 405px;
		right: 0;
	}
	.discuss-block__title {
		font-size: 36px;
	}
	.open-menu {
		display: block;
		background: transparent;
		width: 36px;
	}
	.mob-menu {
		display: block;
		position: fixed;
		top: 0;
		transition: all 0.5s ease;
		left: -100%;
		width: 75%;
		background: #fff;
		z-index: 3333;
		height: 100%;
		border-radius: 0 20px 20px 0;
		padding: 20px 30px;
	}
	.mob-menu.active {
		left: 0;
	}
	.mob-menu__list li {
		margin-bottom: 30px;
	}
	.mob-menu__list li a {
		color: #000;
	}
	.mob-menu__btn {
		width: 100%;
		margin-bottom: 10px;
		font-size: 13px;
	}
	.mob-menu__close {
		background: transparent;
		width: 21px;
		padding: 0;
		margin-left: auto;
		display: block;
	}
}

/*768-992px*/

@media screen and (max-width: 992px) {
	.hero-content,
	.hero-video,
	.info-block {
		max-width: 100%;
	}
	.hero {
		padding: 130px 0 30px;
	}
	.hero-buttons,
	.steps-about,
	.steps-body,
	.info-body,
	.customers-item {
		flex-direction: column;
	}
	.hero-buttons a {
		width: 100%;
	}
	.hero-content h1 {
		font-size: 45px;
	}
	.hero-content {
		padding: 0;
	}
	.steps-left {
		border-right: 0;
		border-bottom: 1px solid #000000;
		max-width: 100%;
	}
	.steps-left__arrow {
		margin-top: 0;
		margin-bottom: 15px;
	}
	.section-title {
		font-size: 33px;
	}
	.steps-about__num {
		font-size: 84px;
		margin-bottom: 0;
	}
	.steps-about__info h3 {
		margin-bottom: 14px;
	}
	.section .container {
		justify-content: start;
	}
	.why-body {
		padding: 0;
	}
	.customers-item__content {
		width: 80%;
		text-align: center;
	}
	.customers-item {
		gap: 25px;
	}
	.articles-posts {
		grid-gap: 23px 28px;
	}
	.articles-post {
		padding: 20px 28px;
	}
	.articles-post h3 {
		font-size: 20px;
		line-height: 22px;
	}
	.discuss-block__arrow {
		width: 114px;
		height: 74px;
		bottom: 0;
	}
	.services-section .info-block {
		padding: 50px 0;
		margin-top: 0;
	}
	.info-image__wrapper-description p {
		display: none;
	}
	.services-section .info-image {
		max-width: 700px;
	}
	.info-image__wrapper-description h3 {
		font-size: 14px;
		margin-bottom: 0;
	}
	.info-image__wrapper-link img {
		width: 16px;
		height: 14px;
	}
	.info-image__wrapper-link {
		max-width: 33px;
		height: 33px;
	}
	.info-image__wrapper-inner {
		padding: 5px 20px 3px;
		min-height: 53px;
		gap: 10px;
	}
	.info-image__wrapper-description {
		padding-top: 0;
	}
}

@media screen and (min-width: 994px) {
	.info-image .swiper-wrapper {
		display: flex;
		flex-direction: column;
		gap: 50px;
	}
}

/*576-768px*/

@media screen and (max-width: 768px) {
	.hero-content h1 {
		font-size: 35px;
	}
	.hero-video__box video {
		height: 310px;
	}
	.steps-left__arrow {
		width: 95px;
	}
	.inf-block__link,
	.develop-inner__btn {
		width: 100%;
	}
	.info-block {
		padding: 0;
	}
	.why-body,
	.articles-posts {
		grid-template-columns: 1fr;
	}
	.discuss-block {
		flex-direction: column;
		padding: 16px;
	}
	.discuss-block__left {
		border-right: 0;
		border-bottom: 1px solid #000000;
		max-width: 100%;
	}
	.discuss-block__title {
		font-size: 30px;
	}
	.discuss-block__arrow {
		width: 97px;
		height: 61px;
		bottom: 73px;
		transform: rotate(-160deg);
	}
	.discuss-block__link {
		width: 100%;
	}
	.footer-column {
		/* flex: 1; */
	}
	.discuss-block__right {
		max-width: 100%;
	}
	.services-section .info-image {
		max-width: 500px;
	}
	.info-image {
		width: 100%;
	}
	.why {
		padding-top: 70px;
	}
}

/*320-576px*/

@media screen and (max-width: 576px) {
	.header-logo {
		width: 140px;
	}
	.header-btn {
		font-size: 11px;
		padding: 6px;
	}
	.container {
		padding-left: 15px;
		padding-right: 15px;
	}
	.hero {
		padding: 96px 0 30px;
	}
	.section-subtitle {
		font-size: 23px;
	}
	.text {
		font-size: 16px;
	}
	.why-body__head {
		margin-bottom: 23px;
	}
	.section-title {
		font-size: 28px;
	}
	.section-subtitle {
		font-size: 19px;
	}
	.footer-wrapper {
		flex-direction: column;
		gap: 35px;
	}
	.footer-column h2 {
		font-size: 22px;
		margin-bottom: 18px;
	}
}