.diagnostic__hero {
  padding: var(--spacing-md);
  text-align: left;
}

.diagnostic__title {
  font-size: var(--font-size-4xl);
  margin-bottom: var(--spacing-sm);
  color: var(--color-moss);
  font-family: var(--font-family-primary);
}

.diagnostic__subtitle {
  font-size: var(--font-size-lg);
  line-height: 1.6;
  text-align: left;
  margin: 0 auto;
  max-width: 600px;
  color: var(--color-obsidian);
  font-family: var(--font-family-secondary);
  font-weight: var(--font-weight-medium);
}

/* Estilos para a seção de identificação */
.diagnostic__identification {
  padding: var(--spacing-md);
}

.diagnostic__identification-title {
  font-size: var(--font-size-3xl);
  text-align: left;
  margin-bottom: var(--spacing-sm);
  color: var(--color-moss);
  font-family: var(--font-family-primary);
}

.diagnostic__identification-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.diagnostic__identification-item {
  font-size: var(--font-size-base);
  line-height: 1.6;
  text-align: left;
  margin-bottom: var(--spacing-xs);
  color: var(--color-obsidian);
  font-family: var(--font-family-secondary);
}

.diagnostic__identification-text {
  font-size: var(--font-size-base);
  line-height: 1.6;
  text-align: left;
  margin-top: var(--spacing-sm);
  color: var(--color-obsidian);
  font-family: var(--font-family-secondary);
  font-weight: var(--font-weight-medium);
}

/* Estilos para a seção de solução */
.diagnostic__solution {
  padding: var(--spacing-md);
}

.diagnostic__solution-title {
  font-size: var(--font-size-3xl);
  text-align: left;
  margin-bottom: var(--spacing-sm);
  color: var(--color-moss);
  font-family: var(--font-family-primary);
}

.diagnostic__solution-text {
  font-size: var(--font-size-base);
  line-height: 1.6;
  text-align: left;
  margin-bottom: var(--spacing-xs);
  color: var(--color-obsidian);
  font-family: var(--font-family-secondary);
  font-weight: var(--font-weight-medium);
}

.diagnostic__solution-list {
  list-style: disc;
  padding-left: var(--spacing-md);
  margin: 0;
}

.diagnostic__solution-item {
  font-size: var(--font-size-base);
  line-height: 1.6;
  text-align: left;
  margin-bottom: var(--spacing-xs);
  color: var(--color-obsidian);
  font-family: var(--font-family-secondary);
}

.diagnostic__solution-subtitle {
  font-size: var(--font-size-xl);
  text-align: left;
  margin-top: var(--spacing-sm);
  margin-bottom: var(--spacing-xs);
  color: var(--color-moss);
  font-family: var(--font-family-primary);
}

.diagnostic__solution-steps {
  list-style: decimal;
  padding-left: var(--spacing-md);
  margin: 0;
}

.diagnostic__solution-step {
  font-size: var(--font-size-base);
  line-height: 1.6;
  text-align: left;
  margin-bottom: var(--spacing-sm);
  color: var(--color-obsidian);
  font-family: var(--font-family-secondary);
}

/* Estilos para a seção de planos */
.diagnostic__plans {
  padding: var(--spacing-md);
  text-align: left;
}

.diagnostic__plans-title {
  font-size: var(--font-size-3xl);
  text-align: left;
  margin-bottom: var(--spacing-sm);
  color: var(--color-moss);
  font-family: var(--font-family-primary);
}

.diagnostic__plans-attention {
  font-size: var(--font-size-base);
  line-height: 1.6;
  text-align: left;
  margin-bottom: var(--spacing-xs);
  color: var(--color-obsidian);
  font-family: var(--font-family-secondary);
  font-weight: var(--font-weight-medium);
}

.diagnostic__plans-availability {
  font-size: var(--font-size-base);
  line-height: 1.6;
  text-align: left;
  margin-bottom: var(--spacing-xs);
  color: var(--color-obsidian);
  font-family: var(--font-family-secondary);
  font-weight: var(--font-weight-medium);
}

.diagnostic__plans-price {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  text-align: center;
  margin-bottom: var(--spacing-sm);
  color: var(--color-obsidian);
  font-family: var(--font-family-secondary);
}

.diagnostic__cta-button {
  display: block;
  width: fit-content;
  margin: 0 auto; /* Centraliza o botão */
  padding: var(--spacing-sm) var(--spacing-md);
  background-color: var(--color-terracotta);
  color: var(--color-sand-light);
  text-decoration: none;
  border-radius: var(--border-radius-md);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  transition: background-color var(--transition-fast);
  font-family: var(--font-family-secondary);
}

.diagnostic__cta-button:hover {
  background-color: var(--color-terracotta-dark);
}

/* Estilos para a seção de garantia */
.diagnostic__guarantee {
  padding: var(--spacing-md);
}

.diagnostic__guarantee-title {
  font-size: var(--font-size-3xl);
  text-align: left;
  margin-bottom: var(--spacing-sm);
  color: var(--color-moss);
  font-family: var(--font-family-primary);
}

.diagnostic__guarantee-text {
  font-size: var(--font-size-base);
  line-height: 1.6;
  text-align: left;
  color: var(--color-obsidian);
  font-family: var(--font-family-secondary);
  font-weight: var(--font-weight-medium);
}

/* Estilos para a seção do autor */
.diagnostic__author {
  padding: var(--spacing-md);
}

.diagnostic__author-title {
  font-size: var(--font-size-3xl);
  text-align: left;
  margin-bottom: var(--spacing-sm);
  color: var(--color-moss);
  font-family: var(--font-family-primary);
}

.diagnostic__author-content {
  display: flex;
  flex-direction: column; /* Alterado para column em telas menores */
  align-items: flex-start; /* Alinha os itens à esquerda */
}

.diagnostic__author-image {
  width: 200px;
  height: 200px;
  border-radius: var(--border-radius-full);
  object-fit: cover;
  margin-bottom: var(--spacing-sm); /* Adiciona margem abaixo da imagem em telas menores */
}

.diagnostic__author-text {
  font-size: var(--font-size-base);
  line-height: 1.6;
  text-align: left;
  margin-bottom: var(--spacing-xs);
  color: var(--color-obsidian);
  font-family: var(--font-family-secondary);
  font-weight: var(--font-weight-medium);
}

/* Estilos para a seção de FAQ (mantidos no arquivo faq.css) */

/* Media query para telas maiores (desktop) */
@media (min-width: 769px) {
  /* Hero Section - Layout de duas colunas */
  .diagnostic__hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: left;
  }

  .diagnostic__title {
    font-size: var(--font-size-5xl);
  }

  .diagnostic__subtitle {
    max-width: 800px;
  }

  /* Seção do autor - Alinhamento horizontal */
  .diagnostic__author-content {
    flex-direction: row; /* Restaura o layout de linha em telas maiores */
    align-items: center; /* Alinha verticalmente os itens */
  }

  .diagnostic__author-image {
    width: 150px;
    height: 150px;
    margin-right: var(--spacing-md);
    margin-bottom: 0; /* Remove a margem inferior em telas maiores */
  }
}
