/*
Theme Name: Sereno
Theme URI: https://example.com/sereno
Author: Feito com Claude
Author URI: https://claude.ai
Description: Tema editorial moderno e sóbrio, com paleta inspirada na identidade da Anthropic. Traz o Estúdio Visual: um editor de estilos com preview ao vivo para o menu de topo e a página de posts, sem precisar escrever CSS.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sereno
Tags: blog, one-column, two-columns, custom-menu, custom-logo, featured-images, editor-style, threaded-comments, translation-ready
*/

/* ==========================================================================
   1. Base
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		transition-duration: .01ms !important;
	}
}

body {
	margin: 0;
	background: var(--sr-bg);
	color: var(--sr-ink);
	font-family: var(--sr-font-reading);
	font-size: var(--sr-size);
	line-height: var(--sr-leading);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

img, video, svg { max-width: 100%; height: auto; display: block; }

a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .18em; }

:focus-visible {
	outline: 2px solid var(--sr-accent);
	outline-offset: 3px;
	border-radius: 2px;
}

.sr-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	background: var(--sr-ink);
	color: var(--sr-bg);
	padding: 12px 20px;
	z-index: 9999;
}
.sr-skip:focus { left: 8px; top: 8px; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

/* Tipografia ---------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
	font-family: var(--sr-font-reading);
	font-weight: var(--sr-title-weight);
	line-height: 1.18;
	letter-spacing: -0.012em;
	margin: 0 0 .5em;
	text-wrap: balance;
}

h1 { font-size: calc(var(--sr-size) * var(--sr-scale) * var(--sr-scale) * var(--sr-scale)); }
h2 { font-size: calc(var(--sr-size) * var(--sr-scale) * var(--sr-scale)); }
h3 { font-size: calc(var(--sr-size) * var(--sr-scale)); }
h4 { font-size: calc(var(--sr-size) * 1.05); }

p { margin: 0 0 1.2em; }

blockquote {
	margin: 2em 0;
	padding-left: 1.4em;
	border-left: 2px solid var(--sr-accent);
	font-size: 1.1em;
	font-style: italic;
	color: var(--sr-ink);
}
blockquote cite { display: block; font-size: .75em; font-style: normal; color: var(--sr-muted); margin-top: .8em; }

code, kbd, pre {
	font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
	font-size: .88em;
}
code { background: rgba(var(--sr-ink-rgb), .06); padding: .12em .38em; border-radius: 3px; }
pre {
	background: var(--sr-surface);
	border: 1px solid var(--sr-line);
	border-radius: var(--sr-radius);
	padding: 1.1em 1.3em;
	overflow-x: auto;
	line-height: 1.6;
}
pre code { background: none; padding: 0; }

hr { border: 0; border-top: 1px solid var(--sr-line); margin: 2.5em 0; }

table { width: 100%; border-collapse: collapse; margin: 1.6em 0; font-size: .94em; }
th, td { text-align: left; padding: .6em .8em; border-bottom: 1px solid var(--sr-line); }
th { font-weight: 600; }

/* Estruturas --------------------------------------------------------- */

.sr-shell {
	width: min(100% - 40px, var(--sr-container));
	margin-inline: auto;
}

.sr-section { padding-block: var(--sr-rhythm); }

/* Eyebrow: rótulo pequeno na cor de destaque, sem caixa-alta forçada. */
.sr-eyebrow {
	display: inline-block;
	font-family: var(--sr-font-ui);
	font-size: .72em;
	font-weight: 600;
	color: var(--sr-accent);
	text-decoration: none;
	margin-bottom: .45em;
}
.sr-eyebrow:hover { text-decoration: underline; }

/* Metadados: separados por um fio, não por pontos.
   O truque do recuo negativo + overflow recorta o fio de quem inicia uma linha.
   Isso resolve dois casos de uma vez: quando a linha quebra em telas estreitas,
   e quando o Estúdio desliga o primeiro item (a data, por exemplo). */
.sr-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	font-family: var(--sr-font-ui);
	font-size: .74em;
	color: var(--sr-muted);
	line-height: 1.5;
	row-gap: .15em;
	margin-left: -0.7em;
	overflow: hidden;
}
.sr-meta__item {
	padding-inline: .7em;
	border-left: 1px solid var(--sr-line);
	/* Puxa o item 1px à esquerda: quem abre uma linha joga o próprio fio
	   para fora da caixa, onde o overflow o recorta. Quem está no meio
	   da linha mantém o fio visível. */
	margin-left: -1px;
}

