/* Start:/local/templates/ipotekatmpl/components/bitrix/news.detail/blog_detail/style.css?17787575948922*/
.content-detail {
	display: flex;
	flex-wrap: wrap;
	align-items: start;
	justify-content: start;
	gap: 2rem;
}

.blog-back {
	font-size: 1.125rem;
	color: var(--on-surface-variant);
	margin-bottom: 2rem;
	display: inline-block;
}

.content-detail .content-detail__content {
	width: calc(40% - 1rem);
}

.content-detail .content-detail__content img {
	max-height: 24rem;
	margin-bottom: 1rem;
}

.content-detail .content-detail__content .title {
	margin-bottom: 1rem;
	--font-family: var(--font-family-headline);
	--font-weight: var(--font-weight-semibold);
	font-family: var(--font-family);
	font-weight: var(--font-weight);
	font-size: 1.5rem;
}

.content-detail .content-detail__content .subtitle {
	margin-bottom: 1rem;
}

.content-detail .content-detail__text {
	width: calc(60% - 1rem);
}

.meta-info .meta-info__item.category {
	color: var(--on-surface);
}


.blog-detail-header .blog-detail-header__img img {
	width: 100%;
	height: 12rem;
	max-height: 40vh;
	margin-bottom: var(--space-2x);
	border-radius: var(--radius-16);
	background-color: var(--container-high);
	object-fit: cover;
}

.blog-detail-header__img img[src$=".jpg"],
.blog-detail-header__img img[src$=".jpeg"] {
	object-fit: cover;
}

.blog-detail-header__img img[src$=".png"] {
	object-fit: contain;
}

.blog-detail-grid {
	display: grid;
}

.blog-detail-header .blog-detail-header__meta {
	margin-bottom: var(--space-2x);
}

.blog-detail .blog-detail__title {
	font-family: var(--hero-font-family);
	font-size: 2rem;
	font-weight: 600;
	line-height: 1;
	margin-bottom: var(--space-3x);
}

.blog-detail .blog-detail__action {
	margin-bottom: var(--space-3x);
}

.blog-detail-body {
	padding-top: var(--space-md);
}

.blog-detail__content h1,
.blog-detail__content h2,
.blog-detail__content h3,
.blog-detail__content h4,
.blog-detail__content h5,
.blog-detail__content h6 {
	margin-top: 3rem;
	margin-bottom: 1.5rem;
}


.blog-detail .blog-detail__toc {
	padding: var(--space-3x) var(--space-2x);
	border-radius: 1.25rem;
	background-color: var(--container-high);
}

.blog-detail .blog-detail__toc .toc-list__item {
	color: inherit;
	text-decoration: none;
	font-weight: 400;
	line-height: 1.37;
	font-size: 1rem;
}

.blog-detail .blog-detail__toc .table-of-content__title {
	font-size: 1.125rem;
	line-height: 1.5rem;
	font-weight: 600;
	display: none;
}

.blog-detail ul li::marker,
.blog-detail ol li::marker {
	color: var(--color-special-green-darker);
	font-family: var(--hero-font-family);
}



.blog-detail__toc-wrapper {
	position: fixed;
	top: 0;
	left: 0;
	transform: translateY(-100%);
	width: 100%;
	padding: .75rem;
	background-color: var(--container-higher);
	box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.06);
	z-index: 12000;
	transition: transform .2s ease-in-out;
}

.blog-detail__toc-wrapper.is-active {
	transform: translateY(0);
	transition: transform .2s ease-in-out;
}

.blog-detail__toc__trigger {
	display: flex;
	padding: 0 1rem;
	justify-content: center;
	gap: .25rem;
	align-items: center;
	transition: all 0.3s ease;
	color: var(--on-surface-variant);
}

.blog-detail__toc__trigger.is-active svg {
	transform: rotate(180deg);
}

.blog-detail__toc-collapse {
	display: none;
	overflow: hidden;
}

.blog-detail .blog-detail__toc .toc-list .toc-list__item.is-active {
	color: var(--color-special-green-darker);
}


/* BLOG SECTION  */
.blog-card-container {
	container-type: inline-size;
	container-name: blog-card-container;
	height: 100%;
}

.blog-card {
	--blog-card-bg: var(--container-high);
	display: flex;
	flex-direction: column;
	background-color: var(--blog-card-bg);
	border-radius: var(--radius-24);
	overflow: hidden;
}

.blog-card a {
	color: inherit;
	text-decoration: none;
}

.blog-card .blog-card__img img {
	width: 100%;
	aspect-ratio: 33 / 18;
	object-fit: cover;
	border-radius: var(--radius-12);
}

.blog-card .blog-card__content {
	padding: var(--space-2x);
	display: flex;
	flex-direction: column;
	gap: .75rem;
}

.blog-card .blog-card__title {
	--font-size: 1.25rem;
	--line-height: 1.4;
	font-size: var(--font-size);
	line-height: var(--line-height);
	font-family: var(--hero-font-family);
	font-weight: 600;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	/* количество строк */
	overflow: hidden;
}

.blog-card .blog-card__meta {
	display: flex;
	gap: var(--space-base);
	align-items: center;
	font-size: 0.875rem;
	line-height: 1.125rem;
}

