/* =====================================================================
   DigitalRadar — Post / Arquivo / Busca / 404 / Comentários
   ===================================================================== */

/* ---------- Barra de progresso de leitura ---------- */
.dr-progress {
	position: fixed;
	top: 0; left: 0; right: 0;
	height: 3px;
	z-index: calc(var(--dr-z-header) + 1);
	background: transparent;
	pointer-events: none;
}
.dr-progress span {
	display: block;
	height: 100%;
	width: 0;
	background: var(--dr-grad-neon);
	box-shadow: var(--dr-glow-sm);
	transition: width .1s linear;
}

/* ---------- Hero do post ---------- */
.dr-single__hero {
	position: relative;
	overflow: hidden;
	padding-block: clamp(2.5rem, 6vw, 5rem) clamp(1.5rem, 3vw, 2.5rem);
	isolation: isolate;
}
.dr-single__hero-bg {
	position: absolute; inset: 0; z-index: -1;
	background: radial-gradient(70% 120% at 80% 0%, rgba(0, 180, 255, .12), transparent 60%);
}
.dr-single__hero-bg::before {
	content: ""; position: absolute; inset: 0;
	background-image:
		linear-gradient(rgba(0,180,255,.05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(0,180,255,.05) 1px, transparent 1px);
	background-size: 46px 46px;
	-webkit-mask-image: radial-gradient(80% 80% at 85% 5%, #000, transparent 70%);
	mask-image: radial-gradient(80% 80% at 85% 5%, #000, transparent 70%);
}
.dr-single__cats { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.1rem; }
.dr-single__cat {
	font-family: var(--dr-font-alt);
	font-size: var(--dr-fs-xs);
	font-weight: var(--dr-fw-semi);
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--dr-on-neon);
	background: var(--dr-grad-neon);
	padding: .3rem .8rem;
	border-radius: var(--dr-r-pill);
	box-shadow: var(--dr-glow-sm);
}
.dr-single__title { font-size: var(--dr-fs-2xl); max-width: 22ch; }
.dr-single__meta {
	display: flex; align-items: center; flex-wrap: wrap; gap: .6rem 1rem;
	margin-top: 1.4rem;
	font-size: var(--dr-fs-sm);
	color: var(--dr-text-dim);
}
.dr-single__author-mini { display: inline-flex; align-items: center; gap: .55rem; }
.dr-single__author-mini img { width: 34px; height: 34px; flex: none; max-width: none; object-fit: cover; border-radius: 50%; border: 1px solid var(--dr-border-neon); }
.dr-single__author-mini strong { color: var(--dr-heading); font-weight: var(--dr-fw-semi); }
.dr-single__meta .sep { opacity: .4; }

/* ---------- Imagem destacada ---------- */
.dr-single__featured {
	max-width: var(--dr-container);
	margin: 0 auto clamp(2rem, 4vw, 3rem);
	padding-inline: var(--dr-gutter);
}
.dr-single__featured img {
	width: 100%;
	border-radius: var(--dr-r-lg);
	border: 1px solid var(--dr-border);
	box-shadow: var(--dr-shadow);
}

/* ---------- Layout coluna + sidebar ---------- */
.dr-single__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: clamp(2rem, 4vw, 3.5rem);
	align-items: start;
	padding-bottom: var(--dr-section-y);
}
/* Sem imagem destacada: aproxima a sidebar do título (sobe o início). */
.dr-single__layout--flush .dr-single__sidebar { margin-top: clamp(-3rem, -4vw, -2rem); }
/* main e sidebar fixados na MESMA linha (col 1 e col 2), senão o
   auto-placement do grid joga o main para a linha 2 (sob a sidebar),
   criando um vão enorme entre a imagem e o texto. */
.dr-single__main { min-width: 0; grid-column: 1; grid-row: 1; }
.dr-single__sidebar {
	grid-column: 2;
	grid-row: 1;
	align-self: start; /* sticky acompanha o scroll sem esticar a coluna */
	position: sticky;
	/* apenas um respiro abaixo do header — evita cortar itens em telas menores */
	top: calc(var(--dr-header-h) + 0.5rem);
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}
@media (max-width: 980px) {
	.dr-single__layout { grid-template-columns: 1fr; }
	/* Empilha em coluna única: conteúdo primeiro, sidebar (TOC/share) depois. */
	.dr-single__main { grid-column: 1; grid-row: 1; }
	.dr-single__sidebar { grid-column: 1; grid-row: 2; position: static; }
}

/* ---------- Widget base do sidebar ---------- */
.dr-side {
	background: var(--dr-surface);
	border: 1px solid var(--dr-border);
	border-radius: var(--dr-r-lg);
	padding: 1.3rem 1.4rem;
}
.dr-side__title {
	font-family: var(--dr-font-alt);
	font-size: var(--dr-fs-xs);
	text-transform: uppercase;
	letter-spacing: .12em;
	color: var(--dr-silver);
	margin-bottom: 1rem;
}

/* ---------- Índice (TOC) ---------- */
.dr-toc__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .2rem; }
.dr-toc__list a {
	display: block;
	padding: .45rem .7rem;
	border-left: 2px solid var(--dr-border);
	color: var(--dr-text-dim);
	font-size: var(--dr-fs-sm);
	line-height: 1.4;
	transition: color var(--dr-dur-fast) var(--dr-ease), border-color var(--dr-dur-fast) var(--dr-ease), background var(--dr-dur-fast) var(--dr-ease);
}
.dr-toc__list a.is-sub { padding-left: 1.4rem; font-size: var(--dr-fs-xs); }
.dr-toc__list a:hover { color: var(--dr-heading); border-color: var(--dr-border-neon); }
.dr-toc__list a.is-active { color: var(--dr-neon); border-color: var(--dr-neon); background: var(--dr-neon-soft); }

