/* ========================================================================
 * SINGLE — artigo individual + barra de progresso + tipografia editorial
 * Depende: components.css
 *
 * O tema article lê --cat-color (setado inline em <article>) e deriva
 * --accent pra toda a decoração (pill, headings, links, blockquote, etc).
 * ===================================================================== */

/* --- Progress bar -------------------------------------------------- */
.gl-progress {
	position: fixed;
	top: 0; left: 0;
	height: 3px;
	width: 0;
	background: var(--accent, var(--fg-accent));
	z-index: 100000;
	transition: width 80ms linear;
}
body.admin-bar .gl-progress { top: 32px; }
@media screen and (max-width: 782px) {
	body.admin-bar .gl-progress { top: 46px; }
}

/* --- Wrap variants ------------------------------------------------- */
.gl-wrap--narrow { max-width: 760px; }
.gl-wrap--wide   { max-width: 1240px; }

/* --- Article shell ------------------------------------------------- */
.gl-article {
	padding: var(--space-8) 0 var(--space-24);
	--accent: var(--cat-color, var(--fg-accent));
}

/* --- Header (título, lead, meta) ----------------------------------- */
.gl-article__header {
	padding: var(--space-12) 0 var(--space-8);
	display: flex;
	flex-direction: column;
	gap: 0;
}

/* Category pill — outlined variant (sobrescreve .cat-pill sólido do card) */
.cat-pill--outline {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	width: fit-content;
	padding: var(--space-2) var(--space-4);
	background: transparent;
	color: var(--accent);
	border: 1px solid var(--accent);
	margin-bottom: var(--space-6);
}
.cat-pill--outline::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--accent);
}

/* Big uppercase title */
.gl-article__title {
	font-size: clamp(2.25rem, 6vw, 5rem);
	line-height: 0.96;
	letter-spacing: -0.028em;
	text-transform: uppercase;
	margin: 0 0 var(--space-8);
}

/* Italic subtitle with accent left border */
.gl-article__lead {
	font-family: var(--font-body);
	font-style: italic;
	font-size: clamp(1.1875rem, 2vw, 1.5rem);
	line-height: 1.45;
	color: var(--fg-muted);
	max-width: 52ch;
	padding-left: var(--space-4);
	border-left: 3px solid var(--accent);
	margin: 0 0 var(--space-8);
}

.gl-article__meta {
	display: flex;
	gap: var(--space-4);
	align-items: center;
	flex-wrap: wrap;
	padding: var(--space-4) 0;
	border-top: 1px solid var(--c-hair);
	border-bottom: 1px solid var(--c-hair);
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fg-muted);
}

/* --- Hero cover — bleed beyond reading column --------------------- */
.gl-article__cover {
	margin: var(--space-8) auto var(--space-16);
	max-width: 1080px;
	padding: 0 var(--wrap-pad);
}
.gl-article__cover img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: var(--r-lg);
	display: block;
}
.gl-article__cover figcaption {
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fg-muted);
	margin-top: var(--space-3);
	text-align: center;
}

/* --- Layout: content + TOC aside + right aside -------------------- */
.gl-article__layout {
	display: grid;
	grid-template-columns: minmax(0, 760px);
	justify-content: center;
	gap: var(--space-8);
}
@media (min-width: 1024px) {
	.gl-article__layout {
		grid-template-columns: 220px minmax(0, 760px);
		gap: var(--space-12);
		align-items: start;
	}
}
@media (min-width: 1280px) {
	.gl-article__layout {
		grid-template-columns: 200px minmax(0, 700px) 240px;
		gap: var(--space-10);
	}
}

/* --- Article footer (author box, newsletter, nav) ------------------ */
.gl-article__footer {
	max-width: 760px;
	margin: var(--space-16) auto 0;
}
.gl-article__footer > * + * { margin-top: var(--space-12); }

