/* Página do artigo (template single.php do tema Michel Dörr) */
.md-artigo {
	--md-leitura: 720px;
	display: block;
	background: #fff;
	color: var(--md-texto);
	font-family: var(--md-corpo);
}
.md-artigo__limite { max-width: calc(var(--md-leitura) + 360px + 48px); margin: 0 auto; padding: 0 24px; }
.md-artigo__topo { background: var(--md-grafite); color: #B9C3CE; padding: 64px 0 140px; }
.md-artigo__topo .md-artigo__limite { max-width: calc(var(--md-leitura) + 360px + 48px); }
.md-artigo__trilha { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; font-size: 14px; }
.md-artigo__trilha a { color: #B9C3CE; text-decoration: none; }
.md-artigo__trilha a:hover { color: #fff; }
.md-artigo__trilha span { opacity: .5; }
.md-artigo h1.md-artigo__titulo {
	margin: 0;
	max-width: 900px;
	color: #fff;
	font-family: var(--md-titulo);
	font-weight: 500;
	font-size: clamp(32px, 4.6vw, 52px);
	line-height: 1.1;
	letter-spacing: -.01em;
	text-transform: none;
}
.md-artigo p.md-artigo__resumo { margin: 20px 0 0; max-width: 760px; font-size: clamp(18px, 1.6vw, 20px); line-height: 1.55; color: #D2D9E0; }
.md-artigo__meta { display: flex; flex-wrap: wrap; gap: 6px 10px; margin: 26px 0 0; font-size: 14px; color: #8B96A2; }

.md-artigo__capa { max-width: calc(var(--md-leitura) + 360px + 48px); margin: -96px auto 0; padding: 0 24px; }
.md-artigo__capa img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 4px; box-shadow: 0 30px 60px -40px rgba(11, 15, 20, .55); }

.md-artigo__corpo {
	max-width: calc(var(--md-leitura) + 360px + 48px);
	margin: 0 auto;
	padding: 64px 24px 96px;
	display: grid;
	grid-template-columns: minmax(0, var(--md-leitura)) 280px;
	justify-content: space-between;
	gap: 64px;
}
.md-artigo__lado { grid-column: 2; grid-row: 1; }
.md-artigo__lado > * + * { margin-top: 28px; }
.md-artigo__texto { grid-column: 1; grid-row: 1; min-width: 0; }

.md-artigo__sumario { position: sticky; top: 108px; padding: 22px 0 0; border-top: 2px solid var(--md-azul-claro); }
.admin-bar .md-artigo__sumario { top: 140px; }
.md-artigo__sumario summary { cursor: pointer; list-style: none; margin: 0 0 12px; font-family: var(--md-titulo); font-size: 16px; font-weight: 500; color: var(--md-grafite); }
.md-artigo__sumario summary::-webkit-details-marker { display: none; }
.md-artigo__sumario ol { margin: 0; padding: 0; list-style: none; counter-reset: sumario; }
.md-artigo__sumario li { counter-increment: sumario; display: grid; grid-template-columns: 28px 1fr; padding: 9px 0; border-bottom: 1px solid #E3E8ED; font-size: 15px; line-height: 1.45; }
.md-artigo__sumario li::before { content: counter(sumario, decimal-leading-zero); color: var(--md-azul-claro); font-family: var(--md-titulo); font-size: 13px; padding-top: 2px; }
.md-artigo__sumario a { color: var(--md-texto); text-decoration: none; }
.md-artigo__sumario a:hover,
.md-artigo__sumario a.is-ativo { color: var(--md-azul); }

.md-artigo__compartilhar p { margin: 0 0 10px; font-family: var(--md-titulo); font-size: 14px; color: #5E6772; }
.md-artigo__compartilhar div { display: flex; gap: 8px; }
.md-artigo__compartilhar a,
.md-artigo button.md-artigo__copiar {
	position: relative;
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1px solid #D5DCE3;
	border-radius: 4px;
	background: #fff;
	color: var(--md-grafite);
	cursor: pointer;
	transition: border-color .2s ease, color .2s ease;
}
.md-artigo__compartilhar a:hover,
.md-artigo button.md-artigo__copiar:hover,
.md-artigo button.md-artigo__copiar:focus { border-color: var(--md-azul); color: var(--md-azul); background: #fff; }
.md-artigo__copiado { position: absolute; left: 50%; top: calc(100% + 6px); transform: translateX(-50%); white-space: nowrap; font-size: 12px; color: var(--md-azul); }

/* Tipografia de leitura */
.md-artigo__texto { font-size: 18px; line-height: 1.75; }
.md-artigo__texto > * { margin-top: 0; margin-bottom: 1.15em; }
.md-artigo .md-artigo__texto h2 {
	scroll-margin-top: 110px;
	margin: 2em 0 .6em;
	color: var(--md-grafite);
	font-family: var(--md-titulo);
	font-weight: 500;
	font-size: clamp(25px, 2.6vw, 30px);
	line-height: 1.25;
}
.md-artigo .md-artigo__texto > h2:first-child { margin-top: 0; }
.md-artigo .md-artigo__texto h3 { margin: 1.6em 0 .5em; color: var(--md-grafite); font-family: var(--md-titulo); font-weight: 500; font-size: 22px; line-height: 1.3; }
.md-artigo__texto a { color: var(--md-azul); text-decoration: underline; text-underline-offset: 3px; }
.md-artigo__texto ul,
.md-artigo__texto ol { padding-left: 1.2em; }
.md-artigo__texto li { margin-bottom: .55em; padding-left: .2em; }
.md-artigo__texto li::marker { color: var(--md-azul-claro); }
.md-artigo__texto strong { color: var(--md-grafite); font-weight: 600; }
.md-artigo__texto blockquote {
	margin: 2em 0;
	padding: 26px 30px;
	border: 0;
	border-left: 3px solid var(--md-azul-claro);
	background: #F2F5F8;
	color: var(--md-grafite);
	font-size: 20px;
	line-height: 1.55;
}
.md-artigo__texto blockquote p { margin: 0; }
.md-artigo__texto img { border-radius: 4px; }
.md-artigo__texto figure { margin: 2em 0; }
.md-artigo__texto figcaption { margin-top: 8px; font-size: 14px; color: #5E6772; }

.md-artigo__cta { margin: 56px 0 0; padding: 36px; background: var(--md-grafite); border-radius: 4px; color: #B9C3CE; }
.md-artigo__cta p { margin: 0 0 22px; font-size: 16px; line-height: 1.6; }
.md-artigo__cta .md-artigo__cta-titulo { margin: 0 0 8px; color: #fff; font-family: var(--md-titulo); font-weight: 500; font-size: 26px; line-height: 1.25; }
.md-artigo__cta-botoes { display: flex; flex-wrap: wrap; gap: 12px; }
.md-artigo .md-artigo__botao {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 50px;
	padding: 0 24px;
	border: 1px solid rgba(255, 255, 255, .4);
	border-radius: 4px;
	color: #fff;
	font-family: var(--md-titulo);
	font-weight: 500;
	font-size: 16px;
	text-decoration: none;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
.md-artigo .md-artigo__botao:hover { background: #fff; border-color: #fff; color: var(--md-grafite); }
.md-artigo .md-artigo__botao--cheio { background: #2B78C5; border-color: #2B78C5; }
.md-artigo .md-artigo__botao--cheio:hover { background: var(--md-azul); border-color: var(--md-azul); color: #fff; }

.md-artigo__assinatura { display: flex; align-items: center; gap: 18px; margin-top: 40px; padding-top: 28px; border-top: 1px solid #E3E8ED; }
.md-artigo__assinatura img { flex: none; border-radius: 8px; }
.md-artigo__assinatura p { margin: 0; font-size: 15px; line-height: 1.5; }
.md-artigo__assinatura .md-artigo__assinatura-nome { color: var(--md-grafite); font-family: var(--md-titulo); font-weight: 500; font-size: 17px; }

/* Leia também */
.md-artigo__mais { background: #E8EDF2; padding: 88px 0 96px; }
.md-artigo__mais-topo { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 36px; }
.md-artigo .md-artigo__mais h2 { margin: 0; color: var(--md-grafite); font-family: var(--md-titulo); font-weight: 500; font-size: clamp(28px, 3.2vw, 42px); line-height: 1.14; }
.md-artigo__mais-topo a { color: var(--md-grafite); font-family: var(--md-titulo); font-weight: 500; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.md-artigo__mais-topo a:hover { color: var(--md-azul); }
.md-artigo__grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.md-artigo__grade:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.md-artigo__cartao { display: flex; flex-direction: column; background: #fff; border-radius: 4px; overflow: hidden; transition: transform .25s ease, box-shadow .25s ease; }
.md-artigo__cartao:hover { transform: translateY(-4px); box-shadow: 0 18px 40px -24px rgba(11, 15, 20, .45); }
.md-artigo__cartao-foto img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.md-artigo__cartao-texto { display: flex; flex-direction: column; flex: 1; padding: 24px 26px 28px; }
.md-artigo__cartao time { font-size: 14px; color: #5E6772; }
.md-artigo .md-artigo__cartao h3 { margin: 8px 0 10px; font-family: var(--md-titulo); font-weight: 500; font-size: 21px; line-height: 1.3; }
.md-artigo .md-artigo__cartao h3 a { color: var(--md-grafite); text-decoration: none; }
.md-artigo .md-artigo__cartao h3 a:hover { color: var(--md-azul); }
.md-artigo__cartao p { margin: 0 0 18px; font-size: 15px; line-height: 1.55; }
.md-artigo .md-artigo__ler { margin-top: auto; color: var(--md-azul); font-family: var(--md-titulo); font-weight: 500; text-decoration: none; }
.md-artigo__ler::after { content: " \2192"; }

@media (max-width: 1100px) {
	.md-artigo__corpo { grid-template-columns: minmax(0, 1fr); gap: 36px; max-width: calc(var(--md-leitura) + 48px); }
	.md-artigo__lado { grid-column: 1; grid-row: 1; }
	.md-artigo__texto { grid-column: 1; grid-row: 2; }
	.md-artigo__sumario { position: static; padding: 18px 20px; border: 1px solid #D5DCE3; border-top: 2px solid var(--md-azul-claro); border-radius: 4px; }
	.md-artigo__sumario:not([open]) summary { margin: 0; }
	.md-artigo__sumario summary::after { content: "+"; float: right; color: var(--md-azul-claro); }
	.md-artigo__sumario[open] summary::after { content: "\2013"; }
	.md-artigo__compartilhar { display: flex; align-items: center; gap: 14px; }
	.md-artigo__compartilhar p { margin: 0; }
	.md-artigo__topo .md-artigo__limite { max-width: calc(var(--md-leitura) + 48px); }
	.md-artigo__capa { max-width: calc(var(--md-leitura) + 48px); }
	.md-artigo__grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
	.md-artigo__limite,
	.md-artigo__capa,
	.md-artigo__corpo { padding-left: 20px; padding-right: 20px; }
	.md-artigo__topo { padding: 44px 0 104px; }
	.md-artigo__capa { margin-top: -72px; }
	.md-artigo__corpo { padding-top: 36px; padding-bottom: 64px; }
	.md-artigo__texto { font-size: 17px; }
	.md-artigo__cta { padding: 28px 22px; }
	.md-artigo__cta-botoes .md-artigo__botao { width: 100%; }
	.md-artigo__mais { padding: 64px 0 72px; }
	.md-artigo__grade { grid-template-columns: minmax(0, 1fr); }
}

/* Lista numerada, título com link e referências (artigo de quilometragem, 09/10) */
.md-artigo__texto ol { padding-left: 1.4em; }
.md-artigo__texto ol li { margin-bottom: .55em; padding-left: .3em; }
.md-artigo__texto ol li::marker { color: var(--md-azul-claro); font-family: var(--md-titulo); font-weight: 500; }
.md-artigo .md-artigo__texto h2 a { color: inherit; text-decoration-color: var(--md-azul-claro); }
.md-artigo .md-artigo__texto h2 a:hover { color: var(--md-azul); }
.md-artigo__texto p.md-artigo__ref { font-size: 15px; line-height: 1.55; color: #4A5560; margin-bottom: .9em; }
.md-artigo__texto p.md-artigo__ref a { overflow-wrap: anywhere; word-break: break-word; font-size: 14px; }
.md-artigo__autor { color: #C7D0D9; }
