/* Yana Berg — запись блога: журнальная вёрстка.
 * Обложка — тёмная (навигация поверх), тело — «бумага».
 * Десктоп (≥1024): поле слева | колонка текста | оглавление справа. Широкие фото, таблица, «Sumário»
 * и выносная цитата выходят в левое поле (асимметрия журнального разворота) — оглавление не перекрывают.
 * Мобильный: липкая плашка «Índice» + выезжающая слева панель.
 */

.yb-post {
	--yb-col: 680px;
	--yb-toc: 240px;
	--yb-gap: 80px;
	--yb-bleed: 0px;
	--yb-tint: color-mix(in srgb, var(--yb-marsala) 13%, transparent);
	--yb-frame: color-mix(in srgb, var(--yb-marsala) 45%, transparent);
	background: var(--yb-paper);
	color: var(--yb-ink-text);
	font-family: var(--yb-font-body);
	text-align: left;
}

.yb-post *,
.yb-comments * {
	box-sizing: border-box;
}

.yb-post ::selection,
.yb-comments ::selection {
	background: color-mix(in srgb, var(--yb-marsala) 22%, transparent);
	color: var(--yb-ink-text);
}

/* Тема обрезает горизонтальный вылет через overflow: hidden у body и #page-top — из-за этого
 * body становится контейнером прокрутки и липкое оглавление не залипает. clip обрезает так же,
 * но контейнер прокрутки не создаёт. Только на странице записи (post.css грузится только там). */
body.single-post {
	overflow-x: clip !important;
	overflow-y: visible !important;
}

body.single-post #page-top {
	overflow-x: clip !important;
	overflow-y: visible !important;
}

/* -------- прогресс чтения -------- */

.yb-progress {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: calc(var(--yb-z-header) + 2);
	height: 2px;
	pointer-events: none;
}

.yb-progress__bar {
	display: block;
	height: 100%;
	background: var(--yb-marsala-text);
	transform: scaleX(var(--yb-read, 0));
	transform-origin: left center;
}

/* -------- обложка -------- */

.yb-post__cover {
	background: var(--yb-ink);
	color: var(--yb-white);
	padding-left: 24px;
	padding-right: 24px;
	/* Нижний отступ — место, на которое заходит главное фото. */
	padding-bottom: 220px;
	text-align: center;
}

.yb-post__cover {
	/* Место под навигацию, которая лежит поверх обложки. */
	padding-top: 150px;
}

.yb-post__cover-inner {
	max-width: 1000px;
	margin: 0 auto;
	/* Отступ от общих крошек в шапке (раньше его давали свои крошки записи). */
	padding-top: 56px;
}

.yb-post__title {
	margin: 0 auto;
	max-width: 15ch;
	font-family: var(--yb-font-display);
	font-size: clamp(46px, 7.2vw, 108px);
	font-weight: 400;
	line-height: 0.98;
	letter-spacing: -0.01em;
	/* Colibri набирает все h1 капслоком. */
	text-transform: none;
	color: var(--yb-white);
	text-wrap: balance;
}

.yb-post__lead {
	max-width: 620px;
	margin: 32px auto 0;
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-weight: 300;
	font-size: var(--yb-fs-lead);
	line-height: 1.4;
	color: var(--yb-on-dark-soft);
	text-wrap: balance;
}

.yb-post__meta {
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 8px 12px;
	margin-top: 40px;
	font-size: var(--yb-fs-sm);
	color: var(--yb-text-muted);
}

.yb-post__meta strong {
	font-weight: 500;
	color: var(--yb-white);
}

.yb-post__meta-avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	object-fit: cover;
	object-position: 50% 25%;
	filter: grayscale(1);
}

.yb-post__meta-sep {
	color: var(--yb-marsala-text);
}

/* «Partilhar» в обложке: стеклянная «пилюля» под мета-строкой, выпадающая тёмная карточка. */
.yb-sharepop {
	position: relative;
	display: flex;
	justify-content: center;
	margin-top: 28px;
}

.yb-sharepop__btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	padding: 0 22px 0 18px;
	border: 1px solid var(--yb-line);
	border-radius: var(--yb-radius-pill);
	background: var(--yb-veil);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	font-family: var(--yb-font-body);
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-caps);
	text-transform: uppercase;
	color: var(--yb-white);
	cursor: pointer;
	transition: background var(--yb-duration) var(--yb-ease), border-color var(--yb-duration) var(--yb-ease), box-shadow var(--yb-duration) var(--yb-ease);
}

.yb-sharepop__btn svg {
	color: var(--yb-marsala-text);
	transition: color var(--yb-duration) var(--yb-ease), transform var(--yb-duration) var(--yb-ease);
}

.yb-sharepop__btn:hover,
.yb-sharepop__btn:focus-visible,
.yb-sharepop__btn[aria-expanded="true"] {
	background: var(--yb-gradient-accent);
	border-color: transparent;
	box-shadow: var(--yb-shadow-glow);
	outline: none;
}

.yb-sharepop__btn:hover svg,
.yb-sharepop__btn:focus-visible svg,
.yb-sharepop__btn[aria-expanded="true"] svg {
	color: var(--yb-white);
	transform: translateY(-2px);
}

.yb-sharepop__btn:focus-visible {
	box-shadow: var(--yb-shadow-glow), 0 0 0 3px rgba(255, 255, 255, 0.35);
}

.yb-sharepop__menu {
	position: absolute;
	top: calc(100% + 12px);
	left: 50%;
	z-index: var(--yb-z-popover);
	width: 248px;
	padding: 16px 8px 8px;
	background: var(--yb-ink-raised);
	border: 1px solid var(--yb-line-soft);
	border-radius: 20px;
	box-shadow: 0 24px 48px -16px rgba(0, 0, 0, 0.6);
	text-align: left;
	transform: translateX(-50%);
	animation: yb-sharepop-in 0.22s var(--yb-ease);
}

.yb-sharepop__menu[hidden] {
	display: none;
}

@keyframes yb-sharepop-in {
	from {
		opacity: 0;
		transform: translate(-50%, -6px);
	}
}

.yb-sharepop__label {
	margin: 0 12px 8px;
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-caps);
	text-transform: uppercase;
	color: var(--yb-text-subtle);
}

.yb-post .yb-sharepop__menu ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.yb-post .yb-sharepop__menu li {
	margin: 0;
	padding: 0;
}

.yb-post .yb-sharepop__menu a,
.yb-sharepop__copy {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	min-height: 44px;
	padding: 0 12px;
	border: 0;
	border-radius: 12px;
	background: none;
	font-family: var(--yb-font-body);
	font-size: var(--yb-fs-ui);
	font-weight: 500;
	color: var(--yb-on-dark);
	text-decoration: none;
	cursor: pointer;
	transition: background var(--yb-duration) var(--yb-ease), color var(--yb-duration) var(--yb-ease);
}

.yb-sharepop__menu svg {
	flex: none;
	color: var(--yb-marsala-text);
}

.yb-post .yb-sharepop__menu a:hover,
.yb-post .yb-sharepop__menu a:focus-visible,
.yb-sharepop__copy:hover,
.yb-sharepop__copy:focus-visible {
	background: var(--yb-veil-strong);
	color: var(--yb-white);
	outline: none;
}

.yb-sharepop__copy {
	margin-top: 6px;
	border-top: 1px solid var(--yb-line-soft);
	border-radius: 0 0 12px 12px;
	padding-top: 2px;
}

.yb-sharepop__copy.is-copied,
.yb-sharepop__copy.is-copied svg {
	color: var(--yb-marsala-text);
}

/* -------- главное фото на стыке тёмного и светлого -------- */

/* Colibri делает figure строчно-блочными и обнуляет им отступы — возвращаем. */
.yb-post figure,
.yb-post .yb-post__hero {
	display: block;
}

.yb-post .yb-post__hero {
	position: relative;
	max-width: 1248px;
	margin: -180px auto 0;
	padding: 0 24px;
}