/* --- TOC aside ----------------------------------------------------- */
.gl-toc {
	order: -1;
	margin: 0 0 var(--space-6);
}
.gl-toc__inner {
	padding: var(--space-6);
	background: rgba(255, 255, 255, 0.02);
	border: 1px solid var(--c-hair);
	border-radius: var(--r-md);
}
.gl-toc__label {
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--fg-muted);
	margin: 0 0 var(--space-4);
}
.gl-toc__list {
	list-style: none;
	padding: 0;
	margin: 0;
	counter-reset: gl-toc;
}
.gl-toc__item {
	counter-increment: gl-toc;
	margin-bottom: var(--space-1);
}
.gl-toc__link {
	display: flex;
	align-items: baseline;
	gap: var(--space-3);
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	line-height: 1.3;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fg-muted);
	padding: var(--space-2) var(--space-3);
	border-radius: var(--r-sm);
	transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
}
.gl-toc__link::before {
	content: counter(gl-toc, decimal-leading-zero);
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	font-weight: 600;
	letter-spacing: 0.08em;
	color: var(--accent);
	flex-shrink: 0;
}
.gl-toc__link:hover {
	color: var(--fg-page);
	background: color-mix(in srgb, var(--accent) 8%, transparent);
	opacity: 1;
}
.gl-toc__link.is-active {
	color: var(--c-ink);
	background: var(--accent);
	font-weight: 600;
}
.gl-toc__link.is-active::before { color: var(--c-ink); }

@media (min-width: 1024px) {
	.gl-toc {
		position: sticky;
		top: calc(72px + var(--space-4));
		margin: 0;
		max-height: calc(100vh - 120px);
		overflow-y: auto;
	}
	body.admin-bar .gl-toc { top: calc(72px + 32px + var(--space-4)); }
}

/* --- Meta row rica (avatar + share) -------------------------------- */
.gl-meta-rich {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	flex-wrap: wrap;
	padding: var(--space-4) 0;
	border-top: 1px solid var(--c-hair);
	border-bottom: 1px solid var(--c-hair);
}
.gl-meta-rich__author {
	display: flex;
	align-items: center;
	gap: var(--space-3);
}
.gl-meta-rich__avatars {
	display: inline-flex;
	align-items: center;
}
.gl-meta-rich__avatars[data-count="1"] .gl-meta-rich__avatar { margin-left: 0; }
.gl-meta-rich__avatars .gl-meta-rich__avatar + .gl-meta-rich__avatar {
	margin-left: -14px;
	box-shadow: 0 0 0 2px var(--bg-page);
}
.gl-meta-rich__avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: 1px solid var(--c-hair);
}
.gl-meta-rich__author-info {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.gl-meta-rich__name {
	font-family: var(--font-ui);
	font-size: var(--fs-sm);
	font-weight: 600;
	color: var(--fg-page);
	letter-spacing: 0.02em;
}
.gl-meta-rich__dateline {
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fg-muted);
	display: inline-flex;
	gap: var(--space-2);
	align-items: center;
}
.gl-meta-rich__dot { opacity: 0.5; }

.gl-meta-rich__share {
	display: inline-flex;
	gap: var(--space-2);
	align-items: center;
}
.gl-share-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 1px solid var(--c-hair);
	background: transparent;
	color: var(--fg-muted);
	cursor: pointer;
	transition: color var(--dur-fast) var(--ease),
	            border-color var(--dur-fast) var(--ease),
	            background var(--dur-fast) var(--ease);
}
.gl-share-btn:hover {
	color: var(--accent);
	border-color: var(--accent);
	background: color-mix(in srgb, var(--accent) 10%, transparent);
	opacity: 1;
}
.gl-share-btn__feedback {
	position: absolute;
	top: -28px;
	left: 50%;
	transform: translateX(-50%);
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--fg-page);
	background: var(--c-ink);
	border: 1px solid var(--c-hair);
	padding: 2px 8px;
	border-radius: var(--r-sm);
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--dur-fast) var(--ease);
}
.gl-share-btn__feedback.is-visible { opacity: 1; }

