/*
 * The templates Elementor does not build: articles (archive and single), search, 404 and plain pages.
 * Loaded only there (inc/content.php). Same tokens, same light, same pills as the Elementor pages.
 */

/* ---------------------------------------------------------------- page head */

.esb-page-hero {
	position: relative;
	margin-block-start: calc(-1 * (var(--esb-header-h) + 12px));
	padding: calc(var(--esb-header-h) + 12px + clamp(2.25rem, 1.6rem + 2.6vw, 4rem)) var(--esb-gutter) clamp(2.25rem, 1.6rem + 2.6vw, 3.5rem);
	background:
		radial-gradient(40% 70% at 88% 0%, rgb(14 110 88 / 0.1), transparent 70%),
		radial-gradient(36% 60% at 8% 0%, rgb(37 99 214 / 0.08), transparent 70%),
		linear-gradient(180deg, #fff, var(--esb-mist));
	border-block-end: 1px solid var(--esb-line);
}
.esb-page-hero__inner { display: grid; gap: 14px; max-inline-size: var(--esb-container); margin-inline: auto; }
.esb-page-hero--page .esb-page-hero__inner,
.esb-page-hero--search .esb-page-hero__inner { max-inline-size: 48rem; }
.esb-page-hero__eyebrow { margin: 6px 0 0; }
.esb-page-hero__title { color: var(--esb-ink); font-size: var(--esb-text-h2); line-height: var(--esb-leading-h2); }
.esb-page-hero__lead { margin: 0; max-inline-size: 44rem; color: var(--esb-ink-2); font-size: var(--esb-text-lead); line-height: 1.95; }
.esb-page-hero__meta { margin: 0; color: var(--esb-ink-3); font-size: var(--esb-text-small); }
.esb-page-hero__tools { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin-block-start: 8px; }

/* ---------------------------------------------------------------- search form and chips */

.esb-searchform {
	display: flex;
	align-items: center;
	gap: 8px;
	max-inline-size: 36rem;
	padding: 5px;
	padding-inline-start: 16px;
	border: 1px solid var(--esb-line-2);
	border-radius: var(--esb-radius-pill);
	background: #fff;
	box-shadow: var(--esb-shadow-s);
}
.esb-searchform:focus-within { border-color: var(--esb-green); box-shadow: var(--esb-ring); }
.esb-searchform__icon { color: var(--esb-ink-3); inline-size: 20px; block-size: 20px; }
.esb-searchform__input { flex: 1; inline-size: 0; min-inline-size: 0; block-size: 44px; border: 0; background: none; color: var(--esb-ink); font: 400 1rem var(--esb-font); outline: none; }
.esb-searchform__input::-webkit-search-cancel-button { display: none; }
.esb-searchform__submit { block-size: 44px; padding-inline: 20px; border: 0; border-radius: var(--esb-radius-pill); background: var(--esb-green); color: #fff; font: 600 0.9375rem var(--esb-font); cursor: pointer; }
.esb-searchform__submit:hover { background: var(--esb-green-deep); }

.esb-chipnav ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.esb-chipnav li a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 14px;
	border: 1px solid var(--esb-line);
	border-radius: var(--esb-radius-pill);
	background: #fff;
	color: var(--esb-ink-2);
	font-size: var(--esb-text-small);
	font-weight: 500;
	text-decoration: none;
	transition: border-color var(--esb-fast) var(--esb-ease), color var(--esb-fast) var(--esb-ease);
}
.esb-chipnav li a span { color: var(--esb-ink-3); font-size: 0.75rem; }
.esb-chipnav li a:hover { border-color: var(--hue, var(--esb-green)); color: var(--esb-ink); }
.esb-chipnav li a[aria-current="page"] { border-color: var(--esb-green); background: var(--esb-green); color: #fff; }
.esb-chipnav li a[aria-current="page"] span { color: rgb(255 255 255 / 0.8); }

/* ---------------------------------------------------------------- sections and cards */

.esb-content-section {
	max-inline-size: var(--esb-container);
	margin-inline: auto;
	padding: clamp(2.5rem, 1.8rem + 3vw, 4.5rem) var(--esb-gutter);
	box-sizing: content-box;
}
.esb-content-section--narrow { max-inline-size: var(--esb-measure); }

.esb-cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
}
.esb-cards + .esb-cards { margin-block-start: 18px; }
.esb-cards--feature { grid-template-columns: 1fr; }
.esb-card {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--esb-line);
	border-radius: var(--esb-radius-m);
	background: #fff;
	transition: box-shadow var(--esb-mid) var(--esb-ease), transform var(--esb-mid) var(--esb-ease);
}
.esb-card:hover { box-shadow: var(--esb-shadow-m); transform: translateY(-3px); }
.esb-card:has(a:focus-visible) { box-shadow: var(--esb-ring); }
.esb-card__media { aspect-ratio: 16 / 10; overflow: hidden; background: var(--hue-soft); }
.esb-card__img { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; transition: transform var(--esb-slow) var(--esb-ease); }
.esb-card:hover .esb-card__img { transform: scale(1.03); }
.esb-card__placeholder { display: grid; place-items: center; block-size: 100%; color: var(--hue); }
.esb-card__placeholder .esb-cube { inline-size: 56px; block-size: 56px; }
.esb-card__body { display: grid; gap: 8px; align-content: start; padding: 16px 18px 20px; }
.esb-card__meta { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 0; color: var(--esb-ink-3); font-size: var(--esb-text-tiny); }
.esb-card__cat { color: var(--hue-ink); font-weight: 700; }
.esb-card__title { color: var(--esb-ink); font-size: 1.0625rem; line-height: 1.65; }
.esb-card .esb-card__title a { color: inherit; text-decoration: none; }
.esb-card__title a::after { content: ""; position: absolute; inset: 0; }
.esb-card__title a:focus-visible { outline: none; }
.esb-card__excerpt { margin: 0; color: var(--esb-ink-3); font-size: var(--esb-text-small); line-height: 1.85; }
.esb-card__more { display: inline-flex; color: var(--esb-green); font-size: var(--esb-text-small); font-weight: 600; }