.yb-post__hero img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 2 / 1;
	object-fit: cover;
	filter: grayscale(1);
}

.yb-post__hero figcaption {
	margin-top: 12px;
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-size: var(--yb-fs-lg);
	color: var(--yb-paper-muted);
}

/* -------- тело: оглавление + колонка -------- */

.yb-post__body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, var(--yb-col)) var(--yb-toc);
	column-gap: var(--yb-gap);
	max-width: var(--yb-container);
	margin: 0 auto;
	padding: 96px 24px 120px;
}

.yb-post__content {
	grid-column: 2;
	grid-row: 1;
	min-width: 0;
	/* Вылет широких элементов в левое поле: всё поле + зазор, но не больше 200px. */
	--yb-bleed: min(200px, max(0px, calc(min(100vw, 1280px) - 1048px - 16px)));
	counter-reset: yb-h2 yb-fig;
}

/* -------- оглавление (десктоп) -------- */

/* Справа; выезжает, когда «Sumário» в тексте ушёл с экрана (класс ставит скрипт). */
.yb-toc {
	grid-column: 3;
	grid-row: 1;
	position: sticky;
	top: 120px;
	align-self: start;
	opacity: 0;
	transform: translateX(32px);
	transition: opacity 0.6s ease, transform 0.8s var(--yb-ease);
}

.yb-toc.is-visible {
	opacity: 1;
	transform: none;
}

.yb-toc__label,
.yb-tocsheet__label {
	margin: 0 0 16px;
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-caps);
	text-transform: uppercase;
	color: var(--yb-paper-muted);
}

.yb-toc__list,
.yb-tocsheet__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.yb-post .yb-toc__link {
	position: relative;
	display: grid;
	grid-template-columns: 34px minmax(0, 1fr);
	align-items: baseline;
	padding: 11px 0 13px;
	color: var(--yb-paper-muted);
	text-decoration: none;
	transition: color var(--yb-duration) ease;
}

.yb-toc__num {
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-size: var(--yb-fs-lg);
	line-height: 1;
	font-variant-numeric: lining-nums;
	color: color-mix(in srgb, var(--yb-paper-muted) 70%, transparent);
	transition: color var(--yb-duration) ease;
}

.yb-toc__text {
	font-size: var(--yb-fs-ui);
	line-height: 1.4;
}

/* Под каждым пунктом — волосяная линия; у текущего раздела она заполняется по мере чтения. */
.yb-toc__bar {
	position: absolute;
	left: 34px;
	right: 0;
	bottom: 0;
	height: 1px;
	background: var(--yb-paper-line);
}

.yb-toc__bar::after {
	content: "";
	display: block;
	position: absolute;
	inset: 0;
	background: var(--yb-marsala);
	transform: scaleX(var(--p, 0));
	transform-origin: left center;
}

.yb-post .yb-toc__link:hover,
.yb-post .yb-toc__link.is-active {
	color: var(--yb-ink-text);
}

.yb-toc__link:hover .yb-toc__num,
.yb-toc__link.is-active .yb-toc__num {
	color: var(--yb-marsala);
}

.yb-toc__link.is-done .yb-toc__num {
	color: var(--yb-ink-text);
}

.yb-toc__status {
	margin: 18px 0 0 34px;
	font-size: var(--yb-fs-xs);
	color: var(--yb-paper-muted);
	font-variant-numeric: tabular-nums;
}

/* -------- мобильное оглавление -------- */

.yb-tocbar {
	display: none;
}

.yb-tocsheet[hidden] {
	display: none;
}

/* -------- типографика текста -------- */

.yb-post__content > * {
	margin-top: 0;
	margin-bottom: 0;
}

.yb-post__content p,
.yb-post__content li {
	font-size: var(--yb-fs-lg);
	line-height: 1.75;
	color: color-mix(in srgb, var(--yb-ink-text) 88%, transparent);
	text-wrap: pretty;
}

.yb-post__content > p {
	margin-bottom: 1.35em;
}

.yb-post__content strong {
	font-weight: 600;
	color: var(--yb-ink-text);
}

.yb-post__content em {
	font-style: italic;
}

/* Буквица — антиква марсалой на пять строк. */
.yb-post__content .has-drop-cap:not(:focus)::first-letter {
	float: left;
	margin: 0.08em 0.12em 0 0;
	font-family: var(--yb-font-display);
	font-size: 5.6em;
	font-weight: 400;
	line-height: 0.78;
	color: var(--yb-marsala);
}

/* Раздел: короткая черта марсалой над заголовком (номера — только в оглавлении). */
.yb-post__content h2 {
	margin: 2.6em 0 0.7em;
	font-family: var(--yb-font-display);
	font-size: var(--yb-fs-h3);
	font-weight: 400;
	line-height: 1.08;
	color: var(--yb-ink-text);
	text-wrap: balance;
	scroll-margin-top: 110px;
}

.yb-post__content h2::before {
	content: "";
	display: block;
	width: 32px;
	height: 1px;
	margin-bottom: 22px;
	background: var(--yb-marsala);
}

.yb-post__content h3 {
	margin: 1.8em 0 0.5em;
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-weight: 300;
	font-size: 30px;
	line-height: 1.2;
	color: var(--yb-ink-text);
}

/* -------- ссылки: тонкая черта → мягкая заливка снизу при наведении -------- */

.yb-post__content :is(p, li, td, figcaption) a {
	color: var(--yb-ink-text);
	text-decoration: none;
	background-image: linear-gradient(var(--yb-tint), var(--yb-tint)), linear-gradient(var(--yb-marsala), var(--yb-marsala));
	background-repeat: no-repeat;
	background-position: 0 100%, 0 100%;
	background-size: 100% 0, 100% 1px;
	padding: 0 0.08em;
	transition: background-size 0.35s var(--yb-ease), color var(--yb-duration) ease;
}

.yb-post__content :is(p, li, td, figcaption) a:hover,
.yb-post__content :is(p, li, td, figcaption) a:focus-visible {
	color: var(--yb-marsala-dark);
	background-size: 100% 100%, 100% 1px;
	outline: none;
}

/* -------- списки -------- */

.yb-post .yb-post__content ul,
.yb-post .yb-post__content ol {
	/* Colibri добавляет спискам свой отступ слева. */
	margin-left: 0;
	padding-left: 0;
}

.yb-post__content ul {
	margin: 0 0 1.6em;
	padding: 0;
	list-style: none;
}

.yb-post__content ul > li {
	position: relative;
	margin: 0 0 0.55em;
	padding-left: 30px;
}

/* Маркер — фирменный знак (дуга и точка). Явный display: Colibri вешает на псевдоэлементы свой. */
.yb-post__content ul > li::before {
	content: "";
	display: block;
	position: absolute;
	left: 2px;
	top: 0.62em;
	width: 13px;
	height: 12px;
	background: var(--yb-marsala);
	-webkit-mask: url("../images/ornament.svg") center / contain no-repeat;
	mask: url("../images/ornament.svg") center / contain no-repeat;
}

/* Нумерованный список — шаги: курсивные «01, 02» и волосяные разделители. */
.yb-post__content ol {
	margin: 0.4em 0 1.8em;
	padding: 0;
	list-style: none;
	counter-reset: yb-step;
}

.yb-post__content ol > li {
	position: relative;
	counter-increment: yb-step;
	padding: 0.9em 0 0.9em 58px;
	border-top: 1px solid var(--yb-paper-line);
}

.yb-post__content ol > li:last-child {
	border-bottom: 1px solid var(--yb-paper-line);
}

.yb-post__content ol > li::before {
	content: counter(yb-step, decimal-leading-zero);
	display: block;
	position: absolute;
	left: 0;
	top: 0.62em;
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-weight: 300;
	font-size: 30px;
	line-height: 1;
	font-variant-numeric: lining-nums;
	color: var(--yb-marsala);
}

/* -------- изображения и подписи -------- */

.yb-post .yb-post__content figure {
	margin: 2.6em 0;
}

