/* Blog — usa as cores e a fonte definidas em estilo.css */

.cab { max-width: 44rem; margin: 0 auto; padding: 2rem 1.25rem 0; text-align: center; }
.cab-nome {
  display: inline-block;
  font: 700 clamp(1.5rem, 4vw, 2rem)/1.2 var(--square);
  text-transform: uppercase;
  color: var(--accent);
  text-decoration: none;
}
.cab .links { padding: 1rem 0 0; }
.links a[aria-current] { border-bottom-color: var(--accent); }

/* Lista de textos */
.blog-titulo {
  font: 700 clamp(2rem, 7vw, 3rem)/1.05 var(--square);
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 2rem;
}
.lista { list-style: none; margin: 0; padding: 0; }
.lista li { padding: 1.4rem 0; border-top: 1px solid var(--line); }
.lista li:last-child { border-bottom: 1px solid var(--line); }
.lista time, .data { color: var(--muted); font-size: .9rem; }
.lista h2 { font: 700 1.35rem/1.25 var(--square); text-transform: none; color: var(--ink); margin: .15rem 0 .4rem; }
.lista h2 a { color: var(--ink); text-decoration: none; }
.lista h2 a:hover { color: var(--accent); }
.lista p { margin: 0; color: var(--muted); }
.rss { margin-top: 2rem; font-size: .95rem; }

/* Página de um texto */
.voltar { display: inline-block; margin-bottom: 2rem; font: 700 1rem var(--square); text-decoration: none; }
.voltar:hover { text-decoration: underline; text-underline-offset: 3px; }
.post h1 {
  font: 700 clamp(1.75rem, 6vw, 2.5rem)/1.1 var(--square);
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 .5rem;
}
.post .data { display: block; margin-bottom: 2rem; }
.post h2 { font: 700 1.4rem/1.2 var(--square); text-transform: none; color: var(--ink); margin: 2.25rem 0 .75rem; }
.post h3 { font: 700 1.15rem/1.3 var(--square); margin: 1.75rem 0 .5rem; }
.post img { max-width: 100%; height: auto; }
.post blockquote { margin: 1.5rem 0; padding-left: 1rem; border-left: 3px solid var(--accent); color: var(--muted); }
.post ul, .post ol { padding-left: 1.4rem; margin: 0 0 1.1rem; }
.post code { font-family: ui-monospace, Consolas, monospace; font-size: .95em; background: #1a1a1a; padding: .1em .35em; }
.post pre { overflow-x: auto; background: #1a1a1a; padding: 1rem; }
.post pre code { background: none; padding: 0; }