.advanced-tier {
	display: flex;
	position: relative;
	padding: 0.8rem 0;
	min-height: 100svh;
}

.advanced-tier.has-certificates {
		margin-bottom: 2rem;
	}

.advanced-tier.alternate-visuals .media.bg {
			top: 0.8rem;
		}

.advanced-tier.alternate-visuals .media:not(.bg) {
			width: 1.78rem;
		}
/*  */

.advanced-tier .media.bg {
		display: block;
		position: absolute;
		transform: translate(-4.9rem, 0rem);
		width: 6.47rem;
		top: 0.2rem;
		left: 50%;
	}

.advanced-tier .media.side {
		width: 1.23rem;
	}
/*  */

.advanced-tier .layout {
		display: flex;
		justify-content: space-between;
		pointer-events: none;
		/* height: 100%; */
		width: 100%;
	}

:is(.advanced-tier .layout) .frame {
			pointer-events: all;
			display: flex;
			flex-direction: column;
			/* justify-content: space-between; */
		}
/*  */

.advanced-tier .certificates {
		display: flex;
		position: absolute;
		transform: translate(-50%, 0%);
		top: 9rem;
		left: 50%;
		width: 12.6rem;
		height: auto;
	}

:is(.advanced-tier .certificates) .media {
			position: relative;
			perspective: 1rem;
			width: 1.03rem;
		}

:is(:is(.advanced-tier .certificates) .media) img {
				transition: transform 768ms ease-out;
				transform: translate3d(0, 0, 0px);
			}

:is(:is(.advanced-tier .certificates) .media:hover) img {
				transform: translate3d(0, 0, 0px) rotateY(360deg);
			}
/*  */

.advanced-tier .title-frame {
		display: flex;
		gap: 0.2rem;
		max-width: 3.8rem;
		margin-bottom: 4.6rem;
	}

:is(.advanced-tier .title-frame) .title {
			color: var(--white);
		}

:is(:is(.advanced-tier .title-frame) .title) p {
				display: inline;
			}

:is(.advanced-tier .title-frame) img {
			display: inline-block;
			position: relative;
			width: 0.48rem;
			vertical-align: text-top;
			margin-bottom: -0.02rem;
		}
/*  */

.advanced-tier .expanders {
		position: relative;
		width: 4.4rem;
	}

:is(.advanced-tier .expanders) .expander {
			display: flex;
			cursor: pointer;
			position: relative;
			gap: 0.24rem;
			padding: 0.24rem;
		}

:is(:is(.advanced-tier .expanders) .expander):not(:last-child) {
				border-bottom: 0.01rem dashed var(--orange);
			}
/*  */

:is(:is(.advanced-tier .expanders) .expander) .num {
				font-size: 0.12rem;
				line-height: 1.2em;
				letter-spacing: 0;
				color: var(--orange);
			}
/*  */

:is(:is(.advanced-tier .expanders) .expander) .button {
				display: none;
			}
/*  */

:is(:is(.advanced-tier .expanders) .expander) .subtitle {
				position: relative;
				width: fit-content;
				color: var(--white);
			}

:is(:is(:is(.advanced-tier .expanders) .expander) .subtitle) span {
					display: block;
					transition: opacity 512ms var(--ease);
				}

:is(:is(:is(.advanced-tier .expanders) .expander) .subtitle)::after {
					content: attr(data-text);
					position: absolute;
					transition: opacity 512ms var(--ease);
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					background: linear-gradient(
						107.04deg,
						#1cd77f 0.63%,
						#1687fd 23.26%,
						#383af3 40.58%,
						#d840a5 59.96%,
						#ec7858 79.73%,
						#f2c036 99.51%
					);
					background-clip: text;
					-webkit-text-fill-color: transparent;
					opacity: 0;
				}
/*  */

:is(:is(.advanced-tier .expanders) .expander) .expander-cnt {
				position: relative;
				overflow: hidden;
			}

:is(:is(:is(.advanced-tier .expanders) .expander) .expander-cnt) > div {
					padding-top: 0.24rem;
					padding-bottom: 0.2rem;
				}

:is(:is(:is(.advanced-tier .expanders) .expander) .expander-cnt) .text {
					line-height: 1.2em;
					color: var(--grey);
					/* margin-bottom: 0.24rem; */
				}
/*  */

:is(:is(.advanced-tier .expanders) .expander) > svg {
				display: block;
				position: absolute;
				transition: transform 512ms var(--ease);
				top: 0.34rem;
				right: 0.1rem;
				width: 0.07rem;
			}

.is-open:is(:is(.advanced-tier .expanders) .expander) > svg {
					transform: rotate(180deg);
				}

:is(.is-open:is(:is(.advanced-tier .expanders) .expander) .subtitle) span {
						opacity: 0;
					}

:is(.is-open:is(:is(.advanced-tier .expanders) .expander) .subtitle)::after {
						opacity: 1;
					}

@media screen and (max-width: 768px) and (orientation: portrait) {

	.advanced-tier {
		align-items: center;
}

		.advanced-tier.has-certificates {
			margin-bottom: 0;
			padding-bottom: 7rem;
		}

		.advanced-tier .layout {
			display: block;

			/* & .frame:first-child {
				margin-bottom: 0.4rem;
			} */
		}

		.advanced-tier .media.bg {
			transform: translate(-50%, -50%);
			width: 2.4rem;
			top: 0.25rem;
			left: calc(50% + 0.6rem);
		}

		.advanced-tier .media.side {
			width: 1rem;
			margin-bottom: 0.4rem;
		}

		.advanced-tier .certificates {
			flex-wrap: wrap;
			justify-content: center;
			transform: none;
			width: calc(100% - 0.32rem);
			row-gap: 0.18rem;
			top: auto;
			bottom: 1.6rem;
			left: 0.16rem;
		}

			:is(.advanced-tier .certificates) .media {
				display: block;
			}
				:is(:is(.advanced-tier .certificates) .media:nth-child(2),:is(.advanced-tier .certificates) .media:nth-child(5),:is(.advanced-tier .certificates) .media:nth-child(8),:is(.advanced-tier .certificates) .media:nth-child(11)) img {
					transform: translateY(0.6rem);
				}

		.advanced-tier .title-frame {
			margin-bottom: 0.22rem;
		}

			:is(.advanced-tier .title-frame) img {
				width: 0.2rem;
			}

		.advanced-tier .expanders {
			width: 100%;
		}

			:is(.advanced-tier .expanders) .expander {
				gap: 0.2rem;
				padding: 0.14rem;
			}

				:is(:is(.advanced-tier .expanders) .expander) > svg {
					top: 0.22rem;
				}
					:is(:is(:is(.advanced-tier .expanders) .expander) .expander-cnt) > div {
						padding-top: 0.18rem;
						padding-bottom: 0.14rem;
					}
	}
