/* Marketing-only CSS — gradients e keyframes sem equivalente Tailwind */

@keyframes floaty {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}

.hero-gradient {
  background:
    radial-gradient(1100px 520px at 78% -8%, #EEF2FF 0%, rgba(238,242,255,0) 62%),
    radial-gradient(700px 420px at 6% 8%, #FFF4F6 0%, rgba(255,244,246,0) 60%);
}

.dark .hero-gradient {
  background:
    radial-gradient(1100px 520px at 78% -8%, rgba(99,102,241,.13) 0%, transparent 62%),
    radial-gradient(700px 420px at 6% 8%, rgba(236,72,153,.07) 0%, transparent 60%);
}

.phone-blob {
  position: absolute;
  width: 430px; height: 430px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(99,102,241,.22), rgba(99,102,241,0) 70%);
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  filter: blur(8px);
  pointer-events: none;
}

.animate-floaty {
  animation: floaty 5s ease-in-out infinite;
}

.animate-floaty-delay {
  animation: floaty 5s ease-in-out infinite;
  animation-delay: 1.4s;
}

.stats-band {
  background-color: var(--card);
  background-image: radial-gradient(680px 300px at 85% 0, rgba(99,102,241,.12), transparent 60%);
  border: 1px solid var(--border);
}

.dark .stats-band {
  background-color: #0A0A0F;
  background-image: radial-gradient(680px 300px at 85% 0, rgba(99,102,241,.28), transparent 60%);
  border: none;
}

.final-cta-section {
  background-color: var(--card);
  border: 1px solid var(--border);
  position: relative;
  overflow: hidden;
}

.dark .final-cta-section {
  background-color: #0A0A0F;
  border: none;
}

.final-cta-section::before {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(620px 320px at 50% -10%, rgba(99,102,241,.18), transparent 64%);
  pointer-events: none;
}

.dark .final-cta-section::before {
  background: radial-gradient(620px 320px at 50% -10%, rgba(99,102,241,.4), transparent 64%);
}

.step-connector::after {
  content: "";
  position: absolute;
  top: 35px; left: 46px; right: -22px;
  height: 2px;
  background: linear-gradient(90deg, #C7D2FE, transparent);
}

.dark .step-connector::after {
  background: linear-gradient(90deg, rgba(99,102,241,.4), transparent);
}

header.nav-scrolled {
  border-bottom-color: #e8eaf0 !important;
  box-shadow: 0 1px 0 rgba(16,18,30,.02);
}

.dark header.nav-scrolled {
  border-bottom-color: rgba(255,255,255,.08) !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.18);
}

@media (prefers-reduced-motion: reduce) {
  .animate-floaty, .animate-floaty-delay { animation: none; }
}

@media (max-width: 560px) {
  .float-card-hide { display: none; }
}