/* Content prose (equiv. .read) */
.gl-article__content {
	font-size: 1.1875rem;
	line-height: 1.7;
}
.gl-article__content > * + * { margin-top: var(--space-6); }
.gl-article__content p { max-width: 62ch; margin: 0; }

/* Headings with numbered/border treatment */
.gl-article__content h2 {
	font-family: var(--font-display);
	font-size: clamp(1.75rem, 3.2vw, 2.625rem);
	line-height: 1.02;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	margin-top: var(--space-16);
	padding-top: var(--space-6);
	border-top: 1px solid var(--c-hair);
}
.gl-article__content h3 {
	font-family: var(--font-display);
	font-size: var(--fs-xl);
	text-transform: uppercase;
	letter-spacing: -0.015em;
	line-height: 1.1;
	margin-top: var(--space-8);
}

/* Links com underline accent */
.gl-article__content a {
	color: var(--accent);
	text-decoration: none;
	border-bottom: 1px solid color-mix(in srgb, var(--accent) 40%, transparent);
	transition: background var(--dur-fast) var(--ease);
}
.gl-article__content a:hover {
	background: color-mix(in srgb, var(--accent) 18%, transparent);
	opacity: 1;
}

/* Strong como highlight (fundo accent translúcido na metade inferior) */
.gl-article__content strong {
	font-weight: 400;
	background: linear-gradient(
		transparent 62%,
		color-mix(in srgb, var(--accent) 35%, transparent) 62%
	);
	padding: 0 2px;
}
.gl-article__content em {
	font-style: italic;
	color: var(--fg-muted);
}

/* Lists com marker accent */
.gl-article__content ul,
.gl-article__content ol {
	padding-left: var(--space-6);
	max-width: 60ch;
}
.gl-article__content ul li,
.gl-article__content ol li { margin-bottom: var(--space-3); }
.gl-article__content ul li::marker { color: var(--accent); }
.gl-article__content ol li::marker {
	color: var(--accent);
	font-family: var(--font-ui);
}

/* Blockquote como pullquote (centralizado, grande) */
.gl-article__content blockquote {
	margin: var(--space-16) 0;
	padding: var(--space-12) 0;
	border-top: 1px solid var(--c-hair);
	border-bottom: 1px solid var(--c-hair);
	border-left: none;
	text-align: center;
	font-family: var(--font-display);
	font-size: clamp(1.75rem, 3.8vw, 2.75rem);
	line-height: 1.05;
	letter-spacing: -0.022em;
	text-transform: uppercase;
	color: var(--fg-page);
	font-style: normal;
	max-width: none;
}
.gl-article__content blockquote p {
	margin: 0 auto;
	max-width: 24ch;
}
.gl-article__content blockquote em {
	color: var(--accent);
	font-style: normal;
}
.gl-article__content blockquote cite {
	display: block;
	margin-top: var(--space-4);
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fg-muted);
	font-style: normal;
}

/* Gutenberg figure + legenda */
.gl-article__content figure,
.gl-article__content .wp-block-image {
	margin: var(--space-8) 0;
}
.gl-article__content figure img,
.gl-article__content .wp-block-image img {
	border-radius: var(--r-md);
	width: 100%;
	display: block;
}
.gl-article__content figcaption,
.gl-article__content .wp-block-image figcaption {
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fg-muted);
	margin-top: var(--space-3);
}

/* --- [callout] shortcode ------------------------------------------ */
.gl-callout {
	padding: var(--space-6) var(--space-8);
	border-radius: var(--r-md);
	background: rgba(255, 255, 255, 0.03);
	border-left: 4px solid var(--accent);
	font-size: var(--fs-base);
	line-height: 1.55;
	margin: var(--space-8) 0;
}
.gl-callout__tag {
	display: block;
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--accent);
	margin-bottom: var(--space-3);
}
.gl-callout p { max-width: none; margin: 0; }
.gl-callout > * + * { margin-top: var(--space-3); }

