/**
 * Partners offer section styles — ported from partners/components/TheOffer.vue
 */

#offer-static {
	scroll-margin: 100px;
}

#what-is {
	scroll-margin: -650px;
}

.offer {
	background:
		url('../img/offer-bg-1.png') top left no-repeat,
		url('../img/offer-bg-2.png') top right no-repeat,
		url('../img/offer-bg-3.png') bottom center/100% auto no-repeat;
	background-color: #12151c;
	border-radius: 80px 80px 0 0;
	padding: 100px 50px 300px;
	position: relative;
	margin-bottom: -100px;
	display: flex;
	flex-direction: column;
	gap: 100px;
}

.offer__container {
	width: 100%;
	display: flex;
	gap: 32px;
}

.offer__wrap {
	flex-basis: 50%;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}

.offer__title {
	font-style: normal;
	color: #f8f8f8;
	font-weight: 700;
	font-size: 52px;
	line-height: 120%;
	margin-bottom: 40px;
}

.offer__available-container {
	flex-direction: column;
	gap: 24px;
}

.offer__available-header {
	display: flex;
	flex-direction: column;
}

.offer__available-title {
	color: #fff;
	font-weight: 700;
	font-size: 40px;
	line-height: 120%;
	letter-spacing: 0;
}

.offer__available-description {
	color: #b8bfcd;
	font-weight: 600;
	font-size: 20px;
	line-height: 140%;
	letter-spacing: 0;
	margin: 16px 0 0;
}

.offer__what-wrap {
	margin-left: 30px;
	flex-basis: 41.5%;
}

.offer__what-title {
	color: #fff;
	font-weight: 700;
	font-size: 52px;
	line-height: 120%;
}

.offer__what-description {
	color: #b8bfcd;
	font-weight: 600;
	font-size: 20px;
	line-height: 140%;
	letter-spacing: 0;
	margin: 16px 0 32px;
}

.offer__what-space {
	width: 100%;
	height: 0;
	margin: 14px 0 0;
}

.offer__what-button {
	width: fit-content;
}

.offer__what-video {
	background: #181b24;
	border-radius: 24px;
	height: auto;
	width: 100%;
}

.offer__license-wrap {
	margin-top: -40px;
}

.offer__license-list {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-bottom: 12px;
}