/* Botões ------------------------------------------------------------- */

.sr-button,
.wp-block-button__link,
input[type="submit"],
button.submit {
	display: inline-block;
	font-family: var(--sr-font-ui);
	font-size: .82em;
	font-weight: 500;
	padding: .72em 1.5em;
	background: var(--sr-ink);
	color: var(--sr-bg);
	border: 0;
	border-radius: var(--sr-radius);
	text-decoration: none;
	cursor: pointer;
	transition: background .18s, color .18s;
}
.sr-button:hover,
input[type="submit"]:hover { background: var(--sr-accent); color: #fff; }

input[type="text"], input[type="email"], input[type="url"],
input[type="password"], input[type="search"], input[type="number"],
textarea, select {
	width: 100%;
	font-family: var(--sr-font-ui);
	font-size: .88em;
	padding: .65em .85em;
	background: var(--sr-surface);
	color: var(--sr-ink);
	border: 1px solid var(--sr-line);
	border-radius: var(--sr-radius);
}

/* ==========================================================================
   2. Cabeçalho e menu de topo
   ========================================================================== */

.sr-header {
	position: relative;
	z-index: 100;
	background: rgba(var(--sr-menu-bg-rgb), var(--sr-menu-alpha));
	border-bottom: var(--sr-menu-border) solid var(--sr-line);
	transition: box-shadow .25s, background .25s;
}

.sr-menu-sticky-on .sr-header {
	position: sticky;
	top: 0;
}
body.admin-bar.sr-menu-sticky-on .sr-header { top: 32px; }

@supports (backdrop-filter: blur(1px)) {
	.sr-header { backdrop-filter: blur(var(--sr-menu-blur)) saturate(1.4); }
}

.sr-menu-shadow-soft .sr-header.is-scrolled { box-shadow: 0 1px 20px rgba(var(--sr-ink-rgb), .07); }
.sr-menu-shadow-strong .sr-header.is-scrolled { box-shadow: 0 4px 30px rgba(var(--sr-ink-rgb), .16); }

.sr-header__inner {
	width: min(100% - 40px, var(--sr-container));
	margin-inline: auto;
	min-height: var(--sr-menu-h);
	display: flex;
	align-items: center;
	gap: 24px;
}

/* Marca */
.sr-brand { display: flex; align-items: center; gap: 10px; flex: none; }
.sr-brand__link { text-decoration: none; display: flex; align-items: center; gap: 10px; }
.sr-brand__name {
	font-family: var(--sr-font-reading);
	font-size: calc(var(--sr-menu-size) * 1.45);
	font-weight: 600;
	letter-spacing: -0.02em;
	margin: 0;
	line-height: 1;
	color: var(--sr-menu-text);
}
.sr-brand__tagline {
	display: none;
	font-family: var(--sr-font-ui);
	font-size: .62em;
	color: var(--sr-muted);
	margin: 0;
}
@media (min-width: 900px) { .sr-brand__tagline { display: block; } }
.sr-brand img { max-height: calc(var(--sr-menu-h) - 28px); width: auto; }

/* Navegação */
.sr-nav { flex: 1; display: none; }
@media (min-width: 900px) { .sr-nav { display: block; } }

.sr-menu {
	display: flex;
	align-items: center;
	justify-content: var(--sr-menu-justify);
	gap: var(--sr-menu-gap);
	list-style: none;
	margin: 0;
	padding: 0;
}

.sr-menu__item { position: relative; }

.sr-menu a {
	display: inline-block;
	font-family: var(--sr-font-ui);
	font-size: var(--sr-menu-size);
	font-weight: var(--sr-menu-weight);
	letter-spacing: var(--sr-menu-ls);
	text-transform: var(--sr-menu-transform);
	color: var(--sr-menu-text);
	text-decoration: none;
	padding: .45em .1em;
	position: relative;
	transition: color .18s;
	white-space: nowrap;
}
.sr-menu a:hover { color: var(--sr-menu-hover); }

/* Marcador do item ativo ------------------------------------------- */

/* Fio embaixo: cresce do centro ao passar o mouse. */
.sr-menu-indicator-rule .sr-menu > li > a::after {
	content: "";
	position: absolute;
	left: 0; right: 0;
	bottom: 0;
	height: var(--sr-menu-ind-size);
	background: var(--sr-menu-ind);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform .22s ease;
}
.sr-menu-indicator-rule .sr-menu > li > a:hover::after,
.sr-menu-indicator-rule .sr-menu > li.current-menu-item > a::after,
.sr-menu-indicator-rule .sr-menu > li.current_page_item > a::after { transform: scaleX(1); }

/* Pílula */
.sr-menu-indicator-pill .sr-menu > li > a {
	padding: .45em .95em;
	border-radius: var(--sr-menu-item-radius);
	transition: background .18s, color .18s;
}
.sr-menu-indicator-pill .sr-menu > li > a:hover,
.sr-menu-indicator-pill .sr-menu > li.current-menu-item > a,
.sr-menu-indicator-pill .sr-menu > li.current_page_item > a {
	background: var(--sr-menu-ind);
	color: var(--sr-surface);
}

/* Ponto */
.sr-menu-indicator-dot .sr-menu > li > a::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -2px;
	width: calc(var(--sr-menu-ind-size) * 2);
	height: calc(var(--sr-menu-ind-size) * 2);
	margin-left: calc(var(--sr-menu-ind-size) * -1);
	border-radius: 50%;
	background: var(--sr-menu-ind);
	opacity: 0;
	transition: opacity .2s;
}
.sr-menu-indicator-dot .sr-menu > li > a:hover::after,
.sr-menu-indicator-dot .sr-menu > li.current-menu-item > a::after,
.sr-menu-indicator-dot .sr-menu > li.current_page_item > a::after { opacity: 1; }