/* --- Post nav (prev / next) --------------------------------------- */
.gl-post-nav {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-4);
	padding-top: var(--space-8);
	border-top: 1px solid var(--c-hair);
}
.gl-post-nav__link {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	padding: var(--space-4);
	border: 1px solid var(--c-hair);
	border-radius: var(--r-md);
	background: rgba(255, 255, 255, 0.02);
	color: var(--fg-page);
	transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
}
.gl-post-nav__link:hover {
	border-color: var(--accent);
	background: color-mix(in srgb, var(--accent) 6%, transparent);
	opacity: 1;
}
.gl-post-nav__link--next { text-align: right; align-items: flex-end; }
.gl-post-nav__dir {
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--fg-muted);
}
.gl-post-nav__title {
	font-family: var(--font-display);
	font-size: var(--fs-lg);
	line-height: 1.15;
	text-transform: uppercase;
	letter-spacing: -0.01em;
}
.gl-post-nav__spacer { display: block; }
@media (max-width: 640px) {
	.gl-post-nav { grid-template-columns: 1fr; }
	.gl-post-nav__link--next { text-align: left; align-items: flex-start; }
}

/* --- Article aside (right col, desktop ≥1280 only) ---------------- */
.gl-article-aside { display: none; }

@media (min-width: 1280px) {
	.gl-article-aside {
		display: block;
		position: sticky;
		top: calc(72px + var(--space-4));
		align-self: start;
	}
	body.admin-bar .gl-article-aside { top: calc(72px + 32px + var(--space-4)); }
}
.gl-article-aside__inner { display: flex; flex-direction: column; gap: var(--space-6); }

/* --- Aside card base (série / curso / material) ------------------- */
.gl-aside-card {
	padding: var(--space-6);
	border: 1px solid var(--c-hair);
	border-radius: var(--r-md);
	background: rgba(255, 255, 255, 0.02);
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
}
.gl-aside-card__kicker {
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--accent);
	margin: 0;
}
.gl-aside-card__title {
	font-family: var(--font-display);
	font-size: var(--fs-lg);
	line-height: 1.15;
	text-transform: uppercase;
	letter-spacing: -0.01em;
	margin: 0;
}
.gl-aside-card__body {
	font-size: var(--fs-sm);
	color: var(--fg-muted);
	line-height: 1.55;
	margin: 0;
}
.gl-aside-card__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	margin-top: var(--space-2);
	padding: var(--space-3) var(--space-5);
	border-radius: var(--r-pill);
	background: var(--accent);
	color: var(--c-ink);
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	transition: transform var(--dur-fast) var(--ease);
}
.gl-aside-card__cta:hover { transform: scale(1.03); opacity: 1; }
.gl-aside-card__cta--ghost {
	background: transparent;
	color: var(--accent);
	border: 1px solid var(--accent);
}
.gl-aside-card__cta--ghost:hover {
	background: color-mix(in srgb, var(--accent) 12%, transparent);
	color: var(--accent);
}

/* --- Aside: série (numbered reading list, HTML mockup pattern) ---- */
.gl-aside-series__list {
	list-style: none;
	padding: 0;
	margin: var(--space-2) 0 0;
	counter-reset: gl-series;
	display: flex;
	flex-direction: column;
	gap: var(--space-1);
}
.gl-aside-series__item {
	counter-increment: gl-series;
}
.gl-aside-series__link {
	display: flex;
	align-items: baseline;
	gap: var(--space-3);
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	line-height: 1.3;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fg-muted);
	padding: var(--space-2) var(--space-3);
	border-radius: var(--r-sm);
	text-decoration: none;
	transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
}
.gl-aside-series__link::before {
	content: counter(gl-series, decimal-leading-zero);
	font-weight: 600;
	color: var(--accent);
	flex-shrink: 0;
}
a.gl-aside-series__link:hover {
	color: var(--fg-page);
	background: color-mix(in srgb, var(--accent) 8%, transparent);
	opacity: 1;
}
.gl-aside-series__item.is-current .gl-aside-series__link {
	color: var(--c-ink);
	background: var(--accent);
	font-weight: 600;
}
.gl-aside-series__item.is-current .gl-aside-series__link::before {
	color: var(--c-ink);
}