.yb-post__content .wp-block-image img {
	display: block;
	width: 100%;
	height: auto;
}

/* Обычное (не широкое) фото в колонке — не шире 520px, чтобы вертикальный кадр не занимал весь экран. */
.yb-post .yb-post__content > .wp-block-image:not(.alignwide):not(.alignfull) {
	max-width: 520px;
}

/* Широкое фото выходит в правое поле и получает смещённую тонкую рамку — как подложки на главной. */
.yb-post .yb-post__content .alignwide {
	width: auto;
	max-width: none;
	margin-left: calc(-1 * var(--yb-bleed));
}

.yb-post__content .wp-block-image.alignwide img {
	box-shadow: -18px 18px 0 -1px var(--yb-paper), -18px 18px 0 0 var(--yb-frame);
}

/* Подпись: «Fig. 01 —» капителью и курсив антиквы. */
.yb-post__content figcaption,
.yb-post__content .wp-element-caption {
	display: block;
	margin: 26px 0 0;
	padding: 0;
	max-width: 560px;
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-weight: 300;
	font-size: var(--yb-fs-lg);
	line-height: 1.45;
	color: var(--yb-paper-muted);
	text-align: left;
}

.yb-post__content :is(.wp-block-image, .wp-block-gallery) > figcaption::before {
	counter-increment: yb-fig;
	content: "Fig. " counter(yb-fig, decimal-leading-zero) " —";
	/* Colibri ставит псевдоэлементам display: table — подпись разваливается в столбик. */
	display: inline;
	width: auto;
	margin-right: 10px;
	font-family: var(--yb-font-body);
	font-style: normal;
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-button);
	text-transform: uppercase;
	color: var(--yb-marsala);
}

/* Пара фото «лесенкой»: второе ниже первого — журнальный ритм. */
.yb-post__content .wp-block-gallery.has-nested-images:not(.yb-bento) {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 28px;
	align-items: start;
}

.yb-post .yb-post__content .wp-block-gallery.has-nested-images figure.wp-block-image {
	width: auto !important;
	margin: 0;
}

.yb-post .yb-post__content .wp-block-gallery.has-nested-images:not(.yb-bento) figure.wp-block-image:not(#individual-image):nth-of-type(2) {
	/* :not(#…) — тот же приём, что у стилей галереи WordPress, иначе их отступ главнее. */
	margin-top: 72px;
}

.yb-post__content .wp-block-gallery.has-nested-images:not(.yb-bento) figure.wp-block-image img {
	aspect-ratio: 3 / 4;
	height: auto;
	object-fit: cover;
	transition: transform 1.2s var(--yb-ease);
}

.yb-post__content .wp-block-gallery.has-nested-images figure.wp-block-image {
	overflow: hidden;
}

.yb-post__content .wp-block-gallery.has-nested-images figure.wp-block-image:hover img {
	transform: scale(1.03);
}

.yb-post .yb-post__content .wp-block-gallery.has-nested-images > .blocks-gallery-caption {
	grid-column: 1 / -1;
	margin: 26px 0 0;
	padding: 0;
	text-align: left;
}

/* -------- бенто-галерея (класс yb-bento у блока «Галерея») -------- */

/* Журнальный коллаж: 6 колонок, у каждой из 10 плиток своё место — крупная, вертикальные, широкие.
 * Наведение: фото чуть крупнее, снизу выезжает номер и подпись, соседние плитки приглушаются.
 * Клик — полноэкранный просмотр (fancybox, атрибуты ставит post.js). */
.yb-post .yb-post__content .wp-block-gallery.yb-bento {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	grid-auto-rows: 92px;
	gap: 10px;
	margin-top: 2.4em;
	margin-bottom: 2.8em;
	counter-reset: yb-tile;
}

.yb-post .yb-post__content .yb-bento figure.wp-block-image:not(#individual-image) {
	position: relative;
	width: auto !important;
	height: auto;
	margin: 0;
	overflow: hidden;
	counter-increment: yb-tile;
	background: var(--yb-ink);
}

.yb-post .yb-post__content .yb-bento figure.wp-block-image:not(#individual-image) a {
	display: block;
	width: 100%;
	height: 100%;
	padding: 0;
	background: none;
	cursor: zoom-in;
}

.yb-post .yb-post__content .yb-bento figure.wp-block-image:not(#individual-image) img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 1.1s var(--yb-ease), opacity 0.5s ease, filter 0.5s ease;
}

/* Раскладка 10 плиток на сетке 6 × 12 рядов — без дыр. */
.yb-bento > figure:nth-of-type(1)  { grid-area: 1 / 1 / 5 / 5; }
.yb-bento > figure:nth-of-type(2)  { grid-area: 1 / 5 / 3 / 7; }
.yb-bento > figure:nth-of-type(3)  { grid-area: 3 / 5 / 7 / 7; }
.yb-bento > figure:nth-of-type(4)  { grid-area: 5 / 1 / 7 / 3; }
.yb-bento > figure:nth-of-type(5)  { grid-area: 5 / 3 / 9 / 5; }
.yb-bento > figure:nth-of-type(6)  { grid-area: 7 / 1 / 11 / 3; }
.yb-bento > figure:nth-of-type(7)  { grid-area: 7 / 5 / 9 / 7; }
.yb-bento > figure:nth-of-type(8)  { grid-area: 9 / 3 / 11 / 7; }
.yb-bento > figure:nth-of-type(9)  { grid-area: 11 / 1 / 13 / 4; }
.yb-bento > figure:nth-of-type(10) { grid-area: 11 / 4 / 13 / 7; }

/* Подпись плитки: номер капителью и курсив — выезжает снизу на тёмном градиенте. */
.yb-post .yb-post__content .yb-bento figure.wp-block-image:not(#individual-image) figcaption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	max-width: none;
	margin: 0;
	padding: 48px 18px 16px;
	background: linear-gradient(to top, rgba(28, 32, 40, 0.86), rgba(28, 32, 40, 0));
	color: var(--yb-on-dark);
	font-size: var(--yb-fs-md);
	line-height: 1.35;
	pointer-events: none;
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.4s ease, transform 0.5s var(--yb-ease);
}

.yb-post .yb-post__content .yb-bento figure.wp-block-image:not(#individual-image) figcaption::before {
	counter-increment: none;
	content: counter(yb-tile, decimal-leading-zero);
	display: block;
	margin: 0 0 4px;
	font-family: var(--yb-font-body);
	font-style: normal;
	font-size: var(--yb-fs-micro);
	font-weight: 600;
	letter-spacing: var(--yb-track-caps);
	color: var(--yb-marsala-text);
}

.yb-bento figure:hover img,
.yb-bento figure:focus-within img {
	transform: scale(1.05);
}

.yb-post .yb-post__content .yb-bento figure.wp-block-image:not(#individual-image):is(:hover, :focus-within) figcaption {
	opacity: 1;
	transform: none;
}

/* Соседи приглушаются — выбранная плитка в фокусе. */
@media (hover: hover) {
	.yb-bento:hover figure:not(:hover) img {
		opacity: 0.55;
	}
}

.yb-post .yb-post__content .yb-bento figure.wp-block-image:not(#individual-image) a:focus-visible {
	outline: 2px solid var(--yb-marsala-text);
	outline-offset: -6px;
}

/* Подпись всей галереи — строкой под коллажем. */
.yb-post .yb-post__content .wp-block-gallery.yb-bento > .blocks-gallery-caption {
	grid-column: 1 / -1;
	grid-row: 13;
	margin: 14px 0 0;
	padding: 0;
	text-align: left;
}

/* Полноэкранный просмотр (fancybox): фон — фирменный тёмный, подпись — курсивом по центру. */
.single-post .fancybox-bg {
	background: var(--yb-ink);
}

.single-post .fancybox-is-open .fancybox-bg {
	opacity: 0.96;
}

.single-post .fancybox-caption {
	background: none;
	padding: 18px 24px 26px;
	text-align: center;
}

