@import '_mixins';
@import '_reset';

$fOutfit: 'Outfit', sans-serif;

$cWhite: #fff;
$cDarkGray: #536783;
$cBlack: #141414;
$cViolet: #583867;
$cGray: #616161;

$headerHeight: 98px;

//* Global
* {
	font-family: $fOutfit;
}

p {
	&:last-child {
		margin-bottom: 0;
	}
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: 30px;
}

body {
	background: #f1ecf7;

	&.no-scroll {
		overflow: hidden;
	}
}

.container {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding-left: 15px;
	padding-right: 15px;

	@each $breakpoint, $max in $container-max-widths {
		@if map-has-key($breakpoints, $breakpoint) {
			$bp-value: map-get($breakpoints, $breakpoint);

			@media (min-width: $bp-value) {
				max-width: $max;
			}
		}
	}
}

.container-mini {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding-left: 15px;
	padding-right: 15px;
	max-width: 1000px;
}

.btn-1 {
	color: $cWhite !important;
	font-weight: 600;
	font-size: 16px;
	line-height: 1;
	text-decoration: none;
	display: inline-block;
	padding: 14px 25px;
	border: 1px solid rgb(213, 201, 223, 0.4);
	border-radius: 8px;
}

.btn-2 {
	color: $cDarkGray !important;
	font-weight: 600;
	font-size: 16px;
	line-height: 1;
	text-decoration: none;
	display: inline-flex;
	flex-direction: row;
	align-items: center;
	padding: 14px 25px;
	border: 1px solid rgb($cDarkGray, 0.4);
	border-radius: 8px;
	transition: all 250ms ease-in-out;

	&:hover {
		color: $cWhite !important;
		background: $cDarkGray;
		border-color: $cDarkGray;

		img {
			filter: brightness(0) invert(1);
		}
	}

	img {
		transition: all 250ms ease-in-out;
	}
}

.btn-3 {
	color: $cWhite !important;
	font-weight: 600;
	font-size: 16px;
	line-height: 1;
	text-decoration: none;
	display: inline-block;
	padding: 14px 25px;
	border: 1px solid $cDarkGray;
	border-radius: 8px;
	background: $cDarkGray;
}

.btn-4 {
	color: $cWhite !important;
	font-weight: 600;
	font-size: 16px;
	line-height: 1;
	text-decoration: none;
	display: inline-block;
	padding: 14px 25px;
	border: 1px solid #4b6255;
	border-radius: 8px;
	background: #4b6255;
	transition: all 250ms ease-in-out;

	// &:hover {
	// 	background: rgb(29, 132, 74);
	// }
}

@mixin box-title($color) {
	color: $color;
	font-weight: 500;
	font-size: 40px;
	line-height: 1.35;

	@include respond-below(xl) {
		font-size: 36px;
	}

	@include respond-below(lg) {
		font-size: 32px;
	}
}

@mixin box-text($color) {
	color: $color;
	font-weight: 500;
	font-size: 18px;
	line-height: 1.67;

	@include respond-below(lg) {
		font-size: 16px;
	}
}

@mixin box-text-16($color) {
	color: $color;
	font-weight: 500;
	font-size: 16px;
	line-height: 1.85;
}

header#masthead {
	position: relative;
	background: $cWhite;
	border-bottom: 1px solid #d5c9df;

	.row {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		height: $headerHeight;

		@include respond-below(lg) {
			gap: 10px;
		}

		@include respond-below(sm) {
			height: 144px;
			flex-wrap: wrap;
			padding: 20px 0;
			row-gap: 20px;
		}

		.site-branding {
			@include respond-below(lg) {
				flex-grow: 1;
			}

			@include respond-below(sm) {
				// width: 100%;
				order: 1;
			}

			img {
				width: 267px;
				max-width: unset;

				@include respond-below(xl) {
					max-width: 200px;
				}
			}
		}

		nav#site-navigation {
			width: auto;
			flex: 1;

			@include respond-below(lg) {
				&.toggled {
					.menu-menu-container {
						// transform: translateX(0);
					}
				}
			}

			@include respond-below(sm) {
				order: 4;
			}

			ul#primary-menu {
				column-gap: 40px;
				justify-content: center;

				li.menu-item {
					&.current_page_item {
						> a {
							color: $cViolet;
						}
					}

					a {
						color: $cBlack;
						font-weight: 500;
						font-size: 16px;
						line-height: 1;

						@include respond-below(lg) {
							font-size: 20px;
						}
					}
				}

				@include respond-below(lg) {
					display: flex;
					flex-direction: column;
					height: 100%;
					align-items: center;
					justify-content: center;
					row-gap: 20px;
					padding: 25px 0;
				}
			}

			.menu-menu-container {
				@include respond-below(lg) {
					position: absolute;
					top: calc(100% - 1px);
					width: 100%;
					left: 0;
					right: 0;
					background: $cWhite;
					transition: all 250ms ease-in-out;
					z-index: 10000;
					overflow: hidden;

					display: none;

					// position: fixed;
					// top: 0;
					// right: 0;
					// bottom: 0;
					// height: 100svh;
					// z-index: 100;

					// background: $cWhite;
					// border-left: 1px solid $cDarkGray;
					// width: 100%;
					// max-width: 300px;
					// transform: translateX(100%);
					// transition: all 250ms ease-in-out;
					// z-index: 10000;
				}
			}
		}

		.main-navigation-secondary {
			display: flex;
			flex-direction: row;
			align-items: center;
			gap: 10px;
			padding: 0;
			margin: 0;

			@include respond-below(sm) {
				order: 3;
			}

			> li {
				&:not(.btn-external) {
					display: flex;
					flex-direction: row;
					align-items: center;
					padding: 6px 6px 6px 16px;
					border: 1px solid $cDarkGray;
					border-radius: 100px;
					gap: 16px;

					@include respond-below(xl) {
						gap: 10px;
					}

					.social-icon {
						img {
							width: 16px;
							min-width: 16px;
							height: 16px;

							@include respond-below(xl) {
								width: 12px;
								min-width: 12px;
								height: 12px;
							}
						}
					}

					ol.other-icons {
						padding: 0;
						margin: 0;
						display: flex;
						flex-direction: row;
						align-items: center;

						li {
							width: 36px;
							min-width: 36px;
							height: 36px;

							a {
								display: block;
								width: 100%;
								height: 100%;

								&:hover {
									img {
										transform: scale(1.2);
										transition: all 250ms ease-in-out;
									}
								}
							}

							&:not(:first-child) {
								margin-left: -10px;

								@include respond-below(sm) {
									margin-left: 5px;
								}
							}

							@include respond-below(xl) {
								width: 30px;
								min-width: 30px;
								height: 30px;
							}

							img {
								width: 100%;
								border: 1px solid $cWhite;
								border-radius: 100%;
							}
						}
					}
				}
			}
		}

		.btn-external {
			margin-left: 10px;

			@include respond-below(sm) {
				order: 2;
				margin-left: 0;
			}
		}
		#nav-menu-toggle {
			position: relative;

			display: block;
			height: 44px;
			width: 44px;
			padding: 6px;
			margin: 0;
			border: 1px solid $cDarkGray;
			border-radius: 100px;
			z-index: 9999;
			cursor: pointer;
			overflow: hidden;

			@include respond-above(lg) {
				display: none !important;
			}

			&::before {
				content: '';
				position: absolute;
				top: 13px;
				left: 10px;
				width: calc(100% - 20px);
				height: 2px;
				background: $cDarkGray;
				transition: all 250ms ease-in-out;
			}

			&::after {
				content: '';
				position: absolute;
				bottom: 13px;
				left: 10px;
				width: calc(100% - 20px);
				height: 2px;
				background: $cDarkGray;
				transition: all 250ms ease-in-out;
			}

			&[aria-expanded='true'] {
				&::before {
					top: 50%;
					left: 50%;
					transform: translate(-50%, -50%) rotate(45deg);
				}

				&::after {
					bottom: calc(50% - 2px);
					left: 50%;
					transform: translate(-50%, -50%) rotate(-45deg);
				}

				.line {
					opacity: 0;
					transform: translateY(-50%) translateX(calc(100% + 10px));
				}
			}

			.line {
				position: absolute;
				top: 50%;
				left: 10px;
				width: calc(100% - 20px);
				height: 2px;
				transform: translateY(-50%);
				background: $cDarkGray;
				transition: all 250ms ease-in-out;
			}
		}
	}
}

footer#colophon {
	background: $cViolet;

	.site-footer--wrapper {
		.row {
			&-1 {
				padding-top: 60px;
				padding-bottom: 60px;
				border-bottom: 1px solid rgba($cWhite, 0.1);

				display: flex;
				flex-direction: row;
				gap: 20px;

				@include respond-below(lg) {
					flex-wrap: wrap;
					row-gap: 60px;
				}

				@include respond-below(sm) {
					row-gap: 40px;
				}

				.col {
					flex-basis: 25%;

					@include respond-below(lg) {
						flex-basis: calc(100% / 2 - 10px);
					}

					@include respond-below(sm) {
						flex-basis: 100%;
						text-align: center;
					}

					&-1 {
					}

					&-2 {
					}

					&-3 {
					}

					&-4 {
					}

					.col-title {
						margin-bottom: 20px;

						h3 {
							color: $cWhite;
							font-weight: 700;
							font-size: 12px;
							line-height: 1;
							letter-spacing: 3px;
							opacity: 0.6;
						}
					}

					ul {
						padding: 0;
						margin: 0;

						li {
							&:not(:last-child) {
								margin-bottom: 10px;
							}

							a {
								color: $cWhite;
								font-weight: 500;
								font-size: 18px;
								line-height: 1;

								@include respond-below(sm) {
									font-size: 16px;
								}
							}
						}
					}

					.col-text {
						p {
							color: $cWhite;
							font-weight: 500;
							font-size: 18px;
							line-height: 1.5;
						}

						a {
							color: $cWhite;
							font-weight: 500;
							font-size: 18px;
							line-height: 1.5;
							text-decoration: underline;
						}
					}
				}
			}

			&-2 {
				padding-top: 30px;
				padding-bottom: 30px;

				display: flex;
				flex-direction: row;
				justify-content: space-between;
				align-items: center;

				@include respond-below(sm) {
					flex-direction: column;
					row-gap: 20px;
				}

				.col {
					&-1 {
						ul {
							padding: 0;
							margin: 0;
							display: flex;
							flex-direction: row;
							column-gap: 40px;

							@include respond-below(sm) {
								flex-direction: column;
								row-gap: 20px;
								text-align: center;
							}

							li {
								p {
									color: $cWhite;
									font-weight: 500;
									font-size: 16px;
									line-height: 1;

									em {
										font-style: normal;
										opacity: 0.6;
									}
								}

								a {
									color: $cWhite;
									font-weight: 500;
									font-size: 16px;
									line-height: 1;
								}
							}
						}
					}

					&-2 {
						ul {
							padding: 0;
							margin: 0;
							display: flex;
							flex-direction: row;
							column-gap: 40px;

							li {
								p {
									color: $cWhite;
									font-weight: 500;
									font-size: 16px;
									line-height: 1;

									em {
										font-style: normal;
										opacity: 0.6;
									}
								}

								a {
									color: $cWhite;
									font-weight: 500;
									font-size: 16px;
									line-height: 1;
									text-decoration: underline;
								}
							}
						}
					}
				}
			}
		}
	}
}

