/**
 * Conexper Hub Theme - Compiled Base & Component Styles
 * Package: conexper-hub-theme
 * Version: 1.1.0
 */

/* ==========================================================================
   1. CSS Reset & Base Tokens
   ========================================================================== */
:root {
  --cx-conexper: #991B1E;
  --cx-conexper-dark: #781316;
  --cx-conexper-light: #C53030;
  --cx-conexper-surface: #570B0E;
  --cx-slate-950: #020617;
  --cx-slate-900: #0F172A;
  --cx-slate-800: #1E293B;
  --cx-slate-700: #334155;
  --cx-slate-400: #94A3B8;
  --cx-slate-300: #CBD5E1;
  --cx-zen: #059669;
  --cx-zen-light: #10B981;
  --cx-zen-dark: #047857;
  --cx-ninja: #EF4444;
  --cx-life: #2563EB;
  --cx-combaric-teal: #0284C7;
  --cx-combaric-pink: #EC4899;
}

html {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background-color: var(--cx-slate-950);
  color: #F8FAFC;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
  background-color: var(--cx-slate-950);
  color: #F8FAFC;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* ==========================================================================
   2. Micro-Animações & Efeitos Visuais
   ========================================================================== */
.glass-nav {
  background: rgba(15, 23, 42, 0.88);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.hero-grid-pattern {
  background-image: radial-gradient(rgba(153, 27, 30, 0.15) 1px, transparent 1px), radial-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px);
  background-size: 32px 32px;
  background-position: 0 0, 16px 16px;
}

.badge-pulse {
  animation: pulse-border 2.5s infinite;
}

@keyframes pulse-border {
  0%, 100% { box-shadow: 0 0 0 0 rgba(153, 27, 30, 0.4); }
  50% { box-shadow: 0 0 0 8px rgba(153, 27, 30, 0); }
}

.badge-pulse-zen {
  animation: pulse-zen 2.5s infinite;
}

@keyframes pulse-zen {
  0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); }
  50% { box-shadow: 0 0 0 8px rgba(16, 185, 129, 0); }
}

/* Sliders de formulário e simulador */
input[type=range] {
  accent-color: #10B981;
}

/* Scrollbar customizada moderna */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #0F172A;
}

::-webkit-scrollbar-thumb {
  background: #334155;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #991B1E;
}

/* Seleção de texto com as cores da marca */
::selection {
  background-color: #991B1E;
  color: #FFFFFF;
}