/* --- Aside: curso (accent-tinted background) ---------------------- */
.gl-aside-course {
	background: linear-gradient(
		140deg,
		color-mix(in srgb, var(--accent) 18%, transparent),
		rgba(255, 255, 255, 0.02)
	);
	border-color: color-mix(in srgb, var(--accent) 28%, var(--c-hair));
}

/* --- Aside: material (dark card with ghost CTA) ------------------- */
.gl-aside-material {
	background: rgba(255, 255, 255, 0.03);
}

/* --- Newsletter band — GNDM pattern (purple→night + dual glow) ---- */
.gl-newsletter {
	position: relative;
	overflow: hidden;
	margin-top: var(--space-16);
	padding: var(--space-12) var(--space-8);
	border-radius: var(--r-lg);
	border: 1px solid rgba(255, 255, 255, 0.08);
	background: linear-gradient(
		135deg,
		var(--c-purple) 0%,
		var(--c-night) 60%,
		#000 100%
	);
	color: var(--c-off);
	isolation: isolate;
}
@media (min-width: 900px) {
	.gl-newsletter { padding: var(--space-16); }
}
/* Magenta glow, top-right */
.gl-newsletter::before {
	content: "";
	position: absolute;
	top: -80px; right: -80px;
	width: 360px; height: 360px;
	background: radial-gradient(circle, var(--c-magenta), transparent 65%);
	opacity: 0.45;
	filter: blur(20px);
	pointer-events: none;
	z-index: -1;
}
/* Cyan glow, bottom-left */
.gl-newsletter::after {
	content: "";
	position: absolute;
	bottom: -100px; left: -80px;
	width: 320px; height: 320px;
	background: radial-gradient(circle, var(--c-cyan), transparent 65%);
	opacity: 0.35;
	filter: blur(20px);
	pointer-events: none;
	z-index: -1;
}
.gl-newsletter__in {
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-8);
	align-items: center;
}
@media (min-width: 900px) {
	.gl-newsletter__in {
		grid-template-columns: 1.2fr 1fr;
		gap: var(--space-12);
	}
}
.gl-newsletter__copy { max-width: 46ch; }
.gl-newsletter__kicker {
	display: inline-flex;
	align-items: center;
	gap: var(--space-3);
	margin: 0 0 var(--space-4);
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--c-amber);
	font-weight: 600;
}
.gl-newsletter__kicker::before {
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--c-amber);
	box-shadow: 0 0 14px var(--c-amber);
	flex-shrink: 0;
}
.gl-newsletter__title {
	font-family: var(--font-display);
	font-size: clamp(2rem, 4vw, 3.25rem);
	line-height: 0.98;
	letter-spacing: -0.025em;
	text-transform: uppercase;
	color: var(--c-off);
	margin: 0 0 var(--space-4);
}
.gl-newsletter__brand {
	color: var(--c-amber);
	font-style: normal;
}
.gl-newsletter__body {
	font-family: var(--font-body);
	font-size: 1rem;
	line-height: 1.55;
	color: rgba(245, 240, 240, 0.78);
	margin: 0;
	max-width: 46ch;
}

/* Side: form + meta */
.gl-newsletter__side {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
}
.gl-newsletter__meta {
	font-family: var(--font-ui);
	font-size: 0.6875rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(245, 240, 240, 0.55);
	margin: 0;
}