article.article-card {
	position: relative;
	width: 100%;
	display: flex;
	flex-direction: column;

	.card-tags {
		position: absolute;
		top: 30px;
		left: 30px;
		z-index: 1;
		padding: 0;
		margin: 0;
		display: inline-flex;
		flex-direction: column;
		row-gap: 10px;

		li {
			background: $cViolet;
			border-radius: 8px;

			span {
				display: inline-block;
				color: $cWhite;
				font-weight: 500;
				font-size: 16px;
				line-height: 20px;
				padding: 8px 15px;
			}
		}
	}

	.card-img {
		position: relative;

		img {
			width: 100%;
			height: 230px;
			object-fit: cover;
			border-radius: 16px;
		}
	}

	.card-data {
		display: flex;
		flex-direction: column;
		height: 100%;
		margin-top: -20px;
		padding: 50px 30px 30px 30px;
		border-bottom-left-radius: 16px;
		border-bottom-right-radius: 16px;
		background: $cWhite;

		.card-title {
			flex: 1;
			margin-bottom: 25px;
			padding-bottom: 25px;
			border-bottom: 1px solid #f1ecf7;

			h3 {
				color: $cBlack;
				font-weight: 500;
				font-size: 24px;
				line-height: 1.42;

				a {
					color: inherit;
				}

				@include respond-below(xl) {
					font-size: 20px;
					line-height: 1.25;
				}
			}
		}

		.card-footer {
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;

			.card-author {
				display: flex;
				flex-direction: row;
				align-items: center;
				column-gap: 15px;

				.card-author--img {
					padding: 0;
					margin: 0;

					display: flex;
					flex-direction: row;
					align-items: center;

					li {
						&:not(:first-child) {
							margin-left: -16px;
						}
					}

					img {
						width: 48px;
						min-width: 48px;
						height: 48px;
						border-radius: 100%;
					}
				}

				.card-author--data {
					.card-author--title {
						color: $cGray;
						font-weight: 500;
						font-size: 14px;
						line-height: 1;
						margin-bottom: 0;
					}

					.card-author--name {
						color: #523461;
						font-weight: 500;
						font-size: 16px;
						line-height: 1.25;
					}
				}
			}
		}
	}
}

article.article-more {
	position: relative;
	width: 100%;
	height: 100%;
	// max-width: 427px;
	min-height: 300px;
	display: flex;
	flex-direction: column;
	padding: 30px;
	border-radius: 16px;

	&::before {
		content: '';
		position: absolute;
		inset: 0;
		background: linear-gradient(
			200.87deg,
			rgba(88, 56, 103, 0.3) 0%,
			#4a2b59 86.2%
		);
		border-radius: 16px;
		z-index: 1;
	}

	.article-more--bg {
		position: absolute;
		inset: 0;

		img {
			height: 100%;
			object-fit: cover;
			object-position: center;
			border-radius: 16px;
		}
	}

	.article-more--wrapper {
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		row-gap: 40px;
		height: 100%;
		z-index: 2;

		.article-more--title {
			h3 {
				color: $cWhite;
				font-weight: 500;
				font-size: 24px;
				line-height: 1.42;
			}
		}

		.article-more--nav {
			a {
				width: 100%;
				text-align: center;
			}
		}
	}
}

article.podcast-card {
	position: relative;
	width: 100%;
	display: flex;
	flex-direction: column;
	padding: 32px;
	border-radius: 16px;
	overflow: hidden;

	.card-img {
		position: absolute;
		inset: 0;

		&::before {
			content: '';
			position: absolute;
			inset: 0;
			background: rgba(#313740, 0.64);
		}

		&::after {
			content: '';
			position: absolute;
			left: 0;
			right: 0;
			bottom: 0;
			height: 170px;
			background: linear-gradient(
				180deg,
				rgba(0, 0, 0, 0) 0%,
				rgba($cViolet, 0.89) 100%
			);
		}

		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
	}

	.card-head {
		position: relative;
		height: 116px;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		margin-bottom: 20px;
		z-index: 1;

		.card-head--img {
			img {
				width: 40px;
				min-width: 40px;
				height: 40px;
				object-fit: contain;
			}
		}

		.card-head--attr {
			padding: 0;
			margin: 0;
			display: flex;
			flex-direction: row;

			li {
				&:not(:last-child) {
					padding-right: 16px;
					margin-right: 16px;
					border-right: 1px solid #f1ecf7;
				}

				span {
					color: #d5c9df;
					font-family: $fOutfit;
					font-weight: 600;
					font-size: 16px;
					line-height: 1.25;
				}
			}
		}
	}

	.card-body {
		position: relative;
		z-index: 1;
		flex: 1;

		h2 {
			color: $cWhite;
			font-family: $fOutfit;
			font-weight: 500;
			font-size: 24px;
			line-height: 1.4;

			a {
				color: inherit;
			}

			@include respond-below(xl) {
				font-size: 20px;
				line-height: 1.25;
			}
		}
	}

	.card-footer {
		position: relative;
		margin-top: 24px;
		padding-top: 24px;
		border-top: 1px solid #f1ecf7;
		z-index: 1;

		display: flex;
		flex-direction: row;
		column-gap: 40px;

		.card-footer--nav {
			a {
				display: inline-flex;
				flex-direction: row;
				align-items: center;
				gap: 8px;
			}
		}

		.audio-player {
			flex-grow: 1;
			background-image: url('/wp-content/uploads/2025/10/OBJECTS.svg');
			background-position: center left;
			background-repeat: repeat-x;
		}
	}
}

#box-page-name {
	position: relative;
	padding-left: 20px;

	color: $cGray;
	font-weight: 500;
	font-size: 16px;
	line-height: 1.25;

	&::before {
		content: '';
		position: absolute;
		top: 50%;
		left: 0;
		width: 10px;
		min-width: 10px;
		height: 10px;
		background-image: url('/wp-content/uploads/2025/10/Vector.svg');
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
		transform: translateY(-50%);
	}
}

.c-tabs {
	.c-tabs--nav {
		display: flex;
		flex-direction: row;
		gap: 16px;
		padding: 0 0 40px 0;
		margin: 0;

		li {
			padding: 14px 20px;
			border-width: 1px;
			border-style: solid;
			border-radius: 8px;
			transition: all 250ms ease-in-out;
			cursor: pointer;

			display: flex;
			flex-direction: row;
			align-items: center;

			&.active {
				svg {
					width: 10px;
					min-width: 10px;
					margin-right: 12px;
				}
			}

			svg {
				width: 0;
				min-width: 0px;
				height: 10px;
				transition: all 250ms ease-in-out;
			}
		}
	}

	.c-tabs--content {
		.c-tab--item {
			&[tab_id='1'] {
				.text-box-info {
					margin-bottom: 1.5em;

					p {
						font-family: $fOutfit;
						font-weight: 500;
						font-size: 16px;
						line-height: 1.875;
					}
				}

				.text-box {
					p {
						font-family: $fOutfit;
						font-weight: 500;
						font-size: 16px;
						line-height: 1.875;
					}
				}
			}

			&[tab_id='2'] {
				ul {
					padding: 0;
					margin: 0;
					display: flex;
					flex-direction: column;
					row-gap: 16px;

					li {
						position: relative;
						padding-left: 37px;

						&::before {
							content: '';
							position: absolute;
							top: 12px;
							left: 0;
							width: 7px;
							height: 7px;
							border-radius: 100%;
							transform: translateY(-50%);
						}

						p {
							margin: 0;

							&.item-title {
								font-size: 16px;
								font-weight: 500;
								line-height: 1.5;
							}

							&.item-text {
								font-size: 16px;
								font-weight: 500;
								line-height: 1.875;
							}
						}
					}
				}
			}

			&[tab_id='3'] {
				ul {
					margin: 0;
					padding-left: 1.2em;
					list-style-position: outside;
					display: block;
					column-count: 2;
					column-gap: 50px;

					li {
						position: relative;
						flex-basis: calc(100% / 2 - 25px);
						padding-left: 18px;
						margin-bottom: 5px;
						break-inside: avoid;

						&::before {
							content: '';
							position: absolute;
							top: 12px;
							left: 0;
							width: 7px;
							height: 7px;
							border-radius: 100%;
							transform: translateY(-50%);
						}

						@include respond-below(md) {
							flex-basis: 100%;
						}

						p {
							margin: 0;

							&.item-title {
								font-size: 16px;
								font-weight: 500;
								line-height: 1.5;
							}

							&.item-text {
								font-size: 16px;
								font-weight: 500;
								line-height: 1.875;
							}
						}

						ul {
							display: flex;
							flex-direction: column;
							row-gap: 8px;
							padding: 16px 0 0 0;
							margin: 0;

							li {
								p {
									font-size: 16px;
									font-weight: 500;
									line-height: 1.5;
									margin: 0;
								}
							}
						}
					}
				}
			}

			&[tab_id='4'] {
				ul {
					padding: 0;
					margin: 0;
					display: flex;
					flex-direction: row;
					flex-wrap: wrap;
					row-gap: 16px;
					column-gap: 24px;

					li {
						position: relative;
						flex-basis: calc(100% / 2 - 12px);
						padding-left: 37px;

						&::before {
							content: '';
							position: absolute;
							top: 12px;
							left: 0;
							width: 7px;
							height: 7px;
							border-radius: 100%;
							transform: translateY(-50%);
						}

						@include respond-below(md) {
							flex-basis: 100%;
						}

						p {
							margin: 0;

							&.item-title {
								font-size: 16px;
								font-weight: 500;
								line-height: 1.5;
							}
						}

						ol {
							display: flex;
							flex-direction: column;
							row-gap: 8px;
							padding: 0;
							margin: 0;

							li {
								padding: 0;

								&::before {
									display: none !important;
								}

								a {
									display: flex;
									flex-direction: row;
									column-gap: 12px;

									svg {
										width: 12px;
										min-width: 12px;
										height: 24px;
										padding: 6px 0;
									}

									span {
										font-size: 16px;
										font-weight: 500;
										line-height: 1.5;
										margin: 0;
									}
								}
							}
						}
					}
				}
			}

			&[tab_id='5'] {
				ol.contact-list {
					margin: 0;
					padding: 0;
					display: flex;
					flex-direction: row;
					column-gap: 24px;

					li.contact-item {
						position: relative;
						display: flex;
						flex-direction: row;
						column-gap: 30px;
						padding: 32px;
						background: $cWhite;
						border-radius: 16px;

						flex-wrap: wrap;
						row-gap: 20px;

						.item-bg {
							position: absolute;
							top: 0;
							left: 9%;
							bottom: 0;

							img {
								height: 100%;
							}
						}

						.contact-item-img {
							position: relative;

							> img {
								position: absolute;
								top: 0;
								right: -14px;
							}

							.img {
								width: 65px;
								min-width: 65px;
								height: 65px;
								border-radius: 100%;
								border: 3px solid #d5c9df;
								overflow: hidden;

								img {
									width: 100%;
									height: 100%;
									object-fit: cover;
								}
							}
						}

						.contact-item-content {
							position: relative;

							.contact-name {
								margin-bottom: 14px;

								p {
									color: $cViolet;
									font-weight: 500;
									font-size: 24px;
									line-height: 1.25;
								}
							}

							ul {
								padding: 0;
								margin: 0;
								display: flex;
								flex-direction: column;
								row-gap: 12px;

								li {
									display: flex;
									flex-direction: row;
									align-items: center;
									column-gap: 12px;

									a {
										color: #616161;
										font-weight: 500;
										font-size: 18px;
										line-height: 1.25;
									}
								}
							}
						}
					}
				}
			}
		}
	}
}