/* ---------- Share ---------- */
.dr-share { display: flex; flex-wrap: wrap; gap: .5rem; }
.dr-share a, .dr-share button {
	display: grid; place-items: center;
	width: 40px; height: 40px;
	border-radius: 50%;
	border: 1px solid var(--dr-border-2);
	background: var(--dr-bg-2);
	color: var(--dr-text-dim);
	cursor: pointer;
	transition: all var(--dr-dur-fast) var(--dr-ease);
}
.dr-share a:hover, .dr-share button:hover { color: var(--dr-neon); border-color: var(--dr-border-neon); box-shadow: var(--dr-glow-sm); transform: translateY(-2px); }

/* ---------- Newsletter mini ---------- */
.dr-side--news { background: linear-gradient(160deg, rgba(10,31,68,.6), var(--dr-surface)); border-color: var(--dr-border-neon); }
.dr-side--news p { font-size: var(--dr-fs-sm); color: var(--dr-text-dim); margin-bottom: .9rem; }
.dr-side--news input {
	width: 100%; padding: .7rem .9rem; margin-bottom: .6rem;
	background: var(--dr-bg-2); border: 1px solid var(--dr-border-2);
	border-radius: var(--dr-r-sm); color: var(--dr-heading); font-family: var(--dr-font-body);
}
.dr-side--news input:focus { outline: none; border-color: var(--dr-neon); }
.dr-side--news .dr-btn { width: 100%; }

/* ---------- Tags ---------- */
.dr-tags { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 2.5rem; }
.dr-tags a {
	font-size: var(--dr-fs-sm); color: var(--dr-text-dim);
	padding: .35rem .8rem; border: 1px solid var(--dr-border-2); border-radius: var(--dr-r-pill);
	transition: all var(--dr-dur-fast) var(--dr-ease);
}
.dr-tags a::before { content: "#"; color: var(--dr-neon); margin-right: .2rem; }
.dr-tags a:hover { border-color: var(--dr-border-neon); color: var(--dr-heading); }