.single-post .fancybox-caption__body {
	max-width: 640px;
	margin: 0 auto;
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-weight: 300;
	font-size: 20px;
	line-height: 1.4;
	color: rgba(255, 255, 255, 0.86);
}

.single-post .fancybox-infobar {
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-size: var(--yb-fs-lg);
	color: var(--yb-marsala-text);
}

/* -------- цитаты -------- */

/* Выносная цитата: курсив антиквы крупно, огромная кавычка марсалой, линии сверху и снизу. */
.yb-post .yb-post__content .wp-block-pullquote {
	position: relative;
	margin: 3.2em 0 3.2em calc(-1 * var(--yb-bleed));
	padding: 56px 0 40px;
	border: 0;
	border-top: 1px solid var(--yb-ink-text);
	border-bottom: 1px solid var(--yb-paper-line);
	text-align: left;
}

.yb-post__content .wp-block-pullquote::before {
	content: "\201C";
	display: block;
	position: absolute;
	top: -0.02em;
	left: -0.06em;
	font-family: var(--yb-font-display);
	font-size: 220px;
	line-height: 1;
	color: color-mix(in srgb, var(--yb-marsala) 16%, transparent);
	pointer-events: none;
}

.yb-post__content .wp-block-pullquote blockquote {
	margin: 0;
	padding: 0;
}

.yb-post__content .wp-block-pullquote p {
	position: relative;
	margin: 0;
	max-width: 760px;
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(28px, 3vw, 40px);
	line-height: 1.25;
	color: var(--yb-ink-text);
}

.yb-post__content .wp-block-pullquote cite,
.yb-post__content .wp-block-quote cite {
	display: block;
	margin-top: 22px;
	font-family: var(--yb-font-body);
	font-style: normal;
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-caps);
	text-transform: uppercase;
	color: var(--yb-marsala);
}

.yb-post__content .wp-block-pullquote cite::before {
	content: "— ";
}

/* Обычная цитата — тише: черта слева и курсив. */
.yb-post__content .wp-block-quote {
	margin: 2.4em 0;
	padding: 4px 0 4px 28px;
	border-left: 2px solid var(--yb-marsala);
}

.yb-post__content .wp-block-quote p {
	margin: 0;
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-weight: 300;
	font-size: 28px;
	line-height: 1.35;
	color: var(--yb-ink-text);
}

/* -------- заметка мастера -------- */

.yb-post__content .yb-note {
	position: relative;
	margin: 2.6em 0;
	padding: 30px 34px 30px;
	background: var(--yb-paper-raised);
	border: 1px solid var(--yb-paper-line);
	border-left: 2px solid var(--yb-marsala);
}

.yb-post__content .yb-note::before {
	content: "Nota da Yana";
	display: block;
	width: auto;
	margin-bottom: 12px;
	padding-left: 22px;
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-caps);
	text-transform: uppercase;
	color: var(--yb-marsala);
	/* Знак — встроенный SVG цвета марсалы (фон нельзя перекрасить через currentColor). */
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='115 127 282 232' fill='%23843f3f'%3E%3Cpath d='M395.626 197.88C396.529 204.33 397 210.92 397 217.62C397 295.492 333.872 358.62 256 358.62C178.128 358.62 115 295.492 115 217.62C115 210.921 115.468 204.33 116.371 197.88C125.972 266.407 184.827 319.14 256 319.14C327.173 319.14 386.025 266.407 395.626 197.88Z'/%3E%3Cpath d='M275.74 127.38C253.18 147.12 216.52 189.42 216.52 245.82C216.52 267.534 234.286 285.3 256 285.3C277.714 285.3 295.48 267.534 295.48 245.82C295.48 220.44 271.51 207.75 271.51 180.96C271.51 158.4 287.02 144.3 275.74 127.38Z'/%3E%3C/svg%3E") 0 50% / 13px 12px no-repeat;
}

.yb-post__content .yb-note p {
	margin: 0;
	font-size: var(--yb-fs-lg);
}

/* -------- таблица -------- */

.yb-post .yb-post__content .wp-block-table {
	margin: 2.8em 0 2.8em calc(-1 * var(--yb-bleed));
	overflow: visible;
}

.yb-post__content .wp-block-table table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	font-size: var(--yb-fs-base);
	line-height: 1.45;
}

.yb-post__content .wp-block-table :is(th, td) {
	border: 0;
	padding: 16px 18px 16px 0;
	text-align: left;
	vertical-align: top;
}

.yb-post__content .wp-block-table thead th {
	padding-bottom: 14px;
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-button);
	text-transform: uppercase;
	color: var(--yb-paper-muted);
	border-bottom: 1px solid var(--yb-ink-text);
	white-space: nowrap;
}

.yb-post__content .wp-block-table tbody td {
	color: var(--yb-paper-muted);
	border-bottom: 1px solid var(--yb-paper-line);
	background: var(--yb-paper);
	transition: background-color 0.25s ease, color 0.25s ease, padding 0.35s var(--yb-ease), box-shadow 0.25s ease;
}

/* Название — антиквой, цена — справа, табличными цифрами. */
.yb-post__content .wp-block-table tbody td:first-child {
	padding-left: 14px;
	font-family: var(--yb-font-display);
	font-size: var(--yb-fs-xl);
	line-height: 1.2;
	color: var(--yb-ink-text);
}

.yb-post__content .wp-block-table thead th:first-child {
	padding-left: 14px;
}

.yb-post__content .wp-block-table :is(th, td):last-child {
	padding-right: 14px;
	text-align: right;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.yb-post__content .wp-block-table tbody td:last-child {
	font-weight: 500;
	color: var(--yb-ink-text);
}

/* Наведение: строка светлеет, слева — черта марсалой, название чуть сдвигается, цена окрашивается. */
.yb-post__content .wp-block-table tbody tr:hover td {
	background: var(--yb-paper-raised);
	color: var(--yb-ink-text);
}

.yb-post__content .wp-block-table tbody tr:hover td:first-child {
	padding-left: 22px;
	box-shadow: inset 2px 0 0 var(--yb-marsala);
}

.yb-post__content .wp-block-table tbody tr:hover td:last-child {
	color: var(--yb-marsala);
}

.yb-post__content .wp-block-table figcaption {
	margin-top: 18px;
	font-size: var(--yb-fs-md);
}

/* -------- FAQ (details) -------- */

.yb-post__content .wp-block-details {
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--yb-paper-line);
}

.yb-post__content .wp-block-details:last-of-type {
	border-bottom: 1px solid var(--yb-paper-line);
}

.yb-post__content .wp-block-details + :not(.wp-block-details) {
	margin-top: 2em;
}

.yb-post__content .wp-block-details summary {
	position: relative;
	padding: 22px 56px 22px 0;
	list-style: none;
	cursor: pointer;
	font-family: var(--yb-font-display);
	font-size: var(--yb-fs-2xl);
	line-height: 1.25;
	color: var(--yb-ink-text);
	transition: color var(--yb-duration) ease;
}

.yb-post__content .wp-block-details summary::-webkit-details-marker {
	display: none;
}

/* Плюс → минус. */
.yb-post__content .wp-block-details summary::after {
	content: "";
	display: block;
	position: absolute;
	right: 4px;
	top: 50%;
	width: 18px;
	height: 18px;
	margin-top: -9px;
	background:
		linear-gradient(var(--yb-marsala), var(--yb-marsala)) center / 100% 1.5px no-repeat,
		linear-gradient(var(--yb-marsala), var(--yb-marsala)) center / 1.5px 100% no-repeat;
	transition: transform 0.4s var(--yb-ease), background-size 0.4s var(--yb-ease);
}

.yb-post__content .wp-block-details[open] summary::after {
	transform: rotate(180deg);
	background-size: 100% 1.5px, 1.5px 0;
}

.yb-post__content .wp-block-details summary:hover {
	color: var(--yb-marsala);
}

.yb-post__content .wp-block-details summary:focus-visible {
	outline: 1px solid var(--yb-marsala);
	outline-offset: 4px;
}