//* Pages
//* Home
body.page-id-7 {
	main#primary {
		.box-1 {
			position: relative;

			.box-bg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 25%;
				transform: translateX(-50%);

				img {
					height: 100%;
					object-fit: contain;
				}
			}

			.row {
				position: relative;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: space-between;
				gap: 50px;

				padding-top: 110px;
				padding-bottom: 110px;

				@include respond-below(xl) {
					gap: 30px;
				}

				@include respond-below(lg) {
					flex-direction: column;
					row-gap: 50px;
					padding-top: 60px;
				}

				@include respond-below(sm) {
					padding-top: 50px;
					padding-bottom: 50px;
				}

				.col-1 {
					.box-mini-title {
						display: inline-block;
						padding: 9px 22px;
						border-radius: 100px;
						background: $cViolet;
						margin-bottom: 20px;

						p {
							color: $cWhite;
							font-weight: 600;
							font-size: 16px;
							line-height: 1.25;
						}

						@include respond-below(lg) {
							margin-bottom: 30px;

							p {
								font-size: 15px;
							}

							span {
								display: inline-block;
								transform: rotate(90deg);
							}
						}
					}

					.box-title {
						margin-bottom: 25px;
						max-width: 500px;

						h2 {
							@include box-title($cBlack);
						}
					}

					.box-text {
						max-width: 500px;

						p {
							@include box-text($cGray);
						}
					}
				}

				.col-2 {
					.advanced-posts-box {
						position: relative;
						width: 764px;
						height: 465px;

						@include respond-below(xxl) {
							width: 600px;
							height: 370px;
						}

						@include respond-below(xl) {
							width: 550px;
							height: 335px;
						}

						@include respond-below(sm) {
							width: 300px;
						}

						.advanced-posts-bg {
							position: absolute;
							inset: 0;
							align-content: end;

							@include respond-below(sm) {
								display: none;
							}
						}

						.advanced-posts-list {
							position: relative;
							display: flex;
							flex-direction: row;
							height: 100%;

							width: 100%;

							ol {
								position: absolute;
								inset: 0;
								padding: 0;
								margin: 0;

								li {
									position: absolute;
									width: var(--size);
									min-width: var(--size);
									max-width: var(--size);
									height: var(--size);
									background: var(--bg);
									transition: all 250ms ease-in-out;

									@include respond-below(xxl) {
										width: calc(var(--size) * 0.8);
										min-width: calc(var(--size) * 0.8);
										max-width: calc(var(--size) * 0.8);
										height: calc(var(--size) * 0.8);
									}

									&::before {
										content: '';
										position: absolute;
										top: 50%;
										left: 50%;
										transform: translate(-50%, -50%) scale(1);
										/* ważne! */
										opacity: 1;
										/* ważne! */
										width: calc(var(--size) / 1.3);
										height: calc(var(--size) / 1.3);
										border-radius: 100%;
										background: var(--bg);
										z-index: -1;
										will-change: transform, opacity;
									}

									&:hover {
										&::before {
											animation: puls 1s ease-in-out infinite;
											animation-delay: -0.2s; // start jakby 0,7s animacji już minęło
										}
									}

									&.lvl-1 {
										border-radius: 100%;

										a {
											display: flex;
											align-items: center;
											justify-content: center;
											width: 100%;
											height: 100%;

											span {
												color: $cWhite;
												font-weight: 400;
												font-size: 16px;
												line-height: 1.2;
												text-align: center;
												letter-spacing: 0.005em;

												@include respond-below(xxl) {
													font-size: 14px;
												}
											}
										}
									}

									&.lvl-2 {
										border-radius: 100%;

										a {
											display: flex;
											align-items: center;
											justify-content: center;
											width: 100%;
											height: 100%;

											span {
												color: $cWhite;
												font-weight: 500;
												font-size: 13px;
												line-height: 1.2;
												text-align: center;
												letter-spacing: 0.005em;

												@include respond-below(xxl) {
													font-size: 11px;
												}
											}
										}
									}

									&.lvl-3 {
										border-radius: 100%;

										a {
											display: flex;
											align-items: center;
											justify-content: center;
											width: 100%;
											height: 100%;

											span {
												color: #583967;
												font-weight: 500;
												font-size: 13px;
												line-height: 1.2;
												text-align: center;
												letter-spacing: 0.01em;
												text-shadow: -0.6px 0 $cWhite, 0 0.6px $cWhite,
													0.6px 0 $cWhite, 0 -0.6px $cWhite;
												min-width: 80px;
											}
										}
									}

									&:nth-child(1) {
										top: 0%;
										left: 9%;
										transform: translateX(-50%);

										animation: init_1 1s ease-in-out;
									}

									&:nth-child(2) {
										top: 0%;
										left: 91%;
										transform: translateX(-50%);

										animation: init_2 1s ease-in-out;
									}

									&:nth-child(3) {
										top: 83%;
										left: 50%;
										transform: translate(-50%, -50%);

										animation: init_3 1s ease-in-out;
									}

									&:nth-child(4) {
										top: 6.5%;
										left: 50%;
										transform: translateX(-50%);

										animation: init_4 2s ease-in-out;
									}

									&:nth-child(5) {
										top: 45%;
										left: 34%;
										transform: translateX(-50%);

										animation: init_5 2s ease-in-out;

										@include respond-below(sm) {
											left: 25%;
										}
									}

									&:nth-child(6) {
										top: 45%;
										left: 66%;
										transform: translateX(-50%);

										animation: init_6 2s ease-in-out;

										@include respond-below(sm) {
											left: 75%;
										}
									}

									&:nth-child(7) {
										top: 30%;
										left: 50%;
										transform: translateX(-50%);

										animation: init_7 3s ease-in-out;
									}

									&:nth-child(8) {
										top: 42%;
										left: 50%;
										transform: translateX(-50%);

										animation: init_8 3s ease-in-out;
									}

									a {
										outline: none;
										appearance: none;
									}

									@mixin init-pos($top, $left, $translate: true, $stops: 0) {
										@each $stop in $stops {
											#{$stop}% {
												top: 40%;
												left: 50%;
												transform: translate(-50%, -50%);
												opacity: 0;
											}
										}

										100% {
											top: $top;
											left: $left;
											transform: if(
												$translate,
												translateX(-50%),
												translate(-50%, -50%)
											);
											opacity: 1;
										}
									}

									@keyframes puls {
										0% {
											opacity: 1;
											transform: translate(-50%, -50%) scale(1);
										}

										100% {
											opacity: 0;
											transform: translate(-50%, -50%) scale(2);
										}
									}

									@keyframes init_1 {
										@include init-pos(0%, 9%);
									}

									@keyframes init_2 {
										@include init-pos(0%, 91%);
									}

									@keyframes init_3 {
										@include init-pos(83%, 50%, false);
									}

									@keyframes init_4 {
										@include init-pos(6.5%, 50%, true, (0, 50));
									}

									@keyframes init_5 {
										@include init-pos(45%, 34%, true, (0, 50));
									}

									@keyframes init_6 {
										@include init-pos(45%, 66%, true, (0, 50));
									}

									@keyframes init_7 {
										@include init-pos(30%, 50%, true, (0, 67));
									}

									@keyframes init_8 {
										@include init-pos(42%, 50%, true, (0, 67));
									}
								}
							}
						}
					}
				}
			}
		}

		.box-2 {
			position: relative;
			background: $cViolet;
			overflow: hidden;

			.box-bg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 44.5%;
				transform: translateX(-50%);

				img {
					height: 100%;
					object-fit: contain;
				}
			}

			.row {
				position: relative;
				display: flex;
				flex-direction: row;
				align-items: flex-end;
				justify-content: space-between;
				gap: 50px;
				padding-top: 110px;

				@include respond-below(sm) {
					padding-top: 50px;
				}

				@include respond-below(lg) {
					flex-direction: column;
					padding-bottom: 0;
				}

				.col-1 {
					padding-bottom: 110px;
					min-width: 40%;

					@include respond-below(sm) {
						padding-bottom: 50px;
					}

					@media (max-width: 1399px) {
						min-width: 50%;
					}

					@media (max-width: 991px) {
						width: 100%;
					}

					.box-title {
						margin-bottom: 25px;
						max-width: 570px;

						h2 {
							@include box-title($cWhite);
						}
					}

					.box-text {
						max-width: 560px;
						margin-bottom: 40px;

						p {
							@include box-text(#d5c9df);
						}
					}

					.box-nav {
						padding: 0;
						margin: 0;
						display: flex;
						flex-direction: row;
						column-gap: 20px;
					}
				}

				.col-2 {
					display: flex;
					align-items: flex-end;

					.box-img {
						img {
							width: 100%;

							@media (max-width: 1399px) {
								width: 100%;
								position: relative;
								min-width: 700px;
								left: -15%;
							}

							@media (max-width: 991px) {
								left: 0;
								min-width: unset;
							}
						}
					}
				}
			}
		}

		.box-3 {
			position: relative;

			.box-bg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 64%;
				transform: translateX(-50%);

				img {
					height: 100%;
					object-fit: contain;
				}
			}

			.row {
				position: relative;

				&-1 {
					padding-top: 120px;
					padding-bottom: 80px;

					@include respond-below(sm) {
						padding-top: 60px;
						padding-bottom: 60px;
					}

					.box-title {
						h2 {
							@include box-title($cBlack);
							text-align: center;
						}
					}
				}

				&-2 {
					padding-bottom: 120px;

					@include respond-below(sm) {
						padding-bottom: 50px;
					}

					.box-list {
						display: grid;
						grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
						gap: 30px;

						@include respond-below(sm) {
							grid-template-columns: 1fr;
						}
					}
				}
			}
		}

		.box-4 {
			position: relative;
			background: #f7f4fb;

			.box-bg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 53%;
				transform: translateX(-50%);

				img {
					height: 100%;
					object-fit: contain;
				}
			}

			.row {
				position: relative;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: space-between;
				gap: 50px;

				padding-top: 120px;
				padding-bottom: 120px;

				@include respond-below(sm) {
					padding-top: 50px;
					padding-bottom: 50px;
				}

				@include respond-below(lg) {
					flex-direction: column;
				}

				.col-1 {
					.box-img {
						img {
							width: 100%;
							max-width: 550px;
							border-radius: 16px;
						}
					}
				}

				.col-2 {
					width: 100%;
					max-width: 620px;

					.box-title {
						margin-bottom: 25px;
						max-width: 500px;

						h2 {
							@include box-title($cBlack);
						}
					}

					.box-text {
						margin-bottom: 40px;

						p {
							@include box-text(#616161);
						}
					}

					.box-nav {
						padding: 0;
						margin: 0;
						display: flex;
						flex-direction: row;
						column-gap: 20px;

						@include respond-below(sm) {
							justify-content: center;
						}
					}
				}
			}
		}

		.box-5 {
			position: relative;
			background: $cWhite;

			.box-bg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 36%;
				transform: translateX(-50%);

				img {
					height: 100%;
					object-fit: contain;
				}
			}

			.row {
				position: relative;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: space-between;
				gap: 50px;

				padding-top: 80px;
				padding-bottom: 140px;

				@include respond-below(sm) {
					padding-top: 50px;
					padding-bottom: 50px;
					gap: 0;
				}

				@include respond-below(lg) {
					flex-direction: column-reverse;
				}

				.col-1 {
					width: 100%;
					max-width: 620px;

					.box-title {
						margin-bottom: 25px;
						max-width: 500px;

						h2 {
							@include box-title($cBlack);
						}
					}

					.box-text {
						margin-bottom: 40px;

						p {
							@include box-text(#616161);
						}
					}

					.box-nav {
						padding: 0;
						margin: 0;
						display: flex;
						flex-direction: row;
						column-gap: 20px;

						@include respond-below(sm) {
							justify-content: center;
						}
					}
				}

				.col-2 {
					.box-img {
						img {
							width: 100%;
							max-width: 523px;

							@include respond-below(lg) {
								max-width: 400px;
							}
						}
					}
				}
			}
		}
	}
}