/* ---------- Caixa do autor ---------- */
.dr-author {
	display: flex; gap: 1.2rem; align-items: flex-start;
	margin-top: 2.5rem; padding: 1.5rem;
	background: var(--dr-surface); border: 1px solid var(--dr-border); border-radius: var(--dr-r-lg);
}
.dr-author__avatar { flex: none; }
.dr-author__avatar img { width: 64px; height: 64px; max-width: none; object-fit: cover; border-radius: 50%; border: 1px solid var(--dr-border-neon); display: block; }
.dr-author__name { font-family: var(--dr-font-head); font-size: 1.2rem; color: var(--dr-heading); }
.dr-author__role { font-size: var(--dr-fs-xs); color: var(--dr-neon-2); text-transform: uppercase; letter-spacing: .08em; margin-top: .15rem; }
.dr-author__bio { font-size: var(--dr-fs-sm); color: var(--dr-text-dim); margin-top: .6rem; }

/* ---------- Navegação de posts ---------- */
.dr-postnav { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 2.5rem; }
.dr-postnav a {
	display: block; padding: 1.1rem 1.3rem;
	background: var(--dr-surface); border: 1px solid var(--dr-border); border-radius: var(--dr-r-md);
	transition: all var(--dr-dur) var(--dr-ease);
}
.dr-postnav a:hover { border-color: var(--dr-border-neon); box-shadow: var(--dr-glow-sm); }
.dr-postnav__label { display: block; font-size: var(--dr-fs-xs); color: var(--dr-text-mute); text-transform: uppercase; letter-spacing: .08em; margin-bottom: .35rem; }
.dr-postnav__title { color: var(--dr-heading); font-family: var(--dr-font-alt); font-weight: var(--dr-fw-semi); font-size: var(--dr-fs-sm); line-height: 1.3; }
.dr-postnav .next { text-align: right; }
@media (max-width: 560px) { .dr-postnav { grid-template-columns: 1fr; } }

/* ---------- Relacionados ---------- */
.dr-related { padding-block: var(--dr-section-y); border-top: 1px solid var(--dr-border); background: var(--dr-bg-2); }

/* ---------- Cabeçalho de arquivo/busca ---------- */
.dr-archive__head { margin-bottom: var(--dr-sp-6); }
.dr-archive__eyebrow {
	display: inline-flex; align-items: center; gap: .5rem;
	font-family: var(--dr-font-alt); font-size: var(--dr-fs-xs); font-weight: var(--dr-fw-semi);
	letter-spacing: var(--dr-tracking-wide); text-transform: uppercase; color: var(--dr-neon-2);
	margin-bottom: .8rem;
}
.dr-archive__title { font-size: var(--dr-fs-2xl); }
.dr-archive__desc { margin-top: .8rem; max-width: 60ch; color: var(--dr-text-dim); }

/* ---------- 404 — sinal perdido ---------- */
.dr-404 {
	position: relative;
	min-height: 70vh;
	display: grid; place-items: center; text-align: center;
	padding-block: var(--dr-sp-9);
	overflow: hidden;
}
.dr-404__radar {
	position: relative; width: 200px; height: 200px; margin: 0 auto 2rem;
	border-radius: 50%; border: 1px solid var(--dr-border-neon);
	background: radial-gradient(circle, rgba(0,180,255,.08), transparent 70%);
	overflow: hidden;
}
.dr-404__radar::before {
	content: ""; position: absolute; inset: 0; border-radius: 50%;
	background: conic-gradient(from 0deg, rgba(0,180,255,.3) 0deg, transparent 60deg);
	animation: dr-sweep 4s linear infinite;
}
.dr-404__code {
	position: absolute; inset: 0; display: grid; place-items: center;
	font-family: var(--dr-font-display); font-weight: 800; font-size: 3rem;
	color: var(--dr-heading); text-shadow: var(--dr-glow-text);
}
.dr-404__title { font-size: var(--dr-fs-xl); margin-bottom: .8rem; }
.dr-404__text { color: var(--dr-text-dim); max-width: 46ch; margin: 0 auto 1.8rem; }
.dr-404__actions { display: flex; flex-wrap: wrap; gap: .8rem; justify-content: center; margin-bottom: 2.5rem; }
.dr-404__search { max-width: 440px; margin: 0 auto; }