.esb-card--feature { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); }
.esb-card--feature .esb-card__media { aspect-ratio: auto; min-block-size: 300px; }
.esb-card--feature .esb-card__body { align-content: center; gap: 12px; padding: clamp(20px, 3vw, 40px); }
.esb-card--feature .esb-card__title { font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.6rem); line-height: 1.55; }
.esb-card--feature .esb-card__excerpt { font-size: var(--esb-text-card); }

@media (max-width: 1024px) {
	.esb-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
	.esb-cards { grid-template-columns: 1fr; }
	.esb-card--feature { grid-template-columns: 1fr; }
	.esb-card--feature .esb-card__media { min-block-size: 0; aspect-ratio: 16 / 10; }
}

.esb-pages ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 36px 0 0; padding: 0; list-style: none; }
.esb-pages li a,
.esb-pages span {
	display: inline-grid;
	place-items: center;
	min-inline-size: 44px;
	block-size: 44px;
	padding-inline: 14px;
	border: 1px solid var(--esb-line);
	border-radius: var(--esb-radius-pill);
	background: #fff;
	color: var(--esb-ink-2);
	text-decoration: none;
}
.esb-pages li a:hover { border-color: var(--esb-green); color: var(--esb-green); }
.esb-pages .current { border-color: var(--esb-green); background: var(--esb-green); color: #fff; }
.esb-pages .dots { border: 0; background: none; }

.esb-empty { display: grid; justify-items: center; gap: 10px; padding: 48px 20px; border: 1px dashed var(--esb-line-2); border-radius: var(--esb-radius-l); text-align: center; }
.esb-empty__title { margin: 0; color: var(--esb-ink); font-size: 1.15rem; font-weight: 700; }
.esb-empty__text { margin: 0; max-inline-size: 34rem; color: var(--esb-ink-3); }
.esb-empty__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 8px 0 0; }

/* ---------------------------------------------------------------- search results */