//* O nas
body.page-id-75 {
	main#primary {
		.box-1 {
			position: relative;
			padding-top: 80px;
			overflow: hidden;

			.box-bg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 44%;
				transform: translateX(-50%);
				height: 680px;

				img {
					height: 100%;
					object-fit: contain;
				}
			}

			.row {
				position: relative;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: space-between;
				gap: 50px;

				@include respond-below(lg) {
					flex-direction: column;
				}

				.col-1 {
					#box-page-name {
						margin-bottom: 20px;
					}

					.box-title {
						margin-bottom: 25px;
						max-width: 500px;

						h2 {
							@include box-title($cBlack);
						}
					}

					.box-text {
						max-width: 590px;
						margin-bottom: 40px;

						p {
							@include box-text($cGray);
						}
					}

					.box-info-text {
						max-width: 590px;

						p {
							@include box-text($cBlack);
						}

						a {
							color: inherit;
							text-decoration: underline;
						}
					}
				}

				.col-2 {
					img {
						width: 100%;
						max-width: 700px;
					}
				}
			}
		}

		.box-2 {
			position: relative;
			background: $cWhite;
			padding-top: 120px;
			padding-bottom: 120px;
			overflow: hidden;

			@include respond-below(sm) {
				padding-top: 80px;
				padding-bottom: 80px;
			}

			.box-bg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 42%;
				transform: translateX(-50%);

				img {
					height: 100%;
					min-width: fit-content;
					object-fit: contain;
				}
			}

			.row {
				position: relative;
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				column-gap: 80px;

				@include respond-below(xxl) {
					column-gap: 20px;
				}

				@include respond-below(xl) {
					flex-direction: column;
				}

				.c-tabs {
					width: 100%;

					.box-title {
						margin-bottom: 40px;
						width: 100%;

						@include respond-above(xl) {
							max-width: 770px;
							margin-left: auto;
						}

						h2 {
							@include box-title($cBlack);
						}
					}

					.c-tabs--nav {
						width: 100%;

						@include respond-above(xl) {
							max-width: 770px;
							margin-left: auto;
						}

						@include respond-below(lg) {
							flex-wrap: wrap;
						}

						li {
							border-color: rgba($cDarkGray, 0.4);

							&.active {
								background: $cDarkGray;
								border-color: $cDarkGray;

								span {
									color: $cWhite;
								}
							}

							span {
								color: $cDarkGray;
							}
						}
					}

					.c-tabs--content {
						.c-tab--item {
							&[tab_id='1'] {
								.c-tab--item--wrapper {
									// @include respond-above(xl) {
									// 	max-width: 650px;
									// }

									.text-box-info {
										p {
											color: $cViolet;
										}
									}

									.text-box {
										p {
											color: $cDarkGray;
										}
									}
								}
							}

							&[tab_id='2'] {
								.c-tab--item--wrapper {
									ul {
										li {
											&::before {
												background: $cViolet;
											}

											p {
												&.item-title {
													color: $cBlack;
												}

												&.item-text {
													color: $cDarkGray;
												}
											}
										}
									}
								}
							}

							&[tab_id='3'] {
								.c-tab--item--wrapper {
									ul {
										li {
											&::before {
												background: $cViolet;
											}

											p {
												&.item-title {
													color: $cBlack;
												}

												&.item-text {
													color: $cDarkGray;
												}
											}
										}
									}
								}
							}

							&[tab_id='4'] {
								.c-tab--item--wrapper {
									ul {
										li {
											&::before {
												background: $cViolet;
											}

											p {
												&.item-title {
													color: $cDarkGray;
												}
											}

											a {
												color: $cBlack;
											}
										}
									}
								}
							}
						}

						.row {
							.col-1 {
								width: 490px;
								min-width: 490px;

								@include respond-below(xxl) {
									width: 330px;
									min-width: 330px;
								}

								@include respond-above(xl) {
									margin-top: -82px;
								}

								@include respond-below(xl) {
									width: 100%;

									.box-img {
										display: flex;
										justify-content: center;

										@include respond-below(sm) {
											margin-bottom: 15px;
										}

										img {
											max-width: 300px;
										}
									}
								}
							}

							.col-2 {
								width: 100%;
							}
						}
					}
				}
			}
		}

		.box-3 {
			position: relative;
			background: $cViolet;
			padding-top: 120px;
			padding-bottom: 120px;
			overflow: hidden;

			@include respond-below(sm) {
				padding-top: 80px;
				padding-bottom: 80px;
			}

			.box-bg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 43%;
				transform: translateX(-50%);

				img {
					width: 100%;
					max-width: 670px;
					object-fit: contain;
				}
			}

			.row {
				position: relative;
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				column-gap: 80px;

				@include respond-below(xxl) {
					column-gap: 20px;
				}

				@include respond-below(xl) {
					flex-direction: column-reverse;
					row-gap: 40px;
				}

				.c-tabs {
					width: 100%;

					.box-title {
						margin-bottom: 40px;
						max-width: 490px;

						h2 {
							@include box-title($cWhite);
						}
					}

					.c-tabs--nav {
						@include respond-above(xl) {
							min-width: 735px;
						}

						@include respond-below(lg) {
							flex-wrap: wrap;
						}

						li {
							border-color: rgba(#d5c9df, 0.4);

							&.active {
								background: $cWhite;
								border-color: $cWhite;

								span {
									color: $cViolet;
								}
							}

							span {
								color: $cWhite;
							}
						}
					}

					.c-tabs--content {
						.c-tab--item {
							&[tab_id='1'] {
								.c-tab--item--wrapper {
									@include respond-above(xl) {
										max-width: 650px;
									}

									.text-box-info {
										p {
											color: $cWhite;
										}
									}

									.text-box {
										p {
											color: #d5c9df;
										}
									}
								}
							}

							&[tab_id='2'] {
								.c-tab--item--wrapper {
									ul {
										li {
											&::before {
												background: $cWhite;
											}

											p {
												&.item-title {
													color: $cWhite;
												}

												&.item-text {
													color: #d5c9df;
												}
											}
										}
									}
								}
							}

							&[tab_id='3'] {
								.c-tab--item--wrapper {
									ul {
										li {
											&::before {
												background: $cWhite;
											}

											p {
												&.item-title {
													color: $cWhite;
												}

												&.item-text {
													color: #d5c9df;
												}
											}

											> ul {
												li {
													color: $cWhite;
													font-size: 16px;
													font-weight: 500;
													line-height: 1.5;
												}
											}
										}
									}
								}
							}

							&[tab_id='4'] {
								.c-tab--item--wrapper {
									ul {
										li {
											&::before {
												background: $cWhite;
											}

											p {
												&.item-title {
													color: #d5c9df;
												}
											}

											a {
												color: $cWhite;
											}
										}
									}
								}
							}
						}

						.row {
							.col-2 {
								width: 590px;
								min-width: 590px;

								@include respond-below(xxl) {
									width: 330px;
									min-width: 330px;
								}

								@include respond-above(xl) {
									margin-top: -82px;
								}

								@include respond-below(xl) {
									width: 100%;

									.box-img {
										display: flex;
										justify-content: center;

										img {
											max-width: 300px;
										}
									}
								}
							}
						}
					}
				}
			}
		}

		.box-4 {
			position: relative;
			background: $cWhite;

			.box-bg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 36%;
				transform: translateX(-50%);

				img {
					height: 100%;
					object-fit: contain;
				}
			}

			.row {
				position: relative;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: space-between;
				gap: 50px;

				padding-top: 80px;
				padding-bottom: 140px;

				@include respond-below(md) {
					flex-direction: column-reverse;
				}

				@include respond-below(sm) {
					padding-top: 20px;
					padding-bottom: 80px;
				}

				.col-1 {
					width: 100%;
					max-width: 620px;

					.box-title {
						margin-bottom: 25px;
						max-width: 500px;

						h2 {
							@include box-title($cBlack);
						}
					}

					.box-text {
						margin-bottom: 40px;

						p {
							@include box-text(#616161);
						}
					}

					.box-nav {
						padding: 0;
						margin: 0;
						display: flex;
						flex-direction: row;
						column-gap: 20px;

						@include respond-below(sm) {
							justify-content: center;
						}
					}
				}

				.col-2 {
					.box-img {
						img {
							width: 100%;
							max-width: 523px;
						}
					}
				}
			}
		}
	}
}