.blog-card .blog-card__date {
	color: var(--on-surface-variant);
}

.blog-card .blog-card__meta>* {
	display: flex;
	gap: var(--space-base);
	align-items: center;
}

.blog-card .blog-card__meta>*:not(:last-child, :empty)::after {
	content: "•";
	color: var(--on-surface-variant);
}

.blog-card .blog-card__meta>*:empty {
	display: none;
}

.blog-card .blog-card__actions {
	padding-top: .25rem;
}

.blog-card.blog-card--sm {
	border-radius: var(--radius-16);
}

.blog-card.blog-card--sm .blog-card__img {
	padding: var(--space-base);
}

.blog-card.blog-card--sm .blog-card__content {
	padding: .75rem;
	gap: .5rem;
}

.blog-card.blog-card--sm .blog-card__title {
	--font-size: 1.125rem;
	--line-height: 1.3;
	font-weight: 700;
}

.related-articles {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	margin-top: 3rem;
	margin-bottom: 3rem;
}

.related-articles .related-articles__title {
	font-size: 1.75rem;
	line-height: 1;
	font-weight: 600;
	font-family: var(--hero-font-family);
	text-align: center;
}

.related-articles .related-articles__action {
	display: flex;
	justify-content: center;
}

.related-grid {
	display: grid;
	gap: 1.5rem;
}

.blog-slider {
	padding: 1rem 0;
}

.blog-slider .blog-slider__img {
	max-height: 400px;
	height: 100%;
	object-fit: cover;
	border-radius: var(--radius-24);
}

.blog-slider-prev {
	left: -3rem;
}

.blog-slider-next {
	right: -3rem;
}

.blog-slider-page {
	background-color: var(--color-gray-700);
}

.blog-slider-page.is-active {
	background-color: var(--color-gray-500);
}

.pswp img {
	object-fit: contain;
}

@container blog-card-container (min-width: 600px) {

	.blog-card {
		display: flex;
		flex-direction: row;
		gap: var(--space-3x);
		height: 100%;
	}

	.blog-card .blog-card__content {
		padding: 1.25rem 1.5rem 1rem 0;
		max-width: 20rem;
		width: 100%;
	}

	.blog-card .blog-card__meta {
		flex-grow: 1;
		align-items: flex-start;
	}

	.blog-card .blog-card__img {
		flex-grow: 1;
	}

	.blog-card .blog-card__img img {
		height: 100%;
		aspect-ratio: unset;
		border-radius: var(--radius-24);
		max-height: 420px;
	}

	.blog-card .blog-card__title {
		display: block;
		overflow: unset;
		height: auto;
	}

}

@container blog-card-container (min-width: 1000px) {

	.blog-card .blog-card__title {
		--font-size: 1.5rem;
		--line-height: 1.75rem;
	}

	.blog-card .blog-card__content {
		gap: var(--space-2x);
	}

}

@media (min-width: 768px) {

	.blog-slider {
		padding: 2rem 0;
	}

	.blog-detail-header .blog-detail-header__img img {
		height: 35rem;
		margin-bottom: var(--space-md);
		border-radius: var(--radius-24);
	}

	.blog-detail-grid {
		grid-template-columns: minmax(0, 47.5rem) minmax(2rem, 1fr) 20rem;
		margin-right: auto;
		margin-left: auto;
		padding-left: 3.5rem;
		padding-right: 3.5rem;
		max-width: 1252px;
	}

	.blog-detail-header .blog-detail-header__meta {
		margin-bottom: var(--space-3x);
	}

	.blog-detail .blog-detail__title {
		font-size: 3rem;
		line-height: 1.1;
	}

	.blog-detail .blog-detail__action {
		margin-bottom: var(--space-md);
	}

	.blog-detail .blog-detail__toc {
		padding: var(--space-3x);
	}

	.blog-detail .blog-detail__toc .toc-list__item {
		line-height: 1.28;
		font-size: .875rem;
	}

	.blog-detail__toc-wrapper {
		position: static;
		grid-column-start: 3;
		top: unset;
		left: unset;
		width: auto;
		padding: 0;
		background-color: transparent;
		box-shadow: none;
		transform: none;
	}

	.blog-detail__toc-collapse {
		display: block;
	}


	.blog-detail__toc__trigger {
		display: none;
	}

	.blog-detail .blog-detail__toc .table-of-content__title {
		display: block;
	}

	.blog-detail .blog-detail__toc .toc-list .toc-list__item.is-active {
		font-weight: 700;
		color: var(--on-surface);
	}

	.blog-detail .blog-detail__toc-collapse {
		position: sticky;
		top: 2rem;
	}

	.related-articles {
		gap: 2rem;
		margin-top: 4rem;
		margin-bottom: 4rem;
	}

	.related-articles .related-articles__title {
		font-size: 1.875rem;
		line-height: 1.2;
	}

	.related-grid {
		grid-template-columns: repeat(3, 1fr);
	}


}
/* End */
/* /local/templates/ipotekatmpl/components/bitrix/news.detail/blog_detail/style.css?17787575948922 */