/* Colchetes */
.sr-menu-indicator-bracket .sr-menu > li > a::before,
.sr-menu-indicator-bracket .sr-menu > li > a::after {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	color: var(--sr-menu-ind);
	opacity: 0;
	transition: opacity .2s, transform .2s;
	font-weight: 400;
}
.sr-menu-indicator-bracket .sr-menu > li > a::before { content: "["; left: -.55em; }
.sr-menu-indicator-bracket .sr-menu > li > a::after { content: "]"; right: -.55em; }
.sr-menu-indicator-bracket .sr-menu > li > a:hover::before,
.sr-menu-indicator-bracket .sr-menu > li > a:hover::after,
.sr-menu-indicator-bracket .sr-menu > li.current-menu-item > a::before,
.sr-menu-indicator-bracket .sr-menu > li.current-menu-item > a::after { opacity: 1; }

/* Submenus ---------------------------------------------------------- */

.sr-submenu {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	min-width: var(--sr-submenu-w);
	background: var(--sr-submenu-bg);
	border: 1px solid var(--sr-line);
	border-radius: var(--sr-submenu-radius);
	padding: 8px;
	margin: 0;
	list-style: none;
	box-shadow: 0 12px 34px rgba(var(--sr-ink-rgb), .12);
	opacity: 0;
	visibility: hidden;
	transition: opacity .18s, transform .18s, visibility .18s;
	z-index: 10;
}
.sr-submenu a {
	display: block;
	width: 100%;
	padding: .5em .7em;
	border-radius: calc(var(--sr-submenu-radius) - 4px);
	color: var(--sr-submenu-text);
	white-space: normal;
	text-transform: none;
}
.sr-submenu a:hover { background: rgba(var(--sr-accent-rgb), .1); color: var(--sr-accent); }
.sr-submenu a::after, .sr-submenu a::before { display: none !important; }

.sr-menu__item--parent:hover > .sr-submenu,
.sr-menu__item--parent:focus-within > .sr-submenu,
.sr-menu__item--parent.is-open > .sr-submenu { opacity: 1; visibility: visible; transform: none; }

.sr-submenu-anim-fade-up .sr-submenu { transform: translateY(8px); }
.sr-submenu-anim-instant .sr-submenu { transition: none; }

.sr-menu__toggle {
	display: none;
	border: 0;
	background: none;
	cursor: pointer;
	padding: 4px;
	color: var(--sr-menu-text);
}
.sr-chevron {
	display: inline-block;
	width: 7px; height: 7px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg) translate(-2px, -2px);
}

/* Ferramentas do cabeçalho ------------------------------------------ */

.sr-header__tools { margin-left: auto; display: flex; align-items: center; gap: 12px; flex: none; }

.sr-cta {
	display: none;
	font-family: var(--sr-font-ui);
	font-size: calc(var(--sr-menu-size) * .95);
	font-weight: 500;
	padding: .6em 1.3em;
	background: var(--sr-cta-bg);
	color: var(--sr-cta-text);
	border-radius: var(--sr-cta-radius);
	text-decoration: none;
	transition: opacity .18s;
}
.sr-cta:hover { opacity: .85; }
@media (min-width: 900px) { .sr-cta { display: inline-block; } }

