/* ============================================================
   CLIKTI — TEMA CLARO (cores do logo)
   Carregado DEPOIS de style.css e servicos.css.
   Para voltar ao tema escuro, basta remover este <link> do index.html.

   Marca:  azul-marinho #26214C  ·  roxo #7C529D
   ============================================================ */

:root {
  --primary:       #1b1738;   /* marinho mais escuro (gradientes)   */
  --primary-mid:   #26214c;   /* marinho do logo                     */
  --accent:        #7c529d;   /* roxo do logo                        */
  --accent-light:  #6a4589;   /* roxo um pouco mais escuro, p/ texto */

  --dark:          #faf8fd;   /* fundo das seções "claras"           */
  --dark-2:        #f3eff8;   /* fundo das seções alternadas         */
  --dark-3:        #ffffff;   /* fundo dos campos do formulário      */
  --surface:       #ffffff;   /* cards                               */
  --surface-2:     #ece6f4;
  --border:        rgba(38,33,76,0.12);

  --text:          #26214c;
  --text-muted:    #5c5676;

  --shadow:    0 10px 30px rgba(38,33,76,0.10);
  --shadow-lg: 0 20px 50px rgba(38,33,76,0.14);

  --tint:        rgba(124,82,157,0.10);  /* fundo lilás suave */
  --tint-strong: rgba(124,82,157,0.18);
}

/* ---------- Títulos: eram brancos, agora marinho ---------- */
.section-title,
.hero-title,
.sobre-card h3,
.servico-card h3,
.servico-grupo-titulo,
.servico-painel-header h3,
.diferencial-card h3,
.parceiro-info h3,
.contato-canal strong,
.autor-info strong {
  color: var(--primary-mid);
}

/* Cards com leve sombra para destacar do fundo claro */
.sobre-card,
.servico-card,
.diferencial-card,
.parceiro-card,
.contato-canal,
.contato-form-wrap {
  box-shadow: 0 2px 10px rgba(38,33,76,0.05);
}

/* ---------- Fundos lilás (antes violeta-azulado) ---------- */
.section-tag,
.hero-badge,
.servico-grupo-itens span {
  background: var(--tint);
  border-color: var(--tint-strong);
}
.diferencial-icon,
.parceiro-logo-placeholder,
.canal-icon {
  background: var(--tint);
  border-color: var(--tint-strong);
}
.diferencial-num { color: rgba(124,82,157,0.12); }

.servico-card:hover,
.parceiro-card:hover,
.contato-canal:hover { border-color: rgba(124,82,157,0.45); }

.servico-card.destaque {
  border-color: var(--accent);
  background: linear-gradient(135deg, #ffffff 55%, rgba(124,82,157,0.08));
}

/* ---------- Botões ---------- */
.btn-primary,
.nav-link.nav-cta,
.nav-link.nav-cta:hover {
  background: linear-gradient(135deg, var(--primary-mid), var(--accent));
  color: #fff;
  box-shadow: 0 4px 18px rgba(38,33,76,0.25);
}
.btn-primary:hover { box-shadow: 0 8px 26px rgba(38,33,76,0.32); }

.btn-outline {
  border-color: var(--accent);
  color: var(--accent-light);
}
.btn-outline:hover {
  background: var(--tint);
  border-color: var(--accent-light);
}

/* ---------- Navbar ---------- */
.nav-link:hover { color: var(--primary-mid); background: var(--tint); }

.navbar.scrolled {
  background: rgba(255,255,255,0.95);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 4px 20px rgba(38,33,76,0.08);
}
@media (max-width: 768px) {
  .nav-menu {
    background: rgba(255,255,255,0.98);
    box-shadow: 0 12px 24px rgba(38,33,76,0.10);
  }
}

/* ---------- Hero ---------- */
.hero {
  background:
    radial-gradient(ellipse 80% 60% at 50% -20%, rgba(124,82,157,0.22) 0%, transparent 70%),
    radial-gradient(ellipse 50% 40% at 90% 100%, rgba(38,33,76,0.06) 0%, transparent 70%),
    #ffffff;
}
.particle { background: var(--accent); opacity: 0.35; }

.hero-stats {
  background: #ffffff;
  border-color: var(--border);
  box-shadow: var(--shadow);
}
.stat-value,
.stat-plus { color: var(--accent); }

.scroll-indicator { border-color: rgba(124,82,157,0.5); }

/* ---------- Sobre ---------- */
.sobre-card-sub { color: var(--accent); }

/* ---------- Formulário ---------- */
.form-group input::placeholder,
.form-group textarea::placeholder { color: rgba(92,86,118,0.55); }

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: var(--accent);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(124,82,157,0.15);
}

#servico,
#servico option {
  background-color: #ffffff;
  color: var(--text);
}
#servico {
  border: 1px solid var(--border);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2326214c' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
}
#servico:focus { border-color: var(--accent); }
#servico option:first-child { color: var(--text-muted); }

.form-feedback.feedback-success { color: #15803d; background: rgba(34,197,94,0.10); }
.form-feedback.feedback-error   { color: #b91c1c; background: rgba(239,68,68,0.08); }

.consent-text { color: var(--text-muted); }
.consent-text a { color: var(--accent); }
.consent-text a:hover { color: var(--primary-mid); }
.consent-checkbox input[type="checkbox"] { accent-color: var(--accent); }

/* ---------- Modal de privacidade ---------- */
.modal-overlay { background: rgba(38,33,76,0.55); }
.modal-container,
.modal-header { background: #ffffff; }
.modal-header { border-bottom-color: var(--border); }
.modal-header h2 { color: var(--primary-mid); }
.modal-close { color: var(--text-muted); }
.modal-close:hover { color: var(--primary-mid); }
.modal-body h3 { color: var(--accent); }
.modal-body p { color: var(--text-muted); }
.modal-container::-webkit-scrollbar-thumb { background: var(--accent); }

/* ---------- Rodapé: marinho, para "fechar" a página ---------- */
.footer {
  background: var(--primary-mid);
  border-top: none;
}
.footer-brand p,
.footer-nav a,
.footer-contato p,
.footer-bottom p { color: rgba(255,255,255,0.72); }
.footer-nav h4,
.footer-contato h4 { color: #ffffff; }
.footer-nav a:hover { color: #ffffff; }
.footer-contato p i { color: #b393cf; }
.footer-bottom { border-top-color: rgba(255,255,255,0.12); }
.footer-bottom a { color: #c9addf; }
.footer-bottom a:hover { color: #ffffff; }

/* ---------- Botão voltar ao topo e scrollbar ---------- */
.back-to-top { background: #ffffff; box-shadow: var(--shadow); }
::-webkit-scrollbar-thumb { background: var(--accent); }