/* ===================================
   UI/UX OVERRIDES — Leitura do Arco-Íris
   Versão 2.0 — Completo
   =================================== */

/* --- NAVEGAÇÃO --- */
nav {
  background: rgba(20, 10, 60, 0.90) !important;
}

/* --- TRANSIÇÃO SUAVE HERO → SEÇÕES --- */
.hero-bg::after {
  background: linear-gradient(
    to bottom,
    rgba(15,14,26,0.25) 0%,
    rgba(15,14,26,0.08) 35%,
    rgba(30,10,80,0.65) 80%,
    rgba(45,18,100,0.97) 100%
  ) !important;
}

/* --- RITMO VISUAL ENTRE SEÇÕES --- */
#sobre          { background: rgba(255,255,255,0.02) !important; }
#beneficios     { background: rgba(255,255,255,0.04) !important; }
#incluido       { background: rgba(201,168,76,0.04) !important; }
#sinais         { background: rgba(255,255,255,0.03) !important; }
#paraquem       { background: rgba(124,92,191,0.05) !important; }
#sobre-gabriela { background: rgba(255,255,255,0.02) !important; }
#precos         { background: rgba(124,92,191,0.06) !important; }
#faq            { background: rgba(255,255,255,0.03) !important; }
#cta-final      { background: transparent !important; }

/* --- DIVISÓRIAS SUAVES --- */
section {
  border-bottom: 1px solid rgba(255,255,255,0.05) !important;
}

/* ===================================
   TIPOGRAFIA — Melhorar legibilidade
   =================================== */

/* Descrições de seção: mais legíveis */
.section-desc {
  font-size: 1.1rem !important;
  color: rgba(245,243,255,0.78) !important;
  line-height: 1.9 !important;
}

/* Texto do parágrafo principal "Sobre" */
.sobre-grid p {
  font-size: 1.05rem !important;
  color: rgba(245,243,255,0.80) !important;
  line-height: 1.9 !important;
}

/* Descrições dos cards de benefícios */
.bene-desc {
  font-size: 0.9rem !important;
  color: rgba(245,243,255,0.72) !important;
  line-height: 1.65 !important;
}

/* Texto das sinal-cards */
.sinal-card p {
  font-size: 0.92rem !important;
  color: rgba(245,243,255,0.80) !important;
}

/* Texto FAQ aberto */
.faq-a {
  font-size: 0.95rem !important;
  color: rgba(245,243,255,0.78) !important;
  line-height: 1.85 !important;
}

/* Texto FAQ pergunta */
.faq-q {
  font-size: 1rem !important;
  color: rgba(245,243,255,0.92) !important;
}

/* Texto sobre Gabriela */
.gabriela-text p {
  font-size: 1rem !important;
  color: rgba(245,243,255,0.78) !important;
  line-height: 1.9 !important;
}

/* Lista de preços */
.price-list li {
  font-size: 0.92rem !important;
  color: rgba(245,243,255,0.85) !important;
}

/* Descrição do preço */
.price-desc {
  font-size: 0.92rem !important;
  color: rgba(245,243,255,0.70) !important;
}

/* Itens "Para quem é" */
.paraquem-item p {
  font-size: 0.98rem !important;
  color: rgba(245,243,255,0.85) !important;
}

/* ===================================
   CARDS — Contraste e visibilidade
   =================================== */

/* Cards de benefícios */
.bene-card {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(255,255,255,0.15) !important;
  backdrop-filter: blur(8px);
}
.bene-card:hover {
  background: rgba(255,255,255,0.13) !important;
  border-color: rgba(201,168,76,0.45) !important;
}

/* Check cards (itens incluídos) */
.check-card {
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid rgba(255,255,255,0.16) !important;
  backdrop-filter: blur(6px);
}
.check-card:hover {
  background: rgba(255,255,255,0.13) !important;
  border-color: rgba(124,92,191,0.45) !important;
}

/* Cards de sinais */
.sinal-card {
  background: rgba(255,255,255,0.07) !important;
  border: 2px solid rgba(201,168,76,0.25) !important;
  backdrop-filter: blur(6px);
}
.sinal-card:hover {
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(201,168,76,0.55) !important;
}

/* Cards "Para quem é" */
.paraquem-item {
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  backdrop-filter: blur(6px);
}
.paraquem-item:hover {
  background: rgba(255,255,255,0.11) !important;
  border-color: rgba(124,92,191,0.4) !important;
}

/* Cards de preço */
.price-card {
  background: rgba(255,255,255,0.10) !important;
  border: 1px solid rgba(255,255,255,0.20) !important;
  backdrop-filter: blur(10px);
}
.price-card:hover {
  background: rgba(255,255,255,0.14) !important;
  box-shadow: 0 24px 64px rgba(0,0,0,0.3) !important;
}
.price-card.featured {
  background: rgba(180,150,255,0.14) !important;
  border-color: rgba(180,150,255,0.40) !important;
  box-shadow: 0 8px 40px rgba(124,92,191,0.22) !important;
}

/* Caixa "Importante" dentro do price card */
.price-why {
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid rgba(255,255,255,0.13) !important;
  color: rgba(245,243,255,0.72) !important;
}
.price-why strong {
  color: rgba(245,243,255,0.88) !important;
}

/* FAQ items */
.faq-item {
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid rgba(255,255,255,0.13) !important;
  backdrop-filter: blur(6px);
}
.faq-item.open {
  background: rgba(255,255,255,0.11) !important;
  border-color: rgba(124,92,191,0.38) !important;
}

/* ===================================
   ELEMENTOS ESPECIAIS
   =================================== */

/* Caixa de citação */
.quote-box {
  background: rgba(201,168,76,0.07) !important;
  border-color: rgba(201,168,76,0.35) !important;
  backdrop-filter: blur(10px);
}

/* Mini citação dos sinais */
.sinais-mini-quote {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(255,255,255,0.20) !important;
  color: rgba(245,243,255,0.80) !important;
}

/* Banner de ativação */
.ativacao-banner {
  background: linear-gradient(135deg, rgba(124,92,191,0.20), rgba(232,160,191,0.14)) !important;
  border-color: rgba(232,160,191,0.35) !important;
}
.ativacao-banner p {
  color: rgba(245,243,255,0.78) !important;
}

/* Destaque "Sobre" */
.sobre-highlight {
  background: rgba(201,168,76,0.08) !important;
  border-left-color: var(--gold) !important;
  color: rgba(245,243,255,0.90) !important;
}

/* CTA final */
.cta-box {
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  backdrop-filter: blur(12px);
}
.cta-box p {
  color: rgba(245,243,255,0.78) !important;
}

/* --- RODAPÉ --- */
footer {
  background: #0e0830 !important;
  border-top: 1px solid rgba(255,255,255,0.08) !important;
}