.sr-burger {
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 40px; height: 40px;
	padding: 0 8px;
	border: 0;
	background: none;
	cursor: pointer;
}
@media (min-width: 900px) { .sr-burger { display: none; } }
.sr-burger span {
	display: block;
	height: 1.5px;
	background: var(--sr-menu-text);
	transition: transform .25s, opacity .2s;
}
.sr-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.sr-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.sr-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* Gaveta do celular -------------------------------------------------- */

.sr-drawer {
	position: fixed;
	inset: 0;
	background: var(--sr-bg);
	z-index: 99;
	padding: calc(var(--sr-menu-h) + 24px) 24px 40px;
	overflow-y: auto;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	transition: opacity .25s, transform .25s, visibility .25s;
}
.sr-drawer.is-open { opacity: 1; visibility: visible; transform: none; }
@media (min-width: 900px) { .sr-drawer { display: none; } }

.sr-drawer .sr-menu {
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	gap: 0;
}
.sr-drawer .sr-menu > li { border-bottom: 1px solid var(--sr-line); }
.sr-drawer .sr-menu a {
	font-size: calc(var(--sr-menu-size) * 1.25);
	padding: .85em 0;
	display: block;
	white-space: normal;
}
.sr-drawer .sr-menu a::before, .sr-drawer .sr-menu a::after { display: none; }
.sr-drawer .sr-submenu {
	position: static;
	opacity: 1;
	visibility: visible;
	transform: none;
	border: 0;
	box-shadow: none;
	background: none;
	padding: 0 0 .6em 1em;
	display: none;
}
.sr-drawer .sr-menu__item.is-open > .sr-submenu { display: block; }
.sr-drawer .sr-menu__item--parent { display: flex; flex-wrap: wrap; align-items: center; }
.sr-drawer .sr-menu__item--parent > a { flex: 1; }
.sr-drawer .sr-menu__toggle { display: inline-flex; padding: 10px; }
.sr-drawer .sr-menu__item.is-open .sr-chevron { transform: rotate(-135deg) translate(-2px, -2px); }
.sr-drawer .sr-submenu { flex-basis: 100%; }

/* Barra de progresso -------------------------------------------------- */

.sr-progress {
	position: fixed;
	top: 0; left: 0;
	height: 2px;
	width: 0;
	background: var(--sr-accent);
	z-index: 200;
	transition: width .1s linear;
}
.sr-single-progress-off .sr-progress { display: none; }
body.admin-bar .sr-progress { top: 32px; }

/* ==========================================================================
   3. Listagem de posts
   ========================================================================== */

.sr-listing-header {
	padding-block: calc(var(--sr-rhythm) * .9) calc(var(--sr-rhythm) * .5);
	max-width: 46ch;
}
.sr-blog-header-align-center .sr-listing-header { max-width: 52ch; margin-inline: auto; text-align: center; }

.sr-listing-header__title {
	/* O controle manda no desktop; no celular o vw impede o título de estourar. */
	font-size: min(var(--sr-blog-title-size), 12vw);
	margin: 0 0 .25em;
	letter-spacing: -0.025em;
}
.sr-listing-header__subtitle {
	margin: 0;
	color: var(--sr-muted);
	font-size: 1.02em;
	line-height: 1.5;
}

/* Filtro de categorias */
.sr-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	padding-bottom: 22px;
	margin-bottom: calc(var(--sr-rhythm) * .5);
	border-bottom: 1px solid var(--sr-line);
	font-family: var(--sr-font-ui);
	font-size: .8em;
}
.sr-blog-header-align-center .sr-filter { justify-content: center; }
.sr-filter__item {
	color: var(--sr-muted);
	text-decoration: none;
	padding-bottom: 2px;
	border-bottom: 1px solid transparent;
	transition: color .18s, border-color .18s;
}
.sr-filter__item:hover { color: var(--sr-ink); }
.sr-filter__item.is-current { color: var(--sr-ink); border-bottom-color: var(--sr-accent); }

/* Grade -------------------------------------------------------------- */

.sr-cards {
	display: grid;
	gap: var(--sr-blog-gap);
	padding-bottom: var(--sr-rhythm);
}

