@charset "UTF-8";
.card-main {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;
		gap: 16px;
		color: var(--accent);
		container-type: inline-size;
		container-name: card-main;
		padding: var(--side-block);
}
.card-main .title {
		margin: 0;
		color: var(--accent);
		position: relative;
		align-self: stretch;
		letter-spacing: -0.011em;
}
.card-main .arrow {
		fill: currentColor;
		width: 32px;
		height: 32px;
		position: absolute;
		top: 0;
		right: 0;
		display: none;
}
.card-main .text {
		margin-top: -8px;
}
.card-main .image-circle {
		width: 160px;
		height: 160px;
}
.card-main:has(.image-faded) .card-pattern {
		display: none !important;
}
.card-main .image-faded img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
}
.card-main .image-faded {
		position: absolute;
}
@media only screen and (max-width: 699.99px) {
		.card-main {
				min-height: 320px;
				justify-content: flex-start;
				padding-top: 200px;
		}
		.style-novodev .card-main {
				--geo: 84px;
		}
		.card-main:has(.image-circle) {
				padding-top: 216px;
		}
		.card-main:has(.image-faded) {
				padding-top: 216px;
		}
		.style-plant .card-main .card-pattern:before {
				bottom: calc(100% - 164px);
				left: 50%;
				transform: translate3d(-50%, 0, 0);
		}
		.style-geo .card-main .card-pattern:before {
				height: calc(var(--geo) * 2);
				top: 0;
				left: 0;
				right: 0;
				mask-position: 50% 100%;
		}
		.style-novodev.style-geo .card-main .card-pattern:before {
				height: calc(var(--geo) * 1.5);
		}
		.card-main .image-circle {
				top: var(--side-block);
				left: 50%;
				transform: translate3d(-50%, 0, 0);
		}
		.card-main .icon {
				position: absolute;
				top: 60px;
				left: 50%;
				transform: translate3d(-50%, 0, 0);
		}
		.card-main .image-faded {
				top: 0;
				left: 0;
				right: 0;
				border-radius: var(--radius) var(--radius) 0 0;
				height: 216px;
				mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) calc(100% - 100px), rgba(0, 0, 0, 0) 100%);
		}
		.card-main:has(.image-faded) {
				border-top-left-radius: 10px;
				border-top-right-radius: 10px;
		}
		.card-main .image-faded img {
				border-radius: var(--radius) var(--radius) 0 0;
		}
		.card-min {
				min-height: 0;
				padding: var(--side-block) 56px var(--side-block) var(--side-block) !important;
		}
		.style-plant .card-min .card-pattern:before {
				height: auto;
				left: 100%;
				transform: translate3d(-100px, 0, 0);
				top: 0;
				bottom: 0;
				right: 0;
		}
		.style-geo .card-min .card-pattern:before {
				height: auto;
				left: auto;
				top: 0;
				bottom: 0;
				right: 0;
				width: calc(var(--geo) * 1);
				mask-position: 0 50%;
		}
		.style-novodev.style-geo .card-min .card-pattern:before {
				height: auto;
				left: auto;
				top: 0;
				bottom: 0;
				right: 0;
				width: calc(var(--geo) * 3);
				mask-image: url("../img/themes/geo2-hor.svg");
				mask-size: auto var(--geo);
				mask-position: 0 50%;
		}
		.style-novodev .card-min {
				--geo: 56px;
		}
		.card-min .arrow {
				display: block;
				top: var(--side-block);
				right: 16px;
		}
		.card-min:has(.card-pattern) .arrow {
				display: none;
		}
		.card-min .image-circle, .card-min .image-faded, .card-min .icon {
				display: none;
		}
		.card-min .link-more {
				width: auto;
				align-self: flex-start;
		}
}
@media only screen and (min-width: 700px) {
		.card-main {
				min-height: 200px;
				padding-top: 20px;
				padding-bottom: 20px;
				padding-right: calc(180px + var(--side-block));
		}
		.style-plant .card-main .card-pattern:before {
				left: calc(100% - 450px);
				bottom: 0;
		}
		.style-plant .card-main .card-pattern-tl:before {
				bottom: auto;
				top: 0;
		}
		.style-plant .card-main .card-pattern-br:before {
				left: auto;
				right: 0;
		}
		.style-geo .card-main .card-pattern:before {
				width: calc(var(--geo) * 4);
				top: 0;
				bottom: 0;
				right: 0;
		}
		.style-novodev.style-geo .card-main .card-pattern:before {
				width: calc(var(--geo) * 5.5);
				mask-image: url("../img/themes/geo2-hor.svg");
				mask-size: auto var(--geo);
				mask-position: 0 50%;
		}
		@container card-main (max-width: 1000px) {
				.style-geo .card-main .card-pattern:before {
						width: calc(var(--geo) * 3);
				}
				.style-novodev.style-geo .card-main .card-pattern:before {
						width: calc(var(--geo) * 4.5);
				}
		}
		@container card-main (max-width: 700px) {
				.style-geo .card-main .card-pattern:before {
						width: calc(var(--geo) * 2);
				}
				.style-plant .card-main .card-pattern-tl:before {
						top: 50%;
						transform: translate3d(0, -30%, 0);
						left: 59%;
				}
				.style-plant .card-main .card-pattern-br:before {
						right: auto;
						left: calc(100% - 450px);
				}
		}
		.card-main .title {
				font-size: 32px;
				margin: -2px 0;
		}
		.card-main .text {
				min-height: 2.6em;
		}
		.card-main:has(.image-faded) .text {
				max-width: 50%;
		}
		.card-main:has(.image-faded) {
				border-top-right-radius: 10px;
				border-bottom-right-radius: 10px;
		}
		.card-main .image-faded {
				top: 0;
				bottom: 0;
				right: 0;
				left: 210px;
				mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 1) 75%);
				border-radius: 0 var(--radius) var(--radius) 0;
		}
		.card-main .image-faded img {
				border-radius: 0 var(--radius) var(--radius) 0;
		}
		.card-main .image-circle {
				top: 50%;
				right: var(--side-block);
				transform: translate3d(0, -50%, 0);
		}
		.card-main .icon {
				position: absolute;
				top: 50%;
				right: 67px;
				transform: translate3d(0, -50%, 0);
		}
}
@media only screen and (min-width: 1200px) {
		.sidebar .card-min {
				width: 100% !important;
				min-height: 200px;
				padding: var(--side-block) 56px var(--side-block) var(--side-block) !important;
				justify-content: center;
		}
		.style-plant .sidebar .card-min .card-pattern:before {
				height: auto;
				left: 100%;
				transform: translate3d(-100px, 0, 0);
				top: 0;
				bottom: 0;
				right: 0;
		}
		.style-geo .sidebar .card-min .card-pattern:before {
				height: auto;
				left: auto;
				top: 0;
				bottom: 0;
				right: 0;
				width: calc(var(--geo) * 1);
				mask-position: 0 50%;
		}
		.style-novodev.style-geo .sidebar .card-min .card-pattern:before {
				height: auto;
				left: auto;
				top: 0;
				bottom: 0;
				right: 0;
				width: calc(var(--geo) * 2.5);
				mask-image: url("../img/themes/geo2-hor.svg");
				mask-size: auto var(--geo);
				mask-position: 0 50%;
		}
		.style-novodev .sidebar .card-min {
				--geo: 56px;
		}
		.sidebar .card-min .arrow {
				display: block;
				top: var(--side-block);
				right: 16px;
		}
		.sidebar .card-min:has(.card-pattern) .arrow {
				display: none;
		}
		.sidebar .card-min .image-circle, .sidebar .card-min .image-faded, .sidebar .card-min .icon {
				display: none;
		}
		.sidebar .card-min .link-more {
				width: auto;
				align-self: flex-start;
		}
		.sidebar .card-min .btn {
				margin-top: 0 !important;
		}
}
.card-3d .frame {
		position: relative;
		height: 700px;
		max-height: 70vh;
		max-height: 70svh;
}
.card-3d .frame > * {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		border-radius: var(--radius) var(--radius) 0 0;
}
.card-3d .card-main {
		color: var(--main-text);
}
.card-3d .card-main:not(:first-child) {
		border-top-left-radius: 0;
		border-top-right-radius: 0;
}
.card-3d .card-main .title {
		color: var(--title);
}
.card-3d .card-main .text {
		display: block;
		height: auto;
		margin-top: 0;
}
@media only screen and (min-width: 700px) {
		.card-3d .card-main .title {
				font-size: 32px;
		}
}