//* Kontakt
body.page-id-84 {
	main#primary {
		.box-1 {
			position: relative;
			padding-top: 80px;
			padding-bottom: 110px;
			background: $cViolet;
			overflow: hidden;

			@include respond-below(sm) {
				padding-top: 50px;
				padding-bottom: 50px;
			}

			.box-bg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 50%;
				transform: translateX(-50%);

				img {
					height: 100%;
					min-width: fit-content;
					object-fit: contain;
				}
			}

			.box-wrapper {
				position: relative;
				display: flex;
				flex-direction: column;

				.row {
					&-1 {
						display: flex;
						flex-direction: row;
						justify-content: space-between;
						align-items: center;

						padding-bottom: 40px;
						margin-bottom: 40px;
						border-bottom: 1px solid rgba(#f1ecf7, 0.2);

						@include respond-below(md) {
							flex-direction: column;
							row-gap: 50px;
						}

						.col-1 {
							#box-page-name {
								color: #d5c9df;
								margin-bottom: 20px;
							}

							.box-title {
								margin-bottom: 25px;
								max-width: 500px;

								h2 {
									@include box-title($cWhite);
								}
							}

							.box-text {
								max-width: 560px;

								p {
									@include box-text(#d5c9df);
								}
							}
						}

						.col-2 {
							width: 100%;
							max-width: 590px;
						}
					}

					&-2 {
						ol.box-list {
							padding: 0;
							margin: 0;
							display: grid;
							grid-template-columns: 1fr 1fr;
							column-gap: 150px;
							row-gap: 64px;

							@include respond-below(lg) {
								grid-template-columns: 1fr;
							}

							.box-list-item {
								display: flex;
								flex-direction: column;

								.box-list-text {
									position: relative;
									min-height: 60px;
									margin-bottom: 20px;
									padding-left: 24px;

									&::before {
										content: '';
										position: absolute;
										left: 0;
										top: 7px;
										bottom: 7px;
										width: 2px;
										background: #bdaed4;
									}

									p {
										color: #d5c9df;
										font-weight: 500;
										font-size: 18px;
										line-height: 1.6;
									}
								}

								ul.box-list-contact {
									padding: 0;
									margin: 0;

									li {
										a {
											color: $cWhite;
											font-weight: 500;
											font-size: 24px;
											line-height: 1.6;
										}
									}
								}
							}
						}
					}
				}
			}
		}

		.box-2 {
			position: relative;
			padding-top: 120px;
			overflow: hidden;

			@include respond-below(sm) {
				padding-top: 0;
			}

			.box-bg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 50%;
				transform: translateX(-50%);

				img {
					height: 100%;
					min-width: fit-content;
					object-fit: contain;
				}
			}

			.row {
				position: relative;

				display: flex;
				flex-direction: row;
				justify-content: space-between;
				column-gap: 50px;

				@include respond-below(lg) {
					flex-direction: column;
					row-gap: 50px;
				}

				.col-1 {
					position: relative;
					padding-top: 50px;
					z-index: 1;

					@include respond-above(lg) {
						width: 560px;
						min-width: 560px;
					}

					.box-title {
						margin-bottom: 24px;
						max-width: 500px;

						h2 {
							@include box-title($cBlack);
						}
					}

					.box-text {
						max-width: 560px;

						p {
							@include box-text(#616161);
						}
					}

					ol.contact-list {
						margin: 70px 0 0 0;
						padding: 0;
						display: flex;
						flex-direction: row;
						column-gap: 24px;

						@include respond-below(lg) {
							flex-direction: column;
							row-gap: 30px;
						}

						li.contact-item {
							position: relative;
							display: flex;
							flex-direction: row;
							column-gap: 30px;
							padding: 32px;
							background: $cWhite;
							border-radius: 16px;
							min-width: fit-content;

							@include respond-below(sm) {
								flex-wrap: wrap;
								row-gap: 20px;
							}

							.item-bg {
								position: absolute;
								top: 0;
								left: 9%;
								bottom: 0;

								img {
									height: 100%;
								}
							}

							.contact-item-img {
								position: relative;

								> img {
									position: absolute;
									top: 0;
									right: -14px;
								}

								.img {
									width: 65px;
									min-width: 65px;
									height: 65px;
									border-radius: 100%;
									border: 3px solid #d5c9df;
									overflow: hidden;

									img {
										width: 100%;
										height: 100%;
										object-fit: cover;
									}
								}
							}

							.contact-item-content {
								position: relative;

								.contact-name {
									margin-bottom: 14px;

									p {
										color: $cViolet;
										font-weight: 500;
										font-size: 24px;
										line-height: 1.25;
									}
								}

								ul {
									padding: 0;
									margin: 0;
									display: flex;
									flex-direction: column;
									row-gap: 12px;

									li {
										display: flex;
										flex-direction: row;
										align-items: center;
										column-gap: 12px;

										a {
											color: #616161;
											font-weight: 500;
											font-size: 18px;
											line-height: 1.25;
										}
									}
								}
							}
						}
					}
				}

				.col-2 {
					@include respond-between(lg, xl) {
						transform: translateX(-20%);
					}

					img {
						object-fit: contain;

						@include respond-above(md) {
							width: 900px;
							min-width: 900px;
							max-height: 620px;
						}
					}
				}
			}
		}
	}
}

//* Blog
body.page-template-page-blog {
	main.blog-page {
		.box-1 {
			position: relative;
			padding-top: 120px;
			padding-bottom: 160px;
			background: $cViolet;

			@include respond-below(sm) {
				padding-top: 50px;
				padding-bottom: 120px;
			}

			.box-bg {
				position: absolute;
				top: 0;
				right: 0;
				bottom: 0;

				img {
					width: 100%;
					height: 100%;
					object-fit: contain;

					@include respond-below(lg) {
						object-fit: cover;
					}
				}
			}

			.box-wrapper {
				display: flex;
				flex-direction: column;
				row-gap: 90px;
			}

			.row {
				position: relative;

				&-1 {
					#box-page-name {
						color: #d5c9df;
						margin-bottom: 16px;
					}

					.box-title {
						max-width: 560px;
						margin-bottom: 24px;

						h2 {
							@include box-title($cWhite);
						}
					}

					.box-text {
						max-width: 970px;

						p {
							@include box-text(#d5c9df);

							strong {
								color: $cWhite;
								font-weight: inherit;
							}
						}
					}
				}

				&-2 {
					.box-nav-title {
						margin-bottom: 16px;

						p {
							@include box-text($cWhite);
							font-weight: 600;
						}
					}

					.box-nav-list {
						ul {
							margin: 0;
							padding: 0;
							display: flex;
							flex-direction: row;
							flex-wrap: wrap;
							gap: 16px;
							width: 100%;
							max-width: 880px;

							li {
								&.active {
									a {
										border-color: $cWhite;
										background: $cWhite;

										span {
											color: $cViolet;
										}
									}
								}

								a {
									display: inline-flex;
									padding: 8px 16px;
									border: 1px solid rgba(#d5c9df, 0.4);
									border-radius: 8px;
									flex-direction: row;
									align-items: center;
									gap: 8px;

									span {
										color: $cWhite;
										font-weight: 500;
										font-size: 16px;
										line-height: 20px;
									}
								}
							}
						}
					}
				}
			}
		}

		.box-2 {
			margin-top: -80px;

			#blog-posts {
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
				gap: 30px;

				.article-card {
					opacity: 1;
					transform: scale(1);
					transition: opacity 0.5s ease, transform 0.5s ease;
					width: calc((100% / 3) - (30px - 30px / 3));

					&.is-new {
						opacity: 0;
						transform: scale(0.7);
					}

					@include respond-below(lg) {
						width: calc((100% / 2) - (30px - 30px / 2));
					}

					@include respond-below(md) {
						width: 100%;
					}
				}
			}

			.box-wrapper {
				display: flex;
				flex-direction: column;

				.row {
					&-1 {
						padding-bottom: 100px;

						@include respond-below(sm) {
							padding-bottom: 50px;
						}
					}

					&-2 {
						padding-bottom: 100px;
						text-align: center;

						@include respond-below(sm) {
							padding-bottom: 50px;
						}
					}
				}
			}
		}

		.box-3 {
			position: relative;
			padding-bottom: 120px;
			padding-top: 120px;
			background: #f7f4fb;

			@include respond-below(sm) {
				padding-top: 50px;
				padding-bottom: 50px;
			}

			.box-bg {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 50%;
				transform: translateX(-50%);
			}

			.row {
				position: relative;
				display: flex;
				flex-direction: row;
				align-items: center;
				column-gap: 100px;
				row-gap: 50px;

				@include respond-below(lg) {
					flex-direction: column;
				}

				.col-1 {
					width: 100%;
					max-width: 550px;

					.box-img {
						width: 100%;

						img {
							width: 100%;
							object-fit: contain;
							border-radius: 16px;
						}
					}
				}

				.col-2 {
					width: 100%;

					.box-title {
						max-width: 500px;
						margin-bottom: 24px;

						h2 {
							@include box-title($cBlack);
						}
					}

					.box-text {
						max-width: 630px;
						margin-bottom: 40px;

						p {
							@include box-text($cGray);
						}
					}

					.box-nav {
						@include respond-below(sm) {
							text-align: center;
						}
					}
				}
			}
		}
	}
}