.sr-blog-layout-grid-2 .sr-cards { grid-template-columns: repeat(2, 1fr); }
.sr-blog-layout-grid-3 .sr-cards { grid-template-columns: repeat(3, 1fr); }
.sr-blog-layout-editorial .sr-cards { grid-template-columns: repeat(2, 1fr); }
.sr-blog-layout-editorial .sr-card--lead { grid-column: 1 / -1; }

@media (max-width: 900px) {
	.sr-blog-layout-grid-3 .sr-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
	.sr-cards { grid-template-columns: 1fr !important; }
}

/* Cartão ------------------------------------------------------------- */

.sr-card {
	display: flex;
	flex-direction: column;
	position: relative;
	padding: var(--sr-card-pad);
	border: var(--sr-card-border) solid var(--sr-card-border-color);
	border-radius: var(--sr-card-radius);
	transition: transform .25s, box-shadow .25s, background-color .25s;
}

.sr-card-fill-on .sr-card { background: var(--sr-card-bg); }

.sr-card-shadow-soft .sr-card { box-shadow: 0 1px 12px rgba(var(--sr-ink-rgb), .06); }
.sr-card-shadow-lifted .sr-card { box-shadow: 0 10px 30px rgba(var(--sr-ink-rgb), .1); }

/* Fio separador entre posts, só nos formatos em coluna única. */
.sr-blog-divider-on.sr-blog-layout-list .sr-card + .sr-card,
.sr-blog-divider-on.sr-blog-layout-stack .sr-card + .sr-card {
	border-top: 1px solid var(--sr-line);
	padding-top: var(--sr-blog-gap);
}
.sr-blog-divider-on.sr-blog-layout-list .sr-cards,
.sr-blog-divider-on.sr-blog-layout-stack .sr-cards { gap: var(--sr-blog-gap); }

.sr-card__media {
	display: block;
	margin-bottom: 1.1em;
	border-radius: var(--sr-card-img-radius);
	overflow: hidden;
	background: var(--sr-soft);
}
.sr-card__media img {
	width: 100%;
	aspect-ratio: var(--sr-card-ratio);
	object-fit: cover;
	transition: transform .5s cubic-bezier(.2,.6,.2,1), filter .3s;
}

.sr-card-image-off .sr-card__media { display: none; }

/* Tratamento da imagem */
.sr-card-image-filter-warm .sr-card__media img { filter: sepia(.22) saturate(1.12); }
.sr-card-image-filter-mono .sr-card__media img { filter: grayscale(1) contrast(1.05); }
.sr-card-image-filter-duotone .sr-card__media { background: var(--sr-accent); }
.sr-card-image-filter-duotone .sr-card__media img { filter: grayscale(1) contrast(1.1); mix-blend-mode: luminosity; opacity: .88; }

.sr-card__title {
	font-size: var(--sr-card-title-size);
	margin: 0 0 .4em;
	line-height: 1.22;
}
.sr-card__title a { text-decoration: none; background-image: linear-gradient(var(--sr-accent), var(--sr-accent)); background-size: 0% 1px; background-repeat: no-repeat; background-position: 0 100%; transition: background-size .3s ease; padding-bottom: 2px; }

.sr-card__excerpt { color: var(--sr-muted); font-size: .92em; margin: 0 0 .9em; }
.sr-card__excerpt p { margin: 0; }

.sr-card__more {
	font-family: var(--sr-font-ui);
	font-size: .78em;
	font-weight: 500;
	color: var(--sr-accent);
	text-decoration: none;
	margin-top: .4em;
	border-bottom: 1px solid currentColor;
	align-self: flex-start;
}

.sr-card__foot { margin-top: auto; padding-top: .6em; }

/* Efeitos ao passar o mouse */
.sr-card-hover-rule .sr-card:hover .sr-card__title a { background-size: 100% 1px; }
.sr-card-hover-lift .sr-card:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(var(--sr-ink-rgb), .12); }
.sr-card-hover-zoom .sr-card:hover .sr-card__media img { transform: scale(1.045); }
.sr-card-hover-tint .sr-card:hover { background: rgba(var(--sr-accent-rgb), .07); }