/* ---------- "Resposta rápida" (primeiro H2 + parágrafo) ---------- */
/* Destaca o primeiro bloco de resposta rápida após o conteúdo. */
.dr-prose h2:first-of-type {
	border-top: 0;
	padding-top: 0;
	margin-top: 1.4rem;
}

/* ---------- FAQ (H3 seguidos de parágrafo no fim do post) ---------- */
.dr-prose h3 {
	color: var(--dr-neon-2);
}

/* ---------- Tabela comparativa (reforço de leitura) ---------- */
.dr-prose table { margin-block: 1.6rem; border-radius: var(--dr-r-md); overflow: hidden; }
.dr-prose tbody tr:nth-child(odd) td { background: rgba(255,255,255,.015); }
.dr-prose td:first-child { font-weight: var(--dr-fw-semi); color: var(--dr-text); }

/* ---------- Comentários ---------- */
.dr-comments { margin-top: var(--dr-sp-8); padding-top: var(--dr-sp-6); border-top: 1px solid var(--dr-border); }
.dr-comments__title { font-size: var(--dr-fs-lg); margin-bottom: 1.5rem; }
.dr-comments .comment-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.2rem; }
.dr-comments .comment-list ol { list-style: none; padding-left: 1.5rem; margin-top: 1.2rem; display: grid; gap: 1.2rem; }
.dr-comments .comment-body {
	background: var(--dr-surface); border: 1px solid var(--dr-border);
	border-radius: var(--dr-r-md); padding: 1.1rem 1.3rem;
}
.dr-comments .comment-author { display: flex; align-items: center; gap: .6rem; font-size: var(--dr-fs-sm); }
.dr-comments .comment-author img { width: 36px; height: 36px; flex: none; max-width: none; object-fit: cover; border-radius: 50%; }
.dr-comments .comment-author .fn { color: var(--dr-heading); font-style: normal; font-weight: var(--dr-fw-semi); }
.dr-comments .comment-meta { font-size: var(--dr-fs-xs); color: var(--dr-text-mute); margin: .3rem 0 .6rem; }
.dr-comments .comment-meta a { color: var(--dr-text-mute); }
.dr-comments .reply a { font-size: var(--dr-fs-xs); color: var(--dr-neon); }
.dr-comment-form { margin-top: 2rem; display: grid; gap: 1rem; }
.dr-comment-form input:not([type="submit"]), .dr-comment-form textarea {
	width: 100%; padding: .8rem 1rem; background: var(--dr-surface);
	border: 1px solid var(--dr-border-2); border-radius: var(--dr-r-sm);
	color: var(--dr-heading); font-family: var(--dr-font-body);
}
.dr-comment-form input:not([type="submit"]):focus, .dr-comment-form textarea:focus { outline: none; border-color: var(--dr-neon); }
.dr-comment-form textarea { min-height: 120px; resize: vertical; }

/* Consentimento de cookies + texto alinhados */
.dr-comment-form .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: .6rem;
}
.dr-comment-form .comment-form-cookies-consent input[type="checkbox"] {
	width: 18px;
	height: 18px;
	flex: none;
	margin: 0;
	margin-top: .15rem;
	accent-color: var(--dr-neon);
	cursor: pointer;
}
.dr-comment-form .comment-form-cookies-consent label {
	margin: 0;
	line-height: 1.5;
	color: var(--dr-text-dim);
	font-family: var(--dr-font-body);
	cursor: pointer;
}