.esb-results { max-inline-size: 48rem; }
.esb-results__group + .esb-results__group { margin-block-start: 40px; }
.esb-results__heading { margin-block-end: 14px; color: var(--esb-ink-3); font-size: var(--esb-text-small); font-weight: 700; }
.esb-results__list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.esb-result { position: relative; display: grid; gap: 4px; padding: 16px 18px; border: 1px solid var(--esb-line); border-radius: var(--esb-radius-m); background: #fff; transition: box-shadow var(--esb-mid) var(--esb-ease); }
.esb-result:hover { box-shadow: var(--esb-shadow-s); }
.esb-result--faq { background: var(--esb-green-wash); border-color: rgb(14 110 88 / 0.15); }
.esb-result__type { color: var(--esb-green-deep); font-size: 0.75rem; font-weight: 700; }
.esb-result__title { color: var(--esb-ink); font-size: 1.0625rem; line-height: 1.6; }
.esb-result .esb-result__title a { color: inherit; text-decoration: none; }
.esb-result__title a::after { content: ""; position: absolute; inset: 0; }
.esb-result__excerpt { margin: 0; color: var(--esb-ink-2); font-size: var(--esb-text-small); line-height: 1.85; }
.esb-result__meta { margin: 0; color: var(--esb-ink-3); font-size: var(--esb-text-tiny); }
.esb-result mark { background: #fdeeb8; color: inherit; border-radius: 3px; padding-inline: 1px; }

/* ---------------------------------------------------------------- 404 */

.esb-404 {
	margin-block-start: calc(-1 * (var(--esb-header-h) + 12px));
	padding: calc(var(--esb-header-h) + 12px + clamp(3rem, 2rem + 4vw, 6rem)) var(--esb-gutter) clamp(4rem, 3rem + 4vw, 7rem);
	background:
		radial-gradient(40% 50% at 50% 0%, rgb(14 110 88 / 0.12), transparent 70%),
		linear-gradient(180deg, #fff, var(--esb-mist));
}
.esb-404__inner { display: grid; justify-items: center; gap: 16px; max-inline-size: 46rem; margin-inline: auto; text-align: center; }
.esb-404__art { position: relative; display: grid; place-items: center; }
.esb-404__cube { inline-size: 120px; block-size: 120px; color: var(--esb-green); opacity: 0.18; }
.esb-404__code { position: absolute; color: var(--esb-green-deep); font-size: 3rem; font-weight: 800; }
.esb-404__title { color: var(--esb-ink); font-size: var(--esb-text-h2); }
.esb-404__text { margin: 0; color: var(--esb-ink-2); }
.esb-404 .esb-searchform { inline-size: 100%; margin-block: 8px; }
.esb-404__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; inline-size: 100%; margin: 12px 0 0; padding: 0; list-style: none; text-align: start; }
.esb-404__links li a { display: grid; grid-template-columns: auto 1fr; gap: 2px 14px; align-items: center; padding: 16px; border: 1px solid var(--esb-line); border-radius: var(--esb-radius-m); background: #fff; color: inherit; text-decoration: none; transition: box-shadow var(--esb-mid) var(--esb-ease), transform var(--esb-mid) var(--esb-ease); }
.esb-404__links li a:hover { box-shadow: var(--esb-shadow-m); transform: translateY(-2px); }
.esb-404__links .esb-tile { grid-row: span 2; }
.esb-404__link-title { color: var(--esb-ink); font-weight: 700; }
.esb-404__link-text { color: var(--esb-ink-3); font-size: var(--esb-text-tiny); }
@media (max-width: 560px) {
	.esb-404__links { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------- the article */

.esb-progress { position: fixed; inset-block-start: 0; inset-inline: 0; z-index: 120; block-size: 3px; pointer-events: none; }
.esb-progress span { display: block; block-size: 100%; background: linear-gradient(270deg, var(--esb-green), var(--esb-inbox)); transform: scaleX(0); transform-origin: right; }
[dir="ltr"] .esb-progress span { transform-origin: left; }

.esb-article-hero {
	margin-block-start: calc(-1 * (var(--esb-header-h) + 12px));
	padding: calc(var(--esb-header-h) + 12px + clamp(2rem, 1.4rem + 2.4vw, 3.5rem)) var(--esb-gutter) clamp(7rem, 5rem + 6vw, 11rem);
	background:
		radial-gradient(42% 80% at 90% 0%, color-mix(in srgb, var(--hue) 14%, transparent), transparent 70%),
		radial-gradient(36% 60% at 8% 0%, rgb(37 99 214 / 0.08), transparent 70%),
		var(--esb-mist);
}
.esb-article-hero__inner { display: grid; gap: 14px; justify-items: start; max-inline-size: 52rem; margin-inline: auto; }
.esb-article-hero .esb-article-hero__cat {
	padding: 4px 14px;
	border-radius: var(--esb-radius-pill);
	background: #fff;
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--hue) 25%, transparent);
	color: var(--hue-ink);
	font-size: var(--esb-text-tiny);
	font-weight: 700;
	text-decoration: none;
}
.esb-article-hero__title { color: var(--esb-ink); font-size: clamp(1.7rem, 1.35rem + 1.5vw, 2.6rem); line-height: 1.5; }
.esb-article-hero__lead { margin: 0; color: var(--esb-ink-2); font-size: var(--esb-text-lead); line-height: 1.95; }
.esb-article-hero__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; margin-block-start: 6px; }
.esb-byline { display: inline-flex; align-items: center; gap: 10px; color: var(--esb-ink); font-weight: 700; font-size: var(--esb-text-small); }
.esb-byline__mark { display: grid; place-items: center; inline-size: 34px; block-size: 34px; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 1px var(--esb-line); color: var(--esb-green); }
.esb-byline__mark .esb-cube { inline-size: 20px; block-size: 20px; }
.esb-article-hero__facts { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0; padding: 0; list-style: none; color: var(--esb-ink-3); font-size: var(--esb-text-small); }
.esb-article-hero__facts li { display: inline-flex; align-items: center; gap: 6px; }
.esb-article-hero__facts .esb-icon { inline-size: 17px; block-size: 17px; }

.esb-article__cover {
	max-inline-size: 1160px;
	margin: calc(-1 * clamp(5.5rem, 4rem + 5vw, 9rem)) auto 0;
	padding-inline: var(--esb-gutter);
}
.esb-article__cover-img {
	display: block;
	inline-size: 100%;
	aspect-ratio: 2 / 1;
	object-fit: cover;
	border-radius: var(--esb-radius-l);
	box-shadow: var(--esb-shadow-l);
}

.esb-article__layout {
	display: grid;
	grid-template-columns: minmax(0, 46rem) 21.5rem;
	justify-content: center;
	gap: clamp(32px, 4vw, 64px);
	max-inline-size: 1160px;
	margin-inline: auto;
	padding: clamp(2rem, 1.5rem + 2vw, 3.5rem) var(--esb-gutter) 0;
}
.esb-article__main { min-inline-size: 0; }
.esb-article__aside { position: sticky; inset-block-start: calc(var(--esb-header-h) + 24px); align-self: start; display: grid; gap: 14px; }
@media (max-width: 1100px) {
	.esb-article__layout { grid-template-columns: minmax(0, 46rem); }
	.esb-article__aside { display: none; }
}

.esb-toc-card { padding: 18px; border: 1px solid var(--esb-line); border-radius: var(--esb-radius-m); background: #fff; }
.esb-toc-card__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.esb-toc-card__title { margin: 0; color: var(--esb-ink); font-weight: 700; }
.esb-toc-card__count { color: var(--esb-ink-3); font-size: var(--esb-text-tiny); }
.esb-toc-card__meter { block-size: 4px; margin: 12px 0 10px; overflow: hidden; border-radius: 4px; background: var(--esb-cloud); }
.esb-toc-card__meter span { display: block; block-size: 100%; background: var(--esb-green); transform: scaleX(0); transform-origin: right; }
.esb-toc__list { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.esb-toc__list--card { max-block-size: 52vh; overflow-y: auto; scrollbar-width: thin; }
.esb-toc__list li a { display: flex; gap: 10px; align-items: flex-start; padding: 7px 8px; border-radius: var(--esb-radius-xs); color: var(--esb-ink-2); font-size: var(--esb-text-small); line-height: 1.7; text-decoration: none; }
.esb-toc__list li a:hover { background: var(--esb-mist); color: var(--esb-ink); }
.esb-toc__num { flex: none; display: grid; place-items: center; inline-size: 22px; block-size: 22px; border-radius: 50%; background: var(--esb-cloud); color: var(--esb-ink-3); font-size: 0.75rem; font-weight: 700; }
.esb-toc__list li a.is-read .esb-toc__num { background: var(--esb-green-soft); color: var(--esb-green); }
.esb-toc__list li a[aria-current="true"] { background: var(--esb-green-soft); color: var(--esb-green-deep); font-weight: 600; }
.esb-toc__list li a[aria-current="true"] .esb-toc__num { background: var(--esb-green); color: #fff; }

.esb-toc-inline { display: none; margin-block-end: 28px; border: 1px solid var(--esb-line); border-radius: var(--esb-radius-m); background: #fff; }
@media (max-width: 1100px) {
	.esb-toc-inline { display: block; }
}
.esb-toc-inline summary { display: flex; align-items: center; gap: 10px; padding: 14px 16px; list-style: none; cursor: pointer; }
.esb-toc-inline summary::-webkit-details-marker { display: none; }
.esb-toc-inline__icon { color: var(--esb-green); display: inline-flex; }
.esb-toc-inline__title { flex: 1; color: var(--esb-ink); font-weight: 700; }
.esb-toc-inline__count { color: var(--esb-ink-3); font-size: var(--esb-text-tiny); }
.esb-toc-inline__chevron { display: inline-flex; transition: transform var(--esb-mid) var(--esb-ease); }
.esb-toc-inline[open] .esb-toc-inline__chevron { transform: rotate(180deg); }
.esb-toc-inline .esb-toc__list { padding: 0 10px 12px; }

.esb-toc-fab {
	position: fixed;
	inset-block-end: max(16px, env(safe-area-inset-bottom));
	inset-inline-start: 50%;
	z-index: 80;
	display: none;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border: 0;
	border-radius: var(--esb-radius-pill);
	background: var(--esb-ink);
	color: #fff;
	font: 600 0.875rem var(--esb-font);
	box-shadow: var(--esb-shadow-l);
	transform: translate(50%, 140%);
	transition: transform var(--esb-mid) var(--esb-ease);
	cursor: pointer;
}
.esb-toc-fab .esb-icon { inline-size: 18px; block-size: 18px; }
.esb-toc-fab__pos { color: rgb(255 255 255 / 0.7); font-weight: 500; }
@media (max-width: 1100px) {
	.esb-toc-fab:not([hidden]) { display: inline-flex; }
}
.esb-toc-fab.is-visible { transform: translate(50%, 0); }

.esb-toc-sheet { inline-size: 100%; max-inline-size: 100%; margin: auto 0 0; padding: 0; border: 0; background: transparent; }
.esb-toc-sheet::backdrop { background: rgb(11 18 32 / 0.4); }
.esb-toc-sheet__panel { max-block-size: 82vh; overflow-y: auto; padding: 18px 18px max(18px, env(safe-area-inset-bottom)); border-radius: var(--esb-radius-l) var(--esb-radius-l) 0 0; background: #fff; }
.esb-toc-sheet[open] .esb-toc-sheet__panel { animation: esb-sheet var(--esb-mid) var(--esb-ease-out); }
@keyframes esb-sheet { from { transform: translateY(40px); opacity: 0; } }
.esb-toc-sheet__head { display: flex; align-items: center; justify-content: space-between; }
.esb-toc-sheet__title { margin: 0; color: var(--esb-ink); font-weight: 700; }
.esb-toc-sheet__close { display: grid; place-items: center; inline-size: 40px; block-size: 40px; border: 0; border-radius: 50%; background: var(--esb-mist); color: var(--esb-ink); cursor: pointer; }
.esb-toc-sheet__share { margin-block-start: 16px; padding-block-start: 14px; border-block-start: 1px solid var(--esb-line); }

/* Share. */
.esb-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.esb-share__list { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.esb-share .esb-share__link {
	position: relative;
	display: grid;
	place-items: center;
	inline-size: 42px;
	block-size: 42px;
	border: 1px solid var(--esb-line);
	border-radius: 50%;
	background: #fff;
	color: var(--esb-ink-2);
	cursor: pointer;
	transition: all var(--esb-fast) var(--esb-ease);
}
.esb-share__link .esb-icon { inline-size: 18px; block-size: 18px; }
.esb-share__link--telegram:hover { border-color: #26a5e4; background: #26a5e4; color: #fff; }
.esb-share__link--whatsapp:hover { border-color: #25d366; background: #25d366; color: #fff; }
.esb-share__link--linkedin:hover { border-color: #0a66c2; background: #0a66c2; color: #fff; }
.esb-share__link--x:hover { border-color: #000; background: #000; color: #fff; }
.esb-share__copy:hover { border-color: var(--esb-green); color: var(--esb-green); }
.esb-share__done-icon { display: none; }
.esb-share__copy.is-done { border-color: var(--esb-green); background: var(--esb-green); color: #fff; }
.esb-share__copy.is-done .esb-share__copy-icon { display: none; }
.esb-share__copy.is-done .esb-share__done-icon { display: block; }
.esb-share__native { display: inline-flex; align-items: center; gap: 6px; block-size: 42px; padding-inline: 16px; border: 0; border-radius: var(--esb-radius-pill); background: var(--esb-green); color: #fff; font: 600 0.875rem var(--esb-font); cursor: pointer; }
.esb-share__native[hidden] { display: none; }
.esb-share__native .esb-icon { inline-size: 18px; block-size: 18px; }
.esb-share__status { color: var(--esb-green); font-size: var(--esb-text-tiny); }
.esb-share-card { padding: 16px 18px; border: 1px solid var(--esb-line); border-radius: var(--esb-radius-m); background: #fff; }
.esb-share-card__title { margin: 0 0 10px; color: var(--esb-ink); font-weight: 700; font-size: var(--esb-text-small); }

.esb-article-share {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px 20px;
	margin-block-start: 44px;
	padding: 20px 22px;
	border: 1px solid var(--esb-line);
	border-radius: var(--esb-radius-m);
	background: var(--esb-mist);
}
.esb-article-share__title { margin: 0; color: var(--esb-ink); font-weight: 700; }
.esb-article-share__text { margin: 0; color: var(--esb-ink-3); font-size: var(--esb-text-small); }

.esb-author { display: flex; gap: 16px; align-items: flex-start; margin-block-start: 28px; padding: 22px; border: 1px solid var(--esb-line); border-radius: var(--esb-radius-m); background: #fff; }
.esb-author__mark { flex: none; display: grid; place-items: center; inline-size: 56px; block-size: 56px; border-radius: 16px; background: var(--esb-green-soft); color: var(--esb-green); }
.esb-author__mark .esb-cube { inline-size: 32px; block-size: 32px; }
.esb-author__body { display: grid; gap: 4px; }
.esb-author__label { margin: 0; color: var(--esb-ink-3); font-size: var(--esb-text-tiny); }
.esb-author__name { margin: 0; color: var(--esb-ink); font-weight: 700; }
.esb-author__bio { margin: 0; color: var(--esb-ink-2); font-size: var(--esb-text-small); line-height: 1.85; }
.esb-author__link { justify-self: start; color: var(--esb-green); font-size: var(--esb-text-small); font-weight: 600; }

.esb-related__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-block-end: 20px; }
.esb-related__title { color: var(--esb-ink); font-size: var(--esb-text-h3); }
.esb-related__all { color: var(--esb-green); font-weight: 600; font-size: var(--esb-text-small); }

.esb-postnav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding-block-start: 0; }
.esb-postnav .esb-postnav__link { display: grid; gap: 4px; padding: 18px 20px; border: 1px solid var(--esb-line); border-radius: var(--esb-radius-m); background: #fff; color: var(--esb-ink); font-weight: 600; line-height: 1.7; text-decoration: none; transition: box-shadow var(--esb-mid) var(--esb-ease); }
.esb-postnav__link:hover { box-shadow: var(--esb-shadow-s); }
.esb-postnav__link span { color: var(--esb-ink-3); font-size: var(--esb-text-tiny); font-weight: 500; }
.esb-postnav__link--next { text-align: end; grid-column: 2; }
@media (max-width: 640px) {
	.esb-postnav { grid-template-columns: 1fr; }
	.esb-postnav__link--next { grid-column: auto; }
}

/* ---------------------------------------------------------------- the article's text */

.esb-prose { color: var(--esb-ink-2); font-size: 1.0625rem; line-height: 2.05; }
.esb-prose > * + * { margin-block-start: 1.1em; }
.esb-prose p { margin: 0; }
.esb-prose p + p { margin-block-start: 1em; }
.esb-prose h2 {
	position: relative;
	margin-block: 2.4em 0.7em;
	padding-block-start: 0.2em;
	color: var(--esb-ink);
	font-size: clamp(1.3rem, 1.15rem + 0.6vw, 1.6rem);
	line-height: 1.6;
	scroll-margin-block-start: calc(var(--esb-header-h) + 24px);
}
.esb-prose h2::before {
	content: "";
	display: block;
	inline-size: 22px;
	block-size: 22px;
	margin-block-end: 10px;
	background: var(--esb-green);
	-webkit-mask: var(--esb-cube-mask) center / contain no-repeat;
	mask: var(--esb-cube-mask) center / contain no-repeat;
}
.esb-prose h3 { margin-block: 1.8em 0.5em; color: var(--esb-ink); font-size: 1.15rem; line-height: 1.7; scroll-margin-block-start: calc(var(--esb-header-h) + 24px); }
.esb-prose h4 { margin-block: 1.4em 0.4em; color: var(--esb-ink); font-size: 1.03rem; }
.esb-prose a { color: var(--esb-green); text-decoration: underline; text-decoration-color: rgb(14 110 88 / 0.35); text-underline-offset: 0.3em; }
.esb-prose a:hover { text-decoration-color: currentColor; }
/* Buttons inside the text (the call-to-action cards) are buttons, not links in a sentence. */
.esb-prose .esb-btn,
.esb-prose .esb-btn:hover { text-decoration: none; }
.esb-prose strong { color: var(--esb-ink); }
.esb-prose ul,
.esb-prose ol { padding-inline-start: 1.4em; }
.esb-prose li + li { margin-block-start: 0.45em; }
.esb-prose ul li::marker { color: var(--esb-green); }
.esb-prose ol { counter-reset: list-item; }
.esb-prose ol li::marker { content: counter(list-item, persian) ". "; color: var(--esb-green); font-weight: 700; }
.esb-prose blockquote { margin-inline: 0; padding: 4px 20px; border-inline-start: 3px solid var(--esb-green); color: var(--esb-ink); }
.esb-prose img { border-radius: var(--esb-radius-s); }
.esb-prose hr { border: 0; border-block-start: 1px solid var(--esb-line); margin-block: 2.4em; }
.esb-prose .esb-small,
.esb-prose small { color: var(--esb-ink-3); font-size: var(--esb-text-small); line-height: 1.85; }
.esb-link-pending { border-block-end: 1px dashed var(--esb-line-2); cursor: help; }

.esb-table { position: relative; overflow-x: auto; margin-block: 1.6em; border: 1px solid var(--esb-line); border-radius: var(--esb-radius-m); background: #fff; }
.esb-prose table { inline-size: 100%; min-inline-size: 520px; border-collapse: collapse; font-size: var(--esb-text-card); line-height: 1.8; }
.esb-prose th,
.esb-prose td { padding: 11px 14px; border-block-end: 1px solid var(--esb-line); text-align: start; vertical-align: top; }
.esb-prose thead th { background: var(--esb-mist); color: var(--esb-ink); font-weight: 700; }
.esb-prose tbody tr:last-child > * { border-block-end: 0; }
.esb-prose tbody tr:nth-child(even) td { background: #fbfcfd; }

.esb-callout { margin-block: 1.6em; padding: 18px 20px; border-radius: var(--esb-radius-m); font-size: var(--esb-text-card); line-height: 1.95; }
.esb-callout > :first-child { margin-block-start: 0; }
.esb-callout p + p,
.esb-callout p + ul { margin-block-start: 0.6em; }
.esb-callout ul { margin: 0; }
.esb-callout--summary {
	border: 1px solid rgb(14 110 88 / 0.2);
	background: radial-gradient(70% 120% at 100% 0%, rgb(14 110 88 / 0.08), transparent 70%), #fff;
	box-shadow: var(--esb-shadow-s);
}
.esb-callout--summary::before { content: "خلاصه در یک نگاه"; display: block; margin-block-end: 8px; color: var(--esb-green-deep); font-size: var(--esb-text-small); font-weight: 800; }
.esb-callout--note { border-inline-start: 4px solid var(--esb-inbox); background: var(--esb-inbox-soft); color: #1f3a6b; }
.esb-callout--note::before { content: "نکته"; display: block; margin-block-end: 4px; color: #1d4fb0; font-size: var(--esb-text-small); font-weight: 800; }
.esb-callout--warning { border-inline-start: 4px solid var(--esb-club); background: var(--esb-club-soft); color: #5c3a00; }
.esb-callout--warning::before { content: "هشدار"; display: block; margin-block-end: 4px; color: var(--esb-club-ink); font-size: var(--esb-text-small); font-weight: 800; }
.esb-callout--example { border: 1px dashed var(--esb-line-2); background: var(--esb-mist); }
.esb-callout--example::before { content: "مثال"; display: block; margin-block-end: 4px; color: var(--esb-ink); font-size: var(--esb-text-small); font-weight: 800; }

.esb-shot { margin: 1.8em 0; }
.esb-shot img { display: block; inline-size: 100%; border: 1px solid var(--esb-line); border-radius: var(--esb-radius-m); box-shadow: var(--esb-shadow-m); }
.esb-shot figcaption { margin-block-start: 10px; color: var(--esb-ink-3); font-size: var(--esb-text-small); line-height: 1.8; text-align: center; }
.esb-shot--phone img { max-inline-size: 300px; margin-inline: auto; padding: 7px; border: 0; border-radius: 34px; background: var(--esb-ink); }

.esb-faq-list { display: grid; gap: 10px; }
.esb-faq-item { border: 1px solid var(--esb-line); border-radius: var(--esb-radius-m); background: #fff; }
.esb-faq-item[open] { border-color: rgb(14 110 88 / 0.3); box-shadow: var(--esb-shadow-s); }
.esb-faq-item summary { display: flex; align-items: center; gap: 14px; padding: 16px 18px; list-style: none; cursor: pointer; }
.esb-faq-item summary::-webkit-details-marker { display: none; }
.esb-prose .esb-faq-item__q { flex: 1; margin: 0; font-size: 1rem; }
.esb-faq-item__icon { position: relative; flex: none; inline-size: 28px; block-size: 28px; border-radius: 50%; background: var(--esb-mist); transition: transform var(--esb-mid) var(--esb-ease), background-color var(--esb-mid) var(--esb-ease); }
.esb-faq-item__icon::before,
.esb-faq-item__icon::after { content: ""; position: absolute; inset: 50% auto auto 50%; inline-size: 12px; block-size: 1.8px; margin: -0.9px 0 0 -6px; border-radius: 2px; background: var(--esb-ink-2); }
.esb-faq-item__icon::after { transform: rotate(90deg); }
.esb-faq-item[open] .esb-faq-item__icon { transform: rotate(45deg); background: var(--esb-green); }
.esb-faq-item[open] .esb-faq-item__icon::before,
.esb-faq-item[open] .esb-faq-item__icon::after { background: #fff; }
.esb-faq-item__a { padding: 0 18px 16px; font-size: var(--esb-text-card); }