/* Destaque editorial */
.sr-blog-layout-editorial .sr-card--lead { --sr-card-title-size: calc(var(--sr-blog-title-size) * .62); }
@media (min-width: 800px) {
	.sr-blog-layout-editorial .sr-card--lead {
		display: grid;
		grid-template-columns: 1.15fr 1fr;
		gap: 36px;
		align-items: center;
		padding-bottom: var(--sr-blog-gap);
		border-bottom: 1px solid var(--sr-line);
	}
	.sr-blog-layout-editorial .sr-card--lead .sr-card__media { margin-bottom: 0; }
	.sr-blog-layout-editorial .sr-card--lead .sr-card__media img { aspect-ratio: 4/3; }
	.sr-blog-layout-editorial .sr-card--lead .sr-card__excerpt { font-size: 1.02em; }
}

/* Lista com imagem lateral */
@media (min-width: 700px) {
	.sr-blog-layout-list .sr-card {
		display: grid;
		grid-template-columns: 280px 1fr;
		gap: 28px;
		align-items: start;
	}
	.sr-blog-layout-list .sr-card__media { margin-bottom: 0; }
	.sr-blog-layout-list .sr-card__media img { aspect-ratio: 4/3; }
}

/* Lista só de texto */
.sr-blog-layout-stack .sr-card__media { display: none; }
.sr-blog-layout-stack .sr-cards { max-width: 64ch; }

/* Visibilidade dos elementos do cartão, ligada aos interruptores. */
.sr-show-category-off .sr-eyebrow,
.sr-show-date-off .sr-meta__date,
.sr-show-author-off .sr-meta__author,
.sr-show-readtime-off .sr-meta__readtime,
.sr-show-excerpt-off .sr-card__excerpt,
.sr-show-more-off .sr-card__more { display: none; }

/* Paginação ---------------------------------------------------------- */

.sr-pagination,
.navigation.pagination {
	display: flex;
	justify-content: var(--sr-pag-justify);
	align-items: center;
	gap: 8px;
	padding-block: calc(var(--sr-rhythm) * .5) var(--sr-rhythm);
	border-top: 1px solid var(--sr-line);
	font-family: var(--sr-font-ui);
	font-size: .85em;
}
.navigation.pagination .nav-links { display: flex; gap: 6px; align-items: center; }
.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.4em;
	height: 2.4em;
	padding: 0 .7em;
	border-radius: var(--sr-radius);
	text-decoration: none;
	color: var(--sr-muted);
	transition: background .18s, color .18s;
}
.page-numbers:hover { background: rgba(var(--sr-accent-rgb), .1); color: var(--sr-accent); }
.page-numbers.current { background: var(--sr-ink); color: var(--sr-bg); }
.sr-pagination--prevnext a { text-decoration: none; color: var(--sr-muted); border-bottom: 1px solid var(--sr-line); padding-bottom: 2px; }
.sr-pagination--prevnext a:hover { color: var(--sr-accent); border-color: var(--sr-accent); }

.sr-empty { padding-block: var(--sr-rhythm); max-width: 52ch; }

/* ==========================================================================
   4. Artigo
   ========================================================================== */

.sr-article-head { padding-block: calc(var(--sr-rhythm) * .8) 0; }
.sr-article-head__inner { max-width: var(--sr-measure); }
.sr-blog-header-align-center .sr-article-head__inner { margin-inline: auto; text-align: center; }

.sr-article-title {
	font-size: min(var(--sr-single-title-size), 11vw);
	letter-spacing: -0.025em;
	margin: 0 0 .4em;
}

.sr-article-head .sr-meta { margin-bottom: 1.6em; }

.sr-hero {
	margin-block: 0 calc(var(--sr-rhythm) * .6);
	border-radius: var(--sr-radius);
	overflow: hidden;
}
.sr-hero img { width: 100%; object-fit: cover; }

/* Abertura com imagem larga */
.sr-single-layout-wide .sr-hero {
	width: min(100% - 40px, calc(var(--sr-container) + 160px));
	margin-inline: auto;
	margin-bottom: calc(var(--sr-rhythm) * .6);
}
.sr-single-layout-wide .sr-hero img { aspect-ratio: 21/9; }