.yb-post__content .wp-block-details > p {
	margin: 0 0 24px;
	padding-right: 56px;
	animation: yb-fade-up 0.45s var(--yb-ease);
}

@keyframes yb-fade-up {
	from {
		opacity: 0;
		transform: translateY(6px);
	}
}

/* -------- подвал записи: теги, «поделиться», автор -------- */

.yb-post__footer {
	margin-top: 72px;
}

.yb-post__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 28px;
	padding: 0;
	list-style: none;
}

.yb-post__tags li::before {
	display: none !important;
}

.yb-post .yb-post__tags a {
	display: inline-block;
	padding: 7px 14px;
	border: 1px solid var(--yb-paper-line);
	border-radius: 999px;
	font-size: var(--yb-fs-sm);
	color: var(--yb-paper-muted);
	text-decoration: none;
	transition: border-color var(--yb-duration) ease, color var(--yb-duration) ease;
}

.yb-post .yb-post__tags a:hover {
	border-color: var(--yb-marsala);
	color: var(--yb-marsala);
}

.yb-share {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 10px 22px;
	padding: 20px 0;
	border-top: 1px solid var(--yb-paper-line);
	border-bottom: 1px solid var(--yb-paper-line);
	font-size: var(--yb-fs-ui);
}

.yb-share__label {
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-caps);
	text-transform: uppercase;
	color: var(--yb-paper-muted);
}

.yb-post .yb-share a,
.yb-share__copy {
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	color: var(--yb-ink-text);
	text-decoration: none;
	border-bottom: 1px solid var(--yb-frame);
	cursor: pointer;
	transition: color var(--yb-duration) ease, border-color var(--yb-duration) ease;
}

.yb-post .yb-share a:hover,
.yb-share__copy:hover,
.yb-share__copy.is-copied {
	color: var(--yb-marsala);
	border-bottom-color: var(--yb-marsala);
}

/* Об авторе — тёмная карточка с регалиями (E-E-A-T: на них опираются поисковики и AI). */
.yb-post .yb-author {
	display: grid;
	grid-template-columns: 170px minmax(0, 1fr);
	gap: 40px;
	align-items: start;
	margin: 56px 0 0 calc(-1 * var(--yb-bleed));
	padding: 44px 44px 44px 40px;
	background: var(--yb-ink);
	color: var(--yb-white);
}

.yb-author__photo img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	box-shadow: -14px 14px 0 -1px var(--yb-ink), -14px 14px 0 0 color-mix(in srgb, var(--yb-marsala-text) 60%, transparent);
}

.yb-post .yb-post__content .yb-author :where(p) {
	/* :where — без специфичности, чтобы отступы имени и подписи ниже не перебивались. */
	margin: 0;
}

.yb-post .yb-post__content .yb-author__label {
	margin-bottom: 10px;
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-caps);
	text-transform: uppercase;
	color: var(--yb-marsala-text);
}

.yb-post .yb-post__content .yb-author__name {
	margin-bottom: 14px;
	font-family: var(--yb-font-display);
	font-size: 40px;
	line-height: 1.05;
	color: var(--yb-white);
}

.yb-post .yb-post__content .yb-author__bio {
	font-size: var(--yb-fs-md);
	line-height: 1.65;
	color: var(--yb-on-dark-soft);
}

.yb-post .yb-post__content ul.yb-author__creds {
	margin: 22px 0 26px;
	padding: 0;
	list-style: none;
}

.yb-post .yb-post__content .yb-author__creds li {
	display: grid;
	grid-template-columns: 72px minmax(0, 1fr);
	align-items: baseline;
	margin: 0;
	padding: 11px 0;
	border-top: 1px solid var(--yb-line-soft);
	font-size: var(--yb-fs-ui);
	line-height: 1.45;
	color: var(--yb-on-dark-soft);
}

.yb-post .yb-post__content .yb-author__creds li::before {
	display: none;
}

.yb-author__creds span {
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-weight: 300;
	font-size: var(--yb-fs-xl);
	line-height: 1;
	font-variant-numeric: lining-nums;
	color: var(--yb-marsala-text);
}

.yb-post .yb-post__content .yb-author__links {
	display: flex;
	gap: 28px;
}

.yb-post .yb-post__content .yb-author__links a {
	padding: 0 0 4px;
	background: none;
	font-size: var(--yb-fs-xs);
	font-weight: 600;
	letter-spacing: var(--yb-track-button);
	text-transform: uppercase;
	color: var(--yb-marsala-text);
	text-decoration: none;
	border-bottom: 1px solid color-mix(in srgb, var(--yb-marsala-text) 45%, transparent);
	transition: color var(--yb-duration) ease, border-color var(--yb-duration) ease;
}

.yb-post .yb-post__content .yb-author__links a:hover {
	color: var(--yb-white);
	border-bottom-color: var(--yb-white);
}

/* -------- «Sumário»: содержание как в журнале -------- */

.yb-post .yb-post__content .yb-summary {
	margin: 0.6em 0 3.4em calc(-1 * var(--yb-bleed));
	padding: 22px 0 30px;
	border-top: 2px solid var(--yb-ink-text);
	border-bottom: 1px solid var(--yb-paper-line);
}

.yb-summary__head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	margin-bottom: 26px;
}

.yb-post .yb-post__content .yb-summary__title {
	margin: 0;
	font-family: var(--yb-font-display);
	font-size: 44px;
	line-height: 1;
	color: var(--yb-ink-text);
}

.yb-summary__meta {
	margin-left: auto;
	text-align: right;
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-size: var(--yb-fs-lg);
	color: var(--yb-paper-muted);
}

/* Итог слева, главы справа; между ними — волосяная вертикаль. */
.yb-summary__grid {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: 0 48px;
}

.yb-summary__brief {
	padding-right: 48px;
	border-right: 1px solid var(--yb-paper-line);
	margin-right: -48px;
}

.yb-summary__grid > :only-child {
	grid-column: 1 / -1;
	padding-right: 0;
	border-right: 0;
	margin-right: 0;
}

.yb-post .yb-post__content .yb-summary__label {
	margin: 0 0 14px;
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-caps);
	text-transform: uppercase;
	color: var(--yb-marsala);
}

.yb-post .yb-post__content .yb-summary__points {
	margin: 0;
}

.yb-post .yb-post__content .yb-summary__points li {
	margin-bottom: 0.8em;
	font-size: var(--yb-fs-md);
	line-height: 1.6;
}

/* Главы: номер курсивом, название антиквой, отточие и минуты чтения — как в оглавлении журнала. */
.yb-post .yb-post__content .yb-summary__chapters ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

.yb-post .yb-post__content .yb-summary__chapters li {
	margin: 0;
	padding: 0;
	border: 0;
}

.yb-post .yb-post__content .yb-summary__chapters li::before {
	display: none;
}

.yb-post .yb-post__content .yb-summary__chapters a {
	display: grid;
	grid-template-columns: 44px auto minmax(24px, 1fr) auto;
	align-items: baseline;
	padding: 9px 0;
	background: none;
	color: var(--yb-ink-text);
	text-decoration: none;
}

.yb-summary__num {
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-weight: 300;
	font-size: var(--yb-fs-2xl);
	line-height: 1;
	font-variant-numeric: lining-nums;
	color: var(--yb-marsala);
}

.yb-summary__name {
	font-family: var(--yb-font-display);
	font-size: var(--yb-fs-xl);
	line-height: 1.25;
	transition: color var(--yb-duration) ease;
}

.yb-summary__dots {
	align-self: end;
	height: 1px;
	margin: 0 12px 7px;
	background: radial-gradient(circle, color-mix(in srgb, var(--yb-paper-muted) 60%, transparent) 0.8px, transparent 1.2px) 0 50% / 6px 1px repeat-x;
	transition: background 0.3s ease;
}

