/* Общие свойства */
.mixed-block {
	margin-bottom: 130px;
}

.about-option-1,
.about-option-3 {
	padding: 24px;
	border-radius: 12px;
	border: 1px solid var(--brand300);
	background-color: var(--brand250);
}

.option-1__center p,
.option-2__bottom-left > div p{
	font-weight: 400;
	font-size: 18px;
	line-height: 150%;
	margin: 0;
}

.option-1__center a,
.option-3__content a,
.option-2__bottom-left > div a{
	text-decoration: underline;
	text-decoration-color: rgba(233, 78, 27, 1); 
}

.option-1__center,
.option-2__bottom-left > div{
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.option-3__content ul,
.option-2__bottom-left > div ul{
	padding-left: 20px;
	list-style-type: disc;
	margin: 0;
}

.option-1__center li,
.option-2__bottom-left > div li {
	font-weight: 500;
	font-size: 16px;
	line-height: 150%;
	color: var(--brand100);
}



/* Для  about-option-1 */

.about-option-1 {
	display: flex;
	gap: 24px;
	flex-direction: column;
}

.option-1__top {
	margin-bottom: 12px;
}


.option-1__bottom {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
}

.option-1__bottom a {
	display: block;
}

.option-1__center p {
	color: var(--text);
}

.expand-btn {
	display: inline-block;
	background: #f0f0f000;
	width: fit-content;
	color: var(--brand100);
	font-weight: 400;
	font-size: 16px;
	line-height: 150%;
	text-decoration: underline;
	transition: .3s linear;
	cursor: pointer;
	outline: none !important;
	border: none;
	padding: 0;
}

.expand-btn:hover {
	color: var(--brand200);
}


/* Для about-option-2 */

.about-option-2 {
	padding-top: 10px;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.option-2__bottom {
	display: flex;
	gap: 32px;
}


.option-2__bottom-left {
	max-width: 68%;
	width: 100%;
}

.option-2__bottom-right {
	max-width: 32%;
	width: 100%;
}

.option-2__box {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.option-2__box-img {
	width: 100%;
	height: auto;
}

.option-2__box-img  img {
	width:100%;
	height: 100%;
	max-width: 410px;
	aspect-ratio: 1 / 1;
	border-radius: 12px;
}

.option-2__info {
	border-radius: 12px;
	border: 1px solid var(--brand300);
	background-color: var(--brand250);
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 12px;
	align-items: center;
	align-content: center;
}

.option-2__info .job-title {
	padding: 3px 10px;
	border-radius: 4px;
	background-color: rgba(233, 78, 27, 0.1);
	font-weight: 500;
	font-size: 12px;
	line-height: 20px;
	color: var(--brand200);
}

.option-2__info .full-name{
	font-weight: 400;
	font-size: 18px;
	line-height: 150%;
	color: var(--brand100);
}


/* Для about-option-3 */

.about-option-3 {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.option-3__content h3 {
	padding-bottom: 12px;
	margin: 0;
	margin-bottom: 12px;
	border-bottom: 1px solid var(--brand300);
	font-weight: 500;
	font-size: 22px;
	line-height: 150%;
	color: var(--brand100);

}

.option-3__content p, 
.option-3__content li {
	font-weight: 500;
	font-size: 14px;
	line-height: 150%;
	color: var(--brand100);
	margin: 0;
}


/* Базовые стили для контента */
.option-1__center {
	position: relative;
}

@media(max-width: 768px) {
	/* Общие */

	.mixed-block {
		margin-bottom: 70px;
	}

	.option-1__center,
	.option-2__bottom-left > div {
		gap: 20px;
	}

	/* Для  about-option-1 */

	.about-option-1 {
		padding: 15;
		border-radius: 12px;
		border: none;
		background-color: unset;
	}

	.option-1__top {
		margin-bottom: 0;
	}

	.about-option-1 {
		gap: 24px;
	}

	.option-1__bottom {
		gap: 12px;
	}

	/* Для about-option-2 */ 

	.option-2__bottom {
		flex-direction: column;
		gap: 48px;
	}

	.option-2__bottom-left,
	.option-2__bottom-right {
		max-width: 100%;
	}

	.option-2__bottom-right {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.option-2__box {
		max-width: 405px;
		width: 100%;
	}

}



@media(max-width: 500px) {
	/* Общие */

	.mixed-block {
		margin-bottom: 50px;
	}

	.option-1__center,
	.option-2__bottom-left > div {
		gap: 16px;
	}

	/* Для  about-option-1 */

	.option-1__top {
		margin-bottom: 8px;
	}

	.about-option-1 {
		gap: 16px;
	}
	
	.home-page .mixed-block .about-option-1 {
		padding: 12px;
	}
	
	.option-1__center p, .option-2__bottom-left > div p {
		font-size: 16px;
	}

	/* Для about-option-2 */ 

	.option-2__bottom {
		gap: 24px;
	}

	/* Для about-option-3 */ 

	.option-3__content h3 {
		font-size: 18px;
	}

	.about-option-3 {
		padding: 16px;
	}
}


/* Стили только для шлавной страницы  */

.home-page  .about-option-1{
	background: #0000001A;
	backdrop-filter: blur(16px);
	border: 0px solid rgb(197 197 197 / 15%);
	padding: 24px;
	border-radius: 12px;
	box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.4), inset 0 1px 2px rgba(255, 255, 255, 0.3), inset 0 -1px 2px rgba(0, 0, 0, 0.2);
}

.option-1__center p {
	color: var(--brand100);
}