/* Título sobre a imagem */
.sr-single-layout-cover .sr-article-head {
	position: relative;
	padding: 0;
	min-height: 62vh;
	display: flex;
	align-items: flex-end;
	color: #fff;
	overflow: hidden;
}
.sr-single-layout-cover .sr-article-head .sr-hero {
	position: absolute;
	inset: 0;
	margin: 0;
	border-radius: 0;
	z-index: 0;
}
.sr-single-layout-cover .sr-article-head .sr-hero img { width: 100%; height: 100%; }
.sr-single-layout-cover .sr-article-head::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,.78) 0%, rgba(0,0,0,.25) 55%, rgba(0,0,0,.05) 100%);
	z-index: 1;
}
.sr-single-layout-cover .sr-article-head__inner { position: relative; z-index: 2; padding-block: 56px; }
.sr-single-layout-cover .sr-article-title,
.sr-single-layout-cover .sr-meta { color: #fff; }
.sr-single-layout-cover .sr-meta__item { border-color: rgba(255,255,255,.32); }

/* Só o título */
.sr-single-layout-plain .sr-hero { display: none; }

.sr-article {
	max-width: var(--sr-measure);
	padding-bottom: calc(var(--sr-rhythm) * .6);
}
.sr-article > * { margin-inline: auto; }

.sr-article h2 { margin-top: 1.7em; }
.sr-article h3 { margin-top: 1.5em; }
.sr-article img, .sr-article figure { border-radius: var(--sr-radius); }
.sr-article figure { margin: 2em 0; }
.sr-article figcaption {
	font-family: var(--sr-font-ui);
	font-size: .76em;
	color: var(--sr-muted);
	margin-top: .7em;
	text-align: center;
}
.sr-article a { color: var(--sr-accent); }

.sr-article .alignwide {
	width: min(100vw - 40px, calc(var(--sr-container) * .92));
	max-width: none;
	margin-left: 50%;
	transform: translateX(-50%);
}
.sr-article .alignfull {
	width: 100vw;
	max-width: none;
	margin-left: 50%;
	transform: translateX(-50%);
	border-radius: 0;
}

/* Capitular */
.sr-single-dropcap-on .sr-article > p:first-of-type::first-letter {
	float: left;
	font-size: 3.6em;
	line-height: .82;
	font-weight: var(--sr-title-weight);
	padding: .06em .12em 0 0;
	color: var(--sr-accent);
}

/* Rodapé do artigo */
.sr-article-foot { max-width: var(--sr-measure); padding-bottom: var(--sr-rhythm); }

.sr-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 2em; }
.sr-tags a {
	font-family: var(--sr-font-ui);
	font-size: .74em;
	padding: .34em .85em;
	border: 1px solid var(--sr-line);
	border-radius: 999px;
	text-decoration: none;
	color: var(--sr-muted);
}
.sr-tags a:hover { border-color: var(--sr-accent); color: var(--sr-accent); }

.sr-share { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-bottom: 2.4em; font-family: var(--sr-font-ui); font-size: .8em; }
.sr-share__label { color: var(--sr-muted); }
.sr-share__link { text-decoration: none; border-bottom: 1px solid var(--sr-line); padding-bottom: 1px; }
.sr-share__link:hover { color: var(--sr-accent); border-color: var(--sr-accent); }
.sr-single-share-off .sr-share { display: none; }

.sr-author {
	display: flex;
	gap: 18px;
	align-items: flex-start;
	padding: 26px;
	background: var(--sr-soft);
	border-radius: var(--sr-radius);
}
.sr-single-author-box-off .sr-author { display: none; }
.sr-author__avatar { border-radius: 50%; flex: none; }
.sr-author__name { font-weight: 600; margin: 0 0 .3em; }
.sr-author__bio { margin: 0; font-size: .88em; color: var(--sr-muted); line-height: 1.55; }

/* Navegação entre posts */
.sr-post-nav {
	display: grid;
	gap: 20px;
	padding-block: calc(var(--sr-rhythm) * .5);
	border-top: 1px solid var(--sr-line);
	border-bottom: 1px solid var(--sr-line);
	font-family: var(--sr-font-ui);
}
@media (min-width: 700px) { .sr-post-nav { grid-template-columns: 1fr 1fr; } }
.sr-post-nav__label { display: block; font-size: .72em; color: var(--sr-muted); margin-bottom: .35em; }
.sr-post-nav__title { font-family: var(--sr-font-reading); font-size: 1.02em; text-decoration: none; line-height: 1.3; display: block; }
.sr-post-nav__title:hover { color: var(--sr-accent); }
.sr-post-nav__next { text-align: right; }