.offer__license-item {
	background: #0c0e19;
	background-size: cover;
	background-repeat: no-repeat;
	flex-basis: 20%;
	flex-grow: 1;
	padding: 20px 28px;
	border-radius: 20px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.offer__license-item:nth-child(1) {
	background-image: url('../img/info-bg-1.png');
}

.offer__license-item:nth-child(2) {
	background-image: url('../img/info-bg-2.png');
}

.offer__license-item:nth-child(3) {
	background-image: url('../img/info-bg-3.png');
}

.offer__license-item:nth-child(4) {
	background-image: url('../img/info-bg-4.png');
}

.offer__license-item:nth-child(3) .offer__license-title,
.offer__license-item:nth-child(4) .offer__license-title {
	font-size: 36px;
	margin-bottom: -6px;
}

.offer__license-title {
	color: #f9f9f9;
	font-family: "Museo Sans Cyrl", Gilroy;
	font-weight: 700;
	font-style: italic;
	font-size: 32px;
	line-height: 140%;
	letter-spacing: 0;
	text-transform: uppercase;
}

.offer__license-description {
	color: #ffffff85;
	font-family: Gilroy;
	font-weight: 500;
	font-size: 16px;
	line-height: 130%;
	letter-spacing: 2%;
	vertical-align: middle;
}

.offer__special-list {
	display: grid;
	grid-template-columns: 0.47fr 0.22fr 0.1fr 0.22fr;
	grid-template-rows: repeat(2, auto);
	gap: 20px;
}

.offer__special-item {
	background: #0c0e19;
	border-radius: 24px;
	padding: 24px 20px;
	display: flex;
	flex-direction: column;
	gap: 24px;
	position: relative;
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	border: 1px solid #09252d;
}

.offer__special-item:hover {
	transform: translateY(-4px);
	box-shadow: 0 0 24px rgba(0, 0, 0, 0.3);
}

.offer__special-item--big {
	grid-row: span 2;
	background: url('../img/special-bg-1.webp') center/cover no-repeat;
}

.offer__special-item--big .offer__special-description {
	max-width: 470px;
}

.offer__special-item--big .offer__special-games {
	display: flex;
	align-items: center;
	margin-top: 24px;
	justify-content: center;
}

.offer__special-item--big .offer__special-games img {
	width: 458px;
	height: auto;
	margin-bottom: -24px;
}

.offer__special-item:nth-child(2) {
	background: url('../img/special-bg-2.png') center/cover no-repeat;
	grid-column: span 2;
}

.offer__special-item:nth-child(3) {
	background: url('../img/special-bg-3.png') center/cover no-repeat;
}

.offer__special-item:nth-child(4) {
	background: url('../img/special-bg-4.png') center/cover no-repeat;
}

.offer__special-item:nth-child(5) {
	background: url('../img/special-bg-5.png') center/cover no-repeat;
	grid-column: span 2;
}

.offer__special-item-title {
	color: #ffffff;
	font-weight: 700;
	font-size: 20px;
	line-height: 140%;
	letter-spacing: 0;
	text-transform: uppercase;
	font-style: italic;
	text-align: center;
	background: #0090b933;
	border-radius: 24px;
	padding: 8px;
}

.offer__special-description {
	color: #ffffffcc;
	font-weight: 500;
	font-size: 20px;
	line-height: 140%;
	letter-spacing: 0;
	text-align: center;
	margin: 0 auto;
	max-width: 440px;
}

@media (max-width: 1200px) {

	.offer__license-item {
		flex-basis: 40%;
	}
}

@media (max-width: 1024px) {

	.offer__special-list {
		display: flex;
		flex-direction: column;
		gap: 8px;
	}
}

@media (max-width: 767px) {

	#what-is {
		scroll-margin: 200px;
		scroll-margin-top: -800px;
	}

	.offer {
		background: #101218;
		padding: 24px 16px 60px;
		margin-bottom: -24px;
		margin-top: -24px;
		gap: 32px;
		border-radius: 24px 24px 0 0;
	}

	.offer__container {
		flex-direction: column;
	}

	.offer__title {
		font-size: 26px;
		line-height: 120%;
		margin-bottom: 16px;
	}

	.offer__available-container {
		gap: 0;
	}

	.offer__available-title {
		font-size: 20px;
		line-height: 120%;
	}

	.offer__available-description {
		font-size: 14px;
		line-height: 140%;
		margin: 8px 0 14px;
	}

	.offer__what-wrap {
		order: -1;
		margin: 0;
	}

	.offer__what-title {
		font-size: 26px;
		line-height: 120%;
	}

	.offer__what-description {
		font-size: 14px;
		line-height: 140%;
		margin: 8px 0 16px;
	}

	.offer__what-space {
		margin-top: 10px;
	}

	.offer__what-button {
		width: 100%;
	}

	.offer__what-video {
		border-radius: 8px;
		margin-top: -6px;
	}

	.offer__license-wrap {
		margin-top: 0;
	}

	.offer__license-list {
		gap: 4px;
		border-radius: 12px;
		overflow: hidden;
		margin-bottom: 8px;
	}

	.offer__license-item {
		flex-basis: 40%;
		padding: 12px;
		min-height: 110px;
		border: 1px solid #09252d;
		border-radius: 12px;
	}

	.offer__license-item:nth-child(1) {
		background: url('../img/info-bg-1-mobile.png') center/cover no-repeat;
	}

	.offer__license-item:nth-child(2) {
		background: url('../img/info-bg-2-mobile.png') center/cover no-repeat;
	}

	.offer__license-item:nth-child(3) {
		background: url('../img/info-bg-3-mobile.png') center/cover no-repeat;
	}

	.offer__license-item:nth-child(4) {
		background: url('../img/info-bg-4-mobile.png') center/cover no-repeat;
	}

	.offer__license-item:nth-child(3) .offer__license-title,
	.offer__license-item:nth-child(4) .offer__license-title {
		font-size: 18px;
		margin-bottom: 0;
	}

	.offer__license-title {
		font-size: 18px;
		line-height: 140%;
	}

	.offer__license-description {
		font-size: 12px;
	}

	.offer__special-item {
		padding: 16px;
		border-radius: 16px;
		min-height: 120px;
		gap: 6px;
	}

	.offer__special-item--big {
		grid-row: auto;
	}

	.offer__special-item--big .offer__special-games img {
		width: 265px;
	}

	.offer__special-item-title {
		font-weight: 700;
		font-size: 14px;
		line-height: 140%;
		letter-spacing: 0;
		color: #f9f9f9;
	}

	.offer__special-description {
		color: #ffffff99;
		font-weight: 600;
		font-size: 12px;
		line-height: 140%;
		letter-spacing: 0;
		text-align: center;
	}
}
