/* desktop */

.faq-mk2 .content {
	display: grid;
	grid-template-columns: 100.2rem 1fr;
	gap: 2.4rem;
}

.faq-list .subtitle {
	font-size: 1.8rem;
	max-width: none;
	margin-bottom: 0;
}

.faq-list {
	display: flex;
	flex-direction: column;
	gap: 1.2rem;
}

.faq-list-title-wrapper {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 2.4rem;
}

.faq-item {
	background-color: var(--white-100);
	border-radius: 1.2rem;
	padding: 2.4rem;
}

.faq-cta {
	display: flex;
	flex-direction: column;
	gap: 2rem;
	border-radius: 1.2rem;
	padding: 2.4rem;
	background-color: var(--dark-100);
	color: var(--white-100);
	height: fit-content;
}

.faq-list-icon {
	width: 2.4rem;
	height: 2.4rem;
	transform: rotate(90deg);
}

.faq-item.active .faq-list-icon {
	transform: rotate(-90deg);
}

.faq-list-item-content {
	max-width: 90rem;
}

.faq-item.active .faq-list-item-content {
	margin-top: 1.6rem;
}

.faq-list-item-content *:first-child {
	margin-top: 0;
	padding-top: 0;
}

.faq-list-item-content *:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
}

.faq-cta a {
	color: var(--white-100);
	display: block;
	font-size: 1.6rem;
	margin-bottom: 0.4rem;
	font-weight: 600;
}

.faq-cta .call-now {
	display: flex;
	align-items: center;
	gap: 0.6rem;
}

.faq-cta .call-now::before {
	content: ' ';
	width: 0.6rem;
	height: 0.6rem;
	background-color: var(--accent);
	border-radius: 90rem;
}

.faq-cta .text-block {
	max-width: 27.2rem;
}

/* tablet */

@media (max-width: 1200px) {
	.faq-mk2 .content {
		grid-template-columns: 1fr;
	}

	.faq-cta {
		flex-direction: row;
		align-items: center;
	}
}

/* mobile */

@media (max-width: 650px) {
	.faq-mk2 .content {
		gap: 1.6rem;
	}

	.faq-cta {
		flex-direction: column;
		align-items: start;
	}

	.faq-list {
		gap: 0.8rem;
	}

	.faq-cta {
		padding: 1.6rem;
	}

	.faq-item {
		padding: 1.6rem;
	}

	.faq-mk2 .subtitle {
		font-size: 1.6rem;
	}
}
