:root {
  --brand: #0EA5E9;
  --bg: #0A0F1A;
  --fg: #FFFFFF;
  --secondary: #1F2937;
  --display-font: 'Space Grotesk', 'Inter', system-ui, sans-serif;
  --body-font: 'Inter', system-ui, sans-serif;
}

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html { scroll-behavior: smooth; }

body {
  font-family: var(--body-font);
  background: var(--bg);
  color: var(--fg);
}

.font-display {
  font-family: var(--display-font);
  letter-spacing: -0.02em;
}

#hero-canvas { pointer-events: none; }

::selection {
  background: var(--brand);
  color: var(--bg);
}

.bg-bg { background-color: var(--bg); }
.text-fg { color: var(--fg); }
.text-fg\/40 { color: color-mix(in srgb, var(--fg) 40%, transparent); }
.text-fg\/50 { color: color-mix(in srgb, var(--fg) 50%, transparent); }
.text-fg\/70 { color: color-mix(in srgb, var(--fg) 70%, transparent); }
.text-fg\/75 { color: color-mix(in srgb, var(--fg) 75%, transparent); }

/* Bordas/cards adaptam ao tema (light vs dark) */
body[data-theme="light"] [class*="border-white/"] { border-color: rgba(0,0,0,0.08) !important; }
body[data-theme="light"] [class*="bg-white/"] { background-color: rgba(0,0,0,0.025) !important; }

@keyframes fade-up {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

[data-bind] {
  animation: fade-up 0.8s ease-out backwards;
}

.service-card { animation: fade-up 0.8s ease-out backwards; }
.service-card:nth-child(1) { animation-delay: 0.1s; }
.service-card:nth-child(2) { animation-delay: 0.2s; }
.service-card:nth-child(3) { animation-delay: 0.3s; }
.service-card:nth-child(4) { animation-delay: 0.4s; }
.service-card:nth-child(5) { animation-delay: 0.5s; }
.service-card:nth-child(6) { animation-delay: 0.6s; }

/* Modulo cards */
.modulo-card {
  animation: fade-up 0.7s ease-out backwards;
  transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}
.modulo-card:hover {
  transform: translateY(-4px);
  border-color: var(--brand) !important;
  box-shadow: 0 0 20px color-mix(in srgb, var(--brand) 25%, transparent);
}
.modulo-card:nth-child(1) { animation-delay: 0.05s; }
.modulo-card:nth-child(2) { animation-delay: 0.10s; }
.modulo-card:nth-child(3) { animation-delay: 0.15s; }
.modulo-card:nth-child(4) { animation-delay: 0.20s; }
.modulo-card:nth-child(5) { animation-delay: 0.25s; }
.modulo-card:nth-child(6) { animation-delay: 0.30s; }

/* Depoimentos */
.depo-card {
  animation: fade-up 0.7s ease-out backwards;
  transition: transform 0.3s ease;
}
.depo-card:hover { transform: translateY(-3px); }

/* Glow button */
.btn-glow {
  box-shadow: 0 0 20px color-mix(in srgb, var(--brand) 45%, transparent),
              0 4px 20px rgba(0,0,0,0.4);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.btn-glow:hover {
  transform: scale(1.05);
  box-shadow: 0 0 35px color-mix(in srgb, var(--brand) 60%, transparent),
              0 8px 30px rgba(0,0,0,0.5);
}

/* Price card glow */
.price-card {
  box-shadow: 0 0 60px color-mix(in srgb, var(--brand) 20%, transparent),
              inset 0 1px 0 rgba(255,255,255,0.07);
}

/* FAQ accordion */
.faq-item summary {
  cursor: pointer;
  list-style: none;
  transition: color 0.2s ease;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item[open] summary { color: var(--brand); }
.faq-item[open] .faq-icon { transform: rotate(45deg); }
.faq-icon {
  transition: transform 0.3s ease;
  flex-shrink: 0;
}

/* Floating badge */
@keyframes float-badge {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-6px); }
}
.float-badge {
  animation: float-badge 3s ease-in-out infinite;
}

/* Tech grid background subtle */
.tech-grid-bg {
  background-image:
    linear-gradient(rgba(14,165,233,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(14,165,233,0.04) 1px, transparent 1px);
  background-size: 40px 40px;
}

/* Neon line accent */
.neon-line {
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--brand), transparent);
  opacity: 0.6;
}

/* Stat counter cards */
.stat-card {
  background: linear-gradient(135deg, rgba(14,165,233,0.08), rgba(31,41,55,0.5));
  border: 1px solid rgba(14,165,233,0.2);
  transition: border-color 0.3s, transform 0.3s;
}
.stat-card:hover {
  border-color: var(--brand);
  transform: translateY(-2px);
}

/* Highlight tag */
.highlight-tag {
  background: linear-gradient(90deg, var(--brand), #38bdf8);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