/* Pill wrapper around Hostinger Reach (ou qualquer widget) */
.gl-newsletter__form {
	display: flex;
	gap: 0;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: var(--r-pill);
	padding: 6px;
}
/* O widget Reach injeta markup próprio — normalizamos o que importa */
.gl-newsletter__form > * {
	display: flex;
	flex: 1;
	gap: 0;
	align-items: center;
	min-width: 0;
}
.gl-newsletter__form form,
.gl-newsletter__form .wp-block-group,
.gl-newsletter__form .hostinger-reach-subscribe,
.gl-newsletter__form .wp-block-hostinger-reach-subscribe {
	display: flex;
	flex: 1;
	gap: 0;
	align-items: center;
	margin: 0;
	width: 100%;
}
.gl-newsletter-widget__title { display: none; }

.gl-newsletter__form input[type="email"],
.gl-newsletter__form input[type="text"] {
	flex: 1;
	min-width: 0;
	background: transparent;
	border: 0;
	outline: 0;
	padding: 12px 20px;
	color: #fff;
	font-family: var(--font-body);
	font-size: 15px;
	box-shadow: none;
}
.gl-newsletter__form input[type="email"]::placeholder,
.gl-newsletter__form input[type="text"]::placeholder {
	color: rgba(255, 255, 255, 0.4);
}
.gl-newsletter__form button,
.gl-newsletter__form input[type="submit"],
.gl-newsletter__form .wp-block-button__link {
	padding: 12px 22px;
	border-radius: var(--r-pill);
	background: var(--c-magenta);
	color: #fff;
	font-family: var(--font-ui);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	border: 0;
	cursor: pointer;
	white-space: nowrap;
	transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.gl-newsletter__form button:hover,
.gl-newsletter__form input[type="submit"]:hover,
.gl-newsletter__form .wp-block-button__link:hover {
	background: var(--c-cyan);
	color: var(--c-night);
}

/* --- Author box --------------------------------------------------- */
.gl-author-box {
	padding-top: var(--space-8);
	border-top: 1px solid var(--c-hair);
}
.gl-author-box__label {
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--fg-muted);
	margin: 0 0 var(--space-6);
}
.gl-author-box__list {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-6);
}
@media (min-width: 768px) {
	.gl-author-box__list { grid-template-columns: repeat(2, 1fr); }
	.gl-author-box__list:has(> :nth-child(1):last-child) { grid-template-columns: 1fr; }
}
.gl-author-card {
	display: flex;
	gap: var(--space-4);
	align-items: flex-start;
	padding: var(--space-6);
	background: rgba(255, 255, 255, 0.02);
	border: 1px solid var(--c-hair);
	border-radius: var(--r-md);
}
.gl-author-card__avatar {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	flex-shrink: 0;
	border: 1px solid var(--c-hair);
}
.gl-author-card__body { flex: 1; min-width: 0; }
.gl-author-card__name {
	font-family: var(--font-display);
	font-size: var(--fs-lg);
	line-height: 1.15;
	text-transform: uppercase;
	letter-spacing: -0.01em;
	margin: 0 0 var(--space-2);
}
.gl-author-card__name a { color: var(--fg-page); }
.gl-author-card__name a:hover { color: var(--accent); opacity: 1; }
.gl-author-card__bio {
	font-size: var(--fs-sm);
	color: var(--fg-muted);
	line-height: 1.5;
	margin: 0 0 var(--space-3);
}
.gl-author-card__link {
	font-family: var(--font-ui);
	font-size: var(--fs-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0;
}
.gl-author-card__link a { color: var(--accent); }

/* --- Related posts ------------------------------------------------- */
.gl-related {
	margin: var(--space-24) 0 0;
	padding-top: var(--space-12);
	border-top: 1px solid var(--c-hair);
}
.gl-related__label {
	font-family: var(--font-display);
	font-size: clamp(1.5rem, 3vw, 2.25rem);
	line-height: 1.05;
	text-transform: uppercase;
	letter-spacing: -0.02em;
	margin: 0 0 var(--space-8);
}
.gl-related__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: var(--space-6);
}
