#faq {
	background : var(--color-page-main);
	margin     : 0;
}

	#faq .container {
		padding-top    : 0;
		padding-bottom : 0;
		min-height     : auto;
	}

	#faq .faq-top {
		display               : grid;
		grid-template-columns : minmax(0, 1fr) minmax(320px, 420px);
		column-gap            : 22px;
		align-items           : start;
		margin                : 0 auto 14px;
	}

	#faq .faq-head {
		margin    : 0;
		max-width : 620px;
	}

	#faq .faq-head h1 {
		max-width : 18ch;
	}

	#faq .faq-head h5 {
		margin    : 8px 0 0;
		max-width : 54ch;
		font-family    : var(--font-ui);
		font-size      : 16px;
		line-height    : 1.3;
		letter-spacing : 0.06em;
		text-transform : uppercase;
	}

	#faq .faq-layout {
		display       : block;
		margin-top    : 22px;
		padding       : 22px 24px 24px;
		border-radius : 32px;
		background    : #e6ddd5;
	}

	#faq .faq-side-image {
		height        : 220px;
		width         : 100%;
		border-radius : 24px;
		justify-self  : end;
	}

	#faq .faq-side-image-left {
		background-image    : url("../img/FAQ.png");
		background-size     : cover;
		background-position : center top;
		height              : 220px;
		margin-top          : 0;
	}

	#faq .faq-center {
		display       : grid;
		grid-template-columns : repeat(2, minmax(0, 1fr));
		grid-auto-rows: 1fr;
		gap           : 9px;
		width         : 100%;
		max-width     : none;
		align-content : start;
	}

	#faq .faq-card {
		width         : calc(100% - 12px);
		height        : 100%;
		display       : flex;
		flex-direction: column;
		max-width     : none;
		padding       : 16px 18px 15px;
		border-radius : 22px;
		background    : rgba(255, 250, 246, 0.68);
		border        : 0;
		box-shadow    : none;
		justify-self  : center;
	}

	#faq .faq-card h3 {
		margin         : 0 0 10px;
		font-size      : clamp(16px, 1.25vw, 20px);
		line-height    : 1.16;
		letter-spacing : 0.005em;
		font-weight    : 600 !important;
		text-transform : none;
		max-width      : none;
		white-space    : normal;
		color          : var(--color-brown-main);
	}

	#faq .faq-card small {
		margin      : 0;
		display     : block;
		max-width   : none;
		line-height : 1.5;
		font-size   : 15px;
		color       : rgba(47, 34, 27, 0.86);
	}

	#faq .faq-label {
		display        : inline-block;
		min-width      : 18px;
		margin-right   : 8px;
		font-family    : var(--font-ui);
		font-size      : 12px;
		line-height    : 1;
		letter-spacing : 0.18em;
		text-transform : uppercase;
		vertical-align : baseline;
	}

	#faq .faq-card h3 .faq-label {
		color : rgba(96, 58, 40, 0.72);
	}

	#faq .faq-card small .faq-label {
		color : rgba(173, 132, 96, 0.92);
	}

	#faq .faq-bottom {
		margin     : 24px auto 0;
		display    : flex;
		gap        : 0;
		align-items: center;
		justify-content : center;
		text-align : center;
		padding    : 0;
		border-radius : 0;
		background    : transparent;
	}

	#faq .faq-bottom .button {
		min-width   : 276px;
		padding     : 0 52px;
		font-size   : 22px;
		line-height : 1.1;
	}

	#faq .faq-bottom .button b {
		font-weight : 700;
	}

@media (max-width : 980px) {
	#faq {
		padding : 0;
	}

	#faq .container {
		padding-top    : 0;
		padding-bottom : 0;
	}

	#faq .faq-top {
		grid-template-columns : 1fr;
		row-gap               : 10px;
		margin                : 0 auto 14px;
	}

	#faq .faq-head {
		margin : 0;
	}

	#faq .faq-layout {
		display       : block;
		margin-top    : 18px;
		padding       : 18px 18px 20px;
		border-radius : 28px;
	}

	#faq .faq-side-image {
		height : 220px;
		width  : 100%;
	}

	#faq .faq-side-image-left {
		height    : 220px;
		max-width : 100%;
		justify-self : start;
	}

	#faq .faq-center {
		grid-template-columns : 1fr;
		row-gap : 8px;
	}

	#faq .faq-card {
		width   : 100%;
		padding : 14px 16px 12px;
	}

	#faq .faq-card h3 {
		font-size   : clamp(16px, 2.8vw, 18px);
		line-height : 1.16;
	}

	#faq .faq-bottom {
		margin-top : 18px;
		justify-content : center;
	}

	#faq .faq-bottom .button {
		width     : auto;
		min-width : 244px;
		padding   : 0 40px;
		font-size : 20px;
	}
}

@media (max-width : 640px) {
	#faq .faq-side-image {
		height : 180px;
		width  : 100%;
	}

	#faq .faq-side-image-left {
		height    : 180px;
		max-width : 100%;
	}

	#faq .faq-center {
		row-gap : 7px;
	}

	#faq .faq-card {
		padding       : 12px 14px 10px;
		border-radius : 18px;
	}

	#faq .faq-card h3 {
		margin      : 0 0 8px;
		font-size   : 15px;
		line-height : 1.14;
	}

	#faq .faq-card small {
		font-size   : 13px;
		line-height : 1.44;
	}

	#faq .faq-bottom {
		margin-top : 16px;
		gap        : 9px;
	}

	#faq .faq-bottom .button {
		width     : min(100%, 290px);
		min-width : 0;
		font-size : 18px;
	}
}