@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap");
@import url("sections/header.css");
@import url("sections/banner.css");
@import url("sections/programa.css");
@import url("sections/depoimentos.css");
@import url("sections/solucao.css");
@import url("sections/quebrar-crencas.css");
@import url("sections/sobre.css");
@import url("sections/cta.css");
@import url("sections/footer.css");
@import url("sections/quiz.css");
@import url("sections/faq.css");
@import url("sections/como-funciona.css");

/* ===== VARIÁVEIS GLOBAIS ===== */
:root {
  /* Cores principais */
  --dourado: #527a8a;
  --dourado-claro: #7a9ba8;
  --dourado-muito-claro: #a8bcc4;
  --dourado-escuro: #3d5a66;
  --dourado-hover: #4a6b77;
  --cinza-claro: #f8f8f8;
  --cinza: #e6e6e6;
  --branco: #ffffff;
  --branco-dourado: #f0f4f6;
  --branco-dourado-claro: #f5f8fa;
  --preto: #222222;

  /* Sombras */
  --sombra-leve: 0 2px 10px rgba(212, 175, 55, 0.06);
  --sombra-media: 0 4px 16px rgba(212, 175, 55, 0.08);
  --sombra-forte: 0 8px 24px rgba(212, 175, 55, 0.12);

  /* Gradientes */
  --gradiente-dourado: linear-gradient(90deg,
      var(--dourado) 60%,
      var(--dourado-escuro));
  --gradiente-inverso: linear-gradient(90deg,
      var(--dourado-escuro) 60%,
      var(--dourado));
  --gradiente-branco-dourado: linear-gradient(135deg,
      var(--branco) 0%,
      var(--branco-dourado) 100%);

  /* Espaçamentos */
  --espacamento-xs: 8px;
  --espacamento-s: 16px;
  --espacamento-m: 24px;
  --espacamento-l: 32px;
  --espacamento-xl: 48px;

  /* Bordas */
  --borda-s: 8px;
  --borda-m: 16px;
  --borda-l: 24px;
  --borda-xl: 32px;

  /* Transições */
  --transicao: 0.3s ease;
}

/* ===== RESET E ESTILOS BASE ===== */
html {
  font-size: 16px;
  box-sizing: border-box;
  scroll-behavior: smooth;
}

*,
*:before,
*:after {
  box-sizing: inherit;
  margin: 0;
  padding: 0;
}

body {
  font-family: "Montserrat", Arial, sans-serif;
  line-height: 1.6;
  color: var(--dourado-escuro);
  background: var(--branco);
  min-height: 100vh;
  overflow-x: hidden;
}

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

h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.3;
  margin: 0;
}

p {
  margin: 0 0 var(--espacamento-s) 0;
}

a {
  color: var(--dourado);
  text-decoration: none;
  transition: color var(--transicao);
}

a:hover {
  color: var(--dourado-escuro);
}

/* ===== CLASSES DE UTILIDADE ===== */
.container {
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 var(--espacamento-s);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ===== SEÇÕES ===== */
.section {
  padding: var(--espacamento-xl) 0;
  position: relative;
}

/* ===== ANCORAS E SEÇÕES ===== */
#inicio {
  scroll-margin-top: 70px;
}

#problema {
  scroll-margin-top: 70px;
}

#quiz {
  scroll-margin-top: 70px;
  position: relative;
}

#quiz::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url("../img/pattern-dots.svg");
  background-repeat: repeat;
  opacity: 0.05;
  z-index: 0;
}

#solucao {
  scroll-margin-top: 70px;
}

#beneficios {
  scroll-margin-top: 70px;
  position: relative;
}

#beneficios::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url("../img/pattern-circles.svg");
  background-repeat: repeat;
  opacity: 0.05;
  z-index: 0;
}

#faq {
  scroll-margin-top: 70px;
}

#como-funciona {
  scroll-margin-top: 70px;
}

#sobre {
  scroll-margin-top: 70px;
  background: var(--branco-dourado);
  padding: var(--espacamento-xl) 0;
}

#contato {
  scroll-margin-top: 70px;
}

/* ===== HEADER SCROLL ===== */
.header.scrolled {
  box-shadow: var(--sombra-media);
}

/* ===== ANIMAÇÕES ===== */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ===== CABEÇALHOS DE SEÇÃO ===== */
.section-header {
  text-align: center;
  margin-bottom: var(--espacamento-xl);
  position: relative;
  z-index: 1;
}

.titulo-secao {
  font-size: 1.8rem;
  font-weight: 800;
  color: var(--dourado-escuro);
  margin-bottom: var(--espacamento-s);
  letter-spacing: -0.01em;
}

/* .section-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: var(--espacamento-s) 0;
} */

.divider-dot {
  width: 6px;
  height: 6px;
  background-color: var(--dourado);
  border-radius: 50%;
}

.divider-line {
  width: 60px;
  height: 2px;
  background-color: var(--dourado-claro);
  margin: 0 var(--espacamento-xs);
}

.section-subtitle {
  font-size: 1.1rem;
  color: var(--dourado);
  font-weight: 500;
}

/* ===== BOTÕES ===== */


.btn-dourado:hover {
  background: var(--dourado-escuro);
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 6px 24px rgba(212, 175, 55, 0.2);
  color: var(--branco);
}

.btn-outline {
  display: inline-block;
  padding: var(--espacamento-xs) var(--espacamento-m);
  border: 2px solid var(--dourado);
  border-radius: var(--borda-s);
  color: var(--branco);
  font-weight: 600;
  text-decoration: none;
  transition: background-color var(--transicao), color var(--transicao);
  font-size: 0.95rem;
  background-color: var(--dourado);
}

.btn-outline:hover {
  background-color: var(--dourado-escuro);
  color: var(--branco);
}

/* ===== ÍCONES ===== */
.icone-dourado {
  color: var(--dourado) !important;
}

.icone-branco {
  color: var(--branco) !important;
}

.icone-dourado-escuro {
  color: var(--dourado-escuro) !important;
}

/* ===== TEXTO ===== */
.texto-dourado {
  color: var(--dourado) !important;
}

.texto-dourado-escuro {
  color: var(--dourado-escuro) !important;
}

.texto-branco {
  color: var(--branco) !important;
}

/* ===== ANIMAÇÃO DE PULSO ===== */
@keyframes pulse {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.05);
  }

  100% {
    transform: scale(1);
  }
}

.pulse-animation {
  animation: pulse 2s infinite;
}

/* ===== RESPONSIVIDADE ===== */
@media (min-width: 768px) {
  .container {
    padding: 0 var(--espacamento-m);
  }

  .section {
    padding: var(--espacamento-xl) 0;
  }

  .titulo-secao {
    font-size: 2.2rem;
  }
}

@media (max-width: 768px) {
  .titulo-secao {
    font-size: 1.5rem;
  }
}

@media (min-width: 992px) {
  .container {
    padding: 0 var(--espacamento-l);
  }
}