/* Relacionados */
.sr-related { padding-block: var(--sr-rhythm); }
.sr-related__title { font-size: 1.3em; margin-bottom: 1.2em; }
.sr-related__grid { display: grid; gap: 28px; grid-template-columns: repeat(3, 1fr); }
@media (max-width: 760px) { .sr-related__grid { grid-template-columns: 1fr; } }
.sr-related__media { display: block; border-radius: var(--sr-radius); overflow: hidden; margin-bottom: .8em; }
.sr-related__media img { aspect-ratio: 3/2; object-fit: cover; width: 100%; }
.sr-related__heading { font-size: 1.02em; margin: 0 0 .35em; line-height: 1.28; }
.sr-related__heading a { text-decoration: none; }
.sr-related__heading a:hover { color: var(--sr-accent); }

/* ==========================================================================
   5. Comentários
   ========================================================================== */

.sr-comments { max-width: var(--sr-measure); padding-bottom: var(--sr-rhythm); }
.sr-comments__title { font-size: 1.25em; margin-bottom: 1.2em; }
.comment-list { list-style: none; margin: 0 0 2.4em; padding: 0; }
.comment-list ol.children { list-style: none; padding-left: 28px; }
.comment-body { padding: 20px 0; border-bottom: 1px solid var(--sr-line); }
.comment-author { display: flex; align-items: center; gap: 10px; font-family: var(--sr-font-ui); font-size: .84em; }
.comment-author img { border-radius: 50%; }
.comment-metadata { font-family: var(--sr-font-ui); font-size: .72em; color: var(--sr-muted); margin: .3em 0 .8em; }
.comment-metadata a { text-decoration: none; }
.reply a { font-family: var(--sr-font-ui); font-size: .76em; color: var(--sr-accent); text-decoration: none; }
.comment-form label { display: block; font-family: var(--sr-font-ui); font-size: .8em; margin-bottom: .35em; }
.comment-form p { margin-bottom: 1em; }
.comment-notes, .comment-form-cookies-consent label { font-size: .8em; color: var(--sr-muted); }

/* ==========================================================================
   6. Barra lateral e widgets
   ========================================================================== */

.sr-layout { display: grid; gap: 56px; }
.sr-layout.has-sidebar { grid-template-columns: 1fr; }
@media (min-width: 1000px) {
	.sr-layout.has-sidebar { grid-template-columns: 1fr 280px; }
}

.sr-sidebar { font-size: .94em; }
.sr-widget { margin-bottom: 2.4em; }
.sr-widget__title {
	font-family: var(--sr-font-ui);
	font-size: .78em;
	font-weight: 600;
	color: var(--sr-muted);
	margin-bottom: .9em;
	padding-bottom: .5em;
	border-bottom: 1px solid var(--sr-line);
}
.sr-widget ul { list-style: none; margin: 0; padding: 0; }
.sr-widget li { padding: .35em 0; }
.sr-widget a { text-decoration: none; }
.sr-widget a:hover { color: var(--sr-accent); }

/* ==========================================================================
   7. Rodapé
   ========================================================================== */

.sr-footer {
	background: var(--sr-footer-bg);
	color: var(--sr-footer-text);
	padding-block: var(--sr-rhythm);
	margin-top: auto;
}
.sr-footer a { color: inherit; text-decoration: none; }
.sr-footer a:hover { color: var(--sr-accent); }

.sr-footer__widgets {
	display: grid;
	gap: 40px;
	grid-template-columns: repeat(var(--sr-footer-cols), 1fr);
	padding-bottom: 40px;
}
@media (max-width: 860px) { .sr-footer__widgets { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .sr-footer__widgets { grid-template-columns: 1fr; } }

.sr-footer .sr-widget__title { color: inherit; opacity: .6; border-color: rgba(255,255,255,.14); }

.sr-footer__base {
	display: flex;
	flex-wrap: wrap;
	gap: 16px 32px;
	align-items: center;
	justify-content: space-between;
	padding-top: 28px;
	border-top: 1px solid rgba(255,255,255,.14);
	font-family: var(--sr-font-ui);
	font-size: .78em;
	opacity: .85;
}
.sr-footer__menu { display: flex; flex-wrap: wrap; gap: 20px; list-style: none; margin: 0; padding: 0; }

.sr-page-wrap { display: flex; flex-direction: column; min-height: 100vh; }

/* ==========================================================================
   8. Página 404 e busca
   ========================================================================== */

.sr-404 { padding-block: calc(var(--sr-rhythm) * 1.4); max-width: 52ch; }
.sr-404__code { font-size: 5em; line-height: 1; color: var(--sr-accent); margin: 0 0 .2em; }

.sr-searchform { display: flex; gap: 8px; max-width: 420px; }
.sr-searchform input[type="search"] { flex: 1; }