.yb-summary__min {
	font-size: var(--yb-fs-xs);
	letter-spacing: 0.06em;
	font-variant-numeric: tabular-nums;
	color: var(--yb-paper-muted);
	white-space: nowrap;
	transition: color var(--yb-duration) ease;
}

.yb-post .yb-post__content .yb-summary__chapters a:hover .yb-summary__name {
	color: var(--yb-marsala);
}

.yb-post .yb-post__content .yb-summary__chapters a:hover .yb-summary__dots {
	background: var(--yb-marsala);
}

.yb-post .yb-post__content .yb-summary__chapters a:hover .yb-summary__min {
	color: var(--yb-ink-text);
}

.yb-post .yb-post__content .yb-summary__chapters a:focus-visible {
	outline: 1px solid var(--yb-marsala);
	outline-offset: 2px;
}

/* «Atualizado a…» — свежесть видна сразу. */
.yb-post__updated {
	color: var(--yb-marsala-text);
}

/* -------- «Continue a ler» -------- */

.yb-related {
	padding: 96px 24px;
	border-top: 1px solid var(--yb-paper-line);
}

.yb-related__inner {
	max-width: 1232px;
	margin: 0 auto;
}

.yb-related__title {
	margin: 0 0 40px;
	font-family: var(--yb-font-display);
	font-size: clamp(36px, 4vw, 56px);
	font-weight: 400;
	line-height: 1;
	color: var(--yb-ink-text);
}

.yb-related__list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 32px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.yb-post .yb-related__card a {
	display: block;
	color: inherit;
	text-decoration: none;
}

.yb-related__media {
	display: block;
	overflow: hidden;
	aspect-ratio: 4 / 5;
	margin-bottom: 18px;
}

.yb-related__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: grayscale(1);
	transition: transform 1.2s var(--yb-ease), filter 0.6s ease;
}

.yb-related__card a:hover .yb-related__media img {
	transform: scale(1.04);
	filter: grayscale(0.4);
}

.yb-related__cat {
	display: block;
	margin-bottom: 8px;
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-caps);
	text-transform: uppercase;
	color: var(--yb-marsala);
}

.yb-related__name {
	display: block;
	font-family: var(--yb-font-display);
	font-size: var(--yb-fs-2xl);
	line-height: 1.2;
	color: var(--yb-ink-text);
	transition: color var(--yb-duration) ease;
}

.yb-related__card a:hover .yb-related__name {
	color: var(--yb-marsala);
}

/* -------- комментарии -------- */

.yb-comments {
	background: var(--yb-paper);
	color: var(--yb-ink-text);
	font-family: var(--yb-font-body);
	padding: 96px 24px 140px;
	border-top: 1px solid var(--yb-paper-line);
	text-align: left;
}

/* Та же сетка, что у текста: комментарии стоят в колонке статьи. */
.yb-comments__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, var(--yb-col, 680px)) var(--yb-toc, 240px);
	column-gap: 80px;
	/* 1280 минус поля тела записи — колонка встаёт ровно под текстом статьи. */
	max-width: 1232px;
	margin: 0 auto;
}

.yb-comments__inner > * {
	grid-column: 2;
}

.yb-comments__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 24px;
}

.yb-comments__title {
	margin: 0;
	font-family: var(--yb-font-display);
	font-size: clamp(38px, 4vw, 56px);
	font-weight: 400;
	line-height: 1;
	color: var(--yb-ink-text);
}

.yb-comments__count {
	font-family: var(--yb-font-accent);
	font-style: italic;
	font-size: 20px;
	color: var(--yb-paper-muted);
}

.yb-comments__list,
.yb-comments__list .children {
	margin: 0;
	padding: 0;
	list-style: none;
}

.yb-comment__card {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	gap: 18px;
	padding: 26px 0;
	border-top: 1px solid var(--yb-paper-line);
}

.yb-comment__avatar {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--yb-paper-raised);
	border: 1px solid var(--yb-paper-line);
	font-family: var(--yb-font-display);
	font-size: var(--yb-fs-lg);
	color: var(--yb-ink-text);
}

.yb-comment__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 25%;
	filter: grayscale(1);
}

.yb-comment__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	margin-bottom: 6px;
}

.yb-comment__name {
	font-size: var(--yb-fs-base);
	font-weight: 600;
	color: var(--yb-ink-text);
}

.yb-comment__badge {
	padding: 3px 9px;
	border-radius: 999px;
	background: var(--yb-marsala);
	color: var(--yb-white);
	font-size: var(--yb-fs-micro);
	font-weight: 600;
	letter-spacing: var(--yb-track-button);
	text-transform: uppercase;
}

.yb-comments .yb-comment__date {
	margin-left: auto;
	font-size: var(--yb-fs-label);
	letter-spacing: var(--yb-track-button);
	text-transform: uppercase;
	color: var(--yb-paper-muted);
	text-decoration: none;
}

.yb-comment__text p {
	margin: 0 0 0.6em;
	font-size: var(--yb-fs-md);
	line-height: 1.7;
	color: color-mix(in srgb, var(--yb-ink-text) 85%, transparent);
}

.yb-comment__pending {
	margin: 0 0 8px;
	font-size: var(--yb-fs-sm);
	font-style: italic;
	color: var(--yb-marsala);
}

.yb-comments .comment-reply-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-button);
	text-transform: uppercase;
	color: var(--yb-marsala);
	text-decoration: none;
}

.yb-comments .comment-reply-link::before {
	content: "\21B3";
	font-size: var(--yb-fs-ui);
	letter-spacing: 0;
}

.yb-comments .comment-reply-link:hover {
	color: var(--yb-ink-text);
}

/* Ответ автора — на светлой подложке с чертой марсалой. */
.yb-comment.is-author > .yb-comment__card {
	padding: 24px 24px 24px 22px;
	background: var(--yb-paper-raised);
	border-top-color: transparent;
	box-shadow: inset 2px 0 0 var(--yb-marsala);
}

/* Ветка: отступ и изогнутая линия-связка к родителю. */
.yb-comments__list .children {
	margin-left: 66px;
}

.yb-comments__list .children > .yb-comment {
	position: relative;
}

.yb-comments__list .children > .yb-comment::before {
	content: "";
	display: block;
	position: absolute;
	left: -42px;
	top: 0;
	width: 28px;
	height: 50px;
	border-left: 1px solid var(--yb-paper-line);
	border-bottom: 1px solid var(--yb-paper-line);
	border-bottom-left-radius: 14px;
}

.yb-comments__list .children .yb-comment__card {
	border-top: 0;
}

/* -------- форма -------- */

.yb-comments .comment-respond {
	margin-top: 56px;
	padding-top: 40px;
	border-top: 1px solid var(--yb-ink-text);
}

.yb-comments .yb-comment .comment-respond {
	margin: 8px 0 24px 66px;
	padding-top: 24px;
}

.yb-form__title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	margin: 0 0 8px;
	font-family: var(--yb-font-display);
	font-size: 34px;
	font-weight: 400;
	color: var(--yb-ink-text);
}

.yb-form__title small a {
	font-family: var(--yb-font-body);
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-button);
	text-transform: uppercase;
	color: var(--yb-paper-muted);
}

.yb-form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 32px;
}

.yb-form > * {
	grid-column: 1 / -1;
}

.yb-form > .yb-field:not(.yb-field--area) {
	grid-column: auto;
}

.yb-form__note,
.yb-form .logged-in-as {
	margin: 0 0 8px;
	font-size: var(--yb-fs-sm);
	color: var(--yb-paper-muted);
}

/* Поля «под линейку»: подпись лежит в поле и поднимается капителью при вводе. */
.yb-field {
	position: relative;
	margin: 18px 0 0;
}

.yb-field input,
.yb-field textarea {
	display: block;
	width: 100%;
	padding: 24px 0 10px;
	border: 0;
	border-bottom: 1px solid color-mix(in srgb, var(--yb-ink-text) 30%, transparent);
	border-radius: 0;
	background: transparent;
	font-family: var(--yb-font-body);
	font-size: var(--yb-fs-md);
	color: var(--yb-ink-text);
	transition: border-color var(--yb-duration) ease;
	resize: vertical;
}

