/*
 * Глоссарий и словарь терминов.
 *
 * Первый блок — стили референса со страницы термина, перенесены как есть.
 * Второй блок — то, чего в перенесённом CSS нет: плитка указателя,
 * постраничная навигация и алфавитная лента.
 */

/* ------------------------------------------------------------------ */
/* Перенесено с референса                                              */
/* ------------------------------------------------------------------ */

.article__body .b{font-weight:700}.article__body ul{list-style:disc outside!important;padding-left:24px;margin:0 0 18px}.article__body li{display:list-item!important;margin-bottom:6px}.article__body li::marker{color:#1d1d1d}.article__body table.ingredient-role-table{width:100%;border-collapse:separate;border-spacing:0 6px;margin:6px 0 18px}.article__body table.ingredient-role-table td{vertical-align:top;padding:8px 12px 8px 0}.ingredient-quick-card{margin:30px 0;padding:0}.ingredient-quick-card h2{margin-top:0}.hint{position:relative;display:inline-flex;align-items:center;gap:5px;vertical-align:baseline}.hint-term{display:inline-flex;align-items:center;min-height:10px;margin:0;padding:3px;border:0;border-radius:8px;background:#111;color:#fff;font:inherit;line-height:1;cursor:pointer}.hint-wrap{display:inline-flex;position:relative}.hint-trigger{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;padding:0;border:0;border-radius:50%;background:#fff;color:#333;font:700 10px/1 Arial,sans-serif;box-shadow:inset 0 0 0 1px #111;cursor:pointer}.hint-bubble{position:absolute;left:50%;bottom:calc(100% + 8px);z-index:20;width:max-content;max-width:310px;padding:8px 10px;border-radius:10px;background:#111;color:#fff;font-size:14px;line-height:1.35;font-weight:400;transform:translateX(-50%);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s ease,visibility .15s ease}.hint:hover .hint-bubble,.hint:focus-within .hint-bubble{opacity:1;visibility:visible}.article--glossary .article__head{height:auto!important;min-height:calc(100vh - 100px);box-sizing:border-box;padding:150px 86px 58px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;overflow:hidden}.article--glossary .article__head-image{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:0!important}.article--glossary .article__head-image img{width:100%!important;height:100%!important;object-fit:cover!important}.article--glossary .article__head-title{position:relative!important;top:auto!important;right:auto!important;bottom:auto!important;left:auto!important;z-index:2;font-size:clamp(28px,3.8vw,64px);line-height:1.1;max-width:calc(100% - 80px);margin:0 0 18px!important;padding:0!important}.article--glossary .article__head-text.glossary-detail-tags{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;top:auto!important;width:auto;height:auto;display:flex;flex-wrap:wrap;align-items:center;gap:8px;max-width:calc(100% - 172px);margin:0;z-index:2;line-height:1}.article--glossary .article__head-text:not(.glossary-detail-tags){position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;top:auto!important;z-index:2;margin:18px 0 0}.article__head .glossary-detail-tag{position:static!important;top:auto!important;right:auto!important;bottom:auto!important;left:auto!important;display:inline-flex;align-items:center;min-height:34px;padding:7px 16px;border:1px solid #111;border-radius:999px;background:#fff;color:#111!important;font-size:16px;line-height:1;text-decoration:none;text-transform:uppercase}.article__head .glossary-detail-tag:hover,.article__head .glossary-detail-tag:focus-visible{background:#111;color:#fff!important;text-decoration:none}.glossary-carousel{margin:15px 0}.glossary-carousel h2{margin:0 0 18px;color:#1d1d1d}.glossary-carousel__track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(230px,32%);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 0 8px;-webkit-overflow-scrolling:touch}.glossary-carousel__card{position:relative;display:flex;min-height:238px;padding:22px;color:#fff;text-decoration:none;border-radius:18px;overflow:hidden;background:#1d1d1d;scroll-snap-align:start;isolation:isolate}.glossary-carousel__card:hover{text-decoration:none}.glossary-carousel__card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.glossary-carousel__card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,.58));z-index:-1}.glossary-carousel__badge{position:absolute;top:20px;left:20px;padding:3px 10px;border-radius:999px;background:rgba(29,29,29,.75);color:#fff;font-size:14px;line-height:1}.glossary-carousel__name{align-self:flex-end;max-width:78%;margin-bottom:30px;font-size:16px;line-height:1.15;font-weight:700;color:#fff;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.glossary-carousel__name--long{font-size:16px;line-height:1.15}.glossary-carousel__subtitle{position:absolute;left:22px;bottom:22px;transform:none;font-size:14px;color:#fff}.glossary-carousel__arrow{position:absolute;right:20px;bottom:22px;display:flex;align-items:center;justify-content:center;width:46px;height:46px;border:1px solid rgba(255,255,255,.9);border-radius:50%;font-size:28px;color:#fff}@media(max-width:900px){.hint-bubble{position:fixed;left:50%;top:50%;bottom:auto;width:calc(100vw - 40px);max-width:360px;padding:8px 10px;transform:translate(-50%,-50%)}.glossary-carousel__track{display:flex;gap:10px;scroll-snap-type:x proximity}.glossary-carousel__card{flex:0 0 78vw;min-height:228px;padding:20px}.glossary-carousel__name{font-size:16px;line-height:1.15;margin-bottom:30px}.glossary-carousel__name--long{font-size:16px;line-height:1.15}.glossary-carousel__badge{top:18px;left:18px}.article--glossary .article__head{min-height:280px;padding:100px 20px 32px}.article--glossary .article__head-title{font-size:clamp(23px,6vw,36px);line-height:1.12;max-width:calc(100% - 40px);margin-bottom:14px!important}.article--glossary .article__head-text.glossary-detail-tags{gap:6px;max-width:calc(100% - 40px)}.glossary-detail-tag{min-height:28px;padding:6px 12px;font-size:12px}.glossary-carousel__arrow{right:18px;bottom:18px}}

/* ------------------------------------------------------------------ */
/* Наше: у референса этих правил в архиве нет                          */
/* ------------------------------------------------------------------ */

/* Шапка термина без обложки. Заголовок в ней белый, поэтому пустой
   блок нужно закрасить — иначе текст ложится на светлый фон. */
.article--glossary .article__head._plain {
	background: #1d1d1d;
	min-height: 340px;
}

.article--glossary .article__head._plain:after {
	display: none;
}

/* Подзаголовки внутри текста: у референса оформлен только h2. */
.article__body h3 {
	font-size: 26px;
	line-height: 1.25;
	font-weight: 300;
	margin: 26px 0 4px;
}

.article__body .ingredient-quick-card h3 {
	font-size: 22px;
	margin: 22px 0 4px;
}

/* Сетка указателя. В шаблоне блога она в две колонки — для словаря
   из сотни статей это слишком крупно. */
.blog .blog__cards.glossary {
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	margin-bottom: 60px;
}

.blog .blog__cards.glossary .cards__item {
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.blog .blog__cards.glossary .cards__title {
	font-size: 23px;
	line-height: 1.25;
	padding: 24px 24px 0;
}

.cards__image {
	height: 210px;
	overflow: hidden;
}

.cards__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cards__text {
	font-size: 16px;
	line-height: 1.45;
	font-weight: 300;
	color: #4a4a4a;
	margin: 12px 0 0;
	padding: 0 24px 26px;
}

/* В блоге под заголовком сразу идут карточки, здесь — вводная строка,
   поэтому огромный отступ заголовка сокращаем только на этих страницах. */
.post-type-archive-shp_glossary .blog__title,
.post-type-archive-shp_term .blog__title,
.tax-shp_topic .blog__title {
	margin-bottom: 34px;
}

.glossary-lead {
	max-width: 760px;
	margin: 0 0 40px 5px;
	font-size: 19px;
	line-height: 1.5;
	font-weight: 300;
	color: #4a4a4a;
}

.glossary-switch {
	display: flex;
	flex-wrap: wrap;
	gap: 26px;
	margin: 0 0 26px 5px;
}

.glossary-switch__item {
	font-size: 19px;
	line-height: 1;
	font-weight: 300;
	color: #9a9691;
	padding-bottom: 6px;
	border-bottom: 1px solid transparent;
	text-decoration: none;
}

.glossary-switch__item:hover {
	color: #1d1d1d;
	text-decoration: none;
}

.glossary-switch__item._active {
	color: #1d1d1d;
	border-bottom-color: #1d1d1d;
}

.glossary-alphabet {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 46px 5px;
}

.glossary-alphabet__item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	border: 1px solid #e2e0dd;
	border-radius: 999px;
	font-size: 15px;
	line-height: 1;
	color: #1d1d1d;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

a.glossary-alphabet__item:hover,
.glossary-alphabet__item._active {
	background: #1d1d1d;
	border-color: #1d1d1d;
	color: #fff;
	text-decoration: none;
}

.glossary-alphabet__item._empty {
	color: #c9c6c2;
	border-color: #f0efed;
}

.glossary-empty {
	margin: 0 0 80px 5px;
	font-size: 19px;
	font-weight: 300;
}

.glossary-alt {
	font-size: 17px;
	font-weight: 300;
	color: #6a6a6a;
}

.glossary-faq h2 {
	margin-top: 20px;
}

.glossary-faq h3 {
	margin: 22px 0 6px;
	font-size: 22px;
	line-height: 1.3;
	font-weight: 400;
}

.glossary-more {
	margin: 70px 0 40px;
}

.glossary-more .blog__cards.glossary {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	margin: 24px 0 0;
}

.glossary-more .cards__item {
	border-radius: 16px;
	background-color: #f0efed;
}

.glossary-more .cards__title {
	display: block;
	font-size: 20px;
	line-height: 1.3;
	font-weight: 300;
	color: #000;
	padding: 22px 22px 0;
	text-decoration: none;
}

.catalog-pagenavigation {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin: 0 0 90px;
	font-size: 17px;
	font-weight: 300;
}

.catalog-pagenavigation a,
.catalog-pagenavigation .current-page {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 34px;
	height: 34px;
	color: #1d1d1d;
	text-decoration: none;
}

.catalog-pagenavigation .current-page {
	border-bottom: 1px solid #1d1d1d;
}

.catalog-pagenavigation .dots {
	color: #cacaca;
}

@media (max-width: 1200px) {
	.blog .blog__cards.glossary {
		grid-template-columns: repeat(2, 1fr);
	}

	.glossary-more .blog__cards.glossary {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 900px) {
	.glossary-lead {
		margin: 0 0 28px;
		font-size: 16px;
	}

	.article--glossary .article__head._plain {
		min-height: 240px;
	}

	.glossary-switch {
		margin: 0 0 20px;
		gap: 18px;
	}

	.glossary-switch__item {
		font-size: 16px;
	}

	.glossary-alphabet {
		margin: 0 0 30px;
		gap: 5px;
	}

	.glossary-alphabet__item {
		min-width: 32px;
		height: 32px;
		padding: 0 9px;
		font-size: 13px;
	}

	.blog .blog__cards.glossary {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.blog .blog__cards.glossary .cards__title {
		font-size: 20px;
		padding: 20px 20px 0;
	}

	.cards__text {
		padding: 0 20px 20px;
		font-size: 15px;
	}

	.cards__image {
		height: 180px;
	}

	.glossary-more .blog__cards.glossary {
		grid-template-columns: 1fr;
	}

	.catalog-pagenavigation {
		margin-bottom: 50px;
	}
}