/* ============================================================
   CTA3 — Закажите уборку в один клик
   ============================================================ */
.cta3 {
	background: var(--main);
    margin: 170px 0;
	height: 675px;
}

.cta3__inner {
	height: 100%;
	padding: 44px 140px;
	display: flex;
	flex-direction: row;
	gap: 149px;
	align-items: center;
	justify-content: center;
}

/* Левая часть */
.cta3__content {
	display: flex;
	flex-direction: column;
	gap: 54px;
	align-items: center;
	flex-shrink: 0;
}

.cta3__text {
	display: flex;
	flex-direction: column;
	gap: 25px;
	align-items: center;
	text-align: center;
}

.cta3__title {
	color: var(--white);
	font-size: var(--h2-size);
	line-height: var(--h2-line-height);
	font-weight: var(--h2-weight);
	max-width: 518px;
}

.cta3__subtitle {
	color: var(--white);
	font-size: var(--text-size);
	line-height: var(--text-line-height);
	font-weight: 400;
	max-width: 439px;
}

/* Иконки соцсетей */
.cta3__socials {
	display: flex;
	flex-direction: row;
	gap: 10px;
	align-items: center;
}

.cta3__social-link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	transition: transform 0.2s ease, opacity 0.2s ease;
}

.cta3__social-link:hover {
	transform: translateY(-3px);
	opacity: 0.85;
}

.cta3__social-link svg {
	width: 44px;
	height: 44px;
}

/* Правая часть — картинка выходит за пределы */
.cta3__image-wrap {
	flex-shrink: 0;
	width: 615px;
	position: relative;
	

	transform-origin: center bottom;
	/* Сдвигаем вниз чтобы картинка выходила за низ */
	margin-bottom: -120px;
	margin-top: -120px;
}

.cta3__image {
	width: 100%;
	height: auto;
	object-fit: cover;
	display: block;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1280px) {
    .cta3 {

    margin: 150px 0;
    height: 475px;
}
	.cta3__inner { gap: 30px; padding: 44px 60px; }
	.cta3__image-wrap { width: 450px; }
}

@media (max-width: 1024px) {
	.cta3 { height: auto; }
	.cta3__inner {
	
		padding: 60px var(--container-padding);
	
	}
	.cta3__image-wrap {
		width: 300px;
		margin: 0;
		transform: none;
	}
}



@media (max-width: 1024px) {
	.cta3__inner {flex-direction: column;	}

}




@media (max-width: 600px) {
     .cta3 { margin: 120px 0;}
	.cta3__title { font-size: 32px; }
	.cta3__subtitle { font-size: 18px; }
	.cta3__image-wrap { width: 220px; }
}


@media (max-width: 480px) {
     .cta3 { margin:  0;}

}