body.single-post {
	main.site-main {
		> .box-1 {
			position: relative;
			padding-bottom: 80px;
			overflow: hidden;

			> .box-bg {
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				max-height: 880px;

				&::before {
					content: '';
					position: absolute;
					inset: 0;
					background: rgba($cViolet, 0.5);
				}

				img {
					width: 100%;
					max-height: 880px;
					object-fit: cover;
					object-position: center;
				}
			}

			.article-bg-1 {
				position: absolute;
				top: 30%;
				left: 97%;
				transform: translateX(-50%);
				width: 1000px;
				z-index: -1;
			}

			.article-bg-2 {
				position: absolute;
				top: 65%;
				left: 20%;
				transform: translateX(-50%);
				width: 520px;
				z-index: -1;
			}

			&::before {
				content: '';
				position: absolute;
				bottom: 0;
				left: 0;
				right: 0;
				height: 180px;
				background: linear-gradient(
					180deg,
					rgba($cWhite, 0) 0%,
					rgba(#f1ecf7, 1) 100%
				);
				z-index: 1;
			}
		}

		> .box-2 {
			position: relative;
			padding-top: 100px;
			margin-bottom: 120px;
			overflow: hidden;

			@include respond-below(sm) {
				padding-top: 0;
			}

			.box-bg {
				position: absolute;
				top: 0;
				left: 84%;
				transform: translateX(-50%);

				width: 1000px;
			}

			.row {
				position: relative;
				z-index: 1;

				.box-title {
					margin-bottom: 80px;

					@include respond-below(sm) {
						margin-bottom: 40px;
					}

					h2 {
						@include box-title($cBlack);
						text-align: center;
					}
				}

				.box-list {
					display: grid;
					grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
					gap: 30px;
				}
			}
		}
	}
}

article[type='article'] {
	position: relative;
	padding-top: 100px;
	z-index: 1;

	header.article-header {
		margin-bottom: 24px;

		.btn-1 {
			display: inline-flex;
			flex-direction: row;
			align-items: center;
			gap: 12px;
		}
	}

	.article-data {
		position: relative;
		padding: 64px;
		border-radius: 16px;
		background: $cWhite;

		@include respond-below(md) {
			padding: 32px;
		}

		@include respond-below(sm) {
			padding: 15px;
		}

		.article-tags {
			padding: 0;
			margin: 0 0 24px 0;
			display: inline-flex;
			flex-direction: row;
			flex-wrap: wrap;
			gap: 16px;

			li {
				background: $cViolet;
				border-radius: 8px;

				span {
					display: inline-block;
					color: $cWhite;
					font-weight: 500;
					font-size: 16px;
					line-height: 20px;
					padding: 8px 15px;
				}
			}
		}

		.article-content {
			//*-----
			h1.wp-block-heading {
				color: $cBlack;
				font-family: $fOutfit;
				font-weight: 500;
				font-size: 40px;
				line-height: 1.35;

				// margin-top: 24px;
				margin-top: 0;
				margin-bottom: 24px;

				@include respond-below(md) {
					font-size: 30px;
				}
			}

			//*-----
			h2.wp-block-heading {
				color: $cBlack;
				font-family: $fOutfit;
				font-weight: 500;
				font-size: 32px;
				line-height: 1.1;

				margin-top: 24px;
				margin-bottom: 24px;

				@include respond-below(md) {
					font-size: 26px;
				}
			}

			//*-----
			h3.wp-block-heading {
				color: $cBlack;
				font-family: $fOutfit;
				font-weight: 500;
				font-size: 24px;
				line-height: 1.4;

				margin-top: 16px;
				margin-bottom: 16px;

				@include respond-below(md) {
					font-size: 20px;
				}
			}

			//*-----
			p {
				color: $cGray;
				font-family: $fOutfit;
				font-weight: 500;
				font-size: 18px;
				line-height: 1.6;
				margin-bottom: 32px;

				&:last-child {
					margin-bottom: 0;
				}

				&:nth-last-child(2) {
					margin-bottom: 0;
				}

				strong {
					color: $cViolet;
					font-weight: 600;
				}

				@include respond-below(md) {
					font-size: 16px;
				}
			}

			//*-----
			figure.wp-block-image {
				img {
					border-radius: 16px;
				}

				.wp-element-caption {
					color: #979797;
					font-family: $fOutfit;
					font-weight: 500;
					font-size: 13px;
					line-height: 2;
					margin-top: 12px;
				}
			}

			//*-----
			ul.wp-block-list,
			ol.wp-block-list {
				margin-left: 0;
				margin-bottom: 32px;

				li {
					position: relative;
					padding-left: 22px;

					color: $cGray;
					font-family: $fOutfit;
					font-weight: 500;
					font-size: 18px;
					line-height: 1.6;

					&:not(:last-child) {
						margin-bottom: 12px;
					}

					@include respond-below(md) {
						font-size: 16px;
					}
				}
			}

			ul.wp-block-list {
				li {
					&::before {
						content: '';
						position: absolute;
						top: 10px;
						left: 0;
						width: 10px;
						min-width: 10px;
						height: 10px;
						background-image: url('/wp-content/uploads/2025/10/triangle-violet.svg');
						background-position: center;
						background-size: contain;
						background-repeat: no-repeat;
					}
				}
			}

			ol.wp-block-list {
				counter-reset: item;

				li {
					counter-increment: item;

					&::before {
						content: counter(item) '.';
						position: absolute;
						top: 0;
						left: 0;

						color: $cViolet;
					}
				}
			}

			//*-----
			.wp-block-post-author {
				align-items: center;
				border-top: 1px solid #f1ecf7;
				border-bottom: 1px solid #f1ecf7;
				padding-top: 24px;
				padding-bottom: 24px;
				margin-top: 40px;
				margin-bottom: 40px;

				.wp-block-post-author__avatar {
					margin-right: 15px;

					img {
						border-radius: 100%;
					}
				}

				.wp-block-post-author__content {
					.wp-block-post-author__byline {
						color: $cGray;
						font-family: $fOutfit;
						font-weight: 500;
						font-size: 14px;
						line-height: 1.25;
						margin: 0;
					}

					.wp-block-post-author__name {
						color: $cViolet;
						font-family: $fOutfit;
						font-weight: 500;
						font-size: 16px;
						line-height: 1.25;
						margin: 0;
					}
				}
			}

			//*-----
			figure.wp-block-pullquote {
				padding: 0;
				margin-top: 48px;
				margin-bottom: 64px;

				blockquote {
					position: relative;
					padding-left: 54px;

					&::before {
						content: '';
						position: absolute;
						top: 0;
						left: 0;
						width: 32px;
						min-width: 32px;
						height: 32px;
						background-image: url('/wp-content/uploads/2025/10/Quotes.svg');
						background-position: center;
						background-size: contain;
						background-repeat: no-repeat;
					}

					p {
						color: $cViolet;
						font-family: $fOutfit;
						font-weight: 500;
						font-size: 18px;
						line-height: 1.6;
						margin-bottom: 12px;

						@include respond-below(md) {
							font-size: 16px;
						}
					}

					cite {
						color: #979797;
						font-family: $fOutfit;
						font-weight: 500;
						font-size: 13px;
						line-height: 2;
						margin-top: 12px;
					}
				}
			}

			//*-----
			.alert-info {
				background: #f1ecf7;
				border-radius: 16px;
				padding: 32px;
				margin-bottom: 32px;

				.alert-header {
					display: inline-flex;
					flex-direction: row;
					align-items: center;
					gap: 10px;

					background: $cViolet;
					border-radius: 8px;
					padding: 8px 16px;
					margin-bottom: 24px;

					img {
						width: 16px;
						min-width: 16px;
						height: 16px;
					}

					span {
						color: $cWhite;
						font-family: $fOutfit;
						font-weight: 500;
						font-size: 16px;
						line-height: 1.25;

						strong {
							font-weight: inherit;
						}
					}
				}
			}
		}

		.article-footer {
			margin-top: 64px;
			padding-top: 32px;
			border-top: 1px solid #f1ecf7;

			.footer-title {
				margin-bottom: 24px;

				h2 {
					color: $cBlack;
					font-weight: 500;
					font-size: 24px;
					line-height: 34px;
				}
			}

			.btn-3 {
				display: inline-flex;
				flex-direction: row;
				align-items: center;
				gap: 16px;
			}
		}
	}
}

article[type='podcast'] {
	.a-box-1 {
		position: relative;
		margin-top: 25px;
		padding-top: 65px;
		padding-bottom: 80px;
		overflow: hidden;

		@include respond-below(sm) {
			padding-top: 25px;
			padding-bottom: 25px;
		}

		.box-bg {
			position: absolute;
			top: 0;
			bottom: 0;
			right: 0;

			img {
				height: 100%;
				object-fit: contain;
			}
		}

		.a-row {
			position: relative;

			&-1 {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				column-gap: 40px;

				@include respond-below(lg) {
					flex-direction: column;
					row-gap: 50px;
					align-items: center;
				}

				.a-col-1 {
					ol {
						padding: 0;
						margin: 0 0 23px 0;
						list-style: none;

						display: flex;
						flex-direction: row;
						align-items: center;

						@include respond-below(xl) {
							flex-wrap: wrap;
							row-gap: 30px;
						}

						li {
							&:nth-child(1) {
								margin-right: 32px;

								@include respond-below(xl) {
									width: 100%;
								}
							}

							.btn-2 {
								gap: 12px;
							}

							&:not(:first-child) {
								span {
									color: $cDarkGray;
									font-weight: 600;
									font-size: 16px;
									line-height: 1.25;
								}
							}

							&:not(:first-child, :last-child) {
								span {
									padding-right: 16px;
									margin-right: 16px;
									border-right: 1px solid #bdaed4;
								}
							}
						}
					}

					.a-box-title {
						margin-bottom: 25px;
						width: 100%;
						max-width: 750px;

						h1 {
							@include box-title($cBlack);
						}
					}

					.a-box-text {
						width: 100%;
						max-width: 750px;

						p {
							@include box-text($cGray);
						}
					}
				}

				.a-col-2 {
					.box-img {
						img {
							width: 100%;
							max-width: 500px;
							border-radius: 16px;
						}
					}
				}
			}

			&-2 {
				padding-top: 40px;

				.a-col-1 {
					nav {
						@include respond-below(lg) {
							text-align: center;
						}

						ul {
							padding: 0;
							margin: 0;
							list-style: none;

							display: inline-flex;
							flex-direction: row;
							gap: 24px;
							flex-wrap: wrap;

							@include respond-below(sm) {
								gap: 5px;
								flex-direction: column;
								width: 100%;
							}

							li {
								.btn-social {
									display: inline-flex;
									flex-direction: row;
									align-items: center;
									column-gap: 10px;
									height: 48px;
									padding-left: 19px;
									padding-right: 19px;
									border-radius: 8px;

									@include respond-below(sm) {
										padding-left: 30px;
										padding-right: 30px;
										width: min(100%, 300px);
										justify-content: center;
									}

									.btn-icon {
										width: 24px;
										min-width: 24px;
										height: 24px;

										span {
											width: 24px;
											min-width: 24px;
											height: 24px;

											line-height: 1;
											font-size: 24px;
										}
									}

									span {
										color: $cWhite;
										font-weight: 600;
										font-size: 16px;
										line-height: 1.25;

										@include respond-below(sm) {
											font-size: 14px;
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}

	.a-box-2 {
		.a-row {
			&-1 {
				padding-bottom: 32px;
				margin-bottom: 32px;
				border-bottom: 1px solid rgba($cViolet, 0.1);

				iframe {
					width: 100%;
					height: 750px;
					border-radius: 12px;

					@include respond-below(sm) {
						height: 300px;
					}
				}
			}

			&-2 {
				ol {
					margin: 0;
					display: flex;
					flex-direction: row;
					align-items: center;
					justify-content: center;
					gap: 20px;

					@include respond-below(sm) {
						font-size: 14px;
					}

					li {
						a {
							gap: 10px;

							@include respond-below(sm) {
								padding-left: 10px;
								padding-right: 10px;

								span {
									font-size: 14px;
								}
							}
						}
					}
				}
			}
		}
	}
}

//* Podcasty
body.page-id-125 {
	.box-1 {
		padding-top: 50px;
		padding-bottom: 64px;

		.row {
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;
			gap: 50px;

			@include respond-below(md) {
				flex-direction: column;
			}

			.col-1 {
				#box-page-name {
					margin-bottom: 16px;
				}

				.box-title {
					width: 100%;
					max-width: 650px;
					margin-bottom: 24px;

					h2 {
						@include box-title($cBlack);

						em {
							color: $cViolet;
							font-style: normal;
						}
					}
				}

				.box-text {
					width: 100%;
					max-width: 560px;

					p {
						@include box-text($cGray);
					}
				}
			}

			.col-2 {
				img {
					width: 100%;
					max-width: 500px;
					border-radius: 16px;
				}
			}
		}
	}

	.box-2 {
		.box-wrapper {
			display: flex;
			flex-direction: column;

			.row {
				&-1 {
					padding-bottom: 100px;

					@include respond-below(sm) {
						padding-bottom: 50px;
					}

					#podcasty-list {
						display: flex;
						flex-direction: row;
						flex-wrap: wrap;
						gap: 30px;

						.podcast-card {
							opacity: 1;
							transform: scale(1);
							transition: opacity 0.5s ease, transform 0.5s ease;
							flex-basis: calc((100% / 2) - (30px - 30px / 2));

							&.is-new {
								opacity: 0;
								transform: scale(0.7);
							}

							@include respond-below(md) {
								flex-basis: 100%;
							}
						}
					}
				}

				&-2 {
					padding-bottom: 100px;
					text-align: center;

					@include respond-below(sm) {
						padding-bottom: 50px;
					}
				}
			}
		}
	}

	.box-3 {
		position: relative;
		padding-top: 120px;
		padding-bottom: 120px;
		overflow: hidden;

		@include respond-below(sm) {
			padding-top: 50px;
			padding-bottom: 50px;
		}

		.box-bg {
			position: absolute;
			top: 0;
			left: 75%;
			width: 100%;
			height: 100%;
			transform: translateX(-50%);

			img {
				height: 100%;
			}
		}

		.row {
			position: relative;
			z-index: 1;

			.box-title {
				margin-bottom: 80px;

				h2 {
					@include box-title($cBlack);
					text-align: center;
				}
			}

			.box-list {
				display: grid;
				grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
				gap: 32px;
			}
		}
	}
}

body.podcasty-template-default {
	main.site-main {
		.box-1 {
			padding-bottom: 120px;

			@include respond-below(sm) {
				padding-bottom: 60px;
			}
		}

		.box-2 {
			position: relative;
			padding-top: 50px;
			padding-bottom: 120px;
			overflow: hidden;

			.box-bg {
				position: absolute;
				top: 0;
				left: 85%;
				bottom: 0;
				transform: translateX(-50%);
				z-index: -1;

				img {
					height: 770px;
					width: 770px;
					min-width: 770px;
				}
			}

			.row {
				position: relative;

				.box-title {
					margin-bottom: 80px;

					h2 {
						@include box-title($cBlack);
						text-align: center;
					}
				}

				.podcasty-list {
					display: flex;
					flex-direction: row;
					flex-wrap: wrap;
					gap: 30px;

					.podcast-card {
						flex-basis: calc((100% / 2) - (30px - 30px / 2));

						@include respond-below(sm) {
							width: 100%;
							flex-basis: unset;
						}
					}
				}
			}
		}
	}
}

//* Oferta
body.page-id-511 {
	background: $cWhite;

	.box-1 {
		padding-top: 90px;
		padding-bottom: 120px;
		background: #f1ecf7;

		@include respond-below(sm) {
			padding-top: 50px;
			padding-bottom: 50px;
		}

		.row {
			position: relative;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			gap: 50px;

			@include respond-below(lg) {
				flex-direction: column;
			}

			.col-1 {
				#box-page-name {
					margin-bottom: 20px;
				}

				.box-title {
					margin-bottom: 25px;
					max-width: 500px;

					h2 {
						@include box-title($cBlack);
					}
				}

				.box-text {
					max-width: 580px;
					margin-bottom: 40px;

					p {
						@include box-text-16($cGray);
					}
				}

				.box-nav {
					ul {
						padding: 0;
						margin: 0;
						display: flex;
						flex-direction: row;
						flex-wrap: wrap;
						gap: 18px;

						li {
							&:nth-child(1) {
								a {
									background: $cDarkGray;
								}
							}

							&:nth-child(2) {
								a {
									background: $cViolet;
								}
							}

							a {
								color: $cWhite;
								display: inline-block;
								padding: 13px 24px 15px;
								border-radius: 8px;
							}
						}
					}
				}
			}

			.col-2 {
				img {
					width: 100%;
					max-width: 615px;
				}
			}
		}
	}

	.box-2 {
		position: relative;
		padding-top: 145px;

		@include respond-below(sm) {
			padding-top: 50px;
		}

		.box-bg {
			position: absolute;
			top: 0;
			bottom: 0;
			left: 48%;
			transform: translateX(-50%);

			img {
				height: 100%;
				object-fit: contain;
			}
		}

		.row {
			position: relative;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			gap: 50px;

			@include respond-below(lg) {
				flex-direction: column;
			}

			.col-1 {
				.box-title {
					margin-bottom: 20px;
					max-width: 500px;

					h2 {
						@include box-title($cBlack);
					}
				}

				.box-text {
					max-width: 650px;
					margin-bottom: 40px;

					p {
						@include box-text-16($cDarkGray);
					}
				}

				.box-info-text {
					max-width: 650px;

					p {
						@include box-text-16($cViolet);
					}
				}
			}

			.col-2 {
				img {
					width: 100%;
					max-width: 645px;
				}
			}
		}
	}

	.box-3 {
		position: relative;
		width: 100%;
		max-width: 1480px;
		padding: 100px 80px;
		margin: 0 auto 64px;
		border-radius: 20px;
		background: #f1ecf7;

		@media (max-width: 1480px) {
			border-radius: 0;
			margin-bottom: 0;
		}

		@include respond-below(md) {
			padding: 70px 40px;
		}

		.container {
			padding: 0;
		}

		.box-bg {
			position: absolute;
			bottom: 0;
			right: 2%;
		}

		.box-3--wrapper {
			position: relative;
			display: flex;
			flex-direction: column;

			.row {
				&-1 {
					display: flex;
					flex-direction: row;
					column-gap: 80px;
					padding-bottom: 80px;
					border-bottom: 1px solid rgba($cViolet, 0.2);

					@include respond-below(lg) {
						flex-direction: column;
						row-gap: 40px;
					}

					.col {
						&-1 {
							width: 100%;
							max-width: 600px;

							.box-title {
								margin-bottom: 16px;

								h3 {
									color: $cViolet;
									font-family: $fOutfit;
									font-weight: 500;
									font-size: 32px;
									margin: 0;
								}
							}

							.box-text-info {
								margin-bottom: 24px;

								p {
									color: $cBlack;
									font-family: $fOutfit;
									font-weight: 500;
									font-size: 20px;

									strong {
										color: $cDarkGray;
										font-weight: inherit;
									}
								}
							}

							.box-data {
								p {
									color: $cWhite;
									font-family: $fOutfit;
									font-weight: 500;
									font-size: 20px;
									display: inline-block;
									padding: 10px 16px;
									background: $cViolet;
									border-radius: 50px;
								}
							}

							.box-btns {
								margin-top: 50px;
							}
						}

						&-2 {
							width: 100%;
							max-width: 630px;

							.box-text {
								p {
									@include box-text-16($cDarkGray);
								}
							}
						}
					}
				}

				&-2 {
					padding-top: 16px;
					padding-bottom: 50px;

					.box-text {
						p {
							@include box-text-16($cDarkGray);
						}
					}
				}

				&-3 {
					.tiles-list {
						display: grid;
						grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
						gap: 64px 40px;

						.tile {
							display: flex;
							flex-direction: column;
							row-gap: 24px;

							.tile-icon {
								img {
									width: 64px;
									max-width: 64px;
									height: 64px;
								}
							}

							.tile-title {
								h4 {
									color: $cBlack;
									font-family: $fOutfit;
									font-weight: 500;
									font-size: 20px;
								}
							}

							.tile-text {
								p {
									@include box-text-16($cDarkGray);
								}
							}
						}
					}
				}
			}
		}
	}

	.box-4 {
		position: relative;
		width: 100%;
		max-width: 1480px;
		padding: 100px 80px;
		margin: 0 auto 140px;
		border-radius: 20px;
		background: $cViolet;

		@media (max-width: 1480px) {
			border-radius: 0;
			margin-bottom: 0;
		}

		@include respond-below(md) {
			padding: 70px 40px;
		}

		.container {
			padding: 0;
		}

		.box-bg {
			position: absolute;
			bottom: 0;
			right: 2%;
		}

		.box-4--wrapper {
			position: relative;
			display: flex;
			flex-direction: column;

			.row {
				&-1 {
					display: flex;
					flex-direction: row;
					column-gap: 80px;
					padding-bottom: 80px;
					border-bottom: 1px solid rgba($cWhite, 0.2);

					@include respond-below(lg) {
						flex-direction: column;
						row-gap: 40px;
					}

					.col {
						&-1 {
							width: 100%;
							max-width: 600px;

							.box-title {
								margin-bottom: 16px;

								h3 {
									color: $cWhite;
									font-family: $fOutfit;
									font-weight: 500;
									font-size: 32px;
									margin: 0;
								}
							}

							.box-text-info {
								margin-bottom: 24px;

								p {
									color: $cWhite;
									font-family: $fOutfit;
									font-weight: 500;
									font-size: 20px;

									strong {
										color: #d5c9df;
										font-weight: inherit;
									}
								}
							}

							.box-data {
								margin-bottom: 16px;

								p {
									color: $cViolet;
									font-family: $fOutfit;
									font-weight: 500;
									font-size: 20px;
									display: inline-block;
									padding: 10px 16px;
									background: $cWhite;
									border-radius: 50px;
								}
							}

							.box-alert {
								max-width: 290px;

								p {
									color: #d5c9df;
									font-family: $fOutfit;
									font-weight: 500;
									font-size: 12px;
									line-height: 1.3;
								}
							}

							.box-btns {
								margin-top: 50px;
							}
						}

						&-2 {
							width: 100%;
							max-width: 630px;

							.box-text {
								p {
									@include box-text-16(#d5c9df);
								}
							}
						}
					}
				}

				&-2 {
					padding-top: 16px;
					padding-bottom: 50px;

					.box-text {
						p {
							@include box-text-16(#d5c9df);
						}
					}
				}

				&-3 {
					.tiles-list {
						display: grid;
						grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
						gap: 64px 40px;

						.tile {
							display: flex;
							flex-direction: column;
							row-gap: 24px;

							.tile-icon {
								img {
									width: 64px;
									max-width: 64px;
									height: 64px;
								}
							}

							.tile-title {
								h4 {
									color: $cWhite;
									font-family: $fOutfit;
									font-weight: 500;
									font-size: 20px;
								}
							}

							.tile-text {
								p {
									@include box-text-16(#d5c9df);
								}
							}
						}
					}
				}
			}
		}
	}

	.box-5 {
		position: relative;
		padding-top: 140px;
		padding-bottom: 140px;
		background: #f2edf7;
		overflow: hidden;

		@include respond-below(sm) {
			padding-top: 50px;
			padding-bottom: 50px;
		}

		.box-bg {
			position: absolute;
			top: 30px;
			left: 50%;
			transform: translateX(9%);
			width: 900px;
		}

		.row {
			position: relative;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			gap: 50px;

			@include respond-below(lg) {
				flex-direction: column;
			}

			.col-1 {
				max-width: 646px;

				.box-title {
					margin-bottom: 20px;

					h2 {
						@include box-title($cBlack);
					}
				}

				.box-text {
					margin-bottom: 40px;

					p {
						@include box-text-16($cGray);
					}
				}

				.box-info-text {
					margin-bottom: 40px;

					p {
						@include box-text-16($cViolet);
					}
				}

				.box-nav {
					ul {
						padding: 0;
						margin: 0;
						display: flex;
						flex-direction: row;
						flex-wrap: wrap;
						gap: 18px;

						li {
							&:nth-child(1) {
								a {
									background: $cDarkGray;
								}
							}

							a {
								color: $cWhite;
								display: inline-block;
								padding: 13px 24px 15px;
								border-radius: 8px;
							}
						}
					}
				}
			}

			.col-2 {
				img {
					width: 100%;
					max-width: 466px;
				}
			}
		}
	}

	.box-6 {
		background: #f2edf7;

		.box-6-wrapper {
			.row {
				&-1 {
					padding-bottom: 30px;

					.box-title {
						h2 {
							color: $cViolet;
							font-family: $fOutfit;
							font-weight: 500;
							font-size: 32px;

							@include respond-below(md) {
								font-size: 26px;
							}
						}
					}
				}

				&-2 {
					padding-bottom: 180px;

					@include respond-below(sm) {
						padding-bottom: 50px;
					}

					.modules-tiles {
						display: flex;
						flex-direction: column;
						row-gap: 16px;

						.module-tile {
							position: relative;
							padding: 32px 40px;
							margin-left: 50px;

							background: linear-gradient(
								90deg,
								$cWhite 0%,
								rgba($cWhite, 0.4) 100%
							);
							border-radius: 20px;

							&::before {
								content: '';
								position: absolute;
								top: 28px;
								left: -50px;
								width: 20px;
								height: 20px;
								border-radius: 100%;
								background: $cViolet;

								@include respond-below(md) {
									width: 10px;
									height: 10px;
									left: -25px;
								}

								@include respond-below(sm) {
									width: 20px;
									height: 20px;
									left: 50%;
									top: -10px;
								}
							}

							@include respond-below(md) {
								margin-left: 25px;
								padding: 30px;
							}

							@include respond-below(sm) {
								margin-left: 0;

								&:not(:first-child) {
									margin-top: 45px;
								}
							}

							.module-tile--info {
								margin-bottom: 16px;

								p {
									color: $cBlack;
									font-family: $fOutfit;
									font-weight: 500;
									font-size: 20px;

									strong {
										color: $cDarkGray;
										font-weight: inherit;
									}

									@include respond-below(md) {
										font-size: 18px;
									}
								}
							}

							.module-tile--title {
								margin-bottom: 24px;

								h3 {
									color: $cViolet;
									font-family: $fOutfit;
									font-weight: 500;
									font-size: 24px;
									line-height: 1.2;

									@include respond-below(md) {
										font-size: 20px;
									}
								}
							}

							.module-tile--nav {
								display: flex;
								flex-direction: row;
								align-items: center;
								justify-content: space-between;

								@include respond-below(lg) {
									flex-wrap: wrap;
									gap: 20px;
								}
								@include respond-below(md) {
									justify-content: center;
								}

								.module-tile--nav--btns {
									display: flex;
									flex-direction: row;
									flex-wrap: wrap;
									gap: 10px;
									align-items: center;
								}
								nav {
									display: flex;
									flex-direction: row;
									gap: 10px;
									flex-wrap: wrap;
								}
								.module-tile--btn {
									display: inline-flex;
									flex-direction: row;
									align-items: center;
									gap: 8px;

									padding: 14px 25px 15px;
									border: 1px solid rgba($cDarkGray, 0.4);
									border-radius: 8px;

									span {
										color: $cDarkGray;
										font-family: $fOutfit;
										font-weight: 600;
										font-size: 16px;
									}

									img {
										transition: all 250ms ease-in-out;
									}

									&.active {
										img {
											transform: scale(-1);
										}
									}
								}

								.module-tile--access {
									p {
										color: $cWhite;
										font-family: $fOutfit;
										font-weight: 500;
										font-size: 20px;
										min-width: max-content;

										padding: 10px 16px;
										background: $cViolet;
										border-radius: 50px;

										@include respond-below(md) {
											font-size: 16px;
										}
									}
								}
							}

							.module-tile--content {
								display: none;

								.module-tile--content--texts {
									padding-top: 16px;
									padding-bottom: 24px;
									margin-bottom: 24px;
									border-bottom: 1px solid rgba($cViolet, 0.2);

									ul {
										list-style: disc;
										margin-bottom: 0;
										margin-left: 22px;

										li {
											@include box-text-16($cViolet);
										}
									}

									p {
										@include box-text-16($cViolet);

										&:not(:last-child) {
											margin-bottom: 16px;
										}

										&:last-child {
											margin-bottom: 0;
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}

	.box-7 {
		position: relative;
		background: $cViolet;

		.box-bg {
			position: absolute;
			top: 0;
			bottom: 0;
			left: 53%;
			transform: translateX(-50%);
			margin: 40px 0;

			img {
				height: 100%;
				object-fit: contain;
			}
		}

		.row {
			position: relative;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			gap: 50px;

			padding-top: 120px;
			padding-bottom: 120px;

			@include respond-below(sm) {
				padding-top: 50px;
				padding-bottom: 50px;
			}

			@include respond-below(lg) {
				flex-direction: column;
			}

			.col-1 {
				.box-img {
					img {
						width: 100%;
						max-width: 550px;
						border-radius: 16px;
					}
				}
			}

			.col-2 {
				width: 100%;
				max-width: 620px;

				.box-title {
					margin-bottom: 25px;
					max-width: 500px;

					h2 {
						@include box-title($cWhite);
					}
				}

				.box-text {
					margin-bottom: 40px;

					p {
						@include box-text(#d7cce1);
					}
				}

				.box-info {
					p {
						color: #d7cce1;
						font-family: $fOutfit;
						font-weight: 500;
						font-size: 12px;
					}
				}
			}
		}
	}

	.box-8 {
		position: relative;
		background: $cWhite;

		.box-bg {
			position: absolute;
			top: 0;
			bottom: 0;
			left: 36%;
			transform: translateX(-50%);

			img {
				height: 100%;
				object-fit: contain;
			}
		}

		.row {
			position: relative;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			gap: 50px;

			padding-top: 80px;
			padding-bottom: 140px;

			@include respond-below(sm) {
				padding-top: 50px;
				padding-bottom: 50px;
				gap: 0;
			}

			@include respond-below(lg) {
				flex-direction: column-reverse;
			}

			.col-1 {
				width: 100%;
				max-width: 620px;

				.box-title {
					margin-bottom: 25px;
					max-width: 500px;

					h2 {
						@include box-title($cBlack);
					}
				}

				.box-text {
					margin-bottom: 40px;

					p {
						@include box-text(#616161);
					}
				}

				.box-nav {
					padding: 0;
					margin: 0;
					display: flex;
					flex-direction: row;
					column-gap: 20px;

					@include respond-below(sm) {
						justify-content: center;
					}
				}
			}

			.col-2 {
				.box-img {
					img {
						width: 100%;
						max-width: 523px;

						@include respond-below(lg) {
							max-width: 400px;
						}
					}
				}
			}
		}
	}
}

body main.clean-page-template {
	.entry-header {
		h1 {
			color: $cBlack;
			font-weight: 500;
			font-size: 40px;
			line-height: 1.35;
		}
	}
	.site-main--wrapper {
		margin-bottom: 80px;

		h2,
		h3,
		h4,
		h5,
		h6 {
			color: $cBlack;
			margin-bottom: 10px;
		}
		h2 {
			font-size: 28px;
		}
		h3 {
			font-size: 24px;
		}
		h4 {
			font-size: 20px;
		}

		p,
		ul,
		li,
		a {
			color: #343434;
			font-size: 16px;
			line-height: 1.67;
		}
		a {
			color: $cViolet;
		}

		ul,
		ol {
			list-style: initial;
		}
	}
}