.yb-field input:focus,
.yb-field textarea:focus {
	outline: none;
	border-bottom-color: var(--yb-marsala);
	box-shadow: 0 1px 0 0 var(--yb-marsala);
}

.yb-field label {
	position: absolute;
	left: 0;
	top: 24px;
	font-size: var(--yb-fs-md);
	color: var(--yb-paper-muted);
	pointer-events: none;
	transition: top 0.25s var(--yb-ease), font-size 0.25s var(--yb-ease), letter-spacing 0.25s ease, color 0.25s ease;
}

.yb-field input:focus + label,
.yb-field input:not(:placeholder-shown) + label,
.yb-field textarea:focus + label,
.yb-field textarea:not(:placeholder-shown) + label {
	top: 0;
	font-size: var(--yb-fs-label);
	font-weight: 600;
	letter-spacing: var(--yb-track-button);
	text-transform: uppercase;
	color: var(--yb-marsala);
}

.yb-check {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 24px 0 0;
	font-size: var(--yb-fs-ui);
	color: var(--yb-paper-muted);
}

.yb-check input {
	flex: none;
	width: 18px;
	height: 18px;
	margin: 2px 0 0;
	border: 1px solid color-mix(in srgb, var(--yb-ink-text) 40%, transparent);
	border-radius: 0;
	background: transparent;
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
	transition: background-color var(--yb-duration) ease, border-color var(--yb-duration) ease;
}

.yb-check input:checked {
	border-color: var(--yb-marsala);
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M4 9.5l3.2 3L14 5.5' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E") center / 100% no-repeat,
		var(--yb-marsala);
}

.yb-check input:focus-visible {
	outline: 1px solid var(--yb-marsala);
	outline-offset: 3px;
}

.yb-form .form-submit {
	margin: 32px 0 0;
}

.yb-form__submit {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	padding: 17px 30px;
	border: 0;
	border-radius: 0;
	background: var(--yb-ink);
	color: var(--yb-white);
	font-family: var(--yb-font-body);
	font-size: var(--yb-fs-xs);
	font-weight: 600;
	letter-spacing: var(--yb-track-button);
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color var(--yb-duration) ease;
}

.yb-form__submit span {
	font-size: var(--yb-fs-base);
	letter-spacing: 0;
	transition: transform var(--yb-duration) var(--yb-ease);
}

.yb-form__submit:hover {
	background: var(--yb-marsala);
}

.yb-form__submit:hover span {
	transform: translateX(4px);
}

.yb-form__submit:focus-visible {
	outline: 1px solid var(--yb-marsala);
	outline-offset: 4px;
}

/* -------- перебиваем Colibri -------- */

/* [class*="type-"].post ul/ol даёт всем спискам записи поля 1.5em — служебным спискам они не нужны. */
/* Тег в селекторе обязателен: у правила Colibri специфичность 0,2,1. */
.yb-post ol.yb-toc__list,
.yb-post ol.yb-tocsheet__list,
.yb-post ul.yb-post__tags,
.yb-post ul.yb-related__list,
.yb-post ol.yb-comments__list,
.yb-post .yb-comments__list ol.children {
	margin-left: 0;
	margin-right: 0;
	padding-left: 0;
}

.yb-post ul.yb-post__tags {
	margin-bottom: 28px;
}

.yb-post ol.yb-comments__list {
	margin-bottom: 0;
}

.yb-post .yb-comments__list ol.children {
	margin-left: 66px;
}

.yb-post .yb-post__tags li {
	margin: 0;
	padding: 0;
}

.yb-post .yb-post__tags li::before {
	display: none;
}

/* Теги и «поделиться» — свои стили ссылок, без подчёркивания из текста статьи. */
.yb-post .yb-post__content .yb-post__tags a,
.yb-post .yb-post__content .yb-author a {
	background: none;
	padding-left: 14px;
	padding-right: 14px;
}

.yb-post .yb-post__content .yb-author a {
	padding: 0 0 4px;
}

/* #colibri .comment-respond input/textarea — рамки и скругления со всех сторон. */
#colibri .yb-comments .yb-field input,
#colibri .yb-comments .yb-field textarea {
	height: auto;
	margin: 0;
	padding: 24px 0 10px;
	border: 0;
	border-bottom: 1px solid color-mix(in srgb, var(--yb-ink-text) 30%, transparent);
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	font-family: var(--yb-font-body);
	font-size: var(--yb-fs-md);
	line-height: 1.5;
	color: var(--yb-ink-text);
}

#colibri .yb-comments .yb-field input:focus,
#colibri .yb-comments .yb-field textarea:focus {
	border-width: 0 0 1px;
	border-bottom-color: var(--yb-marsala);
	box-shadow: 0 1px 0 0 var(--yb-marsala);
	outline: none;
}

#colibri .yb-comments .yb-check input {
	width: 18px;
	height: 18px;
	margin: 2px 0 0;
	padding: 0;
	border: 1px solid color-mix(in srgb, var(--yb-ink-text) 40%, transparent);
	border-radius: 0;
	background-color: transparent;
	box-shadow: none;
}

#colibri .yb-comments .yb-check input:checked {
	border-color: var(--yb-marsala);
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M4 9.5l3.2 3L14 5.5' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E") center / 100% no-repeat,
		var(--yb-marsala);
}

/* -------- адаптив -------- */

/* Узкий десктоп: колонки чуть уже, вылет в левое поле меньше. */
@media (max-width: 1280px) {
	.yb-post {
		--yb-col: 600px;
		--yb-toc: 200px;
		--yb-gap: 48px;
	}

	.yb-post__content {
		--yb-bleed: min(160px, max(0px, calc(100vw - 896px - 16px)));
	}

	.yb-comments__inner {
		column-gap: 48px;
	}
}

