.spark-blog-lista,
.spark-blog-artigo {
  width: 100%;
  display: flex;
  justify-content: center;
}

.spark-blog-container,
.spark-blog-artigo-container {
  width: min(100% - 7%, 1060px);
}

.spark-blog-topo,
.spark-blog-artigo-topo {
  margin: 0 auto 46px auto;
  max-width: 860px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: 1em;
}

.spark-blog-selo {
  padding: 8px 14px;
  width: fit-content;
  display: inline-flex;
  border-radius: 999px;
  font-size: 16px;
  font-weight: var(--fonte-peso-bold);
  color: var(--cor-texto-branco);
  background: var(--cor-spark-principal);
}

.spark-blog-topo h1,
.spark-blog-artigo-topo h1 {
  font-size: var(--fonte-tamanho-h1);
  font-weight: var(--fonte-peso-bold);
  line-height: 1.05;
  color: var(--cor-texto-preto);
}

.spark-blog-topo p,
.spark-blog-artigo-topo p {
  max-width: 760px;
  font-size: var(--fonte-tamanho-p);
  line-height: 1.55;
  color: var(--cor-texto-preto);
}

.spark-blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 28px;
}

.spark-blog-card {
  padding: 26px;
  min-height: 280px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 1.4em;
  border-radius: 22px;
  color: var(--cor-texto-preto);
  background: #ffffff;
  box-shadow: 0 14px 40px rgba(0, 0, 0, .10);
  transition: transform .36s ease, box-shadow .36s ease;
  will-change: transform, box-shadow;
}

.spark-blog-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .16);
}

.spark-blog-card-detalhes {
  width: 100%;
  height: fit-content;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  text-align: left;
  gap: 1em;
}

.spark-blog-card-categoria {
  padding: 8px 14px;
  width: fit-content;
  display: inline-flex;
  border-radius: 999px;
  font-size: 14px;
  font-weight: var(--fonte-peso-bold);
  color: var(--cor-texto-branco);
  background: var(--cor-spark-principal);
}

.spark-blog-card h2 {
  font-size: var(--fonte-tamanho-h2);
  font-weight: var(--fonte-peso-semibold);
  line-height: 1.15;
  color: var(--cor-texto-preto);
}

.spark-blog-card p {
  font-size: var(--fonte-tamanho-p);
  line-height: 1.55;
  color: var(--cor-texto-preto);
}

.spark-blog-card-meta {
  display: flex;
  flex-flow: row wrap;
  gap: 10px;
  font-size: 14px;
  opacity: .78;
}

.spark-blog-breadcrumb {
  margin-bottom: 34px;
  display: flex;
  flex-flow: row wrap;
  gap: 8px;
  font-size: 14px;
}

.spark-blog-breadcrumb a {
  color: var(--cor-spark-principal);
  font-weight: 700;
}

.spark-blog-meta {
  display: flex;
  flex-flow: row wrap;
  gap: 12px;
  font-size: 14px;
  font-weight: 700;
  color: var(--cor-spark-principal);
}

.spark-blog-artigo-corpo {
  margin: 0 auto;
  max-width: 860px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  text-align: left;
  gap: 1.15em;
}

.spark-blog-artigo-corpo h2 {
  margin-top: 30px;
  font-size: var(--fonte-tamanho-h2);
  font-weight: var(--fonte-peso-semibold);
  line-height: 1.15;
  color: var(--cor-texto-preto);
}

.spark-blog-artigo-corpo h3 {
  margin-top: 18px;
  font-size: var(--fonte-tamanho-h3);
  font-weight: var(--fonte-peso-medium);
  line-height: 1.2;
  color: var(--cor-texto-preto);
}

.spark-blog-artigo-corpo p,
.spark-blog-artigo-corpo li {
  font-size: var(--fonte-tamanho-p);
  line-height: 1.75;
  color: var(--cor-texto-preto);
}

.spark-blog-artigo-corpo ul,
.spark-blog-artigo-corpo ol {
  padding-left: 24px;
}

.spark-blog-produtos {
  margin: 70px auto 0 auto;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.spark-blog-produtos-topo {
  margin: 0 auto;
  max-width: 860px;
  display: flex;
  flex-direction: column;
  gap: .8em;
}

.spark-blog-produtos-topo h2 {
  font-size: var(--fonte-tamanho-h2);
  font-weight: var(--fonte-peso-semibold);
  color: var(--cor-texto-preto);
}

.spark-blog-produtos-topo p {
  text-align: left;
  font-size: var(--fonte-tamanho-p);
  line-height: 1.6;
  color: var(--cor-texto-preto);
}

.spark-blog-produtos-vazio {
  padding: 30px;
  border-radius: 18px;
  text-align: center;
  background: #ffffff;
}

.spark-blog-artigo-final {
  margin-top: 60px;
  display: flex;
  justify-content: center;
}

.spark-blog-artigo-final a {
  padding: 14px 22px;
  border-radius: 999px;
  font-weight: 800;
  color: var(--cor-texto-branco);
  background: var(--cor-spark-principal);
}

@media (max-width: 768px) {
  .spark-blog-container,
  .spark-blog-artigo-container {
    width: min(100% - 8%, 1060px);
  }

  .spark-blog-card {
    padding: 22px;
  }
}