/* Без колонки оглавления: текст по центру, широкие элементы — на всю ширину колонки. */
@media (max-width: 1023px) {
	.yb-post__body,
	.yb-comments__inner {
		grid-template-columns: minmax(0, 1fr);
		max-width: calc(680px + 48px);
	}

	.yb-post__content,
	.yb-comments__inner > * {
		grid-column: 1;
	}

	.yb-post__content {
		--yb-bleed: 0px;
	}

	.yb-toc {
		display: none;
	}

	/* Липкая плашка «Índice»: появляется, когда обложка ушла. */
	.yb-tocbar {
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: calc(var(--yb-z-header) + 1);
		transform: translateY(-110%);
		transition: transform 0.45s var(--yb-ease);
	}

	.yb-tocbar.is-visible {
		transform: none;
	}

	.yb-tocbar__btn {
		display: grid;
		grid-template-columns: auto auto minmax(0, 1fr) 14px;
		align-items: center;
		gap: 12px;
		width: 100%;
		padding: 14px 20px 13px;
		border: 0;
		border-bottom: 1px solid var(--yb-paper-line);
		background: color-mix(in srgb, var(--yb-paper) 92%, transparent);
		-webkit-backdrop-filter: blur(12px);
		backdrop-filter: blur(12px);
		color: var(--yb-ink-text);
		font-family: var(--yb-font-body);
		text-align: left;
		cursor: pointer;
	}

	.yb-tocbar__label {
		font-size: var(--yb-fs-label);
		font-weight: 600;
		letter-spacing: var(--yb-track-caps);
		text-transform: uppercase;
		color: var(--yb-marsala);
	}

	.yb-tocbar__count {
		font-family: var(--yb-font-accent);
		font-style: italic;
		font-size: var(--yb-fs-lg);
		font-variant-numeric: lining-nums;
		color: var(--yb-paper-muted);
	}

	.yb-tocbar__title {
		overflow: hidden;
		font-size: var(--yb-fs-ui);
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.yb-tocbar__icon {
		width: 14px;
		height: 10px;
		background:
			linear-gradient(currentColor, currentColor) 0 0 / 100% 1.5px no-repeat,
			linear-gradient(currentColor, currentColor) 0 50% / 70% 1.5px no-repeat,
			linear-gradient(currentColor, currentColor) 0 100% / 100% 1.5px no-repeat;
	}

	/* Панель выезжает слева, фон темнеет. */
	.yb-tocsheet {
		position: fixed;
		inset: 0;
		z-index: calc(var(--yb-z-header) + 3);
		background: rgba(28, 32, 40, 0);
		transition: background-color 0.4s ease;
	}

	.yb-tocsheet.is-open {
		background: rgba(28, 32, 40, 0.5);
	}

	.yb-tocsheet__panel {
		width: min(86vw, 380px);
		height: 100%;
		overflow-y: auto;
		padding: 28px 28px 40px;
		background: var(--yb-paper);
		transform: translateX(-100%);
		transition: transform 0.5s var(--yb-ease);
	}

	.yb-tocsheet.is-open .yb-tocsheet__panel {
		transform: none;
	}

	.yb-tocsheet__head {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 12px;
	}

	.yb-tocsheet__label {
		margin: 0;
	}

	.yb-tocsheet__close {
		position: relative;
		width: 36px;
		height: 36px;
		border: 0;
		background: none;
		cursor: pointer;
	}

	.yb-tocsheet__close::before,
	.yb-tocsheet__close::after {
		content: "";
		display: block;
		position: absolute;
		left: 9px;
		top: 17px;
		width: 18px;
		height: 1.5px;
		background: var(--yb-ink-text);
		transform: rotate(45deg);
	}

	.yb-tocsheet__close::after {
		transform: rotate(-45deg);
	}

	.yb-tocsheet__list .yb-toc__link {
		grid-template-columns: 40px minmax(0, 1fr);
		padding: 16px 0;
		border-bottom: 1px solid var(--yb-paper-line);
	}

	.yb-tocsheet__list .yb-toc__num {
		font-size: var(--yb-fs-xl);
	}

	.yb-tocsheet__list .yb-toc__text {
		font-family: var(--yb-font-display);
		font-size: var(--yb-fs-xl);
		line-height: 1.2;
	}

	.yb-tocsheet__time {
		margin: 20px 0 0;
		font-size: var(--yb-fs-sm);
		color: var(--yb-paper-muted);
	}

	.yb-post__content h2 {
		scroll-margin-top: 80px;
	}
}

@media (max-width: 900px) {
	.yb-post__cover {
		padding-bottom: 140px;
	}

	.yb-post__cover {
		padding-top: 120px;
	}

	.yb-post .yb-post__hero {
		margin-top: -110px;
		padding: 0 16px;
	}

	.yb-post__hero img {
		aspect-ratio: 4 / 3;
	}

	.yb-post__body {
		padding: 64px 20px 88px;
	}

	.yb-post__content p,
	.yb-post__content li {
		font-size: var(--yb-fs-lg);
	}

	.yb-post__content .wp-block-pullquote::before {
		font-size: 150px;
	}

	.yb-summary__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 28px;
	}

	.yb-summary__brief {
		margin-right: 0;
		padding-right: 0;
		border-right: 0;
	}

	.yb-post .yb-post__content .yb-summary__title {
		font-size: 36px;
	}

	.yb-summary__meta {
		font-size: var(--yb-fs-md);
	}

	/* Таблица листается вбок: первая колонка залипает, тени по краям подсказывают прокрутку. */
	.yb-post .yb-post__content .wp-block-table {
		margin-right: -20px;
		margin-left: -20px;
	}

	.yb-post__content .wp-block-table table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		padding: 0 20px;
		background:
			linear-gradient(to right, var(--yb-paper) 40%, transparent) left / 48px 100% no-repeat local,
			linear-gradient(to left, var(--yb-paper) 40%, transparent) right / 48px 100% no-repeat local,
			radial-gradient(farthest-side at 0 50%, rgba(28, 32, 40, 0.16), transparent) left / 14px 100% no-repeat scroll,
			radial-gradient(farthest-side at 100% 50%, rgba(28, 32, 40, 0.16), transparent) right / 14px 100% no-repeat scroll;
	}

	.yb-post__content .wp-block-table :is(th, td) {
		min-width: 150px;
	}

	.yb-post__content .wp-block-table :is(th, td):first-child {
		position: sticky;
		left: -20px;
		z-index: 1;
		min-width: 160px;
		box-shadow: 1px 0 0 var(--yb-paper-line);
	}

	.yb-post__content .wp-block-table thead th:first-child {
		background: var(--yb-paper);
	}

	.yb-post__content .wp-block-table figcaption {
		padding: 0 20px;
	}

	.yb-post__content .wp-block-table figcaption::after {
		content: "  ·  Deslize para ver a tabela →";
		font-family: var(--yb-font-body);
		font-style: normal;
		font-size: var(--yb-fs-label);
		letter-spacing: var(--yb-track-button);
		text-transform: uppercase;
		color: var(--yb-marsala);
	}

	.yb-related__list {
		grid-template-columns: minmax(0, 1fr);
		gap: 40px;
	}

	.yb-related {
		padding: 72px 20px;
	}

	.yb-comments {
		padding: 72px 20px 120px;
	}

	.yb-comments .yb-comment .comment-respond {
		margin-left: 0;
	}
}

@media (max-width: 700px) {
	.yb-post .yb-post__content .wp-block-gallery.yb-bento {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-auto-rows: 120px;
		grid-auto-flow: dense;
		gap: 8px;
		margin-left: -20px;
		margin-right: -20px;
	}

	.yb-bento > figure:nth-of-type(n) {
		grid-area: auto / auto / span 2 / span 1;
	}

	/* Широкие акценты — во всю ширину. */
	.yb-bento > figure:nth-of-type(1),
	.yb-bento > figure:nth-of-type(8) {
		grid-area: auto / auto / span 2 / span 2;
	}

	.yb-bento > figure:nth-of-type(4),
	.yb-bento > figure:nth-of-type(7) {
		grid-area: auto / auto / span 1 / span 1;
	}

	.yb-post .yb-post__content .wp-block-gallery.yb-bento > .blocks-gallery-caption {
		grid-row: auto;
		padding: 0 20px;
	}

	/* На тач-экранах подписи видны сразу у крупных плиток. */
	.yb-post .yb-post__content .yb-bento > figure:is(:nth-of-type(1), :nth-of-type(8)) figcaption {
		opacity: 1;
		transform: none;
	}
}

@media (max-width: 700px) {
	.yb-post__content .wp-block-gallery.has-nested-images {
		gap: 0 14px;
	}

	.yb-post .yb-post__content .wp-block-gallery.has-nested-images:not(.yb-bento) figure.wp-block-image:not(#individual-image):nth-of-type(2) {
		margin-top: 40px;
	}

	.yb-post__content .yb-note {
		padding: 24px 22px;
	}

	.yb-post .yb-author {
		grid-template-columns: 96px minmax(0, 1fr);
		gap: 22px;
		margin-left: -20px;
		margin-right: -20px;
		padding: 32px 20px;
	}

	.yb-post .yb-post__content .yb-author__name {
		font-size: 30px;
	}

	.yb-post .yb-post__content .yb-author__creds li {
		grid-template-columns: 60px minmax(0, 1fr);
	}

	.yb-post .yb-post__content .yb-author__links {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
	}

	.yb-form {
		grid-template-columns: minmax(0, 1fr);
	}

	.yb-form > .yb-field:not(.yb-field--area) {
		grid-column: 1;
	}

	.yb-post .yb-comments__list ol.children {
		margin-left: 28px;
	}

	.yb-comments__list .children > .yb-comment::before {
		left: -22px;
		width: 14px;
	}

	.yb-comment.is-author > .yb-comment__card {
		padding: 18px 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.yb-sharepop__menu,
	.yb-toc,
	.yb-tocbar,
	.yb-tocsheet,
	.yb-tocsheet__panel,
	.yb-post__content * {
		transition: none !important;
		animation: none !important;
	}
}
